The Counter Burger - BYOB


Overview

The popular restaurant franchise, The Counter, offers extensive options for customers to build their own burger. Building a custom burger can be daunting when viewing each step of the process at once due to the volume of options.

This concept tablet application provides a more interactive experience of building a burger while giving the menu a more manageable feel.


Tools

The Problem

Having eaten at The Counter in the past, I understand the trouble of examining all of the options while building a burger and I made sure to analyze the current process.

Sketches

Production

I used a piece of foam core board cut to 12×9 to represent the tablet and spray painted it black. I then staged a photograph of the tablet next to a glass of water to give some context that it might be used while in a restaurant.

Using Photoshop, I modified the original image to contain an area on the foam core that would represent the screen real-estate.

I created a green screen rig to record my hand gestures using the application. The rig was constructed from two floor lamps, wire coat hangers and foam core to suspend my camera above the green screen.

A bright green sheet of poster board was used for the green screen and a smaller section cut to the same dimensions as the tablet screen. I pasted this smaller section onto the larger green board to give me a reference point of where to manipulate the interface.

The majority of my editing took place in Adobe After Effects were I combined the staged photo of the tablet, green screen hand gestures, and tablet UI. After keying out the green color I created the motion graphics for the application animations.

UI Design

Adobe Illustrator was used to create the user interface of the application. I chose Illustrator because it integrates well with Adobe After Effects, which was used to bring life to the application in post production.