Prox OS Design Direction Pack

Purpose

This pack is the design brief for future Claude Design, Figma, and CodeX work. It prevents Prox OS from drifting into generic SaaS dashboards while the product becomes more Runtime-first.

Design Goals

• Runtime-first: pages should make workspace resources feel owned, durable, and configurable.
• AI-native but not generic AI SaaS.
• Personal operating studio rather than a decorative desktop clone.
• Dense but readable.
• Beautiful but functional.
• Product identity stronger than random cards.
• Not just glassmorphism.
• Not a macOS clone.
• Not a Notion clone.
• Not a dashboard template pack.

Visual Keywords

• Calm futuristic.
• Owner-controlled.
• Modular workspaces.
• Living system.
• Data cards with meaning.
• Soft depth.
• Readable density.
• Precise interactions.
• AI as sidecar, not gimmick.

Anti-patterns

• Every page becomes generic SaaS cards.
• Too many badges with no hierarchy.
• Random gradients.
• Fake glass everywhere.
• No hierarchy.
• Unreadable tiny text.
• Overdecorated mock dashboards.
• Inconsistent spacing.
• Ungrounded AI icons everywhere.
• Design changes that ignore existing tokens.

Surface Principles

Landing

Explain Runtime-first in one glance. Use one strong narrative path, not a feature-card wall.

Launchpad

Feel like the user's post-login command center. It is not a Studio and should use tabs, not Scenes.

Desktop Runtime

Keep windows, dock, folders, and app placement compact and long-session friendly. Do not make Desktop Runtime the whole platform identity.

App Store

Make discovery clear: public listing, runtime availability, install intent, and Studio creation should feel separate but connected.

Library

Show installed assets, versions, permissions, source, and where each App is used. Library is inventory, not a second App Store.

Settings

Settings is an official console. It should feel operational, structured, and trustworthy, especially for connectors, permissions, Alma, and datasets.

Onboarding

Help the user describe themselves, choose a Studio path, and generate a first Blueprint without implying real OAuth or backend work is complete.

Pricing

Make roadmap and early-access status explicit. Avoid fake enterprise maturity.

Owner Profiles

/@esmadrider and /@prox-os should express owner/resource identity, not a generic social profile.

Studio Detail

Clarify owner, engine, scenes, mounted apps, datasets, permissions, AI context, and share state.

Dataset Cards

Show visibility, schema, preview, source, permissions, and mount targets.

Connector Cards

Show provider, status, scopes, sync state, dataset outputs, and compliance notes. Do not disguise placeholder connectors as live integrations.

App Cards

Differentiate discovery cards, installed cards, runtime cards, and Studio placement cards.

Claude Design / Figma / CodeX Workflow

1. ChatGPT or product prompts define narrative, requirements, and acceptance criteria.
2. Claude Design or Figma explores visual motherboards and prototypes.
3. The design output exports intent: layout rules, spacing, hierarchy, interaction notes, token hints, and anti-patterns.
4. CodeX implements in the repo using existing tokens and components.
5. Screenshots are reviewed against the design intent.
6. Design debt is cleaned before more surfaces are added.

Claude Design explores. CodeX implements. CodeX should not freely invent a new visual identity for core surfaces when design intent exists.

Design Debt Signals

Pause feature work and do design governance when:

• Pages all look like generic dashboards.
• The key CTA is unclear.
• Opening a page does not invite inspection.
• A page cannot explain itself in three seconds.
• All App cards look identical.
• The visual memory point disappears.
• Mock data cards outnumber actual product decisions.