iOS 8人機交互指南(7)

前一篇:iOS 8人機交互指南(6)

7. 交互與反饋(Interactivity and Feedback)

7.1 用戶需了解的標準手勢(Users Know the Standard Gestures)

People use gestures—such as tap, drag, and pinch—to interact with apps and their iOS devices. Using gestures gives people a close personal connection to their devices and enhances their sense of direct manipulation of onscreen objects. People generally expect gestures to work the same in all the apps they use.

人們使用手勢——例如點擊、拖拽以及捏合——來與 app 和 iOS 設備交互。使用手勢會帶給人們與設備之間一種親密的個人聯系,也會加強他們直接操控屏幕對象的感覺。人們通常期待所有 app 中手勢操作的效果一致。

此處為一段視頻,可以到原文鏈接中查看

Tap?To press or select a control or item.

點擊(Tap):通過點擊來按壓或選擇一個控件或條目。

此處為一段視頻,可以到原文鏈接中查看

Drag?To scroll or pan—that is, move side to side.

To drag an element.

拖拽(Drag):拖拽元素由一個位置移動到另一位置。

此處為一段視頻,可以到原文鏈接中查看

Flick?To scroll or pan quickly.

輕按滑動(Flick):輕按并滑動來實現快速滾動。

此處為一段視頻,可以到原文鏈接中查看

Swipe?With one finger, to return to the previous screen, to reveal the hidden view in a split view controller, or the Delete button in a table-view row.

With four fingers, to switch between apps on iPad.

滑動(Swipe):使用單指滑動,可以實現返回上一界面,顯示分割視圖控制器中的隱藏視圖或圖表視圖中行的左滑/右滑刪除按鈕。

iPad 上四指滑動可以實現 app 間的切換。

此處為一段視頻,可以到原文鏈接中查看

Double tap?To zoom in and center a block of content or an image.

To zoom out (if already zoomed in).

雙擊(Double tap):雙擊一段內容或者圖片可以以其為中心來進行放大。如果已經處于放大狀態,再次雙擊就會縮小。

此處為一段視頻,可以到原文鏈接中查看

Pinch?Pinch open to zoom in; pinch close to zoom out.

捏合(Pinch):兩指向外捏開可以放大;兩指向里捏合可以縮小。

此處為一段視頻,可以到原文鏈接中查看

Touch and hold?In editable or selectable text, to display a magnified view for cursor positioning.

長按(Touch and hold):長按可以喚起編輯態,內容可以進行編輯或選擇,此時顯示一個帶光標的放大視圖。

此處為一段視頻,可以到原文鏈接中查看

Shake?To initiate an undo or redo action.

搖動(Shake):通過搖動來撤銷或重做某一個操作。

In addition to the standard gestures users know, iOS defines a few gestures that invoke systemwide actions, such as revealing Control Center or Notification Center. Users rely on these gestures to work regardless of the app they’re using.

除了用戶已知的標準手勢,iOS 還定義了幾個手勢用于調用起系統級的操作,例如顯示控制中心和通知中心。無論當前正在使用什么 app,用戶都可以使用這些手勢。

Avoid associating different actions with the standard gestures. Unless your app is a game, redefining the meaning of a standard gesture may confuse people and make your app harder to use.

避免與標準手勢含義不一致的操作。除非是游戲 app,不然的話,對標準手勢含義的重定義會讓用戶困惑,app 也變得難用。

Avoid creating custom gestures that invoke the same actions as the standard gestures. People are used to the behavior of the standard gestures, and they don’t appreciate being expected to learn different ways to do the same thing.

避免創建與標準手勢含義相同的自定義手勢。用戶已經習慣于標準手勢的行為,他們不希望學習不同的方式來完成同樣的任務。

Use complex gestures as shortcuts to expedite a task, not as the only way to perform it. As much as possible, always give users a simple, straightforward way to perform an action, even if it means an extra tap or two. Simple gestures let users focus on the experience and the content, not the interaction.

可以使用復雜手勢作為快捷方式來迅速完成任務,但不要將它作為唯一可用的方式。盡可能總是為用戶提供一個簡單、直接的方式來進行操作,即使可能會多幾次點擊。簡單的手勢讓用戶專注于體驗和內容,而不是交互。

In general, avoid defining new gestures unless your app is a game. In games and other immersive apps, custom gestures can be a fun part of the experience. But in apps that help people do things that are important to them, it’s best to use standard gestures because people don’t have to make an effort to discover them or remember them.

通常,只在游戲 app 中才定義新手勢。在游戲或其他擬真 app 中,自定義手勢是體驗中一個有趣的部分。但在幫助人們完成重要任務的 app 中,最好還是使用標準手勢,因為人們不必費勁探索或者記住手勢。

In a regular environment, consider using multifinger gestures. Although complex gestures aren’t appropriate for every app, they can enrich the experience in apps that people spend a lot of time in, such as games or content-creation environments. Always bear in mind that nonstandard gestures aren’t discoverable and should rarely, if ever, be the only way to perform an action.

在常規情況下,考慮使用多指手勢。雖然復雜的手勢并不適于每一個 app,但它們豐富了那些用戶會為之花費很多時間的 app 的體驗,例如游戲或內容創作 app。牢記:非標準手勢不應該讓用戶探索才能發現其用法,也盡量不要成為進行某項操作的唯一方式。

7.2 交互元素引發觸摸(Interactive Elements Invite Touch)

To signal interactivity, the built-in apps use a variety of cues, including color, location, context, and meaningful icons and labels. Users rarely need additional decorations to show them that an onscreen element is interactive or to suggest what it does.

為了標明可交互之處,內置 app 使用了許多線索,包括顏色、位置、上下文,以及有意義的圖標和標簽。用戶很少需要額外的裝飾來表明屏幕元素是可交互的、或者它們能做什么。

聯系人 app

A key color gives users a strong visual indicator of interactivity, especially in apps that don’t use an abundance of other colors. In Contacts, blue marks the interactive elements and gives the app a unified and recognizable visual theme.

關鍵色帶給用戶一種很強的可視化交互指示,尤其是在其他用色不多的 app 中。在聯系人 app 中,藍色標明了可交互元素,并給 app 一個統一可辨識的可視化主題。

日歷 app

The back button uses several cues to indicate its interactivity and convey its function: It appears in response to navigation, it displays a back-pointing chevron, it typically uses a key color, and it can display a title that describes the previous screen.

返回按鈕使用一些線索來表明它的交互性,同時傳達它的功能:它與導航相配合,顯示回退點標記,通常使用關鍵色,而且顯示上一個界面的標題。

地圖 app

An icon or a title that provides a clear call to action invites users to tap it. For example, the titles in Maps, such as “Flyover Tour” and “Directions to Here,” clearly describe actions that users can take. Combined with a key color, actionable titles tend to make button borders or other embellishments superfluous.

圖標或標題提供明確指引讓用戶來點擊。例如地圖 app 中的標題,“城市導覽地圖”和“到這里的路線”都很清晰地描述了用戶可以采取的操作。與關鍵色結合、可操作的標題通常使按鈕邊框或其他裝飾變得多余。

In a content area, add a button border or background only if necessary.?Buttons in bars, action sheets, and alerts don’t need borders because users know that most of the items in these areas are interactive. In a content area, on the other hand, a button might need a border or a background to distinguish it from the rest of the content. For example, Music, Clock, Photos, and App Store use such buttons in a few specific contexts.

在內容區,只在確實必要時才為按鈕增加邊框或背景。欄目上的按鈕、操作表單、警告提示都不需要邊框,因為用戶知道這些區域內大部分條目是可交互的。在內容區,按鈕可能需要邊框或背景來與其他內容相區別。例如音樂、時鐘、照片和 App Store 在一些特定的上下文下使用這樣的按鈕。

照片 app

Photos uses a button border to differentiate the Start Sharing button from the explanatory text that appears above it.

照片使用按鈕邊框來將”開始共享“按鈕與其上方的解釋性文字相區別。

時鐘 app

Clock uses button backgrounds in the Stopwatch and Timer screens to draw attention to the Start and Pause buttons and to make them easy to tap even when the user's surroundings are distracting.

時鐘 app 在秒表和計時器中使用按鈕背景,以此方式吸引用戶注意開始和暫停按鈕,很容易進行點擊。

App Store

App Store uses a button border in a table row to emphasize the distinction between tapping the row to get more information and tapping the button to initiate (or install) a purchase.

App Store 在圖表行中使用帶邊框的按鈕,以此區別點擊行來獲取更多信息與點擊按鈕獲取(安裝)應用兩種不同的行為。

7.3 反饋有助于理解(Feedback Aids Understanding)

Feedback helps users know what an app is doing, discover what they can do next, and understand the results of their actions. UIKit controls and views provide many kinds of feedback.

反饋幫助用戶了解 app 正在做什么,發現下一步他們可以做什么,以及了解他們操作后的結果。UIKit 控件和視圖提供了多種反饋方式。

As much as possible, integrate status and other relevant feedback information into your UI.?It’s best when users can get this type of information without taking action or being distracted from their content. For example, Mail displays the current mailbox status in the toolbar where it doesn’t compete with the user’s content.

盡可能集成狀態和其他相關反饋信息到 UI 中。最好用戶無需采取行動或離開內容就能了解到這些反饋信息。例如,郵箱 app 在工具欄顯示當前郵箱狀態,這不會與用戶內容顯示相沖突。

郵箱 app

Avoid unnecessary alerts.?An alert is a powerful feedback mechanism, but it should be used only to deliver important—and ideally actionable—information. If users see too many alerts that don’t contain essential information, they quickly learn to ignore all alerts. To learn more about using an alert, see?Alert.

避免不必要的警告提示。警告提示是一個強有力的反饋機制,但它應該僅用于傳達重要的、理論上可操作的信息。如果用戶看了太多沒有包含重要信息的警告提示,他們很快就會養成忽略所有警告的習慣。了解更多,參見?Alert

7.4 輸入信息應該易于操作(Inputting Information Should Be Easy)

Inputting information takes time and attention, whether people tap controls or use the keyboard. When an app slows people down by asking for a lot of user input before anything useful happens, people can feel discouraged from using it.

無論用戶采用點擊控件還是使用鍵盤,輸入信息都會花費時間和精力。如果 app 在有用內容尚未出現前就頻繁要求用戶輸入,那用戶就會不想再使用它了。

Make it easy for users to make choices.?For example, you can use a picker or a table view instead of a text field, because most people find it easier to select an item from a list than to type words.

要使用戶易于選擇。例如,你可以提供一個拾取器或者表格視圖來代替輸入框,因為大部分用戶覺得從列表中選擇某項會比打字更容易。

提醒事項 app 中的日期拾取器 ?和 ?設置 app 中的選項列表

Get information from iOS, when appropriate.?People store lots of information on their devices. When it makes sense, don’t force people to give you information that you can easily find for yourself, such as their contacts or calendar information.

可以的話,從 iOS 中直接讀取信息。人們在設備中會存儲很多信息。如果可以的話,不要迫使用戶提供那些你可以輕松從設備中讀取的信息,例如聯系人或日歷信息。

Balance a request for input by giving users something useful in return.?A sense of give and take helps people feel they’re making progress as they move through your app.

要求用戶輸入時要給予有用的信息反饋。這種施與受的體驗讓用戶明確感覺到自己在 app 中進行逐步操作的過程。

英文原文鏈接

后一篇:iOS 8人機交互指南(8)

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容