• Author / Uploaded
• José da Silva

Citation preview

What is Usability? Usability is a term given for how we use systems, applications or products and with what effort. Usability determines the success of a product. It takes meticulous research and planning to make a product usable. For example: 

The above image depicts a USB flash drive. It is easy to uncap and carry it in



your pocket. Though it appears to be a capsule when it is covered with a lid, it disguises itself well and serves as a USB flash drive.

Welcome to the video on 'what is usability'. This learning activity will help you understand what usability is and how usability design is a crucial part of user experience design. User experience design focuses on a deep understanding of the user's needs, wants, and abilities. Usability or user-centered design is the process of designing something from the perspective of how it will eventually be used by an actual person. Simply put, usability differs from user experience because it considers a product's usefulness in addition to everything else covered by user experience design. When designing for usability, you should keep the user's psychological profile and physiology in mind. Usability projects are designed for efficiency of use, ease of learning, and general satisfaction of use. When developing your product, ask yourself the following four questions:    

Is my project quick and easy to learn? Is my project efficient to use? Does my project allow for rapid recovery from errors? Is my project easy to remember?

If you or your users answer yes to all four questions, you're off to a good start. Start by focusing on the task first and the design second. A well-designed product is more than just a pretty face. It should be easy to navigate, informative and helps your users

complete a specific task. In order to meet your users' needs, you must make their task completion your primary target. When should you test for usability? You should always be testing for usability. No project is ever truly completed. Every project needs to continually evolve and improve user behavior changes. When it does, your project needs to change too. You may be working on a project where your client has design requests that if implemented, it will render a project useless. One way to express the importance of usability design to a client is to share its potential benefits. Potential benefits of Usability    

Increased productivity Increased profitability Reduced training costs Increased satisfaction

Sharing these benefits can help to create a healthy balance between the user's needs and the client's needs. Usability has become so critical in design that there are even ISO standards regarding user experience design. ISO - the International Organization for Standardizationcoordinates worldwide industrial and commercial standards - ISO 9241 and ISO/TR 16982:2002. Detail standards on human-centered usability methods that are recommended for product design and evaluation discuss the advantages, disadvantages and other factors relevant to using each usability method. Here's what you need to know about usability. Are you listening?     

Focus on your users, Incorporate your users early on in your design process. Identify their needs and wants, and incorporate those into your design. Perform usability testing with your users and make modifications based on their feedback. You won't always be able to incorporate all of the suggestions. And that's okay. Just make sure you're always designing for your users.

You have completed what is usability? learning. Usability is an essential element for the survival of a product. Benefits of Usability Usable systems result in the following turnarounds for companies: Loyal customers Improved reputation

Competitive advantage Minimal training and error costs Less support and service costs Usable systems provide the following benefits for users: Improved efficiency Better productivity Enhanced quality of life Self-satisfaction Questions to Address The following questions related to usability arise during the product development cycle. You have to ask these questions initially to achieve better usability.

Who are the real users?

What is the purpose of the product?

When and where will the product be utilized?

What activities will be performed by the users using the product?

What are the location characteristics of the product? Usability is Not User Experience Let's not get confused usability with user-experience.

Usability Usability is regarding the ability to use a product. The following questions creep up when evaluating usability.

Are you able to use the product for the expected purpose without confusion?

Are you able to find the required thing without errors or difficulty?

User Experience

User experience talks about emotions.

How do you feel while using the product?

Does the product offer you a sense of gladness?

Do you feel important by using the product? Notes on User Experience User experience is an interesting and a vast topic that we will discuss in the next set of courses. Here, we will concentrate on usability, because a great user experience cannot be achieved without a significant level of usability.

A product that is difficult to use will always produce a poor user experience.

Now we will look to master usability in the upcoming cards.

Principles of Usability We have realized the importance of usability in the previous cards. So now let’s try to master the key principles of usability. 

Affordance



Alignment



Consistency



Ease of Use



Findability



Error Recovery



System Feedback



Aesthetics



Grouping of information

Affordance

What is affordance? Affordance is a perceived idea of how you think you will use an object. Why is affordance important?

Affordance helps you to easily answer the question - what do you think this object does? Where do you use affordance? 

In the design of everyday objects – to convey their intended use



To design icons



To define clickable or non-clickable entities

Explaining Affordance Through Shadow Play



What are we trying?



What are we projecting on the screen?



When do we perceive?

Let's see if we can correlate affordance with shadow play.

Explaining Affordance through Shadow Play Here, hands were used to depict the shadow of a dog through shadow play. What you perceive from an object correlates to affordance. If you were unable to judge that it was a dog? Then affordance fails there.

Applying Affordance to User Interface Let's apply affordance to a user interface. In the first example, the shapes of mouse pointer suggest the possible actions. The double-sided arrow pointer and the border around the rectangle indicate that the rectangle can be resized. In the second example, a set of clickable and non-clickable buttons are shown. The highlighted beveled effect or border around the icons indicate that the objects are clickable.

Applying Affordance to User Interface In the first example, the user interface confuses the user with its styling. In the second example, the styling of the user interface clearly indicates the intended action. The layout and the sizes of the panels set a perception of swiping to view the next slide.

What is Alignment? When you place content in a straight line, or with relative indentations to denote hierarchy in a screen, this arrangement of content is known as Alignment. Relative indentations must be followed consistently in all screens.

Why is Alignment Important? 

Your eyes are always looking to hinge on to a visual guide while scanning content. The following things can be achieved by aligning content appropriately: o o o



Most of us are conditioned to read from Left to Right, Top to Bottom, resulting in an F shaped curve. o o



Better readability. Understanding information hierarchy clearly by just scanning the content. A pleasant, finished look and feel.

When text is aligned to the left, it becomes easier for the eye to move along the F curve. Any indentations automatically convey hierarchy.

Misaligned text distorts readability as well as negates any visual cues that could be used to communicate hierarchy.

Where do you use Alignment? Adherence to alignment must be followed as a consistent standard in all pages of an application. Consistency is a consistent/uniform behavior noticed throughout all the places in a user interface. In other words, the same elements are seen at the same place, every time.

More About Consistency Why is Consistency Important?

Consistency helps in making your experience predictable, and therefore it helps in quick learning. Where do you use Consistency?

In routine and repetitive work  

To establish branding Where standardization is important.

***Double D Rule - Differences are Difficult***!

Consistency in User Interface 

Page Elements – Header, Footer, and Navigation. * The position and styling of the primary interaction elements across the product/application need to be consistent.

 

Colors * Do not use more than three colors in the entire application. * All similar elements such as headers, links, and titles must be rendered in the same color. Typefaces * Be consistent in the usage of fonts across the application. * Font styles, sizes, and color should be consistent with the application.

Consistency in User Interface 





Interactions o All the links, buttons, tabs must be consistent in terms of their appearance and behavior. o Use same UI controls for similar actions. Content o Use the same language throughout the application unless needed otherwise for business reasons. o All the error messages, prompts must use the same tone of language.

Product Evolution

 

Product designs have evolved in response to user needs and technological developments. The evolution of products will help you to understand the meaning of ease of use.



The above illustration shows how a traditional telephone has evolved into a smartphone in few decades, thereby improving ease of use.

Defining Ease of Use How easily an object can be used without any help is referred to as ease of use.

More on Ease of Use Why is Ease of Use Important?

Ease of Use improves the productivity of users by saving time. Users without specialized knowledge can easily use products/applications. Where do you apply Ease of Use? 

Business critical tasks



High-frequency tasks



Where fields ordering is important.



What is Findability?

 

Findability is how easily you can search information on a website as well



as from outside the website with the help of search engines. In general, findability is the quality of being found.

More on Findability Why is Findability important?

Findability allows quick retrieval of information. Therefore, it immensely helps in the efficiency of usage. As it helps you to have a constant bearing on your location on the website, it puts you in complete control of your actions. Where do you use Findability?    

Search functionality Navigation Search Engine Optimization Accessibility



Findability in Real Life

 

Maps are in use for centuries to get to the desired destinations.

Applying Findability in User Interface Where do you use Findability? 

Navigation * May it be the main menu, breadcrumbs, global navigation or doormat



navigation links, findability is of paramount importance. If users do not get to where they want to go quickly, they will lose interest in the application/website. * All the navigation links should be intuitive, direct and to the point. Search * Search functionality should be quick and accurate. * Advanced search options should be provided wherever. appropriate. Search engine optimization * Use of appropriate key words to be used by search engines.



Defining Error Recovery According to the epigram from Alexander Pope's An Essay on Criticism, To err is human; to forgive, divine. Users must be allowed to recover from their mistakes. This act is known as Error Recovery.

Understanding Error Recovery Why Error Recovery is Important?

Recovery from error saves users from costly mistakes and allows them to revert changes freely. Where do you use Error Recovery?

In critical Tasks  

To forgive users for their mistakes Where undo is important

Error Recovery in Real Life 

Safety nets and harnesses used on construction sites provide a critical chance of recovery from fatal errors.



At times users land on a screen, from where it is impossible to move away. Users expect some link/button to move away from such screen.



Undo option in an application allows a user to go and revisit the error.

Defining System Feedback Whenever a system communicates an appropriate feedback/notification to the user at an appropriate time, it is known as a system feedback.

Understanding System Feedback Importance of System Feedback  

A system feedback communicates the results of an action – success, failure or work in progress, to you. When feedback is conveyed to you, you are aware of the situation.

Where do you use System Feedback   

To communicate the success of a user action - Confirmation. To communicate failure - Error. Work in Progress – Progress Bar and Loader.

System Feedback in Real Life The above illustration shows a notification for enabling the GPS location, to book a cab using a mobile app. System feedback includes many things that are not explicit confirmation or error messages. Any user-perceivable change in the system that reflects changes in the system state is a form of feedback. Audio Feedback Whirring sound of Automated Teller Machine (ATM) just before cash is dispensed. Beeping sound when turn indicators of the car are on. Ping sound on mobile phones for a new notification.

Applying System Feedback to User Interface When user creates or edits a record, completes a transaction or is accomplishing a task that will take processing time greater than a 1 second. Guidelines for providing feedback 

0.1 second o What user feels - The system is reacting instantaneously o Feedback required - No specific feedback is necessary except to display the result.





1.0 second o What the user feels - the user will feel the delay. o Feedback required - No specific feedback is necessary. However, the user does lose the feeling of operating directly on the data. 10 seconds o What user feels - About the limit for keeping the user's attention focused on the dialogue. o For longer delays, users should be given feedback indicating when the computer expects to be done.

**Aesthetics**is a collection of principles that deal with the appreciation of beauty and nature.

Understanding Aesthetics Importance of Aesthetics

A visually appealing and attractive interface not only retains end user’s attention but it also plays a major role in increasing repeat visitors. Where do you use Aesthetics?  

Any work of artistic expressions Visual design of an application or a website.

Aesthetics should complement the content and not compete with it.

Applying Aesthetics to User Interface Where do you use it? 



Colors o Powerful medium to create beautiful interfaces o Not to be overused. Typefaces o Styles, sizes, and types can create visual harmony in design. o A balance needs to be maintained between aesthetic appeal and legibility of the

typefaces. 

Images o Appropriate use of imagery can add to the aesthetic appeal of the interface. o Images must be used to support the content of the application.  

Objects or information with a similar trait is grouped together.  

Understanding Grouping of Information Importance of Grouping of Information

Grouping helps to understand and process the information easily. It also helps in finding it quickly. Where do you use Grouping of Information?   

Grouping information on informative website such as news To design a website menu To categorize information  

User Experience Heuristics There is a connection between user experience and heuristics. You will get to know about that connection in the next card.

Usability Principles 1) If a user is able to perform a specific task, it is definitely a good UX. True False

2) While pressing on ‘Logout’ button, pop-up of ’Do you really want to logout?’ shows _________________. Unnecessary prompt to user when user had already decided to logout. Error prevention mechanism to user.

3) ‘Your system will restart automatically after installation’ is an example of ____________. Recovery from errors Consistency System Feedback Grouping of information

4) How ‘Help’ is treated for a good usability? a. User ideally should not require help to do the basic tasks. b. Only less repetitive, complex tasks can be explained via help. c. User should be provided contextual help whenever necessary. d. A bulky help section may indicate that UI is not created intuitive enough. Only b is valid

All are valid Only d is valid Only a, b, c are valid ERRADA

5) Relate the following questions to Usability and User Experience. a. Usability -> 'Can the user complete the task?' b. User Experience -> 'Was user happy while completing the task?' c. Usability -> Effectiveness and Ease of use in completing task. d. User Experience -> Holistic experience while interacting with the product. a, c a, b, c, d b, d a, c, d

6) Usability principles should be practiced _________________. Only during product rollout. While fixing the product issues. From the requirement gathering phase of product to complete SDLC cycle. It depends upon developer’s wish.

7) Select a correct sequence for the mentioned tasks. Information Architecture -> Interaction Design -> Development -> Visual Design Information Architecture-> Visual Design -> Interaction Design -> Development Information Architecture -> Development -> Interaction Design -> Visual Design Information Architecture -> Interaction Design -> Visual Design -> Development

8) Which of the following should be implemented in a good UX design? Make interfaces intuitive Provide more control to users Create consistent interfaces All the options

9) Minimizing user’s memory loads is related to __________________. Implementing ‘Recognition rather than recall’ characteristic. Implementing Error recovery better. Implementing Error prevention better. Implementing good aesthetics.

10) The spelling mistakes in content affect which of the usability heuristics __________. Ease of Use Aesthetics Alignment Findability

11) If a user is able to retrieve a mail mistakenly sent in trash back to inbox, it is __________. Error Recovery Findability

12) User is not able to view action button. How this issue can be qualified? It is an affordance issue, which is trivial. ERRADA It is not at all an issue. It is a grouping issue and can be ignored. It is a critical alignment issue, since user is not able to perform specific action.

13) Choose the correct options about Usability and User Experience, a. Usability is one of the aims of User Experience strategy. b. Usability is related to achieving end result, User Experience is about creating a series of sequence to achieve it. c. Usability and User Experience are mutually exclusive. d. Both are same. a, b, d b and d d a and b

14) Creating accessible product is an ‘extra’ thing in product design. True False

15) Google shows appropriate search keyword options upon entering wrong spellings in a Google Search bar. This can be considered as an example of _____________. Consistency Error prevention Accessibility Ease of Use

16) Usability is an important goal and a subset in an overall UX design. False True

17) A beautiful visual design can compensate flaws in usability. False True

18) Minimalist design means ________. Only using icons and not providing supportive texts. Not including and showing any irrelevant/not required piece of information. Using minimum texts. Using only 4 fonts and 4 colors at max. in an application.

19) Error messages should be represented in technical jargon indicating underlying technical problem to the user. False True

20) ‘Save’ button has ‘Green’ color on a page and ‘Red’ on another page, select the appropriate comments based on the given statement. It is a case of inconsistency.

Action buttons should be used with uniform visual appeal. It is a case where user gets confused to accustom to changing mental model. All the options

21) The download icon looks like a print icon. Which Usability heuristic is affected here? Affordance Grouping of Information System Feedback Alignment

22) User Experience is an enhanced Visual Design of the product. True False

23) User interface design is about _____________. Creating effective interfaces between user and the application it interacts with. All the options Creating error free interfaces amongst backend software components. Creating effective cloud interfaces across the systems.

24) ‘Recovery from errors’ helps users to ___________. Both the options

25) Users without specialized knowledge are able to use the product easily. This implies that the product can be considered under _____________. Ease of use

26) Recovery from error is important for For critical tasks

25) Which of the following would you consider to improve the aesthetic of a software application? All the options

26) Which of the following can be termed as examples of System Feedback? A blank page to indicate something is happening in the backend

27) State if the statement is true or false. “All system feedbacks need to have a visual element to it”. True

28) Which of the following would you consider to improve the aesthetic of a software application? All the options 29) Why to think about Usability and User Experience? To increase effectiveness of the product and enhance customer satisfaction.