THE MICRO KITCHEN Big Ideas for Small Spaces Master of Arts Degree, Interactive Design Louisville Center for Design, Lindsey Wilson College
Professor: CHRIS QUINN, Visualizing the Human Experience SHEKHAR P BAGAWDE December 9, 2014
01
TABLE OF CONTENTS
THE MICRO KITCHEN Big Ideas for Small Spaces Table of Contents Project Background
02
User Centered Design Process
03
Micro Kitchen: Solving space and functionality challenges
04
Initial User Research
05
Concept Sketches for Kitchen Counter Panel
07
Iterative Process for Wire-framing
09
User Testing with Paper Prototype
12
Finalizing Redesign Solution
13
Conclusion
15
Micro Kitchen: Big Ideas for Small Spaces | LC4D Lindsey Wilson College | December 2014
02
PROJECT BRIEF
Project Brief To design a functional ‘Micro Kitchen’ the urban resident and a ‘Kitchen Counter Screen’ that can connect to all kitchen appliances The Micro Kitchen: Big Ideas for Small Spaces Kitchen Mission: To design a functional micro-kitchen for a 7ft x 25in space that gives urban dwellers an opportunity to optimize space in a savvy way. All appliances should connect to a main “counter screen” that will be located on the counter top (embedded and recessed). The design should be able to fit with any kitchen appearance (interior design). Image Source: Pleasant Swedish Good Apartment Small Interior Kitchen Design Image Source: New York Hilton Hotel.com
Microscopic Living “In New York, a studio apartment can often run 300 square feet and smaller, and in San Francisco, you can legally nest in something as small as a cozy 220 square feet.“ (Source: 8 Amazingly-Tiny Micro-Apartments on Forbes.com)
Micro Kitchen: Big Ideas for Small Spaces | LC4D Lindsey Wilson College | December 2014
03
User Centered Design Process
User Centered Design Process A User Centered Design Process was followed to put together concepts for Micro Kitchen and the Kitchen Counter app Initial Concepts The initial phase of this assignment was to put together: a. Front and top view of kitchen schematics in sketches or line drawings, followed by b. Concepts and flow for the ‘Kitchen Counter‘ screen app Light User Research Along with thoughts, scope and the flow, a ‘persona’, mind-map and user journey was documented to get into the ‘user-shoes‘ i.e. to understand their goals, needs and pain-points. Iterative Design An iterative design process was followed to come up with concepts for the Kitchen Counter app Usability Testing with paper prototype Screens were tested with few users adn observations were documented
Micro Kitchen: Big Ideas for Small Spaces | LC4D Lindsey Wilson College | December 2014
04
Micro Kitchen: Solving space and functionality challenges
Kitchen schematics in sketches Cutting Corners After initial sketches, a thought just crossed my mind, what if we can utilize the corners effectively and free-up some space. This will involve remodeling of kitchen appliances like the ‘Microwave‘ and ‘Refrigerator‘.
Kitchen Counter Panel screen
Micro Kitchen: Big Ideas for Small Spaces | LC4D Lindsey Wilson College | December 2014
05
Initial User Research
Mind-map, Persona and User Journey
User Journey Persona and a day in life To provide basis for design concepts for the Kitchen Counter app, a persona and user journey were documented. Persona
The persona with elements such as ‘profile‘, ‘personality‘, ‘technology expertise‘, ‘devices & platforms‘, ‘pain points‘ and ‘goals‘. The mind map and user journey helped in identifying tasks that the persona will perform with the kitchen appliances.
Micro Kitchen: Big Ideas for Small Spaces | LC4D Lindsey Wilson College | December 2014
06
Initial User Research
Mind-map
Mind-map in Lucid Charts
Mind map was documented which included kitchen appliances and the basic set of primary and secondary features they offer.
CALIBRE - eBook Manager Interface Redesign | LC4D Lindsey Wilson College | December 2014 Micro Kitchen: Big Ideas for Small Spaces | LC4D Lindsey Wilson College | December 2014
07
Concept Sketches
Initial rough sketches for Kitchen Counter panel app
CALIBRE - eBook Manager Interface Redesign | LC4D Lindsey Wilson College | December 2014 Micro Kitchen: Big Ideas for Small Spaces | LC4D Lindsey Wilson College | December 2014
08
Concept Sketches
Adding details to the initial rough sketches 1
2
Header area with branding, music player and links to internet pages, for e.g. www.allrecipes.com, www.youtube.com etc.
Navigation Menu to access kitchen appliances
Appliance screen
Main splash screen
CALIBRE - eBook Manager Interface Redesign | LC4D Lindsey Wilson College | December 2014 Micro Kitchen: Big Ideas for Small Spaces | LC4D Lindsey Wilson College | December 2014
09
Iterative process for Wire-framing
Medium Fidelity Wire-frames
Navigating from Splash screen to an Appliance screen
Micro Kitchen: Big Ideas for Small Spaces | LC4D Lindsey Wilson College | December 2014
10
Iterative process for Wire-framing
Medium Fidelity Wire-frames
Micro Kitchen: Big Ideas for Small Spaces | LC4D Lindsey Wilson College | December 2014
11
Iterative process for Wire-framing
Navigation: Radial vs. Linear
Navigation: Radial Menu While this radial menu navigation may look unique, it ends up taking almost all of the real-estate on the home screen, leaving virtually no space to add useful information. Also, on the inner individual screens for each appliance, it takes considerable real-estate.
Navigation: Linear Menu The linear navigation menu at the bottom may look traditional, but it offers multiple benefits. The real-estate on the home screen can be utilized to display useful information such as dashboard views on the tasks that are in progress or the ones that are completed. Users can add apps or widgets to the home screen, that can assist them with their tasks. Few examples of such apps could be a ‘Calendar‘, ‘Grocery List‘ or a ‘Kitchen Calculator‘
CALIBRE - eBook Manager Interface Redesign | LC4D Lindsey Wilson College | December 2014 Micro Kitchen: Big Ideas for Small Spaces | LC4D Lindsey Wilson College | December 2014
12
User Testing with Paper Prototype
User Testing Test Participants
P1
P2
Illustrator, homemaker, and a mother. She wants to keep her family healthy and hence cooks meals for them. Enjoys to cook and thinks that it is an art as well. Student, loves to read, likes to listen to music and also enjoys cooking. She often bakes cupcakes, pastries and cookies. Among the kitchen appliances, she has mostly used the microwave, the oven and the cook top.
User Testing conducted with medium fidelity wire-frames displayed on a tablet placed on the kitchen counter top User Testing Tasks:
Observations and Comments:
Task 1: Informed them that they decide a lunch menu that they plan to cook for their families and how would they leverage the Counter Top UI to do multi-tasking, use appliances. Task 2: Asked them to mimic what they plan to cook and walk me through the process of cooking a meal using the Control Panel UI. Task 3: Briefed the test participants with features available to them for e.g. they can listen to music or refer to recipes, if they wished to.
P1
Preferred the linear menu over the radial menu, specifically because it offered additional helpful features such as ‘shopping list’ and ‘kitchen calculators‘.
Was quite candid and informed that she might end up using controls on the actual P2 appliances, rather than the counter top panel, because she is more comfortable and used to. She preferred the radial menu, and thought it looked ‘cool’. P1
For the Microwave controls, she felt that the interface had some controls missing, such as ‘Potato‘, ‘Cook Time‘.
P1
Both were excited with the music app and the options that helped them browse recipes on All Recipes and You Tube .
P2 CALIBRE - eBook Manager Interface Redesign | LC4D Lindsey Wilson College | December 2014 Micro Kitchen: Big Ideas for Small Spaces | LC4D Lindsey Wilson College | December 2014
13
Finalizing Design Solutions
High Fidelity UI Design Screen
The Home Screen displays useful information such as dashboard views on the tasks that are in progress or the ones that are completed. Users can add apps or widgets to the home screen, that can assist them with their tasks. Few examples of such apps could be a ‘Calendar‘, ‘Grocery List‘ or a ‘Kitchen Calculator‘
CALIBRE - eBook Manager Interface Redesign | LC4D Lindsey Wilson College | December 2014 Micro Kitchen: Big Ideas for Small Spaces | LC4D Lindsey Wilson College | December 2014
14
Finalizing Design Solutions
High Fidelity UI Design Screen
UI Design for Microwave controls
CALIBRE - eBook Manager Interface Redesign | LC4D Lindsey Wilson College | December 2014 Micro Kitchen: Big Ideas for Small Spaces | LC4D Lindsey Wilson College | December 2014
15
Conclusion
Conclusion
With this redesign project we refined our design solutions from discovery to design to evaluation We learnt to sketch concepts, have multiple design solutions, refine them in the wireframing process and get user feedback to evaluate our solutions. This way one can iterate and provide solutions that resonate users and match their mental models. THANK YOU.
Micro Kitchen: Big Ideas for Small Spaces | LC4D Lindsey Wilson College | December 2014