Mission: Creating a screen for an ecological coffee machine.
 My role:  Developed a flowchart, wireframes, mockups, and conducted tests.
Duration: 2 weeks.
Client: School project (Hyper Island)

The challenge
Creating a screen for Mr. Bean – an ecological coffee machine with innovative, and useful, features.

The solution
The screen of Mr. Bean - the ecological coffee machine - nudges users not to waste coffee and to use their own cups. The machine does this by having a frame asking the user if she needs a new cup or if she can use her own. The button "I have my own cup” comes first, in order to be read and interpreted as the best option.
On this project, there was a special care to nudge regarding excess of caffeine consumption regarding the clock, regarding the use of plastic cups, and the waste of coffee. 
One of the goals was not to have people drinking coffee more than 8 hours before their sleeping time so that they could sleep well and be productive the following day.

This wireframes were made on Adobe XD.

This video aims to show the coffee machine screen with the most important animations and putting special focus on the nudging.




What have I learnt? I learnt how to use Adobe XD, the geometric code on the flowcharts as well as why are wireframes so important. At the same time, I have improved my design skills while doing a mockup. Then, I have conduct tests with my classmates in order to improve the prototype with their suggestions and needs as potential users.
What was incredible about this? I learn how to do and test a prototype, as well, as make a paper prototype for a physical product! I hope something like this became real one day.

You may also like

Back to Top