UX and Animation

Ten years ago we couldn’t even imagine where technology would take us. Much less that we would be using terms such as user experience and UX animation.

We were all focused on our flip phones and couldn’t care less if they were easy to use on the inside. If it looked nice and it was able to send the important business email, we were okay with it. However, there was one thing that was way too cool to be ignored. Starting with my first phone, I was obsessed with how a logo would pop out of a bunch of pixels or how the screen would melt and the brand name would appear.

I remember shutting and turning on my phone to see the opening screen over and over again. To me, it was amazing how technological it looked. I would often look for the most recent phones and see how their interphases moved, thus, this was my first contact with animation in user experience.

Over the course of ten years, how these two branches interact has changed immensely. Not only is it important for your device to have internal animation work but the websites and apps you use should have a similar response. To understand where animation within user experience is headed, we need to review how it has evolved for the past decade. Let’s learn from the past, to evolve our future:

Ux And Animation Ten Years Ago

Back in 2009, the smartphone movement was starting to get strong. With the iPhone being released only two years prior, there was still a long way to go before companies around the globe could start their user experience breakthroughs. Apple released a “There’s an app for that” campaign, hoping this would help users and creators to invest in information appliances. Whatsapp and Angry Birds were released during this time, becoming big game changers. Their interfaces were stiff but on one side, Whatsapp was innovating on a communication facility, while on the other, Angry Birds was on the entertainment department with good animation flow and interaction. It was thanks to these applications that user studies were made and their statistics would help to generate easier and more attractive apps for the public.

Ux And Animation Seven Years Ago

During 2012 there were major milestones. There were more than a million apps available at the App Store and people were moving from their computers to their phones. Meanwhile, digital companies were buying other businesses and merging with them as a new economic strategy. The app market was moving and it was moving fast.

What made people respond to apps so quickly? The human image attention span lasts for 18 seconds and app creators played with this information, generating instant hooks with users by keeping things short and simple. The lighter and smoother the app was, the more engagement it would generate. After all, users needed simple interfaces and interactions so their attention span would be focused on the application.

By 2014, the media published several polls showing what types of applications were downloaded the most. The results were 1.9% social networking, 10.36% educational applications, and 20.36% games.

Ux And Animation: Now And For The Future

As several results were being released by the media, developers and web designers had some decisions to make. What could make their apps easier to use or more attractive and pleasant to others? Was it just design or how efficient the information would load? While these are very valid points, an important relationship couldn’t be ignored. People needed to interact with the product they were consuming, and images that were perfectly designed and had a fast-load rate were not enough to make the cut. That’s where animation came into play; but not just any type of animation, it had to be functional motion.

What is functional motion? To put it simply, its the type of movement that has logic and purpose. It’s simple and it feels both natural and organic. Here is an example: if you want your app to show a beauty product catalog through swipes, the logical move would be to swipe from right to left. Therefore, the functional motion should be for each image to show from right to left, as well. A nonfunctional motion would be to have them appear from top to bottom when your user might swipe from one side to the other.

Animation helps you create a more natural and logical experience that your client will enjoy.

Human beings are creatures of movement and everything we see and touch is moving somehow. In fact, if something is perfectly still, it will often stand out and feel out of place. And though we love the digital world, if it’s cold and stiff, it will become unnatural to us. To improve the user experience of your clients, you need to view your product with movement and life. Your product is alive, and your client will notice the difference between a simply click and an interactive swipe.

This is just the beginning of a view on how animation and UX are related and can improve your digital products. In an upcoming article, we will discuss which steps you should take so your old and rigid website can look better with the 12 principles of UX animation. Furthermore, you will be able to combine all your UX animation knowledge and improve your social media, too.

About Pixel506

Pixel506 is a digital solutions company. If looking for a facelift for your website, re-branding, digital marketing, or content creation, we take pleasure in building you the right strategy. Delivering you a product that goes above and beyond your expectations. We would love to start a project with you, so hit us up!