1、Interaction DesignLiu Huan+PORTFOLIOLiu H(+86) 139-2740-0863CONTENTSInteraction DesignOther Design001 Bacteria War 002 Green Light Area003 Hear Me 004 Click a Meal005 Gallery Web Design006 Character Design007 Furniture DesignBacteria WarA procrastination monitor for university students.Time July 201
2、4Type Individual Project01Bacteria War was a three months graduation project which aimed to reduce university students procrastination behavior in school assignments.Why did I choose procrastination as my capstone topic? I firstly interested in this topic by my own procrastination experience. After
3、finding some data online and asking my friends about it, I realized that this was a common problem around us. I wondered if I could find a design solution to change peoples bad behavior, and help them live better lives. 1. Recognition and pressure from others could reduce procrastination.2. They ten
4、d to estimate how far they can stretch before they start to procrastinate.3. The actual time they spent on the task was beyond what they estimated.Research FindingsInterview scriptsObservation + TestTo understand more about procrastinators, I interviewed 4 university students and documented 8376 wor
5、ds scripts.Observation and test helped me figure out how they would act when they know each others procrastination status.Research : Interview + ObservationThe growing of bacteria strain (Metaphor)Awareness about timeRecognition from othersCould I use procrastinators awareness about time and recogni
6、tion from others to help them get rid of procrastination behavior?Viewing classmates procrastination statusI used Flinto to test the wireframe prototype on the screen for the usability. 3 college students were involved.Wireframe prototypeThe first prototype and test used card sorting to understand t
7、he users need about different functions.2 college students were involved.Card prototypeEmilys ScreenAlexs ScreenHomepageWork MonitorTask MonitorGroup MonitorData MonitorGreen Light AreaA glass recycling system designed for Wan Chai Bar Street.Time March 2014Type Group ProjectClient HK EPD02Green Lig
8、ht Area was a four weeks project which focused on improving the glass recycling situation in Hong Kong. I played the role as main researcher, discussed with the team about the system design, and was in charge of the recycling bin design.Our client was Hong Kong Environmental Protection Department, w
9、ho hoped to decrease the landfill space used by waste glass and raise HK peoples awareness about glass recycling. In the secondary research, we already knew that the majority of waste glass in HK was alcohol bottle, so we decided to choose Wan Chai Bar Street as the typical case to study and design
10、for.During the secondary research, we found a environmental organization named “Green Glass Green” who collected glass bottles 3 times a week in Wan Chai Bar Street. We contacted them and did a field study as a volunteer to understand the whole flow of the existing glass recycling system.01/03/2014W
11、an Chai Bar StreetResearch : Field StudyBarsVolunteersGlassFactoriesLandfillCustomers Common Bin Glass Bottle Flow of Wan Chai Bar StreetFor the bars:- Most of the bar owners didnt care about glass collectingand sorting. (no motivation) For the bin:- The bin is not especially designed for glass coll
12、ecting, so glass bottles always mix with other rubbish, whichbrings problem to the collecting process.For the costumers:- Lack of awareness about glass recycling. (awareness)- Bottles were thrown everywhere. (behavior)Problems / Design OpportunitiesFor the volunteer:- The volunteering job was dirty
13、and tiring. (low-tech)- Bottle collecting process caused noise. (secondary pollution)- Only collected 3 times a week. Green Light Area System Design for Wan Chai Bar StreetImprovementPromoteAdvertiseUpdate dataMotivate by rankingCare about rankingSort bottles initiativelyRaise awarenessRaise awarene
14、ssCheck rankingVolunteersGlassFactoriesCustomers Recycling Bin “GLA” AppBars PromotionFor the bars:- Bars would sort the bottles in order to raise their ranking in Green Light Area.For the customers:- Customers could easily find out the Green Bars and the glass recycling bins.- The design could rais
15、e their awareness about glass recycling.For the volunteer:- No need to separate the bottles from other rubbish, save much time of collecting process.- The whole process would be cleaner and quieter.Green Light Area System Design for Wan Chai Bar Street“GLA” AppPromotionRecycling Bin View bars GLA ra
16、nkings View “Green Light Areas“ map View the green bars near me Measurs weight of bottles LED screen display Convenient for collection QR code on coaster Download GLA app GLA certificateHear Me03Hear Me was a four weeks project of an embedded interaction workshop. The aim of the workshop was to enco
17、urage us to discover original, innovative experience between people and environment, by using the tangible interactive medium.So we designed Hear Me, an interactive wall which could “hear“ peoples talking and catch the most popular keywords from the conversations, then project the keywords on the wa
18、ll. We hoped this wall could show a place or even a citys character by people who pass, talk and live here.An interactive wall that can hear peoples words.Time April 2014Type Group ProjectDiscuss about keywordsKeywordNo.3KeywordNo.4KeywordNo.5KeywordNo.1KeywordNo.2Show keywordsTalk about some topics
19、Hear new wordsHear the wordsCalculate the most popular keywordsand show on the wallShow keywordsUnderstand the culture trendPasserbyPasserbyTravellerInteraction Module of Hear MeFollowing peoples movingFrom blur to clarityInteraction DetailsUsage Scenario of Different PlacesLattePrada PaperTimeDateG
20、ucci DeadlineNewsSugarLuxuryClassMorningYummyExpensive ProfessoriPhone6CakeFashionBookLateCafeCommercial Street UniversityMTR CorridorInfrared SensorMicrophoneMicrophoneMicrophoneMicrophoneProjectorServo MotorComponents of Hear MeInputOutputClick a Meal04A six weeks project which focused on providin
21、g PolyU students a more fluent experience to eat in canteen. In the early stage of research, we already found that students sometimes faced some problems when they ate in canteen. For example, the canteen might be hard to find a seat in busy hours; students confused in making a decision; foreign stu
22、dents found it difficult to pronounce the dish name to the staff To solve these problems, we designed Click a Meal.A random menu which recommend students todays canteen meal according to preference.Time November 2013Type Group ProjectWe designed the wireframe and invited six PolyU students to do the
23、 usability test. The basic flow was that firstly we briefly introduce the App without telling them any details. Then we gave them tasks one by one, and they were required to finish the task. We videoed these test processes and analyzed the mistakes they made in each steps. After the test we also int
24、erviewed them about the experience during the test.Wireframe Prototype & Usability TestHorizontal Screenfor canteen staffLive ViewPreferenceIngredient InfoFor those foreign students who couldnt pronounce the dish names correctly, they could show the horizontal screen to the canteen staff and easily
25、get a meal.Live view help students avoid canteens busy hours and have a better management of time.By selecting the preference once, system will just recommend students what they like. Also, it is a good way for those who need to avoid certain food such as pork, beef or seafood.Ingredient information
26、 could help avoid some non-local students taste difference.Gallery Web Design05Xianzaitang gallerys decoration is in traditional Chinese style, but it has both traditional Chinese painting and western oil painting in its collection, which means its web design should fit both style.So I used graduall
27、y changing green to express the gallerys claasic and tasteful character, hoped that it could give visitors the feeling of the archaic Chinese taste and contemporary art style at the same time.A web designed for Xianzaitang gallery.Time April 2014Type Individual ProjectClient Xianzaitang Galleryhttp:
28、/http:/150 0000 0000Character Design 06Five characters designed for IdeaXchanges promotional animation. IdeaXchage is a non-profit monthly event that gives interesting and successful people a platform to share ideas in order to inspire others. The requirement of the character design is that it shoul
29、d be young people from all over the world. So I designed these five character with different races.Five characters designed for IdeaXchanges animation.Time July 2014Type Individual ProjectStoryboardCharacter DesignCherish Book, Cherish Time07“Amusing ourselves to death.” Nowadays, people are surroun
30、ded with digital product, we are even too busy to stop and read. With my original intention of cherishing the time people spend with books, I designed this furniture especially for reading space, for those who hope to slow down their steps in life.Wood furniture designed for reading space.Time June 2012Type Group ProjectSketching
