An online suit configurator – customers arrive at the showroom knowing what they want

The goal was to build an advanced suit configurator that:

• Lets customers configure every part of their outfit to their own preferences.
• Shows a realistic preview of the selected options without having to contact store staff.
• Makes it easy for administrators to manage product variants and textures.
• Stays fast despite handling a large number of images and variables.

The biggest challenge was rendering the suit faithfully while keeping the interface smooth and intuitive. Given the huge number of possible combinations, performance optimization and the way data was organized in the CMS were also key.

The Boring Owl team designed and delivered a complete technology solution that supports the entire process of configuring and managing suits:

• Frontend: Next.js with TypeScript - for performance, image optimization and flexibility in implementing the logic.
• Application state: Zustand - for managing the configurator's global state.
• Forms and data handling: React Hook Form, Axios, React Query - for smooth communication with the backend and data validation.
• Backend and CMS: Node.js with Express, plus Strapi - managing configuration options, materials and content.
• Database: PostgreSQL - for an efficient, stable data structure.
• Hosting: Vercel - automated deployments and application optimization.
• Other integrations:

  • Media storage: Cloudinary - storing and optimizing texture and model images.
  • Testing and documentation: BugBug - end-to-end tests and documentation with test cases.

• An interactive 2D configurator that visualizes the suit in real time.
• An advanced configuration menu with dynamic rules for how options depend on each other.
• An admin panel in Strapi for managing textures, descriptions, prices and variant visibility.
• Support for zip packages containing graphic models, making it easy to upload new configurations.

• A smoother buying process: users can create a configuration on their own, without help from a consultant.
• Lower operating costs: the configurator takes over the initial customer consultation, saving time and resources.
• Higher user engagement and a simpler purchase path lead to better sales results.
• High application performance: despite the many options available, the app loads instantly and runs flawlessly.
• Realistic product visualization builds customer trust and reduces the risk of returns.

The Signor Leone configurator is the result of a careful choice of technology, a user-friendly admin panel and detailed visualizations. The tool greatly simplifies and automates ordering made-to-measure suits, and the app makes the experience more comfortable for users.