原文：Principles of User Interface Design
"To design is much more than simply to assemble, to order, or even to edit; it is to add value and meaning, to illuminate, to simplify, to clarify, to modify, to dignify, to dramatize, to persuade, and perhaps even to amuse." - Paul Rand
- Clarity is job #1 清楚明白是首要之務
Clarity is the first and most important job of any interface. To be effective using an interface you've designed, people must be able to recognize what it is, care about why they would use it, understand what the interface is helping them interact with, predict what will happen when they use it, and then successfully interact with it. While there is room for mystery and delayed gratification in interfaces, there is no room for confusion. Clarity inspires confidence and leads to further use. One hundred clear screens is preferable to a single cluttered one.
任何介面首先且最重要的任務是它的可識性(clarity)，為了讓你設計的介面能被有效地使用，使用者必須能夠分辨它是什麼? 關心為何他們要使用它? 了解它能幫助他們與什麼互動? 預測當使用它時會發生什麼?使用者可以忍受介面中有未知的部分(mystery)與延遲滿足(delayed gratification)，但不能容忍令人困惑的介面(我猜作者這句話的意思是說，使用者在初接觸介面時，他們可以接受介面中有不熟悉的元素或行為，也可以接受需要花時間學習上手，但是不能接受一個完全看不懂在幹嘛的介面)。可識性可以激起使用者的信心(因為知道自己在做什麼)，並促進進一步的使用，比起一個雜亂的頁面，人們還比較喜歡一百個清楚的頁面。 - Interfaces exist to enable interaction 介面成就互動
Interfaces exist to enable interaction between humans and our world. They can help clarify, illuminate, enable, show relationships, bring us together, pull us apart, manage our expectations, and give us access to services. The act of designing interfaces is not Art. Interfaces are not monuments unto themselves. Interfaces do a job and their effectiveness can be measured. They are not just utilitarian, however. The best interfaces can inspire, evoke, mystify, and intensify our relationship with the world.
介面的存在，讓人們與世界間有了互動。它們可以幫忙識清、闡明、成就，以及顯示彼此間的關係，讓我們既接近，又遠離(想想facebook)，掌管我們的期待(透過心智模型或affordance)，並讓我們能接觸、使用各種服務。介面設計並不是藝術(是苦工orz)，介面不是紀念碑(不是好看就行)，介面有它們的任務而且其效用是可被測量的。然而，它們也不僅僅是功能導向(utilitarian)，最好的介面可以激發、喚起、迷惑(這我就不太懂了…)、強化我們與世界的關係(除了完成任務這很實際、理性的目標，介面最好還能夠對使用者的情緒產生刺激，感性設計)。 - Conserve attention at all costs 不計代價地保存使用者的注意力
We live in a world of interruption. It's hard to read in peace anymore without something trying to distract us and direct our attention elsewhere. Attention is precious. Don't litter the side of your applications with distractible material…remember why the screen exists in the first place. If someone is reading let them finish reading before showing that advertisement (if you must). Honor attention and not only will your readers be happier, your results will be better. When use is the primary goal, attention becomes the prerequisite. Conserve it at all costs.
我們生活在一個充滿干擾的世界，連想要不被打擾地平靜閱讀都很困難，總是有什麼東西會把我們的注意力給吸引到別處。注意力是很珍貴的資源，不要讓你的應用程式被會讓人分心的東西給搞亂，要記住設計的初衷。如果使用者在閱讀某些東西，請讓他們讀完再秀出廣告(如果必要的話)(現在似乎是不秀廣告就不給你讀呢…)。尊重使用者們寶貴的注意力資源，不僅會讓他們更快樂，也會帶給你更好的結果。當使用是主要目標時，注意力會是必要的(應該是指，當使用者一心一意投入在系統的使用，以達成他們的目標時，會需要相當多的注意力資源)，要不計代價地保存它。 - Keep users in control 讓使用者擁有控制權
Humans are most comfortable when they feel in control of themselves and their environment. Thoughtless software takes away that comfort by forcing people into unplanned interactions, confusing pathways, and surprising outcomes. Keep users in control by regularly surfacing system status, by describing causation (if you do this that will happen) and by giving insight into what to expect at every turn. Don't worry about stating the obvious…the obvious almost never is.
當人類覺得可以控制自己及周遭環境時，會覺得最自在。然而軟體超出使用者意料的互動，包括令人迷惑的流程、出乎預期的結果，卻讓人們不再自在。藉由經常性地告知系統狀態、描述行為之因果關係(如果你做了什麼，就會有什麼結果)，以及告知每一步動作將會發生什麼，這些都讓使用者覺得他們握有控制權。別怕說得太清楚…幾乎永遠無法說清楚(但還是要拿捏，太囉嗦會讓使用者厭煩，原本的用意就無法發揮)。
- Direct manipulation is best 直接控制是王道
The best interface is none at all, when we are able to directly manipulate the physical objects in our world. Since this is not always possible, and objects are increasingly informational, we create interfaces to help us interact with them. It is easy to add more layers than necessary to an interface, creating overly-wrought buttons, chrome, graphics, options, preferences, windows, attachments, and other cruft so that we end up manipulating UI elements instead of what's important. Instead, strive for that original goal of direct manipulation…design an interface with as little a footprint as possible, recognizing as much as possible natural human gestures. Ideally, the interface is so slight that the user has a feeling of direct manipulation with the object of their focus.
最好的介面是沒有介面，如我們在現實世界中直接操控物體一般，但不可能總是如此，而且物體本身也含有越來越多資訊，我們只好創造出介面來幫助我們與其互動。設計一個超過需求的介面很容易，比方過於精緻的按鈕、裝飾、圖像、選項、偏好設定、視窗、附加物，以及其他”工藝品”，結果最終將心力放在這些介面元件的維護上，而不是真正重要的東西(介面的目的，或是說，使用者的目的)。相反的，應該力求以直接操作的方式來達成原本的目的，設計介面時越直接越好，找出盡可能多的人類自然手勢。理想的話，這個介面甚至讓人們覺得他們是直接與物件本身在互動(目前來說，smart phone上的相簿蠻接近這個訴求，與PC的看圖軟體相比，smart phone相簿基本上看不到什麼按鈕，切換照片、放大縮小的操作是直接對相片進行操作)。
- One primary action per screen
Every screen we design should support a single action of real value to the person using it. This makes it easier to learn, easier to use, and easier to add to or build on when necessary. Screens that support two or more primary actions become confusing quickly. Like a written article should have a single, strong thesis, every screen we design should support a single, strong action that is its raison d'etre.
- Keep secondary actions secondary
Screens with a single primary action can have multiple secondary actions but they need to be kept secondary! The reason why your article exists isn't so that people can share it on Twitter…it exists for people to read and understand it. Keep secondary actions secondary by making them lighter weight visually or shown after the primary action has been achieved.
- Provide a natural next step
Very few interactions are meant to be the last, so thoughtfully design a next step for each interaction a person has with your interface. Anticipate what the next interaction should be and design to support it. Just as we like in human conversation, provide an opening for further interaction. Don't leave a person hanging because they've done what you want them to do…give them a natural next step that helps them further achieve their goals.
- Appearance follows behavior (aka form follows function)
Humans are most comfortable with things that behave the way we expect. Other people, animals, objects, software. When someone or something behaves consistently with our expectations we feel like we have a good relationship with it. To that end designed elements should look like how they behave. In practice this means that someone should be able to predict how an interface element will behave merely by looking at it. If it looks like a button it should act like a button. Don't get cute with the basics of interaction…keep your creativity for higher order concerns.
- Consistency matters
Following on the previous principle, screen elements should not appear consistent with each other unless they behave consistently with each other. Elements that behave the same should look the same. But it is just as important for unlike elements to appear unlike (be inconsistent) as it is for like elements to appear consistent. In an effort to be consistent novice designers often obscure important differences by using the same visual treatment (often to re-use code) when different visual treatment is appropriate.
- Strong visual hierarchies work best
A strong visual hierarchy is achieved when there is a clear viewing order to the visual elements on a screen. That is, when users view the same items in the same order every time. Weak visual hierarchies give little clue about where to rest one's gaze and end up feeling cluttered and confusing. In environments of great change it is hard to maintain a strong visual hierarchy because visual weight is relative: when everything is bold, nothing is bold. Should a single visually heavy element be added to a screen, the designer may need to reset the visual weight of all elements to once again achieve a strong hierarchy. Most people don't notice visual hierarchy but it is one of the easiest ways to strengthen (or weaken) a design.
- Smart organization reduces cognitive load
As John Maeda says in his book Simplicity, smart organization of screen elements can make the many appear as the few. This helps people understand your interface easier and more quickly, as you've illustrated the inherent relationships of content in your design. Group together like elements, show natural relationships by placement and orientation. By smartly organizing your content you make it less of a cognitive load on the user…who doesn't have to think about how elements are related because you've done it for them. Don't force the user to figure things out…show them by designing those relationships into your screens.
- Highlight, don't determine, with color
The color of physical things changes as light changes. In the full light of day we see a very different tree than one outlined against a sunset. As in the physical world, where color is a many-shaded thing, color should not determine much in an interface. It can help, be used for highlighting, be used to guide attention, but should not be the only differentiator of things. For long-reading or extended screen hours, use light or muted background colors, saving brighter hues for your accent colors. Of course there is a time for vibrant background colors as well, just be sure that it is appropriate for your audience.
- Progressive disclosure
Show only what is necessary on each screen. If people are making a choice, show enough information to allow them the choice, then dive into details on a subsequent screen. Avoid the tendency to over-explain or show everything all at once. When possible, defer decisions to subsequent screens by progressively disclosing information as necessary. This will keep your interactions more clear.
- Help people inline
In ideal interfaces, help is not necessary because the interface is learnable and usable. The step below this, reality, is one in which help is inline and contextual, available only when and where it is needed, hidden from view at all other times. Asking people to go to help and find an answer to their question puts the onus on them to know what they need. Instead build in help where it is needed…just make sure that it is out of the way of people who already know how to use your interface.
- A crucial moment: the zero state
The first time experience with an interface is crucial, yet often overlooked by designers. In order to best help our users get up to speed with our designs, it is best to design for the zero state, the state in which nothing has yet occurred. This state shouldn't be a blank canvas…it should provide direction and guidance for getting up to speed. Much of the friction of interaction is in that initial context…once people understand the rules they have a much higher likelihood of success.
- Existing problems are most valuable
People seek out solutions to problems they already have, not potential problems or problems of the future. Therefore, resist creating interfaces for hypothetical problems, observe existing behavior and design to solve existing problems. This isn't as exciting as blue sky wondering but can be much more rewarding as people will actually use your interface.
- Great design is invisible
A curious property of great design is that it usually goes unnoticed by the people who use it. One reason for this is that if the design is successful the user can focus on their own goals and not the interface…when they complete their goal they are satisfied and do not need to reflect on the situation. As a designer this can be tough…as we receive less adulation when our designs are good. But great designers are content with a well-used design…and know that happy users are often silent.
- Build on other design disciplines
Visual and graphic design, typography, copywriting, information architecture and visualization…all of these disciplines are part of interface design. They can be touched upon or specialized in. Do not get into turf wars or look down on other disciplines: grab from them the aspects that help you do your work and push on. Pull in insights from seemingly unrelated disciplines as well…what can we learn from publishing, writing code, bookbinding, skateboarding, firefighting, karate?
- Interfaces exist to be used
As in most design disciplines, interface design is successful when people are using what you've designed. Like a beautiful chair that is uncomfortable to sit in, design has failed when people choose not to use it. Therefore, interface design can be as much about creating an environment for use as it is creating an artifact worth using. It is not enough for an interface to satisfy the ego of its designer: it must be used!
沒有留言:
張貼留言