LONG-TERM Spatial Frontstage Roadmap: Vision Pro Logic / Auto-Guided Network / Mini Apps

[ewanqian]

LONG-TERM Spatial Frontstage Roadmap

Status: long-term roadmap / design research / product architecture
Owner: ewanqian
Related: #8 NEXT-GEN Frontstage Upgrade
Related docs: docs/design/spaceport-app-frontstage-design-brief-2026-06-02.md, docs/design/spaceport-app-frontstage-design-system-v1.md
Core direction: 用 Apple Vision Pro / spatial interface 的逻辑重构 SpacePort，使它成为 VIRTURA Creation Network 的自动导览型应用前台。

---

0. Core Thesis

SpacePort 的长期目标不是做一个更漂亮的网站，而是做一个可以自动讲解、自动导览、自动组织价值呈现的 Spatial Frontstage。

以往需要一个人当面解释：

• VIRTURA 是什么；
• 我们有哪些 station；
• 每个 station 能做什么；
• 团队成员和艺术家的作品在哪里；
• 如何进入 MOVA、Balloon Live Space、Space Salon、Research Laboratory；
• 如何看活动、发布会、项目、素材包；
• 如何参与或合作。

下一代 SpacePort 应该让网站自己完成这件事。

The interface should replace the first human explainer.

中文：

这个前台要替代第一次人工讲解。

它不是信息堆叠，而是自动导览。
它不是网页，而是进入 VIRTURA 创作网络的操作界面。

---

1. Product Critique of Current Direction

1.1 当前做得还不够的地方

即使已经有 app frontstage design system v1，仍然需要继续批判：

1. 结构仍偏文档化。
   现有框架虽然提出 app launcher，但还没有完全摆脱 README / website 的信息组织惯性。

2. Vision Pro 逻辑还只是口号。
   现在只是说“未来可升维”，但还没有真正建立 spatial UI 的层级：窗口、深度、焦点、场景、应用、物体、导航路径。

3. 自动导览逻辑不足。
   目前仍主要依靠用户主动读文字。下一代应该有 guided path：新访客、音乐人、策展人、艺术家、合作方分别有不同进入路径。

4. collective 的内容还没有真正进入系统。
   团队成员、艺术家作品、作品观念、素材包、展览材料目前还没有被整理成可读取、可打开、可传播的 app-level objects。

5. 视觉设计仍没有被产品逻辑彻底统治。
   毛玻璃、动效、空间感、卡片、窗口都必须服务于导览逻辑，而不是为了好看而存在。

6. 缺少发布会 / 演示模式。
   SpacePort 未来应该能用于团队介绍、线上发布会、项目 pitch、展览导览，而不是只能被动浏览。

---

2. Long-Term Design Principle

2.1 Vision Pro Logic, Not Vision Pro Skin

不要表面模仿 Apple Vision Pro 的玻璃、圆角、模糊和漂浮窗口。
真正要学的是它的逻辑：

• 空间中的应用；
• 清晰的层级；
• 轻量窗口；
• 视线焦点；
• 内容在空间中有位置；
• 系统不会大喊大叫；
• 用户知道自己正在打开一个 app；
• 每个 app 都有明确任务。

SpacePort 的网页版本应该是：

A 2D preparation layer for spatial computing.

不是 3D 游戏地图，也不是 VR 展厅。
先把 2D 里的应用、窗口、路径和导览做清楚。

2.2 Auto-Guided Frontstage

SpacePort 的核心功能是自动导览。

用户进入后，不应该被扔进复杂目录，而应被引导：

Who are you?
- I am a musician / label / venue
- I am a curator / institution
- I am an artist / collaborator
- I want to see current events
- I want to understand VIRTURA
- I want to open the digital museum

系统再推荐路径：

Musician -> Stage Visuals -> Balloon Live Space -> Audiovisual Systems -> Contact
Curator -> MOVA -> Digital Exhibition -> Artist Works -> Media Package
Artist -> Collective -> Works -> Join Creation Network
Visitor -> Current Signals -> Activity Calendar -> Space Salon

2.3 Logic Before Aesthetics

视觉必须服从逻辑。

• 毛玻璃用于“层级”和“浮动窗口”；
• 动效用于“打开、进入、聚焦、返回”；
• 色彩用于“状态和分类”；
• 卡片用于“应用入口”；
• 窗口用于“讲解和操作”；
• 图像用于“证明和吸引”，不是装饰。

---

3. Spatial Interface Grammar

3.1 Core Spatial Units

SpacePort 未来应有以下空间单元：

Unit	Meaning	Example
Space	总体前台	SpacePort
App	一个可打开功能	MOVA / Balloon / Research Lab
Window	当前 app 的解释与操作面板	MOVA window
Object	可查看作品、素材、艺术家、活动	Drop Flow / Artist profile
Path	自动导览路径	For musicians / For curators
Portal	去往外部空间或深层项目	Lu.ma / SceneForge / Archive
Package	可传播媒体包	Stage Visuals / Spatial Screens

3.2 App Window Depth

每个 station 不只是页面，而是窗口。

层级：

Launcher
  -> App Window
      -> Current Feature
      -> Routes
      -> Related Apps
      -> Deep Archive

3.3 Focus Model

打开一个 app 后：

• 背景变暗或退后；
• 当前窗口浮到前景；
• 相关 app 可以出现在侧边；
• 用户随时可以回 Launcher；
• 深层 README / Archive 不应该抢走前台体验。

3.4 Navigation Model

不要再用普通网站导航作为主体验。

需要三套导航：

1. Launcher navigation：打开 app。
2. Guided path navigation：根据用户身份进入路径。
3. Command navigation：未来给熟人和团队成员快速跳转。

---

4. Visual Design Direction

4.1 Glass System

毛玻璃不是装饰。它代表层级。

建议层级：

--glass-bg-light: rgba(255,255,255,0.08);
--glass-bg-medium: rgba(255,255,255,0.12);
--glass-bg-strong: rgba(255,255,255,0.18);
--glass-line: rgba(255,255,255,0.18);
--glass-highlight: rgba(255,255,255,0.38);
--glass-blur-soft: blur(18px);
--glass-blur-strong: blur(34px);

使用规则：

• app tile = light glass；
• station window = medium glass；
• modal / confirm = strong glass；
• background = dark spatial gradient；
• active object = subtle highlight；
• no neon green glow as default。

4.2 Palette

不要绿色主导。
不要随机多色。

长期 palette：

Black Space: #070707
Deep Charcoal: #101010
Warm White: #F4F1EA
Soft Gray: #A7A39A
Muted Gray: #6F6C66
Glass Line: rgba(255,255,255,0.14)
Soft Blue: #9FB5C8
Soft Amber: #D5B276
Clay: #C9795C
Graphite: #1A1A1A

主视觉是：

black space + warm glass + restrained signal color.

4.3 Icon System

每个 app 必须有稳定 icon / symbol。

不要 emoji。
不要随机 AI 图标。
不要复杂插画。

建议：

App	Symbol
MOVA	frame / aperture / gallery room
Balloon Live Space	floating stage / waveform / balloon
Space Salon	circular table / dialogue ring
Research Lab	prism / thread / node
Skill Forge	module block / tool square
Activity Calendar	calendar block / pulse date
Media Packages	stack / reel / card pack
Collective	constellation / group field

4.4 Motion

Motion should be like opening apps, not like scrolling websites.

Core motions:

• launcher fade in；
• app tile focus；
• app window expands from tile；
• background recedes；
• guided path steps appear one by one；
• media package opens as stack；
• calendar expands from compact card；
• deep archive slides behind app summary。

Avoid:

• glitch；
• fake hacker typing；
• aggressive parallax；
• endless scroll animations；
• decorative particles；
• unmotivated WebGL。

---

5. Auto-Guided Experience

5.1 Visitor Types

Define guided modes:

1. For Musicians / Labels / Venues

   • Stage Visuals
   • Audiovisual Systems
   • Balloon Live Space
   • Media Packages
   • Contact

2. For Curators / Institutions

   • MOVA
   • Digital Exhibition
   • Artist Works
   • Research Laboratory
   • Press / Media Package

3. For Artists / Collaborators

   • Collective
   • Members / Works
   • Space Salon
   • Join Creation Network

4. For General Visitors

   • Current Signals
   • Activity Calendar
   • MOVA
   • Latest Salon

5. For Internal Team

   • Skill Forge
   • Content Audit
   • WorkspaceManager
   • Release Queue

5.2 Guided Path UI

每条路径像一个可播放的导览：

Step 01: What VIRTURA makes
Step 02: Open relevant app
Step 03: View proof project
Step 04: See current activity
Step 05: Contact / Join / Follow

This is the replacement for manual explanation.

5.3 Presentation Mode

SpacePort 需要一个 Presentation Mode：

• 用于发布会；
• 用于向朋友 / 合作方介绍；
• 用于线上会议投屏；
• 用于展会现场屏幕；
• 用于自动播放团队状态。

Mode:

Auto Tour
  00:00 VIRTURA identity
  00:20 What we make
  00:50 Core apps
  01:30 Selected works
  02:20 Current events
  03:00 How to collaborate

---

6. Collective Content Model

Collective 的艺术家、作品、观念、素材包需要进入 SpacePort。

6.1 Artist Object

{
  "id": "artist-slug",
  "name": "Artist Name",
  "role": "sound artist / visual artist / curator",
  "one_line": "One sentence practice direction.",
  "works": ["work-id"],
  "media": ["image-id", "video-id"],
  "public_safe": true,
  "feature_ready": false
}

6.2 Work Object

{
  "id": "work-id",
  "title": "Work Title",
  "artist_id": "artist-slug",
  "summary": "One-line public summary.",
  "type": "performance / exhibition / installation / research",
  "media_package_ready": false,
  "related_station": "mova"
}

6.3 Material Pack

{
  "id": "material-pack-id",
  "title": "Guangzhou Expo Viewer Materials",
  "source": "local upload / public-safe archive",
  "contains": ["webpage", "images", "screenshots", "team intro"],
  "public_safe": "pending-review",
  "recommended_use": ["launcher preview", "media package", "presentation mode"]
}

6.4 Required Collective Apps

Future SpacePort should include:

• Artists / Members app;
• Works app;
• Material Packs app;
• Media Packages app;
• Presentation Mode app;
• Join Creation Network app。

---

7. Mini Apps Roadmap

SpacePort will contain mini apps over time.

7.1 First Wave

• MOVA / Digital Museum
• Balloon Live Space
• Activity Calendar
• Media Packages
• Artist Directory
• Join Creation Network

7.2 Second Wave

• Presentation Mode
• Project Viewer
• Digital Space Viewer
• Collective Works Browser
• Public Press Kit Generator
• Guided Tour Builder

7.3 Third Wave

• Vision Pro Spatial Launcher
• SceneForge connected room preview
• Multi-window exhibition mode
• Live session cue viewer
• App-level search / command menu
• WorkspaceManager public status layer

---

8. Data Structure Requirements

The beauty of the system must come from ordered data.

8.1 Required Manifests

Existing:

• frontstage-manifest.json
• station-manifest.json
• spaceport-frontstage.json

New or future:

• collective-artists.json
• collective-works.json
• material-packs.json
• media-packages.json
• guided-paths.json
• presentation-tours.json
• mini-apps.json

8.2 Data Rule

Do not put design-only truth in CSS / JS.

• CSS controls appearance;
• JS controls interaction;
• manifest controls public structure;
• sourcebook preserves long background;
• local workspace stores unreviewed memory;
• public manifest only contains public-safe objects。

8.3 Ordered Beauty

数据结构本身要美：

• 每个对象有 ID；
• 每个对象有一句话；
• 每个对象有状态；
• 每个对象有入口；
• 每个对象有 public-safe 判断；
• 每个对象可以被 app / tour / media package 复用。

---

9. Content Production Roadmap

9.1 Short-Form Output

For Xiaohongshu / social media:

• SpacePort 是什么；
• VIRTURA 怎么组织作品；
• MOVA 数字美术馆怎么进入；
• Balloon Live Space 是什么；
• 如何用 SpacePort 看团队作品；
• 为什么网站可以替代第一次人工讲解；
• 一个项目如何从素材包进入前台；
• AI 如何进入工具和演出系统。

9.2 Long-Form Output

For Newsroom:

• SpacePort as Auto-Guided Frontstage;
• Vision Pro Logic for Creative Networks;
• From Website to App Launcher;
• How VIRTURA Organizes Artists, Works, and Stations;
• Building Public-Facing Mini Apps for Art Collectives。

9.3 Presentation Output

For events / pitch:

• 3-minute SpacePort walkthrough；
• 5-minute VIRTURA Creation Network presentation；
• MOVA demo；
• Stage Visuals media package；
• Artist collective presentation mode。

---

10. Implementation Phases

Phase 0: Freeze Principle

• Confirm SpacePort is app frontstage, not website.
• Confirm auto-guided frontstage replaces first manual explanation.
• Confirm Vision Pro logic is long-term grammar, not skin.

Phase 1: Design Research

• Study Apple Vision Pro / visionOS spatial window hierarchy.
• Study iCloud app launcher logic.
• Study app shell and dashboard products without copying SaaS appearance.
• Define glass, depth, focus, launcher, window, path.
• Produce one internal design reference board.

Phase 2: Visual System

• Lock color palette.
• Kill green as dominant accent.
• Define glass levels.
• Define icon system.
• Define motion rules.
• Define app tile / station window design.

Phase 3: Data Layer

• Add app_shell to frontstage-manifest.json.
• Add app fields to station pages.
• Add guided path data.
• Add media package manifest.
• Add material pack manifest.
• Prepare Collective artist / work object structure.

Phase 4: Frontend Prototype

• Build Entry screen.
• Build Confirm panel.
• Build App Launcher.
• Build Station Window.
• Build Activity Calendar card.
• Build Guided Path selector.
• Build Join Creation Network panel.

Phase 5: Collective Integration

• Import selected artist profiles.
• Import selected works and concepts.
• Import public-safe material packs.
• Build artist / work mini app.
• Build public presentation path.

Phase 6: Presentation Mode

• Define auto-tour script.
• Build timeline-based presentation mode.
• Add release / event presentation template.
• Prepare demo for pitch / online event.

Phase 7: Spatial Future

• Map app tiles to spatial nodes.
• Map station windows to floating panels.
• Prepare Vision Pro design notes.
• Connect SceneForge / Digital Space Viewer later.

---

11. Red-Team Review

Before shipping any frontstage update, ask:

• Does this still look like a website?
• Does it actually guide first-time visitors?
• Does the app launcher feel useful or decorative?
• Does Vision Pro logic exist structurally, or only visually?
• Is the glass meaningful or just style?
• Are artist materials public-safe?
• Can a musician find what they need?
• Can a curator find what they need?
• Can a visitor find current events?
• Can we use this in a presentation or launch event?
• Can this survive two years without looking trendy?

If not, do not ship.

---

12. Acceptance Criteria

This roadmap is considered successful when:

• SpacePort feels like a public operating frontstage, not a website.
• First-time visitors can understand and choose a path in under 10 seconds.
• App launcher contains core stations, current events, media packages, and join path.
• MOVA / Balloon / Space Salon / Research Lab / Skill Forge feel like distinct apps.
• The site can replace the first human explanation of VIRTURA.
• The design system has controlled glass, depth, typography, icon, color and motion rules.
• Collective artists, works and material packs can enter the system without breaking structure.
• Mini apps can be added over time.
• Data structures remain ordered and public-safe.
• The interface can naturally evolve toward Vision Pro / spatial frontstage.

---

13. Final Direction

SpacePort should not explain VIRTURA by dumping documents.
It should guide people through VIRTURA by opening applications.

中文：

SpacePort 不应该靠堆文档解释 VIRTURA，而应该通过一组可打开的应用自动导览 VIRTURA。

[ewanqian]

Implementation progress prepared locally for this roadmap.

Local repo additions prepared:

• docs/design/spaceport-long-term-goal-2026-06-02.md mirrors LONG-TERM Spatial Frontstage Roadmap: Vision Pro Logic / Auto-Guided Network / Mini Apps #10 into a maintainable repo goal document.
• docs/app-frontstage/README.md defines the data/rendering contract for the future app-frontstage.
• api/mini-apps.json defines 12 app-level objects.
• api/guided-paths.json defines 5 visitor-specific guided paths and 25 steps.
• api/media-packages.json, api/material-packs.json, and api/presentation-tours.json define first public package/tour skeletons.
• api/collective-artists.json and api/collective-works.json define schema-ready contracts without importing unreviewed people/work content.
• api/manifest.json, api/index.json, llms.txt, sitemap.xml, and stations/frontstage-manifest.json have been wired to the new app-frontstage structure.

Validation completed locally:

• JSON parse passed.
• Sitemap XML parse passed.
• Final quality gate passed on current public pages.
• Guided path app_id references match mini-apps.json.
• Public altnext references have been removed from the SpacePort repo surface.

This is ready for review before committing/pushing the mixed working tree.

[ewanqian]

Caveman update — app-frontstage structure hardened.

Added locally:

• api/app-frontstage-roadmap.json with 8 implementation phases and quality gates.
• docs/app-frontstage/implementation-queue-2026-06-02.md with ready/waiting/next engineering slices.
• tools/validate-app-frontstage.py to validate manifest endpoints, counts, required mini-app fields, guided-path app references, and roadmap dependencies.
• tools/README.md now documents the validator.

Validation:

APP FRONTSTAGE VALIDATION PASSED
mini apps: 12
guided paths: 5
roadmap phases: 8

Also wired app_frontstage_roadmap into:

• api/manifest.json
• api/index.json
• llms.txt
• sitemap.xml

No push yet. Working tree still contains multiple local upgrade batches, so review/stage split should happen before upload.

[ewanqian]

2026-06-02 implementation wave update:

• Converted homepage direction from station directory toward app-frontstage: auto guide, mini app launcher, station app tiles, material windows, support windows.
• Added VisionPro Content System as a real active package connected from the local VIRTURA-Collective handoff commit dd63a82.
• Added api/visionpro-content-system.json and connected it to mini-apps, guided-paths, material-packs, media-packages, presentation-tours, manifest, index, and llms.txt.
• Raised mini apps from 12 to 13 and inserted visionpro-content-system-app into curator and first-visitor guided paths.
• Reworked visual language away from green terminal/control-panel feel toward warm black, soft gray, low-saturation blue, amber, and clay glass windows.
• Chinese-first homepage pass: nav, metrics, guide chooser, actions, material window, and support windows now read primarily in Chinese.
• Cleared old AltNext public context and remaining neon-green traces, except real historical project name UFO Terminal.

Verification passed locally:

• node --check assets/spaceport.js
• tools/validate-app-frontstage.py -> 13 apps, 5 guided paths, 8 roadmap phases
• JSON validation for app-frontstage endpoints
• xmllint --noout sitemap.xml
• git diff --check
• VIRTURA final quality gate for public pages
• Desktop/mobile Playwright QA: app-frontstage present, 10 app tiles, 6 VisionPro previews, 0 broken images after scroll, no horizontal overflow, no console errors

Local preview: http://127.0.0.1:4180/

[ewanqian]

Follow-up product design deep research issue created: #17. It consolidates the 10 homepage directions and recommends Cloud Service Frontstage, Spatial Works Wall, and Object Identity Index as the three prototype tracks.