Rich Animations

Share  on Facebook     Share  on Twitter     Share  on Google+    

By Ziprt | Web Designing | Posted at Wed,10 Aug 2016 | 127 Views

Large scale animations. These are used as a primary interaction tool have more impact on users and include effects like parallax scrolling and pop-up notifications.
Small scale animations. These include spinners, hover tools and loading bars, and don’t require any user input.
We’ll describe 7 of the most popular animation techniques:

Loading animations
These are used to entertain users and delight users during an otherwise tedious experience. Loading animations tend to be popular for flat design, minimalism, portfolios and one-page sites

Keep them simple and avoid adding sound. They should however match your site’s personality and color palette.

  • Navigation and menus (nonscrolling)

Hidden navigation menus have become increasingly popular, especially as they can be used to save screen space. As you can see in the example below created in the collaborative prototyping tool UXPin, these use animations to reveal a menu when clicking on a specific button and prevent a jarring transition (like a navigation drawer hidden behind a hamburger icon).

  • Hover animations

Hover effects give a more intuitive feel to a site as users mouse over content. Users unsure about a feature’s function tend to hover over them automatically for instant visual feedback.

Share  on Facebook     Share  on Twitter     Share  on Google+    
Scroll to Top