Étude de cas · Refonte + direction artistique

STUDIØ 538 : un écrin sombre pour les photos

Le studio photo d’Axelle et Sébastien, à Arras : portrait, grossesse, nouveau-né, famille, mariage. Reconstruit sur Etch et Automatic.css pour que les images passent en premier, et que chaque page mène à une demande de séance.

Voir le site en ligne (nouvel onglet)Lire l’étude de cas

Le site STUDIØ 538 affiché sur un ordinateur portable

Studio: STUDIØ 538, Arras
Prestation: Refonte + direction artistique
Mise en ligne: Septembre 2026
Stack: WordPress · Etch + ACSS

PageSpeed mobile: 100Performance, accessibilité, bonnes pratiques ; accueil, 28 septembre 2026
Prestations: 7Chacune avec sa page, ses formules et ses questions fréquentes
Articles de conseils: 16Prix, préparation, idées de cadeaux

01 Point de départ

Le défi

STUDIØ 538 avait déjà un site, construit sous Bricks. Les photos y étaient, mais pas le reste : des pages sans titre principal, des fautes dans les textes, des formules Famille qui reprenaient mot pour mot les descriptions des Portraits, des prix barrés en permanence, un lien « Nous contacter » qui ne menait nulle part. Il fallait reconstruire le site sans rien perdre des images, et faire de chaque page un chemin vers une demande de séance.

Des pages sans titre principal
Des textes à corriger, des formules recopiées
Des prix barrés en permanence

02 Direction artistique

Un écrin sombre pour les images, du papier pour le reste.

Un studio se juge sur ses photos : le fond reste sombre pour qu’elles ressortent, et l’accueil s’ouvre sur une mosaïque de portraits. Autour d’elles, des gestes empruntés au papier : une lettre posée sur une pile de feuilles, une photo découpée en cœur, des cartes cadeaux étalées en éventail, un titre surligné. Le rose du logo signale chaque action, et le site n’emploie aucune police à télécharger : celle du système suffit.

Reconstruit sur Etch et Automatic.css
Une page, des formules et une FAQ par prestation
Réservations et cartes cadeaux par formulaire

La palette

Rose du logo#C82F63Boutons, sur-titres, cœurs des formules
Écrin#1A1A1ASections photo et pied de page
Carte#252525Formules et cartes cadeaux
Gris perle#EEEEEESections claires
Papier#FFFFFFLa lettre, les pages de texte

Les typographies

Police du système · Titres et texte
San Francisco sur Apple, Segoe UI sous Windows, Roboto sous Android : rien à télécharger
Police du système · Sur-titres
Capitales espacées, dans le rose du logo

Le décodeur

Chaque fonction du site a sa forme. En petit, ce qu’elle fait ; en gros, comment le site la présente.

Sur le site · La page d’accueil La mosaïque de portraits Trente portraits du studio composent le fond de l’accueil : on voit le travail avant de lire une ligne.
Sur le site · Qui sommes-nous La lettre La lettre d’Axelle et Sébastien, posée sur une pile de feuilles et signée de leur photo découpée en cœur.
Sur le site · Offrir une séance Les cartes en éventail Les cartes cadeaux s’étalent comme sur une table ; on choisit sa séance, puis on la demande par formulaire.
Sur le site · Le déroulé d’une séance La frise en zigzag Cinq étapes, du rendez-vous à la commande des tirages, de part et d’autre d’un fil rose ; sur mobile, le fil passe à gauche.
Sur le site · Les formules Les trois collections Trois collections par séance, sur fond sombre, chaque contenu marqué d’un cœur ; « Réserver » ouvre le formulaire de contact.
Sur le site · Les séances famille Le carrousel Les photos de famille défilent d’un geste ; les flèches sont celles du navigateur, sans une ligne de JavaScript.
Sur le site · Les séances portrait Les colonnes de portraits Trois colonnes de portraits défilent lentement, animées en CSS seul.
Sur le site · Les questions fréquentes Les questions surlignées Dix-neuf questions, une seule ouverte à la fois, sans JavaScript ; le titre est surligné de rose.

03 La visite

Visitez le site, page par page

Choisissez une page : elle s’affiche en entier, sur ordinateur et sur téléphone. Faites défiler chaque écran pour la parcourir.

Accueil du site STUDIØ 538 sur ordinateur, capture de la page entière

Accueil du site STUDIØ 538 sur téléphone, capture de la page entière

Accueil. La mosaïque de portraits, puis une section par séance : grossesse, nouveau-né, famille en carrousel, portraits en colonnes, mariage en pleine largeur.