SlideShare a Scribd company logo
Interface Design
Research Methodology
By Yaowaluck Promdee and Sumonta Kasemvilas Ph.D
Good & Bad design

[1]

•

The Good and Bad About Design Inspiration [2]

•

Good design makes companies. Bad Design can
make plenty of money. Great Design builds
legacies, cultures and communities. [3]
Photo [1]tya.com.sg [2] blog.teamtreehouse.com[3]www.raphkoster.com
Interface Design is a ?
User Interface
•

User interface design (UID) or user interface
engineering is the design of websites, computers,
appliances, machines, mobile communication
devices, and software applications with the focus
on the user's experience and interaction. [4]

[4] http://en.wikipedia.org/wiki/User_interface_design
The Elements of Design
	 1. Simplicity

2. Consistency

3. Identity

4. Useful Content

5. User-Friendly Navigation

6. Visual Appeal

7. Compatibility

8. Design Stability

9. Function Stability
Simplicity
{

Consistency
Identity
Useful Content
User-Friendly Navigation
Visual Appeal
Compatibility
Design Function Stability Interface Design
Sketch Design
Layout
Color
Example
Assignment
•

Design your web, mobile interfaces eCommerce
>= 4 pages and write your concept 

Example 

1. Home 2. Catalogs 3. Product 4. Contact

•

Prints your work send to Room 6209C

•

Deadline: 09.00 A.M.- 05.00 P.M 27/01/2014

More Related Content

Similar to Interface design

Prototyping is the panacea
Prototyping is the panaceaPrototyping is the panacea
Prototyping is the panaceaMichael Meikson
 
Web Layout Mining - JECS 29(2)
Web Layout Mining - JECS 29(2)Web Layout Mining - JECS 29(2)
Web Layout Mining - JECS 29(2)IT Industry
 
Best ui ux design agency
Best ui ux design agencyBest ui ux design agency
Best ui ux design agencyBluebash
 
Designer vs Developer
Designer vs DeveloperDesigner vs Developer
Designer vs DeveloperBryan Gulley
 
User Centered Design
User Centered DesignUser Centered Design
User Centered DesignShawn Calvert
 
Web Layout Generation (IC-SCCE 2006)
Web Layout Generation (IC-SCCE 2006)Web Layout Generation (IC-SCCE 2006)
Web Layout Generation (IC-SCCE 2006)IT Industry
 
Web Design: Crafting Digital Experiences
Web Design: Crafting Digital ExperiencesWeb Design: Crafting Digital Experiences
Web Design: Crafting Digital Experiencessurajmaurya260064
 
Creative/UX Director cv 2016
Creative/UX Director cv 2016Creative/UX Director cv 2016
Creative/UX Director cv 2016Dave Landis
 
Designer vs Developer - A Battle Royal v1.0
Designer vs Developer - A Battle Royal v1.0Designer vs Developer - A Battle Royal v1.0
Designer vs Developer - A Battle Royal v1.0Nicole Maynard
 
What I've Learned about UX Design
What I've Learned about UX DesignWhat I've Learned about UX Design
What I've Learned about UX DesignAli Rushdan Tariq
 
24 Hours of UX, 2023: Preventing the Future
24 Hours of UX, 2023: Preventing the Future24 Hours of UX, 2023: Preventing the Future
24 Hours of UX, 2023: Preventing the FutureJoshua Randall
 
digital marketing[1].pdf
digital marketing[1].pdfdigital marketing[1].pdf
digital marketing[1].pdfTECHCENTRAL3
 
Best Practices for Improving User Interface Design
Best Practices for Improving User Interface DesignBest Practices for Improving User Interface Design
Best Practices for Improving User Interface Designijseajournal
 
BEST PRACTICES FOR IMPROVING USER INTERFACE DESIGN
BEST PRACTICES FOR IMPROVING USER INTERFACE DESIGN BEST PRACTICES FOR IMPROVING USER INTERFACE DESIGN
BEST PRACTICES FOR IMPROVING USER INTERFACE DESIGN ijseajournal
 
UXcellence: The Importance Of Human-Centered Design
UXcellence: The Importance Of Human-Centered DesignUXcellence: The Importance Of Human-Centered Design
UXcellence: The Importance Of Human-Centered DesignMike Townson
 
Intelligent Design - Transitioning UX into UI
Intelligent Design - Transitioning UX into UI Intelligent Design - Transitioning UX into UI
Intelligent Design - Transitioning UX into UI Michelle Reyes
 

Similar to Interface design (20)

GUI Web Designs
GUI Web DesignsGUI Web Designs
GUI Web Designs
 
Prototyping is the panacea
Prototyping is the panaceaPrototyping is the panacea
Prototyping is the panacea
 
Web Layout Mining - JECS 29(2)
Web Layout Mining - JECS 29(2)Web Layout Mining - JECS 29(2)
Web Layout Mining - JECS 29(2)
 
Desain Grafis 4 - UI/UX
Desain Grafis 4 - UI/UXDesain Grafis 4 - UI/UX
Desain Grafis 4 - UI/UX
 
Best ui ux design agency
Best ui ux design agencyBest ui ux design agency
Best ui ux design agency
 
Designer vs Developer
Designer vs DeveloperDesigner vs Developer
Designer vs Developer
 
User Centered Design
User Centered DesignUser Centered Design
User Centered Design
 
Web Layout Generation (IC-SCCE 2006)
Web Layout Generation (IC-SCCE 2006)Web Layout Generation (IC-SCCE 2006)
Web Layout Generation (IC-SCCE 2006)
 
Intro to UIUX.pptx
Intro to UIUX.pptxIntro to UIUX.pptx
Intro to UIUX.pptx
 
Web Design: Crafting Digital Experiences
Web Design: Crafting Digital ExperiencesWeb Design: Crafting Digital Experiences
Web Design: Crafting Digital Experiences
 
Creative/UX Director cv 2016
Creative/UX Director cv 2016Creative/UX Director cv 2016
Creative/UX Director cv 2016
 
Designer vs Developer - A Battle Royal v1.0
Designer vs Developer - A Battle Royal v1.0Designer vs Developer - A Battle Royal v1.0
Designer vs Developer - A Battle Royal v1.0
 
What I've Learned about UX Design
What I've Learned about UX DesignWhat I've Learned about UX Design
What I've Learned about UX Design
 
24 Hours of UX, 2023: Preventing the Future
24 Hours of UX, 2023: Preventing the Future24 Hours of UX, 2023: Preventing the Future
24 Hours of UX, 2023: Preventing the Future
 
digital marketing[1].pdf
digital marketing[1].pdfdigital marketing[1].pdf
digital marketing[1].pdf
 
Best Practices for Improving User Interface Design
Best Practices for Improving User Interface DesignBest Practices for Improving User Interface Design
Best Practices for Improving User Interface Design
 
BEST PRACTICES FOR IMPROVING USER INTERFACE DESIGN
BEST PRACTICES FOR IMPROVING USER INTERFACE DESIGN BEST PRACTICES FOR IMPROVING USER INTERFACE DESIGN
BEST PRACTICES FOR IMPROVING USER INTERFACE DESIGN
 
Chapter1(hci)
Chapter1(hci)Chapter1(hci)
Chapter1(hci)
 
UXcellence: The Importance Of Human-Centered Design
UXcellence: The Importance Of Human-Centered DesignUXcellence: The Importance Of Human-Centered Design
UXcellence: The Importance Of Human-Centered Design
 
Intelligent Design - Transitioning UX into UI
Intelligent Design - Transitioning UX into UI Intelligent Design - Transitioning UX into UI
Intelligent Design - Transitioning UX into UI
 

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
 
Good bad design
Good bad designGood bad design
Good bad design
 
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
 

Recently uploaded

Palestine last event orientationfvgnh .pptx
Palestine last event orientationfvgnh .pptxPalestine last event orientationfvgnh .pptx
Palestine last event orientationfvgnh .pptxRaedMohamed3
 
Sectors of the Indian Economy - Class 10 Study Notes pdf
Sectors of the Indian Economy - Class 10 Study Notes pdfSectors of the Indian Economy - Class 10 Study Notes pdf
Sectors of the Indian Economy - Class 10 Study Notes pdfVivekanand Anglo Vedic Academy
 
Additional Benefits for Employee Website.pdf
Additional Benefits for Employee Website.pdfAdditional Benefits for Employee Website.pdf
Additional Benefits for Employee Website.pdfjoachimlavalley1
 
Forest and Wildlife Resources Class 10 Free Study Material PDF
Forest and Wildlife Resources Class 10 Free Study Material PDFForest and Wildlife Resources Class 10 Free Study Material PDF
Forest and Wildlife Resources Class 10 Free Study Material PDFVivekanand Anglo Vedic Academy
 
PART A. Introduction to Costumer Service
PART A. Introduction to Costumer ServicePART A. Introduction to Costumer Service
PART A. Introduction to Costumer ServicePedroFerreira53928
 
50 ĐỀ LUYỆN THI IOE LỚP 9 - NĂM HỌC 2022-2023 (CÓ LINK HÌNH, FILE AUDIO VÀ ĐÁ...
50 ĐỀ LUYỆN THI IOE LỚP 9 - NĂM HỌC 2022-2023 (CÓ LINK HÌNH, FILE AUDIO VÀ ĐÁ...50 ĐỀ LUYỆN THI IOE LỚP 9 - NĂM HỌC 2022-2023 (CÓ LINK HÌNH, FILE AUDIO VÀ ĐÁ...
50 ĐỀ LUYỆN THI IOE LỚP 9 - NĂM HỌC 2022-2023 (CÓ LINK HÌNH, FILE AUDIO VÀ ĐÁ...Nguyen Thanh Tu Collection
 
Instructions for Submissions thorugh G- Classroom.pptx
Instructions for Submissions thorugh G- Classroom.pptxInstructions for Submissions thorugh G- Classroom.pptx
Instructions for Submissions thorugh G- Classroom.pptxJheel Barad
 
NLC-2024-Orientation-for-RO-SDO (1).pptx
NLC-2024-Orientation-for-RO-SDO (1).pptxNLC-2024-Orientation-for-RO-SDO (1).pptx
NLC-2024-Orientation-for-RO-SDO (1).pptxssuserbdd3e8
 
Sha'Carri Richardson Presentation 202345
Sha'Carri Richardson Presentation 202345Sha'Carri Richardson Presentation 202345
Sha'Carri Richardson Presentation 202345beazzy04
 
How to Break the cycle of negative Thoughts
How to Break the cycle of negative ThoughtsHow to Break the cycle of negative Thoughts
How to Break the cycle of negative ThoughtsCol Mukteshwar Prasad
 
Basic Civil Engineering Notes of Chapter-6, Topic- Ecosystem, Biodiversity G...
Basic Civil Engineering Notes of Chapter-6,  Topic- Ecosystem, Biodiversity G...Basic Civil Engineering Notes of Chapter-6,  Topic- Ecosystem, Biodiversity G...
Basic Civil Engineering Notes of Chapter-6, Topic- Ecosystem, Biodiversity G...Denish Jangid
 
Solid waste management & Types of Basic civil Engineering notes by DJ Sir.pptx
Solid waste management & Types of Basic civil Engineering notes by DJ Sir.pptxSolid waste management & Types of Basic civil Engineering notes by DJ Sir.pptx
Solid waste management & Types of Basic civil Engineering notes by DJ Sir.pptxDenish Jangid
 
Basic_QTL_Marker-assisted_Selection_Sourabh.ppt
Basic_QTL_Marker-assisted_Selection_Sourabh.pptBasic_QTL_Marker-assisted_Selection_Sourabh.ppt
Basic_QTL_Marker-assisted_Selection_Sourabh.pptSourabh Kumar
 
Salient features of Environment protection Act 1986.pptx
Salient features of Environment protection Act 1986.pptxSalient features of Environment protection Act 1986.pptx
Salient features of Environment protection Act 1986.pptxakshayaramakrishnan21
 
Students, digital devices and success - Andreas Schleicher - 27 May 2024..pptx
Students, digital devices and success - Andreas Schleicher - 27 May 2024..pptxStudents, digital devices and success - Andreas Schleicher - 27 May 2024..pptx
Students, digital devices and success - Andreas Schleicher - 27 May 2024..pptxEduSkills OECD
 
Synthetic Fiber Construction in lab .pptx
Synthetic Fiber Construction in lab .pptxSynthetic Fiber Construction in lab .pptx
Synthetic Fiber Construction in lab .pptxPavel ( NSTU)
 
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaasiemaillard
 
slides CapTechTalks Webinar May 2024 Alexander Perry.pptx
slides CapTechTalks Webinar May 2024 Alexander Perry.pptxslides CapTechTalks Webinar May 2024 Alexander Perry.pptx
slides CapTechTalks Webinar May 2024 Alexander Perry.pptxCapitolTechU
 

Recently uploaded (20)

Palestine last event orientationfvgnh .pptx
Palestine last event orientationfvgnh .pptxPalestine last event orientationfvgnh .pptx
Palestine last event orientationfvgnh .pptx
 
Sectors of the Indian Economy - Class 10 Study Notes pdf
Sectors of the Indian Economy - Class 10 Study Notes pdfSectors of the Indian Economy - Class 10 Study Notes pdf
Sectors of the Indian Economy - Class 10 Study Notes pdf
 
Additional Benefits for Employee Website.pdf
Additional Benefits for Employee Website.pdfAdditional Benefits for Employee Website.pdf
Additional Benefits for Employee Website.pdf
 
Forest and Wildlife Resources Class 10 Free Study Material PDF
Forest and Wildlife Resources Class 10 Free Study Material PDFForest and Wildlife Resources Class 10 Free Study Material PDF
Forest and Wildlife Resources Class 10 Free Study Material PDF
 
PART A. Introduction to Costumer Service
PART A. Introduction to Costumer ServicePART A. Introduction to Costumer Service
PART A. Introduction to Costumer Service
 
50 ĐỀ LUYỆN THI IOE LỚP 9 - NĂM HỌC 2022-2023 (CÓ LINK HÌNH, FILE AUDIO VÀ ĐÁ...
50 ĐỀ LUYỆN THI IOE LỚP 9 - NĂM HỌC 2022-2023 (CÓ LINK HÌNH, FILE AUDIO VÀ ĐÁ...50 ĐỀ LUYỆN THI IOE LỚP 9 - NĂM HỌC 2022-2023 (CÓ LINK HÌNH, FILE AUDIO VÀ ĐÁ...
50 ĐỀ LUYỆN THI IOE LỚP 9 - NĂM HỌC 2022-2023 (CÓ LINK HÌNH, FILE AUDIO VÀ ĐÁ...
 
Instructions for Submissions thorugh G- Classroom.pptx
Instructions for Submissions thorugh G- Classroom.pptxInstructions for Submissions thorugh G- Classroom.pptx
Instructions for Submissions thorugh G- Classroom.pptx
 
Introduction to Quality Improvement Essentials
Introduction to Quality Improvement EssentialsIntroduction to Quality Improvement Essentials
Introduction to Quality Improvement Essentials
 
NLC-2024-Orientation-for-RO-SDO (1).pptx
NLC-2024-Orientation-for-RO-SDO (1).pptxNLC-2024-Orientation-for-RO-SDO (1).pptx
NLC-2024-Orientation-for-RO-SDO (1).pptx
 
Sha'Carri Richardson Presentation 202345
Sha'Carri Richardson Presentation 202345Sha'Carri Richardson Presentation 202345
Sha'Carri Richardson Presentation 202345
 
How to Break the cycle of negative Thoughts
How to Break the cycle of negative ThoughtsHow to Break the cycle of negative Thoughts
How to Break the cycle of negative Thoughts
 
Basic Civil Engineering Notes of Chapter-6, Topic- Ecosystem, Biodiversity G...
Basic Civil Engineering Notes of Chapter-6,  Topic- Ecosystem, Biodiversity G...Basic Civil Engineering Notes of Chapter-6,  Topic- Ecosystem, Biodiversity G...
Basic Civil Engineering Notes of Chapter-6, Topic- Ecosystem, Biodiversity G...
 
Solid waste management & Types of Basic civil Engineering notes by DJ Sir.pptx
Solid waste management & Types of Basic civil Engineering notes by DJ Sir.pptxSolid waste management & Types of Basic civil Engineering notes by DJ Sir.pptx
Solid waste management & Types of Basic civil Engineering notes by DJ Sir.pptx
 
Basic_QTL_Marker-assisted_Selection_Sourabh.ppt
Basic_QTL_Marker-assisted_Selection_Sourabh.pptBasic_QTL_Marker-assisted_Selection_Sourabh.ppt
Basic_QTL_Marker-assisted_Selection_Sourabh.ppt
 
Salient features of Environment protection Act 1986.pptx
Salient features of Environment protection Act 1986.pptxSalient features of Environment protection Act 1986.pptx
Salient features of Environment protection Act 1986.pptx
 
Students, digital devices and success - Andreas Schleicher - 27 May 2024..pptx
Students, digital devices and success - Andreas Schleicher - 27 May 2024..pptxStudents, digital devices and success - Andreas Schleicher - 27 May 2024..pptx
Students, digital devices and success - Andreas Schleicher - 27 May 2024..pptx
 
Synthetic Fiber Construction in lab .pptx
Synthetic Fiber Construction in lab .pptxSynthetic Fiber Construction in lab .pptx
Synthetic Fiber Construction in lab .pptx
 
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
 
NCERT Solutions Power Sharing Class 10 Notes pdf
NCERT Solutions Power Sharing Class 10 Notes pdfNCERT Solutions Power Sharing Class 10 Notes pdf
NCERT Solutions Power Sharing Class 10 Notes pdf
 
slides CapTechTalks Webinar May 2024 Alexander Perry.pptx
slides CapTechTalks Webinar May 2024 Alexander Perry.pptxslides CapTechTalks Webinar May 2024 Alexander Perry.pptx
slides CapTechTalks Webinar May 2024 Alexander Perry.pptx
 

Interface design