How can motion design transform the user experience?

Have you ever heard of motion design? Well, if you are a fan of interactive design as we are, you should be, because it will truly transform our profession!

Motion Design is in fact the discipline that focuses on the animation of graphic elements. We can of course put the whole category of 2D, 3D and cartoon animation in it, but what interests us as a UX/UI agency is to understand how we can use "motion" (that's how we say in the industry to make it trendy) to improve the rendering and the experience on mobile applications or websites. For example, it will be icon or button animations (call-to-action as the designers say), page content that becomes dynamic by scrolling, etc.

Motion may seem like a big concept, but when used effectively, it is subtle and natural. A thoughtful motion in design can enhance the user experience over traditional design elements. So here's a quick overview of the UX inspired by our colleagues at Lateral View. 

Why is the motion so important for Ux Design?

In recent years, motion design has increasingly become part of user experience design projects for four main reasons.
 

1. Motion design improves the user experience

Good UX is about creating a coherent experience and telling a good story. That's why we should not work on user interface animation without keeping the UX in mind, especially after the final design. Usually we design separate screens and are not used to thinking about the transitions between all the states of the experience.
In addition, we also have to take into account the way the elements will move, usually thinking "it's just an interesting thing to add if we have time", which makes our experience often dissociated.
Incorporating motion to enhance the user experience and thinking about how elements will move and react to user interaction is a must from the start: motion brings personality, content and can improve usability.
 

 2. The motion is a reflection of your brand's personality

At the same time, our concept of motion must work in harmony with the personality of our brand. If our brand is playful, the animation should be the same, but if our brand is serious, it cannot "jump" like a mischievous child.
Thinking motion offers an incredible dimension to explore and work on to show how the brand and the product are. Skype is a typical example that perfectly illustrates the personality of the brand, reflecting a playful and flexible movement throughout the application.
 

  3. The motion improves the recognition of actions 

A specific CTA (Call to Action) button can move to engage the user to press it, or an arrow can move to let the user know that there is more information on the left, for example.
An important aspect of motion design is to be able to help a user with their visit and experience. The most demonstrative example is when filling out a form. The most standard form of feedback is to add information in red to indicate an error or in green when everything is correct. However, by adding a bit of motion design, the experience becomes more vivid and understandable to users.

4. The motion does not serve as an "ornament".

"(...)A design without content is not a design, it's a decoration" said Jeffrey Zeldman). The motion is no exception to this rule. It is intended to improve the user's understanding of the interface, and it should be a very smart decision that integrates the whole experience. Also, because we have standard font colours or icons when we design an application, we should follow the same standards for how objects will move around in the application or on the web.

The motion has to be consistent, it is really important. If one loading screen goes up after loading, all the loading screens must do the same thing. We also need to find out how the motion models work on each operating system and test with users if we offer a different animation that is not standard in the system.
In short, motion design is a significant tool: it is used to provide a better user experience and, above all, it can help to guide the user with feedback. However, it should not be forgotten that moderation is at the risk of biasing the user's understanding!
Bonus. The motion-designer is an artist who is able to realise and study the specifications, to find the creative solution, with or without constraints, most adapted to the needs. __

On the cover, a cocoji motion created by one of our UI / UX Designers.
So what are you waiting for to adopt the motion to offer your users a unique experience on your applications or web platform?