As UX animation design becomes more purposeful, the trends lead toward user feedback. These subtle movements make all the difference in user experience design, and animation is becoming the go-to method for implementing them. User feedback animation is the ultimate version of subtle motion with purpose.
Ideally, feedback animations will go unnoticed by users because they feel like interactions with the natural world. In this “Add to Cart” animation by Ankush Chatterjee, the button rises to meet the user’s touch. This motion happens more often than we think in the web and mobile products we use every day. It feels natural to the user and let’s them know, “yes, this is a button you should click.” As an added bonus, this button acts as a loading image as well.
See the Pen Add to cart button by Ankush Chatterjee (@ankushc) on CodePen.
Motion designers have taken a lot of creative liberty when designing loading indicators...
See the Pen Single Element Solarsystem Loader by George Hastings (@georgehastings) on CodePen.
No matter what way you approach it, loading animations are an essential component of user feedback.
See the Pen Download Button animation by Edgar Pérez (@Codedgar) on CodePen.
User feedback is also helpful in telling user’s what they can’t do. Have you ever tried to scroll on your phone and it feels like the screen is slowing down and maybe even pushing back at you? This is a motion UX designers way of telling us, “hey, you can’t keep scrolling,” or, “you can’t swipe that way.” We get the message, but all we feel is the resistance.
Here are some more fun ways to incorporate micro-interactions into your user feedback: