Jeremy Leeds

PROBLEM

Grubmarket’s Wholesaleware was, in 2022, a rapidly growing  wholesale SAAS platform for the food industry. Supporting purchasing from Vendors, ordering from Customers, Inventory, Work orders, and supporting serval integrations, Wholesaleware had been built in a scrappy and agile environment, and inconsistencies in the design, and look and feel of the product impacted user experience, and undercut customer’s perception of quality of the platform. Multiple generations of UI code libraries used during at different times left Wholesaleware with UI that was inconsistent both visually and in terms of interaction design.

SOLUTION

I was brought in as a Senior User Experience Designer, doing both hands-on UX design for a wide range of new features, while also directing and managing design agency vendors. A major initiative during 2023 was the comprehensive overhaul of the Purchase Orders and Sales Orders sections of the application, the heart of Wholesaleware. We took this opportunity to design and implement a brand new, modern visual component library. Using MUI and React as a baseline, we modified the visual language to meet our specific needs, and extended the component system with MUIx Datagrid based tables to leverage powerful asynchronous save functionality to enable superb speed of use and keyboard-driven entry for users doing high volume, high speed work.

RESULTS

Rolling out the new Order system first to a set high value, high volume customers, the ease with which existing users adapted to the overhauled Purchase and Sales order pages, and the new design framework, exceeded all of our expectations. The Implementation team, who perform critical support for customers adopting new features and modules, reported that they needed to do very little training  to get existing customers up to speed on the new design. Customers simply ‘got it’. Just as importantly, customers also immediately appreciated the greatly streamlined and accelerated keyboard entry, and improved clarity and use of screen real estate due to best practice responsive design. From a design process perspective, the project also left us with a beautiful, robust code component library to draw on, allow an unprecedented level of design consistency and polish we would be able to bring to all new features.