Motion Design - Improving UX with animations

sarahsarah
lisajuliette

Animation is a powerful design tool which can be used to greatly improve a user’s experience, when done correctly. However, when used incorrectly it can hinder the user and cause an unpleasant experience. Animation is often implemented as an afterthought, and considered the “sugar on top”. When it is treated this way, it will feel this way. Motion design should enhance a user’s experience and add meaning to a design. It’s an important tool every designer and developer should pay attention to.

In this session you’ll learn about the importance and implementation of animation. We will show you the value of animation and the most relevant principles in the modern world of motion design. We will demonstrate how these principles can be used on the web and showcase a variety of meaningful and aesthetically pleasing animations.

This session is going to include code examples of responsive charts, contact forms and checkout processes using frameworks like Chartist.js, GreenSock Animation Platform (GSAP), CSS animations and more.

  • How animation can add value to your website

  • Top 3 animation principles

  • When to animate and when not to

  • Choosing the right method

At Amazee Labs we’re closing the gap between design and development by having regular, active discussions among designers and frontend developers and even combining those two roles. Often developers dismiss the significance and challenges of design but it’s an essential element to a product's success.

We think that developers with an eye for design can understand those two overlapping areas more easily and make informed decisions.

Session Track

Front End

Experience Level

Intermediate

Drupal Version

When & Where

Time: 
Wednesday, 27 September, 2017 - 14:15 to 14:40
Room: 
Stolz 2