矽谷之路 56：產品經理之路（三）

今天我們來繼續產品經理之路小牛篇的講解。

在前兩講中我們講解了「雷十條」中的基本原則和布局原則，今天來聊聊最後一部分，即交互原則。

交互原則的第一條是：善用圖文

來看幾個例子。下面來自美麗說的六幅圖的設計你會選擇哪個呢？換個問法，你覺得哪個的點擊率會最好呢？答案是最後一幅圖，它還領先第一幅將近3-4倍呢。據沁原說，酷我之前為了測試圖片的點擊率會放幾張圖到網上測試，最終留下最受歡迎的。這就是所謂的數字化運營了。由此看來，最近比較火的growthnhacking（增長黑客）概念也就沒有那麼高大上了，其實就是用數字來驅動你的運營嘛。

再來判斷一個例子吧，下面兩幅你覺得哪副設計遵循了「善用圖文」的原則呢？

Bingo!是第二幅。那麼為什麼會這樣呢？原因就在於和下圖中的三個例子一樣，它成功的設計了文字簡介，而且按鈕所要表達的意思一目了然。

同樣的道理，再看看酷我為了提升音樂盒註冊率而做的改變。最後一個圖的效果要遠遠好於第一幅。這都要感謝產品經理聰明的大腦和豐富的經驗呀。

下面這幅圖是酷我曾經合作過的網吧版，別看有點矮矬窮，可是圖片和文字非常匹配且明了。所以，別在圖片的海洋迷失了自己喲，真正能明確傳達意思的圖文才是王道。

相比之下，酷我K歌版就不夠明確了，圖片和文字的配比和圖片的選擇不夠好，影響了點擊量。

在下圖中手機版中也存在圖文的問題。

酷我很成功的地方在於不斷摸索，從而改進頁面設計上的短處。例如歌詞按鈕放置的位置，以及「收藏」和「下載」按鈕的誕生與位置的移動。

BitTiger的官網主頁也是經歷了這樣的摸索過程，盡量使圖文做到協調匹配。由此可見，遵循「雷十條」的原則不應該循規蹈矩地變成了教條主義，大家應當活學活用，注意設計的細節，不斷摸索。

好啦，了解了「善用圖文」，我們來進入下一條原則的講解：直觀快近

有些抽象，不妨來看一些例子來幫助我們理解：

還記得手機沒有App，想聽歌需要從電腦上下載的年代嗎？雖然這種聽歌方法已經很少用了，可是經典的產品設計卻流傳了下來。上圖中，一根線連接電腦和手機非常直觀，下面的列表也非常清楚的顯示了哪些已傳，同時還有進度條和可用空間的情況。

相比之下，酷我曾經的搜索功能就會給大家帶了一些費解。輸入搜索內容後，有的人會錯點「遊戲」按鈕，有些人就不知道該在哪裡點確定了。所以，不夠直觀。

再來感受一下下面兩個宣傳酷我APE無損音樂的海報。你會選擇哪一款上線呢？

既然海報的目的是「導流」，那麼不難發現第二幅中的下載按鈕非常醒目，而且文字說明簡單易懂。

備受好評的酷我mini版設計也很好的實踐了「直觀快近」的原則。滑鼠不在這個mini頁面時顯示歌詞，當移動滑鼠到頁面上時變成了可操作的選項，還有提示彈出，非常具有可操作性。

iPad版的設計同樣會在你加入緩存時有提示，可是如果提示內容可以彈出在用戶滑鼠所放的位置就更好了。

照例，我們來看看BitTiger做的怎麼樣。當你的滑鼠放在視頻類別的文字上時會彈出「viewnchannel」的字樣，這就是引導用戶來觀看更多的同系列的視頻。

我們來看看「雷十條」最後一個原則：反饋友好

人嘛，都喜歡鼓勵，喜歡友好的的互動。在網頁設計中同樣可以做到友好地反饋客戶。來看例子：

有些嗲嗲的問句也許會讓大人們心軟，再讓寶寶多玩一會兒呢。除此之外，「Hello，酷狗」的啟動聲音想必很多人都聽過，非常可愛甜美。

有時用力過猛會出現一些比較雷人的提示語：

為此，酷我還專門搞了一個系統的指南，規範大家的「親密用語」

下圖就體現了酷我提示語的演進：

其實，好的文案不僅出現在產品經理領域。民間也處處是智慧的妙語：

好啦，「雷十條」已經全部講完了，做一個總結吧：

其實，所有這些原則的核心就是：做到不讓客戶想，而且明確的讓Ta們知道該怎麼做。

做到以上這些，恭喜你，已經成為了一個可以從80分做到85分的產品小牛。怎樣進階到產品大牛和老牛呢，盡請期待後面的講解！

更多精彩內容， 請掃描下面二維碼，關注微信公眾賬號「論碼農的自我修養」