Don’t Make Me Think by Steve Krug筆記 UIUX設計師不容錯過的好書
If you want to gain a better understanding of what User Experience Design entails, this book is a must-read.
強力推薦這本 UI、UX 設計師都不能錯過的好書，這是一本非常入門的書籍，始終對 User Experience 總是有很模糊的概念的人，也會不知道到底自己的設計是為了什麼並且運用了哪些技巧，所以很多人才會辯論說：UI 是一種很主觀的東西。但實際上不論是 UI 還是 UX，都是要運用到使用者體驗最基礎的準則去做設計，所以已經不是主不主觀的問題。
且實際上很多產品並不需要非常高深的技巧，只要造著最基本的準則，就能避免犯下低級錯誤，那麼你所經手的產品已有很高的機率比其他產品還好用。
作者也提醒到我們並不是在經手一個像是 iPhone 這種花時間跟大量金錢請專家做測試、做訪談…等這種跨時代產品，需要請一些最專業的權威來做使用者經驗，全世界更多公司開發產品是採用更快速的方式在做產品，這種跨時代的產品雖然很重要，但成千上萬的產品正在被開發，甚至有更多人在一般的產品部門工作，所以我們無法總是遵循 “完美流程”，很有可能你不但無法大施手腳，也會覺得工作很挫折為什麼 “我的公司” 總是無法像教科書一樣？
This book is straightforward and not too technical, making it easy for anyone to grasp the basic concepts. Even though most services cannot afford a professor to provide an exceptional user experience, we can still follow the basic concepts which are easy to understand and common sense.
不管你是 UIUX 或者是 PM、工程師、行銷人員只要你經手數位產品，這些準則都是相通的。
This book is a must-have for anyone in the tech industry who needs to build services for humans. It provides concepts and guidelines not only for websites but also for ATMs and more. It is easy and straightforward for designers, product managers, marketers, and more to follow.
One last thing, before we begin — by Steve Krug
One crucial thing, really: My definition of usability.
You’ll find a lot of different definitions of usability, often breaking it down into attributes like
1. Useful: Does it do something people need done?
2. Learnable: Can people figure out how to use it?
3. Memorable: Do they have to relearn it each time they use it?
4. Effective: Does it get the job done?
5. Efficient: Does it do it with a reasonable amount of time and effort?
6. Desirable: Do people want it?
7. Delightful: Is using it enjoyable, or even fun?
I believe this stage is one of the most important elements to be aware of if you are a UIUX designer. Through my experiences, I have found that many people are not aware of the meaning of user experience, and without a true understanding of user experience, you cannot fully comprehend the tool or the purpose of research.
Guiding Principles
Chapter 1. Don’t make me think!
For instance, it means that as far as is humanly possible, when I look at a Web page it should be self-evident. Obvious. Self-explanatory.
The most important thing you can do is to understand the basic principle of eliminating question marks. When you do, you’ll begin to notice all the things that make you think about the sites and apps you use.
You can’t make everything self-evident
Here’s the rule: If you can’t make something self-evident, you at least need to make it self-explanatory.
Chapter 2. How we really use the Web
The thing that has struck me most is the difference between how we think people use Web sites and how they actually use them.
FACT OF LIFE #1: We don’t read pages. We scan them.
FACT OF LIFE #2: We don’t make optimal choices. We satisfice.
we don’t choose the best option — we choose the first reasonable
option, a strategy known as satisficing. As soon as we find a link that seems like it might lead to what we’re looking for, there’s a very good chance that we’ll click it.
FACT OF LIFE #3: We don’t figure out how things work. We muddle through.
Chapter 3. Billboard Design 101
DESIGNING FOR SCANNING, NOT READING
- Take advantage of conventions
- Create effective visual hierarchies
- Break pages up into clearly defined areas
- Make it obvious what’s clickable
- Eliminate distractions
- Format content to support scanning
Conventions are your friends
Where things will be located on a page: users expect the logo identifying the site to be in the top-left corner (at least in countries where reading is left-to-right) and the primary navigation to be across the top or down the left side.
How things work: almost all sites that sell products use the metaphor of a
shopping cart and a very similar series of forms for specifying things like your method of payment, your shipping address, and so on.
How things look: Many elements have a standardized appearance, like the icon that tells you it’s a link to a video, the search icon, and the social networking sharing options.
One problem with conventions, though: Designers are often reluctant to take advantage of them.
然而，慣例有一個問題：設計師往往不願意利用它們。
Create effective visual hierarchies
The more important something is, the more prominent it is. The most important elements are either larger, bolder, in a distinctive color, set off by more white space, or nearer the top of the page — or some combination of the above.
Things that are related logically are related visually. For instance, you can show that things are similar by grouping them together under a heading, displaying them in the same visual style, or putting them all in a clearly defined area.
Things are “nested” visually to show what’s part of what. For instance, a site section name (“Computer Books”) would appear above the titles of the individual books, reflecting the fact that the books are part of the section. And each book title in turn would span all the elements that make up the description of that book.
Break up pages into clearly defined areas
A good visual hierarchy saves us work by preprocessing the page for us, organizing and prioritizing its contents in a way that we can grasp almost instantly.
Make it obvious what’s clickable
As we scan a page, we’re looking for a variety of visual cues that identify things as clickable (or “tappable” on touch screens) — things like shape (buttons, tabs, etc.), location (in a menu bar, for instance), and formatting (color and underlining).2
Keep the noise down to a dull roar
- Shouting
The truth is, everything can’t be important. Shouting is usually the result of a failure to make tough decisions about which elements are really the most important and then create a visual hierarchy that guides users to them first. - Disorganization
This is a sure sign that the designer doesn’t understand the importance of using grids to align the elements on a page. - Clutter
When you’re editing your Web pages, it’s probably a good idea to start with the assumption that everything is visual noise (the “presumed guilty until proven innocent” approach) and get rid of anything that’s not making a real contribution. In the face of limited time and attention, everything that’s not part of the solution must go.
Format text to support scanning
- Use plenty of headings.
- Keep paragraphs short.
- Use bulleted lists.
Chapter 4. Animal, Vegetable, or Mineral?
Don’t give the user difficult choices and questions that are hard to answer all the time in forms.
Whether you need to offer some help or not, the point is that we face choices all the time on the Web and making those choices mindless is one of the most important things you can do to make a site easy to use.
Chapter 6. Street signs and Breadcrumbs
Persistent navigation should include the four elements you most need to have on hand at all times:
Users usually end up spending as much time on lower-level pages as they do at the top.
It’s vital to have sample pages that show the navigation for all the potential levels of the site before you start arguing about the color scheme.
這段話在說網站導航設計至關重要，當使用者找不到想找的東西時就會按下 back 鍵退出整個網站，所以當在爭論配色方案之前先討論網站導航設計吧。
永遠問自己幾個問題：
When your vision clears you should be able to answer these questions without hesitation:
What site is this? (Site ID)
What page am I on? (Page name)
What are the major sections of this site? (Sections)
What are my options at this level? (Local navigation)
Where am I in the scheme of things? (“You are here” indicators)
How can I search?
Chapter 8. “The Farmer and the Cowman Should Be Friends”
WHY MOST ARGUMENTS ABOUT USABILITY ARE A WASTE OF TIME, AND HOW TO AVOID THEM
作者稱作： “religious debates”
以下為情境圖，個人覺得非常貼切
The result is usually a room full of individuals with strong personal convictions about what makes for a good Web site.
As soon as the clash of personal and professional opinions results in a stalemate, the conversation usually turns to finding some way (whether it’s the opinion of an outside expert, published research, a survey, or focus groups) to determine what most users like or don’t like — to figure out what the Average Web User is really like. The only problem is, there is no Average User. In fact, all of the time I’ve spent watching people use the Web has led me to the opposite conclusion:
ALL WEB USERS ARE UNIQUE AND ALL WEB USE IS BASICALLY IDIOSYNCRATIC
The problem is there are no simple “right” answers for most Web design questions.
這段看了心有戚戚焉。以往常常聽到在辦公室裡每個人說自己是 User，所以他們可以代表 User 給設計師建議如何設計。
作者提出該如何解決這個問題呢？
The point is, it’s not productive to ask questions like “Do most people like pull-down menus?”
→ The right kind of question to ask is “Does this pull-down, with these items and this wording in this context on this page create a good experience for most people who are likely to use this site?”
Where debates about what people like waste time and drain the team’s energy, usability testing tends to defuse most arguments and break impasses by moving the discussion away from the realm of what’s right or wrong and what people like or dislike and into the realm of what works or doesn’t work.
答應我，我們可以不要再陷入宗教辯論了嗎？
Chapter 9. Usability testing on 10 cents a day
經過每次的測試一定會有很多問題產生，不過作者提出最重要的一點。
FOCUS RUTHLESSLY ON FIXING THE MOST SERIOUS PROBLEMS FIRST
作者也寫下如何決定最重要的事情要先解決？這邊只節錄最基本的原則，其團隊的大家都有觀察到這件事最嚴重也最該最先被解決，也能讓團隊更有共識對於產品現在的使用問題; 其餘建議要看書的內容。
- Make a collective list:
Go around the room giving everyone a chance to say what they thought were the three most serious problems they observed (of the nine they wrote down; three for each session). Write them down on a whiteboard or sheets of easel pad paper. Typically, a lot of people will say “Me, too” to some of them, which you can keep track of by adding checkmarks
And Not To:
- Take “new feature” requests with a grain of salt.
Participants aren’t designers. They may occasionally come up with a great idea, but when they do you’ll know it immediately because your first thought will be “Why didn’t we think of that?!”
這邊也給出很好的建議，Usability testing 不是叫使用者來給我們功能建議的，所以不需要因為使用者說了什麼功能缺失就很緊張覺得要馬上解決。
看完了這個章節應該就知道，做 Usability testing 才能夠做出對使用者更好的產品，不需要每次都看那些大公司的產出，專注在自己的資源跟身邊有的器材就好。
Chapter 10. Mobile: It’s not just a city in Alabama anymore
在第十章裡面， Steve Krug 提到手機設計上的限制，也提醒我們要改變思考模式在設計時，其中有一句話被我 Highlight 起來：
Constraints actually make design easier and foster innovation.
接下來講到兩點是設計師做 Mobile 的時候提到的：
- Apps need to be learnable
- Apps need to be memorable, too
