Medische winkel
Logo of Medi-Market Parapharmacie

Quick and easy in-store stock management for Medi-Market

Medi-Market wanted to improve the ergonomics of in-store stock management for their shop assistants. We transformed their existing stock replenishment system into a Progressive Web App, optimized for handheld devices. The result? A seamless, mobile-friendly experience that improves efficiency and simplifies daily operations across 70+ stores.

Read more
Share via:
01

Challenge

Medi-Market needed a mobile-friendly stock management tool to improve ergonomics and usability for shop assistants.


02

Solution

We created a responsive Progressive Web App optimized for handheld devices, combining efficiency with user comfort.


03

Approach

Our approach included selecting a PWA for its flexibility, applying user-centered design through research and feedback, and following Agile development with UX best practices.


04

Result

The ASR PWA now runs on 120 handheld devices, enhancing usability and efficiency for shop assistants while maintaining scalability for future upgrades.

medi-market logo

About Medi-Market

Medi-Market is a chain of parapharmacies owned by Belgian company Medi-Market Group which operates in the pharmacy and parapharmacy sector. Medi-Market’s mission is to make the most comprehensive range of high-quality products available to as many people as possible at the lowest price. Medi-Market runs some 70 points of sale in Belgium, Luxembourg, Italy and elsewhere.

Challenge

Improving the ergonomics for shop assistants during stock management

In 2019, we developed the Automatic Stock Replenishment (ASR) application for Medi-Market. This ASR application ensures optimum stock management. Based on a number of parameters, ASR determines the optimum amount of stock required for each shop. As soon as stock levels at the shop fall below the defined minimum stock level, the application autonomously orders the right products until the optimum stock level is reached again. This approach enables Medi-Market to keep stocks at their shops and warehouses at optimum level, which drives down the stock cost and reduces the risk of having products in stock with an expired sell-by date.

The ASR application had been designed to be used on desktop or laptop screens. When shop assistants are counting on-shelf products as part of stock-takes or in order to replenish the shelves, having to lug around a laptop is not exactly ideal from an ergonomic perspective. Which is why Medi-Market asked us to port the functionality of ASR to the smaller screen of a handheld device in the shape of a mobile application. This also entailed a new interface, delivering an optimized user experience for mobile use.

Solution

A progressive web app with an excellent user experience and interface

Working in tandem with Medi-Market, we soon came to the conclusion that a Progressive Web App (PWA) was the right solution. A PWA runs in the browser, but behaves as users would expect from a native app: the PWA can be put on the home screen, it is visible in the app switcher and can enable components such as the camera or the microphone. As the app is not available from any app stores, this moreover allows for app updates to be pushed without having to wait for the approval of app store supervisors.

Appealing UI and high user comfort

To deliver the best possible user experience, we put ourselves in the shoes of a shop assistant. We critically reviewed what shop assistants need and what their expectations are. Moreover, we properly researched the Zebra handhelds with a touchscreen, which the ASR PWA runs on, to find out how it is used.

We then worked up a proposal which we presented to Medi-Market. Based on their feedback, we continued to iterate (develop and try out new iterations) to build the components and screens on a step-by-step basis.

The main information the user requires is always at the top and in the middle of the screen, such as a zoomable image. The item and other codes too are instantly visually recognizable from the different house style colors and are displayed above the ‘fold’, i.e. without the user having to  scroll.

Medi-Market App Device 2
Approach

Designing a progressive web app for handheld usability

To address this challenge, we pursued a three-pronged approach:

PWA selection

Identified a Progressive Web App (PWA) as the ideal solution for its browser-based nature, native app-like functionality, and seamless update capabilities without dependency on app stores.

User-centered design

Conducted thorough research on shop assistants' needs and the Zebra handheld devices they use, iterating the app design based on feedback to ensure usability.

Agile development & UX best practices

Built and refined components iteratively while applying mobile UX best practices, such as responsive design, thumb-friendly zones, and easily scannable interfaces.

1657094551-medimarket-screens
Result

App up and running on 100+ devices

In addition to our step-by-step Agile approach, we also implemented quite a few best practices for mobile design. For one thing, all interactive elements are large enough to be ticked by finger and we positioned the main action elements in places that are easily reached by thumb (thumb zone). This raises shop assistants’ user comfort and efficiency.

Moreover, the UI design is responsive. If ever Medi-Market decides to switch to a different handheld device with a different screen size, such as a tablet, the interface will nicely scale along to the new screen size.

The Medi-Market ASR application is now running on some 120 handhelds.

The app allows us to carry out and monitor a series of duties which were previously carried out manually, in a way that is quicker, more user-friendly and more efficient. This leaves our shop assistants more time to assist our customers.
Peter Bos
CIO at Medi-Market
Logo of Medi-Market Parapharmacie
Picture of Peter Bos
The app allows us to carry out and monitor a series of duties which were previously carried out manually, in a way that is quicker, more user-friendly and more efficient. This leaves our shop assistants more time to assist our customers.
Peter BosCIO at Medi-Market
Logo of Medi-Market Parapharmacie
Picture of Peter Bos
Effortless in-store stock management at your fingertips! 

Want to optimize your stock management?

Let's see how a tailored mobile solution can increase efficiency and ease operations for your team! Let’s talk.

ACA mug  mok
Effortless in-store stock management at your fingertips! 

Want to optimize your stock management?

Let's see how a tailored mobile solution can increase efficiency and ease operations for your team! Let’s talk.

ACA mug  mok
Effortless in-store stock management at your fingertips! 

Want to optimize your stock management?

Let's see how a tailored mobile solution can increase efficiency and ease operations for your team! Let’s talk.

ACA mug  mok
Effortless in-store stock management at your fingertips! 

Want to optimize your stock management?

Let's see how a tailored mobile solution can increase efficiency and ease operations for your team! Let’s talk.

ACA mug  mok

Related cases

Discover how other companies transformed their digital solutions! Check out our related cases and see how we create innovative, user-friendly, and future-proof applications:

Share this case in your team

Share: