UX Designer and Strategist
Dizzy Pig is a spice blend company with a plethora of flavor solutions. From curry to Mexican and steak seasoning to a fruit blend, Dizzy Pig is Flavor For All.
Ask/Solution
Expand the Dizzy Pig Brand.
The first step to getting the blends into peoples' kitchens was a website redesign for a better customer experience from functionality to content and design.
Website Architecture
Altogether the website had around 1,000 pages made up of a store for spice blends and merchandise, newsletters, recipes, events, and more.
In reorganizing the website, we had to consider people that were first-time viewers, current Dizzy Pig buyers, first-time wholesale buyers and current wholesale buyers.
Color and Typography
The spice bottle labels use every color of the rainbow. So it made sense to pull from the current colors. We chose easy-to-read Google web fonts that shared similarities with the company's bottle design.
Research
I interviewed current customers, people who had never heard of Dizzy Pig, and wholesale buyers of Dizzy Pig and then created user journey maps and website mockups on paper. From there, wireframes to high-definition mockups were created using Illustrator, Sketch, and Invision.
Journey Maps and First Draft Wireframes
DizzyPigBBQ.com
The homepage focused on first-time viewers on mobile and desktop with a succinct synopsis of the company.
For people that know what they want, they have several options to quickly buy the spice blends and gift packs.
I found through analytics that the recipe pages were the number one gateway to turning a person into a Dizzy Pig customer. It was obvious to highlight a few of the recipes trending on their Pinterest account and found organically.
The footer's hand-drawn icons answer the most frequently asked questions. They are discussed in further detail on another project page.
Which Spice Blend?
Options are great. However, there was a purchase barrier for customers that didn't know which blends to try from their 20+ selection.
The solution was an interactive chart focused on dietary restrictions, the level of heat, and category of food for use by the cook.
In addition, it was an opportunity to show off the quality of the product with photos of the spices outside the bottle.
Shopping Experience
I applied Steve Krug's book, Don't Make Me Think, and the quantitative research to the interaction design and content with:
1. Quick buy options on store landing page
2. Instant visual cues after items are added to the cart
3. Filters for a product searches
B2B Shopping Experience
After a wholesale buyer has logged in, their homepage and shopping experience are different from other customers.
Homepage focused on ordering product, store displays, and literature.
Quick-buy page is an order form with camera icons by the product names. When the icon is clicked or touched, an image overlay of the product and description appears.
Everything is simpler for fast transactions as the wholesale buyers are familiar with all products and want to save time.
Additional Website Pages
The website has hundreds of additional pages designed with an intentional user experience. Here are a few visuals of them (Events, Cooking Classes, Login/Register, FAQ, Search, and Media Kit).
Results
Dizzy Pig's website is now user-friendly on mobile, tablet, and desktop. With the use of analytics, we have been able to see that there is an increase of people staying on the website longer on all devices.
The next steps would be to refine the content, use geotargeting, and conduct a/b user testing.
Specs
Responsive website
Tools
Pencil + Paper
Adobe Creative Suite
InVision
Qualitative + Quantitative Research
Work
Microsoft Give WonderExperience Design
Achieve more with Office 365Experience Design
Do more with Microsoft's WindowsVisual Design
Microsoft Office WidgetUX and Visual Design
Microsoft Channel Summit Concept and WebsiteUX and Visual Design
Dizzy Pig BBQ Co WebsiteUX and Strategy
Eradicate Homelessness in Richmond, VirginiaUX + Visual Design + UX Research + Website Development
Office and Apple Instructional VideosCopywriting and Design