OLD GRIST MILL
UX Design Concept Transformation
My Role: Lead UX Designer and Researcher
Overview
Problem: 19 % of American adults have food allergies¹. Even more avoid specific foods due to dieting, overall health, and pickiness. With the current Old Grist Mill website, customers are unable to look at photos, ingredient lists or descriptions of the products which discourages them from ordering.
Solution: I redesigned the options list for Old Grist Mill, adding photos, descriptions, and ingredient lists. I added an online ordering system for all products and made the website simplified and beautiful.
Before


Design Thinking Process
Empathize: In this part of the process I put myself in the shoes of potential Old Grist Mill customers and identify the human requirements. I interviewed potential users of the website to understand their pain points and needs.
Define: I defined the problems with the current website and the areas for improvements in the transformation design.
Ideate: I brainstormed ideas that could establish requirements and build the most exceptional experience for all Old Grist Mill customers.
Prototype: I created several different prototypes ranging from basic wireframes to high fidelity prototypes to use in user testing.
Test: I designed and conducted user testing to identify problem points in my prototypes. Using this feedback, I edited my designs to achieve my goals for this project.
Wireframe

Mid Fidelity Prototype





User Testing
1. I planned, designed, and conducted user testing to be done using the mid-fidelity prototype.
2. I targeted questions toward the ordering process, the ability to learn about each option, and the overall organization and intuitiveness of the website.
3. I found that I needed to relabel and resituate sections differently to make the process simpler for the target audience.
Accessibility and Branding
I used Adobe Color Wheel and WebAim Accessibility to choose font colors and sizes to use on the transformed website. This is important because I want the website to be very accessible for all people. I choose a strong brand that comes from the color combinations from the baked goods that can be bought from the company. This creates a strong brand connection between the website and the product.
High Fidelity Prototype







Impact:
-
Easier for users to navigate to each page and achieve their goals.
-
More informative so that people can clearly see and understand the product through pictures, descriptions, and ingredient lists.
-
Exceptionally user friendly system that improves the overall experience of a customer.
​
Tools Used:
-
Figma
-
Adobe Color Wheel
-
Procreate
-
WebAim Color Checker
​