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
*Project brief is provided by the Interaction Design Foundation
Duration: July 2020 - August 2020
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 Map
Below is a customer map that I created to help me narrowing 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 were the opportunities to enhance user experience. It also provided the structure when creating my site map and wireframes.
Customer Map
UX Detail
Site Map
As mentioned before, FreshKit needed new web pages to allow customers to use the new on-demand service. The sitemap below illustrates how I structured the webpages; including a new landing page, product search page, product detail page, and a 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 layout. 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 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 in order to make the users feels like they are navigating through an app.
Test & Iteration
After building the high-fidelity prototype, I had five users tested it to understand their navigation flow, and specifically how they searched through the menu page.
Key Observations:
100% of the users appreciated the menu page allowed them to sort through most popular dishes along with a variety of filters. It allows first-time users a chance to gain a quick understand 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.
