怎樣直觀地告訴用戶「該圖標需要長按才能出現效果」?

希望圖標能產生這樣一種效果,能使用戶無需文字提示或是反覆操作,即可使用戶知道該圖標是需要長按的。就像門把手的設計一樣,很自然的用戶知道是向外拉,而不是向內推。

很多答主的回答都不是在說「提示」,而是在說「觸摸反饋 (Touch Feedback)」,而觸摸反饋是需要用戶按下之後才會產生效果,不能在用戶按下之前就起到提示的作用。如@李翔的答案就是一個提示 (儘管簡單粗暴),而不是觸摸反饋。 希望答主們能夠更好的理解題意再進行回答。


在這方面,其實可以看看已經出現了的業界先例,比如 Windows Mobile 是怎樣做的。

微軟推出 Windows Mobile 的基本想法就是,儘可能將 PC 版 Windows 的操作體驗複製到移動設備上,例如 Pocket PC 或 Smartphone。不過大家都知道,移動設備與 PC 在交互上有著巨大的不同。比如,如何模擬滑鼠右鍵點擊某個對象,呼出上下文菜單?比如這樣:

這個在 Pocket PC 和 Smartphone 上就很難做到,畢竟指點桿是不分左右鍵的。於是,微軟的解決方案就是,以長按某個對象來模擬 PC 上的右鍵點擊,例如長按資源管理器的某個文件,呼出「複製」、「剪切」等功能選項。

微軟是如何提醒「這個對象可以長按」的呢。用戶用指點桿點擊某個對象後,點擊位置附近立即會出現一個轉圈式進度指示器,轉圈滿了以後,右鍵菜單就會呼出。這雖然不是一眼就能看出是長按那樣直觀,不過在嘗試使用了一下之後,很容易找到這個功能,並且很容易記住。從這一點上看,覺得這是一個不錯的解決方案。

----- 補充 -----

做一個其他回答中提到的那種 Button 練習一下:


- 以下內容多圖,手機用戶慎入 -

哈哈!這個問題大家被題面給繞進去了。其實可以用逆向思維的角度去理解和回答。

我們先來看看題面,題面中明確的提出以下三個規定:
第一:不允許出現文字提示;
第二:不需要反覆操作(也就是說,不能夠先怎樣,再怎樣);
第三:用戶直觀的看到,便知道;

接下來,請容許我長篇大論的先假設一通。
我們假設在手機上有一個圖標,而這個圖標是需要用戶在長按的情況之下,才能顯示子層級內容。我們如何在讓客戶看到這個按鈕之後,就能明白這是一個需要長按的按鈕呢?
很抱歉,除了以下這樣,我們幾乎不可能辦到。
因為你被自己的偽需求蒙蔽了。

為何說是偽需求?
你的根本目的不是需要用戶長按。
而是,
增加手指接觸按鈕的時間。

大家看看,在我換了一個角度去看待問題之後,是不是覺得輕鬆很多了?

那麼接下來,我們就圍繞著如何增加客戶手指接觸按鈕的時間來大做文章吧!
可以舉出好多例子呢!

方法一:

方法二:

為便於查看,所有答案都在個人收藏夾內( ENO[觀點與成長]ENO[美學與穿搭]),希望幫到需要的人。


補充一些@Kira 的答案:在xbox上有個很好的先例,也是微軟一直的作派。在按鍵旁邊畫一個圈,在觸摸的時候圈會慢慢填色(圖是黑色變白色),非常直觀的顯示出來。

昨晚比較趕時間...
嘛再詳細說一下,要表示長摁這個持續動作,最好是以一個相同的持續動畫對應,就好比樓上下們的漸變和進度條,要給用戶一個直觀的「我正在干著什麼」的效果。
很多人說跳出個提示,這其實和題主的問題就不太對應了....難道你看到門把手會突然跳出個人幫你打開演示一下嗎....
如果摁得實在很久,不妨摁的時候在按鍵旁邊文字提示就好了,跳齣動畫實在影響客戶體驗。

題外話:
我朋友設計的一個非常暴力的圖標....絕對有效果


長按不像 單擊,它還需要一個時長的判斷,因此在按鍵動畫上是最好提示。一樣的按鍵很難區分是單擊,還是長按,甚至長按多久,但是按鍵都有一個最基本的共識就是得按,這就是給長按提示的最好入口,在單擊的時候通過進度條增長來引導用戶將其與單擊區分,並且提示用戶長按的時長,如此時用戶動作跳出則用進度條回降提示用戶繼續長按,讓用戶隨著進度條完成長按。
下面有個演示圖:

http://ww1.sinaimg.cn/large/6ee21002jw1eajothgfufg205003wdgd.gif


跟xbox和kinect一樣,按下去開始刷條


APP嗎?做成漸變色,藍色的按鈕,按住後顏色開始變化,直到變成綠色,操作執行。在第一次使用前彈出flash示範。


模擬皮球漂在水上,
讓人特別想摁死了它


馬桶沖水按鍵



去掉「才」字,此題有解。

先回顧一下 @eno-one 老師總結的本題三約定:

第一:不允許出現文字提示;
第二:不需要反覆操作(也就是說,不能夠先怎樣,再怎樣);
第三:用戶直觀地看到,便知道;

從易用性的角度來講,如果一個圖標「需要長按能出現效果」,那麼這個圖標就是失敗的。沒有理由人為地去增加用戶的等待時間。所謂「別讓我等」。
@eno-one 兄舉出的例子一般是用於手機解鎖。解鎖操作增加複雜度可以有效防呆,避免無意識地解開手機鎖,所以本來就是一個需要增加時間的使用場景。用來回答這個問題,非常厲害。
而以下內容都是針對普通的應用場景,故除開此特例。只針對「長按」,不兼顧「才」。

之前很贊同 @NovaDNG 老師在這個問題下面的 回答,大意是:沒有辦法,長按是反直覺的,因為我們無法在現實生活中找到只對長按操作有響應的物件。

今天讀《移動應用UI設計模式》的時候看到這樣一句話:

網路應用的圖表讓人們形成了通過「指針懸停」操作查看細節的心理預期。你可以考慮通過「按下並持續」(onTap)操作來顯示數據點的詳細信息,提供用戶所需的更多內容。

雖然我不是很同意這句話(詳細信息「短按即顯示」也是可行的),但裡面提到的與「現實生活預期」相對的另一種「信息生活預期」,似乎可以拓展一下 NovaDNG 回答的思路。如我之前在另一個回答中所述,菜單圖標的聯繫有兩條路子:關注現實世界中的對應物;關注功能本身的概念特點。

現實生活中沒有的參照預期,可以在信息生活中找到。連同上面引文中的例子,試舉三條:

1. 桌面端懸停預期:桌面端用戶在遇見桌面圖標時,由於單擊右擊雙擊(還有 alt + 雙擊……)操作均被佔用,所以用戶通過學習形成了通過滑鼠懸停來查看圖標所示內容的基本屬性。
應用舉例:上面引文中的例子:「通過「按下並持續」(onTap)操作來顯示數據點的詳細信息,提供用戶所需的更多內容。」

2. 移動端圖標預期:移動端用戶在遇見應用圖標時,由於短按操作已被「打開」佔用,所以用戶通過學習形成了通過長按來排布、刪除圖標的預期。
應用舉例:UC 瀏覽器中的主頁書籤,可通過長按進行排布、刪除操作。再想想 ZAKER?

3. 安卓文件預期:Android 用戶在遇見文件(夾)時,由於短按操作已被「打開」佔用,所以用戶通過學習形成了通過長按來操作文件(夾)本身的預期。
應用舉例:百度雲 Android 客戶端的文件管理,可通過長按選中一個文件。

而百度雲 iOS 客戶端無此功能,與系統保持一致,使用標題欄按鈕進入多選,或短按小三角進行單獨操作。

從上述三例可見,在普通的應用場景下,信息生活中能找到的「長按操作預期」,均是「短按操作」被主要功能佔用之後,使用「長按操作」來滿足次要功能,因此也沒有違反第二段中「別讓我等」的用戶體驗原則。只是由於都是與次要功能相關,所以原題中的「才」字無法滿足。

故,去掉「」字,此題有解。


贊同@Alexlah 的。我覺得UC瀏覽器的舊版本在這方面就不錯,你按下的時候會圍繞觸點逐漸出現一個圓圈,至今在UC的symbian版本上還能見到,不知道他們後來為什麼拋棄了這個效果



「我儘力了,是真的。」

13年11月18日更新,優化如下:
"使勁"→"使勁兒"

15年10月10日更新,調整如下:
隨著3D-touch的推出,該方案作廢。


看了大家的答案大部分都是需要用戶點擊後,在按下的過程中進行提示。我認為在用戶按下之前就能提示長按操作的圖標,還是應該參考現實中的體驗,現實中需要長按的操作還是能找到的,比如指紋打卡機之類需要掃描操作的東西,一般都需要把手指放上去停留幾秒吧,可以參考這個隱喻,在圖標上加上掃描動畫,我認為可以一定程度上提高長按操作的提示性。


反對目前所有的答案.

審視問題會看出, 題主希望得到的答案是提示, 而不是觸摸反饋 —— 能夠讓用戶在"進行操作"之前, 便知道這個"圖標"可以長按, 而且"無需文字提示".

目前已有的答案, 絕大多數講的都是"觸摸反饋". 簡單的來講, 這些答案中給出的解決方案毫無例外都是"按下... 出現..."這麼個形式, 而不是能夠讓用戶在進行操作前就明白.

而@李翔的答案, 則違反了題主希望的"圖標" —— 這個操作對象已經不再是圖標而是文字了.

於是, 怎麼樣才能告訴用戶, 這個圖標需要長按才能出現效果呢?

其實只要仔細審題就會發現, 題主已經替我們掃去了一個障礙. "需要長按才能出現效果"意味著這個按鈕只對長按操作產生反應. 知道了這一點, 就可以進行針對性的按鈕設計了.

能夠做到不需提示便可指明的操作, 基本來源於現實生活, 所以我推崇的還是擬真設計. 於是讓我們把眼光轉向現實. 在現實生活中, 有什麼物件的操作是需要且只能"長按"後才會產生效果的?

我環顧四周, 發現, 沒有.

雖然我知道盒帶機和 CD 機的快進/快退鍵需要長按, 但是很多盒帶機或者 CD 機的快進鍵是可以卡住的 (按下之後不會自動彈起); 對於第一次用手機的人而言如果他沒有事先查看說明書的話他是不會知道長按電源鍵關機的; 而油門/剎車在踩下的瞬間即可生效; 腳踩式垃圾桶的踏板也和油門一樣 (況且有很多垃圾桶是踩一下打開, 再踩關閉的設計)......

實際上, 在我們日常生活中, 難覓"需要長按才會產生效果"的操作其蹤了. 歸根結底, "長按"這個操作, 是反直覺的, 需要學習成本, 是無法在"沒有文字提示, 不需反覆操作"的情況下直接實現的.

所以我想告訴題主, 我的回答是: 我們無法無需文字提示或數次嘗試性操作而讓用戶在進行操作之前便知道這個按鈕只能在長按之後才能出現效果.

浪費時間看完這條沒有幫助的答案的同學們, 可以點沒有幫助了. 如果覺得不解氣, 可以順手再點一個反對.


人對不完整的東西都有自動補足的心理,
把這種不完整很明顯的展示出來,並暗示他們要達到完整需要長按。

畫了一個,按之前並不需要動畫,按之後會有,不然用戶會覺得被騙。


主機上是給圓環充氣。不過最好不要設計需要按住觸發的UX,Pro用戶要的是快快快,一點也不要等


就沒有人想過可以在圖標上畫個指紋嗎?難道只有我看到指紋會想「放上去」而不是「點上去」?


在交互設計概念中有一個叫「social-transmitted detail」的東西,就是社會化傳播細節,何為社會化傳播細節,就是如題主這個其實有點類似於口碑營銷,有時候這甚至能成為你的app的一個賣點。就拿微信5.0的長按發文字,左滑出現刪除控制項這些做法,毫無所謂的交互線索(clue),甚至可以說是需要用戶的學習成本的,但是這樣的做法,一方面成本並不高,只需要一個人看著另一個人操作一次就可以完全掌握。另外,不知你是否在第一次在朋友圈發了文字之後有人在下面評論說:「天吶,你是怎麼做到發文字的?」你是否認為自己的虛榮心滿足了一把。而現在,這個功能的存在已經很少有人不知道了,而張小龍改了這麼多版也沒去添加一個發布文字的入口。
說了這麼多,就是想說,有時候不告訴用戶,沒有關係,請相信用戶是很聰明的。


靜態的做不到
按鈕做成在原始位置上不斷無規則顫動的
摁過滿地亂爬的螞蟻么


讓那個按鈕扭來扭去,自然讓人想按住它


推薦閱讀:

TAG:圖標設計 | 交互設計 | 用戶界面設計 |