Stove UX
Thank you Patricia for making such an informative class. I was so happy with how this came out / enjoyed the process / problem solving.
I began the project thinking about what could be improved in the kitchen. I love to cook, so I run into a good amount of problems. I started off with a stove that would show recipes, but I wanted to get away from the example, so I thought a little more.
IDEATIONAfter a while, I realized that I run into trouble trying to have everything done at the same time when making a more elaborate meal. Often I forget to preheat the oven or my water isn't ready to boil when I thought it would be. This can be especially troublesome when preparing a holiday meal and hosting several guests that are hungry and waiting. Thinking about those problems, I came up with this list.
STORYBOARDING
I used my own experience as a basis for the storyboard. I take the ingredients out of the fridge, I start to prep the items and then I go to the stove. I'm not always sure how long it will take for the oven to be ready or the water to boil, so I have to guess and wing it. This makes things harder, especially with a new recipe. This interface would solve the issue and (in the future) recognize when a pot is boiling. The result - a meal fit for a king.
So
Object
Stove
Problem
Various prep times make it hard to have foods ready at the same time.
Solution
Stove keeps track of when it is ready and displays the time to the user.
PAPER PROTOTYPING / SKETCHING
For the paper prototype, I imagined the interface would be short and wide. The elements would include
- Clock
- Burner Dials
- If the burner was on or off
- Oven prep option
- Water boil option
- Degree
- Volume
- Time left
I also wanted to include an option to see if a pan was hot enough and the current temperature of the pan, but then assumed that a pan would heat very quickly and displaying the heat setting was probably enough.
The idea for the stove to help with adding in ingredients based on time or doneness crossed my mind, but the logistics seems too complicated, so I kept it more simple.
DIGITAL WIREFRAME
For the digital wireframe, I took my basic sketch and translated it into a flat UI. I did download the wireframes kit, but ended up just making my own. Icons were taken from Noun Project. I added colors because I thought they were necessary to communicate if element was active.
The first two images show the burner slide being used. The color and position clearly display that the burner is on and at what heat.
The next two show the oven preheat. a user would select the temperature and hit start to add a card to the home screen that displays the oven status.
The last two are similar to the oven screens, but change to boil water.
I know the wireframe shouldn't have the logo, but I really couldn't resist.
DIGITAL PROTOTYPE
How the screens would flow. I might go back and animate these together nicely.
I created a simple animation in XD to show the burner being adjusted. Note - turning off the burner does not result in traveling back in time...
User Testing
I. Provide context - I started by asking my participant what steps they would take if they wanted to make a pasta dinner with garlic bread.
They answered with the first step being going shopping, so I adjusted and explained that they have all the ingredients and the recipe, so now it's time to cook.
Naturally they said they would begin to follow the recipe. Since I didn't' have one, I explained that the recipe calls to boil water and preheat the oven to 375 degrees.
2. Get impressions - I put my laptop on the stove and showed the participant the prototype in XD's preview mode. I wish it would have been a touch screen, but it worked for the example.
The impression they got was that it controls the stove much like the analog controls would. They saw the water boil option and were curious.
3. Observe - I gave two tasks to preheat the oven to 375 and to set a burner to boil water. The oven preheat was fast and easy for them, but the water boil had a slight issue - they couldn't select the burner. I realized that this would be very important so I made a note of it. They set the water boil to function, but on a mystery burner.
4. Final questions - they really wanted to know which burner would be used to boil water. They also thought that a feature to detect if a burner is left on without a pot / pan would be cool. Possibly a feature that set a timer on a burner or gave a prompt if you are still using the burner - like Netflix's "are you still watching" prompt.
I plan on going back to add the burner option for boiling and the burner timer / still cooking prompt.
THANK YOU FOR LOOKING!