Layered Sidebar Map Layout

April 23, 2026 · View on GitHub

Layout: Central layered stack flanked by narrow context rails on one or both sides Best for: Enterprise architecture summaries, platform blueprints with horizontal threads (governance, KPIs, value chain) that need to frame the layered system without cluttering the stack itself

Template

Platform Blueprint · Layered With Rails

Knowledge Platform Overview

The central stack answers how content flows top to bottom. The rails carry the threads that cut across every layer and usually get lost in a pure layered diagram.

Value Chain

Capture
Curate
Compose
Distribute

Surfaces

Web reader
Editor host
Export bundle

Experience Layer

Reader shellProgressive layout
Authoring paneLive preview
Command surfaceSkill bindings
Export viewPrint · share

Processing Core

Parser pipelineAST · plugins
Render engineThemes · targets
Skill runtimePrompt adapters

Data Layer

Document store
Asset cache
Memory graph
Audit log

External Services (bounded)

Model providers
Search index
Sync endpoints

Cross-Cut Threads

Access policy
Content provenance
Observability
Rate limits

North-Star Signals

Time to first render
Render error rate
Weekly active authors

Variations

  • Single rail: drop one side and switch the outer grid to 200px 1fr. Useful when only one family of cross-cut threads matters.
  • Muted external tier: keep the bottom muted layer dashed to signal "bounded / third-party", so it does not visually compete with owned layers.
  • Row emphasis: promote one layer with the core modifier. Only one layer should carry it — the one that holds the platform's main value.

When Not to Use

  • The content is a flat list of capabilities → use badge-grid.
  • The system has no clear top-to-bottom flow → use radial-hub or architecture-map.
  • The rails repeat the same items as the stack → drop the rails; the layout is noise without them.