EXP_003 / CREATIVE CODE
Motion, written in code.
Designing movement as part of the system, not decoration added at the end. Still in progress.
01 The question
What if movement could communicate structure, hierarchy, cause and effect?
Some experiments start with a technical question. This one started with a feeling: I wanted interfaces to feel more alive — not because they had more animations, but because movement itself could carry meaning.
That led to a different way of thinking about motion: not as decoration added after the interface is finished, but as something designed into the system. This lab is still in progress. In fact, this portfolio is part of the experiment.
02 Motion as a language
Good motion behaves like good typography.
It has rhythm, hierarchy, timing and emphasis. Too much of it becomes noise; too little and the interface feels disconnected.
A transition can explain that two screens represent the same object. An element moving through space can show where information came from. A subtle delay can establish hierarchy without another border, label or color.
The question stopped being “How can I animate this?” and became “What should movement communicate here?”
03 Code changes how motion is designed
Rules that produce movement.
Traditional animation tools are excellent when the final artifact is fixed. Interfaces are not: they resize, react to state, change content, get interrupted and appear in different contexts.
Written in code, those relationships become part of the animation. Durations can respond to distance. Layouts can change without breaking the choreography. Motion can reuse the same design tokens as the rest of the product — reproducible, composable and responsive.
Instead of designing a sequence of frames, I started designing rules that produce movement.
04 Determinism can still feel organic
Predictable, not mechanical.
I have been exploring motion that feels natural without becoming unpredictable. A system can be completely deterministic and still have personality.
Easing curves, stagger, spring parameters, relative timing, trajectories and choreography create an enormous design space without introducing randomness. The goal is not to move differently every time — it is to make movement feel like it belongs to the object.
Predictable doesn’t have to mean mechanical.
05 Animation exposes bad design
Motion is a debugging tool.
A static layout can hide weak relationships between elements. Animate it, and those problems become obvious. Motion forces you to answer questions that static design sometimes lets you ignore.
- SYMPTOMYou don’t know where an element should enter from
- Its relationship with the previous state isn’t clear.
- SYMPTOMA transition needs too many independent movements
- The information hierarchy is doing too much.
- SYMPTOMThe mobile version collapses when the composition moves
- The layout wasn’t truly responsive in the first place.
06 From interface to choreography
This portfolio is the playground.
Elements don’t simply appear. Tools orbit, converge and become outputs. Sections transition as parts of a larger narrative. Movement isn’t there to make the page impressive — it tries to explain how I think and how I work.
Once motion carries meaning, animation stops being a visual effect and becomes part of the information architecture.
See the calibrated systems on the homeMotion can carry meaning.
07 Where this is going
Can a design system generate its own motion?
I am still exploring the boundary between design tools, browser animation and programmatic video. Remotion makes that boundary especially interesting: React components, layout systems and animation logic can produce not only interactive interfaces, but rendered visual artifacts as well.
What happens when the same primitives power an interface, a product demo, a social asset or an entire visual narrative? I don’t have the final answer yet. That’s why this one is still a lab.
Where it ended up
Add better animations to interfaces.
Can motion itself become software?