Feed · new posts

Lab01·

The Dice

Seed 1 · 2 × 2 × 2
Speed
1×
Accent
Pivoine

The site's logomark goes through four stages, one movement at a time, from flat to a Rubik's Cube that shuffles its cells.

When I set the visual direction of the site, the 2 × 2 avatars could come in an almost endless number of variations. That gave me the idea of a die with an avatar on each face, rotating, as the mascot of the AI assistant. The first one was too realistic, so I took it back to flat faces and thin straight lines, like the rest of the symbols. In the end, the square of four cells became the mascot, and the die stayed on the canvas as an alternative.

This playground picks the die up again, from the logomark in the header. It goes through four stages:

  1. Flat, as it is in the header.
  2. A cube: the square turns, and turning shows it was a die all along. Its faces are made of cells, and the front one is still the logo.
  3. A spinning top, turning at different speeds around different axes.
  4. A Rubik’s Cube, whose slices turn on their own and shuffle the cells across the faces, then turn back until the logo comes out again.

As for the mascot, a stage only starts once the previous movement is over, and every movement keeps the timing of the rest of the site, on steps of 70 ms. The cells are the ones used everywhere else: patterns drawn in CSS and glyphs in DM Mono, never an image. Only the maths that places them in space is new.

← All experiments