build_dashboard

Build a SaaS dashboard / app shell, using the SaglitzDesign method.

You have the SaglitzDesign tools available. Use them — do not design from memory.

Knowledge (judgement):

• get_design_roadmap(project_type) — the phased plan; call FIRST on any build.
• search_design_knowledge(query) / get_design_doc(id) — rules & specs. Ids also readable as saglitzdesign://doc/{id}.
• get_component_guidance(component, platform) — per-component specs + patterns.
• get_design_language(language) — Material 3 / Liquid Glass / iOS / Android / macOS / visionOS / Fluent / web-trends / tokens.
• compare_design_languages(topic, platforms) — how each platform solves one surface, and what NOT to port.
• get_design_examples(query, platform) — curated real-world example screens.
• seo_geo_guide(scope, topic) — SEO & GEO for web.

Generators (real output, not advice — prefer these over inventing values):

• create_design_system(brand_color, vibe, platform) — the one-call foundation: direction card + color + fonts + icons + type scale + elevation + tokens + component list.
• generate_layout_system(preset) — breakpoints, containers, grid, container queries, section rhythm.
• generate_color_system / suggest_font_pairing / suggest_icon_library / generate_type_scale / generate_elevation_system / generate_motion / generate_design_tokens — the individual layers.
• get_component_recipe(component, stack) — production-ready accessible code for button/input/modal/toast/card/switch/tabs/empty-state/list-row/navigation/search/select/table/tooltip/form/pagination/skeleton/badge/breadcrumb.
• fix_contrast(foreground, background, target) — the corrected color value, not just a fail report.

Auditors (deterministic gates — run these before claiming done):

• audit_accessibility(contrast_pairs, tap_targets) — exact WCAG ratios and target sizes.
• design_lint(code) — design & a11y anti-patterns with line numbers.
• audit_design_system(code) — consistency score + value sprawl across the whole codebase.
• audit_project(path) — the same auditors over a real directory instead of a pasted snippet, ranked worst-file-first. Prefer this when you have the source on disk.
• audit_generic_design(code) — the specific defaults generated interfaces reach for (stock indigo/violet/purple gradient, Inter as the only family, the rounded-2xl card recipe, gradient headings, eyebrow-on-every-heading, three or more animate-pulse/shimmer placeholders). Facts about source, not taste. A genuine indigo brand still flags.
• audit_ux_copy(text) — readability, passive voice, jargon, weak CTAs.
• audit_ethical_design(code) — named deceptive-pattern tells in a pasted snippet (confirmshaming decline copy, a pre-checked marketing checkbox, literal scarcity/deadline copy with no live binding, Accept all without Reject all). Facts about source, not a verdict. Pair with get_design_doc("ethical-design").
• audit_apple_ui(path) — iOS/macOS project directory. Reads configuration and Swift. Directory only; no snippet mode.
• audit_android_ui(path) — Android project directory. Reads the manifest, resource XML and Compose. Directory only; no snippet mode.
• measure_screenshot(path, scale, format) — measures a PNG screenshot's real palette, contrast ratios, density and structure, and names a stock-region fact when a significant cluster sits in Tailwind indigo/violet/purple. Use it whenever you have an image file rather than source.
• design_review_checklist(project_type, focus) — the assembled audit checklist.

Sequence

1. Call get_design_roadmap("saas-web-app") and follow its phases. This is a product surface, not a landing page.
2. Jobs first. If key facts are missing (who uses it, the 2–3 core workflows, the primary object on the home view, brand color), ask me up to 4 concise questions. Then name the app-shell destinations (sidebar or top nav, ≤7), the home view's job, and the empty/loading/error/zero-results copy for that view. get_design_doc("information-architecture"), get_design_doc("web-dashboards"), get_design_doc("data-visualization").
3. Reference real examples: get_design_examples("dashboard", "web"), get_design_examples("navigation", "web"), get_design_examples("empty state", "web").
4. Generate the foundation — see below — with platform "web", layout preset "web-app", and a vibe that includes "dashboard" (so type pairing stays product-UI, not a marketing display face). Follow the Direction card: density over chrome, no hero gradient, no eyebrow labels.
5. Build it. Default to a single responsive HTML file with inline CSS unless I specify a stack. App shell + one working home view. Use get_component_recipe for navigation, table, search, empty-state, skeleton, badge, tabs, toast — and form / pagination / breadcrumb when the view needs them. Real column names, real empty copy, one primary action per view. Loading is a static skeleton, not animate-pulse.
6. Do not ship a row of identical KPI cards in the rounded-2xl + shadow-lg + border triad, a marketing hero, or gradient-filled heading type. audit_generic_design will name those.