Axire Infotech Logo

Axire Infotech

© 2026 All Rights Reserved

Mustqr

The project was heavily UI-focused, with an emphasis on visual storytelling and brand experience. I implemented smooth animations using Framer Motion and embedded an interactive 3D model to create a modern, immersive feel. The dual integration of Tkana Products API and Strapi CMS required careful architecture to maintain a seamless, high-performance experience while supporting dynamic content and eCommerce-ready product listings.

Project Date
September, 2024
Services Provided
E-commerce, API Integration

MUSTQR

Project Overview

MUSTQR is a premium co-working space and creative hub with a visually engaging website built to establish the brand's online presence and drive bookings and memberships. The platform combines strong design aesthetics with functional UX to elevate the brand's credibility and conversions.
It offers flexible workspace packages (hourly, daily, and monthly memberships), event hosting and management, creative-business support services, and corporate service packages — all wrapped in a refined, modern web interface.

Project Challenge

The project was heavily UI-focused, with an emphasis on visual storytelling and brand experience. I implemented smooth animations using Framer Motion and embedded an interactive 3D model to create a modern, immersive feel. The dual integration of Tkana Products API and Strapi CMS required careful architecture to maintain a seamless, high-performance experience while supporting dynamic content and eCommerce-ready product listings.

Technical Stack

  • Framework: Remix
  • Styling: Tailwind CSS
  • Animations: Framer Motion
  • 3D Model Integration: Custom embed
  • Product API: Tkana Products API
  • Content Management: Strapi CMS

Key Features & Enhancements

  • Multi-Language Support: The site supports both English and Arabic, including right-to-left (RTL) layouts for Arabic content, making the platform accessible to a broader regional audience.
  • Flexible Workspace Packages: Users can book workspace access on an hourly or daily basis, or opt for a monthly membership plan — each with clear pricing, benefits and seamless booking flows powered by the Tkana Products API.
  • Event Management: Event organisers can list and manage events hosted at MUSTQR. Users can browse upcoming events and book seats directly through the platform, creating an integrated community and events experience.
  • Corporate Services: A dedicated section allows businesses to explore MUSTQR's corporate service packages and reach out directly for tailored solutions — driving B2B enquiries via a contact form.
  • Interactive 3D Model Embed: A 3D embedded visual (e.g., workspace render or product mock-up) provides an enriched brand experience, giving users a glimpse of the physical space or service environment.
  • Dynamic Content Management: Using Strapi CMS, the marketing content — such as hero sections, service features, membership details and testimonials — can be updated without needing to touch the front-end code.
  • Product/Service API Integration: The Tkana Products API manages product listings (or service variants), pricing, availability and SKU logic that dynamically reflects in the frontend.
  • Smooth Animations & Transitions: With Framer Motion and Tailwind CSS, the UI flows feel seamless — page transitions, section reveals, hover states and interactive elements all contribute to a polished brand feeling.
  • Responsive & Accessible Design: The layout adapts across screen sizes; attention given to accessibility best practices such as proper semantic markup, reachable controls and suitable colour contrast.

Challenges and Learning

  • Synchronising Content & API Data: With dual systems (Strapi for CMS content and Tkana for product/service data), keeping the frontend consistent and error-free required clear data contracts, caching strategies and fallback UI states.
  • Managing RTL Layouts & Multi-Language Localisation: Ensuring that Arabic-language pages behave correctly with RTL direction, mirrored layouts, and bilingual navigation introduced complexity in layout and CSS management.
  • 3D Model Performance & Compatibility: Embedding 3D visuals meant we had to optimise for performance (file size, lazy loading, fallback for slower devices) while keeping the experience smooth and visually compelling.
  • Animation Overhead vs Performance: With many animated elements, it was critical to ensure that animations do not degrade performance on lower-end devices; we utilised hardware-accelerated transitions, reduced unnecessary renders and trimmed heavy DOM updates.

Outcome & Future Plans

The website now delivers a premium brand experience for MUSTQR — making the brand feel both creative and trustworthy. The dynamic content system gives the team flexibility to evolve the site without major redevelopment.
Planned future enhancements include:

  • Advanced localisation beyond English and Arabic (e.g., additional Gulf-region dialects).
  • Member portal for subscription management, bookings and personalised dashboards.
  • Augmented reality preview for physical workspace or service demonstrations.
  • More granular analytics & conversion tracking built into the UI for better decision making.

🔗 Live Website: https://mustqr.org/

Tech Stack

Technologies and tools used to bring this project to life

tech-0
tech-1
tech-2
tech-3