The flying fruit cafe
Graphic Design | Prototype | Wireframe
did I do?
Redesigned the Order-Sheet for The Choice Program be used at The Flying Fruit Cafe, Baltimore.
Developed Interactive App Prototype as an alternative to paper order-sheet for future implementation.
did I do?
Existing order-sheet was cluttered & confusing for baristas as well as customers. The client wanted it simple, intuitive and efficient for the customer to fill and baristas to understand it.
The Choice Program | UMBC
Aug '16 - Oct '16
Graphic Design, Prototype, Wireframe.
This Graphic Design project was a part of course HCC - 710 : Graphic Design for Interactive Systems. This was a semester-long project for The Flying Fruit Café, University of Baltimore in partnership with The Choice Program. Main objective was to redesign the Order-Sheet for the café and come up with an Interactive Version for the Order-Sheet which would eventually be installed on Order-Kiosk at Café. This project basically puts in all the graphic design illustration done for the UMBC The Choice Program-Flying Fruit Kiosk. This project was mentored by Dr. Amy Hurst
Map-Exploration Theme was used to present a printed portfolio for the project. Portfolio unfolds from a square piece to full-size map revealing whole design process sequentially. Graphic Design was done in Adobe Illustrator and the Prototype was created on MarvelApp.
Understand aspects of Typography & Graphic Design.
Re-Design Order-Sheet, Napkin Holders & Coffee Air-pot Covers.
Present whole process in Printed Portfolio to the client.
Learning Graphic Design Basics:
Understood aspects of Typography & Graphic Design.
Hands-on: Key forms, Grid, Spacing, Abstract Design and Typography.
On-site observation - First-hand client site observation.
Informal User Interview - Problem faced, improvements needed, understanding the order process.
Wire Frames and Prototypes creation:
Created wireframes - Portrait mode & Landscape mode.
Iteration - based on user feedback, revisited the design in 3 iterations.
Using MarvelApp - created an interactive prototype for portrait-mode using finalized wire-frame design.
Finalizing Print Portfolio:
The portfolio unfolds from a square piece to full-size map unveiling whole design process, sequentially. The design was set on a huge poster, front and back. The folded version would start from a single cover page with title and the second one would be content-page, sequentially unveiling the whole portfolio in exploration-map fashion. Here I have unveiled the front and back design of the poster.
v 0.0 | Existing Order Sheet
This Breakfast Ordering sheet was being used at cafe by customers.
v 1.0 | First Design
First Design with graphics and basic idea. Landscape Layout.
v 2.0 | Landscape
Improvements after first iteration based on feedback. Using Column Grid.
v 2.0 | Portrait
Improved design wire-framed in portrait mode for better flow of selection.
v.3.0 | Final Landscape
This was finalized design in Landscape layout.
v 3.0 | Final Portrait
This is finalized design of Order Sheet in Portrait Layout.
v.1 Feedback 2
v.1 Feedback 1
v 3.0 Feedback - Existing Design
v 3.0 Feedback - Column Grid
v 3.0 Feedback - Manuscript Grid
Learned Visual Communication Principles- Sketching, Typography, Color, Grids, Layouts, Image Manipulation, Visual Language
Learned Adobe Suite tools- Photoshop, Illustrator.
Learned iterative design process, Design Critiquing methods (The Hamburger Method)
Requirements gathering and accordingly defining the Visual Language for the Order Sheet, Napkin Holders & Air-pots.
Detailed creation of the Style Guide - Layout, Typography, Color Scheme, Image-Text ratio
Idea Generation- From sketching to Mock-up to Final Designs.