如果你是一名經(jīng)驗豐富的設(shè)計師，你一定會認(rèn)同一點，受他人啟發(fā)并不是在抄襲UI設(shè)計。這是一種最佳的研究實踐。它也要運用各種設(shè)計模式，也要遵循設(shè)計規(guī)范，也需要確保選擇用戶熟悉的模式來建立可用的界面。

有些人可能會說，死守規(guī)范和模仿他人會扼殺創(chuàng)造力，終將有一天，所有應(yīng)用都長一個樣。但從用戶體驗的角度我注意到另一個問題。習(xí)慣于最佳實例可能會讓你盲從Google/Facebook/Instagram/還有你最喜歡的應(yīng)用，誤以為他們的設(shè)計目標(biāo)與你的相同，你卻未對此產(chǎn)生質(zhì)疑。下面是一些被認(rèn)為（或是曾經(jīng)被認(rèn)為）是最佳實例的模式，但未必如你初見時所認(rèn)為的那么好。

1. 隱藏式導(dǎo)航

至少有五十萬篇關(guān)于漢堡菜單的文章，多數(shù)都是設(shè)計師寫的，為此展開激烈爭辯。如果你對此一無所知，可以讀讀這篇或者這篇。但簡而言之，討論點并不是這個圖標(biāo)本身，而是將導(dǎo)航隱藏在一個圖標(biāo)中。

側(cè)滑菜單非常靈活，使用也方便。

這個解決方案對于設(shè)計師很有誘惑力，方便快捷：你不用操心有限的屏幕空間，把整個導(dǎo)航塞進默認(rèn)隱藏的滾動層里就可以了。

但是，實驗顯示，用一種更加可見的方式展示菜單項，能夠提升活躍度、用戶滿意度、甚至收入。這就是為何所有大公司都在舍棄漢堡菜單，讓最重要的導(dǎo)航項持續(xù)可見。

YouTube導(dǎo)航的變革，Luke Wroblewski注

如果你的導(dǎo)航很復(fù)雜，將其隱藏并不是友好的移動端做法。為它排個主次才是。

2. 圖標(biāo)，到處都是圖標(biāo)

由于屏幕空間有限，另一個看似無需動腦的節(jié)省空間的方法，就是把文字盡可能都換成圖標(biāo)。象形圖標(biāo)占用更少空間，也不需要翻譯，畢竟人們對這些都很熟悉，對吧？而且其他應(yīng)用都在這么做。

腦中帶著這樣的假定，應(yīng)用的設(shè)計師有時就會把功能藏在一些難以辨識的圖標(biāo)里面。例如這個，在Instagram中你可以通過這個圖標(biāo)直接發(fā)送消息，你能猜到嗎？

或者假設(shè)你從沒用過Google Translate，點下面這個圖標(biāo)你覺得會是什么功能？

有個常見的錯誤，就是假定用戶都熟悉這些象形圖，或者愿意花時間探索和學(xué)習(xí)它們的含義。

Bloom.fm難以理解的標(biāo)簽欄。

如果你認(rèn)為在圖標(biāo)上加上懸浮氣泡會讓它更易用，那你就錯了。即使你是Foursquare，用戶無論如何都需要學(xué)習(xí)使用。

Swarm中的圖標(biāo)提示。

這不是說根本不應(yīng)該用圖標(biāo)。?有許多人們相當(dāng)熟悉的圖標(biāo)，其中多數(shù)都表現(xiàn)一些常用功能，例如搜索、播放視頻、郵件、設(shè)置等等。（但用戶仍然會感到不確定，例如，點擊心型圖標(biāo)時究竟會發(fā)生什么。）

有些圖標(biāo)多數(shù)用戶都認(rèn)識，這些可以作為通用圖標(biāo)。

但是，復(fù)雜且抽象的功能總是應(yīng)該帶有適當(dāng)?shù)奈淖謽?biāo)簽。在這種情況下，圖標(biāo)仍然有用，因為它們提升了菜單項的顯著性，也為應(yīng)用增加了一絲親切與個性。

Pixelmator的導(dǎo)航

基礎(chǔ)功能用圖標(biāo)可以很有效地展現(xiàn)，但對于復(fù)雜的功能，應(yīng)該帶上文字標(biāo)簽。（如果要用圖標(biāo)，一定要做可用性測試。）

3. 基于手勢的導(dǎo)航

蘋果在2007年推出iPhone時，多點觸控技術(shù)成為主流焦點，用戶了解到他們不僅能夠在界面上點擊，還可以放大、捏合和滑動。

手勢在設(shè)計師群體中盛行起來，有許多應(yīng)用都帶有實驗性的手勢控制。

Clear應(yīng)用中的手勢導(dǎo)航。

就像把導(dǎo)航藏在圖標(biāo)中替代文字標(biāo)簽，手勢有時候?qū)τ谛枰?jié)省屏幕空間的設(shè)計師而言也極具誘惑力。（“不應(yīng)該有刪除按鈕，人們左滑就行了?；蛘哂一残?，這個我們來決定。”）

關(guān)于手勢要知道的第一件事情，就是它們總是隱藏的。人們需要記住它們。就像漢堡菜單那樣：如果將某個選項隱藏起來，使用它的人就會減少。

而且，手勢與圖標(biāo)有同樣的問題：有些通用手勢大家都掌握了，例如點按、縮放、滾動。還有一些手勢每個應(yīng)用都不同，需要探索和學(xué)習(xí)。

但不幸的是，多數(shù)手勢在不同應(yīng)用中，都是非標(biāo)準(zhǔn)且不統(tǒng)一的——這仍然是觸屏界面設(shè)計相當(dāng)新的一個領(lǐng)域。甚至簡單如滑動手勢，在不同郵件應(yīng)用中也不一樣。

在蘋果的郵件應(yīng)用中右滑，會顯示出標(biāo)為未讀選項。

同樣的手勢在Mailbox里卻是歸檔郵件。

還有，想一想，搖晃手機可能既是撤銷（iOS）又是發(fā)送反饋（Google Maps)。

不要忘了手勢是隱藏式的控制，你的用戶需要付出大量的精力才能記住。除非你是Tinder，那你或許可以為全世界定義右滑的意義——但也僅限于你應(yīng)用中至關(guān)重要的某個概念。

4. 首次使用的教學(xué)引導(dǎo)

首次使用，最近一個火熱的用戶體驗議題，指的是用戶與應(yīng)用的第一次接觸。在許多例子中，這就是指顯示一些教學(xué)引導(dǎo)層，向用戶說明應(yīng)用界面：

dcovery中的教學(xué)引導(dǎo)。

為什么這是個糟糕的方案？因為多數(shù)用戶會跳過你的介紹；他們只想立刻上手。即使他們注意到你的教程，通常也轉(zhuǎn)瞬即忘。（尤其當(dāng)界面信息太多時。）最后這點也很重要：加入教學(xué)引導(dǎo)并不會使界面更直觀。牢記這一條：

用戶界面就像一則笑話，如果你非要解釋它，就不好笑了。來源：Startup Vitamins

首次使用的流程還可以用許多其他方式來設(shè)計，或許對用戶更加有用。例如Slack，用了主界面來營造環(huán)境氛圍。他們做了自我介紹，重點闡述了它的好處，而非界面與功能。

有一種更加有互動性的方式歡迎新用戶，漸進式。Duolingo沒有解釋應(yīng)用的功能：它鼓勵用戶打開，在選定的語言中做一套快速測試（甚至都不用注冊），因為人們在實際操作中學(xué)習(xí)最快。而且它也是一種更吸引人的方式來展現(xiàn)應(yīng)用的價值。

還記得滑動手勢在Mailbox中與Apple Mail里不同么？這就是它如何漸進式引導(dǎo)的：用戶會看到一系列引導(dǎo)頁，在實際使用應(yīng)用之前，他們要在其中試著操作每一個手勢。

在設(shè)計半透明層上的教學(xué)引導(dǎo)之前，停一停，思考一下用戶首次打開的體驗會是怎樣。要重視環(huán)境。多數(shù)情況下，總有更好的方式來歡迎用戶。

5. 有創(chuàng)意但不直觀的空狀態(tài)

空狀態(tài)非常容易被經(jīng)驗不足的設(shè)計師忽略，但是，它是應(yīng)用整體用戶體驗的重要因素。

有時候設(shè)計師把錯誤信息和空狀態(tài)當(dāng)作揮灑創(chuàng)意的畫布。

例如Google Photos的這個空狀態(tài)界面：

Google Photos中的空狀態(tài)。

第一眼看覺得很棒，對吧？遵循規(guī)范，層次分明，還有漂亮的插畫。

但再看一眼，有一些奇怪的東西：

• 如果都沒有相片集，為什么還要一個如此突出的搜索按鈕？為什么要在空無一物中搜索？
• 第二明顯的元素——插畫，卻顯然是不可點擊的（盡管許多人會試著去點）。
• 提示說我應(yīng)該尋找頂部的“+”按鈕，這太尷尬了。為什么提示本身不帶有添加按鈕？這就像是在說“點擊繼續(xù)按鈕繼續(xù)”。

上面的這個空狀態(tài)并沒有幫助用戶理解環(huán)境：

• 相片集是什么？它們有什么用？
• 為什么我沒有相片集？
• 我該怎么辦（我該做點什么嗎）？

說到創(chuàng)造力，有時候少即是多。下面的空狀態(tài)在實用性方面表現(xiàn)就非常好。（我們暫且忽略“現(xiàn)在點擊下方按鈕”的說明。）

Lootsy的空狀態(tài)。

別忘了空狀態(tài)（類似于網(wǎng)頁的404頁面）不僅僅關(guān)乎視覺美學(xué)與品牌個性。它們在可用性方面還扮演著更重要的角色。要讓它們直觀易懂。

質(zhì)疑一切

不要誤會我的意思：設(shè)計模式與最佳實例仍然是你的良師益友。但要牢記應(yīng)用和用戶是不同的，某種解決方案可能在一個應(yīng)用中大放異彩，在你的應(yīng)用中卻一敗涂地。這不是普適規(guī)律。而且，你永遠(yuǎn)都不會知道一個應(yīng)用為什么要這樣設(shè)計。

獨立思考。獨立設(shè)計。獨立研究。

權(quán)衡、測試、驗證——別怕違背規(guī)范，只要那樣做更有意義。

原文鏈接：https://medium.com/@kollinz/misused-mobile-ux-patterns-84d2b6930570

作者信息：Zoltan Kollin.Thinking about experiences as UX director at Ustream, co-organizer of Amuse UX Conference and co-author of?http://uxmyths.com/

#專欄作家#

可樂橙，微信公眾號：可樂橙（colachangreen）。人人都是產(chǎn)品經(jīng)理專欄作家，UI/UX設(shè)計師，關(guān)注互聯(lián)網(wǎng)，關(guān)注科技。現(xiàn)居杭州，與小伙伴們正在創(chuàng)業(yè)途中?；蛟S不是一名優(yōu)秀的設(shè)計師，至少是個快樂的設(shè)計師。

本文原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)許可，不得轉(zhuǎn)載。