Studio-Moser Mac App Design
Design a Mac product, not a webpage inside a desktop frame. Use the system for Mac behavior, a local web renderer for the product interface, Rust for durable application logic, and narrow native shims only for capabilities the shell cannot provide cleanly.
Establish the design contract
Before drawing or editing, inspect the product, existing components, tokens, and runtime boundary. Write a short contract that names:
- the user's primary job and the one action that should dominate;
- the window composition: toolbar, sidebar, content, inspector, and transient UI;
- the command model: menus, shortcuts, selection, undo, drag/drop, and dialogs;
- the visual direction and concrete reference, including what to borrow and avoid;
- the applicable states and any justified omissions: operational states, control states, key/inactive window, appearance, and accessibility preferences.
Do not proceed from adjectives such as “clean” or “native.” Resolve them into observable structure, behavior, metrics, and states. Read Prompt Contract when shaping a new screen or brief.
Use the Studio Moser desktop boundary
Default to Tauri 2 + SvelteKit 5 + Rust. The WebView owns presentation; Rust owns durable state, privileged work, and capability validation; Tauri owns the window and IPC; Swift is limited to narrow Apple-only shims. Keep the same Svelte render tree runnable in a plain browser with fixtures for fast iteration.
Read Shelby Stack Contract before changing shell, bridge, runtime, or native integration.
Build a semantic Mac interface kit
Compose screens from roles—window chrome, toolbar, sidebar, split view, inspector, list, field, menu, popover, dialog, empty state—not one-off styled elements. Component context determines density and treatment. Keep product identity in the content; keep routine chrome calm, compact, and system-aware.
Read Mac Interface Contract before authoring or critiquing a surface. Apply its Mac App Done Rubric to every meaningful screen.
Prove both surfaces
Use the browser fixture for DOM inspection, responsive states, accessibility, and fast visual iteration. Use the running Tauri app for traffic lights, drag regions, window resizing, native menus and shortcuts, focus transfer, dialogs, permissions, materials, and inactive-window behavior. A browser screenshot cannot prove a Mac app.
Read Verification Contract for the build and critique loop. Read Glaze Harness Contract when creating or repairing a project's agent/build harness. Read Research Basis only when provenance or the Glaze comparison matters.