Human-Computer Interaction Self Notes

Prepared by: Zoha Tazmen

Slide 1-Introduction
What is HCI?

HCI (Human-Computer Interaction) focuses on how people interact with computers and digital
devices. It revolves around designing systems that are easy to use, efficient, and enjoyable. The
main goal of HCI is to ensure technology fits seamlessly into people's lives.

Example: When you unlock your smartphone by touching the screen, the fluid response and
intuitive layout are a result of good HCI design. A well-designed HCI ensures that you do not
need a manual to operate a phone.

Key Areas:

1. Design, Implementation, and Evaluation of interactive systems for human use.

What is HCI? - Human

The "human" in HCI refers to the user. This can include:

• An individual user, like a person checking emails on their smartphone.

• A group of users collaborating on a project using shared tools like Google Docs.

• Multiple users in an organization, each contributing to a larger system, like a logistics

team using supply chain management software.

Example: In a hospital, different staff (nurses, doctors, and administrators) use different parts of
a hospital management system to manage patient data, schedule appointments, and track
medication.

What is HCI? - Computer

The "computer" in HCI includes various technologies:

1
 • General-purpose devices like laptops or desktops.

• Specialized systems like a self-checkout machine at a supermarket or an embedded

system in a car (such as the GPS).

• Emerging technologies such as Virtual Reality (VR), touchscreens, gesture recognition,

and voice-based interfaces (e.g., Siri or Alexa).

Example: Using Amazon's Alexa for voice-activated commands is an example of HCI. You
interact with the device by giving voice commands, and it processes your requests, from playing
music to controlling smart home devices.

What is HCI? - Interaction

Interaction in HCI refers to the communication between users and computers. There are two
main types:

1. Direct Interaction: Immediate feedback from the system, such as typing on a keyboard
or tapping an app on your phone.

Example: When you tap a button on an ATM to withdraw money, and the machine dispenses
cash instantly.

2. Indirect Interaction: The user interacts with the system, but feedback isn't immediate.
For example, batch processing, where data is processed later, or intelligent systems like
smart thermostats that adjust based on the environment.

Example: A Nest thermostat senses the room temperature and adjusts the settings without you
having to intervene.

User Interfaces (UI)

A User Interface (UI) is the medium through which interaction happens between users and the
computer. The main principle in HCI is "people come first," meaning:

• Understand user behaviors and preferences.

• Design interfaces that cater to various users’ needs and are accessible.

2
Example: The Apple iPhone's user interface is designed for both tech-savvy users and
beginners, making the experience smooth for all, with features like a simple home screen layout
and easy access to commonly used apps.

Goal of HCI

HCI aims to:

• Reduce negative aspects, such as user frustration or confusion.

• Enhance positive aspects, making the technology experience enjoyable.

• Improve usability by ensuring the product is easy to learn and use, and free of errors.

Example: In online shopping, Amazon’s one-click purchasing system simplifies the buying
process, making it more enjoyable and efficient.

What is Usability?

Usability refers to how easy and efficient a system is to use. Good usability ensures:

1. Ease of learning: The system is simple to use from the start.

Example: When you first use Google Docs, the layout is intuitive, allowing even new users to
quickly find basic functions like editing or sharing documents.

2. Recall: Users can remember how to use the system after returning to it.

Example: After using Netflix once, you can easily remember how to search for shows during
subsequent sessions.

3. Productivity: The system allows users to perform tasks quickly and efficiently.

Example: Google Search’s quick response times and easy navigation to related searches
improve productivity.

4. Minimal error rates: Systems offer feedback to recover from errors easily.

Example: Gmail’s undo button for sent emails reduces the chance of accidental sending.

5. High satisfaction: Users feel confident and satisfied while using the system.

3
Example: iPhone’s Face ID makes unlocking the phone secure and fast, giving users a sense of
satisfaction.

HCI is NOT about:

• Just making interfaces look pretty. They should also be functional.

• Focusing only on coding; it’s about user experience.

• Being limited to desktop computers; HCI applies to all types of computing systems.

• Solely technical implementation; the user’s experience is prioritized.

HCI is about:

• Understanding users and their tasks.

• Analyzing environments where technology will be used.

• Gathering requirements for designing user interfaces.

• Prototyping and evaluating systems to meet users' needs.

Example: During the development of Microsoft Teams, understanding how remote teams
collaborate was key. Features like video conferencing, screen sharing, and integration with other
apps make it easy for teams to work efficiently.

Why is Usability Important?

A well-designed user interface can:

1. Earn companies billions of dollars.

Example: Apple’s focus on user-friendly interfaces with its iPhone made it a market leader.

2. Increase user loyalty and trust.

Example: People trust Google Maps for accurate directions because of its simple and effective
design.

3. Make users happy, reducing frustration.

4
Example: Spotify’s user interface allows easy navigation of playlists, improving user
satisfaction.

Examples of Good and Bad Design

Good Design: The Google homepage is minimalist, focusing on a single search bar that
immediately addresses the user's need.

Bad Design: A poorly designed website, full of clutter and hard-to-read fonts, can frustrate users
and make them leave the page without finding what they need.

Is HCI Really Important?

HCI is critical in systems where errors can have serious consequences.

Example 1: In 1989, a pilot shut down the wrong engine, causing a plane crash in Leicestershire,
UK. A better-designed interface might have prevented the mistake.

Example 2: A telecommunications company in Italy improved the usability of its helpdesk

operator interface, reducing call handling time by one second per call, resulting in a $3,000,000
annual benefit.

Why Study HCI?

• UI design is a major part of most systems.

• Bad interfaces cost money (product failure) and lives (system failures).

• Understanding human behavior and design principles will help create better systems.

Example: Tesla's in-car interface balances simplicity with functionality, providing real-time
information and minimizing distraction for the driver.

Who Builds Interfaces?

HCI interfaces are typically built by a team of specialists, including:

• Graphic designers.

• Interaction designers.

• Software engineers.
5
 • Test engineers.

Foundations for Building UI’s

• Design Cycle: Understand user tasks, design, implement, and evaluate.

• Task Analysis: Observe real user behaviors and workflows.

• Prototyping: Build mockups (low or high-fidelity) to test ideas early.

Example: Before building Instagram, developers tested how users would interact with image
filters using paper prototypes and mockups.

Design Cycle

1. Design

2. Evaluate

3. Implement

The Design Cycle in Human-Computer Interaction (HCI)

The Design Cycle is a fundamental process in HCI for developing interactive systems. It helps
ensure that the design is user-centered, efficient, and functional by going through a repeated
sequence of steps: Design, Implementation, and Evaluation. Each step feeds back into the
process, making it iterative and cyclical.

1. Design

In this stage, the goal is to create solutions for the user’s needs. This involves understanding
users, their tasks, and the context in which they use the system. It’s important to involve users
early in the design process to gather insights and requirements.

Key Activities:

• User Research: Gathering insights about the users through interviews, surveys, or
observations.

• Requirement Analysis: Defining the system’s needs based on user research.

6
 • Sketching and Prototyping: Creating initial designs (mockups, wireframes, low-fidelity
prototypes) to visualize ideas.

• Task Analysis: Understanding what tasks users need to accomplish and how the system
can support them.

Example:

Imagine designing a mobile app for booking movie tickets. The design phase would start by
understanding how users currently book tickets, their pain points, and preferences. You would
sketch the app’s layout, showing how users can search for movies, select seats, and make
payments.

2. Implementation

After designing, the next step is to build and develop the system. In HCI, this is where the
design ideas turn into a working product. The implementation should align closely with the
original design and be focused on functionality and usability.

Key Activities:

• Coding/Development: Translating the design into actual code or software.

• Feature Integration: Ensuring that all parts of the system work together smoothly.

• Usability Considerations: Implementing interactive elements that match user

expectations (buttons, forms, navigation).

Example:

In the movie ticket app, the implementation would involve developing the app’s features such as
movie search, seating selection, and payment gateways. The navigation structure and layout
would be coded so that users can easily move from one screen to another.

3. Evaluation

This step involves testing and validating the design by getting user feedback and measuring
performance. The purpose is to identify problems, gather data, and make improvements.

7
Evaluation can be done through user testing, usability testing, or gathering feedback from
stakeholders.

Key Activities:

• User Testing: Letting real users interact with the system to identify problems.

• Usability Testing: Observing users while they complete tasks to measure how easy the
system is to use.

• Feedback Collection: Gathering opinions and suggestions from users.

• Analysis: Looking at both quantitative data (e.g., task completion times, error rates) and
qualitative data (e.g., user satisfaction).

Example:

For the movie ticket app, users would be invited to test the app’s features. They might be asked
to book a ticket for a movie, and during the process, their interactions would be observed.
Feedback could be collected about any difficulties they faced (e.g., navigating between pages,
selecting seats). This would be used to refine the app.

Iteration:

After evaluating, the process cycles back to Design. Based on the feedback from the evaluation
phase, adjustments are made to improve the design. This process continues until the system
meets the required usability and user satisfaction standards.

Example of the Full Design Cycle:

Scenario: Designing a Mobile Banking App

Design Phase:

• User Research: Survey bank customers to understand their mobile banking needs, such
as transferring money, viewing transactions, or paying bills.

• Prototyping: Create wireframes showing the app’s main features: login page, account
overview, transaction history, and payment options.

8
 • Task Analysis: Define user tasks like "transferring money to a friend" and "viewing
recent transactions."

Implementation Phase:

• Development: Code the app’s basic functionalities like login, transaction display, and
money transfer.

• UI Elements: Ensure buttons, forms, and navigation bars are easy to interact with on
small mobile screens.

Evaluation Phase:

• User Testing: Invite users to complete tasks, such as sending money or viewing
balances, and observe their experience.

• Feedback: Some users find it hard to locate the "Transfer" button. They suggest a more
prominent placement.

Iteration:

• Return to the Design phase, adjust the layout based on feedback, and make the transfer
button more visible. Then re-implement and test again until the design is optimized

Topics that we Covered

1. Introduction to HCI (Human-Computer Interaction)

o Definition and Goals of HCI

o Key Areas in HCI (Design, Implementation, Evaluation)

2. Human Aspect in HCI

o Individual Users

o Group Users

o Organizational Users

3. Computer Aspect in HCI

9
 o General-Purpose Devices

o Specialized Systems

o Emerging Technologies (VR, Voice Interfaces)

4. Interaction in HCI

o Direct Interaction

o Indirect Interaction

5. User Interfaces (UI)

o Principles of User-Centered Design

o Examples of Well-Designed UIs

6. Usability in HCI

o Definition and Importance

o Key Attributes of Usability (Ease of Learning, Recall, Productivity, Minimal

Errors, Satisfaction)

7. Importance of HCI and Usability

o Examples of Good and Bad Design

o Critical Role of Usability in Systems

8. Design Cycle in HCI

o Design Phase

o Implementation Phase

o Evaluation Phase

o Iteration Process

9. Who Builds Interfaces?

o Role of Designers, Engineers, and Testers

10
 10. Examples of HCI in Real-Life Applications

• Mobile Apps, Embedded Systems, Specialized Software

Slide 2-Hci Lecture1

Introduction to HCI

Human-Computer Interaction (HCI) is the study of how people interact with computers and other
technology. It involves designing interfaces that are not only functional but also easy to use and
efficient. It focuses on creating systems that provide a smooth, intuitive, and engaging
experience for users.

Scope of HCI

1. Design: Involves the process of creating interactive systems and interfaces that are user-
friendly, efficient, and intuitive. This means thinking about how users will interact with
technology and ensuring it meets their needs.

o Example: Designing a mobile app with a clean and simple layout that users can
navigate easily.

2. Implementation: Once a design is finalized, it is translated into functioning software or

hardware. This step focuses on bringing design concepts to life through coding or
hardware construction.

o Example: Developing the code behind a user-friendly website that makes

navigation seamless.

3. Evaluation: After implementation, the interface is tested to ensure it works as expected

and meets user needs. This may involve usability testing, surveys, and other feedback
mechanisms.

o Example: Testing a new smartphone app with real users to find out if they
encounter any issues or confusion.

Goals of HCI

11
 1. Useful: The system should accomplish the task for which it is designed.

o Example: A music app must allow users to easily search and play songs.

2. Usable: Users should be able to complete tasks easily and naturally, without making
errors.

o Example: A document editing software that allows users to format text

intuitively.

3. Used: The system should be attractive and engaging so that people want to use it.

o Example: A fitness app with an appealing interface that motivates users to track
their workouts.

Example - Alarm Clock

An alarm clock is a simple, everyday object, but its design can greatly impact usability:

• A well-designed alarm clock will have intuitive controls, a clear display, and easily
accessible buttons for snoozing or stopping the alarm. Users can quickly understand how
to use it without reading a manual.

• A poorly designed alarm clock, on the other hand, might have confusing buttons or a
complicated interface, causing frustration when users try to set or stop the alarm.

Example - DOS vs. Modern Software

The shift from command-line interfaces like DOS (Disk Operating System) to modern graphical
user interfaces (GUIs) illustrates the evolution of HCI.

• DOS: Users needed to type commands manually, which required learning specific syntax
and commands.

• Modern GUIs: With icons, menus, and buttons, users can interact visually, making the
experience more intuitive and accessible, improving the overall user experience.

Don Norman’s Concept

12
Don Norman, a prominent figure in HCI, introduced key concepts like affordances and
signifiers:

1. Affordances: These are the inherent qualities of an object that suggest how it can be
used.

o Example: A handle on a door suggests pulling, while a flat plate suggests

pushing.

2. Signifiers: These are visual or auditory cues that signal the available actions or functions.

o Example: A button labeled “Click Me” indicates that pressing it will trigger an
action.

Don Norman’s Door Example

In his book "The Design of Everyday Things," Norman highlights how poor design can cause
confusion. His famous example involves a door:

• Good Design: A door with a handle on one side for pulling and a plate on the other side
for pushing. This follows the natural affordance of the objects (handles for pulling, plates
for pushing).

• Bad Design: A door with a handle on both sides, leading to confusion about whether to
push or pull.

Vision in HCI

Vision plays a key role in how we interact with interfaces:

1. Physical Reception: The eyes receive light and convert it into electrical signals for the
brain to interpret. Objects reflect light that enters the eye, allowing us to see.

2. Processing: The brain processes these signals to form a coherent visual perception.

o Example: Images appear upside-down on the retina, but the brain corrects this,
allowing us to perceive the world correctly.

Perception of Size and Depth

13
 • Visual Angle: Refers to how much of the view an object occupies, depending on its size
and distance from the eye.

o Example: A car appears smaller when far away but maintains its perceived size
due to familiarity.

• Cues like Overlapping: Help the brain perceive size and depth. If one object overlaps
another, the brain perceives it as being closer.

Interpreting Visual Signals

1. Brightness: How we perceive brightness depends on the light levels and the luminance
of the object. The brighter the object, the easier it is to see.

2. Color Perception: Cones in the retina help us see color. Our perception of colors is
influenced by hue, intensity, and saturation.

o Example: Blue acuity is lowest, which is why some people have difficulty
distinguishing certain shades of blue.

Optical Illusions

Optical illusions can trick our perception due to the brain's tendency to overcompensate for
movement and light changes.

• Example: The Muller-Lyer illusion, where two lines of the same length appear different
because of the direction of the arrows at the ends.

Hearing in HCI

Hearing allows us to gather information about our surroundings:

1. Pitch, Loudness, and Timbre: These qualities of sound help us distinguish different
noises.

o Example: The sound of a notification on your phone alerts you to check for new
messages.

2. Auditory Filtering: The brain can filter out background noise, allowing us to focus on
specific sounds, like a conversation in a noisy room.

14
Touch/Haptic Feedback

Touch plays a crucial role in interacting with devices:

• Haptic Feedback: Provides tactile responses, such as vibrations, that let users know they
have performed an action.

o Example: The vibration when you tap a key on your smartphone's virtual
keyboard.

Movement in Human-Computer Interaction (HCI)

Response Time

• The time taken to respond to a stimulus involves two components:

1. Reaction time: The time between the appearance of the stimulus and the
beginning of the response.

2. Movement time: The time taken to physically respond after initiating the
movement.

Factors Affecting Movement Time

• Age and fitness: Movement time tends to be faster in younger, fitter individuals, and
slower in older individuals or those with less physical conditioning.

Reaction Time Based on Stimulus Type

• Visual stimuli: Average reaction time is approximately 200 milliseconds.

• Auditory stimuli: Reaction time is faster, around 150 milliseconds.

• Pain stimuli: Slower reaction time, averaging 700 milliseconds.

Accuracy and Speed

• Increasing reaction time often decreases accuracy in unskilled operators, meaning that
hasty actions may lead to mistakes. However, skilled operators may maintain accuracy
even with reduced reaction time.

Fitts' Law in HCI

15
Definition

• Fitts' Law models the time required to move to a target area. It states that movement time
(Mt) is a function of the distance (D) to the target and the size (S) of the target:

o a and b are constants determined empirically.

o D is the distance to the target.

o S is the size of the target.

Implications of Fitts' Law

• Larger targets are easier and quicker to hit, as the user can target them more accurately.

• Shorter distances between the current pointer position and the target reduce movement
time.

Applications in Web Design

• Button Placement: When designing user interfaces, such as websites or applications,

placing important buttons like "Call to Action" or "Next" within easy reach, and making
them large enough, can reduce the time users spend interacting with the interface.

• Windows Start Button Example: The increase in size of the Windows Start button over
time exemplifies how making a target larger increases usability, making it easier and
quicker for users to interact with the interface.

Topics Covered
1. Introduction to HCI

o Definition and significance of Human-Computer Interaction

o Focus on designing functional, user-friendly interfaces

2. Scope of HCI

16
 o Design: Creating interactive, intuitive systems

o Implementation: Coding and hardware development

o Evaluation: Testing and feedback mechanisms

3. Goals of HCI

o Useful: Accomplishing intended tasks

o Usable: Simplifying task completion and minimizing errors

o Used: Making systems attractive and engaging

4. Examples in HCI

o Alarm Clock (Good vs. Bad Design)

o DOS vs. Modern Software (Command Line vs. GUI)

5. Don Norman's Concept

o Affordances: How object design suggests its use

o Signifiers: Cues indicating action possibilities

o Norman's Door Example: Good vs. bad design with everyday objects

6. Vision in HCI

o Physical Reception and Processing of Visual Signals

o Perception of Size and Depth

o Interpreting Visual Signals (Brightness, Color Perception)

o Optical Illusions

7. Hearing in HCI

o Auditory Perception: Pitch, Loudness, and Timbre

o Auditory Filtering: Focus in noisy environments

8. Touch/Haptic Feedback in HCI

17
 o Importance of tactile responses in user interactions

9. Movement in HCI

o Response Time: Reaction and Movement Time

o Factors Affecting Movement: Age, fitness, and type of stimuli

o Accuracy vs. Speed

10. Fitts' Law in HCI

o Definition and Formula of Fitts' Law

o Implications in Interface Design

o Applications in Web Design (Button Placement, Windows Start Button Example)

Slide 3-Usable Interface

1. What is Usability?

Definition:
Usability is defined as "the extent to which a system, product, or service can be used by specified
users to achieve specified goals with effectiveness, efficiency, and satisfaction in a specified
context of use." (ISO 9241-11)

2. Characteristics of Usable Products

2.1 Effectiveness

• Definition: The ability of users to complete their goals accurately.

• Importance: Effective products provide support to help users succeed.

• Example: A credit card input field that only accepts valid credit card numbers reduces
entry errors, ensuring users can complete their purchases correctly.

2.2 Efficiency

18
 • Definition: The speed at which users can accomplish their tasks.

• Importance: Efficiency is often measured by the number of steps or time taken to

complete a task.

• Example: In a document editor, allowing users to save a document with a keyboard

shortcut (e.g., Ctrl + S) speeds up the saving process compared to navigating through
menus.

2.3 Satisfaction

• Definition: The user's contentment and positive attitudes towards a product.

• Key Factors:

o Ease of Use: The interface should be easy to navigate.

o Usefulness: The product should meet users' needs.

o Efficiency: Tasks should be accomplished with minimal effort.

o Error Tolerance: Users should receive clear feedback when errors occur.

o Aesthetics: A visually pleasing interface enhances user satisfaction.

• Example: An e-commerce website that is visually appealing and easy to navigate, with
quick checkout options, leads to a satisfying user experience.

3. Nielsen and Molich's 10 User Interface Design Guidelines

3.1 Visibility of System Status

• Definition: The system should always inform users about what is happening through
appropriate feedback.

• Importance: Knowing the system's status builds trust and gives users a sense of control.

• Example: A download progress bar in a web browser shows how much of the file has
downloaded and the remaining time.

3.2 Match Between System and Real World

19
 • Definition: The system should use language and concepts familiar to users rather than
technical jargon.

• Importance: Intuitive designs are easier to learn and use.

• Example: A navigation app like Google Maps uses real-world road layouts and
recognizable symbols for directions.

3.3 User Control and Freedom

• Definition: Users should have the ability to undo and redo actions and have clear exit
strategies.

• Importance: This fosters a sense of freedom and prevents frustration.

• Example: In photo editing software, users can easily revert changes to an image.

3.4 Consistency and Standards

• Definition: Similar elements should behave in similar ways throughout the interface.

• Importance: Consistency reduces the learning curve and eliminates confusion.

• Example: A word processor where formatting options are consistently placed in the
toolbar across different documents.

3.5 Error Prevention

• Definition: The design should minimize the occurrence of errors and help users recover
from mistakes.

• Importance: A smoother user experience results from error prevention measures.

• Example: A form that does not allow submission until all required fields are correctly
filled out.

3.6 Recognition Rather Than Recall

• Definition: Information and options should be presented in a way that is easy to

recognize rather than requiring users to remember details.

• Importance: This reduces cognitive load on users.

20
 • Example: A website with visual icons for categories (e.g., shopping cart, home) allows
users to recognize functions without recalling their names.

3.7 Flexibility and Efficiency of Use

• Definition: The interface should allow users to customize their experience and use
shortcuts.

• Importance: Customization caters to different user preferences and speeds up task

completion.

• Example: A text editor that supports keyboard shortcuts and customizable toolbars for
frequent tasks.

3.8 Help and Documentation

• Definition: Help information should be easy to search, focused on tasks, and concise.

• Importance: Effective help can guide users through unfamiliar tasks.

• Example: An FAQ section on a website that answers common questions succinctly.

3.9 Aesthetic and Minimalist Design

• Definition: Interfaces should avoid unnecessary information and focus on essential

content.

• Importance: A minimalist design helps users concentrate on their tasks without

distraction.

• Example: A clean login page that only asks for necessary information (username and
password) without additional clutter.

3.10 Help Users Recognize, Diagnose, and Recover from Errors

• Definition: Error messages should be clear, provide information about the problem, and
suggest solutions.

• Importance: Clear error messages empower users to correct their mistakes.

21
 • Example: A web form that displays a clear error message when a user enters an invalid
email format, with instructions on how to correct it.

4. Evaluating UIs Using Nielsen and Molich's Guidelines

Steps to Evaluate:

1. Choose a website or app.

2. Test it against Nielsen and Molich's 10 design rules to identify areas for improvement.

Example:

To evaluate the COMSATS University website based on Nielsen and Molich's 10 design
guidelines, we can break down each guideline and assess how the site performs in terms of
usability and user experience. Below is the evaluation:

1. Visibility of System Status

• Assessment: The COMSATS University website provides feedback about its status
effectively. For instance, when users fill out forms (like application forms), they receive
confirmation messages once their submissions are processed. Loading indicators and
progress bars are also used when accessing different sections.

2. Match Between System and the Real World

• Assessment: The website uses familiar language and terminology relevant to students
and academic institutions, such as "Programs," "Admissions," and "News." This aligns
well with users' expectations and makes navigation intuitive.

3. User Control and Freedom

• Assessment: Users can easily undo or redo actions, particularly in form submissions
where they can edit their inputs before final submission. There is also a clear "Cancel"
option in application forms, allowing users to return to previous pages without submitting
information.

4. Consistency and Standards

22
• Assessment: The design is consistent throughout the website. Navigation menus, buttons,
and typography follow a uniform style, ensuring that users can predict how elements will
behave, regardless of the page they are on.

5. Error Prevention

• Assessment: The site includes features to prevent errors, such as form validation for
email addresses and required fields. When users attempt to submit incomplete forms, they
receive prompts to fill out necessary fields before proceeding.

6. Recognition Rather Than Recall

• Assessment: The design minimizes memory load by providing clear navigation and
visible options. Key information, such as course details and faculty contacts, is easily
accessible from various pages, helping users to find what they need without extensive
searching.

7. Flexibility and Efficiency of Use

• Assessment: The website offers features like quick links to popular sections (e.g.,
admission criteria, course catalog), enhancing efficiency for frequent users. However, a
more robust search feature could improve flexibility for finding specific information.

8. Aesthetic and Minimalist Design

• Assessment: The design is relatively minimalist, with a clean layout and sufficient white
space, allowing users to focus on content. However, certain sections could benefit from
less clutter and more focus on essential information.

9. Help Users Recognize, Diagnose, and Recover from Errors

• Assessment: Error messages are mostly clear and helpful. For example, when users enter
incorrect login details, the system informs them what went wrong and provides steps to
recover or reset their passwords.

10. Help and Documentation

23
 • Assessment: The website includes a "Contact Us" section where users can find
assistance. However, there is limited in-depth documentation or help available online,
which could be improved to better support users seeking guidance.

Topic Covered

• Definition of Usability
• Characteristics of Usable Products
i. Effectiveness
ii. Efficiency
iii. Satisfaction
• Nielsen and Molich's 10 User Interface Design Guidelines
i. Visibility of System Status
ii. Match Between System and Real World
iii. User Control and Freedom
iv. Consistency and Standards
v. Error Prevention
vi. Recognition Rather Than Recall
vii. Flexibility and Efficiency of Use
viii. Help and Documentation
ix. Aesthetic and Minimalist Design
x. Help Users Recognize, Diagnose, and Recover from Errors
• Evaluating User Interfaces Using Nielsen and Molich's Guidelines

Slide 4-Conceptual Model

Human-Computer Interaction (HCI) Overview

HCI focuses on how people interact with computers and technology. It has evolved to include a
wide range of devices and activities, not just traditional desktop computers.

Key Goals of Interaction Design

24
 1. Make Work Effective, Efficient, and Safer:

o Example: A medical software interface that minimizes errors during medication

administration.

2. Improve Learning and Training:

o Example: Interactive e-learning platforms like Duolingo that make language

learning engaging.

3. Provide Enjoyable Entertainment:

o Example: Video games that offer immersive experiences and engaging storylines.

4. Enhance Communication and Understanding:

o Example: Tools like Slack or Zoom that facilitate remote collaboration.

5. Support New Forms of Creativity and Expression:

o Example: Digital art applications like Procreate that allow artists to create and
share their work easily.

Understanding the Problem Space

When designing a new product, consider:

1. What do you want to create?

o Example: A mobile app for fitness tracking.

2. What are the assumptions?

o Example: Users will want real-time feedback on their workouts.

3. Will it achieve what you hope it will?

o Example: If the app provides meaningful insights, it can help users improve their
fitness.

Framework for Analyzing the Problem Space

• Identify Problems with Existing Products:

25
 o Example: Current fitness apps may not provide accurate data or may be too
complex to use.

• Why do you think there are problems?

o Example: Users might find the interface cluttered or confusing.

• Why do you think your proposed ideas might be useful?

o Example: A simple, user-friendly design can enhance user experience.

• How would you see people using it with their current way of doing things?

o Example: Users might currently log workouts on paper or use complicated

spreadsheets.

• How will it support people in their activities?

o Example: The app can help users track their progress and set goals more
effectively.

• Will it really help them?

o Example: If it motivates users to exercise more consistently, then yes!

Example: WAP Services by Cell Phone Companies

Assumptions Made:

1. Users want to be informed of up-to-date news wherever they are:

o Reasonable: Many people appreciate having news accessible on the go.

2. Users want to interact with information on the move:

o Reasonable: Mobile access is essential in today's fast-paced world.

3. Users are happy using a very small display with a restricted interface:

o Not Reasonable: Many users find small screens frustrating for extended use.

4. Users will be happy doing things on a cell phone that they normally do on their PCs:

26
 o Partially Reasonable: Some tasks can be done on phones, but not all users prefer
it.

From Problem Space to Design Space

• Understanding the Problem Space helps in determining the interface design, behaviors,
and functionalities of the product.

• Conceptual Model Development: Create a clear idea of how the product will function
and how users will understand it.

Conceptual Models

Definition: A conceptual model is an overview of how a system works, described in a way

that users can easily understand.

Importance:

• The design should focus on how users will perceive and interact with the system, not how
designers think it should work.

Types of Conceptual Models

1. Activity-Based Models

Focus on user actions and interactions with the system.

Examples:

• Giving Instructions:

o Users tell the system what to do.

o Example: A voice assistant like Siri or Google Assistant where you say, “Set a
timer for 10 minutes.”

• Conversing:

o Interacting with the system as if having a conversation.

o Example: Chatbots that provide customer support by answering questions in

natural language.
27
 • Manipulating and Navigating:

o Users perform actions on virtual objects.

o Example: Dragging and dropping files on a computer desktop to organize them.

• Exploring and Browsing:

o Users navigate through information flexibly.

o Example: Browsing a website with links and multimedia content.

2. Object-Based Models

Use analogies from the physical world to help users understand the system.

Examples:

• Star Interface:

o Based on familiar office items like folders and files.

o Example: The desktop interface on Windows or MacOS.

• Spreadsheet:

o Similar to a physical ledger, allowing for easy computation and interaction.

o Example: Microsoft Excel, where rows and columns represent data.

Detailed Discussion of Activity-Based Models

1. Giving Instructions

• Definition: Users instruct the system directly through commands.

• Efficiency: Ideal for repetitive tasks.

• Example: A user might use a command line to execute a batch file for processing data.

2. Conversing

• Definition: Users interact using natural language.

• Pros: Makes technology less intimidating.

28
 • Cons: Misinterpretation of user commands can lead to confusion.

• Example: A travel booking site where users can ask questions like, “Find me flights to
Paris.”

3. Manipulating and Navigating

• Definition: Users interact with virtual objects through physical actions.

• Characteristics:

o Direct Manipulation (DM): Users can see and directly interact with objects.

o WYSIWYG (What You See Is What You Get): The interface reflects the final
output.

• Advantages: Quick learning and immediate feedback.

• Disadvantages: Limited to certain tasks that can be represented by physical actions.

• Example: Graphic design software where users can drag images, resize them, and edit
directly on the canvas.

4. Exploring and Browsing

• Definition: Users navigate through structured information.

• Example: Online shopping sites like Amazon, where users can browse through
categories and filter products.

Conclusion: No "Best" Conceptual Model

• Different models serve different needs:

o Direct Manipulation: Best for design-related tasks (e.g., graphic design).

o Instructions: Good for repetitive actions (e.g., data entry).

o Conversational: Helpful for specific audiences (e.g., children, seniors).

• Hybrid Models: Combining approaches can enhance user experience but may require
additional learning.

29
 Topics Covered in this Chapter
1. Human-Computer Interaction (HCI) Overview

o Examines user interaction with technology beyond desktop systems.

2. Key Goals of Interaction Design

o Make work effective, improve learning, provide entertainment, enhance

communication, and support creativity.

3. Understanding the Problem Space

o Identify product goals, assumptions, and potential solutions.

4. From Problem Space to Design Space

o Transitioning problem analysis into interface design and functionality.

5. Conceptual Models

o Overview of how systems work, focusing on user understanding.

6. Types of Conceptual Models

o Activity-Based Models: Giving instructions, conversing, manipulating, and

browsing.

o Object-Based Models: Using real-world analogies (e.g., desktop interfaces,

spreadsheets).

7. Conclusion

o Different models fit different user needs; hybrid models can enhance experiences.

Slide 5-Interface Metaphor

Interface Metaphors

30
Interface metaphors are design elements that draw parallels between a computer interface and a
familiar physical entity, helping users understand and navigate the digital space.

Characteristics of Interface Metaphors

• Similar to Physical Entities: The interface is designed to resemble a real-world object

but possesses unique properties.

o Example: The desktop metaphor in operating systems like Windows, where the
screen resembles a physical desk with files, folders, and a recycling bin.

• Based on Activity, Object, or Both: Metaphors can be focused on actions (activity-

based) or on objects (object-based).

o Example: A web portal that mimics a shopping mall experience (activity-based),

allowing users to browse and select items as they would in a physical store.

Benefits of Interface Metaphors

1. Easier Learning of New Systems:

o Users can leverage their existing knowledge to grasp new concepts.

o Example: A calendar app that visually represents days and months similar to a
physical calendar.

2. Understanding the Underlying Conceptual Model:

o Metaphors help users form mental models of how the system works.

o Example: Using a trash can icon for deleting files, which helps users understand
the concept of discarding items.

3. Increased Accessibility:

o Metaphors can open up technology to diverse users by making it more intuitive.

o Example: Touchscreen interfaces that resemble physical gestures (like swiping)

make it easier for non-tech-savvy users to interact.

Problems with Interface Metaphors

31
 1. Breaking Conventional and Cultural Rules:

o Some metaphors might not align with users' cultural norms or expectations.

o Example: Placing a recycle bin on the desktop may confuse users unfamiliar
with the digital metaphor of recycling.

2. Constraining Designer Creativity:

o Metaphors can limit designers in conceptualizing innovative solutions.

o Example: Relying too heavily on a folder metaphor may prevent the exploration
of more efficient ways to organize digital files.

3. Conflict with Design Principles:

o Certain metaphors may not follow established usability principles.

o Example: A complex web interface that mimics a physical store but lacks clear
navigation may lead to user frustration.

4. Forcing Users into Metaphorical Thinking:

o Users may struggle if they need to adapt to the metaphor rather than intuitively
understanding the system.

o Example: Users might struggle with a metaphor that requires them to think of
digital actions in terms of physical processes, like dragging files instead of simply
selecting and deleting.

Conceptual Models

From Interaction Mode to Interaction Style

1. Interaction Mode: Refers to what the user is doing while interacting with the system.

o Examples:

▪ Instructing: Providing commands to the system.

▪ Talking: Engaging in voice interactions.

32
 ▪ Browsing: Navigating through information.

2. Interaction Style: The type of interface used to support the interaction mode.

o Examples:

▪ Speech: Using voice commands to control the system (e.g., Google

Assistant).

▪ Menu-Based: Selecting options from a list (e.g., dropdown menus in a

software application).

▪ Graphical: Using visual elements like icons and buttons (e.g., mobile app
interfaces).

Interaction Styles

Different interaction styles can be used depending on user needs and the nature of the task:

• Command-Line Interface: Users type commands (e.g., Linux terminal).

• Speech Recognition: Users speak to interact with systems (e.g., Siri).

• Data Entry: Users input information through forms (e.g., online surveys).

• Form Fill-in: Users fill out structured forms (e.g., registration forms).

• Graphical User Interface (GUI): Users interact with visual elements (e.g., Windows
operating system).

• Web Interfaces: Interacting through web browsers (e.g., e-commerce websites).

• Pen Interfaces: Using a stylus for input (e.g., tablets like iPad).

• Augmented Reality: Overlaying digital information on the real world (e.g., Pokémon
Go).

• Gesture-Based: Users control systems through physical gestures (e.g., Microsoft

Kinect).

Choosing an Interaction Style

33
When selecting an interaction style, consider:

• User Requirements and Needs: Understand the audience and their preferences.

• Budget and Constraints: Evaluate available resources.

• Technology Suitability: Ensure the chosen technology is appropriate for the task.

Interaction Paradigms

Interaction paradigms are overarching frameworks that inform how users interact with
technology. They evolve over time and often include innovative approaches.

Examples of New Paradigms:

1. Ubiquitous Computing: Computing integrated seamlessly into the environment,

enabling constant connectivity.

o Example: Smart home devices that allow users to control lighting and appliances
from their smartphones.

2. Pervasive Computing: Similar to ubiquitous computing but emphasizes the availability

of computing resources everywhere.

o Example: Wearable health devices that monitor fitness and health metrics
continuously.

3. Tangible Bits: Physical representations of digital information that users can manipulate.

o Example: Interactive installations that use physical blocks to control digital

elements on a screen.

4. Augmented Reality (AR): Blending digital content with the real world.

o Example: Using AR apps to visualize furniture in a room before purchasing.

5. Attentive Environments: Smart environments that respond to user presence and actions.

o Example: Classrooms that adjust lighting and temperature based on the number
of occupants.

34
 6. Transparent Computing: Systems that work in the background without requiring user
intervention.

o Example: Context-aware systems that automatically adjust device settings based

on location.

Notable Examples:

• BlueEyes (IBM): Affective computing that recognizes human emotions and adapts
accordingly.

• Cooltown (HP): Ubiquitous computing project that explores integrating technology into
everyday environments.

Summary Points

• A thorough understanding of the problem space is crucial for effective interaction

design.

• Developing a conceptual model is a fundamental aspect of this process.

• Interaction modes and interfaces help in structuring how to approach design.

• Interaction styles are specific types of interfaces that support various modes.

• Interaction paradigms inspire new conceptual models and approaches.

Viewpoints in HCI Design

1. Design Model: The designer’s understanding of how the system should function.

2. User’s Model: The user’s mental model of how the system works based on interaction
experience.

3. System Model: The actual functioning of the system, including its capabilities and
limitations.

Knowledge in the Head and in the World

1. Imprecise Knowledge: Users often work with incomplete knowledge, relying on

environmental cues.

35
 o Example: Knowing that a gear lever must be in a specific position to start a car.

2. Cultural Constraints: Cultural norms can influence user behavior and expectations.

o Example: The expectation to turn screws clockwise to tighten them.

3. Memory Types:

o Declarative Knowledge: Facts and information (e.g., "New York is a big city").

o Procedural Knowledge: Skills and how-to (e.g., playing basketball).

o Memory Limitations: Short-term memory can handle limited information (7±2),

while long-term memory is less constrained but requires organized retrieval
methods.

Memory Techniques:

• Reminding: Using external cues to recall information.

o Example: Setting reminders in a calendar app for important events.

• Natural Mappings: Designing interfaces that intuitively reflect actions.

o Example: A stovetop where the controls correspond directly to the burners they
operate.

Topics Covered in this Chapter

1. Interface Metaphors

2. Benefits of Interface Metaphors

3. Problems with Interface Metaphors

4. Conceptual Models

5. Interaction Mode vs. Interaction Style

6. Interaction Styles

7. Choosing an Interaction Style

36
 8. Interaction Paradigms

9. Viewpoints in HCI Design

10. Knowledge in the Head and in the World

11. Memory Techniques

Slide 6-Interaction
Why Study Paradigms?

Concerns:

• Development of Usable Interactive Systems: Understanding how to design systems that

users can effectively and efficiently interact with.

• Usability Measurement: Finding methods to evaluate how usable a system is.

Importance:

• The history of interactive system design reveals insights and frameworks for creating
usable designs.

What are Paradigms?

• Definition: Predominant theoretical frameworks or scientific worldviews that influence

how we understand and approach various domains, including Human-Computer
Interaction (HCI).

• Examples:

o Physics Paradigms: Aristotelian (geocentric view), Newtonian (classical

mechanics), Einsteinian (relativity).

• HCI History: Understanding the evolution of paradigms helps trace shifts in how
humans interact with computers.

Paradigms of Interaction

37
 • Shifts in Human-Computer Relationship: New computing technologies lead to
changing perceptions of how users interact with computers.

Initial Paradigm:

• Batch Processing: Early computing where tasks were processed in batches without user
interaction during execution.

Example Paradigm Shifts:

1. Batch Processing:

o Example: Early computers processing data in batches, leading to impersonal and

delayed interactions.

2. Time-Sharing:

o Example: In the 1960s, systems allowed multiple users to interact with a single
computer simultaneously (e.g., J.C.R. Licklider's work).

3. Networking:

o Example: Emergence of connected systems allowing communication and data

sharing between multiple users.

4. Graphical Displays:

o Example: Introduction of visual interfaces for interaction, improving usability.

5. Direct Manipulation:

o Example: Dragging and dropping files instead of typing commands.

6. Personal Computing:

o Example: The rise of personal computers in the 1970s, allowing individual users
to interact with machines directly.

7. World Wide Web:

o Example: The advent of the Internet revolutionized how information is accessed

and shared.
38
 8. Ubiquitous Computing:

o Example: Integration of computing into everyday objects, making technology

seamless and less obtrusive.

In-Depth Paradigm Descriptions

Time-sharing:

• Historical Context:

o Rapid technological growth in the 1940s-50s led to the need for sharing
computing resources.

o Example: Multiple users accessing a mainframe simultaneously using terminals.

Programming Toolkits:

• Augmenting Human Intellect:

o Douglas Engelbart's work led to the development of tools enabling users to build
complex systems easily.

o Example: Engelbart’s 1968 demonstration showcased collaborative tools

enhancing productivity.

Personal Computing:

• Power and Simplicity:

o Papert’s LOGO programming language introduced children to graphics

programming, emphasizing ease of use.

o Example: Kay’s Dynabook concept envisioned a powerful personal computer for

individual use.

Window Systems and WIMP Interface:

• Task Management:

o Windows allow users to manage multiple tasks simultaneously.

39
 o Example: The Xerox Star introduced a commercial windowing system with
icons, menus, and pointers.

Metaphors

• Teaching Technique:

o Metaphors relate computing tasks to real-world activities, aiding understanding.

o Examples:

▪ LOGO's turtle to visualize movement.

▪ Desktop metaphor for file management.

• Problems:

o Some tasks may not fit into existing metaphors, leading to cultural biases or
misunderstandings.

Direct Manipulation:

• Characteristics:

o Described by Shneiderman in 1982, it emphasizes visibility, feedback,

reversibility, and correctness.

o Example: Apple Macintosh’s WYSIWYG interface allowed users to see changes

in real-time.

Language vs. Action:

• Differences:

o Direct manipulation replaces language commands with actions.

o Example: Programming by example combines actions with language-based

commands.

Hypertext:

• Origins:

40
 o Vannevar Bush's "memex" concept envisioned a system to manage vast
information.

o Example: Nelson's hypertext systems allow non-linear browsing of documents,

foundational for the modern web.

Multimodality:

• Definition:

o Emphasizes using multiple communication channels (visual, auditory, etc.)

simultaneously.

o Example: Speech recognition combined with touch interfaces.

Computer Supported Cooperative Work (CSCW):

• Evolution:

o Recognizes the importance of social interactions in computing.

o Example: Email as a primary tool for collaborative work.

The World Wide Web:

• Transformation:

o Marked by the introduction of universal protocols (e.g., HTTP) and markup

languages (e.g., HTML).

o Example: Rapid growth of web-based information access reshaped the

information economy.

Agent-based Interfaces:

• Evolution:

o Move from traditional command interfaces to intelligent systems that act on user
behalf.

o Example: Virtual assistants like Siri or Alexa utilize natural language processing
to interact with users.
41
Ubiquitous Computing:

• Philosophy:

o Mark Weiser’s vision of making technology “disappear” into everyday life.

o Example: Smart home devices that seamlessly integrate into daily routines.

Sensor-based and Context-aware Interaction:

• Human Context Recognition:

o Systems that recognize physical phenomena to adapt interactions.

o Example: Smart thermostats adjusting temperature based on user location and

preferences.

Summary Points

• Understanding Problem Space: Critical for designing effective interactions.

• Developing Conceptual Models: Fundamental to interaction design.

• Interaction Modes and Interfaces: Help in conceptual model development.

• Interaction Styles: Specific types of interfaces used for interaction.

• Interaction Paradigms: Frameworks guiding the evolution of interaction design.

Viewpoints

• Design Model: How designers envision the interaction.

• User's Model: How users perceive and interact with the system.

• System Model: How the system is structured to facilitate interactions.

Knowledge in the Head and in the World

• Declarative Knowledge: Facts that can be stated (e.g., “New York is a big city”).

• Procedural Knowledge: Knowledge of how to perform tasks (e.g., playing basketball).

Constraints

42
 • Natural Constraints: Designed to guide user behavior (e.g., how to use a lever).

• Cultural Constraints: Norms that shape user expectations (e.g., turning screws
clockwise).

Memory

• Short-term Memory: Limited capacity (7±2) for immediate recall.

• Long-term Memory: Vast capacity, organized for retrieval but takes time to access.

• Memory Techniques: Using cues and reminders (e.g., putting keys in visible places).

Topics Covered in this Chapter

1. Why Study Paradigms?

2. What are Paradigms?

3. Paradigms of Interaction

4. Initial Paradigm: Batch Processing

5. Example Paradigm Shifts

6. In-Depth Paradigm Descriptions

o Time-sharing

o Programming Toolkits

o Personal Computing

o Window Systems and WIMP Interface

o Metaphors

o Direct Manipulation

o Language vs. Action

o Hypertext

o Multimodality

43
 o Computer Supported Cooperative Work (CSCW)

o The World Wide Web

o Agent-based Interfaces

o Ubiquitous Computing

o Sensor-based and Context-aware Interaction

7. Summary Points

8. Viewpoints

9. Knowledge in the Head and in the World

10. Constraints

11. Memory

Slide 7-Interaction Paradiagms

Human-Computer Interaction (HCI) and Interaction Styles

Human-Computer Interaction (HCI) is the study and design of how people interact with
computers and other technological systems. A crucial aspect of HCI is the interaction style,
which defines how users communicate with a system and how the system responds. Different
interaction styles influence the user's experience and effectiveness when using software or
hardware.

Key Interaction Styles

1. Command Line Interface (CLI)

o Description: Users interact with the system by typing text commands into a
console. The interface displays the text in a line format, hence the name
"command line."

44
 o Example: The Terminal or Command Prompt where users can enter commands
like cd (change directory) or ls (list files).

o Pros:

▪ Efficient for experienced users who can memorize commands.

▪ Allows for complex operations with concise commands.

o Cons:

▪ Requires memorization of commands, which can be challenging for

novices.

▪ High error rates due to syntax sensitivity and lack of visual cues.

▪ Frustration from cryptic error messages when commands fail.

2. Menu Selection

o Description: Users select options from a visual list of items, often using a mouse
or keyboard. This style includes hierarchical menus, pop-up menus, and even
voice menus.

o Example: A dropdown menu in a software application like Microsoft Word.

o Pros:

▪ Users are provided with cues, making it easier to recognize options rather
than recall commands.

▪ Effective for users with little training.

o Cons:

▪ Can be too rigid for experienced users who prefer faster access to
functions.

▪ Poorly designed menus can confuse users if options are not distinct.

Guidelines for Designing Menu-Based Interactions:

45
 o Organize menus based on task flow.

o Use self-explanatory titles and group items meaningfully.

o Avoid lengthy menus and keep names short.

o Maintain consistency in layout and terminology.

3. Form-Fill Interfaces

o Description: Interfaces that require users to input data through fields, often in a
structured format.

o Example: Online forms for signing up for newsletters or submitting complaints.

o Pros:

▪ Structured input can gather extensive information efficiently.

o Cons:

▪ Text entry can be difficult on mobile devices due to small screens.

Guidelines for Designing Form-Fill Interfaces:

o Use meaningful labels above the fields.

o Provide clear instructions and group fields logically.

o Offer error messages promptly and indicate required fields.

4. Direct Manipulation

o Description: Users interact with visible objects on the screen through direct
actions such as dragging and dropping.

o Example: Moving files in a graphical user interface (GUI) by dragging them from
one folder to another.

o Pros:

▪ Intuitive and easy to learn, as users can see the results of their actions
immediately.

46
 ▪ Reduces anxiety since actions are easily reversible.

o Cons:

▪ May require more screen space for graphical objects.

5. Gestural Interaction

o Description: Users interact with the system using gestures, which can include
touch gestures (on touch screens) and air gestures (without touching the screen).

o Example: Pinching to zoom in/out on a touchscreen or swiping to navigate

between screens.

o Types:

▪ Touch Gestures: Includes tapping, dragging, and pinching.

▪ Air Gestures: Includes swiping or waving hands in front of a sensor.

o Pros:

▪ Natural interaction style that mimics human social communication.

▪ Can enhance user engagement and satisfaction.

6. Other Interaction Technologies

o Voice Interaction: Users give commands through speech (e.g., virtual assistants
like Siri or Google Assistant).

o Stylus/Pen: Handwriting or drawing on digital surfaces, popular in tablets.

o Gaze Gesture: Eye-tracking technology allows users to interact based on where

they look.

o Virtual and Augmented Reality: Immersive experiences where users can

manipulate objects in a three-dimensional space.

Conclusion

47
The choice of interaction style significantly affects the user experience. Understanding these
styles enables designers to create systems that cater to user needs, ensuring ease of use and
accessibility while considering the context in which the system will be used.

Topics Covered in this Chapter

1. Human-Computer Interaction (HCI)

2. Key Interaction Styles

o Command Line Interface (CLI)

o Menu Selection

o Form-Fill Interfaces

o Direct Manipulation

o Gestural Interaction

o Other Interaction Technologies

3. Conclusion

Slide 8-PACT
PACT Framework Overview

1. People

• Understanding Users: Designers must have a deep understanding of the people who will
use the system. This includes their physical, psychological, and social characteristics.

• Physical Differences: Variations in height, weight, and sensory abilities must be

considered. For example, short-sighted individuals may require larger fonts or higher
contrast on screens.

48
• Psychological Differences: Memory, attention spans, and cognitive abilities vary among
users. Designers need to accommodate users with poor memory by providing intuitive
navigation and clear signage.

• Social Differences: Cultural factors can influence how users interpret technology. For
instance, icons that are positive in one culture may be negative in another.

2. Activities

• User Tasks: Designers should analyze the activities that users wish to undertake. This
can include everything from sending text messages on a mobile phone to typing legal
documents in a law office.

• Changing Nature of Activities: Technological advancements often change the nature of

user activities. For instance, the evolution of email has transformed from plain text to rich
media, allowing for more interactive communication.

3. Context

• Situational Factors: Understanding the context in which activities occur is crucial. For
example, a teenager may use a mobile phone to send texts while commuting, whereas a
secretary will use Microsoft Word in a professional office setting.

• Environmental Influences: The physical environment, such as lighting and noise, can
affect how users interact with technology. Designing for specific contexts enhances
usability and user experience.

4. Technology

• Understanding Tools: Knowledge of the interactive technologies available is essential.

For example, the development of film technology from silent films to immersive cinema
experiences illustrates how technological advancements can enhance user activities.

• Usability Considerations: Ergonomics plays a critical role in technology design. For

instance, an ergonomically designed keyboard considers hand placement and comfort,
which can significantly impact user experience.

Examples of Physical Differences in Design

49
• Ergonomics: The design of a keyboard that supports wrist positioning reflects an
understanding of physical differences among users. An ergonomic keyboard
accommodates natural hand posture to reduce strain and fatigue.

• Inclusivity in Design: Designing ATMs or ticket machines with larger buttons and
screen contrast can help users with visual impairments or reduced dexterity.

Psychological Differences and Design

• Memory and Attention: Users with strong memory skills may navigate websites easily,
while those with weaker memory require explicit instructions and cues. For instance, a
complex spreadsheet application like Microsoft Excel must provide clear labeling (e.g.,
ticks and crosses) to cater to diverse user interpretations.

• Cultural Sensitivity: The cross-cultural implications of design elements, such as icons

and color coding, must be considered to avoid misinterpretation.

Changing Nature of Technology

• Film Technology: The evolution from silent films with live narration to advanced digital
formats has transformed the movie-watching experience, illustrating how technology
shapes user activities.

• Telephony: The way telephony has changed, from traditional landlines to smartphones,
exemplifies the impact of technology on communication activities.

Memory

Overview

• Understanding Human Capability: Designing usable interactive systems requires an

understanding of human capabilities, particularly memory and attention.

• Role of Psychology: Psychology has focused on understanding these capabilities, which

are essential for human action in the world.

Memory Insights

50
• Goldfish Analogy: If humans had a memory span of three seconds, life would be chaotic.
Memory enables learning, language, art, and culture.

• Complex Structure: Memory is not merely an information store; it has a complex

structure with several components.

Components of Memory

1. Sensory Stores:

o Includes visual and auditory stores that hold information briefly.

2. Working Memory:

o Has limited capacity and is used for immediate tasks.

3. Long-Term Memory:

o Essentially unlimited capacity and can hold information for long periods.

Transition from Sensory Memory to Short-Term Memory

• Attention Mechanism: Information transfers from sensory memory to short-term

memory through attention, such as focusing on a conversation amid background noise.

Working Memory Example

• Digit Recall:

o Average memory capacity allows recalling 5 to 9 digits.

o Chunking can help increase recall ability (e.g., remembering "0092 51 2289920"
by grouping numbers).

Chunking

• Memory Limits: Humans can typically remember 7 ± 2 chunks of information at a time.

• ATM Design Issue: Old ATM designs led users to leave without their cards after
receiving cash, indicating that task completion can lead to premature disengagement.

Long-Term Memory

51
• Knowledge Repository: Long-term memory is a repository for all knowledge with slow
access and slow decay, if any.

• Recall Cues: Humans struggle to remember unrelated facts; cues and context can aid
memory recall.

Mental Models

• Definition: Mental models are individuals' understanding of systems, shaped by

interaction and observation.

• Importance of Mental Models: Poor mental models can hinder recovery from errors;
effective design should foster correct mental models.

Social Differences

• Diverse User Goals: Users have different motivations and goals when interacting with
systems.

• Novice vs. Expert: Design considerations should account for varying levels of
knowledge between novice and expert users.

Activities/Tasks

• Activity Complexity: Activities can range from simple tasks to complex activities;
designers must consider these characteristics.

Task Analysis

• Purpose: Understanding user tasks involves analyzing:

o What users are doing.

o Their objectives.

o The methods they use.

Example: Cleaning House

• Considerations:

o Temporal Aspects: Frequency and timing of activities.

52
 o Cooperation and Complexity: Interaction with others.

o Safety Critical: Implications of failure.

Context

• Importance of Context: Activities occur in a context that includes physical, social, and
organizational aspects.

Physical Environment

• Factors:

o Location and accessibility of devices (e.g., ATM).

o Conditions like temperature, noise, and cleanliness.

Social Context

• Considerations:

o User interaction dynamics.

o Effects of workplace pressures and cooperation.

Organizational Context

• Impact of Technology: Integration of technology within existing structures is crucial to

avoid discarding systems.

Technologies

• Input Devices: Secure and safe data entry methods; designers must consider
functionality and space constraints on devices.

Examples:

• Light Pen: Used for direct interaction with screen content.

• Mouse Variants:

o Mac One-Button Mouse: Simplicity in operation.

53
 o Microsoft Two-Button Mouse: Includes a scroll wheel.

Output Technologies

• Perceptual Abilities: Rely on vision, hearing, and touch for content display, with screens
being fundamental.

Communication

• Tech Integration: Effective communication between users and technology includes

bandwidth and speed considerations.

Content Focus

• Functional vs. Content Systems: Some systems prioritize functional performance, while
others focus on delivering detailed content.

Topics Covered in this Chapter

1. PACT Framework Overview

o People

o Activities

o Context

o Technology

2. Examples of Physical Differences in Design

3. Psychological Differences and Design

4. Changing Nature of Technology

5. Memory

o Overview

o Memory Insights

o Components of Memory

54
 o Transition from Sensory Memory to Short-Term Memory

o Working Memory Example

o Chunking

o Long-Term Memory

o Mental Models

6. Social Differences

7. Activities/Tasks

o Task Analysis

8. Context

o Physical Environment

o Social Context

o Organizational Context

9. Technologies

o Input Devices

o Output Technologies

o Communication

10. Content Focus

Slide 9- Gestalt Principles

Visual Perception

Definition and Overview

• Perception refers to the process of acquiring and interpreting information from the
environment through our sensory organs—mainly our eyes, ears, and fingers.

55
 • The eye serves as the primary input channel for those with normal eyesight, guiding
attention and focus.

• Visual perception is crucial for extracting meaning from light, enabling recognition and
understanding of various visual stimuli, such as objects, environments, and interfaces.

Functions of Visual Perception

• Allows recognition of environments (e.g., a room or a user interface element like the
Windows XP 'start' button).

• Facilitates understanding of alerts or notifications by interpreting visual cues.

Gestalt Laws

Definition

• The term Gestalt, from German, translates to “shape,” “form,” or “whole.”

• The Gestalt Laws of Perception help explain how the human eye perceives objects and
visual elements, particularly their relationships and arrangements.

Importance for User Interface Design

• As UI designers, understanding these laws enhances our ability to communicate concepts

and relationships effectively within our applications.

Core Principle

• When presented with complex visual information, our minds recognize whole forms
rather than individual parts, leading to an understanding that is more than the sum of its
parts.

Key Gestalt Principles

1. Figure-Ground

o Definition: Objects are perceived as either the figure (main focus) or the ground
(background).

56
 o Importance: Helps determine what elements require immediate attention and
what can be ignored.

o Example: In a cluttered interface, foreground elements should stand out against

the background to minimize distraction.

2. Similarity

o Definition: Elements that share similar characteristics (color, shape, size) are
perceived as related.

o Importance: Creates visual cues that help users understand relationships and
structure within an interface.

o Example: Similar color buttons imply related functionalities in a web application.

3. Proximity

o Definition: Objects that are closer together are perceived as related, regardless of
their differences.

o Importance: Closeness can override color and shape distinctions, creating groups
in users’ perceptions.

o Example: Clusters of icons or buttons positioned closely will be seen as a group,

emphasizing their association.

4. Uniform Connectedness

o Definition: Elements connected by uniform visual properties (like lines or shapes)

are perceived as related.

o Importance: Enhances the perception of groups and relationships, reducing

cognitive load.

o Example: A connected line of buttons visually implies that they function

together.

5. Continuation

57
 o Definition: Elements arranged on a line or curve are perceived as related.

o Importance: Our eyes tend to follow lines or curves, linking visual elements
along that path.

o Example: Navigation menus arranged in a curve or line help users follow and
comprehend their options.

6. Common Fate

o Definition: Elements that move together are perceived as belonging to the same
group.

o Importance: Useful in animations or transitions within interfaces, guiding user

attention.

o Example: When scrolling through a list, items that move together signal their
association.

7. Closure

o Definition: We tend to perceive incomplete shapes as complete, filling in gaps

based on context.

o Importance: Aids in recognizing letters or patterns even when partially obscured,

enhancing user comprehension.

o Example: A broken circle still appears complete, helping users quickly identify
the shape.

8. Symmetry & Order

o Definition: Objects are perceived as symmetrical and balanced, even if parts are
missing.

o Importance: Creates a sense of harmony and structure, facilitating quick

information processing.

o Example: Symmetrical layouts in design help users navigate and understand

content better.

58
 9. Focal Point

o Definition: Elements that stand out due to contrast or emphasis draw the viewer’s
attention.

o Importance: Highlighting critical information guides user focus effectively.

o Example: A brightly colored button on a dull background will attract user

interaction.

Practical Examples and Applications

• Figure-Ground: In a busy webpage, ensure buttons are prominent against the

background for clarity.

• Similarity: Use consistent colors for related functionalities to communicate relationships.

• Proximity: Group related tools or options in toolbars or menus to enhance usability.

• Uniform Connectedness: Connect related form fields with borders or background colors
to show they belong together.

• Continuation: Design a sidebar that visually connects items in a linear fashion to imply a
process or order.

• Common Fate: In interactive maps, ensure elements that move together are grouped to
enhance user understanding.

• Closure: Use logos or icons that imply completeness, even if they are abstract or
incomplete.

• Symmetry & Order: Design interfaces with balanced layouts to instill confidence and
comfort in users.

• Focal Point: Utilize contrasting colors for call-to-action buttons to drive user
engagement.

By applying these Gestalt principles, designers can create intuitive and visually pleasing
interfaces that enhance user experience and interaction.

59
 Topics Covered in this Chapter
1. Visual Perception

o Definition and Overview

o Functions of Visual Perception

2. Gestalt Laws

o Definition

o Importance for User Interface Design

o Core Principle

3. Key Gestalt Principles

o Figure-Ground

o Similarity

o Proximity

o Uniform Connectedness

o Continuation

o Common Fate

o Closure

o Symmetry & Order

o Focal Point

4. Practical Examples and Applications

Slide 10-Screen Design

Basic Principles of HCI Screen Design

60
 1. Ask:

o What is the user doing?

Example: If users are filling out a billing form, ensure that the necessary fields are
present and that the flow of information is logical.

2. Think:

o What information, comparisons, order?

Example: Consider what information needs to be shown together. For instance,
showing item details alongside pricing in an online shopping cart.

3. Design:

o Form follows function.

Example: A search bar should be placed prominently at the top of a webpage
because users expect to find it there.

Available Tools for Screen Design

• Grouping of Items: Group related items together to make the interface intuitive.

o Example: In an e-commerce checkout process, group all billing information fields

separately from delivery details.

• Order of Items: Present items in a logical sequence that matches user expectations.

o Example: Display personal details first, followed by payment details, and then
review order summary.

• Decoration (Fonts, Boxes, etc.): Use boxes or lines to highlight groups of related items
but avoid excessive decoration that distracts from the content.

o Example: Use bold headings to distinguish between sections like "Billing

Information" and "Shipping Information".

• Alignment of Items: Align items to aid readability and scanning.

o Example: Align text to the left for easy reading in English. This helps users scan
quickly through lists.

61
 • White Space: Use white space effectively to prevent clutter and help users focus on
content.

o Example: Leave sufficient space between form fields to make them less
overwhelming.

Grouping and Structure

• Logical Grouping: Items that are logically related should be grouped together
physically.

o Example: Group billing details like name, address, and credit card information
together.

Order of Groups and Items

• Natural Order: Arrange items in a way that feels intuitive to users.

o Example: Place a "Submit" button at the end of a form so that users naturally click
it after entering their information.

• Use Boxes and Space: Utilize visual boxes or whitespace to delineate different sections.

o Example: Use a box around the order summary in an e-commerce app to separate
it visually from the payment options.

Decoration

• Use of Boxes: Group logical items in boxes to create a visual hierarchy.

o Example: Use a bordered box for "Shipping Details" to make it stand out.

• Fonts for Emphasis: Use different fonts or sizes to emphasize headings, but don’t go
overboard.

o Example: Use a larger, bold font for "Order Summary" compared to regular text
for the items listed below it.

Alignment

1. Text Alignment:

62
 o Align text to the left for languages that read left to right.

o Example: Align book titles or author names on a library catalog page to the left
for easy scanning.

2. Names and Scanning:

o Make surnames easy to find by using consistent formats.

o Example: List names in the format "Last Name, First Name" to facilitate surname
scanning.

3. Numbers:

o Align numerical data for easier comparison, either by decimal points or right
alignment for integers.

o Example:

532.56

256.32

15

73.95

Multiple Columns

• Scanning Across Gaps: Ensure that users can easily scan through columns by
minimizing gaps.

o Example: Use leaders (dots) to connect items and their corresponding values in a
list.

• Greying: Use subtle greying of alternate rows to help users track their position.

o Example: Alternate the background colors of rows in a table to distinguish

between them.

Physical Controls

63
 • Grouping of Items: Use logical groupings for physical controls.

o Example: In a microwave, group temperature and time controls in proximity to

enhance usability.

• Order of Items: Arrange controls in a logical sequence that matches the workflow.

o Example: On a washing machine, place the cycle selector before the start button.

User Action and Control

1. Entering Information:

o Use a logical layout for forms, ensuring labels and input fields are aligned.

o Example: Align label lengths to avoid confusion.

2. Knowing What to Do:

o Ensure it’s clear what is active and passive within the interface.

o Example: Underlined text for hyperlinks signals clickability.

3. Affordances:

o Design elements should suggest their usage.

o Example: A button should look "clickable" (3D effect, shadow) to indicate it can
be pressed.

Presenting Information

1. Aesthetics and Utility:

o Strive for visually pleasing designs that also serve a functional purpose.

o Example: A clean layout with consistent colors and fonts can enhance user
satisfaction.

2. Color and 3D:

o Use colors and 3D effects sparingly to avoid overwhelming the user.

64
 o Example: Use a muted color palette for a professional look.

Localisation & Internationalisation

1. Globalisation:

o Ensure that your interface can adapt to different cultures and languages.

o Example: Use a resource database to swap out text rather than hardcoding it.

2. Cultural Sensitivity:

o Be aware that symbols and colors may have different meanings in different
cultures.

o Example: In some cultures, a checkmark (✓) may signify acceptance, while a

cross (✗) may signify rejection, so use them accordingly.

Topics Covered in this Chapter

1. Basic Principles of HCI Screen Design

o Ask: Understanding User Tasks

o Think: Information and Comparisons

o Design: Form Follows Function

2. Available Tools for Screen Design

o Grouping of Items

o Order of Items

o Decoration (Fonts, Boxes, etc.)

o Alignment of Items

o White Space

3. Grouping and Structure

o Logical Grouping

65
 o Order of Groups and Items

4. Decoration

o Use of Boxes

o Fonts for Emphasis

5. Alignment

o Text Alignment

o Names and Scanning

o Numbers

o Multiple Columns

6. Physical Controls

o Grouping of Items

o Order of Items

7. User Action and Control

o Entering Information

o Knowing What to Do

o Affordances

8. Presenting Information

o Aesthetics and Utility

o Color and 3D

9. Localisation & Internationalisation

o Globalisation

o Cultural Sensitivity

66
 Slide 11-Universal Design
Universal Design

Overview of Universal Design

Universal Design refers to the process of creating products and environments that are usable by
everyone, regardless of their abilities, disabilities, age, or cultural background. It seeks to
accommodate human diversity by making products and services accessible in all circumstances.

Seven Principles of Universal Design

1. Equitable Use

o Definition: The design should be useful and marketable to people with diverse
abilities.

o Example: An elevator with both push buttons and voice command options allows
individuals with mobility impairments as well as those with visual impairments to
use it effectively.

2. Flexibility in Use

o Definition: The design should accommodate a wide range of individual

preferences and abilities.

o Example: A smartphone that can be used via touchscreen, voice commands, or

physical buttons allows users to choose their preferred method of interaction.

3. Simple and Intuitive Use

o Definition: The design should be easy to understand, regardless of the user's

experience, knowledge, language skills, or current concentration level.

o Example: A web application with clear icons and minimal text instructions
allows users to navigate without extensive guidance.

4. Perceptible Information

67
 o Definition: The design should communicate necessary information effectively to
the user, regardless of ambient conditions or the user's sensory abilities.

o Example: A traffic light that provides both visual (red/green lights) and auditory
signals (beeping sound for pedestrians) to indicate when it’s safe to cross.

5. Tolerance for Error

o Definition: The design should minimize hazards and the adverse consequences of
accidental or unintended actions.

o Example: A software program that prompts users to confirm before deleting a file
prevents accidental loss of important information.

6. Low Physical Effort

o Definition: The design should be usable efficiently and comfortably, with

minimal fatigue.

o Example: Automatic doors that open with a motion sensor allow users to enter
without needing to push or pull the door.

7. Size and Space for Approach and Use

o Definition: Appropriate size and space should be provided for approach, reach,
manipulation, and use, regardless of the user's body size, posture, or mobility.

o Example: Workstations with adjustable heights accommodate users whether they

are seated in a wheelchair or standing.

Multi-modal Interaction

Multi-modal interaction allows users to interact with a system through various means, enhancing
accessibility and usability.

• Example Inputs:

o Keyboard: Standard input for many applications.

o Mouse: Point-and-click interface for selecting options.

68
 o Voice: Voice commands for hands-free operation (e.g., virtual assistants).

o Gesture: Touch screens and gesture recognition (e.g., swiping on a tablet).

Designing for Diversity

1. Users with Disabilities

• Visual Impairment: Use of screen readers to convert text to speech or Braille displays.

• Hearing Impairment: Captioning audio content for videos ensures accessibility.

• Physical Impairment: Adaptive technology like eye-tracking software to control

devices.

• Speech Impairment: Text-based communication tools to facilitate interaction.

• Dyslexia: Use of fonts and text layouts that are easier to read for individuals with
dyslexia.

• Autism: Designing interfaces that reduce sensory overload and promote clear
communication.

2. Different Age Groups

• Older Adults: Simple interfaces with larger text and high contrast for better readability.

• Children: Interactive learning applications that use graphics and sound for engagement.

3. Cultural Differences

• Designing for Diversity: Recognizing that factors like age, gender, race, and culture can
influence user interaction.

• Example: Using culturally relevant symbols and colors in design to make systems more
relatable.

User Support

User support is crucial for enhancing user experience and helping individuals navigate systems
effectively.

69
Types of User Assistance

1. Help

o Quick answers to specific problems.

o Example: A help button that provides a brief overview of a tool's functionality.

2. Advice

o Guidance on how to use features more effectively.

o Example: Suggestions for improving efficiency in a software application.

3. Support

o Ongoing assistance and resources.

o Example: Access to a community forum for users to ask questions and share
experiences.

Main Types of Help Systems

1. Quick Reference

o A condensed version of information for immediate use.

o Example: Cheat sheets for keyboard shortcuts in software applications.

2. Task-specific Help

o Detailed instructions on how to perform specific tasks.

o Example: A user manual section explaining how to create a new project in a

design software.

3. Full Explanation

o Comprehensive information about a tool or command.

o Example: In-depth guides that include examples and use cases.

4. Tutorial

70
 o Step-by-step guidance for new users.

o Example: Interactive onboarding processes that guide users through features

when they first use the application.

Requirements of User Support

1. Availability: Help should be accessible anytime during user interaction.

o Example: Help menus that can be opened without closing the main application.

2. Accuracy and Completeness: Help content must match actual system behavior.

o Example: Documentation that reflects recent updates to a software tool.

3. Consistency: Help should align with other documentation forms.

o Example: Terminology in the online help system matches printed manuals.

4. Robustness: Help systems should handle errors gracefully.

o Example: Error messages that provide clear guidance on resolving issues.

5. Flexibility: Users should be able to customize their help experience.

o Example: Options to adjust the level of detail in help content.

6. Unobtrusiveness: Help should not disrupt ongoing tasks.

o Example: Context-sensitive help that appears when users hover over an element
rather than blocking the main interface.

Approaches to User Support

1. Command Assistance

o Specific help related to commands.

o Example: UNIX man pages that describe command syntax and options.

2. Command Prompts

o Suggestions for correct command usage.

71
 o Example: Error messages in command-line interfaces that suggest corrections.

3. Context-Sensitive Help

o Help related to the current menu or context.

o Example: Tooltips in Microsoft Office that explain features when hovering over
icons.

4. Online Tutorials

o Interactive guides for learning.

o Example: YouTube video tutorials that demonstrate application features.

5. Online Documentation

o Comprehensive resources available digitally.

o Example: An online wiki that provides detailed user guides for software.

6. Wizards

o Step-by-step tools for completing tasks.

o Example: Microsoft Word’s resume wizard guiding users through creating a

professional resume.

7. Assistants

o Tools that monitor user actions and provide suggestions.

o Example: Eager, a software agent that suggests the next steps in a repetitive task.

Designing User Support Systems

1. Integration: User support should be built into the system from the beginning.

2. Focus on Content and Context: Ensure help content meets user needs.

3. Presentation: Consider how help is requested and displayed.

72
 o Example: Using pop-up windows for help versus displaying it within the main
interface.

4. Implementation Issues: Determine how help will be integrated technically.

o Example: Deciding between structured help files or a database system for storing
help content.

Topics Covered in this Chapter

1. Overview of Universal Design

o Definition and Purpose

o Importance of Accessibility for All

2. Seven Principles of Universal Design

o Equitable Use

o Flexibility in Use

o Simple and Intuitive Use

o Perceptible Information

o Tolerance for Error

o Low Physical Effort

o Size and Space for Approach and Use

3. Multi-modal Interaction

o Various Input Methods

o Enhancing Accessibility and Usability

4. Designing for Diversity

o Users with Disabilities

▪ Visual, Hearing, Physical, Speech Impairments, Dyslexia, Autism

73
 o Different Age Groups

▪ Older Adults and Children

o Cultural Differences

5. User Support

o Importance of User Assistance

o Types of User Assistance

▪ Help, Advice, Support

o Main Types of Help Systems

▪ Quick Reference, Task-specific Help, Full Explanation, Tutorial

6. Requirements of User Support

o Availability

o Accuracy and Completeness

o Consistency

o Robustness

o Flexibility

o Unobtrusiveness

7. Approaches to User Support

o Command Assistance and Prompts

o Context-Sensitive Help

o Online Tutorials and Documentation

o Wizards and Assistants

8. Designing User Support Systems

o Integration into the System

74
 o Focus on Content and Context

o Presentation of Help Content

o Implementation Issues

Slide 12-Data gathering techniques

Identifying Needs and Establishing Requirements

1. What, How, and Why

What is it?

The primary goal of identifying needs and establishing requirements is to understand users' needs
and how these needs translate into system requirements. This is crucial in the development of
any new system.

Aims of this activity:

1. Understanding User Needs:

o Example: In developing a new email client, it's essential to understand that users
need a simple way to organize their emails. Therefore, users may require features
such as folders, labels, and filters to manage their email efficiently.

2. Producing Stable Requirements:

o Example: After identifying that users want to be able to categorize emails, a stable
requirement may be: "The system shall allow users to create, edit, and delete
email folders."

Why is Requirements Activity Necessary?

• Failure often occurs due to unclear objectives and requirements.

• Successful projects frequently stem from well-defined requirements.

75
 • Example: A project that fails to define that a user must log in before accessing personal
information could lead to serious security issues.

2. Establishing Requirements

Definition of a Requirement:

A requirement is a statement about an intended product that specifies what the product should
do.

Characteristics of Requirements:

• What do users want?

o Example: Users want a mobile app to track their fitness.

• What do users need?

o Example: Users need the app to provide real-time tracking of their workouts and
progress.

• Clarification of Requirements:

o Example: “The app should load quickly.” Here, clarification is needed: What is
considered "quick"? This could be defined as "less than 3 seconds".

Input and Output:

• Input: A requirements document (may include stakeholder interviews, survey results).

• Output: A set of stable, defined requirements.

3. Types of Requirements

3.1 Functional Requirements

These define what the system should do.

Examples:

• User authentication (e.g., "The system shall allow users to create an account and log in
using a username and password.")

76
 • Online ordering (e.g., "The system shall enable users to add items to a shopping cart and
proceed to checkout.")

• Data entry (e.g., "The system shall allow users to input their personal information to
create a profile.")

3.2 Non-Functional Requirements

These specify how the system performs a function, including constraints on the system and its
development.

Examples:

• Usability: "The system should be intuitive, allowing users to complete tasks without
extensive training."

• Performance: "The system must handle up to 10,000 concurrent users without

performance degradation."

• Reliability: "The system should be available 99.9% of the time."

4. Types of Requirements (Continued)

4.1 Data Requirements

These specify the type, size, and accuracy of the required data.

Example:

• In a financial application, "The system must maintain accurate stock prices updated at
least every minute."

4.2 Environmental Requirements

These describe the conditions in which the product will operate.

Examples:

• Physical: "The application should function effectively in environments with low

bandwidth."

77
 • Social: "The application should support collaborative features for teams working
remotely."

4.3 User Requirements

These define the characteristics of the intended user group.

Example:

• "The majority of users are expected to be non-technical, requiring a simplified interface

with tooltips and guided tutorials."

4.4 Usability Requirements

These specify how user-friendly the system should be.

Example:

• "The system must allow new users to complete registration within 2 minutes."

5. Data Gathering Techniques

To establish user requirements, various data gathering techniques can be utilized:

5.1 Questionnaires

• Purpose: Collect quantitative and qualitative data from a large group.

• Example: “On a scale of 1-10, how satisfied are you with our current accounting
software?”

5.2 Interviews

• Purpose: Gain deeper insights into user needs and opinions.

• Example: A structured interview might include questions like, "What features do you use
the most in your current system?"

5.3 Group Interviews (Focus Groups)

• Purpose: Understand diverse opinions and facilitate discussion.

78
 • Example: Bringing together a group of users to discuss what they like and dislike about
an existing system.

5.4 Direct Observation

• Purpose: Understand how users interact with the system in real-time.

• Example: Observing employees as they use a legacy accounting software to identify pain
points.

5.5 Studying Documentation

• Purpose: Gather information on existing systems, regulations, and procedures.

• Example: Reviewing current user manuals and regulatory requirements for financial
reporting.

6. Data Interpretation and Analysis

After gathering data, interpreting and analyzing it is crucial.

Steps in Data Interpretation:

1. Initial Interpretation:

o Document initial thoughts immediately after data collection.

o Example: While interviewing users, jot down observations about their frustrations
with the current system.

2. Deeper Analysis:

o Analyze data for patterns and insights.

o Example: If multiple users mention difficulty finding specific features, this

indicates a usability issue.

7. Task Description and Task Analysis

7.1 Task Description

Describing user tasks can clarify existing work practices and guide the design of new systems.

79
Common Types:

1. Scenarios: Informal narratives that describe how a user might interact with the system.

o Example: "Sarah logs into her account and searches for her favorite products."

2. Use Cases: Detailed descriptions of interactions between the user and the system.

o Example: "The user adds an item to the cart and proceeds to checkout."

3. Essential Use Cases: Abstract descriptions that avoid technical details.

o Example: "The user initiates a search."

7.2 Task Analysis

Analyzing user tasks involves understanding what users do, why, and how.

Example:

• In a bakery, analyzing how a user places an order might involve documenting the steps
they take: browsing the menu, selecting items, customizing orders, and making payment.

8. Hierarchical Task Analysis (HTA)

Hierarchical Task Analysis (HTA) is a systematic method for breaking down complex tasks into
smaller, more manageable subtasks. This approach is particularly valuable in Human-Computer
Interaction (HCI) as it allows designers to understand user goals and the necessary steps to
achieve them.

Key Features of HTA

• Task Breakdown: HTA involves decomposing a task into subtasks, which can further be
divided into sub-sub-tasks. This breakdown continues until the tasks become simple,
observable actions.

• User Goals: The process starts with a clear user goal. From this goal, the main tasks
needed to achieve it are identified.

80
 • Plans: These are structured sequences of tasks and subtasks that describe how a task
might be performed in practice. Plans can be represented in both textual and graphical
formats.

• Observable Actions: HTA focuses on physical actions rather than abstract or cognitive
processes, which can include non-software related activities.

Example 1: Cleaning a House

User Goal: Clean the house.

Task-Subtask Hierarchy:

1. Get the vacuum cleaner out

2. Fix the appropriate attachment

3. Clean the rooms

o 3.1 Clean the hall

o 3.2 Clean the living room

o 3.3 Clean the bedroom

4. Empty the dust bag when full

5. Put the vacuum cleaner and attachments away

Plans:

• Plan 0: Perform tasks in the order of 1-2-3-5.

o If the dust bag gets full, execute task 4.

• Plan 3: Choose any of the subtasks 3.1, 3.2, or 3.3 in any order, depending on which
rooms need cleaning.

Graphical HTA Representation:

81
Example 2: Borrowing a Book from the Library

User Goal: Borrow a book from the library.

Task-Subtask Hierarchy:

1. Go to the library

2. Find the required book

o 2.1 Access library catalogue

o 2.2 Access the search screen

o 2.3 Enter search criteria

o 2.4 Identify required book

o 2.5 Note location

3. Go to shelf and get book

82
 4. Take book to checkout counter

Plans:

• Plan 0: Perform tasks in the order of 1-3-4.

o If the book is not on the expected shelf, do 2-3-4.

• Plan 2: Execute tasks in the order of 2.1-2.4-2.5. If the book is not identified, do 2.2-2.3-
2.4-2.5.

This textual HTA outlines the necessary steps for the task.

Graphical HTA Representation:

Topics Covered in this Chapter

1. What, How, and Why

o Understanding the Goals of Identifying Needs

o Aims of the Activity

▪ Understanding User Needs

83
 ▪ Producing Stable Requirements

o Importance of Requirements Activity

2. Establishing Requirements

o Definition of a Requirement

o Characteristics of Requirements

▪ User Wants vs. Needs

▪ Clarification of Requirements

o Input and Output of Requirements Establishment

3. Types of Requirements

o Functional Requirements

▪ Definition and Examples

o Non-Functional Requirements

▪ Definition and Examples

o Data Requirements

▪ Definition and Examples

o Environmental Requirements

▪ Definition and Examples

o User Requirements

▪ Definition and Examples

o Usability Requirements

▪ Definition and Examples

4. Data Gathering Techniques

o Overview of Various Techniques

84
 ▪ Questionnaires

▪ Interviews

▪ Group Interviews (Focus Groups)

▪ Direct Observation

▪ Studying Documentation

5. Data Interpretation and Analysis

o Steps in Data Interpretation

▪ Initial Interpretation

▪ Deeper Analysis

6. Task Description and Task Analysis

o Task Description

▪ Common Types: Scenarios, Use Cases, Essential Use Cases

o Task Analysis

▪ Understanding User Tasks

7. Hierarchical Task Analysis (HTA)

o Overview of HTA

o Key Features of HTA

▪ Task Breakdown

▪ User Goals

▪ Plans

▪ Observable Actions

o Examples of HTA

▪ Example 1: Cleaning a House

85
 ▪ Example 2: Borrowing a Book from the Library

Slide 13-Data gathering Detail

1. What is Data Collection?

• Definition: Data collection is the systematic process of gathering information to answer a

specific research problem.

• Purpose: To obtain necessary information after defining the research issue and creating a
research design.

2. Steps in Data Collection

When collecting data, researchers need to consider several factors:

1. Resources Available:

o Assess the tools, budget, and time available for data collection.

o Example: A researcher might have a limited budget for travel but has access to
online survey tools.

2. Criteria for Reliability:

o Determine how to ensure the data collected is trustworthy and credible.

o Example: Using established scales or measures that have been tested for
reliability.

3. Method Selection:

o Decide which data collection method is most suitable.

o Example: A study on consumer behavior might use surveys rather than

interviews to reach a larger audience.

4. Analysis and Reporting:

o Plan how the data will be analyzed and presented.

86
 o Example: Using statistical software to analyze survey results and create visual
reports.

5. Evaluator Skill:

o Ensure the person collecting data has the necessary skills.

o Example: A researcher should be trained in conducting interviews to avoid bias.

3. Methods of Data Collection

A. Primary Data Collection Methods

1. Interviews:

o Definition: Direct conversations between the researcher and the respondent.

o Types:

▪ Structured Interviews: Pre-decided questions.

▪ Example: A job interview where candidates answer specific

questions.

▪ Unstructured Interviews: No fixed questions; more conversational.

▪ Example: A researcher discussing a topic with a community

leader.

▪ Focused Interviews: Concentrate on a specific experience.

▪ Example: Discussing a patient’s treatment journey with a doctor.

▪ Clinical Interviews: Explore deep feelings and motivations.

▪ Example: A therapist asking a patient about their life experiences.

▪ Group Interviews: Involve 6 to 8 participants discussing a topic.

▪ Example: Brainstorming product ideas with a focus group.

▪ Individual Interviews: One-on-one discussions.

87
 ▪ Example: An expert providing insights on industry trends.

2. Surveys & Questionnaires:

o Definition: A set of written questions sent to individuals to gather responses.

o Example: A customer satisfaction survey sent to clients via email.

o Types of Questions:

▪ Open-ended Questions: Respondents answer in their own words.

▪ Example: “What features do you value most in our product?”

▪ Close-ended Questions: Respondents choose from given options.

▪ Example: “How satisfied are you with our service? (1- Very
dissatisfied, 5- Very satisfied)”

3. Observation:

o Definition: Watching subjects in their natural environment.

o Example: A researcher observes shopping behaviors in a grocery store.

4. Focus Groups:

o Definition: Guided discussions with a small group to explore opinions and

attitudes.

o Example: A marketing team gathers a group to discuss reactions to a new

advertisement.

5. Experiments:

o Definition: Controlled tests to measure outcomes based on specific variables.

o Example: Testing two different sales strategies to see which one results in more
purchases.

4. Steps for an Effective Interview

1. Prepare Interview Schedule:

88
 o Create a list of questions in advance.

o Example: Prepare questions about career development for a job interview.

2. Select Subjects/Key Respondents:

o Choose individuals relevant to your research.

o Example: Selecting participants who have used a specific product.

3. Conduct the Interview:

o Engage with the respondents and ask your questions.

o Example: Actively listening to responses and asking follow-up questions.

4. Analyze and Interpret Data:

o Review the responses to derive insights.

o Example: Categorizing responses into themes to identify trends.

Advantages of Interviews:

• In-depth information can be collected.

• Skilled interviewers can build rapport and trust.

• Allows for clarification of responses.

Disadvantages of Interviews:

• Can be time-consuming and expensive.

• Risk of interviewer bias affecting responses.

• Possible respondent bias due to social desirability.

5. Questionnaires

Definition: A questionnaire is a structured set of questions aimed at gathering information from

individuals.

Steps in Designing a Questionnaire:

89
1. Decide on Information Required:

o Identify what information is essential for the research.

o Example: Understanding customer preferences for a new product line.

2. Define Target Respondents:

o Determine the demographics of the individuals you want to reach.

o Example: Targeting young adults aged 18-25 for a survey on social media usage.

3. Choose the Method(s) of Reaching Respondents:

o Options include personal interviews, focus groups, or mailed questionnaires.

o Example: Using an online survey tool for efficiency.

4. Decide on Question Content:

o Craft questions that are relevant and engaging.

o Example: Starting with easy questions to warm up respondents.

5. Develop Question Wording:

o Use clear and concise language.

o Example: Instead of "What are your thoughts on our product?" use "What do you
think about our product?"

6. Organize Questions:

o Arrange them in a logical order from general to specific.

o Example: Start with demographic questions followed by product-specific

questions.

7. Check Length of Questionnaire:

o Keep it concise (ideally 30-45 minutes to complete).

o Example: Limit the number of questions to avoid fatigue.

90
 8. Pre-test the Questionnaire:

o Test it on a small group to identify any issues.

o Example: Conduct a pilot test with friends or colleagues.

9. Finalize the Survey Form:

o Ensure it is visually appealing and easy to follow.

o Example: Use headings and bullet points to improve readability.

Advantages of Questionnaires:

1. Cost-effective: Often cheaper, especially online.

o Example: Using Google Forms for free surveys.

2. Practical: Easy to distribute to a large audience.

o Example: Sending out surveys via email.

3. Quick Results: Gather data rapidly using online tools.

o Example: Analyzing survey responses in real-time.

4. Scalable: Reach a vast audience efficiently.

o Example: Distributing a survey globally through social media.

5. Comparability: Data can be used for comparison across different studies.

o Example: Benchmarking customer satisfaction across multiple locations.

6. Easy Analysis: Many tools allow straightforward data analysis.

o Example: Excel or survey software for statistical analysis.

7. No Time Constraints: Respondents can complete at their own pace.

o Example: Online surveys can be filled out at the respondent's convenience.

8. Coverage of Topics: Can explore multiple aspects of a subject.

91
 o Example: A survey could cover customer demographics, preferences, and buying
behavior.

Disadvantages of Questionnaires:

1. Dishonest Answers: Respondents may not provide truthful responses.

o Example: Answering positively due to social pressure.

2. Unanswered Questions: Some respondents might skip questions.

o Example: Leaving open-ended questions blank.

3. Differences in Understanding: Misinterpretation can occur without guidance.

o Example: Ambiguous wording leading to varied interpretations.

4. Hard to Convey Feelings: Difficult to capture emotional responses.

o Example: Lacking insight into how a respondent truly feels about a product.

5. Accessibility Issues: Not all platforms are user-friendly for everyone.

o Example: Providing options for visually impaired users.

6. Survey Fatigue: Respondents may tire of too many surveys or long questionnaires.

o Example: Receiving frequent survey requests leading to less engagement.

Summary of Differences Between Questionnaires and Interviews

Aspect Questionnaire Interview

Meaning Series of written questions Formal conversation

Nature Objective Subjective

Questions Closed-ended Open-ended

Information Provided Factual Analytical

Order of Questions Fixed Flexible

92
 Aspect Questionnaire Interview

Cost Economical Expensive

Time Informant's own time Real-time

Communication One to many One to one

Observation Method

Definition:
Observation is a method of data collection that relies on watching subjects in their natural
environment without any manipulation. It focuses on gathering data through the researcher’s
visual senses, observing behaviors and interactions as they occur.

Example:
A researcher might observe employees in a workplace to see how they interact with each other
and their clients. For instance, they might note if employees collaborate well or if they struggle
with the available resources.

Advantages of the Observation Method:

1. Directness:
Data is collected in real-time, capturing behaviors as they happen.

Example: Observing customers in a store as they make purchasing decisions.

2. Natural Environment:
Data reflects true behavior in natural settings, providing authentic insights.

Example: Watching students interact in a classroom setting without any intervention.

3. Longitudinal Analysis:
Observations can be made over extended periods to track changes.

Example: Studying employee behavior over several months to assess changes in morale.

4. Non-verbal Behavior:
Effective at capturing non-verbal cues that surveys might miss.

93
Example: Noting body language or facial expressions during a client meeting.

Disadvantages of the Observation Method:

1. Lack of Control:
Observers have limited control over external factors affecting behaviors.

Example: Unforeseen events, like a fire drill, can influence observed behavior.

2. Difficulties in Quantification:
Observations often rely on subjective perceptions, making it hard to quantify data.

Example: Rating a student's engagement based on observation rather than measurable tests.

3. Small Sample Size:

In-depth observations typically involve fewer subjects, limiting generalizability.

Example: Observing a single class versus multiple classes across different schools.

4. No Opportunity to Learn Past:

Observers cannot uncover historical information or intentions.

Example: Observing a person’s behavior doesn’t reveal their motivations or past experiences.

Focus Groups

Definition:
A focus group consists of a small, diverse group of participants (6-12 individuals) discussing a
specific topic guided by a facilitator. It’s used to gather qualitative insights about perceptions and
experiences.

Example:
A company might organize a focus group to explore customer reactions to a new product line.

Advantages of Focus Groups:

1. Quick Setup:
Focus groups can be organized and conducted relatively quickly.

Example: Scheduling a session with a group of customers within a few days.

94
 2. Group Dynamics:
The interaction among participants can generate richer discussions than one-on-one
interviews.

Example: Participants may build on each other’s ideas, leading to deeper insights.

3. Insight into Complex Topics:

Useful for exploring topics that are hard to measure quantitatively.

Example: Understanding emotional responses to branding strategies.

Disadvantages of Focus Groups:

1. Facilitator Bias:
The facilitator’s influence can skew discussions.

Example: A strong facilitator might unintentionally steer the conversation towards their biases.

2. Dominating Participants:
A few individuals may overshadow the conversation, limiting input from quieter
members.

Example: An outspoken participant might monopolize the discussion.

3. Time-Consuming Analysis:
Analyzing focus group data can be labor-intensive and requires careful planning.

Example: Transcribing and coding discussions for themes.

4. Limited Individual Validity:

Focus group findings may not reflect individual opinions accurately.

Example: The group’s consensus may differ from a person’s private views.

Experiments

Definition:
Experiments involve manipulating one or more independent variables to observe the effect on
dependent variables, allowing researchers to establish cause-and-effect relationships.

95
Example:
In a clinical trial, researchers might change the dosage of a medication (independent variable) to
observe its impact on patient recovery (dependent variable).

Advantages of Experimental Research:

1. High Control Levels:

Researchers can control variables effectively.

Example: In a lab setting, all external influences can be minimized.

2. Variation Utilization:
Different variations of an experiment can be tested.

Example: Testing multiple drug formulations in a clinical trial.

3. Robust Results:
Experiments can lead to strong, reliable findings.

Example: A drug trial that shows significant improvement in patient outcomes.

4. Applicability Across Fields:

Experimental methods are versatile and can be applied in various disciplines.

Example: From agricultural studies to psychological assessments.

Disadvantages of Experimental Research:

1. Artificial Situations:
Results may not generalize well to real-world settings.

Example: Lab conditions can create responses that differ from everyday life.

2. Time and Cost:

Experiments can be resource-intensive and lengthy.

Example: Longitudinal studies require extended periods and funding.

3. Potential for Errors:

Experimental design can introduce biases or errors.

96
Example: If participants are not randomly assigned, it could affect results.

4. Feasibility Issues:
Some experiments may be unethical or impractical.

Example: Testing harmful substances on human subjects is generally not feasible.

Secondary Data Sources

Definition:
Secondary data is information that has already been collected for a purpose other than the current
research project. It is typically less costly and less time-consuming to obtain than primary data.

Example:
Using census data from a government report to analyze population trends rather than conducting
a new survey.

Types of Secondary Data Sources:

Internal Sources:

• Sales Records: Data from previous sales can inform future marketing strategies.

• Marketing Activity Reports: Historical data on past marketing campaigns can guide
current efforts.

• Distributor Reports: Feedback from distributors can reveal market trends.

• Customer Feedback: Analysis of past customer reviews or complaints can inform

product improvements.

External Sources:

• Journals: Academic or industry journals can provide insights on trends and research.

• Books: Literature reviews and historical data can enhance understanding.

• Magazines/Newspapers: Articles and reports can provide context and current events.

• Libraries/Internet: Extensive databases and archives can be explored for relevant

information.

97
Advantages of Secondary Data:

• Cost-effective: Collecting secondary data typically requires fewer resources than primary
data collection.

• Time-efficient: Data is readily available, speeding up the research process.

Disadvantages of Secondary Data:

• Incompleteness: Secondary data may not perfectly align with current research questions.

• Timeliness: Older data may not accurately reflect the current context.

Data Classification

Definition:
Classification is the process of organizing data into categories based on shared characteristics.

Functions of Data Classification:

1. Bulk Management: Helps manage large sets of data by organizing it into meaningful
categories.

2. Simplification: Makes complex data easier to understand and analyze.

3. Facilitates Comparison: Enables comparisons across different data sets.

4. Statistical Analysis Preparation: Prepares data for statistical methods and analysis.

Types of Classification:

1. Geographical Classification:
Data organized based on geographical location.

Example: Food grain production categorized by states in India.

State Total Food Grains (thousands tons)

Andhra 1093.90

Bihar 12899.89

98
 State Total Food Grains (thousands tons)

Karnataka 1834.78

2. Chronological Classification:
Data organized based on time intervals.

Example: Monthly household expenditure records over a year.

3. Qualitative Classification:
Data categorized based on qualities or characteristics.

Example: Classifying individuals as literate or illiterate.

4. Quantitative Classification:
Data classified based on measurable characteristics.

Example: Student weight classified into ranges.

Weight (kg) No. of Students

40-50 60

50-60 50

60-70 28

5. Alphabetical Classification:
Data arranged in alphabetical order.

Example: Population density of states in India sorted alphabetically.

Scale of Measurement

Definition:
Measurement scales categorize data based on specific characteristics and allow researchers to
analyze it effectively. The four scales are nominal, ordinal, interval, and ratio.

1. Nominal Scale:

o Definition: Categorizes data without any order.

99
 o Example: Gender classification.

▪ M (Male) = 1

▪ F (Female) = 2

2. Ordinal Scale:

o Definition: Ranks data in order but does not specify the degree of difference.

o Example: Restaurant ratings.

▪ 1 = Excellent

▪ 2 = Good

▪ 3 = Average

▪ 4 = Poor

3. Interval Scale:

o Definition: Measures the difference between values but lacks a true zero point.

o Example: Temperature scales (Celsius, Fahrenheit).

4. Ratio Scale:

o Definition: Contains all the properties of an interval scale, but also has a true zero
point.

o Example: Weight measurement.

▪ Categories could be 0-54 kg, 55-75 kg, etc.

Data Preparation Process

Definition:
Data preparation is the process of cleaning and organizing raw data to make it suitable for
analysis. It includes various steps to ensure data quality and relevance.

Steps in Data Preparation:

100
 1. Data Collection:
Gather raw data from various sources, ensuring it meets research objectives.

Example: Collecting survey responses, observational notes, and secondary data.

2. Data Cleaning:
Identify and rectify errors, inconsistencies, and missing values.

Example: Removing duplicates and correcting typos in survey responses.

3. Data Transformation:
Standardize data formats and units to facilitate comparison.

Example: Converting all currency values to a single currency for analysis.

4. Data Integration:
Combine data from different sources into a unified dataset.

Example: Merging survey data with sales records for comprehensive analysis.

5. Data Reduction:
Reduce data volume by selecting relevant features or aggregating data.

Example: Summarizing customer feedback into key themes rather than analyzing each comment.

Tables

Definition:

A table is a systematic arrangement of statistical data in rows and columns, designed to clarify
the problem under consideration.

Objectives of Tabulation:

• Conduct investigations.

• Facilitate comparisons.

• Identify omissions and errors in data.

• Optimize space usage.

101
 • Simplify data presentation.

• Serve as a reference for future use.

Parts of a Table:

1. Table Number

2. Title of the Table

3. Caption and Stubs

4. Body

5. Prefatory or Head Note

6. Footnotes

Types of Tables:

• By Purpose:

o General Purpose Table

o Special Purpose Table

• By Originality:

o Original Table

o Derived Table

• By Construction:

o Simple Table (One-Way)

o Complex Tables (e.g., Two-Way, Three-Way, Manifold Tables)

Examples of Tables:

• Simple Table: Data presented based on a single characteristic.

• Two-Way Table: Data subdivided into two interrelated characteristics.

• Three-Way Table: Data divided based on three interrelated characteristics.

102
 • Manifold Table: Displays multiple interrelated characteristics.

Reliability and Validity Testing

Reliability:

• Definition: Reliability assesses whether data collection techniques and analytical

procedures yield consistent findings across repeated measurements or different
researchers.

• Cronbach’s Alpha:

o Values Interpretation:

▪ > 0.9: Excellent

▪ 0.8 to 0.9: Good

▪ 0.7 to 0.8: Acceptable

▪ 0.6 to 0.7: Questionable

▪ < 0.6: Poor

• Example Analysis:

o Assessing reliability for monetary and non-monetary benefits using Cronbach’s

Alpha.

Validity:

• Definition: Validity evaluates the accuracy of a measure and is determined through

various types of evidence.

• Pearson Correlation: Used to assess the relationship between variables, providing

insights into validity.

Data Analysis

Analysis Procedures:

1. Basic statistical analyses to handle disaggregated data.

103
 2. Use of graphical representations (bar charts, line charts, pie charts) to enhance
understanding.

3. Data organization for various analyses:

o Descriptive Analysis

o Univariate Analysis

o Bivariate Analysis

o Multivariate Analysis

Descriptive Statistics:

• Types:

1. Graphs

2. Measures of Central Tendency (Mean, Median, Mode)

3. Measures of Variability (Range, Variance, Standard Deviation)

Central Tendency Measures:

• Mean: Arithmetic average.

• Median: Middle value in a ranked distribution.

• Mode: Most frequently occurring value.

Variability Measures:

• Range: Difference between highest and lowest values.

• Variance: Degree of variability; average squared deviation from the mean.

• Standard Deviation: Square root of variance, indicating average distance from the
mean.

Determining Sample Size

Steps to Calculate Sample Size:

104
1. For Infinite Populations:

o Formula: S=Z2⋅P(1−P)M2S = \frac{Z^2 \cdot P(1-P)}{M^2}S=M2Z2⋅P(1−P)

o Where:

▪ SSS: Sample size

▪ ZZZ: Z-score based on confidence level

▪ PPP: Population proportion (assumed to be 0.5)

▪ MMM: Margin of error (e.g., 0.05)

o Example Calculation for 95% Confidence Level:

▪ Z=1.96Z = 1.96Z=1.96

▪ Sample Size Calculation yields approximately 384.

2. Adjusting Sample Size for Finite Populations:

o Formula: Adjusted Sample Size=S1+S−1Population\text{Adjusted Sample Size}

= \frac{S}{1 + \frac{S-
1}{\text{Population}}}Adjusted Sample Size=1+PopulationS−1S

o For a population of 100,000:

▪ Adjusted sample size calculation yields approximately 383.

Topic that we covered in this Chapter

Data Collection

Steps in Data Collection

Methods of Data Collection

• Primary Data Collection

• Interviews

• Surveys & Questionnaires

105
 • Observation

• Focus Groups

• Experiments

Steps for an Effective Interview

Questionnaires

Observation Method

Focus Groups

Experiments

Secondary Data Sources

Data Classification

Scale of Measurement

Data Preparation Process

Tables

Reliability and Validity Testing

Slide 14- Task Analysis

1. What is Task Analysis?

Task analysis is a systematic approach used to understand how users accomplish specific tasks
by breaking them down into their fundamental components. The analysis focuses on:

• What People Do: The sequence of actions taken by users to complete a task.

• What Things They Work With: The tools, systems, and objects involved in the task.

• What They Must Know: The knowledge, skills, and information required to perform the
task effectively.

106
Example: Cleaning the House

• Steps Involved:

1. Get the vacuum cleaner out.

2. Fix the appropriate attachments.

3. Clean the rooms.

4. When the dust bag gets full, empty it.

5. Put the vacuum cleaner and tools away.

• Knowledge Required:

o Understanding how vacuum cleaners operate.

o Knowledge of different attachments and their functions.

o Awareness of how to maintain dust bags.

o Familiarity with the layout of rooms in the house.

2. Approaches to Task Analysis

Different approaches can be used for task analysis, including:

• Task Decomposition: Breaking down tasks into smaller, ordered subtasks. This helps to
clarify the workflow and the relationship between different actions.

• Knowledge-Based Techniques: Examining the user's knowledge about the task, how it
is organized, and how it influences their actions.

• Entity/Object-Based Analysis: Analyzing the relationships between objects, actions,

and the people performing them. This helps understand the context and interactions
within the task.

3. General Method for Task Analysis

A typical process for conducting task analysis includes:

1. Observe: Watch users perform the task in a natural setting to gather real-world insights.

107
 2. Collect: Gather unstructured lists of words and actions that describe the task.

3. Organize: Use notation (like flowcharts or diagrams) to structure the collected

information for better clarity and understanding.

4. Differences from Other Techniques

Task analysis differs from other analysis techniques in several ways:

• Systems Analysis vs. Task Analysis:

o Focus: Systems analysis emphasizes the overall system design, while task
analysis zeroes in on individual user tasks and how they fit within the system.

• Cognitive Models vs. Task Analysis:

o Focus: Cognitive models investigate internal mental states and processes,

whereas task analysis concentrates on observable actions and interactions.

• Practiced Unit Task vs. Whole Job:

o Task analysis can provide insights into both specific, practiced tasks and the
broader job roles they fit into.

5. Task Decomposition

Aims:

• To describe the actions people perform.

• To structure these actions within a hierarchy of tasks and subtasks.

• To explain the order and relationships of these subtasks.

Variants:

• Hierarchical Task Analysis (HTA): A structured method to represent tasks visually and
hierarchically.

• Textual HTA Description: A written breakdown of tasks in a hierarchical format.

Example of Hierarchical Task Analysis for Cleaning the House:

108
markdown

Copy code

0. In order to clean the house

1. Get the vacuum cleaner out

2. Get the appropriate attachment

3. Clean the rooms

3.1. Clean the hall

3.2. Clean the living rooms

3.3. Clean the bedrooms

4. Empty the dust bag

5. Put vacuum cleaner and attachments away

6. Plans in HTA

Different types of plans can emerge from HTA:

• Fixed Sequence: A strict order of tasks (e.g., 1.1, then 1.2, then 1.3).

• Optional Tasks: Tasks performed based on certain conditions (e.g., if the pot is full).

• Waiting for Events: Tasks initiated by external events (e.g., when the kettle boils).

• Cycles: Repeated tasks based on ongoing conditions (e.g., while there are empty cups).

• Time-Sharing: Tasks performed simultaneously.

• Discretionary Tasks: Tasks that can be executed in any order.

Example of Plans:

• Plan 0: Execute tasks 1 - 2 - 3 - 5 in that order. When the dust bag gets full, perform task
4.

109
 • Plan 3: Perform any of tasks 3.1, 3.2, or 3.3 in any order, depending on which rooms
need cleaning.

7. Waiting: Task or Plan?

The concept of waiting can be classified as either a task or part of a plan:

• Task: Considered a task if the user is actively engaged (e.g., waiting while doing
something else).

• Plan: Considered part of a plan if the waiting period is defined by an external event (e.g.,
waiting for an alarm).

Example of Waiting:

• Waiting as a Task: "While waiting for the kettle to boil, check emails."

• Waiting as a Plan: "Wait until the alarm rings before starting the next task."

8. Uses of Task Analysis

Task analysis has practical applications in creating manuals and documentation:

Manuals & Documentation Types:

1. Conceptual Manual:

o Based on knowledge or entity-relations analysis.

o Effective for open-ended tasks that require flexible approaches.

2. Procedural Manual:

o Derived from HTA descriptions.

o Suitable for novices, providing step-by-step instructions.

Example of a Procedural Manual for Making Tea:

To Make Cups of Tea:

1. Boil water – see page 2.

110
 2. Empty pot.

3. Make pot – see page 3.

4. Wait 4 or 5 minutes.

5. Pour tea – see page 4.

Page 3 - Making Pot of Tea:

• Warm the pot.

• Put tea leaves in the pot.

• Pour in boiling water.

9. Refining the HTA Description

After creating an initial HTA, it's essential to check and improve it using certain heuristics:

• Paired Actions: Identify related actions (e.g., where to "turn on gas").

• Restructure Tasks: Generate new tasks for clarity (e.g., "make pot" instead of listing
every individual action).

• Balance Task Complexity: Assess if simpler actions can be grouped (e.g., "pour tea" vs.
"making pot").

• Generalize Tasks: Broaden the description for flexibility (e.g., making one cup or
multiple).

Topics Covered in the Chapter

1. Definition of Task Analysis:

o Understanding what task analysis is and its significance in HCI.

2. Components of Task Analysis:

o What people do (actions).

o What things they work with (tools, systems, and objects).

111
 o What they must know (knowledge and skills).

3. Example of Task Analysis:

o Practical example of cleaning the house to illustrate task steps and knowledge
required.

4. Approaches to Task Analysis:

o Task Decomposition: Breaking tasks into ordered subtasks.

o Knowledge-Based Techniques: Analyzing user knowledge.

o Entity/Object-Based Analysis: Understanding relationships between objects and

actions.

5. General Method for Conducting Task Analysis:

o Observation, collection of data, and organization using notation or diagrams.

6. Differences from Other Techniques:

o Comparing task analysis with systems analysis and cognitive models.

7. Task Decomposition Techniques:

o Hierarchical Task Analysis (HTA): Structuring tasks hierarchically.

o Textual HTA Description: Written breakdown of tasks.

8. Types of Plans in HTA:

o Fixed sequence, optional tasks, event-based waiting, cycles, time-sharing, and

discretionary tasks.

9. Waiting: Task vs. Plan:

o Differentiating between waiting as an active task versus waiting as part of a plan.

10. Applications of Task Analysis:

o Creating manuals and documentation.

112
 o Conceptual vs. procedural manuals.

11. Refining HTA Descriptions:

o Heuristics for checking and improving HTA, including paired actions,

restructuring, balancing complexity, and generalizing tasks.

Slide 15- Persona, Scenario and Prototyping

Human-Computer Interaction (HCI)

Overview: HCI is the study and design of how people interact with computers and software. A
user-centered approach is essential, which involves understanding users through tools like
personas and scenarios, and testing ideas with prototypes.

Personas: Understanding Users

1. What are Personas?

o Definition: Personas are fictional characters created to represent different user

types based on research. They help designers empathize with real users.

o Purpose: By using personas, designers ensure that their products meet actual user
needs and preferences.

2. Key Elements of Personas:

o Demographics: Information like age, location, and occupation.

▪ Example: “Sarah, a 28-year-old graphic designer from New York.”

o Pain Points: Challenges or frustrations users face.

▪ Example: “Sarah struggles to find user-friendly design tools.”

o Goals and Motivations: What users want to achieve.

▪ Example: “Sarah aims to create stunning visual content quickly.”

o Technological Expertise: User comfort and skill with technology.

113
 ▪ Example: “Sarah is tech-savvy and enjoys exploring new software.”

o Preferences and Context: Users’ likes and the environment they use the product.

▪ Example: “Sarah prefers dark mode interfaces and works from a coffee
shop.”

3. Persona Development Process:

o User Research: Collect data through interviews, surveys, and observations.

▪ Example: Conduct interviews with potential users to gather insights.

o Data Synthesis: Organize and analyze the collected data.

o Distillation of Key Insights: Identify essential findings that inform the design.

4. Types of Personas:

o Primary Personas: The main users your design targets.

▪ Example: Core users of a design software.

o Secondary Personas: Users with different needs who are still important.

▪ Example: Part-time designers or hobbyists.

o Complementary Personas: Users who can benefit from your product but aren’t
the primary target.

▪ Example: Educators who use the design software for teaching.

Scenarios: Contextualizing User Interaction

1. What are Scenarios?

o Definition: Scenarios are narrative descriptions that outline how personas interact
with a product in specific situations. They help anticipate user needs and
challenges.

2. Scenario Development:

o Identify Goals and Tasks: Understand what your persona wants to achieve.

114
 ▪ Example: “Sarah wants to create a portfolio to showcase her work.”

o Create a Narrative: Describe the user's journey, including their motivations and
outcomes.

▪ Example: “Sarah logs in, selects a template, and customizes it to fit her
style.”

3. Types of Scenarios:

o Simple Scenarios: Focus on one task.

▪ Example: “Sarah creates a single graphic for her Instagram.”

o Complex Scenarios: Involve multi-step tasks or journeys.

▪ Example: “Sarah designs a complete portfolio website with multiple

sections.”

o Edge Cases: Include rare situations that might occur.

▪ Example: “What happens if Sarah loses internet access while editing?”

Extracting Requirements from Scenarios

1. Identifying User Goals: Understand what drives users to engage with your product.

o Example: “Sarah wants an efficient way to present her work.”

2. Extracting Design Requirements: Highlight user actions and pain points to inform
design.

o Example: “The design software should allow offline editing.”

3. Aligning with User Workflows: Visualize how users complete tasks to improve overall
design.

o Example: Map Sarah’s steps from logging in to sharing her portfolio.

Persona-Scenario Alignment

115
 • User Empathy: Aligning personas and scenarios helps designers understand user
motivations and challenges.

• Ideation Catalyst: Insights from personas and scenarios inspire innovative designs.

• Design Validation: Regular testing against personas and scenarios ensures solutions
meet user needs.

• Accelerated Innovation: A deep understanding of users leads to faster design iterations

and successful products.

Persona and Scenario Workshops

1. Preparation: Gather user research data and define workshop goals.

2. Persona Creation: Guide participants in developing data-driven personas.

3. Scenario Writing: Help the team create detailed narratives that uncover user needs.

4. Synthesis and Alignment: Discuss findings and prioritize focus areas for design.

Prototyping: Testing Designs

1. Low-Fidelity Prototypes:

o Definition: Simple, inexpensive models (like sketches) used to test ideas quickly.

o Example: Hand-drawn sketches of a new app layout.

2. High-Fidelity Prototypes:

o Definition: Detailed prototypes that closely resemble the final product.

o Example: An interactive app that users can click through.

Advantages of Prototyping

1. Validate Design Decisions: Test assumptions with real users to identify pain points.

2. Gather Qualitative Insights: Understand user behavior and gather feedback.

3. Iterative Improvement: Refine designs based on user testing.

116
 4. Stakeholder Alignment: Communicate design ideas to gain support.

Integrating GOMS and Prototyping

• GOMS Analysis: Understand user tasks and identify improvements.

• Prototyping: Test designs with users to gather feedback.

• Iterative Refinement: Combine GOMS and prototyping for continuous design

improvement.

Conclusion: Mastering HCI Design

• Empathy-Driven Design: Understand users to create products that meet their needs.

• Iterative Improvement: Continuously refine personas and scenarios based on user

insights.

• Cross-Functional Collaboration: Use personas and scenarios to align your team

towards effective solutions.

Topics that we covered in this Chapter

➢ Understanding Personas
➢ Persona Development Process
➢ Creating Scenarios
➢ Extracting Requirements from Scenarios
➢ Iterative Refinement
➢ Persona-Scenario Alignment
➢ Workshops for Personas and Scenarios
➢ Templates for Personas and Scenarios
➢ Role of Personas and Scenarios in Design Process
➢ GOMS Analysis in HCI
➢ Prototyping in HCI
➢ Prototyping Tools and Techniques
➢ Integrating GOMS and Prototyping

117