Retour au portfolio Loopus WordPressWordPress / Plugin WooCommerce sur mesure / Éditeur photo produit

Seemly Customizer

Seemly, boutique néerlandaise de cercles muraux personnalisés, devait laisser ses clients placer leur photo dans le produit avant de commander. Le plugin transforme la page produit en éditeur circulaire Fabric.js : upload, positionnement et zoom dans le masque, indicateur DPI lié aux variations WooCommerce (40 à 140 cm). À l'ajout au panier, un export jusqu'à 300 DPI est généré pour l'impression.

January 2026Seemly.nl
Visiter le site en ligne
Vue d’ensemble du projet

J'ai développé Seemly Customizer comme un plugin WordPress/WooCommerce sur mesure pour Seemly.nl, une boutique e-commerce néerlandaise spécialisée dans les cercles muraux décoratifs personnalisés (Muurcirkel). Le plugin transforme la page produit en une expérience de personnalisation interactive où les clients peuvent télécharger leurs propres photos et créer des décorations murales uniques.

Le plugin dispose d'un éditeur circulaire sophistiqué construit avec Fabric.js et HTML5 Canvas. Les utilisateurs peuvent télécharger des photos par glisser-déposer, puis positionner et zoomer leur image dans le masque circulaire via des contrôles intuitifs (glisser à la souris, molette de défilement, gestes de pincement ou poignées de redimensionnement). Un indicateur de qualité DPI en temps réel avertit les utilisateurs si la résolution de leur image est insuffisante pour la taille de produit sélectionnée, garantissant la qualité d'impression pour des tailles allant de 40 à 140 cm de diamètre.

Le plugin s'intègre parfaitement aux variations de produits WooCommerce, adaptant automatiquement les exigences de qualité selon la taille sélectionnée. Lorsque les clients ajoutent au panier, le système génère un export haute résolution (jusqu'à 300 DPI) pour la production, avec les données du produit personnalisé. L'ensemble du workflow est optimisé pour la conversion avec une modale de prévisualisation claire et une fonctionnalité d'ajout au panier directe.

Vous avez un projet comparable ?

Décrivez le contexte, l’existant et le résultat que vous souhaitez obtenir.

Parler de mon projet