IT323 - Software Engineering 2 1 Tutorial 3.  Suggest ways in which the user interface to an e-commerce system such as an online stores might be adapted.

Slides:



Advertisements
Similar presentations
Usability and Performance Rules of Thumb for Mobile Java Developers Jackson Feijó Filho Software Developer Lightning talk at Java Mobile, Media & Embedded.
Advertisements

Certificate in Digital Applications – Level 02 Website Design and Creation.
1 CS 501 Spring 2002 CS 501: Software Engineering Lecture 11 Designing for Usability I.
© De Montfort University, Characteristics of Good Dialogues Howell Istance Department of Computer Science De Montfort University.
User Interface Design Yonsei University 2 nd Semester, 2013 Sanghyun Park.
Tailoring Needs Chapter 3. Contents This presentation covers the following: – Design considerations for tailored data-entry screens – Design considerations.
V0.1 Inclusive and Accessible Application Design June 21, 2012.
Representation at the Interface Gabriel Spitz 1 Lecture #13.
Chapter 13 User Interface Design.
XP Exploring the Basics of Microsoft Windows XP1 Exploring the Basics of Windows XP.
Multimedia Design Guidelines General Guidelines for Multimedia Learning Design.
7M701 1 User Interface Design Sommerville, Ian (2001) Software Engineering, 6 th edition: Chapter 15
1 SWE Introduction to Software Engineering Lecture 26 – User Interface Design (Chapter 16)
1 / 31 CS 425/625 Software Engineering User Interface Design Based on Chapter 15 of the textbook [SE-6] Ian Sommerville, Software Engineering, 6 th Ed.,
User Interface Design: Methods of Interaction. Accepted design principles Interface design needs to consider the following issues: 1. Visual clarity 2.
Today’s class Group Presentation More about principles, guidelines, style guides and standards In-class exercises More about usability Norman’s model of.
©Ian Sommerville 2000 Software Engineering, 6th edition. Chapter 15Slide 1 User interface design l Designing effective interfaces for software systems.
Website: Best Practices. Sources: The World Wide Web Consortium the main international standards organization for the World Wide Web Research-Based Web.
User Interface Design. Overview The Developer’s Responsibilities Goals and Considerations of UI Design Common UI Methods A UI Design Process Guidelines.
User interface design Designing effective interfaces for software systems Objectives To suggest some general design principles for user interface design.
Basic Editing Lesson 2- Part 2. Navigating and Searching Through a Document Find command options, the mouse, scroll bars, and various keystroke and keyboard.
User interface design. Recap User Interface GUI Characteristics (Windows, Icons, Menus, Pointing, Graphics) User Centered Design User Interface Design.
©Ian Sommerville 2004Software Engineering, 7th edition. Chapter 16 Slide 1 User interface design.
User interface design.
7 Selecting Design and Color Section 7.1 Identify presentation design principles Use a custom template Add pages to a navigation structure Section 7.2.
Website Design. Designing and creating different elements involved in developing a website for e- commerce can help you identify and describe the components.
Chapter 29 - Interaction design
Color Theory in Web Design Web Design – Sec 2-2. Objectives  The student will: –Have a better understanding of effective use of color on the web. –Be.
Revision Lesson : DESIGNING COMPUTER-BASED INFORMATION SYSTEMS.
Charmin Suttles TEC 542.  What is an interface? ◦ Thorsen(2009) describes an interface as “the consistent color, font style, and placement of informational.
Microsoft Wang Li, Wang Yini, Li YIcheng.  This is a presentation about Microsoft Windows7 guidelines  Wang Li K8wali00  Li Yicheng K8liyi00  Wang.
IT3 Human Computer Interface [HCI] Human Computer Interfaces Factors that should be considered when designing a Computer Interface.
User interface design. Recap OOD is an approach to design so that design components have their own private state and operations Objects should have constructor.
CSC 480 Software Engineering Lecture 19 Nov 11, 2002.
©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.
Design for Interaction Rui Filipe Antunes
Chapter Three The UNIX Editors. 2 Lesson A The vi Editor.
10 Usability Heuristics for User Interface Design.
Software Engineering Chapter 16 User Interface Design Ku-Yaw Chang Assistant Professor Department of Computer Science and Information.
Designing Interface Components. Components Navigation components - the user uses these components to give instructions. Input – Components that are used.
CS CS 5150 Software Engineering Lecture 11 Usability 1.
MarkNotes Question 1 The Human Computer Interface (HCI) is an important part of an ICT system. Describe four factors which should be taken.
Heuristic evaluation Functionality: Visual Design: Efficiency:
Productivity Programs Common Features and Commands.
Good Web Design. The Four A’s of Good Design Accessible Accurate Appropriate Appealing.
Why do we need good user interfaces?. Goals of User Interfaces Usable – how much effort to do a task? – example: often-used buttons easier to find – example:
Software Architecture
Usability 1 Usability evaluation Without users - analytical techniques With users - survey and observational techniques.
Chapter Three The UNIX Editors.
 Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles.
Different Types of HCI CLI Menu Driven GUI NLI
Conceptual Model Design Informing the user what to do Lecture # 10 (a) Gabriel Spitz.
©Ian Sommerville 2000 Software Engineering, 6th edition. Chapter 15Slide 1 User interface design l Designing effective interfaces for software systems.
Ch16: User Interface Design Users often judge a system by its interface rather than its functionality Poorly designed interfaces can cause users to make.
Users and the Interface When designing an information system you need to have a clear idea of who the target audience is. If the target audience is an.
Basic Elements.  Design is the process of collecting ideas, and aesthetically arranging and implementing them, guided by certain principles for a specific.
©Ian Sommerville 2000 Software Engineering, 6th edition. Chapter 15Slide 1 Chapter 15 User Interface Design.
Usability Olaa Motwalli CIS764, DR Bill – KSU. Overview Usability factors. Usability guidelines.  Software application.  Website. Common mistakes. Good.
1 CS 501 Spring 2003 CS 501: Software Engineering Lecture 13 Usability 1.
Chapter 2: Advanced programming concepts Part 3: The user interface Lecture 5 1.
A disciplined approach to analyzing malfunctions –Provides feedback into the redesign process 1.Play protocol, searching for malfunctions 2.Answer four.
MarkNotes Question 1 The Human Computer Interface (HCI) is an important part of an ICT system. Describe four factors which should be taken.
6. (supplemental) User Interface Design. User Interface Design System users often judge a system by its interface rather than its functionality A poorly.
Web Accessibility. Why accessibility? "The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect."
Chapter 6 : User interface design
Chapter 16: User Interface Design
Exploring the Basics of Windows XP
User interface design.
Proper functionality Good human computer interface Easy to maintain
Presentation transcript:

IT323 - Software Engineering 2 1 Tutorial 3

 Suggest ways in which the user interface to an e-commerce system such as an online stores might be adapted for users who have a visual impairment. 2

 Make allowances for enlarged text.  Contrast is key: consider offering a second version of your site with more contrast between elements. Make use of bold text for added readability on low-contrast items and avoid very thin fonts.  Be mindful of colors for action items: when creating buttons or notices that call the user’s attention and require their direct interaction, try to avoid using color combos that are easily confused by colorblind users (red and green, blue and yellow) and make sure these elements contain clear, visible text or iconography that makes their purpose clear.  Don't use only color to indicate something specific on your page.  Use keyboard shortcuts to aid navigation. 3

 What factors have to be taken into account in the design of a menu-based interface for ‘walk-up’ systems such as bank ATMs? 4

Factors to be taken into account when designing 'walk up and use' systems are:  System users may be infirm, or disabled so will not be able to respond quickly to requests.  Users may not be able to speak the native language of the country where the machine is installed.  System users may be completely unfamiliar with technology and may make almost any kind of error in using the machine. The interface must minimize the number of possible errors and must be resilient to any possible error.  Some system users are likely to be intimidated by many options. On the other hand, as users gain familiarity with the system, they may expect to use it for a wider range of banking services.  Different people may understand the meaning of icons in different ways.  If the system has navigation options, users are almost certain to become lost.  Most users will want to use the system for very simple functions (e.g. withdraw cash from an ATM) and will want to do this as quickly as possible. 5

 Suggest situations where it is unwise or impossible to provide a consistent user interface. 6

7 A consistent user interface may be impossible to produce for complex systems with a large number of interface options. In such systems, there is a wide imbalance between the extent of usage of different commands so for frequently used commands, it is desirable to have short cuts. Unless all commands have short cuts, then consistency is impossible. It may also be the case in complex systems that the entities manipulated are of quite different types and it is inappropriate to have consistent operations on each of these types. An example of such a system is an operating system interface. Even MacOS which has attempted to be as consistent as possible has inconsistent operations that are liked by users. For example, to delete a file it is dragged to the trash but dragging a disk image to the trash does not delete it but unmounts that disk.

8  Consider the following error messages produced by MS-Windows, and Mac operating systems. Discuss the problems of this errors messages and suggest how these might be improved.

9 The problem are: 1.Describes the context in system-specific terms. 2.Negative not positive. 3.Don’t provide user guidance on how the error might be rectified. Suggestions: 1.It should be more positive. 2.It should be user oriented and use concept derived from user environment. 3.It should provides guidance and how to recover from error.

10  What are the problems of the following website interface? What are the guidelines that should be followed when using color in a user interface?

11 The over use of colors and the wrong colors combination. Guideline of using colors: 1.Limit the number of colours used and be conservative in their use. 2.Use colour change to show a change in system status. 3.Use colour coding to support the task that users are trying to perform. 4.Use colour coding in a thoughtful and consistent way. 5.Be careful about colour pairings

12  Discuss the advantages of graphical information display and suggest four applications where it would be more appropriate to use graphical rather than digital displaying of numeric.

13 Advantages are ‘at a glance’ magnitude indication, relative magnitude indication and exceptional data values indication. Any applications where these are important might be mentioned:  Temperature control  Speed indicators  Weather statistics  Relative comparisons of cars, etc.

14  The images below are example of what User Interface Design Principles? 1) Recoverability

15  The images below are example of what User Interface Design Principles? 2) Recoverability

16  The images below are example of what User Interface Design Principles? 3) Auto Save = Recoverability

17  The images below are example of what User Interface Design Principles? 4) User Guidance

18  The images below are example of what User Interface Design Principles? 5) User familiarity It can be consistency among other application as well

19  The images below are example of what User Interface Design Principles? 6) Recoverability

20  The images below are example of what User Interface Design Principles? 7) Adaptability

21  The images below are example of what User Interface Design Principles? 8) Adaptability, Learnability

22  The images below are example of what User Interface Design Principles? 9) User Diversity

Thank you 23