← all projects01 / 05 · personal project

entreMultiversos

A journal that takes you through chaos and into balance.

My contribution
Concept, art direction, interaction design and development.
Project type
A personal journal bringing writing, photography, drawing and code together.
The entreMultiversos opening, with large lettering crossed by the trails of moving bodies.
Opening / entreMultiversos

the starting point

How could I give shape to all these parts of myself?

entreMultiversos started as a journal to bring my worlds together: writing, photography, drawing, philosophy and code. Entering each one is a way of finding a point of balance.

I built the system around the three-body problem. On the opening screen, the bodies move through a chaotic field. Choose a world and they shift into its own choreography. The concept shapes how the navigation works.

A close-up of the entreMultiversos map, showing world names and the three bodies’ trails.
World mapView original image
A close-up of the Matéria destination, with its name and marker beside the gold trail.
Close-up: MatériaView original image
From map to destination: the name stays readable alongside the moving field.

01 · concept → behavior

Gravity shapes the experience.

I built a simulation of three bodies attracting one another and tuned it for the experience. Each world sets its own motion conditions, drawing on choreographies such as the figure-eight and the Lagrange triangle.

Entering changes the field’s state. Leaving disturbs it. Moving between pages makes the relationship between chaos and balance something you can experience.

One field, from one world to the next.

The field stays in place as the content changes. Its previous trails fade away while the next state takes shape.

The live entreMultiversos opening, with its large wordmark over the fine trails of three moving bodies.
02 / opening — wordmark, worlds and field
The Matéria page, with Patric’s portrait, his own writing and the same field in the background.
03 / entering Matéria — new content, the same field
  1. 01 / openingDispersion

    The three bodies move in a chaotic field.

  2. 02 / choiceTransition

    Positions and velocities shift toward the selected world’s motion state.

  3. 03 / arrivalChoreography

    The content appears as the field settles into a new configuration.

03 · motion and readability

A changing field. A stable way through.

I kept the moving bodies separate from the text and controls. Page names, menus and navigation cues stay steady, giving visitors a clear route through the content.

On phones, the layout adapts to the available height. Visitors who prefer reduced motion get a static field. The identity remains recognizable when the animation gives way to reading.

The entreMultiversos opening on a phone.
04 / the same identity, a different screen

See the site in action.

A recording of the site in use. Play, pause, seek or switch to full screen.

what this project demonstrates

Authorship
A personal idea expressed through visual language and interaction rules.
Continuity
Each world has its own page, while the field carries over from one destination to the next.
Build
HTML, CSS, JavaScript and Canvas 2D, chosen to support how the experience should behave.
explore the live project