工具提示往往出現(xiàn)在新用戶引導(dǎo)流程當(dāng)中，它是整個(gè)應(yīng)用的門(mén)面之一，能否給用戶留下好印象，工具提示也發(fā)揮著至關(guān)重要的作用。

想象一下，在一個(gè)沒(méi)有任何路標(biāo)的城市里面，所有人都沒(méi)有辦法在視覺(jué)上獲得指引，所有的人和交通工具都只能在混亂中前進(jìn)，摩擦和沖突會(huì)無(wú)處不在。沒(méi)有指引的城市，就像黑箱一樣。

同樣的，功能和效果再炫酷的 APP，如果沒(méi)有新用戶引導(dǎo)流程、沒(méi)有工具提示、沒(méi)有基礎(chǔ)的教學(xué)，就像沒(méi)有路標(biāo)的城市一樣讓人迷惑頭疼。

這個(gè)類(lèi)比也許不那么精準(zhǔn)，但是應(yīng)該不難理解。

最可悲的地方在于，當(dāng)用戶因?yàn)榛靵y的體驗(yàn)而感到痛苦的時(shí)候，它并不會(huì)打電話給客服咨詢或者在后臺(tái)留言提問(wèn)，絕大部分用戶會(huì)選擇直接關(guān)閉并卸載 APP，還有少量用戶會(huì)在社交媒體或者留言區(qū)罵完之后再卸載。

好看固然會(huì)吸引人，但是在此之前必須保證可用性才行。即使在設(shè)計(jì)上盡量利用到了最佳實(shí)踐，但是并非所有功能和服務(wù)都是一目了然的，用戶并不會(huì)每次都能福至心靈瞬間了解導(dǎo)航和每個(gè)功能模塊的具體特性。

這就是為什么需要新用戶引導(dǎo)流程，需要有新手教程，需要有工具提示。借助這些環(huán)節(jié)，設(shè)計(jì)師能夠引導(dǎo)用戶對(duì)于產(chǎn)品的功能或者使用方法有基本的了解，避免用戶一開(kāi)始就迷失在他們并不熟悉的功能當(dāng)中。在20年前，我們新買(mǎi)回來(lái)的洗衣機(jī)、電視和收音機(jī)都會(huì)搭配上一小本厚厚的說(shuō)明書(shū)，現(xiàn)如今，這些常用的家電已經(jīng)擁有了更為優(yōu)秀的交互設(shè)計(jì)，也有了更加優(yōu)秀的新用戶引導(dǎo)方式，通常只需要提供一些核心的說(shuō)明和基本的用戶指引，用戶就能進(jìn)行基本的操作。而這些就是最常見(jiàn)的工具提示。

工具提示在如今 APP 的新用戶流程中，是非常常見(jiàn)也非常有用的一種用戶引導(dǎo)策略。工具提示作為一種類(lèi)似注釋的教程/引導(dǎo)信息呈現(xiàn)形式，在新用戶引導(dǎo)流程中，被廣泛地運(yùn)用。

1. 為什么使用工具提示？

當(dāng)你需要展示產(chǎn)品的核心功能的時(shí)候，工具提示能夠提供交互性較強(qiáng)、自由度較高的展示方式。不過(guò)，在許多產(chǎn)品的新用戶引導(dǎo)流程當(dāng)中，工具提示這一功能被濫用，使得信息過(guò)載，從而讓工具提示成為了一個(gè)非常惱人的功能。

在 Google 的 Material Design 的設(shè)計(jì)規(guī)則當(dāng)中是這么說(shuō)的：

工具提示應(yīng)當(dāng)在用戶懸停、聚焦或者觸摸某一控件的時(shí)候顯示。通常，工具提示是針對(duì)特定的元素來(lái)進(jìn)行說(shuō)明的，它會(huì)包含簡(jiǎn)要的文字來(lái)闡述其功能、效果或者交互方式，比如它可能以文本的形式闡述某個(gè)圖標(biāo)所涉及到的功能。不過(guò)，工具提示也僅僅只是提示，它不會(huì)替代特定的功能。

那么，如何避免讓工具提示真正發(fā)揮作用，而不是讓人覺(jué)得信息過(guò)載呢？下面的幾個(gè)技巧，能夠讓它真正發(fā)揮作用。

2. 一次顯示一條提示

一次顯示過(guò)多的信息是工具提示讓人覺(jué)得信息過(guò)載的主要原因之一，盡量一次提供一條有效的提示，讓用戶易于理解，不會(huì)覺(jué)得煩躁。下面是 Hotjar 的工具提示：

3. 添加進(jìn)度指示器

在 Hotjar 的案例當(dāng)中，設(shè)計(jì)師使用小點(diǎn)來(lái)指示進(jìn)度，對(duì)于新用戶而言，這樣的進(jìn)度指示是很貼心的，讓他們對(duì)于信息展示的進(jìn)度有個(gè)明確的預(yù)期，還需要多久才能瀏覽完。

4. 每個(gè)工具指示包含一個(gè)交互

這個(gè)原則也需要設(shè)計(jì)師堅(jiān)定不移地執(zhí)行。工具提示的內(nèi)容可以適當(dāng)?shù)亻L(zhǎng)一點(diǎn)，而提示的條目也可以適當(dāng)多一點(diǎn)，但是無(wú)論如何都要確保每個(gè)工具提示僅包含一個(gè)交互的說(shuō)明，否則用戶會(huì)因?yàn)樾畔⒘亢蛢?nèi)容的混亂而被誤導(dǎo)。

5. 允許用戶跳過(guò)教程

正如同你所看到的，在 Hotjar 這個(gè)案例當(dāng)中，用戶并沒(méi)有辦法直接跳過(guò)工具提示這個(gè)環(huán)節(jié)，然而這個(gè)過(guò)程實(shí)際上還是蠻長(zhǎng)的，對(duì)于一部分用戶而言這可能是非常令人難受的。用戶應(yīng)該在任何時(shí)候都有權(quán)利跳過(guò)教程，不然則會(huì)讓工具提示變成垃圾郵件一樣令人難受的存在。

6. 為用戶提供返回的選項(xiàng)

有的內(nèi)容對(duì)于用戶而言很重要，有的表述可能一開(kāi)始并不夠清晰，因此要為用戶提供返回瀏覽的選項(xiàng)，確保他們想看的時(shí)候還能找回去看看。

結(jié)語(yǔ)

工具提示往往出現(xiàn)在新用戶引導(dǎo)流程當(dāng)中，它是整個(gè)應(yīng)用的門(mén)面之一，能否給用戶留下好印象，工具提示也發(fā)揮著至關(guān)重要的作用。可以通過(guò) A/B 測(cè)試等方式協(xié)助測(cè)試工具提示的可用性和易用性，千萬(wàn)不要濫用它。

原文作者 :?Rafayel Mkrtchyan

編輯 :?陳子木

譯文地址：https://www.uisdc.com/how-to-use-tooltips

本文由 @陳子木 授權(quán)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)作者許可，禁止轉(zhuǎn)載。

題圖來(lái)自 Pexels，基于 CC0 協(xié)議