1.

INTRODUCTION TO UX FUNDAMENTALS

Design:

 Design is an intentional problem-solving process focused on planning or

making something for a specific use or purpose.

 While “design” is often equated with graphic design or visual design,

design is a vast discipline with many sub disciplines – everything from
industrial design to service design.

 Both user interface (UI) design and user experience (UX) design are
centred on users and ensure that the products and systems meet real
needs and are as intuitive and pleasant as possible to use.

USER INTERFACE (UI) DESIGN:

 User interface (UI) design is focused on the visual design of the interface
through which users interact with a product or system.

 UI design considerations include layout, colours, typography, interaction

design, brand identity, responsiveness, and accessibility.

USER EXPERIENCE (UX) DESIGN:

 User experience (UX) design is focused on the holistic experience around a

product or service, taking into consideration the user, system, and context.

 UX design focuses on the user journey, user research, and deliverables to

document the user experience, such as personas, journey maps, storyboards,
and prototypes.

USER SEGMENTS:

1
  User segments are targeting audience of the product, there can be
multiple user segments based on stakeholder’s project’s requirements and
goals.

Characteristics of good UX:

1. If a product is usable, it means the design, structure and purpose of the

product is clear and easy to use.

2. If a product is equitable, it means a design is helpful to people with diverse

abilities and background.

3. If a product is enjoyable, it means the design delights the user. The design
reflects what the user may be thinking or feeling and creates a positive
connection with them.

4. If a product is useful, that means it solves user problems. In other words ,the
design intentionally solves a user problem that the designer has identified

Commonly used words in UX:

1. UX jingles: short form of information

2. ROI: return of Investment

3. Doorknob: golden data

END USER:

End user is a person or an organisation that uses a product or service, who

consumes the design in regular interactivity.

2. PSYCHOLOGY AND PERCEPTION IN UX

2
 TYPES OF MEMORY:

1. Short term memory

2. Long term memory

i. Short term memory:

Memory refers to the part of the human memory that temporarily holds
and processes information needed for immediate tasks and interactions.
Example: OTP

ii. Long term memory:

In memory where information is stored indefinitely.

i. Procedural memory:

Any skills and actions.

 Password

 Riding a bicycle

 Cooking

ii. Semantic memory:

Storage and recall of general knowledge

 affordance

 signifiers

 mental model mapping

iii. Episodic memory:

Memory that has a story

Miller’s magical numbers:

3
  Miller's Magical Number, often referred to as "The Magical Number
Seven, plus or Minus Two," is a theory proposed by cognitive
psychologist George A. Miller.

 It suggests that the average number of objects an individual can hold

in their short-term memory is about 7, give or take 2.

 In the context of UX design, this implies that users can typically

manage around 5 to 9 items at a time, so designers should avoid
overwhelming users with too many options or pieces of information in
one go. It’s a key principle for creating intuitive and user-friendly
interfaces.

 Example: periodic table, music notes

Placebo:

This is a substance or treatment with no therapeutic effect, given to a patient in

place of a real drug. The placebo effect occurs when a patient experiences a
perceived or actual improvement in their conditions after receiving the placebo, due
to their treatment’s efficiency.

Placebo in web application:

4
  Loading spinner

 Refresh Button

 Reward Bar

 Progression Bar

Nocebo:

This is the opposite of a placebo. It refers to a harmless substance or treatment

that causes negative effects because the patients expects or believes it will cause
harm. The nocebo often occurs when negative expectations lead to a worsening of
symptoms.

Nocebo in web Application:

 Fear

 Stress

 Deceptions

 Perceptions

 Exceptions

Dissonance:

 Cognitive Dissonance is a term introduced by psychologist Leon Festinger in

1957.

 It describes the mental discomfort or stress experienced when a person holds

two or more contradictory beliefs, values or attitudes simultaneously.

5
  This discomfort often motivates individuals to reduce the dissonance by
changing their beliefs, attitudes or behaviours to achieve consistency.

Consonance:

 Consonance refers to the visual and functional harmony within an interface.

 It ensures that all elements of the design work together seamlessly, creating
an aesthetically pleasing and intuitive experience for the user.

DISSONANCE TO CONSONANCE:

1. Change in Behaviour

2. Change in Belief

3. Adding new Cognitions

4. Cancel or trivialize it

3. UX DESIGN PROCESSES & FRAMEWORKS

Problem statement:

Problem Statements are concise descriptions of design problems. It makes clear

what needs to be done in discovery and what’s out of scope. It is also an actionable
summary of the user, their goals, and what you need to solve to meet those goals.

 The background of a problem

 The people affected by the problem

 The impact of the problem on the person/organisation

6
NORMAN’S THREE LEVELS OF DESIGN:

1. Visceral level:

 Set a positive context for every subsequent interaction.

 Users more likely to forgive faults down to the line if the initial
experiences were overwhelmingly positive.

2. Behavioural level:

 Allows users to feel a sense of empowerment.

 Cultivate trust and reliability by creating a direct relation between a

user’s action and expected value.

3. Reflective level:

 Encourage users to share their experiences with others.

 Evoke a sense of pride and identify from using a product that extends
beyond the product itself.

DOUBLE DIAMOND (4d):

 Discover the problem

 Define the problem

 Develop the solutions for the problem

 Deliver the product

7
USER-CENTERED DESIGN PROCESS:

 Understand how the user experiences the product.

 Specify the user’s needs

 Design solutions

 Evaluate the solutions you designed against the user’s needs.

FIVE ELEMENTS OF UX DESIGN:

 Strategy

 Scope

 Structure

 Skeleton

 Surface

SIMPLIFIED UX PROCESS:
 Information

 Analyse

 Organise

 Prototype

 Testing

8
 4. RESEARCH AND ANALYSIS TECHNIQUES

RESEARCH TECHNIQUES:

 Primary:

 Survey

 Interview

 Focus group

 Secondary:

 Books

 Online data

 Authorized research papers

 Statistics and analysis

Contextual research:

 Observation

 Being the user

 Ethnography study

Data analysis:

 Data analysis involves inspecting, cleaning, transforming, and modelling data,

extract useful information, draw conclusions, and support decision-making.

 UX analytics is the measurement of user behaviour on a mobile app or

website in regards to how the overall design of the product affects how users
interact with it.

9
  UX analytics provide designers with actionable insights into how a digital
product’s design can be improved to meet user needs.

5. STRUCTURING CONTENT & INFORMATION

INFORMATION ARCHITECTURE:

 Information architecture is a blueprint, a visual representation of the product’s

infrastructure, features and hierarchy.

 It includes navigations, application functions and behaviours, content and

flows.

User Journey:

Journey of the user from the beginning of a task till the end of it.

 Stage1-opportunity

 Stage 2-touchpoints

 Stage 3-Activities

 Stage 4-Feelings and thoughts

Task flow:

 A task flow is a visual representation of the steps users take to

complete a specific task within an interface.

 It's like a map outlining each interaction and decision point along the
way.

 Understand what the user wants to achieve. For instance, booking a

flight.

10
 Outline each step the user needs to take to accomplish their goal. For
booking a flight, it might start with searching for flights, selecting one,
entering personal details, and making payment.

 Identify any potential issues or bottlenecks within these steps. This

could be anything from a confusing form field to a slow-loading page.

 Streamline the steps to make the process as smooth and intuitive as

possible.

 Example:

11
 6. UX PRINCIPLES AND GUIDELINES

UX laws:

1. Teseler’s law of Incomplete:

 It is also known as “The law of Conversation of complexity.”

 It states that for any system there is a certain amount of complexity which
cannot be reduced.

2. Hick’s Law:

 Also known as Hick-Hyman Law.

 This law states that by increasing the number of choices, the time taken to
decide increases logarithmically, as opposed to exponentially.

12
3. The Von Restorff Effect:

 Also known as Isolation effect.

 Predicts that when multiple similar objects are present, the one that differs
from the rest is most likely to be remembered.

4. Law of Proximity:

 Objects that are near (or) proximate to each other, tend to be grouped
together.

13
5. Scarcity Principle:

 A widely studied phenomenon in social psychology, leads individuals to

ascribe greater value to items they perceive as being scarce (or) limited in
availability.

14
6. Concept of Social Proof:

 Tendency of human beings to follow the actions of others when making

decisions, planning weight on these actions to assume “correct decisions”.

 Social proof can be used to deliver credibility or perspective users and

prompt adoption or acceptance in the design of products and services.

 Social proof helps users feel secure and confident in their decisions,
reducing anxiety and uncertainty.

 Customer testimonials, reviews, and ratings encourage users to take

desired actions, boosting engagement and conversion rates.

 Social proof establishes credibility by showcasing expertise, popularity, or

customer satisfaction, making your product/service more appealing.

7. F-shaped Pattern:

 Eye tracking research shows that people scan webpages and phone
screens in various patterns, one of them being the shape of letter F.

15
8. Reciprocity Principle:

 Humans tend to return good deeds: use this social psychology law in user
interface design to gain users trust and motivate engagement with your
site or app.

9. Decoy Effect:

 The phenomenon whereby adding a third pricing option makes the

consumer change their preference towards an option the seller is trying to
promote.

 Also called “asymmetric dominance effect”

16
10 Usability Heuristics:

17
1. Visibility of System Status:

 Provide clear and timely feedback about system actions.

 Use loading animations, progress bars, and notifications.

 Ensure users know what's happening and when.

2. Match between System and Real World:

 Use intuitive language and concepts.

 Align with user expectations and mental models.

 Make interfaces familiar and easy to understand.

3. User Control and Freedom:

 Provide clear navigation and escape routes.

 Allow users to undo and redo actions.

 Empower users to make decisions.

4. Consistency and Standards:

 Establish consistent design patterns.

 Follow platform and industry conventions.

 Ensure consistency in typography, colours, and layout.

18
5. Error Prevention:

 Anticipate and prevent errors.

 Validate user input.

 Provide warnings and confirmations.

6. Recognition Rather Than Recall:

 Make information easily accessible.

 Use clear labels and icons.

 Minimize cognitive load.

7. Flexibility and Efficiency:

 Provide shortcuts and efficient workflows.

 Cater to diverse user needs.

 Optimize for frequent users.

8. Aesthetic and Minimalist Design:

 Prioritize content over visual clutter.

 Use simple, intuitive designs.

19
  Eliminate unnecessary elements.

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

 Display clear error messages.

 Provide constructive feedback.

 Offer solutions and alternatives.

10. Help and Documentation:

 Provide easily accessible documentation.

 Offer tutorials and guidance.

 Ensure support resources are available.

HUMAN COMPUTER INTERACTION:

1. Visual interaction:

 It involves how users interact with an interface through visual cues and
feedback. It's about making the experience intuitive and engaging.

2. Haptic interaction:

 It refers to using touch feedback to enhance user experience. This can

include vibrations, force feedback, or other tactile sensations. It’s all
about making digital interactions feel more physical and intuitive.

20
 3. Cognitive Interaction:

 It refers to how users think, perceive, and process information when

using an interface.

 It’s about designing experiences that align with natural human cognitive
processes to make interactions intuitive and efficient.

USABILITY TESTING:

 Moderated/Unmoderated

 A/B testing

 Lab testing

 Prototype testing(heatmaps)

 Guerrilla usability testing

 Accessibility testing

21
 7. USER PROFILE & BEHAVIORAL INSIGHTS

Persona:

Persona is defined as characteristics of a person.

 Goals

 Needs

 Motivation

 Frustrations

 Personality Traits

 Maslow’s Hierarchy

PERSONALITY TRAITS:

1. Openness

 Inventive & curious

 Consistent & Cautious

2. Conscientiousness

 Efficient & Organised

 Easy-going & Careless

3. Extraversion:

 Energetic& outgoing

 Solitary & Reserved

22
 4. Agreeableness:

 Friendly & Compassionate

 Analytic & Detached

5. Neuroticism:

 Sensitive & nervous

 Secured & Confident

MASLOW’S HIERARCHY:

Maslow's Hierarchy ranks human needs in 5 tiers:

1. Physiological (basic needs: food, water, shelter)

23
2. Safety (security, stability)

3. Love & Belonging (social connections)

4. Esteem (self-respect, recognition)

5. Self-actualization (personal growth, fulfilment)

The hierarchy suggests that lower-level needs must be met before higher-level
needs can be addressed.

PARETO PRINCIPLE:

 Also called as “80-20 principle”

 If you degrade or reduce the impact of what most users want from you.

24
  80% of the effects of any given process come from 20% of the effort
put into it.

 Example: In remote we use only 20% of buttons but, it needs to others

80% supports.

HOOK MODEL:

TRIGGERS:

1. INTERNAL TRIGGERS:

 Strongly connected with our emotions.

 Moreover, negative emotions serve as a key factor of internal triggers.

2. EXTERNAL TRIGGERS:

 Paid Triggers

 Relationship Triggers

 Earned Triggers

 Owned Triggers

ACTION:

 Any action requires a

 Motivation

 Ability

 Trigger

25
REWARD:

 The Tribe:

o Rewards of the tribe is search for social rewards fuelled by

connectedness with other people.

o Example: Social Media

 The Hunt:

o Rewards of the hunt is the search for material resources and

information.

o Example: Gambling, feed

 The Self:

o Rewards of the self is the search for intrinsic rewards of mastery,

competence, and completion.

o Example: Game Levels

26
EISENHOWER MATRIX

8. VISUAL DESIGN AND INTERACTION

ATOMIC DESIGN TECHNOLOGY:

AFFORDANCE:

 Affordance refers to the properties or cues of an object that suggest

how it should be used. It’s about making the design intuitive so users
can easily understand the actions available to them.

27
  Affordances help users understand how to interact with an interface
element intuitively. For instance, a button appears clickable due to its
3D design or shading.

SIGNIFIER:

 A signifier is a visual, auditory, or tactile indicator that communicates

to users what action they can take with an element, and how they
should interact with it.

 Signifiers can be anything from the shape of a button to an icon or a

label, and they play a crucial role in guiding user behaviour.

 Signifiers make affordances more explicit by clearly showing how an

element should be used. For example, an arrow icon next to a
dropdown menu signifies that the user can expand it to see more
options.

 Signifiers enhance usability by clarifying actions, making user

interactions more intuitive and purposeful.

EXAMPLE:

BIOMIMICRY:

28
 o Biomimicry is the practice of designing solutions to human challenges
by emulating nature’s time-tested patterns and strategies.

o It involves studying the structures, processes and systems found in

nature and applying these principles to solve problems in suitable and
innovative ways.

 Humans copying from animals.

 Animals doing on their own.

Benefits of Biomimicry:

 Sustainability

 Innovation

 Efficiency

EXAMPLE:

29
COLOR THEORY:

Colour theory in UX is all about how colours interact, their impact on user perception,
and how to use them effectively in design. It’s a deep and fascinating topic that can
significantly influence user experience.

 Colour Wheel:

o This basic tool helps designers understand primary (red, blue, yellow),
secondary, and tertiary colours and their relationships.

 Colour Harmony:

o This involves selecting colours that work well together to create a

pleasing and balanced look. Schemes like complementary, analogous,
and triadic are common strategies.

 Colour Psychology:

o Different colours can evoke different emotions and behaviours. For

instance, blue is often associated with trust and calm, while red can
convey urgency or excitement.

 Contrast and Readability:

o High contrast between text and background enhances

readability, crucial for accessibility.

 Brand Identity:

30
 o Colours help communicate a brand’s identity and values. Consistent
use across products builds recognition and trust.

 Cultural Considerations:

o Colours can have different meanings in different cultures, so it's

essential to know your audience.

CONCLUSION:

User Experience (UX) Design is a vast field focused on crafting user-centred

products and services.

1. UX vs. UI Design:

UX design considers the holistic user journey, while UI design focuses

on the interface's visual appearance.

2. Characteristics of Good UX:

Usability, equity, enjoyability, and usefulness are key aspects of a

positive user experience.

3. Psychology and Perception:

31
 Understanding human memory, attention spans, and cognitive biases
helps design effective interactions.

4. UX Design Processes & Frameworks:

Utilize frameworks like the Double Diamond or User-Centred Design

process to guide your design journey.

5. Research and Analysis Techniques:

Conduct user research through surveys, interviews, and usability

testing to gather valuable data.

6. Structuring Content & Information:

Information architecture and user journeys help organize content for

optimal findability and flow.

7. UX Principles and Guidelines:

Adhere to principles like Hick's Law and F-shaped pattern to enhance

user decision-making and information processing.

8. User Profiles & Behavioural Insights:

Create user personas to understand user needs, motivations, and

frustrations.

9. Visual Design and Interaction:

Employ atomic design systems and consider affordances and

signifiers to create clear and intuitive interfaces.

10. Colour Theory:

Leverage colour psychology, harmony, and accessibility principles to

create visually appealing and meaningful experiences.

32
BIBLIOGRAPHY:

The following books are referred during the analysis and execution phase of
the project:

• Authors: David Farkas, Brad Nunnaly, “UX Research: practical techniques for
designing better products”, 2016.

• Full title: “Observing the User Experience: A Practitioner’s Guide to User Research
“. Authors: Elizabeth goodman, Mike Kuniavsky and Andrea Moed, 2012

• “Sketching User Experiences: Getting the Design Right and the Right Design”. Bill
Buxton, First Edition: 2007

• “Hooked-How to build Habit Forming Products”; Author: ‘Nir Eyal’, Ryan Hoover;
First Edition: 2013

• Bottlenecks: Aligning UX Design with User Psychology; Author: David C. Evans;

First Edition: 11- feb-2017.

33