Victor Loux → Bookmarks → animation

Implementing a reduced-motion mode

hugogiraudel.com/2018/03/19/implementing-a-reduced-motion-mode/

There are quite a few reasons for someone not to want animations. Some people suffer from motion sickness. Some people suffer from ADHD. Some people simply d...

• accessibility, tag
• animation, tag
• css, tag
• motion, tag
• transition, tag
• ·6 years ago

30 Seconds of CSS

atomiks.github.io/30-seconds-of-css/

• css, tag
• animation, tag
• reference, tag
• resources, tag
• tips, tag
• ·6 years ago

Your Interactive Makes Me Sick - Features - Source: An OpenNews project

source.opennews.org/articles/motion-sick/

• animation, tag
• accessibility, tag
• design, tag
• scrolling, tag
• UX, tag
• ·6 years ago

Muuri - Responsive, sortable, filterable and draggable grid layouts

haltu.github.io/muuri/

Muuri is a JavaScript library that creates responsive, sortable, filterable and draggable grid layouts.

• animation, tag
• grid, tag
• responsive, tag
• library, tag
• drag, tag
• javascript, tag
• ·6 years ago

Old School Color Cycling with HTML5 | EffectGames.com

effectgames.com/effect/article-Old_School_Color_Cycling_with_HTML5.html

Anyone remember Color cycling from the 90s? This was a technology often used in 8-bit video games of the era, to achieve interesting visual effects by cycling (shifting) the color palette. Back then video cards could only render 256 colors at a time,...

• graphics, tag
• effects, tag
• colour, tag
• animation, tag
• html5, tag
• canvas, tag
• motion, tag
• ·6 years ago

12 basic principles of animation - Wikipedia

en.wikipedia.org/wiki/12_basic_principles_of_animation

• animation, tag
• design, tag
• motion, tag
• techniques, tag
• disney, tag
• interface, tag
• ·7 years ago

Creating Usability with Motion: The UX in Motion Manifesto

medium.com/@ux_in_motion/creating-usability-with-motion-the-ux-in-motion-manifesto-a87a4584ddc

The following manifesto represents my answer to the question — “As a UX or UI, designer, how do I know when and where to implement motion to support usability?” Over the last 5 years, it has been my…

• motion, tag
• animation, tag
• interaction_design, tag
• usability, tag
• ui, tag
• ·7 years ago

LOOPY: a tool for thinking in systems

ncase.me/loopy/

• drawing, tag
• design, tag
• animation, tag
• systems, tag
• thinking, tag
• tool, tag
• ·7 years ago

Animista

animista.net/

Animista is a place where you can play with a collection of ready to use CSS animations, tweak them and download only those you will actually use.

• css, tag
• animation, tag
• tools, tag
• reference, tag
• easing, tag
• parameters, tag
• ·7 years ago

Kite Compositor – Motion Design for Mac

kiteapp.co/

• animation, tag
• design, tag
• prototyping, tag
• app, tag
• tools, tag
• ui, tag
• application, tag
• ·7 years ago

Lottie

airbnb.design/lottie/

Easily add high-quality animation to any native app. Lottie is an iOS, Android, and React Native library that renders After Effects animations in real time, allowing apps to use animations as easily as they use static images.

• animation, tag
• library, tag
• mobile, tag
• react, tag
• after_effects, tag
• easing, tag
• design, tag
• ·7 years ago

Animation: From Cartoons to the User Interface

cc.gatech.edu/classes/AY2009/cs4470_fall/readings/animation.pdf

• paper, tag
• animation, tag
• motion, tag
• ui, tag
• cartoon, tag
• mental_models, tag
• filetype:pdf, tag
• ·7 years ago

dalkhafine

dalkhafine.tumblr.com/

• illustration, tag
• portfolio, tag
• animation, tag
• art, tag
• ·7 years ago

Matrix Multiplication

matrixmultiplication.xyz/

An interactive matrix multiplication calculator for educational purposes

• mathematics, tag
• matrix, tag
• calculator, tag
• animation, tag
• learning, tag
• maths, tag
• ·7 years ago

mo · js - Motion Graphics For The Web

mojs.io/

• motion, tag
• js, tag
• animation, tag
• library, tag
• javascript, tag
• graphics, tag
• web, tag
• ·7 years ago

UI Movement - The best UI design inspiration, every day

uimovement.com/

• design, tag
• ui, tag
• inspiration, tag
• UX, tag
• animation, tag
• ·7 years ago

Recreating the Twitter Heart Animation (with One Element, No Images, and No JavaScript) | CSS-Tricks

css-tricks.com/recreating-the-twitter-heart-animation/

• css, tag
• effects, tag
• heart, tag
• animation, tag
• particles, tag
• tutorial, tag
• ·7 years ago

Atomic: Interface design software for professionals

atomic.io/

• tool, tag
• design, tag
• prototype, tag
• UX, tag
• animation, tag
• ·7 years ago

coaltrace: simulating genealogies using charged particles

bedford.io/projects/coaltrace/

This is a simulation of the basic demographic / genealogical process. Individuals are born and individuals die. This causes lineages to branch and to disappear, and causes the population to share a common ancestor at some time in the past. The coalescent provides a mathematical description of these patterns of ancestry.

• simulation, tag
• physics, tag
• animation, tag
• genetics, tag
• visualisation, tag
• processingjs, tag
• population, tag
• ·8 years ago

zeus resizeable

essenmitsosse.de/pixel/

• responsive, tag
• pixelart, tag
• animation, tag
• css, tag
• art, tag
• fun, tag
• ·8 years ago