For the Carnegie Mellon University BUILD 18 hackathon, our team brought to life a pop up coffee shop concept in collaboration with Constellation Coffee (Lawrenceville, Pittsburgh). Destination Constellation creates a unique and branded experience for every customer by drawing unique computer generated maps on to-go coffee cups. 

Constellation Coffee is nestled in-between many Pittsburgh neighborhoods, and has an important role as a gathering place to share culture, events and discoveries.

After customers have ordered their pour-over coffee and are waiting, they can quickly pop in their name (and answer some quick ‘personality’ questions) in our store front app. Immediately they watch our CNC robot draw a custom design onto their cup.

When their coffee is ready, they’re given a cup with their name & directions to a unique location in Pittsburgh. The map was designed to evoke the coffee shop's signature constellation while being quick for the robot to draw.

I built the front-end of the store front app. After customers entered their name, the app would:

  1. pull a location from our database,
  2. query Google Maps API for walking directions,
  3. take the walking directions, visualize them as SVG lines, plotting them to an HTML5 canvas element
  4. query our database for ‘landmarks’, then plot their location on HTML5 canvas
  5. convert the location directions to our custom CNC script font, plot that to the HTML 5 canvas
  6. export and upload the finished SVG file to the CNC machine for printing

In the end, the user didn’t see all that. They just got a sweet cup of coffee. 

left to right:
Westin Lohne - thats me yo
Chloé Desaulles - Visual Arts & Neuroscience '19
Thomas Eliot - Electronic & Computer Engineering '16
Lockheed Martin Recruiter - lol
Arun Marsten - Music & Information Systems '16
Sascha Demetris - Mechanical Engineering '16

westin lohne  ✧  sensitivity + digitality