The Backstory:
Groundwork Coffee is a certified organic, fairly traded, and ethically sourced coffee roaster in Los Angeles. They offer catering, delivery, coffee subscriptions, online shopping and have over fifteen locations in California and Oregon.
Problems to Solve:
In 2015, Google announced a change to its algorithm in which websites that weren't mobile-responsive would be phased out of search results. Companies were encouraged to create designs curated for a mobile experience. At the time, Groundwork's website needed some digital renovation.
My Role & Mission:
I was the lead experience designer responsible for research, wireframes, user journeys, sitemaps and learning how to re-create the shopping experience utilizing each product in the database.
A Structured Beginning
There were a lot of elements to consider and many pieces to keep organized. In dealing with a smaller screen size, it was important to determine what elements could stay the same and what could be improved.
Card Sorts & Sitemaps
The website had a lot of moving parts. I needed to get it organized to fully understand it. I used a card sort method to begin categorizing topics. Naturally, this allowed for a clear direction of how to display information, then I created a sitemap.
What were the other pain points? Once the information was structured, it was important to know who the users are and what their path to completing a sale would be.
Competition & Journey Map
I visited various coffee shops, conducted surveys and interviewed customers to create personas. It was determined that a shopping experience similar to Amazon was what they wanted.
From there I mapped out user journeys and learned what the competition was doing through a thorough market analysis. In this process, I discovered that other companies had better mobile experiences.
Determined to succeed, I began to sketch.
Crucial Simplicity
Keeping simplicity in mind, I started with a re-design of the website for mobile, tablet and desktop. Then, I created clickable wireframes as a prototype to test my findings and learn how to improve.
Shopping Cart 2.0
The prototype tested well and the site began to feel new and fresh.
I took my prototype into the world for further testing. This was a huge success and drove up revenue in my controlled environment. Great news! It was ready for production.
Mockups & Next Steps
A hifi concept was created of a few key screens and delivered to the client to visualize how a responsive-site might look. The final step was reviewing analytics to determine where customers were bouncing off and what improvements could be made moving forward.
