Diese Präsentation wurde erfolgreich gemeldet.
Wir verwenden Ihre LinkedIn Profilangaben und Informationen zu Ihren Aktivitäten, um Anzeigen zu personalisieren und Ihnen relevantere Inhalte anzuzeigen. Sie können Ihre Anzeigeneinstellungen jederzeit ändern.

Animation in UX

3.042 Aufrufe

Veröffentlicht am

Animation in UX

Veröffentlicht in: Design
  • Als Erste(r) kommentieren

Animation in UX

  1. 1. UI Animation Motion UI Transitional UX
  2. 2. Today’s Topic: Animation Principles When to use it?
  3. 3. What is Animation?
  4. 4. Disney's 12 Principles SQUASH & STRETCH STAGE ANTICIPATION STRAIGHT AHEAD & POSE TO POSE FOLLOW THROUGH & OVERLAPPING SLOW IN & SLOW OUT ARCS SECONDARY ACTION TIMING EXAGGERATION SOLID DRAWINGS APPEAL http://the12principles.tumblr.com/
  5. 5. Disney's 12 Principles SQUASH & STRETCH
  6. 6. PEEK CALENDAR
  7. 7. Disney's 12 Principles STAGING
  8. 8. Disney's 12 Principles EXAGGERATION
  9. 9. ELEVATE
  10. 10. Disney's 12 principles APPEAL
  11. 11. PAPER
  12. 12. Why using Animation in UX?
  13. 13. Increase Engagement
  14. 14. Ease Orientation
  15. 15. CHROME
  16. 16. Giving Feedback
  17. 17. Focus
  18. 18. FUN & Standing out
  19. 19. CLEAR http://capptivate.co/?s=clear
  20. 20. When NOT to Use animation?
  21. 21. Might be Confusing
  22. 22. CURRNEX
  23. 23. Irritating or Oppressive
  24. 24. STEALS FOCUS from what really matters
  25. 25. MATERIAL DESIGN
  26. 26. Motion in the world of material design is not only beautiful, it builds meaning about the spatial relationships, functionality, and intention of the system. Google’s Material Design Guidelines ” “
  27. 27. MATERIAL DESIGN http://www.google.com/design/spec/animation/
  28. 28. http://www.theverge.com/2014/6/27/5849272/material-world-how-google-discovered-what-software-is-made-of
  29. 29. In Conclusion
  30. 30. In Conclusion: “How will it move?” (from the beginning) Use it wisely (Balanced and when it helps) Motion is not only beautiful (It builds meaning) 1 2 3 4 Keep Researching and get inspired
  31. 31. THANK YOU

×