Ocado are a British online supermarket who deliver groceries and home essentials directly to their customers. They’re considered to be the world’s largest dedicated online grocery retailer and offer their services solely online. In this 10 day sprint, my team and I were tasked with designing the UX and UI for a new feature on the Ocado website in which users can purchase hobby kits that provide all of the equipment and tools necessary for users to kick start a new culinary hobby. The 2 main requirements in this project were that we provide users with the ability to customise their kits and also to provide them with access to guidance, for instance in the form on video tutorials.
Why hobby kits?
Country-wide lockdown orders due to the novel coronavirus has been difficult to adjust to for many. Being stuck at home with minimal resources to serve yourself a healthy dose of entertainment has left more than a few feeling a little antsy and bored to say the least. As I’m sure you’ve all seen from the recent over saturation of banana bread and sourdough loaves plastered all over your Instagram feeds, many people have been dealing with boredom and restlessness by picking up new found home culinary hobbies.
This had presented a huge opportunity for Ocado to feed interest by providing hobby kits to new and existing customers.
What’s Already Out There?
We kick started the design process by conducting some competitive analysis. We delved into 4 features which we believed to be imperative in shaping how we move forward with the hobby kits feature and we did so by comparing sites that are similar in nature to Ocado, those sites being: Tasty*, Yomodo, Prezzybox and Baked In.
*not a direct competitor
Competitive analysis helped us in identifying ways that Ocado could differentiate themselves in the Hobby Kit market. The means in which we deemed to be the most important based on what we had discovered were:
- Product Reviews — Only 2 of the 4 sites included a review section. After comparing these sites to those that didn’t, we believed this feature to be extremely important to the site as it adds a sense of trustworthiness to the company and also allows customers to exchange their experiences in regards to previously purchased hobby kits.
- Online Instructions — None of the competitors offered this on any of their hobby kit services. Instead, they were presented in the form of instructions on paper which would be sent alongside the hobby kit. Exploring an array of different mediums for offering instructions would be key as the means that are currently provided are very limited and may not be suited to every customer’s needs, so providing customers with the option to choose would be vital in meeting each invididuals’ needs.
- Kit Customisation- Although this was already a requirement of the task, competitive analysis further proved just how important it would be in making the users’ experience completely catered to their needs. A majority of kits we came accross already contained items in which customers would most likely already have at home such as flour and salt in a bread baking kit.
Getting To Know Our User
Our next step was to become directly familiar with our users through screener surveys and user interviews.
My team and I interviewed 11 users via zoom. We used a process called a process called Affinity Mapping in which we compiled individual findings and related facts into distinct clusters to identify trends in research.
We discovered a few key themes from the affinity mapping process, the main ones being why people learn hobbies, how they learn them, their inspiration, the environments in which they undergo their hobbies, their blockers and what a hobby kits means to them.
Based on the information we gathered, we concluded that:
- A large majority of users enjoy learning new skills
- Users enjoy being challenged
- They use hobbies as a means to switch off after work
- Their main inspiration tended to be from external sources so reviews and recomdations are very important
- Most people find their recipes online, mainly from video tutorials
- Main blockers were time, cost and confidence
Defining Our User
Based on our research, we made a user persona in order to put ourselves in the shoes of our users and quantify our collective findings.
We dove a little deeper into Alexa’s mindset through the use of an Empathy Map which allowed us to articulate what she says, thinks, does and feels based on the outcome from interviews and affinity mapping.
Now that we had more of an in depth understanding of our target user, we wanted to explore a typical senario that Alexa might find herself in. We used user research to put together an Experience Map which displayed an instance that was emblamatic of the collective information gathered to articulate the current end-to-end customer experience.
Solving The Users Problem
Before ideating on possible solutions, we created a problem statement which helped us create a concise description of the users’ issues and unmet needs. We ideated individually and used our collective ideas to formulate the following problem statement for Alexa:
How Might We Solve Alexa’s Problem?
We used ‘How Might We’ statements to turn the users’ problems into opportunities for design. We worked together to come up with 4 HMW statements but settled on 1 to take into our design studio:
Time To Ideate
Our HMW statement allowed us to come up with a few possible solutions of ways in which we could satisfy the problem statement. There were 2 phases to this process, the diverging phase in which my team and I came up with solutions individually, and the converging phase where we brought our ideas together, collated them into a table and used a dot voting system to choose which ones we thought would best suit our users needs.
The votes shown above indicated that a majority of us agreed that a a skills builder, filter/preference function and subscription service would be the most suitable potential solutions.
Before inaugurating the design process, we created a user flow to show Alexa’s journey through the app. This displayed the pages that she would see and the possible actions in which she could perform. We wanted to focus our flow on the idea which could provide us with the most functionality, so decided upon the ‘Special Filter’ option. In this particular senario, Alexa has landed on the Ocado mobile website and she wants to purchase a hobby kit.
Green boxes display the happy path where Alexa would land on a page, find a kit and eventually make her way to the checkout. We also added an option called ‘Help Me Choose’ which is the first decision box; here Alexa could input her preferences and have her results catered to what she already likes and current interest. We also included a ‘customise kit’ decision box, which is focused more on the breif which asked us to allow the user to choose which items are in the contents, so if she already has a piece of equipment in the kit, this would allow her to remove it from the hobby box.
It was now time to collate the ideas that we’d settled upon into the first iteration of how of it would look upon implimentation.
Sketches for the following features can be seen below:
- Preference Specification
- Skills Builder
- Kit Customisation
- Product Reviews
- Instructional Content
Time To Deliver
Now that we had our initial framework settled upon, it was time to test and iterate on what we had to ensure that our users needs are met at every stage.
We performed 2 rounds of testing as we moved up through fidelity. The first tests we did were on our lo-fi sketches which we then iterated on according to user feedback to mid-fi, and used this same process to for our mid-fi to progress this onto hi-fi. Changes were made based on key insights from each round of user testing. A few instances of these changes can be seen below and are accompanied by the user feedback and and the ‘fix’ in which we made to solve the issues addressed.
These iterative changes made based upon feedback and insights led to the production of a final high fidelity prototype which can be seen below.
Key Learnings And Next Steps
There is always room for improvement.
Observing the way in which my team and I meshed so perfectly together as a working unit over the 10 days was one of the most gratifying parts of this project. Our working styles complemented one another so perfectly which I think was mainly down to our open, judgement free approach to communication. Even though this project was conducted remotely, I felt as though the amazing Fina, Ryan and Faisal were my office desk mates.
This 10 day sprint was only a few pixels in the larger picture of the evolution of the hobby kit feature. As can be seen below, my team and I have future plans in the offing, however my main focuses would be on developing upon the ‘Surprise Me’ feature and conducting more tests which would lead to further iteration.