How & Why motion is important?

🌠 How & Why motion is important?
⠀
Courtesy of @millionframes
⠀
Motion is something which if used properly will make the user experience of the product better and if not used properly can make it hard to use.
⠀
Motion in any digital product design follows the basic 3 principles which are,
⠀
1️⃣ Informative
2️⃣ Focus
3️⃣ Expressive
⠀
Using Motion one can increase the revenue of their product, retain more users or sell something quickly.
⠀
I hope this post on Motion helped you understand why motion is the game changer aspect of UX design.
⠀
Let me know if you have questions about design, animation or interactions in the comments below and don’t forget to share this post with others.
⠀
The article referred: Google Material Design

INFORMATIVE

This principle tells us that motion shows relation or link between elements or components.
Problem
Is this screen came from clicking this button or that button? How will you make it clear for the user?
Solution
That’s where “INFORMATIVE” principle comes into play. Connect the screen with the button using motion such that it creates a relation with the particular button.

Focus

This principe tells us that motion helps us focus our attentionon what’s important without creating unnecessary distraction.

EXPRESSIVE

This principle tells us that motion helps us add a character to the interactions and expresses a brand’s personality.
Example
When clicking a button makes the button jumps, that tells us the funky personality of the product. Character animation can add a whimsical touch to an unexpected error.

Angry?

Because i talked about motion without using any motion in the slides.

IT WAS INTENTIONAL

The reason I didn’t put any motion was because I wanted to make you think without giving out much detail.

Motion is important

Atleast in these slides?
No, it’s important for any digital product.

No Character
No Relation
No Focus

Results into a static interface, tiresome user experience and time taking task.

MOTION

• Connects Similar Elements
• Add character and make the product expressive
• Bring user’s focus or attention
• Character animation can add a playful touch
• To show whether or not the action was successful

Bonus — 4 tools that may be useful in your designer way:

Crello — the simplest online image editor. A simple but powerful tool to create awesome designs for any social media format — posts, covers, graphics, and posters using the best software on the web. It’s easy! A lot of animated designs.
Webflow — all-in-one web design tool that allows users to design, build, and launch responsive websites visually.
Funnelytics — an incredible tool that helps you build the best marketing funnel mapping.
Flowkit — allows designers to create frighteningly fast user flows within Sketch and Figma.

Be free to send us any feedback by reply or reach us in DM on Instagram
Do you want to receive insights using FB Messenger or Telegram or Email? 👈 Subscribe now.