The Case for Whimsy
summary
An engineer argues for playful interfaces by showing concrete wins and code: confetti rain at Khan Academy that broke in Firefox and drove support mail, a set of CSS/SVG loading indicators built by three interns, and an open source desktop called guppy that replaces terminal friction with an interactive planet and draggable files. Motion uses the Web Animations API, transform-style: preserve-3d, atan2 plus an eight-frame queue to smooth projectile rotation, a foldable component that renders three cropped copies, and libraries like react-spring and react-flip-toolkit, while noting accessibility and 100% activation lift reported by Patreon.
AI-written summary · about
chapters (10)
- 0:00Intro
- 2:05What is whimsy
- 3:42Loading indicators
- 6:00Onboarding
- 11:15Rotation
- 23:35Whimsy
- 23:53Inverse Transform
- 24:43Folding
- 27:35Moving nodes
- 38:36Paint
