SlideShare a Scribd company logo
Good/ Bad Design
322131 Human Computer Interaction
Department of Computer Science ,
Faculty of Science Khon Kaen University
HCI-2556

1
จุดประสงคการเรียนรู : !
1. เพื่อการสำรวจและวิเคราะหการออกแบบจากการออกแบบที่ไมดี!
2. เพื่อการอภิปรายการวิเคราะหการออกแบบที่ไมดีไมเหมาะสม!

HCI-2556

2
HCI-2556

3
design-for-india.blogspot.com

HCI-2556

4
HCI-2556

5
Example1 	
Elevator controls and labels on the bottom row all look the same, so
it is easy to push a label by mistake instead of a control button

People do not make same mistake for the labels and buttons on
the top row.
http://www.baddesigns.com/examples.html
HCI-2556

6
Example2 	

www.cooperhewitt.org

HCI-2556

7
คำสั่งกิจกรรม : ใหนักศึกษาศึกษางานออกแบบสิ่งของ Bad/Good
Design โดยใหเหตุผลประกอบทำไมจึงคิดเชนนั้น และอภิปรายนำเสนอ
ในชั่วโมง@

จากแหลงขอมูล!

http://www.baddesigns.com/examples.html

HCI-2556

8

More Related Content

What's hot

USER INTERFACE DESIGN PPT
USER INTERFACE DESIGN PPTUSER INTERFACE DESIGN PPT
USER INTERFACE DESIGN PPTvicci4041
 
User Interface Design
User Interface DesignUser Interface Design
User Interface DesignJReifman
 
HCI 3e - Ch 12: Cognitive models
HCI 3e - Ch 12:  Cognitive modelsHCI 3e - Ch 12:  Cognitive models
HCI 3e - Ch 12: Cognitive modelsAlan Dix
 
User Interface Analysis and Design
User Interface Analysis and DesignUser Interface Analysis and Design
User Interface Analysis and Design Saqib Raza
 
Introduction to Interaction Design
Introduction to Interaction DesignIntroduction to Interaction Design
Introduction to Interaction DesignMark Billinghurst
 
Human computer interaction -Input output channel with Scenario
Human computer interaction -Input output channel with ScenarioHuman computer interaction -Input output channel with Scenario
Human computer interaction -Input output channel with ScenarioN.Jagadish Kumar
 
Low-fidelity Prototyping
Low-fidelity PrototypingLow-fidelity Prototyping
Low-fidelity PrototypingHans Põldoja
 
evaluation techniques in HCI
evaluation techniques in HCIevaluation techniques in HCI
evaluation techniques in HCIsawsan slii
 
Mobile Information Architecture
Mobile Information ArchitectureMobile Information Architecture
Mobile Information ArchitectureChristian Crumlish
 
Human computer interaction-Memory, Reasoning and Problem solving
Human computer interaction-Memory, Reasoning and Problem solvingHuman computer interaction-Memory, Reasoning and Problem solving
Human computer interaction-Memory, Reasoning and Problem solvingN.Jagadish Kumar
 
Chapter 01 software engineering pressman
Chapter 01  software engineering pressmanChapter 01  software engineering pressman
Chapter 01 software engineering pressmanRohitGoyal183
 
Usability engineering Usability testing
Usability engineering Usability testingUsability engineering Usability testing
Usability engineering Usability testingREHMAT ULLAH
 
The benefits of software reuse
The benefits of software reuseThe benefits of software reuse
The benefits of software reuseEntando
 

What's hot (20)

HCI Basics
HCI BasicsHCI Basics
HCI Basics
 
USER INTERFACE DESIGN PPT
USER INTERFACE DESIGN PPTUSER INTERFACE DESIGN PPT
USER INTERFACE DESIGN PPT
 
User Interface Design
User Interface DesignUser Interface Design
User Interface Design
 
HCI 3e - Ch 12: Cognitive models
HCI 3e - Ch 12:  Cognitive modelsHCI 3e - Ch 12:  Cognitive models
HCI 3e - Ch 12: Cognitive models
 
Chapter1(hci)
Chapter1(hci)Chapter1(hci)
Chapter1(hci)
 
Prototyping
PrototypingPrototyping
Prototyping
 
User interface design
User interface designUser interface design
User interface design
 
User Interface Analysis and Design
User Interface Analysis and DesignUser Interface Analysis and Design
User Interface Analysis and Design
 
UX Bootcamp
UX BootcampUX Bootcamp
UX Bootcamp
 
Unit2 hci
Unit2 hciUnit2 hci
Unit2 hci
 
Introduction to Interaction Design
Introduction to Interaction DesignIntroduction to Interaction Design
Introduction to Interaction Design
 
Human computer interaction -Input output channel with Scenario
Human computer interaction -Input output channel with ScenarioHuman computer interaction -Input output channel with Scenario
Human computer interaction -Input output channel with Scenario
 
HCI Presentation
HCI PresentationHCI Presentation
HCI Presentation
 
Low-fidelity Prototyping
Low-fidelity PrototypingLow-fidelity Prototyping
Low-fidelity Prototyping
 
evaluation techniques in HCI
evaluation techniques in HCIevaluation techniques in HCI
evaluation techniques in HCI
 
Mobile Information Architecture
Mobile Information ArchitectureMobile Information Architecture
Mobile Information Architecture
 
Human computer interaction-Memory, Reasoning and Problem solving
Human computer interaction-Memory, Reasoning and Problem solvingHuman computer interaction-Memory, Reasoning and Problem solving
Human computer interaction-Memory, Reasoning and Problem solving
 
Chapter 01 software engineering pressman
Chapter 01  software engineering pressmanChapter 01  software engineering pressman
Chapter 01 software engineering pressman
 
Usability engineering Usability testing
Usability engineering Usability testingUsability engineering Usability testing
Usability engineering Usability testing
 
The benefits of software reuse
The benefits of software reuseThe benefits of software reuse
The benefits of software reuse
 

Viewers also liked

Bad design
Bad designBad design
Bad designaukee
 
Bad UI design Example
Bad UI design ExampleBad UI design Example
Bad UI design ExampleAAshish Ojha
 
Usability & Design Principles
Usability & Design PrinciplesUsability & Design Principles
Usability & Design PrinciplesClaus Medvesek
 
Lecture 3: Human-Computer Interaction: HCI Design (2014)
Lecture 3: Human-Computer Interaction: HCI Design (2014)Lecture 3: Human-Computer Interaction: HCI Design (2014)
Lecture 3: Human-Computer Interaction: HCI Design (2014)Lora Aroyo
 
The Principles of Good Design
The Principles of Good DesignThe Principles of Good Design
The Principles of Good DesignJennifer Janviere
 
Design Principles
Design PrinciplesDesign Principles
Design PrinciplesDavid Gelb
 
Design Theory - Lecture 01: What is design?
Design Theory - Lecture 01: What is design?Design Theory - Lecture 01: What is design?
Design Theory - Lecture 01: What is design?Bas Leurs
 

Viewers also liked (7)

Bad design
Bad designBad design
Bad design
 
Bad UI design Example
Bad UI design ExampleBad UI design Example
Bad UI design Example
 
Usability & Design Principles
Usability & Design PrinciplesUsability & Design Principles
Usability & Design Principles
 
Lecture 3: Human-Computer Interaction: HCI Design (2014)
Lecture 3: Human-Computer Interaction: HCI Design (2014)Lecture 3: Human-Computer Interaction: HCI Design (2014)
Lecture 3: Human-Computer Interaction: HCI Design (2014)
 
The Principles of Good Design
The Principles of Good DesignThe Principles of Good Design
The Principles of Good Design
 
Design Principles
Design PrinciplesDesign Principles
Design Principles
 
Design Theory - Lecture 01: What is design?
Design Theory - Lecture 01: What is design?Design Theory - Lecture 01: What is design?
Design Theory - Lecture 01: What is design?
 

More from Yaowaluck Promdee (20)

A basic of UX for beginner
A basic of UX for beginnerA basic of UX for beginner
A basic of UX for beginner
 
TCAS 2563
TCAS 2563TCAS 2563
TCAS 2563
 
Portfolio design
Portfolio designPortfolio design
Portfolio design
 
Concept to creation story and storyboard
Concept to creation  story and storyboard Concept to creation  story and storyboard
Concept to creation story and storyboard
 
Observation and interviewing
Observation and interviewingObservation and interviewing
Observation and interviewing
 
Requirement gathering-and-lean-canvas
Requirement gathering-and-lean-canvasRequirement gathering-and-lean-canvas
Requirement gathering-and-lean-canvas
 
Bootstrap Framework
Bootstrap Framework Bootstrap Framework
Bootstrap Framework
 
Tables and forms with HTML, CSS
Tables and forms with HTML, CSS  Tables and forms with HTML, CSS
Tables and forms with HTML, CSS
 
Navigation and Link
Navigation and LinkNavigation and Link
Navigation and Link
 
Graphic, Color and tools
Graphic, Color and toolsGraphic, Color and tools
Graphic, Color and tools
 
Page layouts flexible and fixed layout with CSS
Page layouts flexible and fixed layout with CSSPage layouts flexible and fixed layout with CSS
Page layouts flexible and fixed layout with CSS
 
CSS Boc model
CSS Boc model CSS Boc model
CSS Boc model
 
CSS Font & Text style
CSS Font & Text style CSS Font & Text style
CSS Font & Text style
 
Style and Selector Part2
Style and Selector Part2Style and Selector Part2
Style and Selector Part2
 
Style and Selector
Style and SelectorStyle and Selector
Style and Selector
 
Design sitemap
Design sitemapDesign sitemap
Design sitemap
 
Good/Bad Web Design
Good/Bad Web DesignGood/Bad Web Design
Good/Bad Web Design
 
HTML 5
HTML 5HTML 5
HTML 5
 
Overview HTML, HTML5 and Validations
Overview HTML, HTML5 and Validations Overview HTML, HTML5 and Validations
Overview HTML, HTML5 and Validations
 
Web Interface
Web InterfaceWeb Interface
Web Interface
 

Good/Bad design