Configurateur 3D pour ShopifyShopify Configurator

Exemple

La démo ci-dessous est en japonais.

La page produit d’un gobelet inox d’une boutique en ligne d’atelier fictive. Le produit a 8 variantes (2 couleurs × 2 contenances × avec ou sans gravure), et le prix varie entre 3 800 ¥ et 4 700 ¥ selon les choix.

Le panier de l’exemple n’est pas relié à un vrai panier : le bouton d’ajout affiche en bas de l’écran ce qui arriverait dans le panier. La même page produit d’exemple est dans le zip, pour essayer en local sans Shopify.

Voir aussi sur la page du Configurateur de produit 3D / Ouvrir l’exemple dans une nouvelle fenêtre

Ce qu’il fait

• À chaque choix de couleur ou de contenance, le produit 3D et le prix changent aussitôt. Le prix est celui de la variante correspondant à la combinaison
• Les choix sont ajoutés à la ligne du panier. Panier et paiement affichent des lignes comme le texte gravé, et le détail de commande dans l’admin garde le récapitulatif des choix et une URL qui rouvre la même vue 3D
• Cinq types d’options : couleur, matière, pièces interchangeables (contenance, par exemple), gravure et logo. Les combinaisons s’écrivent en JSON, sans programmation
• Les réglages sont dans le métachamp de chaque produit et le modèle 3D (GLB) dans les fichiers Shopify. Ni serveur, ni service externe, ni clé d’API
• Sous les options, des boutons enregistrent un PNG, copient une URL de partage et réinitialisent
• Les textes côté client sont en japonais et en anglais, selon la langue d’affichage de la boutique
• En cas d’erreur de réglage, le client ne voit qu’un court message, et la liste des corrections s’affiche dans l’éditeur de thème
• Les produits au métachamp vide n’affichent rien : ils peuvent partager le même modèle de page que les produits sans 3D

Pour qui

• Boutiques et fabricants qui vendent sur Shopify des produits à choix de couleur ou de matière : gobelets, mobilier, enseignes, vêtements, objets promotionnels
• Ceux que l’abonnement d’une application 3D freine, ou qui veulent s’en tenir au thème sans ajouter d’application
• Ceux qui veulent que la gravure et les combinaisons soient bien enregistrées dans la commande
• Agences et indépendants qui montent des boutiques Shopify, comme composant à livrer aux clients

Facturation

Le montant réellement facturé par Shopify est uniquement le prix de la variante dans le panier. Les fichiers ajoutés au thème ne peuvent pas modifier les prix : deux modes de prix existent, au choix pour chaque produit.

Le mode variantes (recommandé) relie des groupes comme la couleur, la contenance ou la gravure aux options du produit, affiche le prix de la variante correspondante et l’ajoute au panier. Affichage et facturation concordent toujours. On peut relier jusqu’à 3 groupes, comme les 3 options d’un produit Shopify.

Le mode prix de référence affiche le prix de la variante augmenté des suppléments de chaque groupe comme « prix de référence », toujours avec une mention. Panier et paiement n’affichent que le prix de la variante, et la boutique encaisse la différence à part après la commande. Il convient aux petits écarts ou à la fabrication sur commande.

Protections

• Les choix ne sont envoyés qu’au panier de la même boutique. Rien ne part vers des services externes
• L’image de logo choisie par le client est seulement appliquée au modèle 3D dans le navigateur, et envoyée nulle part
• Le texte de gravure est vérifié à l’écran selon les caractères et la longueur autorisés. Les valeurs de la commande viennent du navigateur du client : vérifiez-les avant fabrication
• Le JSON de réglages est dans un métachamp que seuls les administrateurs peuvent écrire. La page le lit comme du JSON, sans jamais l’exécuter
• Les applications qui réécrivent les scripts du thème l’empêchent de fonctionner ; excluez les fichiers du kit de ces réécritures

Coûts

Le composant est un achat unique. Pas d’abonnement d’application. Il n’utilise ni serveur ni API externe : aucun coût à l’usage. Réglages et modèles 3D restent dans votre boutique Shopify.

Contenu

• theme/ (7 fichiers à ajouter au thème : 1 section, 1 snippet pour utiliser le bouton d’achat du thème, 5 assets)
• samples/ (2 réglages d’exemple et un modèle 3D d’exemple)
• page/mock-product.html (une page produit d’exemple à essayer sans Shopify)
• src/ (code source de l’intégration Shopify ; modification libre)
• README.ja.md, README.en.md, LICENSE.md, CHANGELOG.md, THIRD-PARTY-NOTICES.md

Prérequis

Un thème Online Store 2.0. Testé sur une boutique de développement Shopify avec Dawn 16.0.0, Horizon 4.2.0 et le thème par défaut de la boutique de développement. Une commande test en mode prix de référence, les devises autres que le yen et la méthode du bouton d’achat du thème n’ont pas encore été testées. Le README fourni liste ce qui a été testé ou non.

Fournissez votre propre modèle 3D (.glb) ; sa création n’est pas incluse. Côté client, un navigateur récent compatible WebGL.

Prix et achat

16 800 ¥ TTC, achat unique. Les acheteurs reçoivent gratuitement les mises à jour 1.x. Modification et livraison intégrée à la boutique d’un client autorisées ; redistribution, revente, vente comme produit similaire et publication ou vente comme application ou thème Shopify interdites. Pour un site hors Shopify, utilisez le Configurateur de produit 3D, vendu séparément ── note / BOOTH

L’achat se fait en japonais sur BOOTH ou note, avec paiement en yens.

Pour confier l’installation, un service existe (100 000 ¥) : vérification des noms de pièces du GLB, réglage des métachamps, correspondance options–variantes, installation dans le thème et commande test, jusqu’à 3 produits, en 14 jours avec 2 révisions (création du GLB et modification du thème non incluses), via Coconala et Lancers (en japonais).