Vizimel

Five ingredients, one tablet a day.

Product Design

Eye supplement, Vizimel
Romania · Zdrovit portfolio
Product site, desktop and mobile

A formula with long names

Vizimel is a food supplement from Zdrovit, for the eyes. Its box prints the formula on the front: luteină 24 mg, mezo-zeaxantină 10 mg, zeaxantină 4,8 mg, vitamina D, vitamina B2.

Three of those names are carotenoids few people could explain.

The site has to make the formula readable: what each ingredient is, what it is for, how to take the tablet and who it is for.

Navy and yellow, in cards

The page takes the box's colours: a navy hero with the box at full height, yellow for the buttons and the highlights. Everything after it is cut into cards, each saying one thing: four for the ways the site says the formula works, five for the ingredients, six for who it is for, three for the eye conditions.

5 ingredients, one card each, every card with its dose in a navy pill, from 24 mg of lutein to 1,4 mg of vitamin B2 Drop for more

Onepage

The menu runs VIZIMEL®, Formula VIZIMEL®, Afecțiuni oculare, Dovezi clinice, Blog, FAQs, with a yellow “Comandă acum” at the end. The hero sets the line “VIZIMEL® Protecție completă pentru sănătatea ochilor” beside the 120-tablet box, with three pills for the carotenoids and two buttons, “Comandă VIZIMEL®” and “Descoperă formula”. A yellow band opens the cards, with “Fără gluten” and “Fără lactoză” in two navy tiles. After the formula and the people it is for, three cards name eye conditions, a navy band repeats the order button, and the contact cards close the page.

Product site
UX/UI design
Desktop and mobile
Cards

Theproduct site

The vizimel.ro page on a phone, scrolling

vizimel.ro from the first screen to the footer, on desktop and phone.

Section bysection

A yellow band, VIZIMEL® susține sănătatea ochilor prin 4 mecanisme de acțiune sinergice, with Fără gluten and Fără lactoză in navy tiles, over four white cards with round icons

Afecțiuni oculare: two paragraphs and three cards with yellow round icons, Degenerescența maculară, Retinopatia diabetică and Oboseala oculară digitală

The yellow band with its four cards, and the eye conditions

Theformula

The formula, the way the site lays it out. “Fiecare ingredient cu rol precis” puts five cards in a row, each with a small icon, its dose in a navy pill, the name, its role in a word or two, a short paragraph and an “Află mai multe” link. “Mod de utilizare” gives the dose in one line beside a drawn tablet: “1 comprimat pe zi, preferabil în timpul mesei”. “Avantajele formulei VIZIMEL®” follows in four tiles, each with a yellow tick.

Ingredient cards
Usage
Benefit tiles

Fiecare ingredient cu rol precis: five cards with yellow top edges, Luteină, Mezo-zeaxantină, Zeaxantină, Vitamina D and Vitamina B2, each with an icon and its dose in a navy pill — Five ingredients, five cards, each with its dose

Avantajele formulei VIZIMEL®: four grey tiles with yellow ticks, Protecție antioxidantă completă, Susținerea pigmentului macular, Reducerea oboselii oculare and Suport pentru vedere pe termen lung, and a Descoperă mai multe button — Four benefits, one tick each

On aphone

On a phone the hero stacks the line, the box, the paragraph, the pills and both buttons. The cards fall into one column, the ingredient cards keep their dose pills top right, and the benefit tiles stack under a yellow underline.