SlideShare a Scribd company logo
1 of 54
Small Cognitive Psychology
for Big Interaction Design
UX Cambridge 2012
Jan Srutek | @JanSru

                             @JanSru
Jan = UX Designer at Flow Interactive 	

Interaction design studio in London, par t of Foolproof Group	

                                                                   @JanSru
Why talk about Cog Psy?

    Understand human cognitive
1/! capabilities and limitations




                                                                  @JanSru
                Image: www.flickr.com/photos/hugo90/7019825859/
Why talk about Cog Psy?

    Evaluate new designs & patterns
2/! more meaningfully
                          Website: quince.infragistics.com/




                                                              @JanSru
Cognitive psychology
is not very accessible




                                                                            @JanSru
                         Image: http://www.flickr.com/photos/ccacnorthlib/4131838228/
We’ll talk about…

   Memory           Persuasive design

   Learning         Emotional design

   Attention        ‘Neuro design‘




                                        @JanSru
Memory



                                                    Retrieval
Information                           Short-term                Long-term
              Sensory      Encoding
  from the                             (working)                 memory
              memory       Storage
environment                             memory     Encoding
                                                    Storage



              Forgetting              Forgetting




                                                                        @JanSru
The truth about short-term memory

People can hold

          7 +/- 2
                  things in short-term memory




                                            @JanSru
Short-term memory capacity



 4 +/- 1
 chunks of information at once


 Phone numbers remembered as:
 0776-136-2093

                                 @JanSru
Short-term memory
Implications for design:


STM is rather limited


Relevance for design
1) When people have to remember stuff
2) When problem-solving

                                        @JanSru
Short-term memory
Implications for design:



STM is
easily
disrupted




                    Image: www.flickr.com/photos/arselectronica/6100107956/
                                                                              @JanSru
Short-term memory
Implications for design:



STM is
easily
disrupted




                       Image: www.mobiledesignpatterngallery.com/
                                                                    @JanSru
Website: www.popscreen.com/join


Inline validation                        @JanSru
Website: www.amazon.com


Super-tooltip                 @JanSru
Website: www.amazon.com


Super-tooltip                 @JanSru
Website: www.tfl.gov.uk/tickets/default.aspx


On-demand information in context                             @JanSru
Long-term memory

     Declarative                 Procedural: How
          (explicit)                 (implicit)

 Episodic        Semantic
‘experiences’ ‘what/knowledge’




                                                   @JanSru
Long-term memory

     Declarative                     Procedural: How
          (explicit)                         (implicit)

 Episodic        Semantic
‘experiences’ ‘what/knowledge’




                       Storage   Retrieval

                                                          @JanSru
Level-of-processing
(also Depth-of-processing)




        Information that is analysed deeply
        is recalled better than information
        that is analysed superficially.




                                              @JanSru
Long-term memory
Implications for design:


To engage people, make your content:

  Relevant (to one’s circumstances)
  Emotional
  Humorous
  Surprising or shocking
  Require elaboration & reflection

                                       @JanSru
Personally relevant copy
                           Website: http://www.investec.co.uk


                                                   @JanSru
Fun for added engagement
                           Website: http://convergese.com


                                               @JanSru
Fun for added engagement
                           Website: http://convergese.com


                                               @JanSru
Fun for added engagement
                           Website: http://convergese.com


                                               @JanSru
Website: http://benthebodyguard.com/


Emotions & reflection for memorability                     @JanSru
@JanSru
@JanSru
Learning
People prefer learning by exploration




                                                                      @JanSru
                                  Image: www.flickr.com/photos/dante/165394424
System Model


          Interaction Design Layer


           User’s Mental Model
            Concept             Concept
Concept
                      Concept             Concept


                                                    @JanSru
Learning
Implications for design:


  Support building a good mental model:

  1) Starting point that orients people

  2) Continuously encouraged exploration




                                           @JanSru
Learning research from 1984, with 2 groups:
•  First group learnt procedures by rote,
•  Second group was shown a model of the system before learning procedures

Ref: Kieras & Bovair, (1984) The role of a mental model in learning to operate a device   @JanSru
Results:
Group that saw the concept model performed much better



Ref: Kieras & Bovair, (1984) The role of a mental model in learning to operate a device   @JanSru
Initial 1-2-3 orientation
                            Website: http://shiply.com


                                           @JanSru
Continuously encouraged exploration



  Prevent errors & facilitate recovery

  Make things consistent & predictable

  Provide clear feedback for all actions

  Adapted from Jakob Nielsen’s good old list
  “Ten Usability Heuristics for User Interface Design“




                                                         @JanSru
Continuously encouraged exploration
                                 Game: Renegade Ops


                                          @JanSru
Memory and learning



   Recognition rather than Recall




                                    @JanSru
Memory and learning



   Recognition rather than Recall

                            Search




                                     @JanSru
Website: www.nationalrail.co.uk/


Recognition rather than recall                         @JanSru
Attention
Selectivity of processing




                                                                @JanSru
                            Image: www.flickr.com/photos/dante/165394424
Attention



 Limited resource

 Multi-modal

 Top-down and bottom-up activation




                                     @JanSru
Attention
Implications for design:



Let people focus on their tasks,
not on distraction presentation




                                                                          @JanSru
                              Image: www.flickr.com/photos/frankenstoen/2747513279/
Attention
Implications for design:



Use progressive disclosure
to reveal functionality and
content in a planned manner.




                               @JanSru
Images by Bill Scott: http://www.flickr.com/photos/


Progressive disclosure                               designingwebinterfaces

                                                                 @JanSru
Images by Bill Scott: http://www.flickr.com/photos/


Progressive disclosure                               designingwebinterfaces

                                                                 @JanSru
Images by Bill Scott: http://www.flickr.com/photos/


Progressive disclosure                               designingwebinterfaces

                                                                 @JanSru
Images by Bill Scott: http://www.flickr.com/photos/


Progressive disclosure                               designingwebinterfaces

                                                                 @JanSru
Images by Bill Scott: http://www.flickr.com/photos/


Progressive disclosure                               designingwebinterfaces

                                                                 @JanSru
Images by Bill Scott: http://www.flickr.com/photos/


Progressive disclosure                               designingwebinterfaces

                                                                 @JanSru
There’s more!




                @JanSru
Do old guidelines still work?




                     Guys, I wrote
                     this stuff for
                     you in 1990!




                                      @JanSru
Human mind hasn’t
changed much over
the last 10,000 years




                                                                @JanSru
                        Image: www.flickr.com/photos/lord-jim/2245362817/
Photo: http://www.flickr.com/photos/lapolab/5140120870/




Thank you!




                                                          @JanSru
Want to know more?




                     @JanSru
What Cognitive Psychology
principles do you find most
useful in your jobs?




                               Thanks	

                              @JanSru	


                                      @JanSru

More Related Content

Similar to Small CogPsy for Big Interaction Design - UX Cambridge 2012

Problem solving with agile UX
Problem solving with agile UXProblem solving with agile UX
Problem solving with agile UXEd Wong
 
Brain secrets every UXer needs to know
Brain secrets every UXer needs to knowBrain secrets every UXer needs to know
Brain secrets every UXer needs to knowJohn Whalen
 
Where The Action Is In Psychology
Where The Action Is In PsychologyWhere The Action Is In Psychology
Where The Action Is In PsychologyJ S
 
ACI Creativity and Design 2014 Day 2
ACI Creativity and Design 2014 Day 2ACI Creativity and Design 2014 Day 2
ACI Creativity and Design 2014 Day 2R. Sosa
 
Ux bootcamp small
Ux bootcamp smallUx bootcamp small
Ux bootcamp smallFrank Kloos
 
The Journey is the Interface - Designing Ecosystems in the Internet of Things 
The Journey is the Interface - Designing Ecosystems in the Internet of Things The Journey is the Interface - Designing Ecosystems in the Internet of Things 
The Journey is the Interface - Designing Ecosystems in the Internet of Things Jason Snook, PhD
 
Designing with Empathy [Breaking Development Orlando 2013]
Designing with Empathy [Breaking Development Orlando 2013]Designing with Empathy [Breaking Development Orlando 2013]
Designing with Empathy [Breaking Development Orlando 2013]Aaron Gustafson
 
CWC Social Story Business & You Web 2.0
CWC Social Story Business & You Web 2.0CWC Social Story Business & You Web 2.0
CWC Social Story Business & You Web 2.0Siobhan O'Flynn
 
Why Recall Must Die - Capturing the Point of Emotion
Why Recall Must Die - Capturing the Point of EmotionWhy Recall Must Die - Capturing the Point of Emotion
Why Recall Must Die - Capturing the Point of EmotionQuestionPro
 
Designing for Immersive Worlds: Enhancing Experience to Accelerate Learning
Designing for Immersive Worlds: Enhancing Experience to Accelerate LearningDesigning for Immersive Worlds: Enhancing Experience to Accelerate Learning
Designing for Immersive Worlds: Enhancing Experience to Accelerate LearningNiki Lambropoulos PhD
 
Digital Ethnography For Social Interaction Design [Remix]
Digital Ethnography For Social Interaction Design [Remix]Digital Ethnography For Social Interaction Design [Remix]
Digital Ethnography For Social Interaction Design [Remix]Brynn Evans
 
Lesson 4 visions of the future 1 - v2
Lesson 4   visions of the future 1 - v2Lesson 4   visions of the future 1 - v2
Lesson 4 visions of the future 1 - v2Boojie Cowell
 
NTRLS June08
NTRLS June08NTRLS June08
NTRLS June08hblowers
 
The Very Heart of It. Keynote at Urban Libraries Unite (ULU) Conference
The Very Heart of It.  Keynote at Urban Libraries Unite (ULU) ConferenceThe Very Heart of It.  Keynote at Urban Libraries Unite (ULU) Conference
The Very Heart of It. Keynote at Urban Libraries Unite (ULU) ConferencePeter Bromberg
 

Similar to Small CogPsy for Big Interaction Design - UX Cambridge 2012 (20)

Problem solving with agile UX
Problem solving with agile UXProblem solving with agile UX
Problem solving with agile UX
 
Story toy
Story toyStory toy
Story toy
 
Tippen. Klicken. Gestikulieren
Tippen. Klicken. GestikulierenTippen. Klicken. Gestikulieren
Tippen. Klicken. Gestikulieren
 
Information Literacy Intro Powerpoint Vs2
Information Literacy Intro Powerpoint Vs2Information Literacy Intro Powerpoint Vs2
Information Literacy Intro Powerpoint Vs2
 
Digital Brains
Digital BrainsDigital Brains
Digital Brains
 
Brain secrets every UXer needs to know
Brain secrets every UXer needs to knowBrain secrets every UXer needs to know
Brain secrets every UXer needs to know
 
Where The Action Is In Psychology
Where The Action Is In PsychologyWhere The Action Is In Psychology
Where The Action Is In Psychology
 
ACI Creativity and Design 2014 Day 2
ACI Creativity and Design 2014 Day 2ACI Creativity and Design 2014 Day 2
ACI Creativity and Design 2014 Day 2
 
Ux bootcamp small
Ux bootcamp smallUx bootcamp small
Ux bootcamp small
 
The Journey is the Interface - Designing Ecosystems in the Internet of Things 
The Journey is the Interface - Designing Ecosystems in the Internet of Things The Journey is the Interface - Designing Ecosystems in the Internet of Things 
The Journey is the Interface - Designing Ecosystems in the Internet of Things 
 
Designing with Empathy [Breaking Development Orlando 2013]
Designing with Empathy [Breaking Development Orlando 2013]Designing with Empathy [Breaking Development Orlando 2013]
Designing with Empathy [Breaking Development Orlando 2013]
 
CWC Social Story Business & You Web 2.0
CWC Social Story Business & You Web 2.0CWC Social Story Business & You Web 2.0
CWC Social Story Business & You Web 2.0
 
Why Recall Must Die - Capturing the Point of Emotion
Why Recall Must Die - Capturing the Point of EmotionWhy Recall Must Die - Capturing the Point of Emotion
Why Recall Must Die - Capturing the Point of Emotion
 
Designing for Immersive Worlds: Enhancing Experience to Accelerate Learning
Designing for Immersive Worlds: Enhancing Experience to Accelerate LearningDesigning for Immersive Worlds: Enhancing Experience to Accelerate Learning
Designing for Immersive Worlds: Enhancing Experience to Accelerate Learning
 
ICOT 2013
ICOT 2013ICOT 2013
ICOT 2013
 
Digital Ethnography For Social Interaction Design [Remix]
Digital Ethnography For Social Interaction Design [Remix]Digital Ethnography For Social Interaction Design [Remix]
Digital Ethnography For Social Interaction Design [Remix]
 
Lesson 4 visions of the future 1 - v2
Lesson 4   visions of the future 1 - v2Lesson 4   visions of the future 1 - v2
Lesson 4 visions of the future 1 - v2
 
Digital movie making4
Digital movie making4Digital movie making4
Digital movie making4
 
NTRLS June08
NTRLS June08NTRLS June08
NTRLS June08
 
The Very Heart of It. Keynote at Urban Libraries Unite (ULU) Conference
The Very Heart of It.  Keynote at Urban Libraries Unite (ULU) ConferenceThe Very Heart of It.  Keynote at Urban Libraries Unite (ULU) Conference
The Very Heart of It. Keynote at Urban Libraries Unite (ULU) Conference
 

Recently uploaded

Create Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comCreate Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comjakyjhon00
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazineRivanEleraki
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Ted Drake
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsBlock Party
 
UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024mikailaoh
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Amil baba
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfsaidbilgen
 
How to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTHow to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTThink 360 Studio
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxSamKuruvilla5
 
Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...khushisharma298853
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxHasan S
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxb2kshani34
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLkenzukiri
 
Construction Documents Checklist before Construction
Construction Documents Checklist before ConstructionConstruction Documents Checklist before Construction
Construction Documents Checklist before ConstructionResDraft
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfHctorFranciscoSnchez1
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Ed Orozco
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillCre8iveskill
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtTeeFusion
 
The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024Alan Dix
 

Recently uploaded (19)

Create Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comCreate Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.com
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazine
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teams
 
UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
 
How to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTHow to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPT
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptx
 
Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptx
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
 
Construction Documents Checklist before Construction
Construction Documents Checklist before ConstructionConstruction Documents Checklist before Construction
Construction Documents Checklist before Construction
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdf
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkill
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy Shirt
 
The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024
 

Small CogPsy for Big Interaction Design - UX Cambridge 2012