Lessons learned from Steve Krug's best selling book "Don't Make Me think". Author suggests us that "Design your website to be so obvious that users don't have to think".

1. Usability Lessons from Steve Krug’s
Don’t Make Me Think
- By Nirja Gauchan

2. Usability Means...
➔ Making sure something works well
➔ Anyone with average ability/ experience
can use it for its intended purpose without
getting Hopelessly Frustrated.

3. ➔ “If something is hard to
use, I just don’t use it as
much.”
➔ “If you can’t make a page
self-evident, you need to
make it self-explanatory”
Don’t Make me
Think!!!

4. Users shouldn’t spend their time thinking
about things like:
➔ Where am I?
➔ Where should I begin?
➔ Where did they put ____ ?
➔ What are the most important things
on this page?
➔ Why did they call it that?

5. How we really use the web?
We don’t read. We scan them.
➔ We’re in hurry.
➔ We don’t make optimal
choices, we satisfice.
➔ Guessing is fun
➔ No penalty for wrong guess
➔ Availability of Back btn.
➔ Slow loading pages
➔ Scanning
➔ Satisficing
➔ Muddling through

6. Design pages for scanning
NOT READING.
5 Important Principles of Web Design
Essential things to help people use your web pages
more productively and efficiently
1. Create a clear visual hierarchy on
each page.
2. Take advantage of conventions.
3. Break up pages into clearly
defined areas.
4. Make it obvious what’s clickable.
5. Minimize noise.

7. Create a Clear
Visual Hierarchy
➔ Draw attention to important aspects with visual
cues (Bold, Larger, distinctive color)
➔ Keep together things that are related logically;
◆ Grouping them together under a Heading.
◆ Linking them by displaying in same visual style.
◆ Putting them all in clearly defined area.

8. Conventions
➔ They’re very useful as people
know how to use them.
➔ Designers are often reluctant
to take advantage of them.
◆ As they think their job to create
something new and different.
Innovate
Only if you have an
idea that works better
than a convention and
is self explanatory.
In case of
NOT Following
Conventions

9. Dividing the page
into clearly defined areas is
IMPORTANT
Because it allows users to:
➔ Decide quickly which areas
of the page to focus on.
➔ Which areas they can safely
ignore.

10. Make it obvious
what’s clickable.
● Make that click easy and distinct
as possible via :
Button Url link
● links -- different colors than
the Regular text.

11. Avoid these:
➔ Exclamation points!
➔ Dif n f
➔ Bright colors
➔ Automated slideshows
➔ Extra links
➔ Pop-ups
Minimize Noise
❖ Busyness (overwhelming)
❖ Bg Noise (Distracting Elements)

12. Web Content
➔ Keep paragraphs short.
➔ Use bullet lists.
➔ Highlight key terms.
➔ No need to throw welcome
message, instructions.
➔ Omit Needless words

13. Designing
Navigation
➔ Navigation - Clear, Simple, Consistent
➔ No Sense of :
◆ Scale (huge corner; never explored)
◆ Direction (up,down, In hierarchy - more
general-specific)
◆ Location (we develop sense of where we are
and take shortcuts)
“People won’t use your website if
they can’t find their way around it.”

14. Purposes of
Navigation 1. To help us find whatever we’re
looking for/ tell us where we are.
2. It gives us something to hold on to.
3. It tells us what the site contains.
4. It tells us how to use the site.

15. Website
Navigation Conventions
➔ Site ID (dual purpose: btn to home)
➔ Sections / Subsections
(primary nav link---main sections)
➔ Utilities (imp -- not in hierarchy)
➔ “You are here” indicator (make
prominent--or it loses value)
➔ Page Name
➔ A way home (like a reset btn)
➔ A way to search

16. A way to search
Search-dominant users will almost always
look for a search box as they enter a site.
➔ Avoid Fancy wording: Quick Find,
Quick search, or Keyword Search..
➔ Avoid Instructions
Eg: “Type a keyword” - clueless
➔ Only give the option when it is useful

17. Breadcrumbs (convenient, consistent nav scheme)
When to use breadcrumbs:
● Large Site --- Deep hierarchy
○ (Nest of subsites)
○ Read More

18. Homepage is
Beyond your control
★ Site Identity and mission
★ Site hierarchy
★ Search
★ Teases
★ Feature promos
★ Timely content
★ Deals
★ Shortcuts
★ Registration
Abstract objectives
Homepage needs to meet
➔ Show me what I’m looking for
➔ … and what I’m not looking for
➔ Show me where to start
➔ Establish credibility and trust

19. Developers
“People like sites
with lots of cool
features”
Designers
“People like sites
that are visually
appealing”
Conflict of ideas

20. Never ending debate

21. Testing
➔ One user is 100% better than none.
➔ 1 user early in project rather than 50
users towards the end.
➔ Screen recording--- Analyze whole flow.
(www.mixpanel.com, google analytics)
Demo: Watch this
Usability Testing

22. Things that
Increase Goodwill
➔ Know what users want to do/ know
and keep it simple & easy.
➔ Save users from lengthy
process/steps/clicks.
➔ Make it easier for users to recover
from errors.
➔ Availability of FAQ, organised help
sections, printer friendly content.
➔ When in doubt apologise.
➔ Hiding info (eg: support
numbers, shipping rates, prices)
➔ Punishing users for not
following the things their way
➔ Asking unnecessary info
➔ Slow loading web pages
➔ Sloppy, disorganized site
Things that
Diminish Goodwill

23. Thank You!
I hope you’ll use these usability tips to create
and deliver a great user experience via your
product!
To know more about the author “Steve Krug”
visit www.sensible.com
To know more about
usability tips and testing,
check out the book!