For our second project we were given the task of redesigning a vending machine. My teammate and I decided to go with a coffee vending machine in the CULC, located on the floor above the Starbucks tucked away in a secluded corner without much traffic.
Vending machine location – the lady in the picture is currently using it
The vending machine itself was overly complex: its menu had inconsistent options, a lot of redundancy, and the ordering methodology they chose required the manufacturers to add an extra row of letters to the keypad:
The premium and the decaf have the same choices, but the others don’t. The Americano is only available in small and the latte is only available in large. What?
They keypad has a total of 24 buttons, for only 12 choices of coffee
Although the machine setup worked and people still used it a lot (perhaps because it’s the much faster alternative to the ever-busy Starbucks below), there were a lot of areas that needed improvement. Mainly, we wanted to simplify the ordering system by trying to combine choices where possible, and to improve small aspects of the user experience (such as providing the cup lids, since they were located on the far end of the row of vending machines, out of sight and completely disconnected from the coffee vending machine).
Our redesign process started by collectively coming up with 50 new ideas for a vending machine. Some of the more conservative concepts included a machine that narrates instructions to the user, or to give the user the option of buying extras separately after purchasing a coffee. As we went along, the ideas got more creative and unorthodox, such as using a Kinect-controlled interface to order, or using bluetooth on a smartphone to place an order while in line.
Ultimately, we combined our choices into 4 particular focuses:
- Control for the user, in the form of a freestyle coffee vending machine
- Simplification, for a more streamlined interface
- Creating a coffee shop feel by partitioning the process into an order area, a pick-up area, and an area for adding extras
- Speed, by adding a countdown to the machine
From which we narrowed it further into control and simplification for our first iteration of the redesign.
Design centered around a circular interface
We combined all the extra choices into 3 options separate from the coffee selection. That way, the three kinds of choices required to brew a cup of coffee were organized into logical sections, where the numbers around the circle suggest a step process. We provided visibility by making the buttons for the size choices contain the actual cups used by the machine; moreover, the choices the user makes would become highlighted in yellow.
Second iteraction
Our second iteration improved mostly on the extra choices and several usability issues from the previous design, mainly the fact that the “checkbox” model of the extras was not entirely intuitive and it clashed with the “radio button” scheme of the other options. We also changed the location of the brew button, and replaced the numbers with sections of the circle that flash on the current step and stay lit for steps already done (not illustrated in the picture).
We were still unhappy with the interface for the extras, so we reworked that for our final iteration. In our final presentation you can also see that choices are unlit if they’re unavailable (due to insufficient funds or ingredients), as well as how the circle lights up during the order process. Still not 100% satisfied with our solution to the extras interface, but overall I’m pretty happy with our redesign.