You’ve visited your local grocery store countless times; but next time take note of how many barcode labels there are. It’s more than you think!
Your average grocery store has tens of thousands of barcodes on individual products, shelf labels, and inventory management tags. To put it in perspective, a medium-sized grocery store has about 30,000 to 50,000 unique items, each with its own barcode. And aligned to each unique item is a shelf label with its own barcode.
Electronic shelf labels — displays located on the edge of store shelves — provide dynamic pricing and product information in real-time. Delivering this information requires a merchandising management system designed to streamline the creation, distribution, and management of digital content across retail environments. Providing this type of merchandising management system to stores is where GAP’s client is a market leader.
Our client — a global materials science expert specializing in the design and manufacture of a wide variety of labeling and functional materials — is transforming how retailers manage electronic displays, pricing information, and consumer touchpoints. As the industry leader in technology-driven shelf-edge media solutions for retailers and consumer packaged goods, their goal is to help retailers manage digital content across video campaigns, electronic shelf labels, printed price tags, and signage.
But before launching their solution, the client needed to seamlessly integrate digital and print media across all stores while enhancing the shopper experience, improving labor efficiency, and maximizing return on investment.
Modernizing the Shopping Experience
To bring this solution to life, they entrusted the GAP team, which jumped in right away to create the ideal solution.
“We aimed to create a multi-role app experience that could be easily used by anyone involved in merchandising, from marketing specialists to store employees,” said Dan Barrett, Lead UX Designer at GAP.
The GAP team navigated a complex set of critical tasks, including:
- Conducting a Design Audit for the client’s existing application
- Defining User Roles and Personas
- Mapping out the Information Architecture
- Creating Low/High-Fidelity Screen Designs and User Flows
- Implementing a Design System
- Designing Interactive and Clickable Prototypes
- Coordinating and deploying interactive User Testing surveys
- Engaging frequently with Engineering to ensure a smooth Design Hand-Off
Doing all of this required balancing technical expertise with creative vision, ensuring the system was both functional and intuitive.
All the People You See at the Store
Every store caters to a wide range of people. At any given moment, a store caters to shoppers, employees, managers, and more. Given this diversity, the solution had to address a variety of user needs. The team categorized user personas into two primary groups: corporate-level and store-level users. Within these groups, they identified subcategories like IT specialists, marketing specialists, and merchandising specialists, each with unique requirements.
"This high-level persona breakdown helped facilitate smoother conversations during development," Barrett said. "By identifying our target users at every stage, we avoided confusion and ensured we were meeting specific needs."
The development process focused heavily on the user journey, mapping out what each persona needed from the system at different stages. But persona mapping wasn’t the finish line, as the GAP team still needed to design the solution.
Designs Set on Perfection
The design process was rigorous, involving extensive audits of the existing information architecture and usability. Prototypes brought the designs to life, and interactive testing played a crucial role in refining the experience.
“We evaluated each screen in the tool and asked ourselves ‘Does this violate any best practices? Is this optimal for the user?’” Barrett explained.
A critical aspect of the GAP team’s work was creating a design system to help developers stay consistent across the platform. The system included guidelines for UI elements like dashboards, tables, and content displays, along with a component library for reuse, streamlining development and ensuring a uniform user experience.
“It’s about creating artifacts that keep the process and team moving forward smoothly by having the right conversations,” Barrett said. “That’s how we ensure the product delivers exactly what the users need.”
Time to Check Out GAP!
User-centric design enhances both operational efficiency and the user experience. GAP’s systematic approach to persona development, information architecture, and iterative design ensured the client’s solution catered to the complex needs of its users while remaining intuitive and easy to use.
As technology continues to reshape retail, GAP's contribution to this client’s solution is providing retailers with more tools to adapt and thrive in an increasingly digital landscape.
If you’re looking for a team to help define and execute a complex solution, look no further than GAP!
