Free course suggestion: Grasp JavaScript animation with GSAP by means of 34 free video classes, step-by-step tasks, and hands-on demos. Enroll now →
A pioneer of recent jewellery, Raymond Templier (1891–1968) stays one of many defining figures of the Artwork Deco avant-garde. Born right into a household of Parisian jewelers, he rejected decoration for geometry, symmetry, and stability — creating items that transcended adornment to turn out to be pure expressions of kind and light-weight.
His compositions — intersecting circles, polished planes, and contrasting supplies reminiscent of platinum, onyx, and lacquer — embodied a radical imaginative and prescient: jewellery as structure in miniature.
A founding member of the Union des Artistes Modernes (UAM) alongside figures like Le Corbusier and Charlotte Perriand, he championed a brand new aesthetic grounded in performance and creative integrity. His legacy continues to affect up to date designers who see jewellery as each an object of artwork and design.
Design
At the moment, because the Templier household reissues a collection of his most emblematic creations, they entrusted us with the design and growth of the Maison’s new Shopify web site — a undertaking conceived as each gallery and archive, bridging digital expertise and creative legacy.
The redesign is grounded in a brand new visible id and artwork route that reinterprets the model’s heritage by means of a recent lens. Fairly than counting on the acquainted opposition of custom versus modernity, the undertaking seeks a timeless modernist stability — a recent kind that breathes the spirit of its origins with out imitation.
The location is structured like a digital gallery, the place every jewel is handled as an paintings: photographed with restrained class, that reveal the play of volumes, supplies, and reflections. The photographic route embraces movement, utilizing sluggish, deliberate shifts in perspective to underscore the architectural nature of Templier’s compositions — strong but fluid, rational but sensual.
In dialogue with this imagery, the interface unfolds with choreographed transitions of refractions that echo the architectural essence of Templier’s work. Scrolling feels clean and steady; pages dissolve into each other by means of reveals, mushy fades, and shifting reflections — a visible rhythm that mirrors the round motifs and interaction of sunshine that outlined the jeweler’s modernist language.
The result’s a digital atmosphere that honors Templier’s legacy by means of restraint, readability, and emotion — a recent translation of his perception that fashionable magnificence resides not in decoration, however within the purity of kind and the concord of movement.
Tech Stack & Structure
Quentin: Because the developer on this undertaking, my position was to developed a customizable e-commerce platform, working carefully with the design and shopper groups.
The location is constructed on Shopify (native liquid templates) with a customized theme developed by JC Suzanne, based mostly on Daybreak. To reinforce the person expertise, we added at this tradition theme, a contemporary front-end layer:
- piecesjs as light-weight JavaScript framework to handle native internet parts
- GSAP for clean and performant animations
- Lenis for scroll administration
- Swup for web page transitions
This setup ensures maintainability, flexibility, and robust efficiency throughout units.
Customizable Editorial Pages
We constructed a customizable system utilizing Shopify’s sections that lets the shopper compose editorial pages precisely as they need. Every web page is assembled from a home made library of sections, with the power so as to add blocks, reorder them, and see the actual‑time visible end result whereas filling fields. This strategy preserves the design system whereas giving full editorial management and modularity.
The hero part of this template additionally permits the shopper to creatively play with patterns whereas at all times respecting the general design system. The web page is constructed so the shopper can replace and handle content material straight from the Shopify admin, utilizing customized blocks and dynamic sections. This empowers the shopper with editorial management and artistic flexibility with out compromising the positioning’s visible consistency.
Web page Entrance Animations
A particular consideration was given to the doorway animations for every web page, with transitions designed to match the hero part’s temper. Some of the pleasurable to develop was the product web page animation, which includes a mirror impact that provides a particular and dynamic reveal as customers land on the web page.
Loader Animation
One other enjoyable component is the customized loading animation, constructed with GSAP to introduce the model by means of movement. The concept behind this loader was to stay discreet, whereas subtly highlighting the standard of the shopper’s merchandise. The animation units the tone for the positioning expertise with out overwhelming the person.
Selecting the Proper Structure
At Index, we consider native Shopify (Liquid) vs. headless firstly of every undertaking. Typically, native already provides us the entrance‑finish freedom we want. For us, headless is reserved for particular constraints or integrations.
For Templier, native was the proper selection: quicker to construct, secure, and safe, whereas holding full inventive management over the expertise. We use a boilerplate that improves with every undertaking and lets us push the entrance finish: piecesjs for internet parts, Swup for web page transitions, GSAP for animations, and PostCSS/Tailwind for kinds. A crafted, excessive‑performing retailer that’s simple to take care of.
