Resources
← All tutorials
AdvancedAbout 40 min
Create scalable UI systems
Combine components, stacks MVP, constraints, and Frame Builder for modular chrome.
Steps
- Author modular frame pieces in /studio/frame-builder with mirror helpers; export PNG+JSON for engine-side assembly.
- In Compose, pair stacks with composerConstraintsV1 pin/fill hints for resize-aware rows.
- Keep Style Brain authoritative; avoid hard-coded fills on instances you expect to restyle.
- Document which screens are template vs shipped variants using naming conventions in the layer tree.
Expected result
A system where new screens reuse components, linked styles, and structured exports instead of forks of raw PNGs.
For deeper reference, open Docs.