Milan, MI

Bring Your Web Projects to Life Using UI Animations and Micro-Interactions

We use digital products nearly every day. Checking emails, texting family members or catching up with friends on social media, have you ever noticed when an application or website just… feels good? The designer and developer likely are using UI animations and micro-interactions. UI animations and micro-interactions are subtle but very effective animations that tell you, the user, what to do and where you should be paying attention.

Animation created by BradGroux

I recently watched a video of a presentation given by Pablo Stanley, the Design Lead at InVision Studio Platform, and a main point of his talk was about how digital design has three main parts and how those parts relate to human interaction.

  • UI Design (User Interface) – Is the appearance of digital product. UI design is the type of clothing a person is wearing, the color of their hair or the way they look.
  • UX Design (User Interaction) – Is how something works. Think of UX design as the feelings or thoughts behind a particular topic, how someone might react given a certain subject.
  • UI Animation – Is, as Pablo Describes it, “the body language of a product”. It is the non verbal cues we experience in conversations with other people.

When you think of design in the same way you think about having a conversation with someone you realize it takes all three of these things to create a great product. A conversation with a friend feels awkward if they never show non verbal expression and it can be difficult to read the situation.

UI animation really can make a difference in the way someone experiences a digital product. It adds that subtle detail that can make interacting with your screen just a little bit more enjoyable. In addition to making your web presence feel more alive, animation also provides visual feedback, shows orientation, focuses attention, demonstrates cause and effect and allows a brand to express it’s personality. It’s a practical effect that can go a long way.

Check out Pablo’s full video here

Did you know?

When bees change jobs, they change their brain chemistry. Scout bees, which search for new sources of food, are wired for adventure. Soldier bees work as security guards their whole life. One percent of all middle-aged bees become undertakers. Regular honeybees -- which perform multiple jobs in their lifetime -- will change their brain chemistry before taking up a new gig.