🐕

IMBY

Intro

IMBY (In My Backyard) is an innovative pet food brand based in Belgium, leading the charge in sustainable and responsible pet nutrition. IMBY takes a revolutionary approach by offering premium insect-based dog and cat food products. Their philosophy centers around two core principles: uncompromising quality and unwavering commitment to sustainability. They understand that pets deserve nothing but the best, which is why their products are meticulously crafted using top-notch ingredients. Emphasising the importance of wholesome nutrition, IMBY ensures that every bite is packed with essential nutrients to keep our furry friends healthy and happy.

image
Navigation

My Role

UX Strategy

UX Design

Prototyping

Product Management

Team

Mun Yee (UI Designer)

Annabelle Tan (UI Designer)

Tools

Figma

Adobe XD

Miro

Wordpress

Timeline

3 months

💭 The Problem

  1. The structure of IMBY’s website is confusing as information is scattered left & right making it difficult for users to navigate
  2. The sporadic and inconsistent usage of colours, different icons & graphic elements also makes it hard for users to find for information that they need.
image

👩🏼‍🔬 Hypothesis

We believe that presenting information in an organised manner, particularly from left-to-right & top-to-bottom would make it easier for users to navigate and comprehend the content as it is the natural reading habit.

We also believe building a design system would improve user experience as it would create visual consistency. Consistency in design helps users understand how to interact with your product, reducing confusion and enhancing user experience.

🧪 The Solution

When designing pages, our website is designed with a clear left-to-right and top-to-bottom organisation, ensuring that users can easily navigate and find the content they need without any confusion.

image

We focus on presenting only the most important information that aids users in their decision-making process. This includes highlighting product Unique Selling Points (USP's), benefits, packaging formats, sizes, and feeding guides, helping users make informed choices effortlessly.

image

📈 The Outcome

Based on the data in Google Analytics and from the webshop, the results show improvements in users experience. From April to Dec 2022, IMBY’s revenue increased by 120.2% (April 2022 - €9,922.21, Dec 2022 - €21,859.90). The number of users visiting the IMBY website rose from 2,881 to 5,107. Overall, the webshop recorded the positive results with the improvements implemented ✨

💯
1. Revenue increased by 120.2% (€9,922.21 to €21,859.90) 2. New users increased from 2,881 to 5,107 which is a 77.3% 3. Sessions also increased by 59.1 % (4,147 to 6,598) 4. Number of transactions increased from 249 to 360 5. Average order value from 31.25 to 58.92, 88.5%

👀 Questions & Observations

To help me better frame any problems with the product, I began by forming some questions and observations I have about the product. To easily document these I followed the structure [situation], [response], [problem to business or experience] to ensure I'm aware of users and business needs.

When users search for more details about a product, they often have to sift through a lot of information, which can be distracting before they can find the next step.
image
When browsing for snacks, users need to scroll all the way to the bottom of the page in order to find the products, which may be easily missed.
image
When shopping for dog food, users need to spend time going through a list of options presented (Packaging Format, Race, Age of Your Dog) before being able to add an item to cart.
image

Current User Flow on the IMBY website

Rather than starting from scratch with entirely new concepts, I began visualizing the current experience of the IMBY website by creating a user flow. By analyzing the current flow on the website, I pinpointed opportunities for enhancement.

image

?How Might We

With a picture of the problem at hand starting to come into place, we jumped into the ideation phase and worked through the solution design model, identifying users actual behaviour, and optimal behaviour. This allowed me to form a how might we statement to begin forming a solution.

💭
How might we help users find what they need on the webshop easily?
💭
How might we aid users in making an informed decision before purchasing dog food?

💡 Ideation

To aid in ideation, I formulated distinct user segments, each with their own unique goals on the platform, and designed possible user pathways accordingly.

IMBY Sales Funnel

image

🌊 Proposed User Flows

image
image
image
image

Link to Full Flows: https://www.figma.com/file/quw0c9YLmHJvLKlB3n8X6R/IMBY?type=whiteboard&node-id=26-5084&t=nzHqfdNDl2r7Bilj-0

✍️ Hypothesis

With the team, I formed a few hypothesis so that it provides clear focus and direction for our design efforts. By forming hypothesis, we defined specific problems, questions, or goals that we want to address, ensuring that our work remains aligned with user needs and business objectives.

Hypothesis 1:

We believe that improving the user shopping journey can be achieved by having clear & concise navigation menu, with only the essential items, such as Shop. This approach would not only improve discoverability & find-ability of information on the website but would also avoid decision fatigue. Users may not be ready to make decisions during their first visit and may prefer to browse. Therefore, a task-focused navigation may be more suitable for IMBY.

Hypothesis 2:

We believe that displaying dog sizes and packaging formats in a sequential manner and by displaying the options through a dropdown would make it easier for users to make an informed decisions when purchasing dog food.

✍🏻 Lo-Fidelity Designs

To help me visualise the solutions proposed, I presented them in lo-fi designs. I used a neutral colour palette to avoid any decision bias and would use this prototype to get feedback from the client.

👩🏼‍🎨 Styles & Components

Together with my teammate Mun Yee, we defined styles and components to ensure the design was consistent.

🎨 Styles

image

🆎 Typography

image

Components

image
image
image

👩🏻‍🎨 Hi-Fi Designs

Below is the final version of the hi-fi designs that the team created.

Product Detail Page

Before

image

After

image

Homepage

Before

image

After

image

Product Listing Page

Before

image

After

image

📈 Outcome

Results 💯
Improvements 📝
Concluding Thoughts 💭