Learn the basics of UX design for your website!

1. UX

2. SHAHRIZAR
VIDEO GAME
DESIGNER
STARTUP
FOUNDER
PHYSICIST
ARTIST
FATHER,
HUSBAND
MANUFACTURING
INDUSTRY
TRAINER

3. There is no shortcut in
good UX design

4. Good UX design comes from
continued testing,
and improvements to the
product and service.

5. Visual Design
System Design

6. Visual Design
System Design
Branding in the Physical world
Customer service
Packaging
Product Unboxing
This is
UX

8. What influences your experience?

10. Human Emotion determines UX

11. What emotions should good UX target?

12. COOL
INTERESTING
BEAUTIFUL
UX Designing for
Emotions

13. Techniques
Humor
You remember
humorous Ads
more than the
serious ones.
Recognize
Humans are
drawn to things
that we relate to.
Golden Ratio.
Pattern
Humans like to
recognize
patterns. Provide
a pattern to
follow.

14. Techniques
Engage
Give them an
interactive tool to
engage. Like,
Comment, Rate.
Talk
We value
authentic
communication.
Talk like a friend,
not a faceless
entity.
Relationship
Its no longer
about making a
sale. Its about
building a
relationship.

17. PRODUCT
Direct
Stakeholder
Indirect
Stakeholder
Wider
Environment
Key Points
One reason products fail is because
teams do not solve the problems that are
important to the right users. These
personas are not always obvious, as they
may be associated with the product
through indirect connections.
With Customer-Centric, you can identify
the vast web of people your product
impacts and explore the complex
butterfly effect; doing so reveals which
stakeholders are most important and
what your product requirements are.
CUSTOMER-CENTRIC GAME

18. Ergonomics of User Interface

19. Ergonomics guideline
Consistency
Principle of Least
Astonishment.
Consistent icons,
terms, etc.
Simplicity
Break complex
tasks into simpler
tasks.
Human
Memory
Limitation
Organize
information into
small chunks.

20. Ergonomics guideline
Cognitive
Directness
Reduce
abstraction and
reuse real world
metaphors.
Feedback
Provide actionable
feedback. Not just
an error message.
User
Centered
“There was a
problem copying
files to your disk”
rather than “Error
309”.

21. Ergonomics guideline
Anthropomor
phization
Avoid “Have a nice
day” messages
from your
computer.
Modality
Force users to
complete one task
before moving to
another. Allow
escape routes.
Attention
Nudge user
attention, rather
than trying to
force them.
Gentle
animations.

22. Strongly Strongly
disagree agree
1. I think that I would like to
use this system frequently
2. I found the system unnecessarily
complex
3. I thought the system was easy
to use
4. I think that I would need the
support of a technical person to
be able to use this system
5. I found the various functions in
this system were well integrated
6. I thought there was too much
inconsistency in this system
7. I would imagine that most people
would learn to use this system
very quickly
8. I found the system very
cumbersome to use
9. I felt very confident using the
system
10. I needed to learn a lot of
things before I could get going
with this system
1 2 3 4 5
1 2 3 4 5
1 2 3 4 5
1 2 3 4 5
1 2 3 4 5
1 2 3 4 5
1 2 3 4 5
1 2 3 4 5
1 2 3 4 5
1 2 3 4 5
System
Usability
Score
(SUS)
www.usability.gov

23. > 68%
Above Average
< 68%
Below Average
System
Usability Score
(SUS)

24. Influence of Design on UX

28. Which is nicer?

31. 1981
Apple Macintosh

32. Visual cues, such as the arrow on a pop-up menu,
help people recognize familiar elements. People
learn to associate certain behaviors with specific
elements based on their appearance. For
example, people recognize push buttons by their
rounded shape…
— OSX Human Interface Guidelines

33. Professor Nänni, author of the
exemplary Visual Perception, a book
detailing our best-to-date scientific
understanding of the processes involved
in visual cognition, is saying
that rounded rectangles are literally
easier on the eye.
Put another way, compared to square-
edged rectangles, rounded rectangles are
more computationally efficient for the
human brain.

34. Simplifying Interactions -
minimalism

35. To accomplish simplification, user experience designers employ
a variety of design exercises to make the UI more efficient.
We limit the amount of choices available to a user, reduce
the size of content and site copy, progressively disclose UI
options, and synthesize unruly navigation elements.
Essentially though, these are just exercises in numerical
reduction.

36. Ask Who? What? Why? & When?
to simplify User Interactions.

37. Who is your new website for? Who are your users, and
how many user personas can they be categorized into?
What sets (or will set) your brand(s) and your website
apart? What is your user looking for on your site? What
problems do you solve for them?
Why are users visiting your site? Why are they
choosing you over the competition?
When is the right time for you to redesign your UX, or
to include UX design in your next project?

38. Influencing human habits

40. Gamifying Interactions
and Experience