Quartier des Spectacles International
Quartier des Spectacles International
TOOLS:
TOOLS:
Framer, Figma
Framer, Figma
TIMELINE:
TIMELINE:
4 months
4 months
ROLES:
UX/UI Designer • System Lead
Designing a Scalable ux System
Designing a Scalable ux System
Quartier des Spectacles International (QDSI) commissioned a scalable UX system for 11 exhibition microsites, each accessed through QR codes on-site and designed to deliver artist information, educational content, interactive activities, and reflection prompts on mobile.
The experience needed to feel cohesive within the QDSI brand while remaining visually flexible to reflect each artist’s unique identity.
Quartier des Spectacles International (QDSI) commissioned a scalable UX system for 11 exhibition microsites, each accessed through QR codes on-site and designed to deliver artist information, educational content, interactive activities, and reflection prompts on mobile.
The experience needed to feel cohesive within the QDSI brand while remaining visually flexible to reflect each artist’s unique identity.
Industry
Industry
Culture
Culture
Pricing
Premium Plan
THE CHALLENGE
THE CHALLENGE
Core challenge:
Core challenge:
QDSI required the creation of 11 unique bilingual microsites with no pre-existing templates or system. each site needing its own identity while maintaining consistent UX across languages
QDSI required the creation of 11 unique bilingual microsites with no pre-existing templates or system. each site needing its own identity while maintaining consistent UX across languages
THE RESEARCH
THE RESEARCH
Audited cultural exhibition and museum microsites
Benchmarked UX patterns for long-content readability
Applied WCAG accessibility principles
Identified repeating structural patterns to enable system design
Design System Development
Design System Development
Designed a modular UX system based on:
Shared grids and layouts
Reusable navigation patterns
Modular content components
Brand-adaptable visual theming.
IMPLEMENTATION
IMPLEMENTATION
Transfered Figma build to Framer: Created component library for design system, animations for each microsite, & added a feedback form to gather qualitative data
Transfered Figma build to Framer: Created component library for design system, animations for each microsite, & added a feedback form to gather qualitative data
Measurement & Optimization
Measurement & Optimization
Results:
Results:
Average bounce rate ~40% (strong engagement for microsites)
Average bounce rate ~40% (strong engagement for microsites)
Consistent interactions across installations
Consistent interactions across installations
GA4 events implemented via Google Tag Manager
GA4 events implemented via Google Tag Manager
All microsites include G4 Analytics and GTM for specific triggers such as interactive components.
All microsites include G4 Analytics and GTM for specific triggers such as interactive components.
outcomes
outcomes
11 live bilingual microsites delivered
11 live bilingual microsites delivered
Scalable UX infrastructure established
Scalable UX infrastructure established
Framework ready for future exhibitions
Framework ready for future exhibitions