Youdle

Platform

Mobile Application

Model

B2B

Category

Grocer Dashboard

Year

2024

abstract shape
abstract shape
How It All Began

Youdle was born from a simple, powerful idea: connect people through data to help them find what they need in times of crisis. What started as a Facebook group to locate essential products in Memphis quickly grew into a platform that transformed how communities shop. Over time, Youdle's mission evolved to not only serve consumers but also to support local grocers—key pillars in their neighborhoods. Now, the focus is on providing these grocers with the tools they need to flourish, using data to strengthen their connection with their customers and streamline their operations.

The Hidden Struggles of Local Grocers

Local grocers, especially in underserved areas, face many challenges. Without a digital presence, customers can’t easily find them or see what’s in stock. Yet these stores often play a vital role in their communities, especially where supply disruptions are common. Without real-time inventory updates or ways to communicate with customers, grocers struggle to manage stock and stay connected—particularly during urgent times like storms or holidays. The challenge for Youdle was to design a dashboard that not only provides essential data but also helps grocers become more visible and connected within their communities.

My Role

Throughout the seven-week project, I was involved in every stage of the design process—from early research and synthesis to final prototyping and testing. I contributed to competitive analysis, interviews, surveys, personas, affinity mapping, site mapping, user flows, wireframes, and usability testing. I also led the design of the core Analytics feature, turning complex data into clear, actionable insights for local grocers.

Learning from Existing Solutions

Exploring competitor platforms revealed how existing solutions overlook small grocers’ needs. This analysis helped us identify gaps and design a more accessible, tailored solution for local businesses.

UberEats

Strong category navigation but grocery visibility is limited due to restaurant focus. It favors large stores, which your dashboard can counter by empowering small grocers.

Google Merchant Center

Intuitive dashboard with quick onboarding, but complex product management. Simplified product tools will help grocers manage their inventory more easily.

Square for Retail

Offers real-time inventory updates and detailed reports, but has a steep learning curve. Focus on creating an easy-to-use, customizable system for grocers.

Understanding the Needs of Target Grocers

Our competitor analysis revealed that many platforms lack essential tools for grocers or have overly complex interfaces aimed at larger businesses. To better understand grocers' needs, we conducted further research and created a grocer profile affinity mapping.

Building Empathy Through Personas

After creating the grocer profile through affinity mapping, it was essential to delve deeper into the individual experiences of local store owners. By developing personas, we could humanize their challenges, understand their unique motivations, and design solutions that cater to their specific needs.

We developed two personas: a younger grocer who learns quickly but lacks operational experience, and an older, experienced business owner who struggles to adapt to new technology. These personas represent our key target groups and guide the design to address their unique challenges.

Laying the Foundation for Key Features

With a clear understanding of our grocers’ needs from the personas, we focused on creating a straightforward and intuitive structure via site map methodology. The goal was to make it easy for grocers to navigate essential tasks—integrating account, managing inventory, understanding sales and market trends, and communicating effectively with their community—all through a well-organized, easy-to-use system.

Mapping the User’s Journey

After finalizing the sitemap, we created a user flow to guide grocers through the key features of the platform. Starting from the sign-in or registration, users land on the dashboard, which serves as the central hub. From there, they can easily navigate to manage their inventory or access the analytics section to review important customer and product data. This flow ensures a smooth, intuitive experience for grocers as they handle day-to-day tasks.

Visualizing the Core Features to Wireframes

Based on the user flow, we created low-fidelity wireframes to outline key features, and tasks were divided among the team. I was responsible for the analytics section, where I focused on summarizing customer and product data. The goal was to ensure grocers could easily access key metrics such as sales breakdowns, top and bottom products, user reviews, demographics, and important customer segments. This stage allowed us to refine the layout and functionality of the analytics features before moving into higher fidelity designs.

1st Round Usability Testing

We conducted usability testing via Zoom, with task-based sessions lasting 20-30 minutes each. These sessions included a briefing, an interview, and task execution. We tested three participants, and here are the key findings and changes made:

• Personal information should not be displayed in the customer segment.

• A search feature is needed at the top of the analytics page.

• A clear summary for customer reviews is recommended.

• Confusion arose due to identical titles for Product and Customer summaries in Analytics.

• Too much data in the analytics section makes it overwhelming on mobile.

The Usability Issues by Priority table below shows detailed descriptions of these issues.

Elevating the Project with High Fidelity Design

Based on the user flow, we created low-fidelity wireframes to outline key features, and tasks were divided among the team. I was responsible for the Analytics section, focusing on summarizing customer and product data. The goal was to help grocers easily access key metrics like sales breakdowns, top and bottom products, user reviews, demographics, and customer segments. From this point on, the following stages focus specifically on the design and refinement of the Analytics feature.

2nd Round Usability Testing

We conducted usability testing in a similar format to the wireframe test, and the following issues were identified:

• Sorting the top 3 and bottom 3 products by sales units alone was seen as less valuable without including profit.

• “Last 6 Weeks” option is suggested to be added into time selector, as this is a commonly reviewed period.

• Users found the title “Customer Demography” on the Analytics-Customer interface confusing.

The Usability Issues by Priority table below shows detailed descriptions of these issues.

Finalizing the Prototype

After addressing the issues from the second round of testing, we optimized the prototype to improve user experience and functionality. The changes were also based on some personal design reflections, resulting in a more engaging and intuitive interface. Design changes based on personal reflections include the following:

• Optimized summary section colors and added icons for a more dynamic look.

• Used grey blocks for the top/bottom 3 product lists, creating a bulletin board effect.

• Replaced customer breakdown sorting with a sliding selector for easier interaction.

• Added percentage labels to the pie charts for better clarity.

• Included top customer reviews for quick access to the most useful feedback.

END

END

How It All Began

Youdle was born from a simple, powerful idea: connect people through data to help them find what they need in times of crisis. What started as a Facebook group to locate essential products in Memphis quickly grew into a platform that transformed how communities shop. Over time, Youdle's mission evolved to not only serve consumers but also to support local grocers—key pillars in their neighborhoods. Now, the focus is on providing these grocers with the tools they need to flourish, using data to strengthen their connection with their customers and streamline their operations.

The Hidden Struggles of Local Grocers

Local grocers, especially in underserved areas, face many challenges. Without a digital presence, customers can’t easily find them or see what’s in stock. Yet these stores often play a vital role in their communities, especially where supply disruptions are common. Without real-time inventory updates or ways to communicate with customers, grocers struggle to manage stock and stay connected—particularly during urgent times like storms or holidays. The challenge for Youdle was to design a dashboard that not only provides essential data but also helps grocers become more visible and connected within their communities.

My Role

Throughout the seven-week project, I was involved in every stage of the design process—from early research and synthesis to final prototyping and testing. I contributed to competitive analysis, interviews, surveys, personas, affinity mapping, site mapping, user flows, wireframes, and usability testing. I also led the design of the core Analytics feature, turning complex data into clear, actionable insights for local grocers.

Learning from Existing Solutions

Exploring competitor platforms revealed how existing solutions overlook small grocers’ needs. This analysis helped us identify gaps and design a more accessible, tailored solution for local businesses.

UberEats

Strong category navigation but grocery visibility is limited due to restaurant focus. It favors large stores, which your dashboard can counter by empowering small grocers.

Google Merchant Center

Intuitive dashboard with quick onboarding, but complex product management. Simplified product tools will help grocers manage their inventory more easily.

Square for Retail

Offers real-time inventory updates and detailed reports, but has a steep learning curve. Focus on creating an easy-to-use, customizable system for grocers.

Understanding the Needs of Target Grocers

Our competitor analysis revealed that many platforms lack essential tools for grocers or have overly complex interfaces aimed at larger businesses. To better understand grocers' needs, we conducted further research and created a grocer profile affinity mapping.

Building Empathy Through Personas

After creating the grocer profile through affinity mapping, it was essential to delve deeper into the individual experiences of local store owners. By developing personas, we could humanize their challenges, understand their unique motivations, and design solutions that cater to their specific needs.

We developed two personas: a younger grocer who learns quickly but lacks operational experience, and an older, experienced business owner who struggles to adapt to new technology. These personas represent our key target groups and guide the design to address their unique challenges.

Laying the Foundation for Key Features

With a clear understanding of our grocers’ needs from the personas, we focused on creating a straightforward and intuitive structure via site map methodology. The goal was to make it easy for grocers to navigate essential tasks—integrating account, managing inventory, understanding sales and market trends, and communicating effectively with their community—all through a well-organized, easy-to-use system.

Mapping the User’s Journey

After finalizing the sitemap, we created a user flow to guide grocers through the key features of the platform. Starting from the sign-in or registration, users land on the dashboard, which serves as the central hub. From there, they can easily navigate to manage their inventory or access the analytics section to review important customer and product data. This flow ensures a smooth, intuitive experience for grocers as they handle day-to-day tasks.

Visualizing the Core Features to Wireframes

Based on the user flow, we created low-fidelity wireframes to outline key features, and tasks were divided among the team. I was responsible for the analytics section, where I focused on summarizing customer and product data. The goal was to ensure grocers could easily access key metrics such as sales breakdowns, top and bottom products, user reviews, demographics, and important customer segments. This stage allowed us to refine the layout and functionality of the analytics features before moving into higher fidelity designs.

1st Round Usability Testing

We conducted usability testing via Zoom, with task-based sessions lasting 20-30 minutes each. These sessions included a briefing, an interview, and task execution. We tested three participants, and here are the key findings and changes made:

• Personal information should not be displayed in the customer segment.

• A search feature is needed at the top of the analytics page.

• A clear summary for customer reviews is recommended.

• Confusion arose due to identical titles for Product and Customer summaries in Analytics.

• Too much data in the analytics section makes it overwhelming on mobile.

The Usability Issues by Priority table below shows detailed descriptions of these issues.

Elevating the Project with High Fidelity Design

Based on the user flow, we created low-fidelity wireframes to outline key features, and tasks were divided among the team. I was responsible for the Analytics section, focusing on summarizing customer and product data. The goal was to help grocers easily access key metrics like sales breakdowns, top and bottom products, user reviews, demographics, and customer segments. From this point on, the following stages focus specifically on the design and refinement of the Analytics feature.

2nd Round Usability Testing

We conducted usability testing in a similar format to the wireframe test, and the following issues were identified:

• Sorting the top 3 and bottom 3 products by sales units alone was seen as less valuable without including profit.

• “Last 6 Weeks” option is suggested to be added into time selector, as this is a commonly reviewed period.

• Users found the title “Customer Demography” on the Analytics-Customer interface confusing.

The Usability Issues by Priority table below shows detailed descriptions of these issues.

Thanks for Sticking With Me to the End!

Finalizing the Prototype

After addressing the issues from the second round of testing, we optimized the prototype to improve user experience and functionality. The changes were also based on some personal design reflections, resulting in a more engaging and intuitive interface. Design changes based on personal reflections include the following:

• Optimized summary section colors and added icons for a more dynamic look.

• Used grey blocks for the top/bottom 3 product lists, creating a bulletin board effect.

• Replaced customer breakdown sorting with a sliding selector for easier interaction.

• Added percentage labels to the pie charts for better clarity.

• Included top customer reviews for quick access to the most useful feedback.

END

END

Youdle

Platform

Mobile Application

Model

B2B

Category

Grocer Dashboard

Year

2024

abstract shape
abstract shape

Let's Get in Touch

REACH OUT HERE

Let's Get in Touch

REACH OUT HERE

Let's Get in Touch

REACH OUT HERE