orders dashboard

Streamlining workflows through automation and design.

Our client, a dessert food truck, sought a digital solution to address a multitude of operational concerns that range from order fulfillment to inventory management to business reporting, and more.

We designed and developed a custom point-of-sale application with external and internal interfaces to create a more branded and streamlined ordering experience.

01

Context

Happy Ice is a food truck serving water ice desserts in Los Angeles. Their secret, vegan-friendly recipe gives the product the creamy texture of ice cream with the refreshing flavor of sorbets. The brand’s popularity in Los Angeles has grown rapidly in the last two years and they are expecting to solidify their presence by opening their flagship store in just a few months.

Happy Ice was planning on expanding their locations and sought a solution to address their growing operational concerns and pain points:

  • Job-related tasks are done manually and are not standardized
  • Operations are scattered across various platforms/channels/inputs
  • Struggle to meet incoming orders
  • Order fulfillment can be inefficient and time consuming

The client’s initial idea was to build a custom dashboard that would serve as a central location for their employees to perform their job responsibilities.

A diagram detailing the suite of products that comprise the point-of-sale system supporting the food truck's order fulfillment.

The Challenge

To address such a large-scale project, we first focused on the primary revenue-generating task: order fulfillment.

The client was looking for a digital solution that enabled customers to create orders and complete transactions  independently of staff members. Automating the ordering process would allow them to increase productivity by prioritizing their efforts into order fulfillment instead.

02

Discover + Define
A handwritten note that details every step of the interaction between a customer and staff member at this food truck location.

To tackle a large-scale project, we first narrowed our focus onto the primary tasks performed by staff members: order fulfillment. We found that their team was frequently overwhelmed by the volume of incoming orders, especially during their peak seasons in the summer.  

To keep up with the ever growing demand, Happy Ice would need to leverage existing technology and automate tasks where possible. We mapped out their existing workflow and found customer-facing tasks that could be accomplished through widely used technology. In doing so, we can free up manpower to focus on under-resourced tasks in their workflow.

Leveraging technology as manpower

To automate these tasks, we created two additional complementary products to perform the same job functions as the Host: collect order information, capture both cash and card payments, furnish receipts, and submit those specifications to the Scooper.  Once the Point-of-Sale terminal collects customer orders and payments, it submits the information to the Order Management Dashboard for the Happy Ice staff to view.  After all items are processed and fulfilled, the Order Tracker Display shows the order status change from “In Progress” to “Completed”.

How can we improve the employees’ day to day workflow?

A wall of sticky notes that displays a host of ideas to create a better experience for Shawn the food truck staff member.

Users, Needs, & Functionalities

Once we automated the process of order and payment collection, we focused on translating the rest of the workflow into a seamless digital experience. We determined that our main users would be employees and managers. Based on initial interviews and contextual inquiry, we fleshed out a lean persona to gain a deeper understanding of their process and to find user pain points and needs.

With the goal and context in mind, I created a task flow and scenario map to derive a set of possible features to help them complete those tasks quickly.

A handwritten note that details a potential taskflow that Shawn the food truck employee goes through when he fulfills an order for the food truck customer.

03

Design Principles

Sketches & Wireframes

Upon automating order and payment collection, we found that the only user input required is to track completed items and/or closing out active orders. We compressed the fulfillment-related features into a single screen to eliminate unnecessary navigation and extra clicks.

These sketches consider various compositions that could enable the users to view as many orders as possible and complete them as quickly as possible. The high-fidelity wireframes show information hierarchy to present the order specifications clearly and intuitively.

Design Elements

Having just refreshed their brand identity a few months prior with a different designer, Happy Ice had a loose set of visual guidelines that I extended to their digital applications. Keeping in mind that the goal was to maximize productivity,  I adapted the visual language to keep the interface as simple and clear as possible, and made use of specific UI elements and principles to serve a functional purpose.

Development

After the client signed off on the design, I handed the files off to the development team. One of the key features they integrated was the ability to automate order delivery/pickup via Twilio’s SMS notifications. When Happy Ice staff members press the “READY” call-to-action button or check off the last item in an order, customers receive a text message notifying them that their order is complete and ready for pickup. The order status also changes in the Order Tracker Display (shown at the retail location). The order is then cleared from the Dashboard queue to make room for new incoming orders.

04

Testing

Software Development

Once we had an MVP, we tested the Dashboard on normal operating hours at a location that is frequently used by Happy Ice. We worked with two Happy Ice staff members to observe how they would use the product in a real transaction. I briefly introduced the project to the staff and stayed in the truck to provide guidance if necessary, while a team member oversaw the customer transactions.

  • How quickly can they process the orders from the time the kiosk registers the order to marking the order as ready?
  • Do they find the order tracking feature useful? Does it add more clicks?
  • What pain points do they have in processing the order?

At the conclusion of the session, I asked the testers some debrief questions regarding their general impression of the product. Despite running into a few issues, they enjoyed using the Dashboard overall and processed orders easily without requiring additional support. Some insights and resulting action points have been disclosed here.

05

outcomes
A photo of the food truck with one of its managers standing beside the point-of-sale kiosk terminal.

User Testing & Insights

The action items we derived from user testing were passed on for development and, due to project constraints, we deployed the MVP to go live. Next steps would be to continue to optimize performance and conduct further user tests with additional factors in play. We would be able to gain more insightful feedback from testing with more foot traffic to simulate busier seasons. Using these learnings we would be able to further refine the product in Phase 2.

Insights and action items

One user expressed that they would have preferred a different layout orientation to view more orders and to work similarly to other POS systems.

  1. Dig deeper into this and conduct A/B tests of the layout in landscape vs portrait orientation.

Some customers are unwilling to leave their phone numbers, making it an inconsistent experience between sending out SMS notifications and announcing the order number and name.

  1. Conduct further research into why customers might not want to leave their contact information. Consider edge-cases ie. if international tourists were to come by without a domestic phone number, or customers who don’t own mobile phones. Is this feature a “nice-to-have” as opposed to a "must-have”?