Tea-Riffic: Interactive Coffee Shop Design


Lisa Imas, Russell Andrews, Susan Wang


2 months

My roles

Researcher, storyboarder, designer, video editor


Our team decided to develop the concept of an urban coffee shop where people can project a digital self into the place in addition to their physical presence. Additionally, we wanted to focus on how the aesthetic of the venue is constructed between the coffee shop and the patrons.

We started with doing research, talking to a variety of patrons at various local and chain coffee shops around local Pittsburgh neighborhoods. Our research pointed us to one simple conclusion:

coffee shop = library + bar

Meaning, people work in coffee shops like a library, but also enjoy the ambience of a more public setting like a bar. We realized from our research that coffee shops provide a small amount of distraction from the ambience--the other people moving around, the scent, the warm and 'traditional' appearance of the shop, etc. In keeping with that idea, a lot of people had headphones in to play their own music to block out interaction with others (only taking in the ambience) and focus on their work. At the same time, though, plenty of people said they came to coffee shops on weekends to socialize, rather than work.

So from our research, we formulated a few things we wanted to focus on in our design, to facilitate or improve upon the way people already use coffee shops:


provide more control over music, an integral part of the coffee shop experience; make it welcoming for regulars and newcomers alike; preserve the traditional coffee shop 'feel'


make it easy for people to work in the coffee shop, while maintaining a social space that doesn't disrupt their work

Social activity

encourage interactivity; foster a local sense of community

With this in mind, we brainstormed over 50 ideas. It took us a while to narrow it down, but we eventually got it down to these six:

  • an interactive self-updating bulletin board for people to advertise loval events
  • digital mugs that people can customize for a personal touch
  • creating custom coffee blends (similar to Adagio Teas) that can then be shared with other customers
  • an easy ordering system that helps people unfamiliar with coffee find a drink that they will enjoy
  • accessing customer music playlists to help create a mixed playlist that will play in the coffee shop that can then be tailored to customer tastes
  • tables with touchscreen tops that can be pushed together to form larger tables for more people and more screen space

Design & Iteration

We built storyboards for the six ideas and then went and did more research by 'speed dating' with patrons in the coffee shops again to get their opinions on these specific ideas. Once we had their feedback, we reworked our ideas yet again. We also pared our ideas down to a select few, partially because we felt we were trying to do too much at once and partially because it would get too complex to display clearly in a demo video.

We began working on our final designs, which included tweaking our ideas to address user feedback as well as organizing the interface for our easy coffee ordering system. We wanted to design it so that people who'd never had coffee before would still be able to pick out options well enough to create a drink that they liked. For that reason, we made a list of options that would affect the various flavors of the drink, as well as the strength of the coffee itself, in easy to use terms for anyone to understand.

Filming & Final Product

That done, we created characters, a story, and a full script for our video to best present our work! Coffee Tree Roasters was kind enough to allow us to arrange our little 'set' and take photos for the video there.

And then, thanks to the magic of tripods, Photoshop, and Premiere, we put together high quality video showcasing our fine-tuned and carefully considered designs for a coffee shop environment!