Streamlining order workflow between F&B establishments and suppliers

Foodtech mobile app

Summary

Background

ZOLO is a B2B message-to-order platform that connects small-to-medium F&B establishments and their suppliers. Currently in its proof-of-concept stage, the end goal is to mature into a comprehensive solution that streamlines the ordering of supplies, facilitates sourcing and payment, and provides other related functions to the Southeast Asia food market.
The co-founders have conducted preliminary user interviews and developed a mobile app prototype using no-code. They wish to further validate their existing hypotheses / assumptions, and iterate their prototype such that users will find the app simple and intuitive to use.

Timeline

4 weeks | July 2022

Project role

Team Lead | UX Research & Testing | UI Design | Wireframing & Prototyping | Product Strategy

Teammates

Wong Shi Ying | Reuben Chia | Edward Wong | Zack Hong

Deliverables

Pain points

For F&B establishments

  • Orders for ingredients are placed across multiple channels (phone, email, WhatsApp); process is tedious, manual and error prone
  • As F&B operations scale, there is increasing inefficiency and unnecessary back-and-forth communication with suppliers
  • As prices of products change frequently, it becomes difficult to track and manage the cost of supplies

For suppliers

  • Limited resources to market products and provide dedicated services, due to large number of customers
  • Due to many orders across multiple channels, a team has to be managed to manually transfer such orders into their ERP system; inefficient and error prone
"How might we simplify and streamline communications between operators and suppliers to reduce instances of error and improve their working relationship?"

Core designs

Pre-sign up carousel
Onboarding for first-time users

Improved onboarding flow / experience for F&B operators

To increase adoption amidst market incumbents, it was critical to convey ZOLO’s value propositions upfront. In addition, I designed a onboarding flow to handhold first-time users through the app.
Suppliers can relay important announcements and engage customers more efficiently

Introduced broadcast feature for suppliers, for easy and efficient marketing outreach

Generally, suppliers have limited time to connect with their customers and relay key information such as announcements, promotions and product launches. This feature enables them to schedule and send messages to their database of customers (selectively).
Suppliers can amend order details through the in-app chat

Mapping out an intuitive order editing process for suppliers

When suppliers receive a purchase order, they may wish to alert customers of changes to the order details including product price and inventory levels. I conceptualized the order editing process with automated notification of changes to customers, and the option to synchronize such changes with the suppliers’ inventory management system.
*refer to the Figma project file for other design improvements
IMPACt
Validated demand hypotheses and improved user experience and functionalities of no-code mobile app prototype; accelerated co-founders’ ability to bring the MVP to market.
"We will build on your design ideas and high-fidelity prototype to build our web application on Bubble."

Project walkthrough

The Double Diamond framework was adopted to guide the project. The preliminary challenges I identified at the beginning of the project were the time constraint of 4-weeks, and managing scope expectations as two core target users had to be considered; F&B operators and suppliers.
Summary of research methods
I started with laying out the research plan for the coming weeks; recruit F&B operators for user interviews and usability tests, draft the interview questions, and conduct competitive analysis on market incumbents.

Discover

In the discovery phase, I strived to understand the customers’ pain points and frustrations with their current ordering workflow, so that their needs can be addressed through our design recommendations. To achieve this, user interviews were conducted with 6 F&B operators.
Sample interview notes

Key learnings

Strong preference for WhatsApp

Users are resistant to switching away from WhatsApp which houses most of their personal supplier connections. As an informal platform, it is also more conducive in fostering relationships with their suppliers (i.e there is an existing element of community).

Price transparency and changes

Suppliers may withhold prices from product catalogues. In addition, price changes by suppliers are largely arbitrary and not timely communicated to F&B operators.

Define

Insights from user interviews

Using affinity mapping, the data points gathered from the user interviews were synthesized to identify similar patterns and trends across the F&B operators.
Synthesis of findings from user interviews

Observations from usability tests

For the no-code prototype, the users generally found the mobile app to be simple and intuitive to navigate, although some improvements were recommended (e.g. repositioning support button so users can access it more easily).
Other comments related more strategic aspects; for example, showcasing ZOLO’s unique value propositions more clearly, and enquiring as to how they would prefer to be introduced to the app (e.g word-of-mouth, referral)
Rainbow sheet of usability test observations

User Personas

Based on the data and insights collected from user interviews / usability tests, two personas were drawn up for increased focus and alignment on the targeted customer segments.
User Persona (F&B operator)
User Persona (Supplier)

Competitive analysis

Competitive analysis was conducted with market incumbents and a feature comparison table was drawn up for better assessment of the players in the industry. Using this, we nailed down several essential basic / threshold features that we focused on primarily in our design.
Feature comparison of market competitors
Key features of focus

Develop

For brevity, only the high-fidelity mockup of our designs is discussed. Essentially, parts of two interfaces were designed: operator and supplier interfaces. These were framed as specific user flows to showcase the process that a user will take when attempting to perform specific tasks.

The main user flows for the operator interface are:

  1. Sign up and login
  2. Onboarding and adding a new supplier
  3. Supplier chat interface
  4. Data analytics
  5. Placing an order with a supplier
  6. Adding SKUs to create a personalized product list
For the supplier interface, inspiration was sought from the designs of the competitor apps. In addition, due to project time constraints, we did not conduct user interviews with suppliers. Instead, the client shared insights from their supplier interviews, which were relied on for the design.

The main user flows for the supplier interface are:

  1. Broadcasting product launches and promotions
  2. Managing changes to purchase orders
  3. Managing product database and customer catalogues

High-fidelity prototype

2nd usability test

With our revised prototype, we conducted a 2nd round of usability tests with 3 of our interviewees. Based on the System Usability Scale (SUS), we noted an improvement of ~13 points (19%).
2nd usability test results

Next steps

Moving forward, the co-founders planned to leverage the designs to build a web app of the supplier interface using the no-code tool Bubble. In addition, we helped the co-founders to generate leads by inviting them to a ‘chefs and suppliers’ WhatsApp group, which granted them access to a massive pool of target customers for further outreach.

Retrospective

Leadership and stakeholder management

As the team lead, I was satisfied with my ability to communicate and clarify project expectations to both the client and my fellow project mates regularly. This was critical in managing scope creep (especially as the project requirements evolved along the way) and allowed the team to be aligned and focused on the project objectives.

Project retrospectives

Based on my experience with the Scrum methodology, I conducted weekly check-ins with the team including a final project retrospective. I encouraged team members to share:

  • What we did well for the project
  • What we could have improved on
  • Feedback to specific individuals to highlight their contributions, and suggestions where there is room for improvement

I believe this is an important part of being a leader; to check in on the progress of the team, encourage reflection, and ultimately to empower them to share and voice their thoughts.

Framing and interpreting research findings

I had a deeper appreciation for the process of validating hypotheses / assumptions and for framing my perspective on research findings. Generally, many people focus on what is not great and can be improved; however, focusing on what works and what is being done well is also critical as it provides greater confidence that the project is headed in the right direction.
End of project walkthrough
View other works