RESISTDESIGN
← All work
Layout system

EasyLayout

Describe layout by structure, not pixel choreography.

The current evolution of Preposition, now inside Voltra. A compact layout language that produces web CSS Grid layouts and native coordinates.

Open interactive demoView Voltra source
EasyLayout structural layout system visual
The system

What it is.

EasyLayout gives web and native interfaces a shared structural layout description. The same compact template can produce browser grid CSS and computed native geometry.

The problem

The constraint worth solving.

Layout logic is usually scattered across JSX, CSS, media queries, and native code. EasyLayout treats layout as a small declarative language that can be read, generated, transformed, and reused.

What Resist Design delivered
  • Shared parser and track computation core in Voltra.
  • Web rendering through generated CSS Grid templates and named areas.
  • React Native coordinate computation from the same template.
  • Interactive demo showing the template, generated CSS, and native output together.
Live idea

A layout you can read.

EasyLayout keeps structure compact enough to understand at a glance, then turns it into platform-specific layout output.

header header header, 64px
sidebar content right, 1fr
footer footer right, 48px
\ 320px 4fr 1fr
What this demonstrates
  • One structural layout description can drive multiple rendering environments.
  • The original Preposition idea now lives inside an actively maintained platform.
Capabilities
Layout DSLCSS GridReact NativeParsingTypeScript

Need a system like this?

Resist Design works on product architecture, prototypes, production applications, design systems, and the infrastructure that holds them together.

Start a conversation