System Requirements Document for site-matrix

1. Introduction

The SITE MATRIX 3D application is an immersive mobile platform designed for tech-savvy users to design, visualize, and inspect architectural structures using a floating holographic 3D viewport. The application aims to provide a futuristic and interactive experience, leveraging advanced 3D graphics and AI-driven design recommendations.

2. System Overview

SITE MATRIX 3D is a mobile application that allows users to create and interact with architectural models in a holographic 3D environment. The application features a glowing wireframe aesthetic, dynamic coordinate callouts, and a technical blueprint HUD. Users can navigate the 3D space using thumb-driven controls and gyroscopic tilt, while an AI co-pilot provides real-time design suggestions. The application also supports dual blueprint generation, projecting 3D models into 2D architectural plans.

2a. Product Interpretation and Delivery Boundary

The application is delivered as a mobile platform with app-owned identity management to protect user projects. It features custom UI elements and requires backend integration for project persistence. The application adheres to a cinematic future tech visual style inspired by Gleb Kuznetsov, emphasizing immersive 3D visualization and interaction.

2b. Source Content Inventory

Not applicable as no content source directive was provided.

2c. Page Content and Component Coverage

Landing

• Information/State: Introduction to SITE MATRIX 3D, its features, and intended users.
• Primary Actions: Explore the application overview.
• Components: Full-bleed 3D scene, introductory text, call-to-action buttons.

Login

• Information/State: User authentication interface.
• Primary Actions: User login, password recovery.
• Components: Input fields, login button, password recovery link.

Projects

• Information/State: List of user projects, metadata, and revisions.
• Primary Actions: Open, create, delete projects.
• Components: Project list, metadata display, action buttons.

Design Editor

• Information/State: Workspace for creating and editing structures.
• Primary Actions: Draw, stack blocks, save designs.
• Components: Drawing tools, block library, save button.

Viewport

• Information/State: 3D model display with navigation controls.
• Primary Actions: Navigate, zoom, rotate models.
• Components: 3D viewport, thumb joystick controls, gyroscope interaction.

Inspector

• Information/State: Detailed inspection of structural points.
• Primary Actions: Inspect, search, view coordinates.
• Components: Search tools, coordinate callouts, inspection panel.

Views

• Information/State: Representation modes for models.
• Primary Actions: Switch between wireframe, solid, and exploded views.
• Components: View mode selector, rendering options.

Co-Pilot

• Information/State: AI-driven design recommendations.
• Primary Actions: Review suggestions, apply changes.
• Components: Recommendation list, apply button.

Projections

• Information/State: 2D floor plans and elevation views.
• Primary Actions: View, export projections.
• Components: Projection viewer, export options.

Controls

• Information/State: Model layer and settings management.
• Primary Actions: Adjust layers, change settings.
• Components: Layer manager, settings panel, action toolbar.

3. Functional Requirements

• As a 3D Design User, I should be able to design architectural structures using a floating holographic 3D viewport. (explicit)
• As a 3D Design User, I should see structures rendered in a cyan/neon-blue wireframe aesthetic against a dark grid void. (explicit)
• As a 3D Design User, I should interact with the structure over an interactive circular rotation-disc pedestal. (explicit)
• As a 3D Design User, I should see live XYZ coordinate callouts for key structural points. (explicit)
• As a 3D Design User, I should have access to a technical blueprint HUD with metadata panels. (explicit)
• As a 3D Design User, I should experience ambient spatial animation for a realistic presence. (explicit)
• As a 3D Design User, I should switch among different representation modes of the model. (explicit)
• As a 3D Design User, I should navigate the 3D space using one-thumb controls and device tilt. (explicit)
• As a 3D Design User, I should create structures using freehand drawing and procedural block stacking. (explicit)
• As a 3D Design User, I should receive real-time AI co-pilot recommendations for design improvements. (explicit)
• As a 3D Design User, I should see my 3D designs projected into 2D architectural plans in real time. (explicit)
• As a 3D Design User, I should authenticate to protect and resume my projects. (required_inference)
• As a 3D Design User, I should have my projects and related data persisted by the backend. (required_inference)

4. User Personas

• 3D Design User: Responsible for creating, visualizing, inspecting, and modifying architectural structures in the 3D viewport. Engages with AI recommendations and manages projects.

5. Core User Flows

3D Design User

1. Landing Page Interaction:

   • User accesses the Landing page to learn about SITE MATRIX 3D.
   • User proceeds to the Login page.

2. Authentication:

   • User enters credentials on the Login page.
   • Upon successful login, the user is directed to the Projects page.

3. Project Management:

   • User views existing projects or creates a new project on the Projects page.
   • User selects a project to open in the Design Editor.

4. Design Creation:

   • User creates or edits a structure using freehand drawing or block stacking in the Design Editor.
   • User saves changes and navigates to the Viewport for visualization.

5. 3D Navigation and Inspection:

   • User navigates the 3D model using thumb controls and device tilt in the Viewport.
   • User inspects structural details in the Inspector.

6. AI Recommendations:

   • User receives and applies AI suggestions in the Co-Pilot.

7. Projection and Export:

   • User views 2D projections in the Projections page.
   • User exports projections as needed.

8. Settings and Controls:

   • User adjusts model layers and settings in the Controls page.

6. Visuals Colors and Theme

• Muse: Gleb Kuznetsov
• Palette:
  • Background: #000011
  • Surface: #1A1A2E
  • Text: #E0E0E0
  • Primary: #00FFFF
  • Accent: #FF00FF
  • Muted: #33334D
• Typography:
  • Headings: Orbitron — Uppercase, tight tracking
  • Body: Space Grotesk
  • Scale: 1.25 modular (48/32/24/18/14)
• Shape Language: Floating glass panels, thin luminous strokes, radial layouts
• Layout: Full-bleed 3D scenes with floating HUD panels
• Motion: Continuous slow orbit/parallax, light sweeps, data streams

7. Signature Design Concept

The Landing page features a full-bleed 3D architectural model rendered in a dark grid void with neon cyan wireframe and glowing nodes. Dynamic coordinate callouts and ambient particles enhance the immersive experience. The page introduces users to the application's capabilities with minimal UI chrome and a focus on the 3D scene.

8. Interaction Model & Motion Direction

• Interaction Model: Animated
• Motion Tempo: Cinematic
• Hero Dimensionality: WebGL
• Landing Hero Motion Brief:
  • Focal Subject: 3D architectural model
  • Input→Transformation→Outcome: User interacts with thumb controls to orbit and inspect the model, revealing dynamic coordinate callouts and ambient animations.
  • Motion Vocabulary: Continuous orbit, parallax effects, light sweeps
  • First Frame: Full-bleed 3D model with initial coordinate callouts
  • Reduced-Motion State: Static model with minimal animations

9. Non-Functional Requirements

• Performance: The application must maintain smooth rendering and interaction at 60 FPS on supported mobile devices.
• Scalability: The backend must support concurrent users and project data without performance degradation.
• Security: User data and projects must be securely stored and accessed only by authenticated users.

10. Tech Stack

• Graphics Engine: Unity with custom Shader Graph or Three.js with WebGL/WebGPU
• Backend: Python/FastAPI
• Storage: Appropriate database for 3D coordinates and project metadata
• Deployment: Docker/docker-compose for containerization

11. Assumptions and Constraints

• The application is designed for mobile devices with touch and gyroscopic capabilities.
• The visual style is constrained to a dark grid void with neon wireframe aesthetics.
• Navigation and interaction are optimized for one-thumb operation.

12. Glossary

• 3D Design User: The primary user persona responsible for interacting with the application to create and manage architectural designs.
• AI Co-Pilot: An embedded engine providing real-time design suggestions.
• Viewport: The 3D space where models are visualized and interacted with.
• Projection: The conversion of 3D models into 2D architectural plans.