Product Enhancements — La bouche rouge

E-commerce site for La bouche rouge featuring the fragrance collection, custom engraving module, and modular navigation with Next.js × Shopify × Prismic.

Product Enhancements — La bouche rouge

La bouche rouge site preview

🧭 Role & Overall Context at Unlikely Technologies

Unlikely Technologies – Technical Support Retainer (2022 – 2024)
As the technical support lead across seven custom e-commerce sites, I partnered with project managers to triage client tickets (bugs, fixes, optimizations) via ClickUp. This structured process ensured optimal response times and freed up senior engineers, guaranteeing 100% uptime even during peak periods.

Project scope:

  • Scope: Seven bespoke e-commerce sites (Louise Damas, Nina Ricci, Jean-Paul Gaultier, Withenew…)
  • Mission: Handle client tickets (bug fixes, new features, optimizations, calls)
  • Process: Weekly prioritization and continuous resolution in ClickUp
  • Impact: Freed technical leads for major rebuilds and maintained full service availability

👩‍💻 Key Contributions

Custom Engraving Service

Context: Launch an optional engraving service on refillable cases with an added fee
Challenge: Define functional scope, embed the input module, and sync price and metadata with Shopify
Actions:

  1. Workshops with client and PM to define products, icons, text limits, and wording
  2. Built a React/Next.js engraving input component editable in Prismic per product page
  3. Extended the cart to display engraving option and dynamically adjust pricing
  4. Configured custom Shopify metafields to reflect engraving on invoices and manage pricing

Outcome: A seamless personalization feature fully driven by the CMS, accurately tracked in Shopify.

Global Navigation Redesign

Context: The existing navbar was too rigid for customizable items, icons, and advanced sub-menus
Challenge: Deliver a fully customizable navigation on desktop and mobile, covering all Figma-specified cases
Actions:

  1. Rebuilt the Navbar component: configurable items (title, icon, link), multi-column sub-menus, hover image zones, editable styles (typography, colors)
  2. Adapted for mobile with a responsive drawer offering the same customization options
  3. Conducted exhaustive manual testing for edge cases (long text, missing icons, large menus)
  4. Refactored the serializer to ensure consistency between Prismic and Next.js

Outcome: A developer-free navbar that is fully customizable, consistent across devices, and easy to evolve.

Fragrance Line Integration

Context: Launch of the “Les Parfums” vertical requiring tailored product pages, variants, and checkout flow
Challenge: Model fragrances in Shopify and Prismic, then adjust front-end and cart logic for samples and offers
Actions:

  1. Created Shopify product records and Prismic schemas for the new fragrance catalog
  2. Developed a dedicated Next.js product template (variant selection, visual layout, descriptions)
  3. Implemented sample-offer logic (front + back)
  4. Built a Prismic marketing landing page to support the launch

Outcome: Rapid rollout of the fragrance line, full marketing autonomy, and an enriched shopping experience.

⚙️ Tech Stack & Tools

  • Next.js (TypeScript, ISR, SSR, SSG)
  • Vercel (previews & deployments)
  • Prismic (Headless CMS)
  • Shopify (Admin API, Storefront API)
  • SCSS
  • ClickUp, Figma, Algolia, Slack, Doppler

📈 Performance Metrics

Maintained strong Core Web Vitals (Chrome UX Report, April 2025):

  • LCP: 2.5 s
  • INP: 122 ms
  • CLS: 0.01
  • FCP: 2.2 s
  • TTFB: 0.4 s

🧠 Lessons Learned

Enhanced my skills in headless product customization, modular component design, and full-stack Next.js × Shopify integration.

📬 Got a similar project?

👉 Let’s chat and start collaborating