p.2
1) Brief, Research and Analyses
Brief
Project Brief
In this project, we are looking for an environment that people have frustrations in the daily life. And we aim to design an interactive application to solve those frustrations. We experience how interactive designers study requirements and problems in a user domain, applying interactive principles, planning scenarios and possible usages, building interface prototypes, evaluating and refining their design with user tests. At the same time, we learn the common workflow of interactive designers in user centered design approach. The most important thing is that application of interactive design principles and techniques in various fields in this post digital age are introduced to widen our views on interactive applications.
Background
Our project covers the areas of retail, boutique and department stores. After discussion, we decided to put the main focus on large retail shops and department stores, since it is easier for us to do a detailed research afterwards.
p.3
1) Brief, Research and Analyses
Research
Field visiting
We discussed where should we go for researching. We decided to look for three different locations with three different cases for the tasks. The main reason was that we wanted the tasks to be diversified. So we had more choices and we could have a “whole view� of what we wanted to do. A specific area might restrict us. At the end, we chose three different stores (IKEA, UNIQLO, YATA).
p.4
1) Brief, Research and Analyses
Research IKEA
The background of IKEA The IKEA vision is “To create a better everyday life for the many people.” IKEA business idea is “To offer a wide range of well designed, functional home furnishing products at prices so low that as many people as possible will be able to afford them.” IKEA market positioning statement is “Your partner in better living. We do our part, you do yours. Together we save money.”
p.5
1) Brief, Research and Analyses
Research
The IKEA business idea is that “we shall offer a wide range of well-designed, functional home furnishing products at prices so low that as many people as possible will be able to afford them.” It emphasizes the self-service. It is prepared for costumers to shop on theirs own. The main steps when costumers shop in IKEA. 1. Costumers choose, compare and test all the things in the Showroom. Look at the price tag. It tells costumers everything about the product. A) Costumers see where you pick up products in the Self-serve furniture area or in the Market hall. B) Or costumers contact staff and tell them which products they want to buy. Look at the price tag. It tells you where you need to go. 2. Costumers write down their choice of products and where they can pick them up in the store. Use the shopping guides and pencils they find in the store. 3. Costumers pick things up themselves. Most IKEA products are flat-packed. So they’re easy for costumers to take away. Check the label on the box to make sure the contents are right.
p.6
1) Brief, Research and Analyses
Research UNIQLO
UNIQLO is another kind of shops that have different operative arrangements. Its style is a classic shop selling clothes. Costumers usually need to shop around and find their own stuff. And then if they want to try the clothes they have chosen. They have to wait for a fitting room. Usually the staff in the fitting room will give costumers a card to show how many clothes they have to fit in each time. Mostly 3 clothes are the maximum.
p.7
1) Brief, Research and Analyses
Research
YATA
YATA is a classic department store which sales management is similar to CITISTORE and JUSCO. These department stores are usually contain many categories, costumers can nearly find all the common domestic products in these department stores. Also, costumers can but clothes, electronic products and even shop in supermarkets. There are food courts which costumers can have something to eat. These department stores prepare to let the costumers to spend an afternoon time in shopping these stores.
p.8
1) Brief, Research and Analyses
Analyses
Reasons we choose IKEA
IKEA uses self-serve format to operate. Since customers do not well-know the environment or products of IKEA, there would be a lot of problems existed when they do shopping. IKEA environment is large. IKEA has a large area and included few floors, just like a shopping mall. Customers would usually have problems with locating themselves and the location of products. Furniture description is necessary. IKEA mainly sells furniture, and IKEA is selling a wide range of products. Customers would spend some time on acquiring the products’ information. There are several of departments in IKEA. Customers need to travel from showroom to inventory under the self-serve operation, and the customers get the products in the inventory by themselves. It is difficult to maintain the product.
p.9
1) Brief, Research and Analyses
Analyses
The aims of our project
Based on the project brief provided, we choose product locating as the primary target of our project. Since it is very difficult to locate the product customers wanted in IKEA, we can make use of the interacting application to solve the problem. Beyond of the primary target, we aims to design an application which can match the positioning of IKEA, and make it easier to do shopping in IKEA. Deliver the “shop your own way� image.
p.10
2) Target Audience (Persona)
Persona Setting We investigated the personas and thought about the events where the personas are likely to experience the problems with the chose tasks before our interactive application is introduced. This is the “Before Scenario”. Also we needed to think about the future events where the persona can successfully operate without frustrations due to the introduction of the new interactive application. This is the “After Scenario”.
p.11
2) Target Audience (Persona)
Persona Setting
We found out that actually most of the customers who may go to IKEA are adults, young couples or families. On the day we went to the IKEA to do the photo task, we all noticed this phenomenon. Persona
1
Name Age Gender Education Level Occupation Financial Status Temperament Interaction Event
Moses 28 M High School Designer $11000 Stylish ďƒ Foreigner [Customization & Defaults] -provide English version to read ďƒ He is fashionable and love to buy the latest things [Autonomy] -always show the latest product for him to notice
p.12
2) Target Audience (Persona)
Persona Setting Persona
2
Name Age Gender Education Level Occupation Financial Status Temperament Interaction Event
Sue 40 F Degree from University Manager Over $25000 Practical Knowledgeable [Envisioning Information] -just have to provide information that she needs Always need to hold meetings (busy) [Explorable Interface] -set a simple work flow to save time Not good at using computer [Affordance & Feedback] -use graphic-based interface
p.13
v
2) Target Audience (Persona)
ReasonsDifferences & Differences between two personas Moses
Sue
• Westerner
• Local citizen
• Lower income
• Higher income
• Enjoy life, relaxing style
• Efficiency
• Able to learn
• No longer learning age
• Better sense in computer
• Low sense in computer
• Hate walking too long
• Has difficulties in reading maps
• Concern about style and aesthetic
• Concern about efficiency and necessaries
p.14
v
3) Storyboard
Before Scenario
Moses
(Existing solutions)
1) Aim: Stylish sofa
2) Walking around IKEA’s showroom (Living Room).
3) Tired of walking around those showroom.
4) So he finds a catalogue and look for sofas.
5) Looking at the catalogue to 6) Interested in the EKTOP sofa see the sofas. which is showed in the Living room.
p.15
v
3) Storyboard
Before Scenario 7) Do not know if the EKTOP sofa have different colors or not.
10) He finds the IKEA map.
Moses
(Existing solutions)
8) Ask staff about the purchase 9) The staff cannot speak system. English fluently. They can only use gestures to communicate with each other.
11) Finding the sofa’s location.
12) He arrives at the Living Room’s area.
p.16
v
3) Storyboard
Before Scenario
Moses
(Existing solutions)
13) He finds the sofa at 14) Mark the INGOLF chair’s showroom and thinks it’s okay. product code (PQ57341X).
16) Check the shelf location of the sofas at the Self-Serve Furniture Area.
17) (Zoom in) Sofas are at Shelf 9.
15) Go to the Self-Serve Furniture Area.
18) Locate the corresponding area and shelf of the Self-Serve Furniture Area. (Shelf 9, Area 2)
p.17
v
3) Storyboard
Before Scenario
Sue
(Existing solutions)
1) Aim: dining chair
2) Get the catalogue at the entrance of IKEA.
3) Wasting time to look for chairs page by page. At last, she’s interested in the INGOLF chair which showing in the catalogue.
4) Finding the IKEA map.
5) She checks the position on IKEA map. The INGOLF chair is supposed to be located at the Kitchen’s area.
6) Looking & checking the position that the INGOLF chair is displayed.
p.18
v
3) Storyboard
Before Scenario
Sue
(Existing solutions)
7) She comes to the Kitchen’s area.
8) But the chair she is interested is not actually there.
9) She doesn’t know where to go.
10) She doesn’t really understand the IKEA map.
11) IKEA is crowed of people, cannot see the instructions clearly.
12) She asks the staff to get to that place.
p.19
v
3) Storyboard
Before Scenario
Sue
(Existing solutions)
13) The chair is actually located 14) She thinks the chair’s ok in the Living room. and marks the INGOLF chair’s position at Self-serve Furniture Area. (Shelf8, Area1).
15) She forgets the instructions from the staff and she needs to go to the Self-Serve Furniture Area on her own.
16) Looking at the map of the Self-Serve Furniture Area.
18) Unfortunately the INGOLF chair is out of stock.
17) Locate the corresponding area and shelf of the self-serve furniture area. (Shelf8, Area1)
p.20
v
3) Storyboard
Moses
After Scenario
(Advanced solutions after the invention of the IKEA apps)
1) Aim: Stylish sofa
2) Downloading the English version of IKEA Apps.
3) Using the IKEA apps.
4) The main menu. Click the [Product] button.
5) Click [Showroom] to search different style of sofas.
6) Click [Living room] inside showroom > select interested display in the showroom gallery.
p.21
v
v
3) Storyboard
Moses
After Scenario
(Advanced solutions after the invention of the IKEA apps)
7) Rolling around the gallery 8) Click the interested product left and right or zoom to find > the pictures that you have interested product. selected would pop up at the right side (cushion and sofa).
10) Click [Information] to see detailed description of the EKTOP sofa.
11) The product code, color provided and the position of the self-serve furniture area would be shown.
9) Click the interested sofa > the front view of the EKTOP sofa pop up.
12) Click [Compare] to type in the height or even take a picture to see if the proportion is suitable.
p.22
v
3) Storyboard
Moses
After Scenario
(Advanced solutions after the invention of the IKEA apps)
13) The [Comparing] screen interface.
14) Click [return] to the information page. And click the [Position] to see the showroom location of the sofa.
15) There is a large “ruler” on the ceiling with codes to indicate the customer’s location.
16) Enter the code on the ceiling to locate exactly where the customer is.
17) Using coding can avoid conditions that the customer doesn’t know where he/she is.
18) Click [Self-Serve Furniture Area] to know the position of the EKTOP sofa.
p.23
v
v
3) Storyboard
Moses
After Scenario
(Advanced solutions after the invention of the IKEA apps)
19) Walking to the showroom where the sofa is.
20) After looking the sofa, he thinks it’s ok to buy it.
21) Back to the screen showing the showroom map, click to “Self-serve Furniture Area” to see the position of the stock.
22) The Self-Serve Furniture Area will come up with its map and show the position of the product.
23) When he arrives, he looks at the map of Self-Serve Furniture Area to see where the sofa category is. Sofas are at the 9th shelf.
24) Take the product and pay the cashier.
p.24
v
3) Storyboard
Sue
After Scenario
(Advanced solutions after the invention of the IKEA apps)
1) Aim: dining chair
2) Downloading the English version of IKEA Apps.
3) Using the IKEA apps.
4) Click [Product] at main page.
5) Click [Lists] to view the products in lists.
6) Click [Category] to search different type of chairs.
p.25
v
v
3) Storyboard
Sue
After Scenario
(Advanced solutions after the invention of the IKEA apps)
7) Click the interested chair (INGOLF chair) > the information of the INGOLF chair pop up.
8) The product code, color provided and the position of the self-serve furniture area would be shown.
10) The map of IKEA would be 11) Click [Return] to the shown, showing the routine to information page. the dining room area.
9) Click [Position] to find the position of INGOLF chair (Dining room).
12) Click [Self-Serve Furniture Area] to know the position of the INGOLF chair.
p.26
v
3) Storyboard
Sue
After Scenario
(Advanced solutions after the invention of the IKEA apps)
13) The map of Self-Serve Furniture Area will be shown and show the position of the chair.
14) A button in the page of info page to see if the stock is okay.
15) Out of stock.
p.27
4) Idea Generation
So we decide... Finally, we chose IKEA for this project, and the reason why we chose IKEA was that we thought there was a chance to develop an application for locating products in a large retail store like IKEA. If this kind of applications is successful, we may create a new method for customer to search the products they are interested.
p.28
4) Idea Generation
System Diagram We based on the retailed frustrations and the interactive principles broken from the interaction mind maps to create a table below, and we searched for technologies that we thought they would help solving the frustrations.
p.29
4) Idea Generation
p.30
4) Idea Generation
Screen Hierarchy After we had explored the relationships between the customers’ frustrations, the disadvantages of different user interface and the interactive principles involved, we started to develop the screen hierarchy for the iPhone application.
4) Idea Generation
Hierarchy Testing
p.32
4) Idea Generation
p.33
4) Idea Generation
Interface Design Draft
At week 2, we started to think about our interface design, what our interface would look like.
Design idea
The design idea of this apps is that we want the customer do their shopping in a faster, clearest and most convenient method with a new interface, no longer only using catalogue and computer to shopping.
Style
Use a checker paper as our background, just like a graph paper, and a little handwriting style.
Reason of using this style
we want to show that IKEA is not just only selling furniture and domestic product, but most important is selling their concept of giving you a more convenient and comfortable life with their designs. Therefore our apps style just like some design blueprints which are in a file.
Simple interface design
Also our interface is simple with no complicated graphics and decorations, so that people can focus clearly on the products and information. p.34
4) Idea Generation
Interface Design Draft
Main page design:
The style of the design is similar to collage style at the very beginning, which is using real photos to make up the interface. The color scheme is mainly blue and yellow, which is the logo’s colors of IKEA. In fact we have change the main page design later on. The original idea is that there are 3 levels of shelf having 3 different products, these represent the 3 buttons on the main page (“Catalogue”, “Stock” and “Updates and news”). There will be a person/child climb up the ladder to see which shelf he/she wants to get in. This character represents the costumer. There is a “snap to grid” function when the costumer moves the character, so the character can arrive exactly the shelf where the costumer wants to be. However, later we found out that most of the users do not really know how to use that interface, so we changed it to a “folder style”.
p.35
4) Idea Generation
Interface Design Draft
Default page design
When the character is at that oor, words will be appeared for clariďŹ cation.
p.36
4) Idea Generation
Interface Design Draft Showroom Design:
The part “Showroom” design is mostly based on the book catalogue of IKEA. It is presented according to the room categories. “Drag & slide” function is added to this interface, so the customers can drag and slide and look at the furniture in the showroom completely. If the customers see something they like and want to look into the details. They just need to “touch” the products on the screen. Then the specific product will “pop-up” and appear in larger size. So the customers can click on the products and read the details.
p.37
4) Idea Generation
Interface Design Draft There is a “stretch and zoom in� function as well, just like the function of looking photos in iPhone. Customers can look more detailed looks of the products and click them for further information. Zoom in
After selection
Drag & slide
p.38
4) Idea Generation
Interface Design Draft List Design:
Some customers may have an idea of what kind of furniture they want to look for or to buy. So under the “Products” interface, besides “Showroom”, there is another button “Lists”, which shows the products in lists. The lists are clear at a glance, these are more convenient for the customers.
p.39
4) Idea Generation
Interface Design Draft Showing the route
Map Design:
The idea of adding map function is to help the customers to find their interested products. When the customers find their interested products, they use the cameras on their iPhone to read the barcode labels on the product labels. And if they locate where they are in IKEA, there is a route on the map showing the way they should go and find the products in a faster way. We have to deal with so many problems on this map function. This will be mentioned later on.
p.40
4) Idea Generation
Interface Design Draft Ratio function (“comparing size” function):
One of the frustrations is that the product size is unpredictable. By using the camera, customers can take photos (either front/ side views) of themselves for reference. If they want to take photos for reference, they must take the photos showing their height completely. This function is used to relatively compare the product sizes to the customers’ heights, so the customers can predict the products’ real sizes.
p.41
4) Idea Generation
Interface Design Draft Self-serve Furniture Area Design:
Product numbers/barcode labels:
If the customers have already chosen the products they want, they can simply enter the product numbers or enter the barcode label using the camera of the phones. They can go straight to the product information, checking the details of the product.
4) Idea Generation
Interface Design Draft Map of self-serve furniture area:
When customers decide to buy the products after they read the details of the products. The next step is to show where the products are. The stock information of the products originally is shown in the map, but later we decide to change it and show it in the product information, so the customers can know the stock earlier in the product information.
v
4) Idea Generation
Interface Design Draft Updates and News Design:
This is the third button in the main page, this shows the latest news and information of IKEA.
v
5) Prototype + Refinement
User Tests One week before the final presentation, we did the first user tests to see if the hierarchy flows, interface design and buttons in the apps work well or not. We need to test if the application is user-friendly or not.
p.45
v
v
5) Prototype + Refinement
User Tests
p.46
v
5) Prototype + Refinement
New Frustrations and Refinements After the first user test, we found some new frustrations of the interface design.
Contents
Product information page
There are many information in a single page. These look too small in an iPhone screen. And the titles and the content is in the same font size, it is not clear enough. As users may not be patient in using this interface as there are too many words that will distract users’ attention. So the principle “Readability� is broken.
p.47
v
v
5) Prototype + Refinement
In order to solve this problem, filters are added to show the content in a structured way, so every single page of the filter contains different kinds of information. Then the screen interface will not have so much information and the contents are shown clearly at a glance.
p.48
v
5) Prototype + Refinement Buttons’ names
Map
Map
Proportion of the user and product
The name of buttons are so confusing before. Users cannot get the meanings of it. They even misunderstand the function that buttons represent. Thus, they cannot choose what they want and also select a wrong path. This situation shows that our design have broke the design principle called readability.
p.49
v
v
5) Prototype + Refinement
So we change the button’s names to be more readability and sensible. For example, position changed to be map and compare changed to be ratio with a symbol which show the function of compare the proportion of user and product. It makes the name of buttons easier to understand.
p.50
v
5) Prototype + Refinement Buttons’ spacing
Main Return page There are total five buttons on the top of our interface at first, but this broke the principle of Anticipation, since it has no enough space for user to use finger to press the button, it is easy to press the wrong button, so it is not user-friendly enough.
Product information page
p.51
v
v
5) Prototype + Refinement
After that, we combine some of the buttons and change the position of the ratio button, so there are more space for each button, and more clearer name for each button. Therefore it will be easy to click the button right.
p.52
v
5) Prototype + Refinement Buttons’ positions
Showing the inventory of the selected product In the map, L3 and L4 are not clear enough to represent user’s location and the general route of the user. User may confuse the direction and do not know the next step. We have added a general route for user to know that where they are in and where they are going to. Also, arrows is added in the route. The button “L3” is added at the end of the route, so as to let user to know the next step.
p.53
v
v
5) Prototype + Refinement
We discovered that the “Stock” button is not placing at the right position, as the “stock” button is used as checking the inventory status. However, We have put the “stock” button at the self-serve furniture area map. It is too late for user to know the inventory status after the user decided to find the interested product. So, after refinement, the “stock” button is shown at the product information page. User is able to know about the inventory status in advance. User won’t waste their time to find a product that may out of stock.
Product information page
p.54
v
5) Prototype + Refinement
Map Locator There are two main frustrations about the map locator function. The first one is that the locator is unable to locate users’ unique position so as to create specific routine. And the second one if that the floor plan is too general, users may be distracted by the separate routes. Some users may even do not know the directions of the routes.
p.55
v
v
5) Prototype + Refinement
Before the improvement, the map locator is unable to locate users’ unique position so as to create specific routine for user to know how to get to the product. Also, the floor plan is too general, the user may be distracted by the separate routes, and can’t get convenience from the map locator. For improving our map locator, we create a new system, that is making some location number for the user which is presented as a big ruler sticking on the ceiling in ikea, so that the user can find out their location number and then enter to our application, so that our system can locate your position and create the routine for the users. In addition, we use different colors to represent the main route and side routes, so that the user can be more clearer to know where they are. p.56
v
5) Prototype + Refinement
p.57
v
5) Prototype + Refinement
p.58
6) Final Design + Feedback
Final Design of Apps After the first and the second user tests, we synthesize all the comments given by the personas, our observations of personas’ expressions during the user tests, and comments given by tutor. We finalize the interface design, especially the user interface, like the functions design, positions and spacing of buttons.
p.59
6) Final Design + Feedback
Final Design of Apps
p.60
6) Final Design + Feedback
Final Design of Apps
p.61
6) Final Design + Feedback
Final Design of Apps
p.62
6) Final Design + Feedback
Final Design of Apps
p.63
6) Final Design + Feedback
Final Design of Apps
p.64
6) Final Design + Feedback
Future Scenario 1) He arrives at IKEA and wants to find a sofa.
2) Downloading the English version of IKEA Apps.
3) Using the IKEA apps.
4) The main menu. Click the [Product] button.
5) Click [Showroom] to search different style of sofas.
6) Click [Living room] inside showroom > select interested display in the showroom gallery.
6) Final Design + Feedback
Future Scenario 8) Using slide/ click functions 7) Rolling around the gallery left and right or zoom to find to search for interesting products. interested product.
10) Click the interested product > the pictures are selected would pop up at the right side (cushion and sofa).
11) Choose sofa as he wants to look for more details.
9) There is a “zoom in/out�
12) The individual page of the sofa. He clicks [Information] for more details.
p.66
6) Final Design + Feedback
Future Scenario 14) There is a [Ratio] button on 13) The filters on top help him to choose which kind of info. he the lower left of the screen, which can compare the ratios wants to see. between users and products.
16) Enter the height of the user. 17) The [Ratio] screen interface. Photos of the users are optional.
15) He wants to compare the ratio between him and the sofa.
18) Click [return] to the information page. And click the [Map] to see the showroom location of the sofa.
p.67
6) Final Design + Feedback
Future Scenario 19) The [Map] screen interface. 20) Enter the code on the ceiling to locate exactly where He follows the instructions on the ceiling and enters the codes. the customer is.
22) A route is shown from the his position to the product location..
23) There is a brief route showing where should he go and find the products.
21) Enter the codes in the box given and then click enter.
24) Walking to the place where the product is.
p.68
6) Final Design + Feedback
Future Scenario 25) He looks at the sofa at the showroom area and thinks it’s okay.
28) When he arrives, he looks at the map of SSFA to see where the sofa category is. Sofas are at the 9th shelf.
26) Back to the info. page, click [Map].
29) He takes the product and pay the cashier.
27) Click the “Self-serve Furniture Area” to see the position of the stock.
p.69
6) Final Design + Feedback
Future Scenario 1) Aim: dining chair
4) Click [Product] at main page.
2) Downloading the English version of IKEA Apps.
5) Click [Lists] to view the products in lists.
3) Using the IKEA apps.
6) Click [Category] to search different type of chairs.
p.70
6) Final Design + Feedback
Future Scenario 7) First, she looks the junior chairs.
8) The filters help her to select which kind of chairs she wants. She chooses dining chair.
9) Click INGOLF chair (Dining room) for more details.
10) She thinks the chair is okay and wants to see the product first. She clicks the map on the top left corner.
11) Enter the code on the ceiling to locate exactly where the customer is.
12) Using coding can avoid conditions that the user doesn’t know where he/she is.
v
6) Final Design + Feedback
Future Scenario 13) The map showing her position and the product location.
14) She zooms in to look at the 15) Goes to the showroom area. map clearly.
16) After looking the product, she wants to buy the chair.
17) She clicks the [Stock] to check the stock info.
18) At the CWB store, the chair is actually out of stock. She doesn’t need to go to SSFA.
p.72
v
6) Final Design + Feedback
Feedback/Considerations After the weekly meetings we had together, we tried to enhance our understanding of different analyses at different stages. We actually had many considerations to improve the design of the IKEA apps in different areas, mainly the overall style of the apps, buttons design and interface design. Below are our considerations about the design of IKEA apps. These are just some of them. There are some considerations in the refinement of the user interface design as well, which we have mentioned in the part 5 (Prototype and Refinements), before the final design appears.
p.73
v
v
6) Final Design + Feedback
Feedback/Considerations Other considerations:
• More details in elaborating the tasks, we should take more photos to show the whole process including the expectations and frustrations. • The expectations and frustrations should be more specified, the original expectations and frustrations might be too general. • The PowerPoint should have a completed flow, and be clear as well. Others can understand the content of the PowerPoint without explanations. E.g. using graphs and flow charts. • At week 2, the descriptions of the two personas are not specific enough, we need to figure out the differences and characteristics of the two personas. • We are challenged that the customers may not able to locate products using barcode labels, since the location of the products may change. But later we found out that actually the product positions do not change a lot in IKEA. • We need to indicate the product details in product information (e.g. product code, key features and display areas) • We are advised to design the interface in a more interesting way, we are expected to design a interesting interactions between the IKEA application and the users. We tried to add more interactions then, like slide, drag & drop and scale up functions. These are the iPhone functions as well, so the user would be more familiar with the interface. • We put our effort on how to solve the frustration bring to IKEA customer. We look for cooperation with IKEA, rather than taken over all the existing solution now IKEA have. So customer can still use the original solution IKEA existing, if they don’t have a smart phone. • Base on the comments given by the users in the user tests, we should start to think about the new frustrations and made some improvements on the interface design.
v
6) Final Design + Feedback
Feedback/Considerations Main page design considerations:
• There are too many things on the main page, make it difficult to see and use, it is not user friendly. But the information in other pages like “Category/Lists” page is too little. • The main page lost the consistency of style when it is compared with the other pages of interface. As a result, we change the main page style to a “folder-style”, to match our idea of interface design, which are the sketches/ notes of designer. • The titles of each page seem to be so small and they are hard to catch users’ attention. We better enlarge the font size of the titles, as users want to have quick look of the information more than looking for details, because of the limited space of iPhone screen. • In the function of comparing the ratio of the products and the users, we should add width as the comparing parameters, this can increase the accuracy of the ratio and give more choices for users. • Even there is a compass on the map showing the entrance and exit directions, sometimes users still cannot locate where they walk aimlessly in IKEA and get lost. Using the ruler on the ceiling solves the location problem. But we still keep the compass for reference. • We thought of using GPS to locate the positions in maps. But GPS cannot be used in indoor areas. At last we gave up this solution. • In product information page, the font size of different information should be different. For example, the dimensions of the products should have a larger font size, since most of the customers want to know the dimensions of the products. The descriptions can have smaller font size, as this is just additional information for the customers. • Base on the comments given by the users in the user tests, we should start to think about the new frustrations and made some improvements on the interface design.
v
v
6) Final Design + Feedback
Feedback/Considerations
Showroom/Lists’ considerations:
• Inside “Lists” page, usually there are many products in one category; this may cause the customers to roll down in the iPhone application all the time. It would be better if we add sub-categories or filters for them to choose. • The showrooms can be classified into different categories using styles.
Product information page’s considerations: • Inside the product details, there should be a specific indication, which tells the customers the name, dimensions and the materials used. So the customers can have a glance of those products in a shorter time. Ratio (comparing the heights of users with the sizes of products)’s considerations:
• In the function of comparing the ratio of the products and the users, we should add width as the comparing parameters, this can increase the accuracy of the ratio and give more choices for users.
v
6) Final Design + Feedback
Feedback/Considerations Typography/Buttons’ considerations:
• We should add buttons for the customers to choose to look at the decorations in the showrooms. (e.g. if a customer wants to look at the product information of a cushion on a sofa, he/she can first press the sofa, then the sofa will “pop up” and the sofa and cushion will be shown at the right side to let customer further choose what he/she wants to look for). • Since there is not sub-headings or filters at that time, all the buttons need to be put on the head line, this makes the head line contain so many buttons. It is not user friendly. We need to think about the positions and naming of those buttons. • The titles of each page seem to be so small and they are hard to catch users’ attention. We better enlarge the font size of the titles, as users want to have quick look of the information more than looking for details, because of the limited space of iPhone screen. • In product information page, the font size of different information should be different. For example, the dimensions of the products should have a larger font size, since most of the customers want to know the dimensions of the products. The descriptions can have smaller font size, as this is just additional information for the customers.
v
v
6) Final Design + Feedback
Feedback/Considerations Map locator’s considerations:
• The maps are only shown in one direction, many customers even cannot figure out where they are if they walk around the IKEA in aimlessly. We should add some “checkpoints” (e.g. barcode labels at each information centre in IKEA, so they can locate where they are). • Sometimes the user may not even know where he/she is, if the user cannot locate himself/herself, he/she cannot use the locating products function of map. Our original design is have barcode labels as the checkpoints in each information centre in IKEA. Later we change it to a ruler with the codes on which is placed on the ceiling of IKEA. We think this would be more convenient for the users to look for codes. • Even there is a compass on the map showing the entrance and exit directions, sometimes users still cannot locate where they walk aimlessly in IKEA and get lost. Using the ruler on the ceiling solves the location problem. But we still keep the compass for reference. • We thought of using GPS to locate the positions in maps. But GPS cannot be used in indoor areas. At last we gave up this solution.
v
6) Final Design + Feedback
Feedback/Considerations User tests:
• After the first user tests, when we play back the movie, we were actually instructing the personas rather than giving information of what personas should do or look for. These are two different things. If we just give information (or an aim) to personas of what they should do, they will spend more time on investigating the interface of the application. This helps to test if there are any problems in the interface design. But if we instruct the personas, they actually follow the instructions, but not using the application on their own. They should know how to use the application by themselves, as users often use the iPhone apps on their own, there are no people giving instructions beside the users. • It would be the best to ask personas to give comments when they are doing the user tests, their immediate responses help us to make changes of the interface design. • We should give the personas general ideas of what they are looking for in IKEA and their aims at the beginning of user tests. Maybe we can let them have a look of the photos of the products they need to find. It is because the personas sometimes don’t know what to do after finding the products in the apps and stop there if we have no further instructions.
v
6) Final Design + Feedback
Feedback/Considerations After the user tests:
• In the typing part, like the part of typing codes from the ceiling for locating the users, and the part of typing users’ heights and widths for ratio comparing, the keyboard used can be actually designed by us. We can make a simplified keyboard, so the page looks more pithy and tidy. • About the maps, a brief of the entire route can be shown at the right hand side of the maps, so the users have a general idea of where should they go. • The font size of the maps should be larger. • The function of scaling should be added to the maps for users to have closer looks of the maps. • In the page of typing code for locating the user, the design graphics used should be similar or even the same as the ruler on the ceiling of IKEA, so the users can recognize immediately what code they need to type in. • Some headings of the filters may be needed to change and to clarify, like “Display Area”, some users may not know the meaning, which is the products’ locations. • Bear in mind that the frustrations discovered before need to be put in the apps to test if all the frustrations can be solved. Any new frustrations are discovered? • Make a summary of all the comments given, second user test will be prepared.
End =)