Gui Design Taken from “Gui Bloopers” by Jeff Johnson.

Slides:



Advertisements
Similar presentations
Conform to the User’s View of the Task
Advertisements

Structured Design The Structured Design Approach (also called Layered Approach) focuses on the conceptual and physical level. As discussed earlier: Conceptual.
It will blow you away..... Click to proceed......
GUI Design Principles. User interface strongly affects perception of software – Usable software sells better – Unusable web sites are abandoned Perception.
Microsoft Access A Hands-On Introduction Chapter 4.
Agile Project Management with Scrum
Introduction To System Analysis and Design
Chapter 11 Designing Effective Output Systems Analysis and Design Kendall & Kendall Sixth Edition © 2005 Pearson Prentice Hall.
Interface Guidelines & Principles Responsiveness.
Interface Guidelines & Principles Deliver Information.
Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Fluency with Information Technology Third Edition by Lawrence Snyder Chapter.
Recall The Team Skills 1. Analyzing the Problem (with 5 steps) 1.Gain agreement on the problem definition. 2.Understand the root causes 3.Identify the.
Help and Documentation CSCI324, IACT403, IACT 931, MCS9324 Human Computer Interfaces.
1 User Interface Design CIS 375 Bruce R. Maxim UM-Dearborn.
IENG 423 Design of Decision Support Systems Modeling with Excel Excel Basics Filtering, sorting, data validation, summarizing data.
131 Agenda Overview Review Roles Lists Libraries Columns.
1. Human – the end-user of a program – the others in the organization Computer – the machine the program runs on – often split between clients & servers.
INTROSE Introduction to Software Engineering Raymund Sison, PhD College of Computer Studies De La Salle University User Interface Design.
Protection.
Agile and XP Development Dan Fleck 2008 Dan Fleck 2008.
No Teacher Left Behind Real Technology Integration Tools and Skills.
The Bean Counter: A JavaScript Program
Output and User Interface Design
GUI Bloopers Basic Principles. What is a GUI Blooper? “Bloopers” are mistakes that software developers frequently make when designing graphical user interfaces.
Chapter 2 Web Site Design Principles
Web Site Design Principles
©RavichandranUser interface Slide 1 User interface design.
Computer Graphics Lecture 28 Fasih ur Rehman. Last Class GUI Attributes – Windows, icons, menus, pointing devices, graphics Advantages Design Process.
1 CSCI E-170: L07 November 7, 2005 Sept. 28, 2004.
SWE205 Review Spring Why is software unusable? Users are no longer trained. Why? Feature creep Inherently hard: a problem of communication Designed.
Presentation by Dianne Smith, MJE. Something went wrong In jet crash, expert says.
COSC 3461: Module 6 UI Design in the Workplace. 2 What is User-Centered Design? Three major components: –Iterative design –Early focus on users and tasks.
Putting together a complete system Chapter 10. Overview  Design a modest but complete system  A collection of objects work together to solve a problem.
Detailed design – class design Domain Modeling SE-2030 Dr. Rob Hasker 1 Based on slides written by Dr. Mark L. Hornick Used with permission.
1 CSCI E-170: L01 February 2, Lecture Plan Introduction to this class Introduction to usability GUI usability: Design Process, Principles & Bloopers.
Object-Oriented Software Engineering Practical Software Development using UML and Java Chapter 7: Focusing on Users and Their Tasks.
Introduction To System Analysis and Design
Use cases - a waste of time? Søren Lauesen, Februar 2010 IT-University of Copenhagen
1 CMPT 275 Software Engineering Requirements Gathering Activity Janice Regan,
Key Applications Module Lesson 21 — Access Essentials
Chapter 11 Designing Effective Output
1 NORMA Lab. 5 Duplicating Object Type and Predicate Shapes Finding Displayed Shapes Using the Diagram Spy Using Multiple Windows Using the Context Window.
1 3132/3192 User Accessibility © University of Stirling /3192 User Accessibility 2.
Intermediate 2 Software Development Process. Software You should already know that any computer system is made up of hardware and software. The term hardware.
Chapter 2 Web Site Design Principles Principles of Web Design, 4 th Edition.
1 CSC111H User Interface Design Dennis Burford
Interface Guidelines & Principles Responsiveness.
Deliver Information, not Just Data Design displays carefully –Visual order and user focus (control contrast) –Match the medium (mixed metaphors) –Attention.
Input Design Lecture 11 1 BTEC HNC Systems Support Castle College 2007/8.
MEMBERSHIP AND IDENTITY Active server pages (ASP.NET) 1 Chapter-4.
Yonglei Tao School of Computing & Info Systems GVSU Ch 7 Design Guidelines.
Smart Home Technologies
Interacting with consumer Software Engineering. So far… What is Software Engineering? Different software process models waterfall, incremental, spiral.
Company LOGO Revised and Presented by Rob Coffman, CGMP and Patty Barron, CGMP Welcome To the 2015 Chapter Presidents’ Training Minneapolis – April 28,
Object-Oriented Software Engineering Practical Software Development using UML and Java Chapter 7: Focusing on Users and Their Tasks.
Interface Guidelines & Principles Conform to the User’s View of the Task.
[The Design of Everyday Things, Don Norman, Ch 7]
Chapter 2 Web Site Design Principles
Chapter 14: System Protection
Analyzing Data with Excel
Human Factors Issues Chapter 8 Paul King.
Information System Design Info-440
Introduction UI designer stands for User Interface designer. UI designing is a type of process that is used for making interfaces in the software or the.
Chapter 14: Protection.
Norman 7 A: User-Centered Design
GRAPHICAL USER INTERFACE GITAM GADTAULA. OVERVIEW What is Human Computer Interface (User Interface) principles of user interface design What makes a good.
GRAPHICAL USER INTERFACE GITAM GADTAULA KATHMANDU UNIVERSITY CLASS PRESENTATION.
User-Centered Design Data Entry CS 4640 Programming Languages for Web Applications [The Design of Everyday Things, Don Norman, Ch 7]
User-Centered Design Data Entry CS 4640 Programming Languages for Web Applications [The Design of Everyday Things, Don Norman, Ch 7]
Presentation transcript:

Gui Design Taken from “Gui Bloopers” by Jeff Johnson

First Principles 1. Focus on the users and their tasks, not the technology. 2. Consider function first, presentation later. 3. Conform to the users’ view of the task. 4. Don’t complicate the user’s task. 5. Promote learning. 6. Deliver information, not just data. 7. Design for responsiveness. 8. Try it out on users, then fix it!

1.Focus on the users Answer the following Questions. For whom is this product or service being designed? Who are the intended customers? Who are the intended users? Are the customers and the users the same people? What is the product or service for? What activity is it intended to support? What problems will it help users solve? What value will it provide?

More Questions What problems do the intended users have now? What do they like and disklike about the way they work now? What are the skills and knowledge of the intended users? Are they motivated to learn? How? How do users conceptualize and work with the data in their task domain?

And more What are the intended users’ preferred ways of working? How will the product or service fit into those ways? How will it change them?

Users Software should be designed neither FOR users nor BY them, but rather WITH them.

2. Consider Function First This does NOT mean “Get the functionality designed and implemented first, and worry about the user interface later.” It means consider the purpose, structure, and function of the user interface – and of the software as a whole – before considering the presentation – the surface appearance – of the user interface. The word “function” here does not mean implementation, it means “role” – what does it do?

KISS Keep It Simple Stupid Keep it as simple as possible, but no simpler.

3. Conform to the user’s view Don’t make users commit unnatural acts. –Steps users have to perform to get what they want that have no obvious connection to their goal. –Imposing arbitrary restrictions Limiting person’s name to 16 characters Allowing table rows to be sorted by at most three columns Providing undo for only the last three actions Forcing all address book entries to specify a fax number even though some people don’t have fax machines

Cont. Use the users’ vocabulary, not your own Keep the program internals inside the program. Find the correct point on the power/complexity trade-off –Sensible defaults –Templates or canned solutions –Progressive disclosure –Generic commands (create, copy, move, …) –Task specific design

4. Don’t complicate the users task Common tasks should be easy. –Support customization –Provide wizzards Don’t give users extra problems to solve. –Tiff to gif conversion, etc.

5. Promote Learning Think “outside-in” not “inside-out” –Don’t design like you assume the users will automatically know what the developers intended. Often the cause of Textual Ambiguity

Textual Ambiguity Crowds Rushing to See Pope Trample 6 to death Drunk Gets Nine Months in Violin Case Vineland Couple to Take on Missionary Position Teacher Strikes Idle Kids British Left Waffles on Falkland Islands Iraqi Head Seeks Arms New Vaccine May Contain Rabies Two Soviet Ships Collide, One Dies The patient was at death’s door, but the doctor pulled him through!

Other Ambiguities Typographical Ambiguity –DOIT Graphical Ambiguity –In or out

6. Deliver Information not just data Design displays carefully; get professional help. –Visual order and user focus –Match the medium –Attention to detail The screen belongs to the user. –Preserve display inertia Minimize what changes when responding to an action

7. Design for Responsiveness Responsive software keeps up with users even if it can’t fulfill every request immediately. It provides enough feedback for users to see what they are doing. It lets users know when it’s busy and when it’s not.

Poor Responsiveness Delayed or nonexistent feedback for user actions. Time-consuming operations that block other activity and cannot be aborted. Providing no clue how long lengthy operations will take Periodically ignoring user input while performing internal “housekeeping” tasks

8. Try it out on users, then fix it! Test results can surprise even experienced designers. Schedule time to correct problems found by tests. Testing has two goals: informational and social –Find aspects of the user interface that cause problems –Convince developers that there are problems