One project.
Every direction.
The current record of the creative routes, latest refinements and decisions. Previous versions remain available for comparison.
Material & Meaning.
A three-product hero with a larger, lower headline that scales consistently across desktop widths, plus oversized, cropped perfume, spirits and healthcare renders, a rising curtain transition, a centred scroll headline and changing bottle studies with inset product photography over Stoelzle’s warm studio and timber settings.
Explore the new editorial direction →LATEST STRUCTURE-FAITHFUL VERSION / 11Client structure.
The seven branches and nested navigation match the proposed workbook. Homepage coverage follows the UX/UI brief; deeper routes are navigation prototypes.
Explore the client-structure version →EARLIER EDITORIAL EXPLORATION / 10Editorial v2.
The original Editorial design, with a scroll-driven introduction inspired by Petpak.
Explore the new opening →PREFERRED MOTION REFERENCE / 08Product & story.
The confirmed layout reference: product left, fixed copy and CTA right. This is a preference for the interaction, rather than final client sign-off.
Open the reference →CURRENT BOTTLE EXPLORATION / 09Pinned glass story.
One continuous full-width scene stays pinned through a long scroll. Bottle and copy remain anchored while the glass expression and story change, with a soft frosted area behind the copy.
Open the current version →Premium presence.
Clear next steps.
The client brief asks for a premium, innovative image and qualified leads. The website must help prospects find packaging, explore a bespoke project, request a quote or sample, and contact an expert. It also serves creative partners, existing accounts and candidates.
The shared foundation.
- Headlines
- LFS Adelia Regular, in all caps.
- Other text
- Basis Grotesque for body copy, navigation, buttons and captions.
- Readability
- The latest combined route uses larger copy, prominent tertiary actions and generous click areas.
- Bottle stories
- Products sit on the left, with grouped headline, description and CTA on the right. Gentle rotation adds depth. Text does not slide across the bottles.
- Film panel
- Pure black continues from the heading into the product film.
- Motion
- Motion supports the story; mobile uses simpler layouts and chapter controls where appropriate. Reduced-motion visitors receive a calmer presentation.
- Version history
- Original directions, Futura iterations, pre-brandbook copies and previous interaction experiments are retained. The rejected moving-copy experiment is under Preserved copies.
All twelve studies.
| No. | Version | Creative emphasis / status | What it explores |
|---|---|---|---|
| 01 | Editorial ↗ | Brand & reputation | Original editorial homepage, with subtle brandbook category accents. |
| 02 | The atelier ↗ | Product & co-creation | Architectural hero and interactive bottle customisation. |
| 03 | The glass story ↗ | Brand & business | Full-width storytelling based on the client structure. |
| 04 | Glass in motion ↗ | Immersive & experiential | Parallax opening and a horizontal bottle sequence. |
| 05 | Bare wireframe ↗ | Structure & journeys | Eight structural templates, sitemap and key journeys. |
| 06 | Shaping possibilities ↗ | Brand & business | Combined direction with early market paths and a bespoke-project tool. |
| 07 | Larger type ↗ | Readability refinement | Larger body text and stronger tertiary actions; scroll corrected with product-left / fixed-copy-right layout. |
| 08 | Product & story ↗ | Preferred motion reference | Product left; fixed, grouped headline, text and CTA right. Gentle 3D rotation. |
| 09 | Long scroll + frost ↗ | Current bottle exploration | A long pinned brochure scene; anchored bottle and fading copy; softly frosted text area; black film panel. |
| 10 | Editorial v2 ↗ | Earlier editorial exploration | Scroll-driven intro inspired by Petpak: glass movement, progressive text reveal and a natural handoff into markets. |
| 11 | Client structure ↗ | Exact proposed hierarchy | Seven navigation branches and nested entries from the workbook, plus every required homepage block. Catalogue links continue to current services; deeper routes are prototypes. |
| 12 | Material & Meaning ↗ | Brand & material / editorial | Fluid Glass-inspired parallax hero and curtain handoff; a centred headline over the collage zoom; three distinct bottle studies with inset product photography and warm client settings inspired by Studio D. Subtle staggered card and text reveals. |
These are our creative-route labels. The client brief combines brand and conversion objectives; it does not prescribe these categories.
Distinct worlds.
One visual language.
Corporate blue anchors the identity. Market sections use light category washes, fine rules and considered accents; product imagery keeps its natural light and material character.
Colours are approximate samples from the supplied screenshot. Darker derived tones keep small text and buttons readable. Final production should use the master brandbook values.
Photography follows three pillars: premium products, authentic people and real industry. Use each in its relevant story rather than treating texture as decoration. The bare wireframe stays neutral.
Review all twelve studies and their preserved originals →Seven primary branches.
Our company · Your market · Make your product unique · Creating value: innovation · Sustainable impact · Careers- Join us · Contact us.
The four markets are Beauty, Spirits, Healthcare and Consumer.
Review the exact hierarchy and homepage coverage →Four useful paths.
- Known product need → catalogue → product → sample or quote.
- Bespoke project → capabilities → case studies → contact an expert.
- Creative partner → case studies → customisation → early project contact.
- Candidate → careers → job detail → application.
Working explorations.
Twelve interactive studies, including a new structure-faithful homepage and full sitemap navigation, plus a structural wireframe, supplied films, illustrative 3D glass studies and preserved versions. Enquiry actions connect onward to Stoelzle’s existing contact service.
From direction to system.
Select the final route, develop the full 20-template system and four complete journeys, then prepare components, responsive rules and the Figma handoff in the client’s workspace. Designs have not yet been transferred to Figma.
Client sitemap and UX/UI brief define structure and journeys. The technical tender informs the delivery context. Cartier informs the luxury storytelling and product/copy relationship; Petpak informs Editorial v2’s scroll-driven opening. Material & Meaning adds references from Fluid Glass, Exo Ape’s St. Regis Venice project and Studio D. Its backgrounds reframe Stoelzle’s warm studio and timber product photography; its isolated bottle is an illustrative AI-generated glass study. Client fonts and supplied video excerpts are used in the concepts.