Understand how the system works.

Back to systems

How structure, templates, and animations connect in real-world projects. No abstraction, just execution.

01

Structure (SCF)

Defining the data schema before touching any design tool. Reusable fields ensure data integrity across all templates.

Data relationships blueprint

02

Layout (Bricks)

Templates pull directly from SCF fields. Zero hard-coded content. Changes to the system reflect globally in seconds.

Modular template structure

03

Behavior (Motion.page)

Animations are layered on top of the layout. Motion triggers are mapped to system classes, not unique elements.

Global animation orchestration

These workflows are powered by systems

Explore systems