This is a breakdown of the motion design system created for marvinschwaibold.com.

The scrambling of glyphs is systematically decided by matching their advance width. This means that, for example, a letter A can only be replaced with a letter V since their advance width is both 421. Glyphs like W and I cannot be scrambled because their width is not found in any other character in the alphabet.

The Glyph Width toggle at the bottom can turn this rule on and off so you can see why this rule is important for a visually correct result.


Made by: