Work / Unived

Case study · Shopify storefront concept

Unived Nutrition that shows its working.

Ninety-one vegan sports and daily nutrition formulations, every batch independently tested before release. The storefront concept is built around a single idea: that every claim on the pack should be one you can look up before you open it.

Take the tour
Client
Unived
Industry
Sports and daily nutrition
Range
91 formulations
Scope
Storefront design concept
The Unived homepage concept: a cyclist in white on a red road bike, under the headline Fuel you can check.
The same homepage on a phone.
The brief

Every supplement brand says the same things. Almost none can prove them.

Clean label. Third-party tested. No fillers. Every competitor on the shelf makes some version of that promise, which means the promise itself has stopped selling anything.

Unived has had the receipts since 2010: a lab report for every batch and no proprietary blends, ever. The concept spends its design budget on turning that into something a customer can act on. Put the batch code in the header, live on every page. And build the page around the dose rather than the product, because an endurance athlete is buying a schedule, not a flavour.

Where this stands. This is Concept 04, a design exploration, not a live build. The batch number, test date, laboratory and results shown in the verification screens are illustrative placeholders standing in for real certificate data, and the range counts are carried from earlier rounds pending a check against the live catalogue.

"The lab report is public. Look it up before you open the pack." From the homepage concept

Inside the concept

Three templates, one argument.

Scroll through each page from top to bottom, or open it full size.

Full homepage concept: hero, where to start, the race-day protocol, batch verification, six flavours, bestsellers and the founder quote.

Homepage

Three numbers under the hero do the positioning: every batch tested, zero proprietary blends, one hundred percent vegan.

  • Three doors in, by how much you already know
  • The race-day protocol, laid out by the clock
  • Batch verification, on the page rather than buried
  • Six flavours as one band of colour
On the phone

Read at the start line, not at a desk.

Dose timings and batch checks are things people look up mid-training, so the phone layout carries the same detail rather than a trimmed version of it.

Homepage on mobile, full length.
Homepage Three numbers, then the range
Product page on mobile, full length.
Product page Dose before flavour
Our Story page on mobile, full length.
Our story Timeline, stacked
Design language

One typeface, and nothing to hide behind.

No display face, no second family, no decorative anything. A single grotesque carries the whole store, and weight does the work that a second typeface usually does.

Transparency, in practice
Fuel you can check.

Vegan sports and daily nutrition, dosed to the research and tested every batch. The lab report is public: look it up before you open the pack.

Light Display lines
Regular Body and labels
Semibold Emphasis and numbers
Ink#0F100E
Graphite#1C1D1B
Leaf#69A043
Grove#3D6B28
Soft#F6F6F3
Interface kit

The pieces the language is built from.

Every component below is a screenshot of the build, not a mockup. One typeface, one set of hairline rules, whether it is a button or the whole batch lookup.

A white pill button reading Shop the range.An outlined pill button reading Check a batch, with an arrow.A wide dark Add to cart button with the price.
Two on photography, one on paperWhite and outline live over the hero imagery; the solid dark one is the only button that ever carries a price. Full pills throughout, which is the single soft shape in an otherwise square system.
A product card for Gel 100 with a bestseller tag, price, six flavour dots and an add to cart button.
Product cardName, one line of spec, price, then six coloured dots standing in for the flavours. The dots are the only decoration on the card and they carry real information.
The cart drawer with three line items, a free shipping progress bar, quantity steppers and a subtotal.
Cart drawerSlides over the page rather than interrupting it. Free shipping is a progress bar rather than a nag, and each line repeats the thing that distinguishes it: the flavour, the caffeine, the sachet count.
A six-cell flavour picker, each cell naming a flavour with its caffeine or sodium note.
Flavour pickerEvery cell carries the thing that actually decides it: caffeine-free, plus forty percent sodium, fifty milligrams of caffeine. Nobody picks an endurance gel on taste alone.
A size selector reading box of 6 sachets, 6 by 41 grams.A row of five product page gallery thumbnails.
Size and galleryOne size option, spelled out in full rather than abbreviated to a code. Below it the gallery runs packshot, then the product in use, so the shot that answers "how big is it" is never buried.
The site header: five links, a live batch pill reading passed, and search, account and cart icons.
Header, with a batch pillFive links and the whole argument in one chip: a batch number with a green dot and the word passed, sitting in the header on every page. No other supplement store puts its test status where the search box usually goes.
The six flavour panels, each a block of its own colour, with the sixth opened to show its description.
Six flavours, one bandAn accordion that reads as a colour chart. Closed, the six panels are a palette; opened, one expands to give the caffeine, the timing and what it is for. It replaces six product tiles with one object.
The batch verification section: a field for the batch code beside a panel showing test date, laboratory, heavy metals, microbial and label claim results.
Batch lookupType the code printed on the box and the certificate comes back: date, laboratory, heavy metals, microbial, label claim. This is the section the rest of the design exists to support, which is why it gets the full-width dark band.
What we designed

The work, at a glance.

  • Four homepage concepts to one direction
  • Colour and type system
  • Batch verification pattern
  • Race-day protocol layout
  • Product template
  • Flavour accordion
  • Dose and label tables
  • Brand story page
  • Cart drawer
  • Mobile templates

Is your store as good as what you sell?

Tell us about your brand and your current store. We'll show you what we'd change first.

Schedule a Strategy Call
Page