Introduction to Interaction Design Lecture Notes PDF

Introduction to Interaction Design Interaction Design Week 2 Subin Chitrakar Agendas User Interface User Experience Interaction Design | 3 User Interface The look and feel, the presentation and interactivity of a product Strictly Digital Te...

Introduction to Interaction Design Interaction Design Week 2 Subin Chitrakar Agendas User Interface User Experience Interaction Design | 3 User Interface The look and feel, the presentation and interactivity of a product Strictly Digital Term | 5 User Interface Considers the visual, interactive elements of a product Buttons Icons Spacing Typography Layout Color Schemes | 6 User Interface Visual Guide – doesn’t require the user to think much Transfers the brand’s strengths and visual assets to a product’s interface | 7 User Interface Consistent Coherent Aesthetically Pleasing | 8 User Experience User Experience encompasses all the aspects of the end-user’s interaction with the company, its service and its product - Don Norman, Cognitive Scientist and User Experience Architect | 9 User Experience Applies to anything that can be experienced Considers all the elements that shape an experience How the experience makes the user feel How easy is it for the user to accomplish their desired goal | 10 User Experience The ultimate purpose of UX design is to create easy, efficient, relevant, and all- round pleasant experiences for the user. | 11 12 Interaction Design Design is not just what it looks like and feels like. Design is how it works. - Steve Jobs | 13 Interaction Design The goal of creating products that enable the user to achieve their objective(s) in the best way possible - The Interaction Design Foundation | 14 Interaction Design involves examining and defining the interactions (via an interface – UI) between a system and its user (UX) create more meaningful relationships between people and the products and services that they use includes a strategic focus on how users interact during an experience and how that can be managed, rather than just focussing on how to format and design the technology for use | 15 | 16 Interaction Design Interaction Design is the creation of a dialogue between a person and a product, system, or service. This dialogue is both physical and emotional in nature and is manifested in the interplay between form, function, and technology as experienced over time. - John Kolko, Author of Thoughts on Interaction Design | 17 IxD VS UI Interaction design focuses on human-computer interaction, including animations, microinteractions, transitions, search, and other motion-based designs. They decide, for example, what happens when a user taps an element. User interface design focuses on visual design and aesthetics, including color, fonts, iconography, layouts, etc. They decide what a user interface must look like. | 18 IxD VS UX Interaction design is a specialized discipline within UX design. Where UX looks at the entire user experience and how everything ties together, interaction designers focus on user interactions and motion User experience designers apply UX fundamentals like design thinking, human-centered design, and user research to make decisions. They’re specifically concerned with a user’s tasks, actions, and environment, while interaction designers focus on making the digital product respond to user actions in an appropriate way. They tend to think about what happens when a user clicks a button, types a phrase into a search bar or hovers over an image | 19 | 20 Why does Interaction Design Matter? Good IxD ensures that users can easily and efficiently accomplish their goals, whether they are using a website, mobile app, or physical product. This can improve user satisfaction and loyalty, as well as increase conversions and sales According to a study by DigitalRiver, for example, some 72% of users who abandon an online cart do so due to a bad user experience | 21 Why does Interaction Design Matter? Any company that invests in designing interactions for their eCommerce site, for example, is likely to see an increase in the number of visitors who make a purchase – resulting in higher revenue A well-designed website can bolster customer satisfaction and loyalty, leading to increased repeat business and positive word-of-mouth marketing. Good IxD can also help a company save money in the long run. For example, by making a website or app easier to use, companies can reduce the number of customer support inquiries, which can save time and resources. | 22 Interaction Design Process Find the users’ needs/wants—It’s easy to assume you know what users want/need and their relevant contexts. Discover their real requirements: Observe people Interview people Examine existing solutions—while remembering it’s hard to envisage future needs, technologies, etc | 23 Interaction Design Process Do analysis to sort and order your findings so they make sense. This may be through a: Narrative/story of how someone uses a system. Task analysis, breaking down a user’s steps/sub-steps | 24 Interaction Design Process Design a potential solution according to design guidelines and fundamental design principles (e.g., giving appropriate feedback for users’ actions). Use the best techniques to match how users will interact with it | 25 Interaction Design Process Start prototyping — Give users an idea of what the product will look like and let them test it, and/or give it to experts to evaluate its effectiveness using heuristics. | 26 Interaction Design Process Implement and deploy what you have built | 27 Any Questions | 28 Summary: Introduction to Interaction Design Interaction design lies at the convergence of human computer interaction. Its purpose is to transform digital products from mechanical and cold experiences into those that feel natural and personal. Interaction design is the process that makes websites and apps interactive Interaction designers focus on what users want to achieve when interacting with a digital product. They provide us with experiences that meet our needs and enable our success. | 29 Summary: Introduction to Interaction Design Interaction design process: Find the users’ needs/wants Do analysis to sort and order your findings so they make sense Design a potential solution Start prototyping Implement and deploy what you have built | 30 What to expect: Figma Advance functionalities in Figma | 31 32