TopPot-Hed1

TOP POT DOUGHNUTS

TOP POT DOUGHNUTS

TOP POT DOUGHNUTS

UI Design
Class Project

UI Design
Class Project

UI Design
Class Project

UI Design Class Project

UI Design Class Project

School of Visual Concepts

Project brief: Seattle institution, Top Pot Doughnuts brought a hypothetical redesign of their website to the School of Visual Concept’s UI 101 Design class. 
Challenge: Top Pot’s website had not been updated in a number of years, and was not responsive. The company also suffered from inconsistent branding. The class assignment was to develop a new design from client creative briefing through design presentation.
Team: Instructor, Top Pot owners, Class critique.
Role: Researcher, Developer, Designer
Strategy: My (informal) market research directed me to focus on the design and atmosphere of the Top Pot Stores. Photography plays a big role, showing appetizing food, coffee and the blond wood, hand-crafted bookshelves that are in every location. From the client’s strategy briefing, I found “hand-crafted quality you don’t get just anywhere” to be the key point. 
Solution/Effect: Created a design balanced between stylish and quirky that was well recieved by instructor and class. 

Skills

Brand Definition
(Informal) Market Research
Design
InVision
Photoshop
Illustrator

UX

Development

Site map 

Site Map

Personas

Persona study for website dev
Persona study for website dev
Persona study for website dev

User Flows

User Flow3
User Flow 2
User Flow 1

Visual Design

Development

Competitive doughnut/bakery brand landscape

Chart of Doughnut retailer competivie brand landscape

Creative Direction

Wireframe_Mood_PhotoStyle3
Wireframe_Mood_PhotoStyle4

Mood Board

Mood Board

Top Pot Mood Board

UI

Development

Development

Wireframes

Wireframes

 

Wireframe of Home 1
TP-Home2-070919
TP-locations2-070919
TP-Store2-070919

Wireframe User Flows

User Flows 2_Page_1
User Flows 2_Page_2

Visual Design Ideas

TopPot_home_v2
Top Pot idea 2 home

Final Responsive Designs

Desktop

Home

HOME_Desktop2

Locations

LOC_Desktop

Store

CH_Desktop

Tablet

Home

HOME_Tablet

Locations

LOC_Tablet

Store

CH_Tablet

Mobile

Home

Design for Mobile version of site

Locations, Menu Expanded

LOC_Mobile Menu2


© Claire Brandt 2019