Reflection of this semester

Reflection

DECO 7180 is a great course which gives me an impressive experience on design process and group work project, especially in how to dealing with people during team work project. I really enjoyed this course. It is useful to improve our design thinking in actual use and developed our skill to solving problems in practical project, especially in getting feedback from others and improve the designing. Furthermore, I have developed my technical skills in programming during the main project implement part.

I am responsible for all the back end programming include the setting the database, design the log in system and rank list, which means I need to use the php language to implement the log in system and rank list, I also need to Components working together and Modify CSS Code in last part of our project. I used to build the website and design the web page in front end in my bachelor course, but before me doing this project, I haven’t done any of this work before. I take all of these as a challenge to improve my implement skills, so that the group work can keep balance in working together, and I actually learn a lot in this part.

I have also learn a lot about different computer Technic in this course. For example using Photoshop to design the graphs, and using VPN to linking course admin for Modify our project out of camps.

In addition, this course is meaningful for my study not only in developing my Technic skills and design thinking, but also teach me how to find an effective way working with others. I expect to learn more in future studio courses.

week 13 Trade show

In our final trade show, we get the positive feedback on our main project. Cheers.

Our final project is showing below. You can test our website at http://deco1800-50.uqcloud.net/.

Technical Discussion & Components

Main components

Elements and roles: Setup database, Write All server side code, Write HTML Code (rank.php), Write CSS Code (style.css),

Facts:

Datbase has been fully setup and operational. Tables has been created and data have been inserted.

Server side codes has successfully implemented a login system, this contains user login information check, php session store and send cookies to client side and display login/logout button depends on user’s login information.

Server dies codes has successfully implemented a ranking system, this contains current user check, updating user’s highest score with database, retrieve highest score information and find a user’s overall position.

Front end html code rank.php has been written to support ranking system, this contains html codes and integrate style.css to rank.php.

Front end css code style.css has been written to support ranking system.

Components working together

Modify CSS Code (styles.css)

Others’ work, they defined classes in css file.

My work, I combined them together. I have received many css files and each of them is for a single page. To make it more standard, I have been modified all css files to make them unified.

Transform front end code to be back end compatible (All files ending with .php, most of javascript files)

Other’s work, they write html code and java scripts.

My work, I modify them to become back end compatible. I have received files ending with .html. To running it on php server, I have changed them to php and modify all links. Most of the page has been inserted php codes to support login system and to be php compatible.

Week 12 IMPLEMENTATION

IMPLEMENTATION

o    how does the system work(database )

Our back-end side which is running on server is powered by PHP. We choose php for its efficiency and also because it is supported by UQ. Our back end system mainly used to manage user login and highest score rank system. We have created a login system so user can login with their own credentials. After user played their game and get a score, a score will be posted to our server. Then server check if this user made a higher score than before. If it is the case, the server will update its score information by updating relative information in database. If it is not the case, server will just ignore it.

Name	Type
Id	Int(Primary)
Username	Char
Password	Char(MD5 Encrypted)
Highest score	Int

In this table, id is a self-incremental variable that is used to identify users. This has been set to int and used as a primary key. As it is a primary key, the value of id also should be unique. Username is the actual nickname of users, this is mainly used for display names on rank page. Password is the password that user can used to login to the system. For security reason, this database does not store the password itself directly, instead, an md5 encrypted value has been stored. When user try to login, it will see if the md5 from user’s input match what is stored in database. Highest score is used to store the score of user’s highest achievement. When display the rank on rank page, this is used for reference of rank position and it has been used to display at rank page too.

Our database is based on MySQL. In this database, there is only one table. The table information has been listed below.

o    What is fully functional

Login system is fully functional and our login page and redirect user back to where it come from after user logged in.

Our ranking system is fully functional. This system is not only show the first three highest score winner, but also displays user’s position. For example, user may not be able to get into first three positions and currently ranked at 5. Our ranking system will tell user he or is currently positioned at 5. This will encourage user to be more engage in this game.

Our database system have been setup and fully functional to support these systems.

Week 11 Digital Prototype testing

Because of the time rushing these weeks, the front end code and the back end code has not been components already. In order to get the last feedback from user before the trade show and final delivery,  we decided to test the front end website and the back end rank list with login system respective so that it would not influence our feedback collection.

Our feedback collection is showing below. 

week 10 The data base setting and login system setting

Fully functional

Login system is fully functional and our login page and redirect user back to where it come from after user logged in.

Our ranking system is fully functional. This system is not only show the first three highest score winner, but also displays user’s position. For example, user may not be able to get into first three positions and currently ranked at 5. Our ranking system will tell user he or is currently positioned at 5. This will encourage user to be more engage in this game.

Our database system have been setup and fully functional to support these systems.

Login details and Instructions

We have setup five user accounts. They accounts information has been listed below:

Username: user1 Password: password

Username: user2 Password: password

Username: user3 Password: password

Username: user4 Password: password

Username: user5 Password: password

For the database, as it is for assignment only and not designed to release to public, considering local connection is pretty safe for an assignment test environment. We currently using no password for database. If we are going to release it to public, we will setup a password for it. We already designed a configuration file called database.php (in user folder) to do this.

week 9 research on the Trove pictures

Second part is looking for the useful trove picture for out future design.
I am looking for some not dangerous snake and spiders with better picture supported from Trove.
I expect for the snake or spider with at least 4 clear picture can use, but unfortunately the picture of each kind of dangerous animals is seldom to find that I can only select more kind of specie instead.

The not dangerous snake include

Coastal carpet python  1

Common Tree Snake（Tree Snake）>1

Whip Snake >1

White-lipped Snake 1

Headed Snake 1

Olive Python 3

 Python 8

Common Copperhead 1

Water Python 1

Brown Tree Snake 2

The not dangerous spiders include

St Andrew's cross

Mullamullang Cave spider 1

Huntsman spider 4

Jumping spider 3

Wall spider 2

Sac spiders 1

Tube spider 3

House spider 2

Garden Spider 8

Bird-dropping spider 1

cross spider >n

Brown widow spider 3

week 8 Design the Prezi for Presentation

Prezi for Presentation has been designed this week, after collection the details from my group number, I use the Prezi to design it. For this Prezi design, in order to make the element looks more suitable for our web design, I change the prezi background as our own design. background.

Paper prototype feedback

After we testing the paper prototype this week, most of the feedback we get is positive but still have some part need to change. We collect three main part feedback to use in our future design.

1. change the level page as the home page, so that we need to delete one of return button in the level page.
2. According to the feedback we collect, most of the user think page 2 which is the login page is useless, and we decided to drop this page in future design. We will move the login button on the right top Conner in each page.
3. Show the help page before level 1 page, and this help page will help user easily get the game ruler before play game.

week 7 The first web page prototype design.

The first web page prototype design

The first web page prototype design has been finished this week and I response for writing HTML code based on our group design. It will used for our basic testing as lower prototype and  as first version of our website using HTML.

week 6 The feedback from Presentation

Our first design of the web page game

In our Our first design of the web page game include  Background story page, Login page, Main page,  Game tutorial page, Game tutorial page, Level selection page,  and Introduction page.

From the Presentation feedback, we found that the page turn need to be change, and some user think the login should not appear in the front, so we decided to make login and register system as a button on each of the web page.

Our Group decided to have four part change in future design.

1. set three rounds for each level based
2. add a remaining attempts that the user can easy get the rules of the game.
3. We will add a calculate to calculate user’s spending time for each round and add three seconds if they choose wrong.
4. Add ranking system is based on  spending time in each round, and  delete the star in basic design.

The register system  we are thinking to cut it off,  use the login system instead. I think that can save register time when user use it in future. In my own idea, the register is useless because our user group in children and most of them would not choose to register before they play a simple web page game.

Research on Intended audience representation and Rules setting

Research on Intended audience representation
About the Intended audience choosing, in order to make it more accuracy for design, our group decided to change the target user to be 7 to 12  year' old children. 
I have doing some research on on Intended audience, Why choosing education game, and The content style with pictures. Children have different interests compared to adults for computer games.The evaluation and research on children should be involved in processes of the game’s design.
It is useful for children to use the picture to learn something new, and comparing to the simple content of disturbing, the children prefer looking at the picture to learn.
For that reason, we found using the picture as the content let children learn about danger snake is more effective.
The references on this part is showing below.

Rules of game

Each round has a limited numbers of remaining attempts, which based on the numbers of pictures. With increasing numbers of pictures the number of remaining attempts will increase.

User has to choose correct picture within remaining attempt. If user chooses

 a wrong picture that the time will increase 3 seconds. On the other hand if user’s operation times over the limited steps, the game will be end.

week 5 The addition of the idea

The addition of the idea in future group work

After the discussion to explode the idea on our original one "Survive from dangers snake", we decided to change the game design and add more content in this game to improve the user experience. It will not be a simple webpage game, we would change it to a education game which design for children 7 to 12.

We will add more game level to make this game more fun. The game still be single player mission, but need a user name to save the game level, if it is possible, the future game result can be share on social media.

The added level will not be too difficult, but requires player to use more time to sharpen and remember the content from Tove.