VELTRIVA CLM presentation
Built from scratch for this portfolio with an invented brand, because the real decks are client-confidential. Everything else is real: the 1024×768 iPad canvas, the key-message flow, the ISI drawer, the reference modal, and the constraint that the whole thing has to run with no network at all.
- Client
- Northmere Therapeutics
- Discipline
- Veeva CLM
- Year
- 2026
- Role
- Concept, design and build
Why this one is invented
The CLM decks I’ve actually shipped belong to their brands and can’t be published. So I rebuilt the anatomy of one under a fictional name — VELTRIVA® (obelacitinib), Northmere Therapeutics, neither of which exists. The molecule, the trial data and the safety copy are all invented and labelled as such inside the demo itself. What’s genuine is every piece of engineering below.
The environment
A CLM presentation runs on a rep’s iPad, inside Veeva, in a hospital corridor with no signal. There is no CDN, no analytics beacon that can block a render, no lazy-loading anything from anywhere. Whatever the deck needs, it carries.
The canvas is 1024×768 and it does not move. There is no responsive fallback, because there is no other viewport — which is freeing, once you stop fighting it. Every measurement in the stylesheet is a real pixel on a real device.
What I built
Four key-message slides on a single deck controller: cover, mechanism, efficacy, dosing. Navigation runs three ways at once — the bottom nav bar, the arrow keys, and a horizontal swipe — because reps use all three and a rep mid-conversation shouldn’t have to think about which.
The mechanism slide animates a signalling pathway as an SVG stroke-dash sequence, with the four explanatory steps lighting up in time with it. The efficacy slide counts its bars up from zero on an expo curve. Both replay every time you return to the slide, which is how these decks are actually used: a rep jumps back to a slide because they want to say it again.
The ISI drawer is the piece that matters most. It expands over the slide rather than pushing it, auto-scrolls after a three-second dwell, and stops the moment a finger or cursor enters the copy — so nobody is fighting an animation while reading a line aloud to a physician. The scrollbar is hand-built, for the same reason it was on the banner: the native one can’t be styled in the iPad WebView, and review needs to see the position indicator.
What it took
No raster assets at all. The gradients, the orbs, the icons and the pathway diagram are CSS and inline SVG, which is why the whole deck is 107 KB including the animation library — and why it stays sharp at every zoom level the WebView allows.
Swipe handling runs on Pointer Events rather than a touch/mouse fork. The iPad WebView has supported them since iOS 13, which removed the last reason to keep two code paths for one gesture.