Grit

Overview

Grit Herbal Chew is a modern tobacco-free dip company that strives to provide a cleaner dip that gives the same effects of regular smokeless tobacco.

GOAL

Help Grit reflect its target audience by rebuilding their desktop and mobile website.

MY ROLE & RESPONSIBILITIES

I worked with a team that was very collaborative throughout the entire design process, but there are a few areas where there were tasks that I took in:

Competitor Analysis
Iterating the Sitemap
Wire Framing
Prototyping

TIMELINE

Grit was created from research to final prototype in two weeks.

Who is Grit?

Grit Herbal Chew is a startup company that offers a smokeless alternative to traditional dip. The Grit Chew website was designed to attract tech-savvy businessmen who are looking for a high quality tobacco free alternative. I have observed that the website is not reflecting the desired user which is causing a decrease in website traffic and less business. How might we improve the Grit Chew website so that it appeals to their target customers and our stakeholders feel successful in communicating their brand identity?

Goals:

Refine brand identity
Highlight competitive advantage
Make mobile website more accessible and functional

User Research

Grit provided previous user interviews and research that they conducted. Many user stories were similar to the one below where they wanted cleaner ways to consume nicotine. This gave me more insight into who Grit's target users are.

"Came across Zyn from an intern who was doing Zyn at the office; Office was tobacco free and smoke free so it was a way around. Plus it is discrete and you don’t have to spit...Now at work a lot of people are dipping Zyn."

Redesign Process

Heuristic Evaluation

Once I had a better understanding of who Grit's ideal users are, I redlined their current website.

I noticed that the imagery didn't align with who their ideal user is. There were accesibility issues as well witht the white text overlayed on busy photographs.

Also, there were broken links as well as concistency issues with icons.

Competitor Analysis

I then evaluated direct and indirect competitors to understand how their e-commerce sites are designed.

Brands such as Black Buffalo, Juul and Nicorette, as well as others, competing within the same alternative tobacco industry have a defined brand image and large base users.

The tobacco industry seems to be a niche pocket and within that industry some try to capitalize on that such as Black Buffalo whereas others like Juul attempt to market to a completely different demographic.

They competitiors had well done branding and slogans along with game design techniques. They also had visually appealing websites in relation to each product.

Ideation

Sitemap

With a small amount of copy I was able to condense and consolidate the information to make navigation easier. This included reducing the header to just a primary and secondary navigation.

Low Fidelity Wireframes

Once the sitemap was complete, I outlined how the website would look.

For a responsive web design, I started with the mobile wireframes first, then sketched the desktop. These wireframes are simplified to stay focused on the user flow.

User Interface

Style Guide

When creating the style guide, I referred back to Grit's target users who are urban businessmen who are tech-savy.

For this reason, I chose a simple color scheme. The gold colors are taken from the Grit logo. It's contrast with the dark colors give the products a more premium feel. I also made sure to test the color contrast accessibility.

I wanted to make sure that the images used were relevant to this urban lifestyle while also matching the cool tone of the mint-based products.

Final Product

High Fidelity Mobile Prototype

The Home screen has a call to action "Buy Now" button as well as more information about Grit. The Shop tab displays all four products that lead to a product page with a description of each.

The About tab has a carousel with buttons that navigate to the "About Us", "FAQ", and "Contact Us" sections of the page respectively. The Cart icon leads to the cart page that has a side stepper to identify which step of the process the user is on.

Next Steps

If I had more time, I would have changed a few things and added more features.

Additional Research

Due to the two-week timeline, I was limited to using previous research that my stakeholder conducted for his start-up. With more time, I would have conducted more quantitative interviews with users that more closely match Grit's target audience. I want to better understand the user's thought process when choosing a chew brand online.

Update Prototype

In the future, I would like to add more features to the Grit website as the company grows. My stakeholder mentioned wanting to add a rewards program, and this would be a good opportunity for gamification or positive reinforcement to bring back users. I also would like to add product reviews and more detailed product photos as sales increase.

Conclusion

This was my first experience being able to make a real impact. The Grit team won 1st place in the MSTC class competition, and they won 2nd for a money pitch for the Texas Venture Labs Competition.

Working with a startup company has allowed me to improve my collaborative and communication skills. The highly accelerated timeline for this redesign has helped improve my time management skills.

I improved on my UX/UI design skills like analyzing interview data in order to better understand the user and conducting a heuristic evaluation of the original website. I also learned how to translate a competitor analysis into strengths and weaknesses to consider in the redesign. I realized the importance of color accessibility and testing this when creating a style guide.