Photography + Animation + Design = Better UX

Had the honor of speaking at PADCon 2017 which is a creative conference for photographers, animators and graphic designers. I engaged to my audience by connecting on how photography, animation and design plays a role in building a better user experience.

Transcript

1. Photography + Animation + Design = Better UX Converging for a better user experience I N T R O L E T ’ S TA L K
3. I N T R O W H O ’ S I N T H E R O O M ?
4. I N T R O W H O ’ S I N T H E R O O M ? Photographers
5. I N T R O W H O ’ S I N T H E R O O M ? Photographers Animators
6. Photographers I N T R O W H O ’ S I N T H E R O O M ? Animators Designers
7. Francis Alturas Product Designer + Developer
 @ Symph I N T R O W H O ’ S I N T H E R O O M ?
10. O U R C L I E N T S A N D A F E W O T H E R S
11. D I S C L A I M E R B E F O R E W E P R O C E E D Not about me
12. D I S C L A I M E R B E F O R E W E P R O C E E D Not about me I hope what I can do today could be of some assistance or help to you
13. D I S C L A I M E R B E F O R E W E P R O C E E D Not about me I hope what I can do today could be some assistance or help to you
14. B U T B E F O R E W E S TA R T I N T R O What is UX?
15. Umm.. okay, so let me ask you.
16. https://dribbble.com/shots/3761845-landing-page
17. http://www.elisilva.com/ux-process/
18. https://thenextweb.com/apple/2017/10/13/apple-iphone-x-design-guides-time/
20. UX is not pretty pixels on the screen
21. UX is not just a step in the process
22. https://thenextweb.com/apple/2017/10/13/apple-iphone-x-design-guides-time/ UX is not just about technology
25. The goal of UX design in business is to “improve customer satisfaction and loyalty through the utility, ease of use, and pleasure provided in the interaction with a product.” Oxford Journal User Experience refers to a person's emotions and attitudes about using a particular product, system or service. It includes the practical, experiential, affective, meaningful and valuable aspects of human–computer interaction and product ownership. Wikipedia UX design is the process used to determine what the experience will be like when a user interacts with your product Laurea Klein, UX for Lean Startups The creative and analytical process of determining what a website, device, or piece of software is going to be Steve Portigal, Interviewing Users UX design is the art and science of generating positive emotions among people who interact with products or services. Tomer Sharon, Google User Experience Design (UXD or UED) is a design process whose sole objective is to design a system that offers a great experience to its users. Thus UXD embraces the theories of a number of disciplines such as user interface design, usability, accessibility, information architecture and Human Computer Interaction. 
 Justin Mifsud, Usability Geek UX design is a commitment to building products that are created with the customer in mind. It starts with studying who the customers are and what they need, and taking that information to provide products and services that improve the quality of people’s lives. Marieke McCloskey, User Testing User experience" encompasses all aspects of the end-user's interaction with the company, its services, and its products. NNGroup
26. The goal of UX design in business is to “improve customer satisfaction and loyalty through the utility, ease of use, and pleasure provided in the interaction with a product.” Oxford Journal User Experience refers to a person's emotions and attitudes about using a particular product, system or service. It includes the practical, experiential, affective, meaningful and valuable aspects of human–computer interaction and product ownership. Wikipedia UX design is the process used to determine what the experience will be like when a user interacts with your product Laurea Klein, UX for Lean Startups The creative and analytical process of determining what a website, device, or piece of software is going to be Steve Portigal, Interviewing Users UX design is the art and science of generating positive emotions among people who interact with products or services. Tomer Sharon, Google User Experience Design (UXD or UED) is a design process whose sole objective is to design a system that offers a great experience to its users. Thus UXD embraces the theories of a number of disciplines such as user interface design, usability, accessibility, information architecture and Human Computer Interaction. 
 Justin Mifsud, Usability Geek UX design is a commitment to building products that are created with the customer in mind. It starts with studying who the customers are and what they need, and taking that information to provide products and services that improve the quality of people’s lives. Marieke McCloskey, User Testing User experience" encompasses all aspects of the end-user's interaction with the company, its services, and its products. NNGroup DO YOU EVEN UX BRO?
32. That is User Experience
33. User Experience Architect’s Office
35. “Hi! I’m a user experience designer, I design websites or I design apps.”
36. No, its everything. It’s the way you experience the world, its the way you experience your life, its the way you experience the service, an app or a computer system — but it’s a system of everything. - Don Norman, NNgroup
39. The Futur . What is UX Design? Defining User Experience Design & Explaining the Process.
 https://www.youtube.com/watch?v=CJnfAXlBRTE
40. A N O T H E R Q U E S T I O N A F E W V E R Y O B V I O U S E X A M P L E S Why is everyone into UX?
41. Companies have evolved — now, they have excellent product designers because it’s a necessity they can’t afford to ignore *Wells Riley - Startups, This is How Design Works
 https://startupsthisishowdesignworks.com/
43. Aarron Walter VP of R&D Julie Zhou VP Product Design Joe Zadeh VP Product Dantley Davis Design Director Alex Castellarnau Head of Design Andrew Crow Head of Design Daniel Burka Design Partner Bob Baxley Head of Product 
 Design Jenny Arden UX Design Lead
44. Design is becoming a key differentiator *for companies to acquire funding, press coverage, and loyal users. *Wells Riley - Startups, This is How Design Works
 https://startupsthisishowdesignworks.com/
46. I N T R O I N T R O Today, I’m going to talk about the role of photography, animation & design in UX
47. I N T R O So we harness its power to crafting a better user experience! I N T R O
48. Photography + Animation + Design = Better UX Converging for a better user experience I N T R O L E T ’ S TA L K
49. L E T ’ S S TA R T ! Also, I don’t have much time so I’ll be citing three examples each I N T R O
50. Photography & UX I N T R O L E T ’ S TA L K
51. How does Photography contribute to a better user experience? Q U E S T I O N U X D E S I G N
52. Great photos evoke emotional response. P H O T O G R A P H Y + U X T I P # 1
55. Great photos evoke emotional response.
56. Great photos evokes trust & credibility. P H O T O G R A P H Y + U X T I P # 2
60. “Photos have the power to make or break a users' experience—make sure they are communicating your message properly.” U X M A G . C O M
61. Content is king. 
 Photography is also part-king. P H O T O G R A P H Y + U X T I P # 3
63. http://www.elisilva.com/ux-process/
64. “Users pay close attention to photos and other images that contain relevant information but ignore fluffy pictures used to "jazz up" web pages” N I E L S E N N O R M A L G R O U P
65. “the most usable and effective photos communicate something clearly to the user, are useful, are in keeping with the brand, evoke an emotional response, and influence the user in the way that the designer intended…” J A M E S C H U D L E Y
66. “the most usable and effective photos communicate something clearly to the user, are useful, are in keeping with the brand, evoke an emotional response, and influence the user in the way that the designer intended…” J A M E S C H U D L E Y
67. And there’s so much more.. P H O T O G R A P H Y + U X T I P # 4
68. R E M E M B E R M E C H E C K L I S T 1. Legibility & Credibility 2. What message does the photo communicate? 3. Usefulness & Effectiveness http://uxmag.com/articles/evaluating-the-usability-of-web-photos Photo Usability Checklist:
69. U X D E S I G N Q U E S T I O N How does Design contribute to a better user experience?
70. But wait, what do you mean by a ‘design’ ?
71. Let’s be specific
72. U X D E S I G N W H AT D E S I G N E R ? How does Visual Design contribute to a better user experience?
73. U X D E S I G N W H AT D E S I G N E R ? Visual Designer Tools of the Trade: • the “Pixel-Pusher” • focus is on crafting beautiful icons, controls, and visual elements and making use of suitable typography
74. U X D E S I G N W H AT D E S I G N E R ? How does UI Design contribute to a better user experience?
75. U X D E S I G N W H AT D E S I G N E R ? UI Designer Tools of the Trade: • focused on “how the product is laid out” • interface connects to the laid out UX • responsible for a consistent design language
76. U X D E S I G N W H AT D E S I G N E R ? How does UX Design contribute to a better user experience?
77. U X D E S I G N W H AT D E S I G N E R ? UX Designer Tools of the Trade: • the champion of a “user's needs” • User personas, A/B test results, Investigative user studies & interviews • overall feel of the product
78. U X D E S I G N W H AT D E S I G N E R ? How does Product Design contribute to a better user experience?
79. U X D E S I G N W H AT D E S I G N E R ? Product Designer Tools of the Trade: • “the unicorn” • helps identify the initial problem, sets benchmarks to address it, and then designs, tests, and iterates on different solutions • well-rounded skills
82. U X D E S I G N O O P S There’s just too much about it we could talk all-day about it.
83. “A designer solves problems within a set of constraints.” - Mike Monteiro, What is a Designer
84. Q U E S T I O N How does Animation contribute to a better user experience? U X D E S I G N
85. A N I M AT I O N & U X Animation is great for reducing cognitive load T I P # 1
86. D R I B B B L E   —   M A R C U S F O R S B E R G
87. “Motion, when used well, reduces user confusion by effectively communicating user feedback. ” N A E M A B A S K A N D E R I @ D E S I G N E R H A N G O U T
88. A N I M AT I O N & U X Create Delight. 
 Motion Provides Meaning. T I P # 2
89. D R I B B B L E   —   Z E E Y O U N G
90. D R I B B B L E   —   M AT T T H O M P S O N
91. “Animations are a wonderful way to bring delight to the user and enhance the user experience. ” N A E M A B A S K A N D E R I @ D E S I G N E R H A N G O U T
92. A N I M AT I O N & U X Providing Feedback 
 To Make Better Decisions T I P # 3
96. A N I M AT I O N & U X And there’s so much more.. T I P 4
97. R E M E M B E R M E C H E C K L I S T https://uxdesign.cc/ui-animation-please-use-responsibly-e707dbdb12d5 1. Goal - What is the animation communicating to the user? 2. Focus - Where is the user’s current focus , where is the user looking? 1. Frequency — How often will this animation play? 2. Duration — How long should this animation play? 3. Speed — How fast should this animation play? 4. Trigger — How is the animation triggered? By user action? Or automatically? 5. Accessibility — how will the user experience be affected if the animation is turned off by the user? Mechanics of Motion:
98. And that’s a wrap!
100. Oh, one last thing
101. “Designing for the user experience has a lot more to it than making a product usable. Usability allows people to easily accomplish their goals. UX design covers more than that, it’s about giving people a delightful and meaningful experience.” U X M Y T H S . C O M
102. Francis Alturas Q U E S T I O N S ? T H A N K Y O U ! Product Designer + Developer
 @ Symph
103. This is a collective remix from all of these great references: O U T R O R E S O U R C E S 10 Most Common Misconceptions About User Experience Design Photos as Web Content - Nielsen Norman Group User Centered Photography - James Chudley How Functional Animation Helps Improve User Experience UI Animation: Please Use Responsibly - Naema Baskanderi What is a Designer. Mike Monteiro UX Myths