SlideShare ist ein Scribd-Unternehmen logo
1 von 18
Welcome to Visual Design Effective User Interface Design Guideline By Xiaoying Zhang
[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Overview
[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Background
[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Visible Language (1)
[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Visible Language (2)
[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Heuristics and Principle (1)
[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Heuristics and Principle (2)
[object Object],[object Object],[object Object],[object Object],User Interface Design Considerations
[object Object],Layer and Style Design (1) Figure 1: Simple interface data representation
Layer and Style Design (2) Figure 2: Real interface with simple layer example
[object Object],Layer and Style Design (3) Figure 3: Multi-layer interface data representation
[object Object],Layer and Style Design (4) ,[object Object]
[object Object],Layer and Style Design (5) ,[object Object]
[object Object],[object Object],Layer and Style Design (6) Figure 6:  Real interface with expending Multi-layer example
[object Object],[object Object],[object Object],[object Object],Colour Design Figure 7:  Colour wheel, Primary Colour and Secondary Colour
[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],General Usability & Testing (1)
[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],General Usability & Testing (2)
[object Object],[object Object],[object Object],[object Object],Conclusion

Weitere ähnliche Inhalte

Was ist angesagt?

User Interface Design in Software Engineering SE15
User Interface Design in Software Engineering SE15User Interface Design in Software Engineering SE15
User Interface Design in Software Engineering SE15
koolkampus
 
Graphical user interface of web form
Graphical user interface of web formGraphical user interface of web form
Graphical user interface of web form
mentorrbuddy
 
dmedia DP2 Interaction Design - Deliverable 2
dmedia DP2 Interaction Design - Deliverable 2dmedia DP2 Interaction Design - Deliverable 2
dmedia DP2 Interaction Design - Deliverable 2
Stanford dmedia
 
16 user interfacedesign
16 user interfacedesign16 user interfacedesign
16 user interfacedesign
randhirlpu
 
الوحدة الثالثة :: مادة مهارات حاسوب
الوحدة الثالثة :: مادة مهارات حاسوبالوحدة الثالثة :: مادة مهارات حاسوب
الوحدة الثالثة :: مادة مهارات حاسوب
Hossam Ashi
 

Was ist angesagt? (20)

Ch11
Ch11Ch11
Ch11
 
User interface-design
User interface-designUser interface-design
User interface-design
 
User Interface Design in Software Engineering SE15
User Interface Design in Software Engineering SE15User Interface Design in Software Engineering SE15
User Interface Design in Software Engineering SE15
 
User Interface Design
User Interface DesignUser Interface Design
User Interface Design
 
Graphical user interface of web form
Graphical user interface of web formGraphical user interface of web form
Graphical user interface of web form
 
Ux design-fundamentals
Ux design-fundamentalsUx design-fundamentals
Ux design-fundamentals
 
Chapter 12 user interface design
Chapter 12 user interface designChapter 12 user interface design
Chapter 12 user interface design
 
Model-driven engineering of user interfaces
Model-driven engineering of user interfacesModel-driven engineering of user interfaces
Model-driven engineering of user interfaces
 
golden rules of user interface design
golden rules of user interface designgolden rules of user interface design
golden rules of user interface design
 
Graphical user-interface
Graphical user-interfaceGraphical user-interface
Graphical user-interface
 
HCI - Chapter 6
HCI - Chapter 6HCI - Chapter 6
HCI - Chapter 6
 
dmedia DP2 Interaction Design - Deliverable 2
dmedia DP2 Interaction Design - Deliverable 2dmedia DP2 Interaction Design - Deliverable 2
dmedia DP2 Interaction Design - Deliverable 2
 
Hci activity#3
Hci activity#3Hci activity#3
Hci activity#3
 
Designing With User In Mind
Designing With User In MindDesigning With User In Mind
Designing With User In Mind
 
Desenho De Interfaces Joao Jose Saraiva Da Fonseca
Desenho De Interfaces Joao Jose Saraiva Da FonsecaDesenho De Interfaces Joao Jose Saraiva Da Fonseca
Desenho De Interfaces Joao Jose Saraiva Da Fonseca
 
16 user interfacedesign
16 user interfacedesign16 user interfacedesign
16 user interfacedesign
 
interaction norman model in Human Computer Interaction(HCI)
interaction  norman model in Human Computer Interaction(HCI)interaction  norman model in Human Computer Interaction(HCI)
interaction norman model in Human Computer Interaction(HCI)
 
Principles Of Good Screen Design
Principles Of Good Screen DesignPrinciples Of Good Screen Design
Principles Of Good Screen Design
 
UI UX introduction
UI UX introductionUI UX introduction
UI UX introduction
 
الوحدة الثالثة :: مادة مهارات حاسوب
الوحدة الثالثة :: مادة مهارات حاسوبالوحدة الثالثة :: مادة مهارات حاسوب
الوحدة الثالثة :: مادة مهارات حاسوب
 

Ähnlich wie Edge903 Project

What Is Interaction Design
What Is Interaction DesignWhat Is Interaction Design
What Is Interaction Design
Graeme Smith
 
User Interface Design
User Interface DesignUser Interface Design
User Interface Design
Jason Hando
 
The User Interface-Introduction .ppt
The User Interface-Introduction .pptThe User Interface-Introduction .ppt
The User Interface-Introduction .ppt
ssuserb7947f
 

Ähnlich wie Edge903 Project (20)

UI.docx
UI.docxUI.docx
UI.docx
 
UI.docx
UI.docxUI.docx
UI.docx
 
What Is Interaction Design
What Is Interaction DesignWhat Is Interaction Design
What Is Interaction Design
 
Ni week 2018_ux_lab_viewcandothat
Ni week 2018_ux_lab_viewcandothatNi week 2018_ux_lab_viewcandothat
Ni week 2018_ux_lab_viewcandothat
 
UX-Driven & Inclusive Data Visualizations
UX-Driven & Inclusive Data VisualizationsUX-Driven & Inclusive Data Visualizations
UX-Driven & Inclusive Data Visualizations
 
Designing | Multimedia Systems
Designing | Multimedia SystemsDesigning | Multimedia Systems
Designing | Multimedia Systems
 
Usability principles 1
Usability principles 1Usability principles 1
Usability principles 1
 
Introduction To Usability
Introduction To UsabilityIntroduction To Usability
Introduction To Usability
 
UI/UX Design
UI/UX DesignUI/UX Design
UI/UX Design
 
User Interface Design
User Interface DesignUser Interface Design
User Interface Design
 
The User Interface-Introduction .ppt
The User Interface-Introduction .pptThe User Interface-Introduction .ppt
The User Interface-Introduction .ppt
 
The User Interface-Introduction .ppt
The User Interface-Introduction .pptThe User Interface-Introduction .ppt
The User Interface-Introduction .ppt
 
Interface Design
Interface DesignInterface Design
Interface Design
 
User Interface Analysis and Design
User Interface Analysis and DesignUser Interface Analysis and Design
User Interface Analysis and Design
 
Professional ui for a website design
Professional ui for a website designProfessional ui for a website design
Professional ui for a website design
 
POLITEKNIK MALAYSIA
POLITEKNIK MALAYSIAPOLITEKNIK MALAYSIA
POLITEKNIK MALAYSIA
 
Topic 3 Human Computer Interaction
Topic 3 Human Computer InteractionTopic 3 Human Computer Interaction
Topic 3 Human Computer Interaction
 
Slides chapter 12
Slides chapter 12Slides chapter 12
Slides chapter 12
 
Game interface design part 1
Game interface design part 1Game interface design part 1
Game interface design part 1
 
GUI & Modern UI Design
GUI & Modern UI DesignGUI & Modern UI Design
GUI & Modern UI Design
 

Kürzlich hochgeladen

Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Victor Rentea
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Safe Software
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Victor Rentea
 

Kürzlich hochgeladen (20)

ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challenges
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
 
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusExploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with Milvus
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdfRising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
 
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
Six Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal OntologySix Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal Ontology
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
 
MS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectorsMS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectors
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
 
Understanding the FAA Part 107 License ..
Understanding the FAA Part 107 License ..Understanding the FAA Part 107 License ..
Understanding the FAA Part 107 License ..
 

Edge903 Project

  • 1. Welcome to Visual Design Effective User Interface Design Guideline By Xiaoying Zhang
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10. Layer and Style Design (2) Figure 2: Real interface with simple layer example
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.