如果您想訂閱本博客內(nèi)容，每天自動發(fā)到您的郵箱中， 請點這里

大家都說前端寫頁面較多，幾乎用不到算法。本文愿從彈幕設(shè)計這個場景來描述算法在前端中的應(yīng)用，我們先來看下實現(xiàn)效果：

圖1.1 彈幕效果

 

開場之前我們先來描述彈幕開發(fā)的難度，再集中精力描述算法設(shè)計的思路。

* 如何保證不同字號的彈幕不碰撞
* 彈幕的位置計算
* 彈幕的速度控制及動畫實現(xiàn)
* 彈幕與視頻的同步

***如何保證不同字號的彈幕不碰撞***

如果彈幕采用相同的字號，碰撞的問題處理起來比較簡單，只要考慮相鄰彈幕的播放速度和偏移的位置就可以計算出來。然而使用不同字號的彈幕處理起來就麻煩了許多，彈幕的起始位置不可以線性的增加，比如第一行放了字幕，接下來的字幕可以按順序從上至下依次放置即可。

***彈幕的位置計算***

只有設(shè)計好彈幕的初始位置，才可以動態(tài)、的管理不同字號彈幕的碰撞問題。打個比方，我們通過接口獲取了2秒之內(nèi)的彈幕數(shù)據(jù)1000條，每個字幕的長度、速度、字號都不同，怎么管理這些彈幕，示意圖如下：

圖2.1 彈幕管理示意圖

 

這是第一種情況，按照從上到啊的順序依次擺放以后會有幾個問題：
1. 彈幕五、六、七該怎么計算位置，按top值循環(huán)取模+累加嗎？
2. 當(dāng)彈幕一或者彈幕三足夠長的時候，如何準(zhǔn)時的跳過當(dāng)前位置計算？
3. 當(dāng)前屏幕的彈幕播放結(jié)束，如何再計算的時候利用空出來的位置
4. 空出的位置是否滿足當(dāng)前彈幕的高度
5. ……

一系列問題就不統(tǒng)統(tǒng)列舉出來了，基于這個背景我們結(jié)合數(shù)學(xué)建模的思維方式，找到了彈幕場景相似度非常高的機場運營。我們可以把彈幕當(dāng)做飛機，每個時間段播放多少彈幕和機場每個時間段放飛多少飛機一個道理。

首都國際機場一共有3條跑道，兩條4E級跑道、一條4F級跑道，2016年的吞吐量為9000萬人次。它的運行機制就是所有飛機通過搭臺有順序的共用3條跑道來完成運輸任務(wù)的。

同理，我們也設(shè)計了幾個個角色：一個是軌道(跑道)、一個是調(diào)度(塔臺)、一個是彈幕(飛機)，我們?yōu)槊總€角色設(shè)計一個類分為為Track、Main、Bullet。

* 軌道
            
       軌道這個角色很重要，它可以解決彈幕位置計算、速度控制、碰撞檢測問題。
       首先，我們要來初始化軌道。通俗的說我們要修建幾個跑道呢，我們不是實物，可以動態(tài)調(diào)整軌道的                        數(shù)量，計算的原則：
        軌道數(shù)量 = 播放器有效高度 / 設(shè)備基準(zhǔn)字號
    * 播放器有效高度：播放器的實際高度減去控制條的高度，因為彈幕不可以遮擋控制條。
    * 設(shè)備基準(zhǔn)字號：移動端是10px，pc端是12px；
        為啥計算公式是這樣的？因為我們要支持不同字號的彈幕。試想不同的字號對物理空間的占用是不同的，然而如果要求軌道的尺寸是動態(tài)的，那就帶來很復(fù)雜的計算。本文提出“虛擬軌道”的概念，在交通管制中最常見的就是道路合并或者改向。我們也是采用將相鄰的物理軌道臨時合并為一條軌道。這樣就可以輕松的解決不同字號的軌道占用問題。原理圖如下：
        

圖2.2 軌道計算示意圖

其次我們來回憶下機場的工作流程：
1. 機長呼叫塔臺，CZ6132請求起飛
    * 目前跑道均被占用，請等待
        * N時刻后再次執(zhí)行步驟1
    * 目前跑道 A1 空閑，準(zhǔn)許進入
        * 執(zhí)行步驟3
2. 塔臺查看跑道使用情況
3. 進入跑道，起飛完成
4. 機長通知塔臺，本次起飛完成，釋放跑道的占用
5. 其他飛機同樣執(zhí)行上述步驟

按照這個思路，我們的彈幕工作流程：
    
1. 彈幕進入播放器
2. 軌道根據(jù)彈幕的播放速度、尺寸計算是否有合適的軌道提供
    * 沒有
        * 通知彈幕尚無合適軌道提供，請等待；同時，彈幕隊列中的其他彈幕依次執(zhí)行步驟1
    * 有
        * 執(zhí)行步驟3
3. 播放器加載彈幕DOM，開始播放，待播放完成
4. 播放完成通知軌道更新軌道占用情況
5. 其他彈幕同樣執(zhí)行上述步驟

圖2.3 軌道可用性計算示意圖

 

關(guān)于軌道的基本原理我們整理清楚了，當(dāng)然還有不少細(xì)節(jié)比如如何和調(diào)度通信、如何和彈幕通信以及虛擬軌道檢測算法等。有興趣的同學(xué)可以參考代碼吧。https://github.com/bytedance/xgplayer/blob/master/packages/xgplayer/src/control/makeBullet.js

* 彈幕
       彈幕基本是實現(xiàn)“飛機”的角色，我們要求它具有自身的屬性和方法。比如調(diào)度中心通過id能拿到它所有的基本信息，軌道控制也可以通過彈幕進行檢查和更新。當(dāng)然彈幕也必須具備狀態(tài)自動更新、移動、播放結(jié)束通知、自動銷毀等功能。
* 調(diào)度
        調(diào)度就是搭臺的化身，承接著軌道、彈幕的控制，也保持著與播放器的步調(diào)一致。它的職責(zé)如下：
    1. 播放器交互控制
    2. 彈幕隊列控制
    3. 自身狀態(tài)更新
    4. 數(shù)據(jù)格式轉(zhuǎn)換
    5. 動畫執(zhí)行
        還是直接用流程圖來描述更直接些：
        
       

圖2.4 彈幕運行機制流程圖

在彈幕啟動之后，首先要檢查本地是否已有緩存數(shù)據(jù)，沒有的話直接請求數(shù)據(jù)并緩存，然后執(zhí)行數(shù)據(jù)讀取，首次過濾數(shù)據(jù)進入彈幕隊列，同時啟動定時器。彈幕隊列的數(shù)據(jù)會定期請求軌道，檢測隊列里的彈幕是否可以進入，一旦確認(rèn)后軌道做好登記，彈幕就可以進入播放器開啟動畫播放了。定時器每隔2秒就會再次更新數(shù)據(jù)進入到彈幕隊列（這塊不同的業(yè)務(wù)可以定制不同的規(guī)則）。彈幕播放結(jié)束后會通知調(diào)度和軌道，調(diào)度會在彈幕隊列中移除該彈幕實例，軌道也會移除該彈幕實例的軌道占用。

藍(lán)藍(lán)設(shè)計( www.b186.net )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)

陳幼堅不是學(xué)設(shè)計的，你相信嗎？

時代孕育的一代宗師！

如果您想訂閱本博客內(nèi)容，每天自動發(fā)到您的郵箱中， 請點這里

頭腦風(fēng)暴是創(chuàng)意點子常用的方法，那么從用戶出發(fā)的腦暴有什么不同？從過去幾年用研發(fā)現(xiàn)向產(chǎn)品方案轉(zhuǎn)化的腦暴案例中，總結(jié)成功與失敗經(jīng)驗，提煉出目前最優(yōu)的流程與執(zhí)行技巧，一起來提高創(chuàng)意點子產(chǎn)生的成功率吧！

關(guān)于新產(chǎn)品創(chuàng)新的成功率，有這樣一組數(shù)據(jù)：3000個原始想法，能變成300個成熟想法，300個成熟想法能產(chǎn)生125個項目，其中大概有9個能進入早期開發(fā)，4個能大力開發(fā)，最后成功的只有1.7個。（來自彭肯恩博士的研究）

大多數(shù)點子的失敗，可能的原因有很多，比如疏于對趨勢的關(guān)注和研究、缺乏理論的突破、缺乏執(zhí)行力、難以逃脫組織思維慣性等等（來自創(chuàng)新管理課程），其中還有一個常常提到的原因：離用戶太遠(yuǎn)。在最初想點子的時候，由于不知道用戶需求、腦補用戶需求、片面地針對用戶表面部分需求卻忽視深層需求來規(guī)劃，就會導(dǎo)致產(chǎn)品或功能開發(fā)完成以后，不知道目標(biāo)用戶、目標(biāo)場景，也不知道對用戶的價值，最終產(chǎn)品也會因用戶不去使用，而導(dǎo)致創(chuàng)新失敗。

作為用戶研究者，洞察和分析用戶真實需求是我們的本職和專長，但如何把這些用戶研究的發(fā)現(xiàn)以更有效的方式轉(zhuǎn)化為「靠譜」的好點子，則需要與團隊里各個角色一起不斷的努力。從14年起，我們在一次次從用研發(fā)現(xiàn)到產(chǎn)品點子的頭腦風(fēng)暴實踐中，不斷優(yōu)化流程、評估效果，形成了現(xiàn)在的「從用戶出發(fā)的創(chuàng)意腦暴」流程，在這里分享給大家。

傳統(tǒng)的頭腦風(fēng)暴法（brainstorming）相信大家都熟悉，就是一組人圍在一起，隨意的將腦中與主題有關(guān)的見解提出來，再將大家的見解分類整理。但在實際執(zhí)行的過程中，頭腦風(fēng)暴的現(xiàn)場卻常常交錯著討論、腦補、推理、玩笑等等，然后時間很快過去，卻沒有產(chǎn)出「靠譜」的點子。從用戶出發(fā)的創(chuàng)意腦暴，是以典型用戶故事為線索，輕松、的產(chǎn)出點子的頭腦風(fēng)暴過程：一方面，線索契合用戶真實完整的需求場景，點子變得更容易想也更符合用戶需求；另一方面，通過流程上的細(xì)節(jié)設(shè)計，可以更的激發(fā)點子產(chǎn)生。

整個過程分為8步。雖然常常的情況是一個人想不出方案，就馬上拉人一起腦暴發(fā)散，但其實腦暴前的素材和流程準(zhǔn)備，以及達(dá)成共識對腦暴的最終效果起到了至關(guān)重要的作用。

第一步：確定一個不遠(yuǎn)不近的腦暴主題

產(chǎn)生好點子的前提是問對問題，問對問題需要跳出眼前的思維限制，但又不要太天馬行空。要做到這點并不容易，這要求腦暴的組織者在一開始就想清楚團隊真正要解決的問題是什么，而不僅僅「產(chǎn)品的某個功能眼下要怎么做」這種具體問題（這樣的問題聽起來就讓人疲憊）。舉個例子，當(dāng)眼前的業(yè)務(wù)問題是想出一些裝扮功能，如果把腦暴的主題定為「裝扮還可以做哪些新功能」，思路就會陷入現(xiàn)有的裝扮流程里，這時點子的方向已經(jīng)被具象和限制，有時甚至是無解的；如果定為「如何幫助用戶通過裝扮來表達(dá)自己」（前提是用戶真的用裝扮在滿足這一需求）就會更合適一些，這樣就可以去想如何通過裝扮表達(dá)自己的心情、興趣、狀態(tài)、、所屬群體身份等等，思路打開的同時又與業(yè)務(wù)結(jié)合；而如果僅僅是「用戶如何表達(dá)自己」，想出的點子，就會太泛，脫離業(yè)務(wù)。

第二步：有選擇的邀請團隊成員

首先，有選擇的邀請樂于分享、樂于溝通、思維活躍的人，他們會自然而然的產(chǎn)生想法，互相交流，否則每個人盯著自己的點子說著自己的故事就會喪失一組人在一起的意義；其次，在邀請成員時，不建議只有自己組的組員（雖然這樣比較方便），因為參與角色的多樣性一方面可以相互激發(fā)創(chuàng)意，同時也讓點子在收斂階段能得到更多元的評價（比如工程師對點子可行性的評估就有其專業(yè)的判斷）。在人數(shù)上，雖然6-8人是腦暴的建議人數(shù)，但因為我們的腦暴流程會讓點子批量產(chǎn)生，人數(shù)的增加會直接導(dǎo)致后續(xù)點子收斂時效率的降低，所以目前來看建議6人為佳。

第三步：準(zhǔn)備簡潔又有代表性的用戶故事

用戶故事的準(zhǔn)備是腦暴的一個關(guān)鍵，吸引著我們不斷的去改進和探尋。過去，我們也有過一些不太理想的嘗試：讓參與者分享自己的故事（如畢業(yè)生如何找房），這時很容易就根據(jù)主觀和片面的需求想點子；給出一些用戶需求的詞讓大家聯(lián)想（如不孤單），這時參與者對著普通又太正確的詞已經(jīng)想過很多遍，很難進入狀態(tài)；給出一系列相關(guān)故事（如多個類似的故事）幫參與者發(fā)想，這時呈現(xiàn)的信息對參與者來說已經(jīng)過于復(fù)雜，傳達(dá)的效率很低；給出的每個故事都帶有用戶痛點（如粉絲給明星發(fā)消息得不到回應(yīng)），這時參與者往往會依照故事中的情節(jié)去推理，絞盡腦汁非常辛苦，卻忽略了沒有痛點的地方藏著用戶的真實需求（如粉絲默默的把想對明星說的話記錄在手機備忘里）。

所以，目前的做法是：

• 對調(diào)研中收集到的大量用戶原始故事進行分析；
• 根據(jù)分析點之間的相互關(guān)系，按照一定的維度把分析點組織起來，比如組織成幾類典型的用戶畫像、使用產(chǎn)品的幾類動機、幾個場景、幾步行為流程等等，組織維度符合 MECE（ Mutually Exclusive Collectively Exhaustive，相互獨立、完全窮盡）原則即可；
• 按照組織后的結(jié)構(gòu)（如畫像/動機/場景/流程等），把同一個類別下多個反映分析點的真實故事組合改編成一個典型故事。

舉例來看，研究粉絲的過程中，我們發(fā)現(xiàn)有的粉絲會組團給偶像投票打榜并感嘆「團結(jié)就是力量」、有的粉絲會在活動現(xiàn)場和他人一起大聲應(yīng)援并覺得暖心、有的粉絲在 QQ群和其他粉絲一起討論相互訴說并且感覺很棒。這些故事都反映出粉絲對于「群體」、「團結(jié)」的訴求，將這幾個不同人的真實故事綜合起來，就形成了一個特別在意「團結(jié)形象」的典型粉絲故事。這個「團結(jié)」的典型故事和「秩序」、「強大」等等典型故事一起反映了粉絲「群體形象」方面的訴求。

通過這樣的方式得到的典型故事不僅有真實故事的細(xì)節(jié)，而且嚴(yán)謹(jǐn)?shù)胤从秤脩粜枨?，信息量大，結(jié)構(gòu)完整。腦暴參與者面對這些故事，就很容易理解，并聯(lián)想出更多符合用戶真實需求的點子。整個過程說起來簡單，但在實際執(zhí)行時卻考驗著研究人員的大局觀、邏輯能力、洞察力、組織能力等等，整個研究過程有時可能會需要1-2個月。

第四步：設(shè)置嚴(yán)謹(jǐn)又輕松的流程

在腦暴流程上的設(shè)置上，主要的嘗試點在個人想點子和大家交流點子的方式和順序安排。如果大家同時一邊想一邊交流，會出現(xiàn)沒空思考或有人不認(rèn)真想的情況；如果大家先寫再輪流說，會出現(xiàn)思考時獨立思考，交流時只關(guān)心自己的說法而忽視交流發(fā)散的情況。所以在嘗試了默寫式頭腦風(fēng)暴（后文會詳細(xì)介紹）后，我們就沿用了這個鼓勵思考交流、弱化發(fā)言的腦暴方式。

另外要注意的一個點是，不用在流程上對想點子的思路有過多的限制，比如告訴參與者「你可以先想什么再想什么」或「你想出的點子不能太抽象或太具體」，這種「急功近利」的做法會讓參與者困惑和緊張。相反的，應(yīng)該要做的是讓他們放松，比如放一些音樂、擺一些零食等等，這樣更容易產(chǎn)生想法。

第五步：在正式腦暴前，達(dá)成共識

在腦暴前，向參與者說明本次腦暴的目的、主題、流程和規(guī)則，能夠幫助大家統(tǒng)一目標(biāo)，提率。

頭腦風(fēng)暴的四個基本規(guī)則在腦暴過程中要落到實處：

• 追求數(shù)量（可設(shè)置一個小榮譽激勵大家想點子）；
• 禁止批評（包括負(fù)面的表情或語氣詞都不能有）；
• 提倡獨特的想法（可以異想天開、天馬行空）；
• 綜合并改善設(shè)想（可以在別人的基礎(chǔ)上寫新的點子）。

組織者也可以給出一些用戶研究的發(fā)現(xiàn)，幫助大家建立概念、了解用戶。

第六步：默寫式頭腦風(fēng)暴

默寫式頭腦風(fēng)暴是在奧斯本頭腦風(fēng)暴的基礎(chǔ)上改造而成的一種書面腦暴方法（具體操作方式如下圖）。從用戶出發(fā)的創(chuàng)意腦暴在此基礎(chǔ)上，增加了用戶的典型故事作為線索。在開始前，每個參與者會拿到3張用戶典型故事卡；在第一個5分鐘，每人針對3個故事各寫至少1個點子，貼在故事卡上，然后傳給右鄰；第二個5分鐘，每人從傳來的故事卡和前人的點子上得到啟發(fā)，再各寫至少1個點子，傳給右鄰；這樣直到故事傳完，就能得到至少6 x 3 x 6=108個點子。這也是為什么前面提到要控制參與者人數(shù)的原因，因為每增加1人，就會多一輪腦暴的時間，點子的數(shù)量會相應(yīng)增加，在下一步分類交流時的工作量和時間也會直接增加。

第七步：點子現(xiàn)場收斂

在已經(jīng)有了一百多個點子的情況下，現(xiàn)場投票可以快速把「好點子」篩出來。但由于在寫點子的時候，把想法準(zhǔn)確的表達(dá)在一張便簽紙上并不是一件容易的事，所以在投票前，還是會有一個簡單的交流，讓大家了解彼此的點子，同時合并類似的點子。

投票分為感性輪和理性輪：感性輪是讓人眼前一亮的點子，每人3票；理性輪是可行或能有效提升業(yè)績的點子，也是每人3票。這樣兩個維度交叉出來就能得到既讓人眼前一亮，又具有可行性的點子。參與者多樣的背景也讓點子的評估更加全面。

第八步：點子的后續(xù)跟進

腦暴結(jié)束并不是點子的結(jié)束。最初的點子只是一句話或一個示意圖，從點子走向方案，還需要不斷地打磨交互、視覺、文案、邏輯、場景等等方面的細(xì)節(jié)；從方案到投入開發(fā)乃至上線，則需要綜合考慮優(yōu)先級、人力、技術(shù)等更多方面的問題；在上線后，點子的可用性以及對業(yè)務(wù)的效果，也需要提前規(guī)劃和進一步驗證。

總的來說，從用戶出發(fā)的創(chuàng)意腦暴，在線索和流程設(shè)計上做出了一些嘗試，讓產(chǎn)生的想法更加符合用戶真實需求，以此來提高創(chuàng)新點子的成功率。但創(chuàng)新畢竟不是一件容易的事，在未來，我們也會不斷地嘗試和打磨這個流程，思考更好的方式，讓創(chuàng)新有跡可循。

藍(lán)藍(lán)設(shè)計( www.b186.net )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)。

你不知道，香港設(shè)計有位比教父更厲害的教父。

如果您想訂閱本博客內(nèi)容，每天自動發(fā)到您的郵箱中， 請點這里

作為在即時通訊領(lǐng)域超越昔日霸主 qq，并成為第一大全民 app。微信在產(chǎn)品設(shè)計領(lǐng)域一直被奉為經(jīng)典享受著無數(shù)贊美和模仿追逐。

但是我們用戶在使用產(chǎn)品過程中，難免對微信的某些設(shè)計產(chǎn)生疑問，有的設(shè)計可以說脫離了我們對用戶體驗的認(rèn)知。

為什么會這樣呢？是否在微信這些「不友好」的設(shè)計存在其背后的深層次的邏輯呢？

以下我舉例10個點來分析這些「不友好」設(shè)計以及它背后的設(shè)計產(chǎn)品邏輯（個人思考猜想）。

1. 點贊評論為何要聚合，增加一個操作層級

朋友圈點擊操作 icon，出現(xiàn)評論和點贊兩個操作按鈕。如果要點贊評論還要點擊對應(yīng)的點贊評論按鈕，為何不直接將點贊和評論按鈕放出來呢？

從用戶操作的性來看，現(xiàn)在的朋友圈這種設(shè)計方式不夠，多增加了一個操作路徑。微信這樣設(shè)計是有什么背后的深意和思考呢？

朋友圈的定位是分享生活，重點是分享而不是互動，如果將點贊和評論的入口直接放出來的話，用戶互動頻率變高，導(dǎo)致點贊者和評論者的特意的意圖性和含金量遠(yuǎn)遠(yuǎn)不如將兩個操作收起來的高。收起來的點贊評論所收到的贊美和互動會讓分享者更真心實意，同時也減少了消息通知的無效打擾。這樣整個朋友圈互動分享生態(tài)會變得更好。

2. 朋友圈為何不單獨為一個tab，而只是tab里面的一個模塊

在大眾用戶使用最多的兩個功能，一個就是對話，一個就是朋友圈了。但是朋友圈卻作為 tab3 中一個模塊，按照用戶高低頻操作來說，朋友圈完全可以另成為一個單獨 tab 了。

微信為什么這么做呢？我覺得如果微信朋友圈作為一個 tab 的話，那么微信真的變?yōu)榱艘粋€社交工具，而不是一種生活方式了。從格局緯度上說，生活方式的格局定義遠(yuǎn)高于社交工具。同時朋友圈作為一個模塊，可以很好的將一部分流量分發(fā)到購物、游戲、掃一掃及小程序等模塊中。

3. 購物、錢包、游戲商業(yè)盈利強的產(chǎn)品為何都只是tab的一個小模塊

在互聯(lián)網(wǎng)產(chǎn)品中，幾乎所有產(chǎn)品的思路都是如何將產(chǎn)品做大，然后實現(xiàn)變現(xiàn)盈利。在中國用戶流量最大的 app 上可以有無限的變現(xiàn)玩法，向游戲、購物、支付這些都是強盈利的產(chǎn)品，而微信卻只以 tab 中的列表展示給用戶，這似乎不符合商業(yè)邏輯。

如果將購物、游戲、支付再升一級進行強化，那么微信給用戶的標(biāo)簽和定位不再是生活方式，而變成了一個單純的賣貨、游戲、支付平臺，這樣的話可能會影響微信牢不可破的用戶認(rèn)知和產(chǎn)品地位。

4. 朋友圈為何不支持gif

gif 圖通常是好玩有意思的圖，里面可以充滿各種梗，各種笑點。對于發(fā)朋友圈的人來說，發(fā) gif 圖是用戶一個較大的需求。

在考慮用戶分享者的需求時，也同時要考慮朋友圈瀏覽者的用戶，如果做了 gif 圖，那么用戶在瀏覽朋友圈的過程中，很容易被 gif 動態(tài)所吸引干擾，影響瀏覽者瀏覽整個朋友圈的視覺焦點。有的用戶為了吸引用戶注意會故意發(fā)一些嘩眾取眾動態(tài)圖，吸引微信好友重點關(guān)注，這樣會導(dǎo)致瀏覽者體驗很差。

所以說用戶需求并不是都要做的，需要綜合考慮產(chǎn)品所有角色的所有需求和體驗。

5. 通訊錄作為一個超低頻的需求，為何作為第二個tab

在微信寸土寸金的頁面上，作為第二個 tab，無疑是代表著特別重要的地位，但是呢？這個 tab 內(nèi)容都是和聯(lián)系人相關(guān)的。用戶進入這個頁面操作的頻率很小，為什么要將這么重要的位置給予通訊錄聯(lián)系人呢？

歷史原因，早期的微信版本就是一個即時通訊的 app，所以聯(lián)系人顯得比較重要，作為 tab2 是很正確的，這樣更有即時聊天軟件的認(rèn)知。

隨著微信成熟之后，其他各個業(yè)務(wù)的進入，導(dǎo)致微信平臺的臃腫，為了避免微信產(chǎn)品的認(rèn)知和意識形態(tài)的改變，畢竟微信認(rèn)知還是要保留即時工具這個屬性，所以這個 tab2 一直保留。

6. 微信號為什么不能修改

很多用戶第一次設(shè)置微信號時，隨意取了，例如前任的拼音、以前手機號、很長隨意的字母等等，現(xiàn)在都有想改的需求。但是微信號只能設(shè)置一次，不允許修改。

• 微信號如果可以隨意修改，那么和 qq 昵稱一樣了，不具有唯一性和識別性，整個后端數(shù)據(jù)存儲會變得特別混亂。
• 很多用戶會在好多地方留下微信號（二維碼）以此聯(lián)系，如果可以修改的話，那么留下的微信號（二維碼）可能會作廢，這樣很影響添加微信的成功率和體驗，導(dǎo)致以后雙方添加為了保險都不敢用微信添加好友而轉(zhuǎn)用 qq 添加好友了。

7. 我的-相冊為何不叫我的朋友圈

朋友圈鼓勵發(fā)相片，發(fā)相片比單純的發(fā)文字的動態(tài)質(zhì)量更高，所以呢，我的-相冊為何不叫我的朋友圈，如果改為了我的朋友圈，則更偏向動態(tài)發(fā)布。

8. 朋友圈為什么不支持分組查看

• 實現(xiàn)朋友圈分組，首先需要對所有微信好友分組，這就需要改變微信添加好友操作邏輯，而且維護分組成本特別高，使用起來是災(zāi)難。
• 大部分用戶查看朋友圈是打發(fā)時間的需求。所以朋友發(fā)的內(nèi)容對于他們來說，越多越好。增加分組功能，反而會降低內(nèi)容的數(shù)量，讓用戶需要很多操作才能看完所有內(nèi)容。
• 對于內(nèi)容過濾的需求，已經(jīng)提供屏蔽某人功能。
• 從內(nèi)容分發(fā)上來說，增加按組來查看內(nèi)容，很容易忽略掉其他分組的朋友產(chǎn)生的高質(zhì)量內(nèi)容。
• 朋友圈分組，會導(dǎo)致很多的好友動態(tài)無法被瀏覽到，影響朋友圈的數(shù)據(jù)，也影響朋友圈的互動性。

9. 為什么群發(fā)僅限200人

很多人有群發(fā)需求，希望可以將所有的好友群發(fā)消息，但是微信只支持200人群發(fā)。

這里也涉及到兩種角色：群發(fā)者和接收者。

現(xiàn)在群發(fā)的使用場景：二維碼宣傳、點贊請求、過年群發(fā)，微商定目標(biāo)人群發(fā)廣告消息等等，這些對于接收者而言都是騷擾信息。

如果支持不限量群發(fā)，那么接收者的垃圾信息會變多，會被過度干擾。

10. 對話列表為何不能批量刪除

• 如果可以批量刪除，則微信對話的整體活躍會降低，批量的話聊天列表都刪了，后續(xù)和被刪者主動對話概率下降。
• 刪除為謹(jǐn)慎操作，刪除后聊天記錄不在。

總結(jié)

微信的設(shè)計邏輯大體上都分為兩個方面：

• 所有角色整體考慮，在考慮角色 a 的使用需求，同時還要角色 a 的使用需求給角色 b、c 亦或平臺所帶來的影響（這點很重要，也是我們在做設(shè)計的時候很容易忽略的）。
• 整個產(chǎn)品的定位以及平臺生態(tài)考慮，考慮需求或設(shè)計時先全局再局部。

  藍(lán)藍(lán)設(shè)計( www.b186.net )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)。

   

安卓手機發(fā)展到現(xiàn)在，除了硬件方面受到大家關(guān)注之外，很多消費者在選擇手機的時候，都會注重這款手機搭載的系統(tǒng)，也就是手機UI。就目前的情況來看，很多廠商的產(chǎn)品都有自己的特定UI，這些UI都是基于安卓系統(tǒng)深度打造的產(chǎn)品。

荔枝微課app體驗報告：與AI結(jié)合，將有更大發(fā)展空間

人人都是產(chǎn)品經(jīng)理 2018-07-21 13:14:44

如果您想訂閱本博客內(nèi)容，每天自動發(fā)到您的郵箱中， 請點這里

荔枝微課是目前市面上知識付費領(lǐng)域非常優(yōu)秀有競爭力的產(chǎn)品，本文對荔枝微課的產(chǎn)品設(shè)計進行了分析與思考。

一、產(chǎn)品概述

1. 體驗環(huán)境

• 體驗版本：4.3.0
• 體驗設(shè)備：華為mate10（128G版）
• 安卓版本：8.0.0
• 體驗時間：2018年7月

2. 產(chǎn)品簡介與定位

荔枝微課的應(yīng)用介紹：

“荔枝微課是連接人與知識的內(nèi)容分享平臺，支持隨時隨地授課聽課。與大咖、草根，一同共赴知識盛宴?！?

可以發(fā)現(xiàn)，荔枝微課主要著力于打造一個全民學(xué)習(xí)知識&全民分享知識的大眾知識分享平臺，其核心內(nèi)容則是平臺沉淀下來的知識內(nèi)容，其運營的關(guān)鍵是源源不斷的能吸引用戶購買的知識輸出。

其核心價值主要有2點：

對于知識學(xué)習(xí)者來說，荔枝微課可以為用戶提供一個內(nèi)容豐富的，可以隨時隨地進行學(xué)習(xí)的知識平臺，滿足用戶能夠方便快捷獲取知識的需求。

對于知識分享者來說，荔枝微課可以為用戶提供一個知識變現(xiàn)并實現(xiàn)自我價值的平臺，以及平臺為知識分享著提供的推廣及流量支持。滿足用戶通過分享知識而實現(xiàn)個人價值并獲得現(xiàn)實收益的需求。

3. 用戶需求分析

3.1 用戶畫像

在進行需求分析之前，我們先來了解一下荔枝微課的用戶群體，進行簡單的用戶畫像，以便我們更加準(zhǔn)確地進行需求分析。（PS：用戶畫像主要基于二手?jǐn)?shù)據(jù)資料、競品分析和個人體驗產(chǎn)品后的逆向推理得出，由于個人水平以及時間問題，如有偏差望見諒。）

3.1.1 平臺角色

經(jīng)分析可發(fā)現(xiàn)，平臺中主要存在兩大角色：知識分享者（知識分享者又可以細(xì)分為機構(gòu)和個人，在本文中不做區(qū)分）和知識學(xué)習(xí)者（也可以稱作知識消費者）。

從產(chǎn)品的運營模式來看，很多用戶既是知識消費者，又是知識分享者，用戶在平臺上學(xué)習(xí)自己欠缺的知識，分享自己的一技之長，形成了一個良性循環(huán)。

在體驗中我發(fā)現(xiàn)，知識分享者的知識分享流程主要是通過PC端的“講師管理后臺”完成的，因此在針對app的體驗中我主要針對知識學(xué)習(xí)者用戶進行分析。

3.1.2 核心用戶的基本信息

通過荔枝微課本身以及對比幾款競品的相關(guān)數(shù)據(jù)，我們可以大致推斷其核心用戶的基本信息：

年齡：通過百度指數(shù)以及對核心用戶的核心行為-學(xué)習(xí)各種實用技能知識，進行分析，我們可以看到，主要集中在30-39歲（占比60%左右），同時20-29歲， 40-49歲兩個階段也有不少分布（占比約為20%左右）。

性別：我們可以看到百度指數(shù)中顯示，其用戶性別比例男：女約為6：4。但是我們知道百度指數(shù)對于性別判定算法，有時候會產(chǎn)生誤差。在荔枝微課這里就發(fā)生了這樣的情況。

對于荔枝微課的性別比例，我們通過對產(chǎn)品進行分析，可以發(fā)現(xiàn)這個性別比例并不準(zhǔn)確。

有一下2點理由：

• 第一，在荔枝微課的“發(fā)現(xiàn)”頁中存在很多的課程分類，我們可以看到其中大部分內(nèi)容是針對女性用戶的：比如母嬰、形象、美妝個護、時尚、婚姻等等分類。而且作為優(yōu)先級最高的第一屏的分類項目是推薦、婚姻、家庭關(guān)系、戀愛、母嬰、育兒，這幾個比較偏女性用戶的分類。
• 第二，在產(chǎn)品所有的課程內(nèi)容中我們可以看到大量的課程都是針對女性用戶的，比如瑜伽課、提升女生的氣質(zhì)等等相關(guān)課程。

因此我們大致可以進行推理，荔枝微課的用戶應(yīng)當(dāng)女性偏多，女：男 約為 6：4 到 7：3 之間。

區(qū)域：可以看到荔枝微課的用戶主要集中在一線以及新一線城市。

收入：對于用戶的收入水平我們可以從2個方面進行推測， 一是我們上文得出荔枝微課的核心用戶主要分布在一線及新一線城市；二是，我們可以看到在荔枝微課中絕大部分課程的價格都在100元以下。我們可以進行推測，荔枝微課的核心用戶應(yīng)該處于中等收入水平。

用戶性格：綜合以上所有的分析，大致可以推斷出用戶的性格有以下幾個特征：自我提升欲望強烈、存在一定的焦慮感、對自己某方面現(xiàn)狀不是很滿意。

二、產(chǎn)品分析

1. 產(chǎn)品結(jié)構(gòu)圖

荔枝微課有發(fā)現(xiàn)、精選、我的微課、個人中心4個以及導(dǎo)航模塊。

• “發(fā)現(xiàn)”是分類別展現(xiàn)課程信息，主要是滿足用戶分門別類查找自己感興趣的知識的需求；
• “精選”則是平臺為用戶精心挑選的課程列表；
• “我的課程”是用戶學(xué)習(xí)課程的記錄，方便用戶方便快捷的進行學(xué)習(xí)；
• “個人中心”則是用戶進行個人設(shè)置以及記錄個人信息與操作的模塊。

其產(chǎn)品結(jié)構(gòu)圖如下：

2. 用戶使用流程圖

通過分析發(fā)現(xiàn)，產(chǎn)品中存在2個核心流程，一是用戶購買課程流程（購買直播課程流程和購買非直播流程略有不同）；二是用戶學(xué)習(xí)課程流程（學(xué)習(xí)直播課程流程和學(xué)習(xí)非直播流程有不同），其流程圖如下：

2.1 購買課程流程

購買直播課程流程和購買非直播流程略有不同，購買直播課程流程不需要判斷課程是否收費，免費課程仍然進入支付流程，并支付0元。

從分析體驗來看，從開始到結(jié)束，整個購買課程流程非常清晰且順暢，中間不存在多余流程，也沒有其他任務(wù)導(dǎo)致流程中斷，用戶體驗很好。

2.2 學(xué)習(xí)課程流程

相對購買流程來說，學(xué)習(xí)課程流程就沒有那么清晰順暢了，我們可以看到直播課程學(xué)習(xí)流程比較清晰。但是非直播課程學(xué)習(xí)課程卻看起來比較復(fù)雜，個人覺得該流程中存在一些多余流程。

（1）首次進入課程存在多余流程

我們從流程圖中可以看到首次進入時，產(chǎn)品會讓用戶選擇是從第一條開始聽還是直接進入課程。選擇從第一條開始聽，用戶將會進入課程學(xué)習(xí)頁面，并從第一條語音開始播放。而選擇直接進入課程，則進入課程學(xué)習(xí)頁面，但課程不會進行播放。

我們可以看到2個不同選擇只是有課程是否自動播放的區(qū)別，這個區(qū)別對用戶來說不是必要，但是卻多了一個頁面，讓用戶多進行了一步操作。這并不利于用戶完成整個課程學(xué)習(xí)流程。

而且，在體驗過程中，我發(fā)現(xiàn)在這個選擇頁面中用戶是無法后退的，也無法關(guān)閉選擇彈框，只能在“從第一題哦啊開始聽”和“直接進入課堂”中進行二選一，這可能是為了提升課程播放頁面的打開率，但是這樣的設(shè)置對用戶體驗不是十分友好。

（2）非首次進入流程存在多余流程

對于非首次進入流程，我們來想象一個用戶場景：

在上班的路上，有一個用戶對荔枝微課上的一門化妝課程非常感興趣，她打開課程進行學(xué)習(xí)，半個小時后她到公司了，她關(guān)閉課程開始上班。等到下午下班之后，她想起來自己早上還有一門課程沒有學(xué)完，想要接著學(xué)習(xí)，這之后她很希望荔枝微課幫她記住了自己上午學(xué)習(xí)到哪里了。

我們可以看到，對于用戶來說，被打斷的課程直接進行續(xù)播，才是符合用戶預(yù)期的。所以個人覺得在用戶再次打開自己學(xué)習(xí)過的課程時，給用戶“繼續(xù)未聽完的課”和“直接進入課堂”的選擇是比較多余的，用戶其實不需要這樣的選擇。這種不記住自己的學(xué)習(xí)進度的選擇，反而是用戶想要避免的。

3. 導(dǎo)航結(jié)構(gòu)分析

荔枝微課有發(fā)現(xiàn)、精選、我的微課、個人中心4個一級導(dǎo)航模塊。

• “發(fā)現(xiàn)”主要是分類別展現(xiàn)課程信息，主要是滿足用戶分門別類查找自己甘心去的知識的需求；
• “精選”則是平臺為用戶精心挑選的課程列表；
• “我的課程”則是用戶學(xué)習(xí)課程的記錄，方便用戶方便快捷的進行學(xué)習(xí)；
• “個人中心”則是用戶進行個人設(shè)置以及記錄個人信息與操作的模塊。

接下里我們來分析一下荔枝微課的這個導(dǎo)航結(jié)構(gòu)：

首先是“發(fā)現(xiàn)”頁，發(fā)現(xiàn)頁匯總了各種課程信息，并通過頭部導(dǎo)航分類別進行展示，形成了典型的首頁風(fēng)格。從結(jié)構(gòu)設(shè)置上來看并沒有什么問題，但是個人在體驗中發(fā)現(xiàn)其在內(nèi)容展示上還是存在一定的優(yōu)化空間。

3.1 三個功能按鈕內(nèi)容不隨頂部導(dǎo)航切換

如截圖所示，在每個分類導(dǎo)航的輪播圖下方，都有“我的課程”、“精選專題”、“免費專區(qū)”三個按鈕。點擊按鈕我們可以發(fā)現(xiàn)都是相關(guān)的課程列表，顯然，這是產(chǎn)品為了吸引用戶點擊而專門設(shè)置的。

但是比較令人不解的是，這幾個按鈕的內(nèi)容并不隨著用戶選擇分類的切換而切換。無論是用戶選擇婚姻分類還是理財分類，精選專題為用戶展現(xiàn)的列表都有可能是一些中醫(yī)課程或者是英語學(xué)習(xí)，不會隨著用戶選擇的不同而量身推薦內(nèi)容。

另外，這種設(shè)置不但沒有根據(jù)用戶的興趣進行針對性的推薦，而且，會對用戶造成一定程度的誤導(dǎo)，從用戶的角度來說，導(dǎo)航切換了該導(dǎo)航下的內(nèi)容進行相應(yīng)的切換是一個順理成章的邏輯，但這三個模塊內(nèi)容卻不進行切換，這并不符合用戶的操作認(rèn)知。

3.2 如果能更智能的進行個性化課程推薦可能會更好

我們從結(jié)構(gòu)圖中可以看到，發(fā)現(xiàn)頁中共有26個分類導(dǎo)航，涵蓋各種年齡階段，不同性別不同層次的用戶群體可能感興趣的所有課程，可以說是課程內(nèi)容非常豐富了。但是，如果用戶對排名比較靠后的某一個類別感興趣的話，那么他想要找到這個類別就會相對比較困難，而且在進行左滑的時候很容易錯過中間某個分類。

同時，在體驗的過程中，我用了男女兩個性別不同的帳號進行體驗，發(fā)現(xiàn)所展示的內(nèi)容完全一致，連導(dǎo)航的排序也一致，這說明產(chǎn)品沒有針對細(xì)分用戶做一些相對個性化的區(qū)分。

我們知道，對于非基礎(chǔ)知識的獲取需求，不同的用戶群體的需求可能差異很大，所以如果產(chǎn)品能夠應(yīng)用人工智能或者是大數(shù)據(jù)等技術(shù)對用戶進行相對個性化的信息展示，那么在轉(zhuǎn)換率以及用戶體驗方面都應(yīng)該都會有所提升。

然后是“精選”頁，個人覺得精選頁存在2個問題：

第一，是與首頁一樣沒有針對細(xì)分用戶進行個性化的區(qū)分，我用了男女兩個性別不同的帳號進行體驗，所展示的內(nèi)容完全一致。當(dāng)然，精選課程列表可能選取的是一些相對比較熱門的課程（熱門也是一種吸引力的保障），或者是一些產(chǎn)品出于商業(yè)盈利或者其他考慮而特意選出的部分課程，所以倒是不一定非要有用戶針對性。

第二，個人覺得其實精選課程并不需要作為一個一級導(dǎo)航頁存在，其實精選課程的內(nèi)容，完全可以由發(fā)現(xiàn)頁中的“推薦”分類進行承載，只要在推薦類的課程列表中進行一些模塊劃分便能實現(xiàn)，并不需要顯示一個專門的一級導(dǎo)航頁。

接下來是“我的微課”頁，分為全部課程、最近學(xué)習(xí)、即將開始三個模塊。這里記錄了用戶購買和學(xué)習(xí)過的課程記錄，滿足用戶方便快捷進行回溯或繼續(xù)學(xué)習(xí)的需求，是一個非常好的頁面。

但是，也存在一點點小問題，那就是被添加進來的課程不能進行管理，如果用戶無意間點開一個自己不感興趣的課程，后面想要刪除，無法實現(xiàn)。在用戶打開過的課程越來越多時，可能會造成不好的用戶體驗。

“個人中心”頁，個人中心頁是一個典型的個人中心頁面，這里就不進行進一步分析了。

4. 核心頁面分析

接下來我們對產(chǎn)品的幾個核心頁面進行一下分析。

4.1 課程詳情頁

首先是“課程詳情”頁，我們先想象一個場景：

一個用戶在推薦頁看到了一個瑜伽課程感覺挺有興趣，于是她點開了這個課程，想進一步看看課程更詳細(xì)的信息，好決定自己是不是要購買這個課程。課程詳情頁信息影響著用戶是否購買的決策，是一個非常重要的頁面。

我們來看看課程詳情頁的構(gòu)成。

• 功能：購買專欄按鈕、課程試聽、分享課程、關(guān)注課程分享者帳號。
• 信息：封面圖、專欄標(biāo)題、價格、課程更新進度、在學(xué)人數(shù)、課程詳情、課程目錄、人氣榜、課程分享者帳號信息。
• 需求：用戶想進一步獲取更詳細(xì)的課程信息，好決定自己是不是要購買課程。
• 思考：從信息內(nèi)容來看，荔枝微課的課程詳情頁做得非常好，尤其是頁面主體“詳情”內(nèi)容總能把課程非常具有吸引力的內(nèi)容提煉出來，可以說從內(nèi)容運營方面來說領(lǐng)先于市面上很多產(chǎn)品。

不過從功能的角度來看，荔枝微課還是可以進行小小的優(yōu)化，首先便是缺少直接的咨詢按鈕，我們知道用戶在進行購買決策時，如果能為用戶提供一個咨詢客服的入口，會一定程度提高轉(zhuǎn)換率。

當(dāng)然，因為平臺上存在大量的個人講師，因此，如果增加咨詢按鈕的話，這大量的客服工作可能需要平臺來承擔(dān)，這樣會大量增加平臺的成本。所以，目前荔枝微課的課程沒有直接的咨詢?nèi)肟?，也有可能是出于對成本的考慮。

然后，就是已消費用戶的評論也是影響用戶購買決策的重要因素，如果能在課程詳情頁中增加用戶的評論，可能會錦上添花，對用戶的決策產(chǎn)生正向影響。

而且，這種評價體系也將為優(yōu)質(zhì)的課程做更好的背書，再輔以一些相應(yīng)的算法對課程進行排序，這可以促進講師們提升自己的課程質(zhì)量，長久下來將有助于平臺整個課程質(zhì)量的提升。

4.2 課程播放頁

視頻播放頁也是產(chǎn)品非常重要的頁面之一。我們可以看到左圖是荔枝微課的課程播放頁，右圖是進入課程學(xué)習(xí)的上一步，選擇是“繼續(xù)未聽完的課”還是“直接進入課堂”，如果用戶是第一次進入課程則是，選擇“從第一條開始聽”還是“直接進入課堂”。

在上文中我們已經(jīng)提到過這個選擇頁面對于整個學(xué)習(xí)課程流程的完成有一定的多余，不過從其課程播放界面我們看到課程并不是一個完整的視頻或音頻而是一個模擬直播現(xiàn)場的分條課程頁面時，我們大概能理解為什么會有這樣的選擇了。

我們知道講師進行課程直播，然后將這些直播的內(nèi)容進行沉淀，供用戶反復(fù)學(xué)習(xí)，這是荔枝微課的一大核心特色。荔枝微課設(shè)置如上的課程學(xué)習(xí)頁面，可能是為了更好的還原直播課程現(xiàn)場，包括直播的氣氛、講師與學(xué)生之間的互動交流碰撞出的火花等等。

不過，我們來想象一個場景，當(dāng)不在那個直播氛圍中，用戶對于一條一條的去刷整個課程討論的需求有多高呢？更何況很多講師在直播的時候可能還不允許用戶進行討論，全程只是講師在進行講課。那用戶更希望將這個內(nèi)容一條條拆開還是將講課內(nèi)容整合起來聽呢？我想答案應(yīng)該很明顯吧。

我們可以看到，其實在產(chǎn)品中還有一個不一樣的播放頁面，如下圖所示，我們可以看到這就是直接將課程進行了整合，而且用戶如果想要觀看上課模式，可以直接進行切換，個人覺得其實所有的播放頁面都可以直接采用這種模式。

這樣不但能給用戶自主選擇的余地，而且我們在課程播放被打斷之后，再次進入課程播放頁的時候，也不用再選擇是“繼續(xù)未聽完的課”還是“直接進入課堂”，而是可以直接斷點續(xù)播。

當(dāng)然，荔枝微課這樣的頁面設(shè)置可能背后有由于我個人產(chǎn)品能力不足，或者是我對荔枝微課了解不夠深刻所導(dǎo)致的認(rèn)知誤差，如果是這樣，還請海涵。

三、總結(jié)

由于時間問題，這篇體驗報告寫得并不是很深入，有的觀點也不一定準(zhǔn)確，如果有一些不當(dāng)之處，再次致歉。然后對于文中提到的一些問題，主要是秉持著希望荔枝微課發(fā)展越來越好的初衷進行體驗的，還希望各位不要覺得這是一篇找茬文才好。

總結(jié)來說，荔枝微課是目前市面上知識付費領(lǐng)域非常優(yōu)秀有競爭力的產(chǎn)品，不過現(xiàn)在產(chǎn)品針對用戶進行個性化的定制變得越來越重要，尤其是這種知識付費產(chǎn)品，如何讓用戶迅速找到自己愿意付費的課程成為了產(chǎn)品的重要競爭點之一。

個人覺得如果荔枝微課能夠在抓住在線教育風(fēng)口的同時，再輔助以一定的人工智能、大數(shù)據(jù)等新技術(shù)進行提升，應(yīng)該會帶來更大的發(fā)展空間。

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

藍(lán)藍(lán)設(shè)計( www.b186.net )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)

企業(yè)設(shè)計的未來是什么？是消費級用戶體驗

人人都是產(chǎn)品經(jīng)理 2018-07-21 15:13:33

如果您想訂閱本博客內(nèi)容，每天自動發(fā)到您的郵箱中， 請點這里

企業(yè)產(chǎn)品要想取得最大的成功，就應(yīng)該為用戶提供符合消費產(chǎn)品標(biāo)準(zhǔn)的體驗。

在John Maeda最近的一篇文章“為企業(yè)設(shè)計與為消費者設(shè)計之間的區(qū)別”中，他解釋了為什么為企業(yè)設(shè)計與為消費者設(shè)計應(yīng)用程序相比是不同的，也許更具挑戰(zhàn)性。

然而，作為一個為企業(yè)、小企業(yè)和消費者產(chǎn)品設(shè)計應(yīng)用程序的人，我逐漸相信，在過去幾年中，為消費者和企業(yè)應(yīng)用程序設(shè)計的區(qū)別已經(jīng)迅速縮小。

對于一個企業(yè)產(chǎn)品來說，要獲得最大的用戶接受度和長期的成功，我們應(yīng)該為最終用戶提供一種體驗，這種體驗必須滿足消費品中同樣的可用性、性能和品牌標(biāo)準(zhǔn)。

用戶已成為決策者

對于傳統(tǒng)的企業(yè)產(chǎn)品，過去的模式是將產(chǎn)品賣給公司的高管，然后員工使用他們提供的工具。如果應(yīng)用程序難于使用，員工會盡可能少地使用它，而是使用耗時的、通常是手工的變通方法，以避免在工具上花費時間。

如今，團隊和員工經(jīng)常選擇自己的產(chǎn)品，這意味著贏得勝利的是最好的產(chǎn)品和設(shè)計，而不是最好的銷售和營銷。Slack、Sketch、Dropbox、Sunrise、谷歌Drive和Asana都是這一趨勢的例子。

因為在不同平臺之間切換的成本比以前要低得多，所以在工作中選擇自己的工具要容易得多。我看到員工們選擇為他們工作的日歷工具、通信工具、文檔存儲系統(tǒng)，甚至設(shè)計工具，比如：草圖。越來越多的大型團隊工具決策，是自下而上的。用戶正在選擇他們喜歡的軟件，而不是強加給他們的軟件。

這意味著，企業(yè)產(chǎn)品的構(gòu)建需要越來越少地考慮，如何在企業(yè)產(chǎn)品設(shè)計中應(yīng)用消費者思維，而越來越多地考慮如何在企業(yè)產(chǎn)品設(shè)計中應(yīng)用消費者思維。

不要依賴銷售團隊來實現(xiàn)用戶的增長。

作為一名設(shè)計師，你的目標(biāo)是開發(fā)一款非常棒的應(yīng)用程序，讓你的用戶想要在屋頂上大聲談?wù)撍?，并與所有的隊友分享。

在這種情況下，接受是隨機的，用戶最終會對您的產(chǎn)品更忠誠，而不是他們被迫使用的東西。

性能很重要

盡管許多企業(yè)應(yīng)用程序都是基于云計算的（例如：Salesforce、Quickbooks、Marketo、Infor等），但消費者對速度的預(yù)期與桌面應(yīng)用程序的預(yù)期并無不同。

如果基于云的應(yīng)用程序需要花費時間來加載，用戶就會離開。Gmail和其他在線應(yīng)用程序，已經(jīng)為響應(yīng)性和性能設(shè)置了標(biāo)準(zhǔn)。

創(chuàng)造第一次使用體驗，讓用戶自己成功

正如我與協(xié)作設(shè)計應(yīng)用UXPin共同編寫的《企業(yè)用戶體驗的未來免費指南》（free guide the Future of Enterprise UX）中所解釋的，設(shè)計師還應(yīng)該努力創(chuàng)建一種無需外部培訓(xùn)的應(yīng)用程序登錄體驗。

這仍然是我看到企業(yè)產(chǎn)品設(shè)計公司猶豫不決的地方，人們會說：

“好吧，人們理解這個工具需要一點培訓(xùn)，因為它比消費者應(yīng)用程序復(fù)雜一點?！?

為人們在工作中使用的產(chǎn)品不應(yīng)該成為糟糕設(shè)計的借口，如果你遵循常見的UI結(jié)構(gòu)——定位用戶，給他們一個具體的用戶好處，讓他們覺得他們已經(jīng)獲得了寶貴的時間——他們將繼續(xù)學(xué)習(xí)使用你的產(chǎn)品，就像他們學(xué)習(xí)視頻游戲、移動應(yīng)用程序和其他東西一樣。

例如：在為Intuit的旗艦產(chǎn)品QuickBooks設(shè)計登錄體驗時，我們詢問了關(guān)于業(yè)務(wù)的關(guān)鍵信息，然后根據(jù)所提供的信息定制體驗，為用戶做一些初始的設(shè)置工作。這有助于產(chǎn)品感覺它是為最終用戶和他們的業(yè)務(wù)設(shè)計的。

我們創(chuàng)建了一個屏幕，顯示了同一行業(yè)和位置上Quickbooks用戶的數(shù)量。在傳統(tǒng)的登錄體驗中，不需要這樣做，但是這種流程的轉(zhuǎn)換要比步驟更少的登錄體驗高。屏幕告訴人們：“我們將為您設(shè)置產(chǎn)品，從而為您節(jié)省時間”，這也強化了他們正在選擇行業(yè)領(lǐng)導(dǎo)者。

第一次使用體驗的新工具條不僅適用于嘗試使用它的人。它必須足夠好，讓他們在與團隊其他成員和他們的公司一起倡導(dǎo)產(chǎn)品時感到舒適。

讓您的產(chǎn)品可由用戶和團隊定制

企業(yè)客戶不應(yīng)該接受這樣的概念：他們需要實現(xiàn)專家來為客戶定制產(chǎn)品，客戶應(yīng)該能夠自己做到這一點。

如果您設(shè)計了一個企業(yè)應(yīng)用程序，它可以由使用它的團隊定制，那么您就給了他們一種對產(chǎn)品的投資和所有權(quán)的感覺。你賦予他們力量，給用戶信心。用戶把產(chǎn)品做對，從而變得更加忠誠。

此外，作為企業(yè)供應(yīng)商，如果您將時間/資源用于客戶的定制實現(xiàn)，您將沒有足夠的資源用于應(yīng)用客戶反饋和創(chuàng)新。

企業(yè)設(shè)計的風(fēng)險和機遇

盡管企業(yè)用戶體驗和消費者用戶體驗之間的差距正在縮小，但在設(shè)計業(yè)務(wù)應(yīng)用程序時，仍需要考慮一些持久的差異。

創(chuàng)新的風(fēng)險更大

使用企業(yè)工具，您正在處理非常有價值的數(shù)據(jù)，因此如果您將數(shù)據(jù)隱藏在有趣的和不尋常的交互中，可能會讓用戶感到沮喪。作為一名設(shè)計師，您希望遵循已經(jīng)存在的用戶界面標(biāo)準(zhǔn)，將您的創(chuàng)新重點放在產(chǎn)品中比現(xiàn)有產(chǎn)品更好的部分。

作為一個谷歌文檔編輯器的用戶，我不需要知道如何使用文檔編輯器，因為它大量地借用了我使用Microsoft Word所知道的東西。谷歌在執(zhí)行過程中所強調(diào)的是，將創(chuàng)新集中在差異化上：將其與MS Word區(qū)別開來的協(xié)作工具。

我唯一需要學(xué)習(xí)的就是——如何邀請別人和我一起編輯？

一旦我有了這個概念，我就可以用成千上萬個有趣的方法來使用這個應(yīng)用程序，并且在我使用擴展我的應(yīng)用到其他相關(guān)產(chǎn)品（比如：演示）的過程中，建立我所學(xué)到的東西。（我將第一個承認(rèn)，在選擇使用現(xiàn)有范例的地方，設(shè)計師很難做到自律，而且仍然非常專注于在哪里重新設(shè)計）

你很少有能力“吃狗食”你的工作

如果你是為Facebook或Pinterest這樣的消費者工具設(shè)計的，你自己可能就是用戶。對于企業(yè)或業(yè)務(wù)應(yīng)用程序，情況往往不是這樣。

這意味著你必須既是一名優(yōu)秀的研究者，也是一名設(shè)計師。

當(dāng)我在Intuit公司時，知道如何設(shè)計一個好的web應(yīng)用程序，是不夠的，我還必須了解會計結(jié)構(gòu)，以及小型企業(yè)/會計師的需求。我從來沒有開過小公司，所以我必須花更多的時間與使用該產(chǎn)品的人交流，學(xué)習(xí)和理解他們的目標(biāo)和動機，比我在其他公司花的時間要多。

我邀請了其他人（比我知道得更多）和我一起設(shè)計。值得慶幸的是，在Asana，我們使用我們的應(yīng)用來完成我們所有的工作，所以我們可以體驗我們的用戶體驗。

結(jié)論

我很高興看到設(shè)計師和設(shè)計領(lǐng)袖對創(chuàng)建企業(yè)工具更感興趣，我認(rèn)為這是因為消費者和企業(yè)之間的差距正在縮小。

有了消費者應(yīng)用程序，你就可以設(shè)計出一種影響到數(shù)十億用戶的工具，并將娛樂帶給世界。但隨著時間的推移，設(shè)計師會感到矛盾。許多消費者應(yīng)用程序通過廣告賺錢，因此用戶目標(biāo)和公司目標(biāo)并不同步。用戶在想：

“我想看這個視頻，公司在想，‘我們怎么能讓用戶在看這個視頻之前看更多的廣告呢？’”

為企業(yè)和其他付費應(yīng)用程序設(shè)計的好處是：終端用戶的目標(biāo)和您的企業(yè)的目標(biāo)是一致的，你的公司只有在用戶成功使用該應(yīng)用時才會受益。通過企業(yè)工具，你正在構(gòu)建產(chǎn)品，幫助組織及其員工實現(xiàn)他們的目標(biāo)，幫助所有企業(yè)更好地完成他們的工作。

原文作者：Amanda Linden

本文由 @ ANG 翻譯發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載

題圖來自 Pixabay，基于 CC0 協(xié)議

藍(lán)藍(lán)設(shè)計( www.b186.net )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)

真正驅(qū)動UI設(shè)計的，是用戶思維模式

人人都是產(chǎn)品經(jīng)理 2018-07-22 09:13:44

如果您想訂閱本博客內(nèi)容，每天自動發(fā)到您的郵箱中， 請點這里

設(shè)計UI時，比布局配色動效更重要的是用戶思維模式。

作為設(shè)計師，尤其是需要設(shè)計面向大眾的 APP 和網(wǎng)頁等數(shù)字產(chǎn)品的設(shè)計師而言，我們必須創(chuàng)造出用戶能夠自然理解的東西，以人們能夠清晰理解、不言自明的 UI界面和用戶體驗，來作為設(shè)計的最終目標(biāo)。即使是再新鮮的產(chǎn)品，在設(shè)計的時候，也需要拿出用戶能夠感知得到的「熟悉」的模式，確保用戶在使用過程中不會感到割裂，不會覺得混亂和迷茫。

在這種語境之下，許多設(shè)計師會擔(dān)心一個很實際的問題：我設(shè)計的東西會不會不夠新穎，會不會缺少突破？

不過，此時這樣來提問興許并沒有問對問題。因為真正驅(qū)動 UI設(shè)計的，應(yīng)該是我們常說的套路或者說是規(guī)則，更深層的東西，其實是用戶的思維模式和心智模型。

舉個例子。

你可能需要為大學(xué)的老師設(shè)計一個管理教學(xué)的儀表盤界面，這個儀表盤界面中需要呈現(xiàn)一些基本的功能，比如可以讓教師為學(xué)生上傳課程，課程資料，安排考試，發(fā)布考試成績。他們可以通過整個儀表盤和學(xué)生進行互動，可以發(fā)布作業(yè)也可以收取作業(yè)，檢查作業(yè)。在這個需求設(shè)定之下，接下來，我們可能需要從教師的角度來考慮整個儀表盤的 UI 和 UX設(shè)計。

在這個案例當(dāng)中，我們需要思考一些問題。當(dāng)教師在為學(xué)生上課的時候，他們對于課程，對于每個學(xué)習(xí)單元，甚至于是階段性的測試的安排，都有著清晰的認(rèn)知。他們的大腦當(dāng)中，對于每一本教材，以及需要教授的知識點，在自己的大腦當(dāng)中都有著明確的記憶，可以列舉成列表，能夠進行管理，傳授給學(xué)生。這樣一來，一切似乎都非常清晰了，設(shè)計師如果做的功課夠多的話，能夠快速地打磨出一個大學(xué)教師們喜歡的、易用的儀表盤界面。

但是，這樣一來，設(shè)計師會忽略這個事情的另外一個層面，那就是學(xué)生。

老師是整個這個課程管理系統(tǒng)的儀表盤的掌控者，而學(xué)生同樣通過它來學(xué)習(xí)課程。當(dāng)學(xué)生面對一個課程的時候，他們并不會如同他們的老師一樣，對于整個課程有清晰的認(rèn)知，沒有一個完整的概念。他們不具備老師的思維模式，或者說是擁有一種截然不同的心智模型。他們在面對課程的時候，可能更多的是零散的問題：

• 我們昨天學(xué)到了什么？
• 我錯過的那堂課，教授了什么內(nèi)容？
• 明天那堂課，我需要準(zhǔn)備什么？
• 今天學(xué)的這堂課當(dāng)中，最重要的知識點是什么？

學(xué)生在面對課程的時候，思維模式主要是沿著「課程-時間」這種模式來進行，而老師則不同，他們隨時可以授課，主要的思維模式是「課程-內(nèi)容」這樣的架構(gòu)。

這樣一來，再重新思考一下整個產(chǎn)品的設(shè)計吧。在用戶的思維模式驅(qū)動下設(shè)計 UI，怎么做都不會出大紕漏，但是如果遵循普通的 UI 模式，腦中想的是用什么控件，放什么地方，那就很難說了。

現(xiàn)在再來看，你會發(fā)現(xiàn) UI 本身并不是驅(qū)動者，而是某種意義上的用戶思維模式下的副產(chǎn)物。因此，解決方案當(dāng)中，應(yīng)該反映出教師和學(xué)生兩者的思維模式。當(dāng)你在設(shè)計這個 UI 的時候，你可以從競爭對手那里學(xué)習(xí)，甚至可以從毫不相關(guān)的其他產(chǎn)品當(dāng)中汲取好設(shè)計，當(dāng)然，前提是這種設(shè)計需要遵循用戶的思維模式。

如果輪子能夠發(fā)揮作用，為什么要重新發(fā)明呢？復(fù)制之后微調(diào)到適合你需求的樣子就行了。

這當(dāng)然并不是意味著我們會因此受限，或者說在創(chuàng)作過程中失去創(chuàng)意。探索用戶的思維模式，本身是讓你更加深刻地洞悉設(shè)計需求本質(zhì)的一種方式，它甚至?xí)屇愕膭?chuàng)造力更強，打破某些常規(guī)的邊界，幫你更好地解決用戶的問題。

此刻，你并不是在設(shè)計 UI界面，而是在用文本、圖形和思維模式敲開你用戶的大腦。

現(xiàn)在應(yīng)該明白用戶思維模式的重要性了吧。為什么要做用戶調(diào)研，為什么要構(gòu)建心智模型，為什么要做側(cè)寫，原因其實不復(fù)雜，真正的理解，還是來源于對用戶行為模式的洞悉。為某個人進行設(shè)計，就像你給某個密友挑選禮物一樣，你清楚他的喜好，明白他要什么，就能用一個小禮物讓他的情緒最大化地釋放。當(dāng)你了解一個人的個性，知道他的愿望，那么為他定制產(chǎn)品的時候，針對性會更強，設(shè)計自然也會有四兩撥千斤的效果。

那么，你要怎樣更好的了解用戶呢？

就像你和別人交朋友一樣，一起去酒吧喝酒，一起吃火鍋，在咖啡館里面看著來往的行人，聊聊自己最近的生活，吐槽一下生活中不爽的事情，探討一下感興趣的話題。其實就這么簡單，也沒有什么很神奇的秘訣。

而真正的「了解」，也就是通過這種方式，開始真正明白甚至「感同身受」地洞徹用戶生活的模式，細(xì)節(jié)和深層的需求。舉個例子，要為某個經(jīng)營餐館的朋友制作一款軟件，那么需要了解餐飲業(yè)相關(guān)的信息，了解你的朋友在管理和運營餐館的時候，具體的流程和痛點。他們每個流程叫什么名字？他們是如何訂購的食材？具體的步驟是什么？員工是怎么管理的？他們要跟蹤哪方面的信息？回答這些問題，明白各個環(huán)節(jié)之間的關(guān)系，想清楚要做什么。你問的越多，獲得的答案越多，整個局面就越清晰。

至少，我經(jīng)常是這么提醒我自己，為人設(shè)計數(shù)字產(chǎn)品，本質(zhì)上就是了解他們的生活和工作，了解事情本身和人性本身。

原文作者 : Eugen E?anu

譯者/編輯 : 陳子木

譯文地址：https://www.uisdc.com/user-thinking-model

藍(lán)藍(lán)設(shè)計( www.b186.net )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)