Expression Blend Motion & Interaction Design

1,143 views
1,051 views

Published on

Introduction to Expression Blend Motion & Interaction Design.

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,143
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • DEMO: rest of section\n
  • Expression Blend Motion & Interaction Design

    1. 1. Expression Blend Motion& Interaction Design Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    2. 2. Overview:Motion and Interaction Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    3. 3. Overview:Motion and Interaction• Why Interaction/Motion Design Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    4. 4. Overview:Motion and Interaction• Why Interaction/Motion Design • More implementation then concept Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    5. 5. Overview:Motion and Interaction• Why Interaction/Motion Design • More implementation then concept• Motion Design Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    6. 6. Overview:Motion and Interaction• Why Interaction/Motion Design • More implementation then concept• Motion Design• Motion Studies Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    7. 7. Why Interaction/Motion Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    8. 8. Why Interaction/Motion • Design of Interaction Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    9. 9. Why Interaction/Motion • Design of Interaction • More related to experience design or ux design Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    10. 10. Why Interaction/Motion • Design of Interaction • More related to experience design or ux design • Broad topic sometimes misconstrued as motion design Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    11. 11. Why Interaction/Motion • Design of Interaction • More related to experience design or ux design • Broad topic sometimes misconstrued as motion design • All the reasons for IxD is UXD Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    12. 12. Why Interaction/Motion • Design of Interaction • More related to experience design or ux design • Broad topic sometimes misconstrued as motion design • All the reasons for IxD is UXD • Ease of use, discoverability, adoption etc Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    13. 13. Five Dimensions of InteractionDesign Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    14. 14. Five Dimensions of InteractionDesign • Words (defines interactions) Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    15. 15. Five Dimensions of InteractionDesign • Words (defines interactions) • Visual Representations Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    16. 16. Five Dimensions of InteractionDesign • Words (defines interactions) • Visual Representations • Physical Objects or Space Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    17. 17. Five Dimensions of InteractionDesign • Words (defines interactions) • Visual Representations • Physical Objects or Space • Time Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    18. 18. Five Dimensions of InteractionDesign • Words (defines interactions) • Visual Representations • Physical Objects or Space • Time • Behavior Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    19. 19. Five Dimensions of InteractionDesign • Words (defines interactions) • Visual Representations • Physical Objects or Space • Time • Behavior Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    20. 20. Five Dimensions of InteractionDesign • Words (defines interactions) • Visual Representations • Physical Objects or Space • Time • Behavior Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    21. 21. Five Dimensions of InteractionDesign • Words (defines interactions) • Visual Representations • Physical Objects or Space • Time • Behavior • (originally from book ‘Designing Interactions’ by Gillian Crampton Smith) Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    22. 22. Motion Design Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    23. 23. Motion Design• The part of Graphic Design related to Motion and animation Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    24. 24. Motion Design• The part of Graphic Design related to Motion and animation • More narrow then IxD Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    25. 25. Motion Design• The part of Graphic Design related to Motion and animation • More narrow then IxD• Def: Art of the composition and choreography of motion and animation inside a digital experience or media Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    26. 26. Motion Design• The part of Graphic Design related to Motion and animation • More narrow then IxD• Def: Art of the composition and choreography of motion and animation inside a digital experience or media• In ms world typically executed via animation Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    27. 27. Motion Studies Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    28. 28. Motion Studies • A U.I. or visual representation of a U.I. element showing a potential motion or animation that a user would see. Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    29. 29. Motion Studies • A U.I. or visual representation of a U.I. element showing a potential motion or animation that a user would see. • Helps us visualize elements of UI design Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    30. 30. Motion Studies • A U.I. or visual representation of a U.I. element showing a potential motion or animation that a user would see. • Helps us visualize elements of UI design • Important in UX Design in crafting experience Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    31. 31. Motion Studies • A U.I. or visual representation of a U.I. element showing a potential motion or animation that a user would see. • Helps us visualize elements of UI design • Important in UX Design in crafting experience • Expression Blend Sketchflow Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    32. 32. Motion Study Types and Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    33. 33. Motion Study Types and • Small single elements Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    34. 34. Motion Study Types and • Small single elements • UI elements, icons, buttons etc Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    35. 35. Motion Study Types and • Small single elements • UI elements, icons, buttons etc • Pages and Screens Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    36. 36. Motion Study Types and • Small single elements • UI elements, icons, buttons etc • Pages and Screens • Wireframes/Sketchflow Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    37. 37. Motion and Animation Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    38. 38. Motion and Animation• Applies to WPF, XAML, Windows 8, Windows Phone, and just about anything else Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    39. 39. Motion and Animation• Applies to WPF, XAML, Windows 8, Windows Phone, and just about anything else• General in Blend Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    40. 40. Motion and Animation• Applies to WPF, XAML, Windows 8, Windows Phone, and just about anything else• General in Blend• Demo studies and user studies Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    41. 41. Learn More! Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    42. 42. Learn More!• This is an excerpt from a larger course. Visit www.learnnowonline.com for the full details! Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company

    ×