One project.
Every direction.
The current record of the creative routes, latest refinements and decisions. Previous versions remain available for comparison.
Editorial 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 and previous interaction experiments are retained. The rejected moving-copy experiment is under Preserved copies.
All ten studies.
| No. | Version | Creative emphasis / status | What it explores |
|---|---|---|---|
| 01 | Editorial ↗ | Brand & reputation | Original editorial homepage; preserved. |
| 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 ↗ | Latest editorial exploration | Scroll-driven intro inspired by Petpak: glass movement, progressive text reveal and a natural handoff into markets. |
These are our creative-route labels. The client brief combines brand and conversion objectives; it does not prescribe these categories.
Seven primary branches.
Our company · Your market · Make your product unique · Innovation · Sustainable impact · Careers · Contact.
The four markets are Beauty, Spirits, Healthcare and Consumer.
Review the client sitemap →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.
Interactive homepage concepts, a structural wireframe, browser previews, 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. Client fonts and supplied video excerpts are used in the concepts.