Zalando Pick Application

Overview

About

Zalando's warehouse operations rely on "pickers", workers who collect items. The Pick app tells them where to go and what to grab.

Challenge

Pickers could only see one item at a time. But 8% of picks have 2-15 items in the same location. That's 2 seconds lost per item.

Impact

Displaying 2-3 items instead of 1 reduced the time per operation by 40%.

"2 seconds doesn't sound like much"

Until you multiply it.

Scenario

2 items in same box

3 items in same box

4+ items (up to 15)

Total affected

Frequency

5% of picks

2% of picks

1% of picks

8% of all picks

At warehouse scale, seconds compound into hours. The team calculated 40% time savings for affected operations.

Understanding the Domain

First, I learned every detail of the process before designing screens.

Five images illustrating warehouse picking: woman scanning a clothing package, man scanning a box on shelf, yellow barcode label with code C7E, handheld barcode scanner device, and a metal cart with blue and orange plastic bins.

Then I mapped the user flow. Because of this, I caught an edge case:

OLD FLOW (1 item)

Problem with item

Tap "Problem"

Done

New FLOW (2-3 items)

Problem with item

Tap "Problem"

Which item?

The goal is the same interface, rearranged for efficiency

While designing, I tried to use the new set of icons and components, I just created. None of it worked.

Then a senior designer told me, "Stop trying to be creative". So I used the same old UI, just rearranged existing elements.

I understood that by beautifying the app, I'd only confuse the users. Warehouse workers would waste time on relearning. So to reduce time, I designed almost an identical screen, just adapted to 2-3 items.

Four design decisions that shaped the solution

1. Removing the route map

Users used a storage location number (ex. 120-040-E-06) to find items in the new location. Map wasn't helpful.

2. Introducing “location bar”

Separated location info (top bar) from info about an item (main area).

3. Container shown once

To save space and make the task easier for users, together with developers we decided to not display items that go to different containers (blue or yellow), but instead only display the container once in the top app bar for all 2-3 items.

[data-wf-bgvideo-fallback-img] { display: none; } @media (prefers-reduced-motion: reduce) { [data-wf-bgvideo-fallback-img] { position: absolute; z-index: -100; display: inline-block; height: 100%; width: 100%; object-fit: cover; } }

4. Success feedback that matters

For single items, users don't need success icons. For multiple items, they need to know which item was just scanned. That's why I added a checkmark icon.

“Missing item” icon indicates when an item is reported missing.

Usability testing

We ran an A/B test: old flow (1 item) vs new flow (2-3 items). Participants completed picking tasks in a simulated warehouse setup while we measured task time, errors, and mental effort.

What we learned: Users identify itemsb by:

Colour (“if items are not black or blue”),
Size (“if it’s jeans, then it’s a big bag”),
QL number.

This validated our UI priorities — photo and QL code must be prominent.

Limitation: We tested with office workers, not pickers. But pre-dev testing catches usability issues cheaply. Real picker validation happens post-launch.

My contract ended before final results. But positive feedback and time-saving logic suggest successful implementation.

"I prefer the sequential flow. It was hard to remember those items. But it was clear when the box switched."

— Participant's feedback during testing