— Grocery Store Catering App
Platform: Responsive web - tablet native, desktop optional
— My Role
Market and user research, personas, usability testing, wireframes, creating working prototypes on InVision to present to various stakeholders, visual design of entire platform following the grocery chain’s branding guidelines, and style guide creation.
— Vision
A major grocery chain wanted to digitize the way they took down catering orders. They wanted to move from messy pen and paper methods that leave room for error and mishandling, to a completely digitized system that would make taking orders quicker, allow for an audit trail to trace any errors, and give the company insight into sales metrics. We gathered requirements directly from the grocery chain’s HQ and from the employees who take down orders (who would be the ones using the app) about what they wanted the app to achieve. Using this information we were able to map out user journeys and determine use cases for the app to account for a variety of scenarios (such as reporting allergies and adding notes) when dealing with customers who want to place catering orders.
— UX Challenges
-We quickly realized that there was a lot more going on than simply taking down orders on the order sheet. Customers would ask for customizations and replacements that the order form did not take into account, so the employees would simply write all additional comments into a “notes” section or on the back of the paper. This left a lot of room for error and often employees themselves weren’t sure what to allow and how much to charge for customized orders. The employees wanted to limit the number of customization on orders to a minimum and only allow allergy notices.
-Employees reported that they needed to keep track of who was taking down notes in order to keep everyone accountable in case of any mistakes during order fulfillment. This was a big requirement from both employers and stakeholders.
— UX Solutions
-We started with a simplified interface and did continuous testing with the employees to get direct user feedback and iteratively updated the design to fit their needs. We wanted to discourage customers from being able to add too much customization to their orders so we separated the notes section into “allergies” and “special instructions”. Specific verbiage was included on these screens to indicate that customizations may result in additional charges and were dependent on availability.
-We implemented an audit trail system that would keep track of which employee took down orders and notes throughout the order receiving and fulfilling process. Every time an order was taken down an employee name would be a required field within the form. The same flow was implemented in the order fulfillment dashboard where employees could post a string of messages on any given order and make edits to notes - all of which would require an employee name input.
— Impact
The app has been rolled out into 3 stores across the GTA and has received very positive feedback. We started with a simplified interface and did continuous testing with the employees and customers to get direct user feedback and iteratively updated the design to fit both of their needs. We were able to identify crucial missing features and quickly implement them into future releases in order to achieve the end goal. The grocery chain was able to simplify and streamline their order taking procedures, which resulted in more orders coming in and more efficiency in fulfilling them.