SlideShare a Scribd company logo
What is Interaction Design?
Random House Digital Publishing Group
                          by

              Michael Katayama
                Colleen Miller
                 School of Visual Arts
      MFA Interaction Design Program Class of 2011
What is Interaction Design?
FROM IXDA:




   “ Interaction Design (IxD) defines the structure and
     behavior of interactive products and services.

     Interaction Designers create compelling
     relationships between people and the interactive
     systems they use, from computers to mobile
     devices to appliances; Interaction Designers lay



                                             ”
     the groundwork for intangible experiences.




http://www.ixda.org/
“
Information design is the skeleton; visual design is
the flesh, and interaction design is the muscle that



             ”
joins the two.
-VALERIE CASEY
-GILLIAN CRAMPTON-SMITH
                                founder, Interaction Design Institute Ivrea



http://designinginteractions.com/interviews/GillianCramptonSmith
Interaction Design begins
                                                                                                   as a discipline. IDEO
                                                                                                   designers Bill Moggridge
                                                                                                   and Bill Verplank created
                                                 Command-line interface like                       the name.
                                                 WordStar were the first pieces
Punch cards were the first                       of software that were not                         The world wide web
interace with computers.                         designed by programmers for                       brought the need for
ENIAC, UNIVAC                                    programmers                                       better interaction design.


         1940                      1960                   1970                      1980                    1990                      2000 to present




                                                                                                                                                             Future?




                                                                          Henry Dreyfuss created the                        Sensors and microprocessors
                                                                          new field of human factors.                       getting smaller, cheaper and
                                                                                                                            powerful were placed into
                             Engineers added                              Computers designed for                            physical objects that could
                             control panels to                            people beyond computer                            display awareness.
                             the front and                                scientists and trained
                             experimented with                            operators. Apple                                  Smart phones and wifi that is
                             monitors                                                                                       changing the types of interac-
                                                                                                                            tions we can have.
DESIGN




                                                            Information                 Graphic
                                                               Design                   Design




                                                                          Interaction
                                                                                                  Industrial
                                                Architecture                Design                 Design



                                                                            Human
                                                                           Computer                                     RESEARCH
 ENGINEERING                         Mechanical                           Interaction
                                     Engineering                                                          Ergonomics   PSYCHOLOGY

                                                       Computer                         Human
                                                        Science                         Factors
                          Electrical                                                                              Cognitive
                         Engineering                                                                             Psychology




http://www.slideshare.net/KMcGrane/week-1-ixd-history-course-overview
The Disciplines of User Experience
     by Dan Saffer




COLLEEN and
  MICHAEL




http://www.kickerstudio.com/blog/2008/12/the-disciplines-of-user-experience/
Saffer Redoux




http://commons.wikimedia.org/wiki/File:Interaction-Design-Disciplines.png
The Nine Pillars of Successful Web Teams
      by Jesse James The Nine Pillars
                     Garrett, 2003
                                    of Successful Web Teams
                                    Jesse James Garrett <jjg@jjg.net>
                                                                                                                                                 project management
                                    9 July 2003
                                    The most successful Web teams build their team structures and their
                                    processes on these nine essential competencies:

                                    Project Management: The hub that binds all the tactical competencies
                                    together as well as the engine that drives the project forward to completion,
                                    project management requires a highly specialized set of skills all its own.                                       concrete
                                    Neglecting this area often results in missed deadlines and cost overruns.
                                                                                                                                                       d i
                                                                                                                                                       design
                                    Concrete Design: Before the abstract design can become a fully realized
                                    user experience, you must determine the specific details of interfaces,
                                    navigation, information design, and visual design. This realm of concrete
                                    design is essential to creating the final product.




                                                                                                                                                                                   tactical
                                    Content Production: Knowing what content you need isn't enough. You also                        technology                         content
                                    need to know how you'll produce it. Gathering raw information, writing and
                                    editing, and defining editorial workflows and approvals are all part of content
                                                                                                                                  implementation                      production
                                    production.

                      Technology Implementation: Building technical systems
    Information architecture and interaction involves a lotand                     design
                      hard work and specialized knowledge: languages and protocols, coding
                                                                                             of

                      debugging, testing and refactoring. The more complex your site, the more
    translate strategic objectives into a conceptual
                      important a competency in technology implementation becomes.                                                                    abstract
                                                                                                                                                       bstra
                                                                                                                                                       d
                                                                                                                                                       design
    framework for the final user experience. design translate
                      Abstract Design: Information architecture and interaction


                                                                                                                      strategic
                      strategic objectives into a conceptual framework for the final user
                                    experience. These emerging disciplines addressing abstract design are
                                    increasingly recognized for their value in the Web development process.

                                    Content Strategy: Content is often the reason users come to your site. But
                                    what content can you offer to meet your users' expectations? How much                           technology                         content
                                    content is appropriate, and what form should it take? What style or tone
                                    should it have? Before you can produce that content, you need to answer
                                                                                                                                      strategy                         strategy
                                    fundamental content strategy questions such as these.

                                    Technology Strategy: Web sites are technologically complex, and getting
                                    more intricate all the time. Identifying the technology strategy for the site –
                                    platforms, standards, technologies, and how they can all interoperate – is
                                    essential to avoiding costly mistakes.                                                                               site
                                    Site Strategy: Defining your own goals for the site can be surprisingly                                           strategy
                                                                                                                                                       trateg
                                    tricky. Arriving at a common understanding of the site's purpose for your
                                    organization, how you'll prioritize the site's various goals, and the means by
                                    which you'll measure the site's success are all matters of site strategy.

                                    User Research: User-centered design means understanding what your
                                    users need, how they think, and how they behave – and incorporating that
                                    understanding into every aspect of your process. User research provides the
                                    raw observations that fuel this insight into the people your site must serve.
                                                                                                                                                   user research
                                   adaptive path                                  http://www.jjg.net/ia/pillars/
                                                                                http://www.adaptivepath.com/

http://www.adaptivepath.com/ideas/essays/archives/000242.php
Design Process


   DISCOVER            DEFINE            DESIGN             DEVELOP            DEPLOY         DOCUMENT


Not committed    strategy          brief            1st iteration       detailed        launch    scope next
to a medium     statement     (set direction)   (skeleton sketches)   construction      version      version



What are users’ primary goals, and
how can they achieve them?


                     Which information is of higher
                     importance? How do I draw
                     users’ attention to them?

                     How should I incorporate the
                     user feedback?


                                          Prototyping offers a huge
                                          opportunity for increasing
                                          process efficiency.
The 5 Competencies
    of User Experience Design




http://uxmatters.com/mt/archives/2007/11/the-five-competencies-of-user-experience-design.php
Research Methods Brainstorming                                                 Concept model
Observations (contextual inquiry,              Gathering the data and finding   Creating visualizations of research
fly on the wall, shadowing)                     patterns using post-its,        findings.
                                               whiteboards, sketching of all
Interviews                                     types.

Journals and Surveys




Sources:sheknows.com, onewhiteboardaday.com,
derekchan.com
Personas                                Storyboards                            Task analysis
A documented set of archetypal people   Sketching to illustrate what the
                                                                               A list of activities that the final design
who are involved with a product of      experience of the product or service
                                                                               will have to support.
service.                                will be like.




Sources:messagefirst, iainsitute.org
Paper prototypes Wireframes                                                          User Journey
Low-fidelity testing with the users,               Mid-fidelity view of a particular   Shows the path of accomplishing a
stakeholders…allowing the users to                part of a product.                 specific goal.
comment on the prototype.




Sources: beyondthekeeboard.com, digitalweb.com,
tigerxtiger.com
Which would you choose?
Which would you choose?
Moving Away from Screen-based Interfaces




http://www.botanicalls.com/
“
We can't have advances in technology any longer
unless design is integrated from the very start.
-JOHN UNTERKOFFLER


                                         ”

More Related Content

PPT
My Robot
PDF
Design & Technology
PDF
13 support designere
PDF
CLASSIFICATION OF SMART ENVIRONMENT SCENARIOS IN COMBINATION WITH A HUMANWEAR...
PDF
Ebooks part 1
PDF
Teach Less Learn More
KEY
Week 1 IxD History: Course Overview
My Robot
Design & Technology
13 support designere
CLASSIFICATION OF SMART ENVIRONMENT SCENARIOS IN COMBINATION WITH A HUMANWEAR...
Ebooks part 1
Teach Less Learn More
Week 1 IxD History: Course Overview

What's hot (20)

PDF
Human-Computer Interaction: An Overview
PDF
Interfaces to ubiquitous computing
PPTX
Mobile Prototyping Essentials Workshop: Part 1
PDF
Feb 28th creative technologies and immersive experiences dmu games festival
PDF
Design & the internet of things: from whimsy to utility and hopefully back
PDF
HCI 2015 (3/10) Design Methodologies
PDF
Belmer portfolio overview
PDF
Project Modai preliminary boards
PDF
Supersense! Studio Context
PDF
HCI 2014 (10 of 10): Natural User Interfaces. Ubiquitous Computing
PPTX
Exploring “live” Social and Networked Interaction with the Future Media Inter...
PPT
Technology as a Cultural Practice - UX Australia
PDF
HCI: Design Patterns for Social Web Interaction
PDF
HCI 2015 (5/10) Information Architecture. Design Patterns. Layout, Actions, D...
PDF
HCI 2018 (9/10) Affective Factors. From Emotion to Persuasive Technologies
PDF
Introducing the Internet of Things: lecture @IULM University
PDF
HCI 2015 (4/10) Visual Design. Information Architecture. Design Patterns
PDF
Aq9th.6
PDF
AQ Edition 9th
PDF
A Welcome Note
Human-Computer Interaction: An Overview
Interfaces to ubiquitous computing
Mobile Prototyping Essentials Workshop: Part 1
Feb 28th creative technologies and immersive experiences dmu games festival
Design & the internet of things: from whimsy to utility and hopefully back
HCI 2015 (3/10) Design Methodologies
Belmer portfolio overview
Project Modai preliminary boards
Supersense! Studio Context
HCI 2014 (10 of 10): Natural User Interfaces. Ubiquitous Computing
Exploring “live” Social and Networked Interaction with the Future Media Inter...
Technology as a Cultural Practice - UX Australia
HCI: Design Patterns for Social Web Interaction
HCI 2015 (5/10) Information Architecture. Design Patterns. Layout, Actions, D...
HCI 2018 (9/10) Affective Factors. From Emotion to Persuasive Technologies
Introducing the Internet of Things: lecture @IULM University
HCI 2015 (4/10) Visual Design. Information Architecture. Design Patterns
Aq9th.6
AQ Edition 9th
A Welcome Note
Ad

Viewers also liked (20)

PPTX
Trend: Customized
PPTX
Изучение карьерных ориентаций учащихся школ города Лангепаса
PPTX
Nur151 spr12 dcmb
PDF
Cem Karaca Kültür Merkezinde SERAP MUTLU AKBULUT Konseri resimleri 09_11_2013
PPTX
Exs 101 spr12
PDF
Информационный вестник Май 2012
PPTX
PPT
Improving performance
PDF
Incorporating Startegies And Tactics Into Pbm
PPTX
TWTRCON DC 09 TweetFunnel
PDF
A General Guide To Outsourcing
PPTX
Patient engagement report for California
PDF
Yelken kulübünde Koro Arkadaşlarımızın doğum günü kutlaması resimleri
PDF
никита кабардин
PPTX
Cpd 102 ab fall10session1
PPT
Работа с AppStore
PDF
Learn Past Exp
PPTX
Powerpoint fiesta recycler dance @ sala versus (10 07-2010)
PPTX
Juggling
PPTX
2nd Career
Trend: Customized
Изучение карьерных ориентаций учащихся школ города Лангепаса
Nur151 spr12 dcmb
Cem Karaca Kültür Merkezinde SERAP MUTLU AKBULUT Konseri resimleri 09_11_2013
Exs 101 spr12
Информационный вестник Май 2012
Improving performance
Incorporating Startegies And Tactics Into Pbm
TWTRCON DC 09 TweetFunnel
A General Guide To Outsourcing
Patient engagement report for California
Yelken kulübünde Koro Arkadaşlarımızın doğum günü kutlaması resimleri
никита кабардин
Cpd 102 ab fall10session1
Работа с AppStore
Learn Past Exp
Powerpoint fiesta recycler dance @ sala versus (10 07-2010)
Juggling
2nd Career
Ad

Similar to What is Interaction Design? (20)

PDF
User Experience - More Than Just a Pretty Stick
PDF
User Experience - More Than Just a Pretty Stick
PDF
User Experience & Lean Startup
PPTX
Model-Based Visual Software Specification
PDF
Enrique Allen, D Fund - Warm Gun Conference
PDF
[I3 d]03 interactivity
PPTX
Agile ♥ UX
PPT
History of Interaction Design
PDF
Development Prototype Design of Virtual Assembly Application-Based Leap Motion
PPT
Multi-Touch Tangible Interface; HCI trends, projects, and development
PDF
Ux professionalism
PDF
STI, MetaRational #2
PPTX
Agile ♥ UX
PPTX
物聯網產品體驗設計架構 | A Conceptual Framework for IoT Product Experience Design
PDF
Smarter Planet & Innovation
PDF
Interaction Design A Revolution of Quality
PDF
[I3 d]04 interactivity
PDF
The Best is the Enemy of the Good
PDF
Hci activity#1
PPTX
Who is making Internet of Things. TYIT SEM-5
User Experience - More Than Just a Pretty Stick
User Experience - More Than Just a Pretty Stick
User Experience & Lean Startup
Model-Based Visual Software Specification
Enrique Allen, D Fund - Warm Gun Conference
[I3 d]03 interactivity
Agile ♥ UX
History of Interaction Design
Development Prototype Design of Virtual Assembly Application-Based Leap Motion
Multi-Touch Tangible Interface; HCI trends, projects, and development
Ux professionalism
STI, MetaRational #2
Agile ♥ UX
物聯網產品體驗設計架構 | A Conceptual Framework for IoT Product Experience Design
Smarter Planet & Innovation
Interaction Design A Revolution of Quality
[I3 d]04 interactivity
The Best is the Enemy of the Good
Hci activity#1
Who is making Internet of Things. TYIT SEM-5

Recently uploaded (20)

PPTX
DOC-20250430-WA0014._20250714_235747_0000.pptx
PPTX
AC-Unit1.pptx CRYPTOGRAPHIC NNNNFOR ALL
PDF
UNIT 1 Introduction fnfbbfhfhfbdhdbdto Java.pptx.pdf
PDF
Urban Design Final Project-Context
DOCX
The story of the first moon landing.docx
PDF
The Advantages of Working With a Design-Build Studio
PDF
Trusted Executive Protection Services in Ontario — Discreet & Professional.pdf
PPTX
Fundamental Principles of Visual Graphic Design.pptx
PPT
UNIT I- Yarn, types, explanation, process
PPT
unit 1 ppt.ppthhhhhhhhhhhhhhhhhhhhhhhhhh
PPTX
building Planning Overview for step wise design.pptx
PPTX
Implications Existing phase plan and its feasibility.pptx
PDF
SEVA- Fashion designing-Presentation.pdf
PDF
Interior Structure and Construction A1 NGYANQI
PDF
Urban Design Final Project-Site Analysis
PPTX
areprosthodontics and orthodonticsa text.pptx
PPTX
ANATOMY OF ANTERIOR CHAMBER ANGLE AND GONIOSCOPY.pptx
PDF
YOW2022-BNE-MinimalViableArchitecture.pdf
PDF
Integrated-2D-and-3D-Animation-Bridging-Dimensions-for-Impactful-Storytelling...
PDF
Wio LTE JP Version v1.3b- 4G, Cat.1, Espruino Compatible\202001935, PCBA;Wio ...
DOC-20250430-WA0014._20250714_235747_0000.pptx
AC-Unit1.pptx CRYPTOGRAPHIC NNNNFOR ALL
UNIT 1 Introduction fnfbbfhfhfbdhdbdto Java.pptx.pdf
Urban Design Final Project-Context
The story of the first moon landing.docx
The Advantages of Working With a Design-Build Studio
Trusted Executive Protection Services in Ontario — Discreet & Professional.pdf
Fundamental Principles of Visual Graphic Design.pptx
UNIT I- Yarn, types, explanation, process
unit 1 ppt.ppthhhhhhhhhhhhhhhhhhhhhhhhhh
building Planning Overview for step wise design.pptx
Implications Existing phase plan and its feasibility.pptx
SEVA- Fashion designing-Presentation.pdf
Interior Structure and Construction A1 NGYANQI
Urban Design Final Project-Site Analysis
areprosthodontics and orthodonticsa text.pptx
ANATOMY OF ANTERIOR CHAMBER ANGLE AND GONIOSCOPY.pptx
YOW2022-BNE-MinimalViableArchitecture.pdf
Integrated-2D-and-3D-Animation-Bridging-Dimensions-for-Impactful-Storytelling...
Wio LTE JP Version v1.3b- 4G, Cat.1, Espruino Compatible\202001935, PCBA;Wio ...

What is Interaction Design?

  • 1. What is Interaction Design? Random House Digital Publishing Group by Michael Katayama Colleen Miller School of Visual Arts MFA Interaction Design Program Class of 2011
  • 3. FROM IXDA: “ Interaction Design (IxD) defines the structure and behavior of interactive products and services. Interaction Designers create compelling relationships between people and the interactive systems they use, from computers to mobile devices to appliances; Interaction Designers lay ” the groundwork for intangible experiences. http://www.ixda.org/
  • 4. “ Information design is the skeleton; visual design is the flesh, and interaction design is the muscle that ” joins the two. -VALERIE CASEY
  • 5. -GILLIAN CRAMPTON-SMITH founder, Interaction Design Institute Ivrea http://designinginteractions.com/interviews/GillianCramptonSmith
  • 6. Interaction Design begins as a discipline. IDEO designers Bill Moggridge and Bill Verplank created Command-line interface like the name. WordStar were the first pieces Punch cards were the first of software that were not The world wide web interace with computers. designed by programmers for brought the need for ENIAC, UNIVAC programmers better interaction design. 1940 1960 1970 1980 1990 2000 to present Future? Henry Dreyfuss created the Sensors and microprocessors new field of human factors. getting smaller, cheaper and powerful were placed into Engineers added Computers designed for physical objects that could control panels to people beyond computer display awareness. the front and scientists and trained experimented with operators. Apple Smart phones and wifi that is monitors changing the types of interac- tions we can have.
  • 7. DESIGN Information Graphic Design Design Interaction Industrial Architecture Design Design Human Computer RESEARCH ENGINEERING Mechanical Interaction Engineering Ergonomics PSYCHOLOGY Computer Human Science Factors Electrical Cognitive Engineering Psychology http://www.slideshare.net/KMcGrane/week-1-ixd-history-course-overview
  • 8. The Disciplines of User Experience by Dan Saffer COLLEEN and MICHAEL http://www.kickerstudio.com/blog/2008/12/the-disciplines-of-user-experience/
  • 10. The Nine Pillars of Successful Web Teams by Jesse James The Nine Pillars Garrett, 2003 of Successful Web Teams Jesse James Garrett <jjg@jjg.net> project management 9 July 2003 The most successful Web teams build their team structures and their processes on these nine essential competencies: Project Management: The hub that binds all the tactical competencies together as well as the engine that drives the project forward to completion, project management requires a highly specialized set of skills all its own. concrete Neglecting this area often results in missed deadlines and cost overruns. d i design Concrete Design: Before the abstract design can become a fully realized user experience, you must determine the specific details of interfaces, navigation, information design, and visual design. This realm of concrete design is essential to creating the final product. tactical Content Production: Knowing what content you need isn't enough. You also technology content need to know how you'll produce it. Gathering raw information, writing and editing, and defining editorial workflows and approvals are all part of content implementation production production. Technology Implementation: Building technical systems Information architecture and interaction involves a lotand design hard work and specialized knowledge: languages and protocols, coding of debugging, testing and refactoring. The more complex your site, the more translate strategic objectives into a conceptual important a competency in technology implementation becomes. abstract bstra d design framework for the final user experience. design translate Abstract Design: Information architecture and interaction strategic strategic objectives into a conceptual framework for the final user experience. These emerging disciplines addressing abstract design are increasingly recognized for their value in the Web development process. Content Strategy: Content is often the reason users come to your site. But what content can you offer to meet your users' expectations? How much technology content content is appropriate, and what form should it take? What style or tone should it have? Before you can produce that content, you need to answer strategy strategy fundamental content strategy questions such as these. Technology Strategy: Web sites are technologically complex, and getting more intricate all the time. Identifying the technology strategy for the site – platforms, standards, technologies, and how they can all interoperate – is essential to avoiding costly mistakes. site Site Strategy: Defining your own goals for the site can be surprisingly strategy trateg tricky. Arriving at a common understanding of the site's purpose for your organization, how you'll prioritize the site's various goals, and the means by which you'll measure the site's success are all matters of site strategy. User Research: User-centered design means understanding what your users need, how they think, and how they behave – and incorporating that understanding into every aspect of your process. User research provides the raw observations that fuel this insight into the people your site must serve. user research adaptive path http://www.jjg.net/ia/pillars/ http://www.adaptivepath.com/ http://www.adaptivepath.com/ideas/essays/archives/000242.php
  • 11. Design Process DISCOVER DEFINE DESIGN DEVELOP DEPLOY DOCUMENT Not committed strategy brief 1st iteration detailed launch scope next to a medium statement (set direction) (skeleton sketches) construction version version What are users’ primary goals, and how can they achieve them? Which information is of higher importance? How do I draw users’ attention to them? How should I incorporate the user feedback? Prototyping offers a huge opportunity for increasing process efficiency.
  • 12. The 5 Competencies of User Experience Design http://uxmatters.com/mt/archives/2007/11/the-five-competencies-of-user-experience-design.php
  • 13. Research Methods Brainstorming Concept model Observations (contextual inquiry, Gathering the data and finding Creating visualizations of research fly on the wall, shadowing) patterns using post-its, findings. whiteboards, sketching of all Interviews types. Journals and Surveys Sources:sheknows.com, onewhiteboardaday.com, derekchan.com
  • 14. Personas Storyboards Task analysis A documented set of archetypal people Sketching to illustrate what the A list of activities that the final design who are involved with a product of experience of the product or service will have to support. service. will be like. Sources:messagefirst, iainsitute.org
  • 15. Paper prototypes Wireframes User Journey Low-fidelity testing with the users, Mid-fidelity view of a particular Shows the path of accomplishing a stakeholders…allowing the users to part of a product. specific goal. comment on the prototype. Sources: beyondthekeeboard.com, digitalweb.com, tigerxtiger.com
  • 16. Which would you choose?
  • 17. Which would you choose?
  • 18. Moving Away from Screen-based Interfaces http://www.botanicalls.com/
  • 19. “ We can't have advances in technology any longer unless design is integrated from the very start. -JOHN UNTERKOFFLER ”