Two brothers were inspired by their childhood by asking their mom what they wanted for breakfast. Their favorite breakfast is waffles and they always come up with wacky toppings for their toppings. When they become adults, they want to show the whole world their love for food combinations by creating a food truck. Cosmic Waffle aims primarily for family tourists of children around 9-13 year old boys who love cartoons. Also want to aim for Waffle lovers and college students who always study outside. We want the audience to see how unique and creatively they are creating their own waffle masterpiece and spread awareness that food creations are endless.
As Cosmic Waffle focuses on family tourist of children around 9-13 year old boys. We want to make them to have a feel of welcome and adventure in Chicago downtown. Have them to make Cosmic Waffle as one of the highlights of their Chicago trip. To stand out of the competition, we want to bring the cartoon vibe to the truck and make the truck interactive.
Adobe Photoshop
Adobe Illustrator
Adobe Dimension
Adobe Xd
Sep 2020, Jan 2021 - Apr 2021 (~13 Weeks)
Illustrations
Foodtruck
3D Packaging
Augmented Reality
UI/UX
Gaming
Looked up how other food customization foodtrucks function and designed. Looking up the possibilities of existing waffle creations. Cartoon-style art like Sonic Colors and the simple outfit Space Dandy wears. Also researched on how food menus can be used with AR
Decided to have a mascot as our brand because it is something people can easily remember other than the name of the brand. To appeal to 9 to 13-year-old boys, the mascot is a space soldier exploring the waffle solar system as he takes down waffle UFOs and uses them as his creation.
The word “COSMIC” has an enclosure to emphasize the space part and the word “WAFFLE” with some modifications to emphasize the futuristic feel
Live Area = x/4, When x = Height of the Logo
min usage = 0.95” width
Live Area = x/4, When x = Height of the Symbol
min usage = 0.5” width
Live Area = x/4, When x = Height of the Logo
min usage = 0.5” width
Live Area = x/2, When x = Height of the Logo
min usage = 0.47” width
Live Area = x/2, When x = Height of the Logo
min usage = 0.9” width
cmyk: 0/30/90/0
rgb: 253/185/51
web safe: #ffcc33
pms (solid coated): 136 C
cmyk: 30/80/100/30
rgb: 138/63/30
hex web safe: #993300
pms (solid coated): 1685 C
cmyk: 100/80/30/20
rgb: 63/18/109
hex web safe: #003366
pms (solid coated): 654 C
cmyk: 70/80/60/80
rgb: 13/19/26
hex web safe: #000033
pms (solid coated): Black C
The mascot of Cosmic Waffle will be your guide throughout the app, giving the users direction, reminders, and feedback. He is the only one with a heavy outline because he is the primary target for users to look at first. Graphics like the UFO Waffle, Comet Waffle, Saturn Waffle, etc are treated as secondary and background visuals.
You can’t have a food truck without food packaging. It starts with a paper food tray for the waffles. I use a common hot dog food tray from a gas station as my die-cut template. I unfold the tray, scan it, and create the die-template via Illustrator. I treat the waffle tray as a mission for the customer to munch down their food. Once they are done, they will see a message from the mascot congratulating them for finishing the mission.
Photography by Emily Amponin
Explored the concept packaging for the waffle creations. From a cone-shaped tray to a box with a cover.
I used a hot dog tray from a gas station and that will be the waffle food tray. I unfold the tray, scan it, and create the die-template via Illustrator. I used my iPad with AR technology to do my measurement.
During the time I worked on this project, I didn’t have access to a color printer, but I do have extra food trays I got from a gas station. I decided to make a little photo studio with the tray and some ice cream and waffles, with a little help with photography skills by my oldest sister. I used her photos and turned them into Photoshop mockups both empty and loaded trays. I also used existing photos of trays at the web for iterations.
The way I sketched the food truck was using a stock photo of a food truck and printing it out. Then I use graph paper over the printed page as a template.
I used the stock photo and trace it to create design flats so I can apply them to the stock photo as a Photoshop mockup as a reference. I designed the truck as the mascot is on a space adventure exploring the solar system with the waffle comet, waffle saturn, and waffle UFO.
I later used those flats and graphic assets to Adobe Dimension where I applied them to the 3D Food Truck from Adobe Stock. I rendered multiple angles of the truck and created mockups in a real-life setting in the streets of Chicago.
The goal of the mobile app is not only to customize your waffle creation on the fly and get it faster than anyone else, but it lets you be immersive with the brand with Augmented Reality towards the Foodtruck. The waffle QR code is both the link to the mobile app and a visual marker to trigger AR. The app wants to interact with the truck as much as possible, supported by 3D models from Adobe Stock & 3D Warehouse. Since Cosmic Waffle is targeted at kids and families, the mobile app makes sure that the kids are safe. The app does not require any movement other than rotating the phone, especially for the AR game Cosmic Shot where standing still is bonus points during the game.
When it comes to payment options, the confirmation buttons will be locked out until you selected a payment method and re-enter the password (existing users) or create an account (guest). This part is where the child gives the phone to their parent to order the food. While the waffle creation is being placed and in the process of making it. Users can play the AR game Cosmic Shot where you can shoot the waffle UFOs in the first person to score points. The purpose of the game is to kill time, especially for a waiting child.
How I do sketches is creating a flow chart. Each sketch contains a certain element on what it can do. From going to a different slide or encounter an micro-animation. Also created other elements such as the customization of the battery indicator for the settings menu.
Started out with wireframing the overall layout of the app. Next is creating rough iterations of the UI of the app. A lot of trial and error.
Once the iteration is set in stone for the brand, it is time for connecting the paths for each design flat to create a functioning Prototype.
