2015年11月3日星期二

Week 13 -- Trade show / Course Reflection

Week 13 -- Trade show / Course Reflection

Trade Show:

We exhibited our final product at the Trade show and prepared a simple pitch to introduce our product. This is a new experience for me to prepare a trade show for our product that is developed the whole semester. Our group finished this product with many difficulties and we built it from the concept at first. And now it can be used on the computer. We exhibited our product with one most suitable computer and used others to play the background video, which can provide immersive feeling for users. We got many useful feedbacks as well. 














The Feedbacks:

1. Consistency style of our web application
We should keep the same style of our application, some buttons that were designed are not keep the same style with the whole style. Therefore, we should change a little bit in our final product.

2. Good reflection of the navigation bar
The reflection of the navigation bar was not good as expected in last user test. Some users clicked it, but no responding, they should try several times. We improved it and we got good reflection right now.

3. Timeline button can be trackable
Regarding on the last user test, some users pointed that the timeline buttons were not trackable so that they may confuse about they clicked or not. We improved it and the timeline button can be tracked for users and the reflection of it was as good as expected.

4. The functions are good implement as expected
All functions of our application can be implement as good as expected on the trade show, especially for the new functions that are not tested in last user test.

5. User interface are attractable
Most of users are attracted by the user interface of our application and thought it is really cool.  It is important for a product noticed by users.

6. Clear work flow and visual flow
The visual flow and work flow are clear for users. They are easy to find the information and know how to interact with our product.

7. Information page should add more information and pictures for users
For the information page, users pointed that we should add more pictures for them. We improved it in our final product.


The reflection of other groups:






Truth Detective:
1. The hints are useful, but some of hints are difficult connecting together.
2. The UI and background music are quit matching the game theme.
3. Some many words need to be read for users.

Course Reflection:
Regarding on the expectation of this course, i mentioned that i would like to progressive complete the whole product. Our group did it very well, we discussed every week and based on the schedule finished our work. Moreover, i am not good at programming, but i tried my best to study and successful build a frame.  The communication of our group was good as my expectation and we all finished work on time. Moreover, during the process of the whole project, our group met many problems and we faced and overcame together. Some issues we met we tried our best to solve or we would find a alternative way. I learned that the result is important, but the process is more important sometimes. I enjoyed the whole process in DECO7180 and we made our project one by one step.

2015年11月1日星期日

Week 12 - Improvements for our final product

Week 12 - Improvements for our final product

This week we continued to improve our product based on the feedbacks and prepared for the Trade Show. We combined all materials together and tested the unexpected errors for our prototype.

For the design and front-end part:

1. We removed the introduction paragraph on the front page and the container of the logo.















2. We redesigned the timeline button and made it trackable.







3. We improved the visual effect of the quiz page and added the correct answer for users














4. We fixed the response problem of navigation bar.
5. We improved the visual effect of all pages to make sure consistency.

For the back-end part:

1. We fixed some small errors and bugs.
2. We modified the data that is retrieved from Trove to control the length of the text.

For the Trade Show:

We prepared the brochures and old maps for the trade show. The brochures detailed introduce our web application for users and we would like to get some useful feedbacks to improve the final product.






2015年10月28日星期三

Week 11 - Experience with Digital Prototype and User Test

Week 11 - Experience with Digital Prototype and User Test

This week we ran a digital prototype test and collected feedbacks from users. Before the digital prototype test, we finished most functions of our application and improved user experience.

 Prepare for the Digital Prototype and User Test:
1. We finished the html of information page and optimized all pages.
2. We combined all codes together and made all pages consistency.
3. We designed questionnaires on the Google drive so that collecting the users feedback effectively.
4. We prepared the tasks for users and observation goals for ourselves:
   
     Tasks for users:
      a) Successful using timeline to search one shipwreck information
      b) Successful using photo gallery in the information page
      c) Using quiz function and get feedback
     Observation goals:
      a) How users interact with the front page (scroll up & down)
      b) How users handle with the navigation bar (horizontal & vertical) and hatch
      c) How users gain more information on the certain web page
      d) What is the feedback of the UI and the users reflection of our web application








































The Improvements of our prototype:
For design part:
1. We improved the logo and location marks to enhance the visual experience.






















2. We improved the timeline buttons to keep the style consistency.







3. We redesigned the information page to keep the visual flow consistency.





Function part:
1. We added the library function for users browsing all shipwrecks information on one page.

























2. We added the quiz function for some users to test their knowledge after browsing.





















3. We inserted the google map on the information page and it will show the location as well.



4. We added the about us page for users.




















5. We added the vertical navigation for users


























The feedback from users:
1. The logo on the front page looks like a button, do not need the container for the logo.
2. The response of the timeline buttons is not good enough.
3. The photo gallery does not have the close button for users.
4. The interaction of the "pop" information is not good enough for users.
5. There are some problems of the navigation when users click it.
6. If the users click the logo, they can enter the home page as well.
7. They need the correct answers for the quiz.
8. The background of the enlarge pictures should change to black so that it will keep the style consistency.
9. The timeline buttons can be improved traceable for users.
10. Vertical navigation is display on the left all the time.
11. The results of the quiz can be shared to the social media.


The future work:
1. We will fix the bugs of navigation bar and timeline buttons.
2. We will improve the design of some icons and buttons to enhance the user experience.
3. We will combine all codes together and make sure all functions can be implement.
4. We will add more pictures and information for the information page.




2015年10月24日星期六

Week 10 - Mid Break

Week 10 - Mid Break

This week is the mid break, our group continued to improve our project. I tried to help building a frame about our information page during this week.

Based on the mockups of our websites, I used HTML, CSS and JQery to build the frame of information page. 



































After built the frame of webpage, we would like to optimize the webpage to enhance the visual effects for users. 

Moreover, in this week, our group decided to add quiz function for users. We draw a wireframe first, we would like to keep the consistency style of our web application, therefore, we use dark background with white text font.



2015年9月26日星期六

Week 9 -- Presentation Progress Demonstration

Week 9 - Presentation Progress Demonstration

This week we presented what we have done in last weeks and got many useful feedbacks.We have finished some main functions for our web application and improved UI for users.

What we have done:
1. Firstly, we improved our front page to make it more clearly for users. We clearly introduce our web on the front page and added instructions  for users.




2. Secondly, we fixed some bugs for the back- end issues and achieved basic function of our project. The information from Trove can be retrieved when user search related information. Moreover, we loaded location data on the google map dynamically. 




3. Thirdly, we began to wrote the html for our information page. We collected useful information and pictures for that page.

The Feedback:
1. Do not need the introduction on the front page.
2. Please add a scroll bar for users to show they can scroll down on the front page.
3. We need to explain why people will use our website 
4. Our goals are too simple and we need to add more interactive functions to engage users. 
5. Some users pointed that the video on the front page may be compressed to reduce the loading time. 

The Future Work:
1. We will continue to finish the information page.
2. We will combine all code together.
3. We will improve our functional to enhance user experience.
4. We will improve our UI and some icons.




















2015年9月19日星期六

Week 8 -- Prepare Presentation for Progress Demonstration

Week 8 -- Prepare Presentation for Progress Demonstration

This week we continued to improve our project. Based on the feedback of paper prototype, we chosen some suitable ideas to improve our idea as well.

Firstly, for the design aspect, we decided a interaction plan to help our group to implement the whole project. Our web application is very simple and easy to use, and the logical of interaction is very clearly.



Secondly, for the front page, we nearly finished our front-end based on html, CSS and JQery. We have already built the basic function for the front-end.

Thirdly, based on our schedule, we continued to develop our back-end. We can load the location marker on Google map dynamically and connected the Trove API successfully.

Fourthly, we designed a success criteria to help us to do the user test.

Then we combined all materials together and prepared our presentation with Powerpoint. 

2015年9月11日星期五

Week 7 -- Paper Prototype

Week 7 -- Paper Prototype



This week we prepared paper prototype for our project -- Atlantis shipwrecks searcher website. We tested our prototype in the class and got many useful feedbacks. Our group prepared the tasks for users and observation goals for ourselves. We observed users workflow and users behavior with our prototype. Most users can find shipwreck information by themselves and thought our prototype was easy to interact. 



Tasks for user:
1. Using timeline to search shipwrecks information
2. Clearly know how to interact with the Google Maps
3. Successful gain detailed information.

Observation Goals:
1. How users handle with the navigation bar and hatch
2. How users get the accurate information on the target page.

3. How users feel about the UI and interactive plan.

Feedbacks:

1. Some students pointed that the front page should have an information button to help users to understand our web.
2. The button of timeline is a little bit confusing, some users thought that the timeline can be used to search for a specific year. 
3. Most of users were suggesting that we could add a function to share information to the social platform, such as Facebook.
4. One suggest was that we could add different languages for users.
5. For the front page, users suggested that it could be loaded automatically instead of clicking button.