FreshKit.
No commitments, order as you go.
FreshKit is an on-demand meal-kit service concept tailors to customers that have inconsistent schedules, yet trying to maintain a healthy, and balance diet.
Project overview
Roles: UX Designer, UI Designer
Problem: People do not have complete control of the amount of meal-kits they order each week
Design goal: Create new web pages that allow customers to use the new on-demand meal kit service
Client Brief:
In order to differentiate themselves from other meal-kit giants like Blue Apron and Hello Fresh, they are offering an on-demand service. They are hoping this will become their niche and allow customers to order meal-kit whenever they desire.
Currently, Freshkit’s website does not offer the function for customers to buy individual meals. They are asking to create a new website that lives on a subdomain of their existing website. They would like the pages to have an emphasis about the on-demand service and make the new shopping experience simple and effective.
Constraints:
Client’s requests
Search and filter function
Most popular
Allergies
Vegan & vegetarian
Product detail page
Recommends similar meals
Target Users:
21 - 35 year old health-conscious male and female
Value flexibility
College students and adults who work in an industry that does not have a fixed work schedule.
Ex: hospitality, retail, medical
Setting the stage
Problem
One of the major setbacks for meal-kit services is they require commitments. For customers work in industries that have inconsistent and unpredictable schedules, it is hard for them to commit into a subscription based service. People do not have complete control of the amount of meal-kits they order each week. These customers want to maintain a healthy diet without having to commit.
Long-term goal:
Become the meal kit service that is known for customization.
Potential hurdles
Customer journey map
Below is a customer map that I created to help me narrow down the challenges a customer might face when using the website with the combination of the How Might We questions. It painted a clear vision of where the opportunities were to enhance user experience. It also provided the structure when creating my site map and wireframes.
Customer Map
UX
Site map
As mentioned earlier, FreshKit required new web pages to enable customers to utilize the new on-demand service. The sitemap below illustrates the structure of the webpages, including a new landing page, product search page, product detail page, and checkout page.
Sketches
After I created the site map, I used an exercise called the Crazy 8’s to challenge myself to sketch 8 different ideas in 8 minutes to envision how the web pages would lay out. I did the exercise four times, one per web page. The point of this exercise was to push beyond the first idea I had and come up with more ideas that could potentially be better.
Crazy 8s
Wireframes
One of the challenges that I faced when creating the wireframes was to ensure the customers understood FreshKit’s new approach to their service, and provide them with a simple and seamless shopping experience.
Landing Page —> Product Search —> Product Quick View —> Product Detail
Check out Process
Visual Direction
After the client approved the wireframes, I created a style board to visualize the experience FreshKit is trying to provide to potential customers.
Prototype
Below is a walk-through of the mobile web interface of FreshKit. My priority was to optimize the navigation flow of the interface to make the users feel like they are navigating through an app.
Test & Iteration
After building the high-fidelity prototype, I held five users test to understand their navigation flow, and specifically how they searched through the menu page.
Key Observations:
100% of the users appreciated that the menu page allowed them to sort through the most popular dishes along with a variety of filters. It allows first-time users a chance to gain a quick understanding of what past customers enjoyed.
40% of the users thought it would be useful to have a confirmation button after selecting the delivery time and date.
80 % of the users thought the recommendations at the end of the product detail page would intrigue them to order more than one dish.