Monoq
AI E-commerce spatial app
Services
-
UX Research
-
UI/UX Design
-
Spatial Design System
-
Prototyping
-
User Testing
Timeline
Project Duration
Total Duration
-
Research:
2-3 Days
-
Wireframe:
4-5 Days
-
Design:
7-10 Days
-
Interactive Prototype:
2-3 Days
-
Dev Handover:
2 Days
Tools & technology
Project team
Omar Faruk
UI/UX Designer
Mohammodullah Siddik
Lead UI/UX Designer
Md. Nasimul Huda
UI/UX Designer
The Challenge
Conventional 2D mobile screens struggled to maintain a high user engagement rate. Aside from that, flat grid-based shopping apps didn’t work well in spatial computing environments.
The Problem
-
1
Disconnected Experiences
Users felt detached from products on flat digital screens.
-
2
Browsing Friction
Traditional scrolling slowed down product discovery.
-
3
Static Environments
Rigid pixels prevented dynamic product interaction.
-
4
Obsolete Interfaces
Standard web fronts failed to utilize mixed-reality hardware.
Project Objectives
-
Create Tactile Environments
Build a breathable space for intuitive shopping.
-
Implement Gaze Control
Enable fast product selection using eye-tracking technology.
-
Integrate Voice Commands
Provide AI-driven voice support for rapid searches.
-
Maintain Context
Use adaptive glassmorphism to keep real-world backgrounds visible.
User Research
At first, we analyzed early spatial computing users to understand their interaction needs. We worked on voice commands, gaze gestures, and immersive discovery for this purpose.
Alex J.
Tech-Forward Shopper
29 Years Old | Software Engineer
Demographics
Location:
San Francisco, CA
Spatial Device Usage:
Daily
Frustrations
-
Flat screens lacked product realism.
-
Traditional scrolling caused eye fatigue.
-
Complex checkouts interrupted the shopping flow.
Goals
-
View products in 3D space.
-
Purchase items quickly using natural gestures.
-
Prioritize speed over browsing.
Mia R.
Premium Fashion Buyer
35 Years Old | Creative Director
Demographics
Location:
New York, NY
Spatial Device Usage:
Weekly
Frustrations
-
Online clothes lacked tangible texture visualization.
-
Cluttered UIs distracted from high-end items.
-
Small images misrepresented physical dimensions.
Goals
-
Examine product details closely.
-
Shop in a minimalist, immersive environment.
-
Visualize products in her actual room.
David K.
Efficient Consumer
42 Years Old | Operations Manager
Demographics
Location:
Seattle, WA
Spatial Device Usage:
Occasional
Frustrations
-
Complex checkout processes caused cart abandonment.
-
Typing on virtual keyboards felt clunky.
-
Dense menus didn’t show important product specs.
Goals
-
Use voice commands for search.
-
Execute purchases with a single look and pinch.
-
Read clear typography without eye strain.
Information Architecture
In this step, we mapped how users move through the space and created a large, open canvas so they can explore products freely.
Before Redesign
-
Flat 2D mobile screens limited total user engagement
-
Traditional grid-view applications felt obsolete in spatial computing
-
Rigid pixel boundaries restricted shopping experience
-
Standard digital interfaces broke mixed-reality immersion
-
Basic floating screens failed to provide a tactile environment
After Redesign
-
An AI-powered application integrates voice, gaze, and spatial interactions
-
The interface utilizes the infinite visionOS canvas for product displays
-
Adaptive glassmorphism maintains high contrast
-
Intelligent algorithms deliver highly relevant product recommendations
-
The immersive spatial platform generates $22M in total e-commerce revenue
Wireframing
We tested spatial wireframes in visionOS and integrated 3D models directly into the visual field.
Product Detail Wireframe
Key Decisions
-
3D model expansion zones
-
Natural gesture checkout buttons
-
Contextual information panels
-
Clear spatial typography
Spatial Search Wireframe
Key Decisions
-
Voice-first input fields
-
Centered product carousels
-
Transparent backgrounds
-
Gaze-activated menus
Spatial AI Search
Key Decisions
-
Floating voice input controls
-
Horizontal product carousels
-
Quick-action buttons on cards
-
Persistent spatial navigation
Visual Identity
We chose SF Pro Display as the primary typeface since it’s known to ensure legibility in immersive environments. We used adaptive glassmorphism to blend UI elements with the real world.
The Solution
Here are the features helping Monoq redefine spatial commerce.
Feature 01
Intelligent Spatial Discovery
Monoq uses AI to interpret voice and gaze. The app creates a focused, intuitive shopping experience.
-
Voice Commands
To find products quickly through natural speech.
-
Gaze Interaction
To select items by simply looking at them.
-
Spatial Placement
To position products naturally in the user's physical room.
125K+
Active Users
72%
Increase in User Engagement
Feature 02
Adaptive Glassmorphism UI
Monoq uses transparent materials. The design keeps users connected to their physical surroundings.
-
Real-world Context
To blend digital catalogs with physical rooms.
-
Dynamic Lighting
To adjust UI elements based on room brightness.
-
Legible Typography
To maintain high contrast using SF Pro Display.
15K+
Early Adopters
100%
Spatial Comfort
Feature 03
Component-Driven Ecosystem
There’s also a strict spatial component system to help ensure consistency in the infinite canvas.
-
Unified Buttons
To provide clear visual feedback for gaze states.
-
Scalable Cards
To adapt product displays to different viewing distances.
-
Clear Iconography
To guide users without dense text blocks.
4
Weeks Delivery Time
100%
visionOS Compliant
Feature 04
Effortless Spatial Checkout
This app now relies on natural gestures for purchases. The system removes virtual keyboard reliance.
-
Natural Gestures
To complete purchases using simple hand movements.
-
Seamless Flow
To move from browsing to buying instantly.
-
Secure Authentication
To use Optic ID for fast payment confirmation.
$22M
Revenue Generated
85%
Checkout Completion
Spatial Experience
With Pixxen’s input, Monoq now effectively guides users with spatial awareness and physical comfort. The mixed-reality interface is highly breathable to prevent sensory overload.
Take the First Step
From concept to MVP, from poor marketing strategy to powerful brand exposure - with Pixxen, you’re in good hands.