{"id":1722,"date":"2026-06-11T23:02:31","date_gmt":"2026-06-11T21:02:31","guid":{"rendered":"https:\/\/new.alapdesign.com\/?page_id=1722"},"modified":"2026-06-18T20:45:53","modified_gmt":"2026-06-18T18:45:53","slug":"case-study-auchan","status":"publish","type":"page","link":"https:\/\/alapdesign.hu\/en\/esettanulmanyok-auchan\/","title":{"rendered":"Esettanulm\u00e1nyok – Auchan"},"content":{"rendered":"
\n\t\t\t\t
\n
\n
\n \t\t\t
\n \t\t\t

\/\/ Case studies<\/h3>\n\t\t\t\t\t

Digitalising procurement \u2013 a complex enterprise process in one clear application<\/h2>\n\t\t\n<\/div>\n\n\t\t\t\t\t

We designed the UX\/UI for a browser-based internal application supporting Auchan's fresh produce procurement. The goal was to move a complex, partly documented process out of Excel spreadsheets and into a clear, scalable digital system that other departments could reuse later.
<\/p>\n\t\t

\n
\n \t\t\t

UX\/UI design<\/h2>\n\t\t\n<\/div>\n
\n \t\t\t

Enterprise application design<\/h2>\n\t\t\n<\/div>\n
\n \t\t\t

Process discovery<\/h2>\n\t\t\n<\/div>\n
\n \t\t\t

Design system<\/h2>\n\t\t\n<\/div>\n
\n \t\t\t

Material Design-based UI<\/h2>\n\t\t\n<\/div>\n
\n \t\t\t

Wireframing<\/h2>\n\t\t\n<\/div>\n
\n \t\t\t

Component system<\/h2>\n\t\t\n<\/div>\n
\n \t\t\t

Data table UX<\/h2>\n\t\t\n<\/div>\n
\n \t\t\t

Filter system design<\/h2>\n\t\t\n<\/div>\n
\n \t\t\t

Front-end build<\/h2>\n\t\t\n<\/div>\n
\n \t\t\t

Development support<\/h2>\n\t\t\n<\/div>\n
\n \t\t\t

Internal enterprise app<\/h2>\n\t\t\n<\/div>\n\n<\/div>\n\n<\/div>\n
\n \t\t\t\"Auchan\t\t\n<\/div>\n\n<\/div>\n\n<\/div>\n
\n
\n
\n \t\t\t
\n \t\t\t

\/\/ Working together<\/h3>\n\t\t\t\t\t

Our work together
<\/h2>\n\t\t\n<\/div>\n\n\t\t\n<\/div>\n
\n
\n
\n \t\t\t
\n \t\t\t

\/\/ Auchan<\/h3>\n\t\t\t\t\t

Project idea
<\/h2>\n\t\t\n<\/div>\n\n\t\t\t\t\t

Fresh produce procurement largely ran in Excel, even though the process was highly complex, with around 25 distinct stages. Documentation was only partial, and the links between steps and decision points weren't always clear. The goal was a browser-based app that brings the whole procurement process into one system, supports automation and gives buyers every relevant decision data point on a single screen.<\/p>\n\t\t\n<\/div>\n\n<\/div>\n

\n
\n \t\t\t
\n \t\t\t

\/\/ alap design<\/h3>\n\t\t\t\t\t

Our role
<\/h2>\n\t\t\n<\/div>\n\n\t\t\t\t\t

We started with a detailed discovery phase, mapping existing processes, roles, data connections and use cases. Then we defined sustainable UX goals and built an extensible design system based on Material Design. The design work included wireframes, UI components, data tables, filter systems and complex workspaces. The biggest challenge: showing a huge amount of varied data on one screen while keeping the system intuitive, clear and maintainable.
<\/p>\n\t\t\n<\/div>\n\n<\/div>\n\n<\/div>\n\n<\/div>\n\n<\/div>\n

\n
\n
\n \t\t\t
<\/line><\/svg><\/div>\n\t\t\n<\/div>\n\t\t\t
<\/line><\/line><\/line><\/line><\/svg><\/div>\n\t\t
\n
\n
\n
\n \t\t\t

\/\/ alap design<\/h3>\n\t\t\t\t\t

Shared strategy
<\/h2>\n\t\t\n<\/div>\n\t\t\t

The key was not just putting existing processes on a screen, but genuinely structuring and simplifying daily work. We broke the procurement process into workspaces that cut unnecessary navigation, bring decision data into one place, and support fast filtering, comparison and analysis. The design system and component-based front end mean the app can serve other business areas in future, not just fresh produce.
<\/p>\n\t\t\n<\/div>\n\n<\/div>\n\n<\/div>\n

\n \t\t\t
<\/line><\/svg><\/div>\n\t\t\n<\/div>\n\n<\/div>\n\n<\/div>\n
\n
\n \t\t\t
\n \t\t\t

\/\/ Functional solutions<\/h3>\n\t\t\t\t\t

Key features
<\/h2>\n\t\t\n<\/div>\n\n\t\t
\n
\n
\n \t\t\t\"\"\t\t\n<\/div>\n
\n \t\t\t
Mapping a complex procurement process<\/h5>\n\t\t\t\t\t
The system turns a complex, multi-stage procurement process into a clear digital workflow.<\/h5>\n\t\t\n<\/div>\n\n<\/div>\n
\n
\n \t\t\t\"\"\t\t\n<\/div>\n
\n \t\t\t
Decision-support dashboards<\/h5>\n\t\t\t\t\t
Buyers see the key decision data on one screen, relying far less on Excel files and scattered sources.<\/h5>\n\t\t\n<\/div>\n\n<\/div>\n
\n
\n \t\t\t\"\"\t\t\n<\/div>\n
\n \t\t\t
Advanced data tables<\/h5>\n\t\t\t\t\t
To handle large, varied data sets, we designed data tables that support overview, fast search and detailed analysis at the same time.<\/h5>\n\t\t\n<\/div>\n\n<\/div>\n\n<\/div>\n
\n
\n
\n \t\t\t\"\"\t\t\n<\/div>\n
\n \t\t\t
Multi-level filtering<\/h5>\n\t\t\t\t\t
The app supports several kinds of filtering, such as by value, by column and by date range, with saved settings.<\/h5>\n\t\t\n<\/div>\n\n<\/div>\n
\n
\n \t\t\t\"\"\t\t\n<\/div>\n
\n \t\t\t
Reusable design system<\/h5>\n\t\t\t\t\t
The Material Design-based component system is built to be reused across other internal applications.<\/h5>\n\t\t\n<\/div>\n\n<\/div>\n
\n
\n \t\t\t\"\"\t\t\n<\/div>\n
\n \t\t\t
A maintainable front end<\/h5>\n\t\t\t\t\t
The front-end build supports not just the current interface but future extensions, changes and handovers to other developers.<\/h5>\n\t\t\n<\/div>\n\n<\/div>\n\n<\/div>\n\n<\/div>\n
\n \t\t\t
<\/line><\/svg><\/div>\n\t\t\n<\/div>\n\n<\/div>\n
\n
\n
\n
\n \t\t\t
\n \t\t\t

\/\/ Brand foundations<\/h3>\n\t\t\t\t\t

Brand identity
<\/h2>\n\t\t\n<\/div>\n\n\t\t
\n
\n \t\t\t
Here, branding wasn't about marketing visuals but about a professional, functional interface that fits an enterprise setting. The goal was a clean, reliable, easy-to-read application design that supports data-driven decisions instead of distracting from the work. Material Design ensured consistent components, predictable interactions and room to scale.
<\/h5>\n\t\t\n<\/div>\n
\n
\n
\n \n<\/div>\n
\n \t\t\t

#B20012<\/p>\n\t\t\n<\/div>\n\n<\/div>\n

\n
\n \n<\/div>\n
\n \t\t\t

#FFF1EF<\/p>\n\t\t\n<\/div>\n\n<\/div>\n

\n
\n \n<\/div>\n
\n \t\t\t

#B02D29<\/p>\n\t\t\n<\/div>\n\n<\/div>\n

\n
\n \n<\/div>\n
\n \t\t\t

#FF665C<\/p>\n\t\t\n<\/div>\n\n<\/div>\n

\n
\n \n<\/div>\n
\n \t\t\t

#FF5400<\/p>\n\t\t\n<\/div>\n\n<\/div>\n

\n
\n \n<\/div>\n
\n \t\t\t

#FFFFFF<\/p>\n\t\t\n<\/div>\n\n<\/div>\n

\n
\n \n<\/div>\n
\n \t\t\t

#814A00<\/p>\n\t\t\n<\/div>\n\n<\/div>\n\n<\/div>\n\n<\/div>\n\n<\/div>\n\n<\/div>\n\n<\/div>\n

\n \t\t\t
<\/line><\/svg><\/div>\n\t\t\n<\/div>\n\n<\/div>\n
\n
\n
\n \t\t\t
\n \t\t\t

\/\/ Website details<\/h3>\n\t\t\t\t\t

Key website elements<\/h2>\n\t\t\n<\/div>\n\n\t\t\n<\/div>\n\t\t
\n\t\t\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t