- FUNCTIONAL ANIMATIONS
- DATA VISUALIZATIONS
A micro-interaction conveys to the user an action has been performed. Once the action has been performed, the user receives an indication of some kind to let him or her know they succeeded in their intention.
- The Trigger: This is what initiates an action. On most interfaces, this includes clicking or touching specific elements of the interface.
- Rules for Responses: The micro-interaction bases the response on how the user interacted.
- Feedback: This is the response that lets the user know the action was performed successfully.
- Loops: The end of the cycle is whatever happens next. Clicking a “Share” button on a social media post results in a notification to the user that the post has been “Shared,” and the result is a new post on the user’s profile.
Functional animation is subtle animation that has a clear, logical purpose. It reduces cognitive load, prevents change blindness and establish a better recall in spatial relationships. But there is one more thing. Animation brings user interface to life.
Motion can make surfaces feel alive by multiplying and dividing them, and changing their shape and size. You should use functional animation to smoothly transport users between navigational contexts, explain changes in the arrangement of elements on a screen, and reinforce element hierarchy.
Successful motion design possesses the following six characteristics:
- Choose the right type of visualization. Make sure you’re following best practices, which you can learn about more here.
- Present the information correctly. Ensure that data visualizations do not skew the data or misrepresent what the data means.
- Logically order information. This refers to organizing categories either alphabetically, sequentially or by value. Doing so allows readers to interact with your data more intuitively.
- Make it easily comparable. Data visualizations should allow viewers to easily navigate the information, making it easy for them to filter and compare values.
- Make your data command attention. Do not distract your audience from the data by adding unnecessary illustrations or icons. This is referred to as chart junk and it only litters the visualization.
- Use proper color palettes and icons. This increases comprehension. Make sure to also remove any unnecessary labeling.