Toutes les réalisations
Boutique en ligne

L'Albatros Création

Refonte sur mesure de la boutique en ligne d'une marque de bijoux faits main, avec un back-office simplifié pour que les deux gérants gèrent seuls produits et pages.

Client
L'Albatros Création
Année
2026
Type
Boutique en ligne
Technologies
Figma, Next.js, React, TypeScript, Tailwind CSS, Payload CMS, PostgreSQL (Neon), Cloudflare R2, Resend, Docker
Page boutique de la refonte, avec les filtres par catégorie
01

Le contexte

L'Albatros Création vend des bijoux faits main dans des ateliers en Île-de-France et en Anjou : médailles miraculeuses, chaînes, bracelets et cols amovibles, de 8 € à 22 €. Ses clientes cherchent surtout un bijou à offrir (baptême, communion, cadeau personnalisé), et beaucoup arrivent par Instagram. Le site actuel a été monté par les deux gérants sur un modèle Webador : un design générique qui ne reflète pas l'univers marin de la marque, un paiement différé par lien envoyé par e-mail, et une plateforme louée dont on ne peut pas sortir. Le besoin : un site qui ressemble à la marque, que les gérants mettent à jour seuls sans risquer de casser le design, pour un coût annuel qui ne dépasse pas celui de Webador (environ 140 € par an).

Page d'accueil de L'Albatros Création : site Webador actuel à gauche, refonte à droite

En chiffres

pages maquettées puis intégrées
7
de design dans Figma
~5 h
de développement
2 j

La maquette

Maquette finale : elle combine les éléments choisis par les gérants dans plusieurs versions proposées.
02

Le design

J'ai proposé plusieurs versions de la refonte dans Figma. Les gérants les ont comparées et ont choisi des éléments dans chacune : la version finale les combine. Le résultat : 7 pages en desktop (accueil, boutique, fiche produit, à propos, contact, panier, favoris) et un design system en mode clair et sombre, repris tel quel dans le code.

Fiche produit Modèle Madeleine : site actuel à gauche, refonte à droite
03

Un back-office pour des non-techniciens

Le back-office est en français et pensé pour des personnes peu à l'aise avec l'informatique : sections toutes prêtes à ajouter et réorganiser, aperçu en direct, raccourcis et mode d'emploi intégré. Les couleurs et les polices ne sont pas modifiables, pour protéger le design. Les photos envoyées sont réduites et converties en WebP automatiquement, puis stockées dans Cloudflare R2. Les messages du formulaire de contact arrivent dans le back-office et par e-mail.

Tableau de bord du back-office, avec les raccourcis pour les gérants
Page boutique de la refonte, avec les filtres par catégorie
La boutique : filtres par catégorie, tri, favoris enregistrés sur l'appareil, achat sans création de compte.

Ce qui ne se voit pas

Une recherche qui comprend les clientes : « medaille » sans accent trouve bien les médailles.

Une boutique protégée : les tentatives de connexion répétées sont bloquées, le compte se verrouille après 5 mots de passe faux, et les formulaires ne peuvent pas être envoyés en masse.

Des données à l'abri : la base est sauvegardée, et la restauration a été testée avant d'en avoir besoin.

Un site qui appartient à la marque : il peut changer d'hébergeur sans réécrire une ligne de code.

Un projet du même genre ?

Estimez le prix de votre site en 2 minutes, sans engagement.