Presto! Salata's Automated Salad Bar

I'm taking a class on software user interface design for the HCI certificate program at Tufts that I got into at the end of last year. The amount of focus on graphic and visual design surprised me quite a bit. Although it takes me a long time, the one really positive thing is I get to add a few pieces to my portfolio. :)

The first assignment is to create a touch screen interface for Presto! which is an automated salad bar that can build custom salads per user's input. Imagine that there's a display attached to the side of a "cart" of sorts that will magically put the salad together. I designed out 6 sample screens in the user's workflow.

The Welcome screen introduces the concept of the kiosk and allows the user to switch to one of 6 different languages the interface is offered in.

To start, the user can choose from several preset options, or choose to build their own. This user selected the Chicken Caesar salad.

Once selected the salad details are displayed. This user wanted to go back and create their own.

 Within the custom creation screen, they can choose the greens, meats, toppings, and etc that they would like.

Then they can add beverages (it appears Salata has a partnership with Nantucket Nectars) and buy Salata's signature dressings with their order.

At the end, the order summary is shown to the user. They can complete their transaction on the pin pad and Presto! will whip up the desired order!

So for the class, we had to print the design out in color, on stock paper, and to scale. It totally killed my ink but they do look pretty nice. One really good thing about printing drafts out to scale was testing the "pressability" of buttons. Unlike using a mouse, if buttons are too small or too close my fat fingers would press them together. I made modifications to the initial drafts with that in mind, so I was glad that they needed to be printed to scale. 

Believe it or not, I managed to do the bulk of this design using Visio, which has been my tool of choice for wireframing, but never thought of as a design tool. For some elements I had to go out to a real photo and graphics program (like the masked round photos on the Welcome screen) but that's about it. I learned a lot about what Visio can do from a graphical perspective and realized it's a bit more powerful than I originally thought. Assignment 1, check! :)