Un configurateur de sacs de créateurs est un outil numérique polyvalent qui sert à la fois les processus internes et les ventes. Il permet aux designers, aux fabricants et aux équipes commerciales de personnaliser et de visualiser le sac selon les matériaux ou les fermetures souhaités. En interne, il simplifie les processus de conception et de production, favorisant la collaboration, la création de prototypes et la prise de décision au sein des équipes. En externe, il s'impose comme un outil de vente performant, permettant aux acheteurs de personnaliser et de visualiser leur sac idéal avant de l'acheter. En offrant une expérience fluide et interactive, le configurateur améliore l'efficacité, réduit les délais de production et renforce l'engagement et la satisfaction des clients.
L'objectif de ce configurateur de sacs de créateurs est de présenter les variantes du produit ainsi que des informations détaillées qui complètent visuellement sa présentation. Une attention particulière a donc été portée à la création graphique de l'UI flottante et à son fonctionnement.
L'interface flottante doit :
Le sac de créateur a été modélisé dans 3D Studio Max, puis importé dans Vectary Studio, où il a été divisé en plusieurs éléments, texturé et calculé (baking). L'environnement de nature morte a été modélisé de zéro dans Studio.
L'éclairage est crucial dans ce projet en raison de la projection d'ombres. Une première source de lumière rectangulaire éclaire le sac de créateur, tandis qu'une lumière directionnelle projette l'ombre d'une plante sous un angle spécifique sur l'arrière-plan. Cette configuration est dynamique.
Les éléments de la scène créant l'environnement de nature morte présentent une palette de couleurs pastel, permettant de mettre en valeur l'objet principal. Tous les objets ont été calculés pour renforcer le réalisme. Le sac de créateur est disponible en quatre variantes de couleurs, chacune étant une copie d'un matériau avec une couleur modifiée, ce qui permet de limiter la taille du fichier. Diverses textures de cuir sont disponibles dans la bibliothèque de matériaux de Studio, parmi d'autres catégories de matériaux.
Astuce : conservez une petite taille pour l'arrière-plan et associez-le à un fondu afin d'utiliser une résolution plus faible pour les textures calculées.
Une petite UI flottante déclenche la visibilité de trois autres UI flottantes. Elles partagent des paramètres similaires, avec une position à droite et une hauteur définie sur « Remplir », permettant d'obtenir une mise en page semblable à celle des sites d'e-commerce. La FUI de description se compose uniquement d'éléments de texte alignés dans différents conteneurs. La FUI avec images, qui servent de déclencheurs pour le sélecteur de matériaux, est divisée en conteneurs par une grille 2x2. La FUI avec réalité augmentée comprend un QR code et un texte qui déclenche l'AR.
Par défaut, seule la FUI avec le menu, le filigrane et le logo est visible, tandis que les autres sont masquées. Cliquez sur les différents boutons du menu pour basculer la visibilité des FUI sélectionnées.
Voici ce qui est utilisé :
