Vanth

Vanth is a concept couture house from Berlin, with clothing, shoes, accessories and fragrance for the evening. Its site presents the Autumn Winter 2026 season in eight lines, and each line has its own looks, pieces and eau de parfum. I created the brand, art directed every photograph with AI, and designed and built the store.

A visitor opens a piece from a dot on the photograph, picks a size, fills a bag and places a test order. The house, the lines, the names and the prices are fictional.

Role

Art direction, UX/UI design and front-end development

Scope

74 pages, eight lines, eight fragrances and a shop flow

Tools

Webflow, Client-First, GSAP

Industry

Fashion, E-Commerce

A couture house sells through its photographs. The visitor sees a gown on a staircase and wants its name, its material and its price in that moment. The store has to answer on the photograph itself and keep the campaign on screen.

The photography had a second job. Eight lines had to read as eight different worlds, and all of them had to belong to one house.

The references are the theatrical tailoring of Alexander McQueen, the volumes of Balenciaga, the corsetry of Mugler, the gilded jewellery of Schiaparelli and the punk tartan of Vivienne Westwood. The cast is multicultural.

Each line dresses a different tribe, with its own setting, fabric and color, and each one had a full photoshoot. A campaign photograph opens the line with its whole cast. The looks follow on location, one at a time. Each piece then appears alone, and the fragrance bottle rests on a surface taken from the world of its line.

Every photograph of the season sits on one grid below. Seen together, the eight worlds keep one light, one grain and one house.

The palette is paper, black and one red, and the red appears as a single accent on each screen. Headlines are set in Anton, in uppercase and at giant size. Inter Tight carries the body text and JetBrains Mono carries the labels. Corners are square. Most of the site sits on black, with sections in paper for breathing room, and a film grain runs over every page.

• The Home opens pinned. The campaign photograph grows until it fills the screen, and the word Vanth enters over it.
• The manifesto lights up word by word with the scroll.
• On desktop the eight lines pass sideways while the section holds. On a phone the row moves with a swipe.
• Two rows of giant names run in opposite directions at the speed of the scroll.
• On a fragrance page the bottle holds while the top, heart and base notes light up one at a time.
• Each look photograph opens out of a narrow band into the full frame as it arrives.
• Every scroll interaction follows the scroll in both directions, and the scroll itself is smooth.

Each look photograph carries a dot on every piece for sale in it. Hover or keyboard focus opens a card with the name, the material and the price of the piece. One card stays open at a time, and Escape closes it. A click leads to the page of the piece. On a phone the first tap opens the card and the second tap opens the piece.

A piece page shows its sizes in six systems, EU, FR, IT, UK, US and JP. The size guide opens over the page and switches between centimetres and inches. Add to bag says which piece went in, and the count in the menu survives a reload.

The bag lists each piece with its quantity and the total in euros. The checkout arrives filled in with a test order, is free of charge and confirms the order in a dialog.

• The store is built in Webflow with Client-First classes, native Ecommerce, CMS and Interactions, and the same design also runs as a site in code.
• The 74 pages are the Home, the lists of lines and fragrances, eight line pages, eight fragrance pages, 52 piece pages, the bag, the checkout and a 404.
• The interactions run on GSAP with ScrollTrigger and SplitText, loaded after the first screen is drawn, so the page shows before the animation code arrives.
• Pages change with a view transition, and a photograph that is still loading keeps its frame, so the move from page to page stays smooth.
• The three typefaces are hosted on the site, with fallback fonts measured to the same size, so the text shows at once and keeps its place when the fonts arrive.
• Every photograph comes in several sizes, so a phone downloads a smaller file.
• Every page has its own title and description.
• The photographs were generated with Higgsfield and Gemini.

• The dots open with the keyboard as well as with the cursor.
• The size options are native fields, and the size guide closes with Esc.
• With reduced motion on, every section stays still and complete, and the scroll is the browser’s own.
• Every photograph has its own description.

• 96-99performance on mobile
• 99-100performance on desktop
• 100accessibility and best practices

Lighthouse on mobile, published site, October 15, 2026.