A kiosk interface redesign for 3 different Costa Express machines.
Costa are the current industry leader for self-service coffee machines. They have kiosks placed in 4800 locations around the UK and Canada, mostly at petrol stations, supermarkets, and convenience stores.
Working closely with the design team and product manager, I created new user flows, as well as interactive and annotated wireframes.
New user flow
Changes were made to the user flow to prevent dead ends in the coffee experience. In situations where the machine is out of ingredients or there are cup size errors, alternative options such as locating the nearest stocked machine or size upgrades are provided.
Reviewing research insights
Insight from research in the UK and Canadian markets guided our design decisions for the new UI. Issues from the current machines such as unclear pricing and misunderstood payment methods were tested in the new design.
Interactive prototypes
Wireframes were created in Axure, published to axshare and set up on a large touch screen. Usability testing was conducted on the mounted screen to recreate the experience as closely to the coffee machines as possible.
Usability testing
Live testing was conducted on the mounted screens. Users were given tasks such as ordering drinks with custom syrups, with various payment and cup placement situations.
What I learned
The new user flow and interface addressed all the issues raised from market research. The new design is scalable for all 3 different machine screen resolutions. As my first kiosk UI project, I was very happy to solve new physical design problems I encountered with the Costa Express machines.
