1 of 42

Vegan Mario’s Redesign

GF Bakery

Ojai, CA

2 of 42

Ideate

Empathize

Design Thinking Process

Define

01

02

03

Prototype

04

IA Redesign

Sketches

Wireframes

Discovery

Research

Comp Audit

​

Persona Synthesis

Problem/Solution Statements

Card Sorting

Task Flows

Malik’s happy path

Sarah’s happy path

3 of 42

Test

Table of contents

Future Steps

05

06

Usability Testing

4 of 42

Empathize

01

5 of 42

Where our story begins

6 of 42

Common themes between 6 interviews:

7 of 42

Common themes between 6 interviews:

Noticeable trends:

​

  • “I am confused by the website’s disorganization.”

​

  • “I feel visually assaulted by the text on the homepage.”

​

  • “I find the Information Architecture of Vegan Mario’s website to be out of order.”

​

  • “I find I’m reliant on the search bar because I can’t navigate the website effectively.”

​

  • “I find this website feels cold.”

​

  • “I don’t trust this website.”

8 of 42

Competitive / Comparative Audit

9 of 42

Define

02

10 of 42

11 of 42

Malik Wallace

Problem statement:

​

Malik, works from home studying lightning as a Fulminologist. His partner recently found out she has Celiac Disease and needs to eat a gluten-free diet. Malik is supportive and wants his partner to be able to enjoy bread. He found out about Vegan Mario’s website, and wants to purchase bread and store credit for her to start her journey, but is lost when he opens the homepage. Additionally, to ease his partner’s anxiety around foods, he wants her to feel warmly invited on her gluten-free journey and finds Vegan Mario’s website to be cold.

​

12 of 42

13 of 42

Sarah Farmer

Problem statement:

Sarah works full time as an Archaeologist and is constantly on the go with her job. She loves having Gluten-Free Vegan food to keep her body healthy. She wants to order from Vegan Mario’s website since she can’t always find his bread in stores. However, she finds his website hard to navigate, and struggles to find items within her interest because of the site’s lack of organization.

14 of 42

Solution statement:

Solution Statement:

Vegan Mario’s, a Gluten-free Vegan bakery, offers a means for users to purchase gluten-free baked goods online, allows visitors to effectively browse Vegan Mario’s offerings, and easily locate and order desired items throughout its redesigned website.

15 of 42

16 of 42

How might we better organize the Information Architecture of Vegan Mario’s website?

17 of 42

By identifying how users internally organize this information.

How might we better organize the Information Architecture of Vegan Mario’s website?

18 of 42

Open Card Sorting

19 of 42

Affinity Mapping with the Card Sort

20 of 42

21 of 42

22 of 42

Ideate

03

23 of 42

Task Flows

24 of 42

Task Flows

Changed “Classes and Services” to “Classes & Gift Cards” based off Usability Testing

25 of 42

Task Flows

26 of 42

Task Flows

Users identified a need for a quick search function

27 of 42

Ideation

28 of 42

Ideation

29 of 42

Ideation

30 of 42

Ideation

31 of 42

Ideation

32 of 42

Ideation

33 of 42

Ideation

34 of 42

Ideation

Let’s get that bread.

35 of 42

Prototype

04

36 of 42

Prototype

04

37 of 42

Prototype

04

38 of 42

Test

05

Usability test:

“Please find and purchase a California Brown Rice Sourdough Loaf and store credit in one purchase.”

    • 3/3 participants successfully completed activity.
    • Valuable feedback:
      • Phone # was too small on ⅔ users’ screens
      • 1 user was clicking outside the drop down menu to make it collapse, which suggests that would facilitate navigation
      • One user struggled to read the current “Vegan Mario’s” logo - consider logo redesign
      • Subtotal is off for CA Sour and Gift card (Fixed)
      • Shipping not auto-updating with different options
      • Discount code doesn’t say what the discount is, so “10% off” was added

39 of 42

Test

05

Usability test:

“Please locate and purchase one Medicinal Chaga Loaf and then use the search function to find Crazy Cashew Cream Cheeze to purchase together.”

    • 2/2 participants successfully completed task without aid.
    • Valuable feedback:
      • ⅔ users found the “Description” text was hard to read
      • Gapping on the “Subtotal”, “Tax”, and “Shipping” sections
      • ⅔ users were unsure if the header “Classes & Services” included gift cards, so it was changed to “Classes & Gift Cards”
      • Drop down in Global header was not popping down on “THANK YOU” page, which has been fixed

​

40 of 42

Gapping updated

41 of 42

Future Steps

06

​

  • Experiment with complimentary typefaces and larger font sizes for smaller body text
    • Re-test on smaller screen
  • Rename product listing to more straightforward names without all caps
  • Consider a more clear logo
  • Responsive design
  • Develop into hifi

42 of 42

I openly welcome your feedback and guidance to help shape my design process, so tomorrow it may rise.

Thank you kindly for listening