Skip to main content
UI/UX Design

NEURA

Spatial computing design system and gesture-driven interface for augmented architectural CAD.

NEURA cover

NEURA — Spatial Computing Architectural System

01. Context & Objective

Architectural drafting has been historically constrained to 2D flat screens and mouse-based viewports, creating cognitive friction between blueprint conception and spatial physical reality. NEURA is a comprehensive volumetric design system and gestural interface framework engineered for stereoscopic spatial environments. The system enables architects to manipulate structural engineering models in three-dimensional space using intuitive micro-gestures and eye-tracking intent prediction.

02. Architectural Design & Philosophy

Spatial ergonomics formed the bedrock of NEURA. Traditional design systems fail when transposed to spatial lenses: buttons placed too far cause shoulder fatigue, while text lacking depth contrast induces visual convergence discord.

  • Z-Axis Depth Stratification: UI layers are organized into 4 distinct physical depth planes (Ambient Reference, Workspace Canvas, Interactive Palettes, and Critical Alerts).
  • Photonic Glassmorphism: Surfaces use dynamic frosted glass shaders with variable refraction indices that respond to ambient room lighting, preserving spatial anchoring without occluding real-world surroundings.
  • Gaze-Directed Focus States: Interactive affordances subtly dilate and increase border luminescence (from 8% to 35% opacity) as the user's eye gaze hovers over touchpoints.

03. Creative Engineering & Graphics Pipeline

The interface token pipeline bridges Figma design components directly into volumetric runtime engines.

  • Spatial Token Compiler: Custom tooling parses Figma variable collections and outputs unified JSON schema defining physical millimetric offsets, spring stiffness, and acoustic feedback triggers.
  • Physics-Driven Haptic Profiles: Micro-pinch gestures trigger spring-based deceleration curves modeled using damped harmonic oscillators (dampingRatio: 0.82, stiffness: 340).
  • Dynamic Occlusion Culling: Background panels automatically increase blur radius and drop specular reflectance when user focus shifts to foreground structural nodes.

04. Technical Specifications & Performance

  • Angular Target Sizing: Minimum interactive targets maintain an optical angle of 60 arcminutes (1 degree) to ensure 99.4% first-time gaze acquisition accuracy.
  • Motion Spec Precision: Micro-interactions specified with sub-millisecond keyframes and cubic-bezier velocity curves.
  • Accessibility: Tested comprehensively for varying inter-pupillary distances (IPD) and equipped with high-contrast accessibility overrides complying with spatial WCAG extensions.

05. Results & Engineering Impact

NEURA was integrated into three tier-1 international architecture practices, reducing 3D model revision cycles by 42% and eliminating spatial disorientation during virtual client walkthroughs. The spatial design token specification was published as an open standard for volumetric user interface development.

NEURA gallery image 1
NEURA gallery image 2
NEURA gallery image 3
Next Project

AETHER

Full-Stack