Hero Image
E-commerce

Haus of Tiles

Haus of Tiles required a fully embedded, high-end product configurator to bring their customizable Mahjong sets to life online. Using Kickflip's 2D configurator, we developed a seamless in-page customization experience where users build their Mahjong setup step-by-step — selecting backgrounds, mats, tiles, racks, shufflers, and accessories with real-time visual updates that reflect the brand's premium aesthetic.

Haus of Tiles
Haus of Tiles - Project Overview

Project Overview

Haus of Tiles required a fully embedded, high-end product configurator to bring their customizable Mahjong sets to life online. The goal was to create an immersive, design-forward experience directly within their Shopify store — moving away from traditional product selection into a visually rich, interactive journey. Using Kickflip's 2D configurator, we developed a seamless, in-page customization experience where users can build their Mahjong setup step-by-step. From selecting backgrounds and mats to layering tiles, racks, shufflers, and accessories, every choice updates in real time — resulting in a complete, styled environment that reflects the brand's premium aesthetic.

Haus of Tiles - Problem Statement

Problem Statement

Before this solution, presenting highly customizable Mahjong sets in a structured and engaging way was a challenge. The large number of product variations — across mats, tiles, racks, accessories, and decorative elements — risked overwhelming users and creating friction in the buying process. The client required a fully embedded experience (no pop-ups or modals), a visually cohesive interface aligned with their luxury branding, a way to guide users through complex customization without confusion, and accurate layering and positioning of multiple product elements. The core challenge was to design a scalable configurator that simplifies complexity while maintaining a premium, intuitive user experience.

Haus of Tiles - Our Solution

Our Solution

  • Fully embedded configurator within Shopify product/custom page
  • No modal or pop-up behavior; integrated directly into the page layout
  • Header "Customize" button navigating users to the configurator
  • Panel-based layered composition system for accurate product placement
  • Sequential, guided customization flow to reduce decision fatigue
  • Real-time visual updates for every selection
  • Default clean starting state (white background, pre-selected mat)
  • Support for complex product layering (tiles, racks, shufflers, accessories, décor)
  • Conditional logic for associated items (e.g., straps linked to bags)
  • Optimized responsive experience for desktop and mobile

Technologies Used

Kickflip 2D Product CustomizerShopify Theme Integration (Embedded Architecture)Layer-Based Image Rendering SystemDynamic Option Logic & DependenciesResponsive UI/UX Design

Key Features

  • Fully embedded, non-popup configurator experience
  • Real-time 2D scene building with layered product visualization
  • Structured customization across 17 configurable categories
  • Panel-level control for tiles, mats, racks, and accessories
  • Smart grouping of related products (bags, straps, add-ons)
  • Dynamic scene composition (backgrounds, décor, lamps)
  • Guided step-by-step user flow
  • Clean default state for better onboarding
  • Premium, brand-aligned visual presentation

The Results

  • Transformed a complex product catalog into an intuitive visual experience
  • Improved customer understanding of product combinations
  • Reduced friction in the customization journey
  • Increased buyer confidence through real-time visualization
  • Created a scalable system capable of handling extensive product variations
  • Delivered a premium, immersive shopping experience aligned with Haus of Tiles' brand identity

Product Demos

Project Gallery

Haus of Tiles - Image 1
Haus of Tiles - Image 2