Explaining full traceability, one scroll at a time

ZPD, part of the Zeria Group, makes pharmaceutical and health products, and one of the things that sets them apart is traceability: they can follow a product all the way back through every step, from its origin to the finished thing on the shelf. It's a genuinely strong story, but it's also the kind of thing that turns into a wall of text the moment you try to explain it.

So instead of explaining it, I built something you move through. This is a single scrollable experience that walks you down the chain one step at a time, so the concept lands as a journey rather than a paragraph. My role was the design and the frontend build.

The whole idea rests on a simple decision: the scroll is the narrative. You start at the origin and, as you move down the page, you travel forward through each stage of how a product is made and tracked, ending at the finished product. The page mirrors the supply chain it's describing, so the form teaches the concept before any of the words do.

Pacing was the real design problem. Each step needs room to land before the next arrives, transitions have to carry you forward without making you wait, and the motion has to stay quick — a traceability story should feel precise and trustworthy, never sluggish. It's the kind of thing that only really reads in motion, so here's the full walkthrough.

A linear, scroll-driven story turned out to be exactly the right shape for this. Traceability is a sequence, so letting people experience it as one makes an abstract corporate strength feel concrete and a little bit cinematic. By the time you reach the bottom, you haven't read about the chain — you've travelled the length of it, which is a far better way to believe a claim like "full traceability" than being told it.