net - UK (2020-01)

VOICES
Opinion

PR

OF

IL

E

Janak Shah shares tips on how animation

can improve user experience

More and more designers and

developers are building platforms

that incorporate animation. If leveraged

appropriately, it’s a powerful tool that can

enhance the users’ overall experience.

Static designs require more engagement

effort from a user, who has to identify the

important information on a screen.

However, animation allows information

to flow with an element of time and

priority. This is more in line with how

users think, thus attracting higher levels

of engagement.

WHY ANIMATION MATTERS

Animation creates an emotional

connection: it draws users in, drives

interest and helps tell a story. The right

animation will influence the users’ focus

on a screen and guides them to where

they should direct their attention. This

is especially helpful for first-time users

unfamiliar with an app interface.

Additionally, animation can make

interactions feel more meaningful and

purposeful. It can provide useful context

and connections between content, giving

it life and depth. A company’s creativity

and brand personality shines through

with the use of animation.

LESS IS MORE

While animation can make UX seamless

and fun, it can also have the opposite

effect if used incorrectly. Animation in the

wrong place or used at the wrong time can

be distracting, resulting in an unpleasant

experience. It would be counterintuitive

if an animation to support content took

longer to load than the content itself.

Good animation should feel smooth and

natural. Rather than drawing attention

to itself, it should highlight important

content to the end user and support the

content to help illustrate a story or elicit

an action from the end user.

THE ROLE OF ANIMATION

It’s important to remember that

animation is one element of the whole

user experience. Animation shouldn’t

take centre stage but rather be considered

as a support act for the main event.

Before engaging in animation to improve

user experience, ask yourself if it has a

functional purpose. There is no place for

animation if it doesn’t serve a purpose.

FUNCTIONAL ANIMATION

Here are some of the functions animation

can serve:

Immediate visual feedback – Too often

when users are interacting on a platform,

they hesitate and wonder if an additional

action is needed to move forward.

Providing users with continuous feedback

reassures them that their action has been

registered and a reaction will follow.

Navigational awareness – The larger

the app, the more complicated it is to

navigate. Animation can give users hints

about their location, so they know they’re

in the right place. Navigation animation

guides the user to where you want them.

Furthermore, ensuring consistency

avoids confusion. For example, if a view

disappears to the left of a screen, it should

reappear from the left. This is a parallel

to how we are wired to think about the

things around us, where things are and

our spacial awareness. Changing this

natural flow can lead to confusion.

Avoiding jump cuts – Jumping from

one screen to the next can make it difficult

for a user to follow, especially if the screens

are visually similar and a new unexpected

screen appears without supporting context.

Animation can provide the context needed

to minimise confusion.

There are a number of benefits linked

with the use of animation, which can be

leveraged without overhauling a platform.

Implementing simple animation to

enhance navigation or illustrate a call-

to-action will inevitably strengthen

the overall user experience, ultimately

leading to higher conversion.

If we can use animation to make

insurance simple and fun, it’s a win.

Shah is a senior iOS engineer at Cuvva, the insurance

startup that provides short-term car and travel

insurance via an app.

w: http://www.cuvva.com

UX AND ANIMATION

USER EXPERIENCE