Profile picture of Michael Großklaus

Michael Großklaus

Doing frontend things at factorial.io and created miyagi.dev.

GitHub
github.com/mgrsskls
Mastodon
indieweb.social/@mgrsskls
RSS
/feed.xml

Built with Eleventy & hosted on Netlify.

Collecting some frontend related notes, thoughts, bookmarks and tips.

  1. Animation principles

    Date:
    Tags:
    • animations

    The following principles are valid for all kinds of animations:

    • Appearing: ease-out, longer animation
    • Disappearing: ease-in, shorter animation
    • Moving: ease-in-out
    • Long distance / big screen: longer animation
    • Short distance / small screen: shorter animation

    When fading in list items, that means multiple items:

    • overlapping, not one after, not at the same time
    • vertical: top to bottom
    • grid: top left to bottom right