Project B: Micro Kitchen Lindsey Wilson College Professor Chris Quinn
Anthony Moore December 2014
Index Section
Page
Introduction
1
Development
2
Solution
3
User Testing
7
Refinement
8
Conclusion
12
Anthony Moore / Visualizing the Human Design / Project B / Dec 2014
Introduction Problem New York City, it offers everything at your fingertips. But like many metropolitan areas across the globe, those opportunities are also making our world smaller. Increasing urbanization and population growth are bringing us closer together—literally. The home size is decreasing while rent and mortgages are increasing. Even so, that modest space shouldn’t equate to a reduction in functionality, living standards or a reflection of personal style.
Solution As part of a micro kitchen, the focus of this design is given to the centralization of a control monitor that allows the user a convenient way to control the kitchen appliances.
1
Anthony Moore / Visualizing the Human Design / Project B / Dec 2014
Development
The mind map was created as a guide to the functionality of the control monitor. The features of each appliance were mapped out and provided the fundamental direction for the design.
Anthony Moore / Visualizing the Human Design / Project B / Dec 2014
2
Solution The low‐fidelity wireframes for the micro kitchen to the right were developed to provide context for the control monitor. The wireframe below situates the monitor on the kitchen counter.
3
Anthony Moore / Visualizing the Human Design / Project B / Dec 2014
The main control monitor to the right is designed to provide the current status for each of the appliances. The original design provided the navigation to the appliances on the left. After user testing, this was later redesigned in favor of a more top‐level design which provided more real estate on the monitor to lay out the UI elements. On the following page is the first iteration of wireframes for each appliance.
4
Anthony Moore / Visualizing the Human Design / Project B / Dec 2014
Microwave UI
Stovetop UI
5
Anthony Moore / Visualizing the Human Design / Project B / Dec 2014
Oven UI
Dishwasher UI
6
Anthony Moore / Visualizing the Human Design / Project B / Dec 2014
User Testing Methodology The group consisted of 3 females and 1 male. The notes from the sketches were removed so that they would not have any instructions. I then gave them an overview of the system and its purpose. Once I described the system I showed them the control monitor without any instruction. I watched for their response and noted any apprehensions or acceptances as they looked at the control monitor. After they oriented themselves to the control monitor I asked them to perform specific tasks and noted their success and failures.
Results Overall the users were satisfied with the design and provided positive feedback. They felt that the interface was intuitive and easy to navigate with a couple of exceptions: 1. One thing that confused everyone was the way the Cancel button was labeled on the monitor. The cancel button was there to return to the main control monitor. But the label was confusing when I asked them to start an appliance and then return to the main control monitor. Canceling in this context meant to cancel the entire task which meant turning the appliance off. This needed to be fixed and was refined in the next iterations of wireframes. 2. Most of the users struggled with the controls for the cooking intervals. Everyone was fine with the concept of cooking intervals but no one seemed to know to click the control and then key the time and temperature. These controls in the sketch offered no affordances as to how to interact with them. The notes on the sketches would have helped but these had been removed so that they would not offer coaching tips. These controls were refined in the next set of wireframes.
Anthony Moore / Visualizing the Human Design / Project B / Dec 2014
7
Refinement Given user feed back, the navigation of the control monitor was simplified. The new top‐ level approach allows the user to navigate to the appliance they want to control and allows from more screen real estate.
8
Anthony Moore / Visualizing the Human Design / Project B / Dec 2014
Further feedback on the control screen prompted a flat design for the UI elements over the three dimensional elements. This creates a sleeker more modern look. The UI elements in red provide the user a quick visual to see which appliances are in use. The following wireframes utilize the available real estate due to the revised design.
9
Anthony Moore / Visualizing the Human Design / Project B / Dec 2014
Microwave UI
Stovetop UI
10
Anthony Moore / Visualizing the Human Design / Project B / Dec 2014
Oven UI
Dishwasher UI
11
Anthony Moore / Visualizing the Human Design / Project B / Dec 2014
Conclusion The final design of the control panel involves several iterations. User feedback was critical to designing a product that was both useful and easy to understand. The original problem was to create a control panel that would be effective in a kitchen with limited space. The product designed not only meets these specifications but careful consideration has been given to the user experience.
12
Anthony Moore / Visualizing the Human Design / Project B / Dec 2014