My collection of UI microinteractions and microanimations
Two years ago, I started making experiments with microinteractions and over this time I came up with quite a few concepts I would like to share. I started doing this in my free time to boost my animation skills, learn new tools and of course to have some fun. I’ve been focusing mostly on animation and interactions so I didn’t waste much time on perfecting pixels, applying pretty color schemes and polishing dribbble shots.
Over this time I tried different tools for creating interactive prototypes and animations such as After Effects, Principle, Framer, Kite, Proto.io, Pixate(R.I.P.), SVG, CSS animations and even Keynote. Of course I haven’t mastered all of these but definitely found which ones work for me. Messy source files are available for the most of the animations just in case you would like to check how it’s done. I wasn’t planning to share sources initially so some of them are not that well-organized, sorry.
This exercise helped me to speed up my animation and prototyping workflow, get a better sense of UX Choreography and even meet new like-minded people!
Gifs are in no particular order. Curious to hear your thoughts!
Most of the works showcased above were made using Principle app. If you want to learn more about this tool please check my next post Principle tips and tricks.
More gifs and other works on my dribbble.
It’s my first post on Medium. Crits and suggestions welcomed!