Motional Intelligence - How Animation Brings Your Product to Life

Gone are the days when animations used to simply add flair to a design.
Today, animation plays a key role in bringing an extra layer of
information and adding personality to your brand.

In this talk we will focus on how motion guides your users, keeps them focused
on what’s important, educates them about information hierarchy, guides their
focus through experience, and adds delight to your product.

Said differently, tune in to learn how animation can bring your product to life 🧟‍♂️.

Transcript

1. How animation can bring your product to life
   Cyril Mottier
   otional Intelligence
   M
   

   View Slide

2. How animation can bring your product to life
   Cyril Mottier
   Emotional Intelligence
   

   View Slide

3. Emotional Intelligence
   How animation can bring your product to life
   Cyril Mottier
   M
   

   View Slide

4. gensdecon
   fi
   GensDeCon
   fi
   

   View Slide

5. gensdecon
   fi
   ance.com GensDeCon
   fi
   ance
   is hiring!
   

   View Slide

6. is hiring!
   

   View Slide

7. This is where it all began…
   

   View Slide

8. Why are animations
   
   
   so important?
   

   View Slide

9. View Slide

10. Information hierarchy
    

    View Slide

11. View Slide

12. View Slide

13. View Slide

14. Brand expression
    

    View Slide

15. View Slide

16. View Slide

17. View Slide

18. Feedback and status
    

    View Slide

19. View Slide

20. View Slide

21. View Slide

22. View Slide

23. User education
    

    View Slide

24. View Slide

25. View Slide

26. Immersion
    

    View Slide

27. View Slide

28. nike.com/fr/
    Nike Shop
    

    View Slide

29. The 5 additions
    
    
    of motion
    

    View Slide

30. The 5 additions
    
    
    of motion
    🧠 Emphasize information hierarchy
    

    View Slide

31. The 5 additions
    
    
    of motion
    🧠 Emphasize information hierarchy
    👌 Add delight to your product
    

    View Slide

32. The 5 additions
    
    
    of motion
    🧠 Emphasize information hierarchy
    👌 Add delight to your product
    🚦 Provide feedback and status
    

    View Slide

33. The 5 additions
    
    
    of motion
    🧠 Emphasize information hierarchy
    👌 Add delight to your product
    🚦 Provide feedback and status
    👉 Educate and guide users
    

    View Slide

34. The 5 additions
    
    
    of motion
    🧠 Emphasize information hierarchy
    👌 Add delight to your product
    🚦 Provide feedback and status
    👉 Educate and guide users
    🤿 Create immersive experiences
    

    View Slide

35. The 5 additions
    
    
    of motion
    🧠 Emphasize information hierarchy
    👌 Add delight to your product
    🚦 Provide feedback and status
    👉 Educate and guide users
    🤿 Create immersive experiences
    

    View Slide

36. Thank You!
    Cyril Mottier • gensdecon
    fi
    

    View Slide