Application Design System

AEGIS APPLICATION DESIGN SYSTEM

» The complete interaction, layout, and visual specification for the Aegis workstation application.
» This is NOT the marketing website design system. The website is editorial. The application is a professional workstation.
» Both share the Aegis brand tokens. They differ in density, interaction model, and information architecture.

---


DESIGN PHILOSOPHY

  Website vs. Application

  Dimension | Website (V6) | Application (ADS)
  Typography | Display-heavy, cinematic | Reading-optimized, dense
  Spacing | Generous editorial white space | Tight, earned, functional
  Interaction | Scroll storytelling, reveals | Keyboard-first, panels, commands
  Navigation | Top nav + dropdown + ⌘K | Sidebar + command palette + tabs
  Color role | Brand expression, atmosphere | State communication, attention direction
  Motion | Cinematic, dramatic | Functional, signal-based
  Density | Apple-product sparse | Bloomberg × Raycast × Linear
  Primary user | Visitor → conversion | Power trader → discipline

  The Aegis workstation feels like
• **Bloomberg Terminal** (information integrity, keyboard-first)
• **Raycast** (instant command palette, extensibility)
• **Linear** (keyboard shortcuts, clean issue tracking)
• **VS Code** (panels, tabs, split views, command palette)
• **OpenAlice** (beautiful dense data, professional tooling)

It does NOT feel like TradingView, Zerodha Kite, or any existing retail trading interface.

---


LAYOUT SYSTEM

  Shell Anatomy
┌─────────────────────────────────────────────────────┐
│  [A] Sidebar (48px collapsed / 240px expanded)       │
│                                                     │
│  ┌───────────────────────────────────────────────┐  │
│  │  [B] Top Bar (40px) — breadcrumb + ⌘K + actions│  │
│  ├───────────────────────────────────────────────┤  │
│  │                                               │  │
│  │  [C] Main Canvas                              │  │
│  │      — Single view or split panels            │  │
│  │      — Tabs across the top (optional)          │  │
│  │      — Widget grid or freeform layout          │  │
│  │                                               │  │
│  ├───────────────────────────────────────────────┤  │
│  │  [D] Status Bar (28px) — connection, clock, rules │  │
│  └───────────────────────────────────────────────┘  │
└─────────────────────────────────────────────────────┘

  Sidebar
• **Collapsed (default):** 48px icons only. Icons for: Mission Control, Protection, Intelligence, Portfolio, Rules, Settings, Help.
• **Expanded:** 240px. Icons + labels. Contextual sub-items on hover.
• **Toggle:** ⌘B or hamburger click.
• **Active state:** Accent highlight on the left edge (3px bar).

  Panels
• The main canvas supports N-panel layouts (1, 2, or 3 columns).
• Panels are resizable (drag the divider).
• Each panel is independently scrollable.
• Each panel can contain: a widget grid, a full-screen single view, a split detail, or a data table.

  Tabs
• Optional tab bar across the top of the main canvas.
• Each tab = one saved workspace configuration.
• Apple-style: click to rename, drag to reorder, ⌘W to close.
• Default tabs: "Today", "Positions", "Review".

  Split Views
• ⌘\ splits the current tab vertically.
• ⌘⇧\ splits horizontally.
• Each split is an independent view with its own scroll position.

---


NAVIGATION SYSTEM

  Command Palette (core navigation)
• **Triggers:** ⌘K (global), ⌘P (files/positions), ⌘⇧P (commands)
• **Behavior:** Overlay with fuzzy search, recent items ranked first, keyboard navigation
• **Scope:** Navigate to any view, execute any command, search any position/symbol, open any rule
• **Empty state:** "Type to search..." with recent commands (last 5)

  Keyboard shortcuts — Master list
  Shortcut | Action
  ⌘K | Command palette
  ⌘B | Toggle sidebar
  ⌘\ | Split right
  ⌘⇧\ | Split down
  ⌘W | Close tab/panel
  ⌘1-9 | Switch to tab N
  ⌘[ | Back (navigation history)
  ⌘] | Forward
  ⌘⇧E | Go to portfolio
  ⌘⇧P | Go to protection
  ⌘⇧R | Go to rules
  ⌘⇧I | Go to intelligence
  ⌘⇧M | Go to Mission Control
  ⌘Enter | Execute command / confirm
  Esc | Close overlay / cancel
  Space | Quick preview (position detail, rule detail)
  / | Focus search

---


WIDGET PHILOSOPHY

Mission Control is not a page. It's a **canvas of widgets**.

  Widget types
1. **Status Widget** — A single value + trend (e.g., "Exposure: ₹3.4M ↑8%")
2. **Rule Widget** — Active rules count + last triggered
3. **Behavior Widget** — Current behavior label (e.g., "Frequent chop-chasing")
4. **Chart Widget** — Mini sparkline or bar (never candlestick)
5. **Alert Widget** — Pending alerts requiring action
6. **Position Widget** — Current positions summary (broker-sourced)
7. **AI Widget** — Today's coaching insight

  Widget behavior
• Each widget has a header (label), body (data), and optional footer (action).
• Widgets are draggable (rearrange grid).
• Widgets have a ⋮ menu: "Expand", "Remove", "Configure", "Pin to top".
• Grid is 12-column, widgets span 2–6 columns.
• Widgets can be added via ⌘K → "Add widget..."

---


NOTIFICATION SYSTEM

  Alert levels
  Level | Color | Behavior | Example
  Critical | Red | Full-screen overlay (can't dismiss) | Daily loss limit breached
  Warning | Amber | Persistent banner + badge | Approaching shield limit
  Info | Blue | Toast (auto-dismiss 6s) | Rule updated, broker reconnected
  Coaching | Teal | Inline AI card | "Your hold time is drifting"

  Notification center
• Accessible via bell icon in top bar.
• Grouped by: Today, Yesterday, This Week.
• Each item: alert level icon + one-line summary + timestamp + "Take action" button.
• "Mark all as read" and "Clear all" available.
• Alerts that require action persist until addressed — they don't disappear on "mark read."

---


FORM PHILOSOPHY

  Rule Builder
• Visual block canvas (preserved from V6 Rule Studio concept).
• Drag conditions from a palette. Chain them. Assign actions.
• Natural-language preview: "IF daily loss exceeds ₹20,000 AND VIX is above 20, THEN lock trading and notify phone."
• One-tap test: simulate what would have triggered in the last 30 days.

  Every form follows:
• Single-column layout (never multi-column — cognitive load).
• Labels above inputs (not beside — faster scanning).
• Inline validation (validate on blur, not on submit).
• Clear primary action, secondary "cancel" always available.
• Autosave where possible; explicit "Save" only when the action has side effects.

---


DIALOG SYSTEM

  Types
1. **Confirmation** — "Are you sure?" with clear consequence statement
2. **Configuration** — Full form in a modal (e.g., "Edit rule")
3. **Detail** — Read-only information overlay (e.g., broker connection status)
4. **Protection Overlay** — Full-screen, cannot dismiss until user consciously re-arms

  Behavior
• Dialogs never cover the entire screen unless they're Protection Overlays.
• Click backdrop to dismiss (unless confirmation or protection).
• Esc to dismiss (unless confirmat
… (truncated — see repository docs/*.md for the full document)