Galerie d'art en ligne
CONFIGURATEUR DE FICHES PRODUITS
Problématique : Chaque photographie d'art existe en édition limitée, avec des formats spécifiques et un nombre d'exemplaires restreint par format. Le client doit pouvoir choisir son format, sa finition ( Dibond, caisse US, cadre classique..), puis configurer les détails : couleur, type de baguette parmi des centaines de références fournisseur, passe-partout sur mesure avec dimensions personnalisées. Le tout avec un rendu visuel fidèle, un prix calculé en temps réel et la mise en avant des formats épuisés.
Solution : Un configurateur sur mesure intégré à WooCommerce, connecté à l'API du fournisseur d'encadrement, avec prévisualisation en situation réelle et calcul dynamique des prix, poids et frais d'expédition.
FORMAT
→
FINITION
→
PRIX & POIDS
→
RENDU VISUEL
1
SÉLECTION DE L'OEUVRE
// format et disponibilité
- 01 Affichage des formats disponibles propres à chaque oeuvre (édition limitée)
- 02 Nombre d'exemplaires, mise en avant des formats épuisés
- 03 Sélection du format et passage automatique à l'étape finition
Gestion d'un configurateur personalisé
WooCommerce
PHP
2
CONFIGURATION DES FINITIONS
// encadrement et personnalisation
- 04 Choix de la finition : contrecollage Dibond, caisse US ou cadre classique...
- 05 Cadre classique : choix parmi les références fournisseur (API)
- 06 Passe-partout sur mesure : type, couleur, dimensions extérieures
Choix manuel des différentes finitions
PHP
API fournisseur
JavaScript
3
CALCULS DYNAMIQUES
// prix, poids, expédition
- 07 Calcul du prix en temps réel selon finition, baguette et passe-partout
- 08 Calcul du poids total (oeuvre + finition) pour les frais d'expédition
- 09 Tarification adaptée selon la rareté (exemplaires restants)
Vue en perspective
PHP
API REST
WooCommerce
4
PRÉVISUALISATION
// rendu en situation réelle
- 10 Rendu InSitu mise à jour : l'oeuvre à l'échelle dans un intérieur
- 11 Vue perspective avec effet de profondeur CSS pour visualiser la finition
Vue In Situ en proportions
CSS
JavaScript
Claude Code