一個面向美國90后的短視頻APP已上線了一段時間，在這個項(xiàng)目中全程主導(dǎo)負(fù)責(zé)了從0到1的設(shè)計(jì)過程尿赚，流程比較完整，團(tuán)隊(duì)內(nèi)部反饋不錯蕉堰，認(rèn)為其中一些思路有啟發(fā)作用凌净，所以做一個總結(jié)回顧。
設(shè)計(jì)過程分為三個階段：探索屋讶、設(shè)計(jì)冰寻、實(shí)現(xiàn)。
探索階段丑婿，參與前期的機(jī)會點(diǎn)調(diào)研，組織產(chǎn)品關(guān)鍵詞與玩法腦暴没卸，與產(chǎn)品一起梳理最初版本的功能list羹奉。
設(shè)計(jì)階段，除了交互约计、視覺流程以外诀拭，進(jìn)行了比較多的設(shè)計(jì)探索，進(jìn)行創(chuàng)意的挖掘煤蚌，期望能夠通過一些細(xì)節(jié)亮點(diǎn)打動對應(yīng)的年輕用戶群體耕挨。
實(shí)現(xiàn)階段，Demo完成開發(fā)后尉桩，進(jìn)行用戶測試筒占，了解用戶對這個新的產(chǎn)品形態(tài)的觀點(diǎn)，并收集使用過程中存在問題蜘犁，進(jìn)行迭代優(yōu)化翰苫。
一、探索階段
1.機(jī)會點(diǎn)調(diào)研分析
首先對美國同類競品進(jìn)行了地毯式的調(diào)研，目前美國和中國的短視頻市場存在較大的差異：國內(nèi)是百家齊放的狀態(tài)奏窑，各種獨(dú)立短視頻APP層出不窮导披，而美國目前還沒有一款比較主流的獨(dú)立短視頻應(yīng)用。曾經(jīng)Vine是一個相對主流的短視頻APP埃唯，但被twitter收購后已經(jīng)下架撩匕。
美國的年輕用戶看短視頻主要通過兩種渠道：1.在社交應(yīng)用中，如Snapchat墨叛、Instagram等止毕。2.在比較專業(yè)的視頻聚合平臺上，如Youtube巍实、Netflix滓技、Hulu等。
其中社交應(yīng)用上的用戶粘度是比較強(qiáng)的棚潦，我們主要對標(biāo)Youtube這類視頻聚合產(chǎn)品展開分析令漂，以Youtube為例，它是以10分鐘以上的長視頻為主丸边，用戶年齡分布比較廣叠必，并且社交互動屬性不是特別強(qiáng)，雖然提供了評論等互動方式妹窖，但并沒有作為產(chǎn)品的核心亮點(diǎn)予以突出纬朝。
2.明確產(chǎn)品定位
根據(jù)一系列的分析、討論骄呼，我們期望將產(chǎn)品定位在美國市場的90后年輕用戶群體共苛，以提供短視頻內(nèi)容為主，針對用戶在碎片時間的消費(fèi)蜓萄，并且突出強(qiáng)互動——我們認(rèn)為年輕用戶的互動訴求更為強(qiáng)烈隅茎，期望以社區(qū)互動為突破點(diǎn)打開市場，而不僅僅是依靠內(nèi)容的差異化來獲取用戶嫉沽。
用一句話來描述產(chǎn)品核心定位：一個面向美國90后的可以玩的短視頻社區(qū)辟犀，其中『可以玩』是產(chǎn)品最大的亮點(diǎn)。
3.確定產(chǎn)品核心關(guān)鍵詞
產(chǎn)品定位明確以后绸硕，我們需要確定一些關(guān)鍵詞堂竟，為產(chǎn)品定調(diào)，以便展開功能構(gòu)想和推進(jìn)后續(xù)的交互與視覺設(shè)計(jì)玻佩。
所以組織產(chǎn)品出嘹、運(yùn)營、開發(fā)等核心角色咬崔，一起圍繞『我們期望做出一個怎樣的短視頻社區(qū)』進(jìn)行腦暴疚漆，每個人給出3個心目中理想的形容詞，之后進(jìn)行歸類投票。最終確定『熱鬧』娶聘、『好玩』闻镶、『多元』作為產(chǎn)品的核心關(guān)鍵詞。
『熱鬧』包括兩方面：1.功能上突出社區(qū)互動丸升，讓用戶感受到有許多同好者一起看視頻铆农、一起交流。2.設(shè)計(jì)上狡耻，通過一些互動信息的展示墩剖，烘托這一氛圍。
『好玩』指交互上用一些有趣夷狰、情感化的設(shè)計(jì)細(xì)節(jié)打動用戶岭皂，讓用戶感受到這是一個有趣、輕松的社區(qū)沼头，另外爷绘，內(nèi)容上以輕松有趣的視頻為主，讓用戶在休閑碎片時間快速娛樂进倍。
『多元』主要指內(nèi)容上兼容并包土至，提供多種類型，并且社區(qū)足夠開放猾昆，能夠容納各種不同喜好陶因、不同個性人在其中活躍。
4.確定核心互動玩法
由于『可以玩』是我們的亮點(diǎn)垂蜗，所以圍繞這個部分楷扬，又組織大家進(jìn)行了一次互動玩法的腦暴，收集一些玩法方面的創(chuàng)意贴见。
匯集的一些idea進(jìn)行歸類烘苹，并請產(chǎn)品負(fù)責(zé)人根據(jù)產(chǎn)品的戰(zhàn)略訴求，對這些想法進(jìn)行甄別蝇刀、優(yōu)先級排序螟加，最終決定圍繞彈幕徘溢、表情這一類能夠讓用戶充分表達(dá)自我的功能點(diǎn)來優(yōu)先實(shí)現(xiàn)吞琐。
5.明確功能列表
在需求明確的階段，首先產(chǎn)品提供了一份比較完整的功能地圖然爆，但是留給第一個版本的時間有限站粟，我們需要盡量的在首個版本中快速的驗(yàn)證最核心的功能，因此梳理了一份產(chǎn)品拆分階段的規(guī)劃曾雕，將產(chǎn)品形態(tài)分成三個階段去逐步完成：
第一階段：搭建一個社區(qū)雛形奴烙，并突出核心互動玩法。目標(biāo)是讓用戶了解這是一個怎樣的產(chǎn)品，驗(yàn)證這樣的產(chǎn)品形態(tài)是否能夠被用戶接受和喜愛切诀。
第二階段：進(jìn)一步完善社區(qū)揩环，提供更完善的內(nèi)容分發(fā)機(jī)制，同時提供拍攝工具幅虑，允許用戶上傳自己的內(nèi)容丰滑。
第三階段：完善用戶在社區(qū)中的形象，如增加興趣標(biāo)簽倒庵、個人信息等褒墨，逐步構(gòu)建粉絲文化，并引入社交機(jī)制擎宝，如社區(qū)郁妈、私信等。
通過這樣的規(guī)劃绍申，讓大家都對第一個版本的目標(biāo)更加清晰噩咪，這樣首個版本的功能list也就很快明確出來了。
二失晴、設(shè)計(jì)階段
1.交互設(shè)計(jì)
設(shè)計(jì)首頁的交互方案時剧腻，同樣圍繞產(chǎn)品的關(guān)鍵詞展開，期望突出熱鬧涂屁、社區(qū)互動感书在。下圖中左側(cè)的布局是一些視頻聚合類應(yīng)用的常見樣式：清晰的視頻卡片、發(fā)布者頭像拆又、名稱儒旬，以及基本的互動操作，如點(diǎn)贊帖族、分享等栈源。
右側(cè)是最終我們采用的方案：將每一個視頻包裝成一條社交feed卡片，頭像竖般、昵稱展現(xiàn)在上方甚垦，用氣泡的形式展現(xiàn)一條神評論，并直接將視頻的彈幕外露前置涣雕，同時展現(xiàn)點(diǎn)贊者的頭像艰亮。這樣的展現(xiàn)形式可以讓用戶打開APP在第一時間get到產(chǎn)品的氛圍，體會到產(chǎn)品的玩法挣郭，感受到有很多人在watch together迄埃、一起互動。
下圖是設(shè)計(jì)首頁視頻卡片時嘗試的不同的交互布局展現(xiàn)方案：最開始的設(shè)計(jì)將標(biāo)題放在視頻上方兑障，后面嘗試將神評論與用戶頭像做結(jié)合侄非，同時展現(xiàn)彈幕蕉汪，又做了減法，去掉一些信息逞怨，突出最核心的元素者疤。一步步調(diào)整、演變叠赦、討論宛渐，最終確定了最后一條卡片的布局結(jié)構(gòu)。
另外一部分交互的設(shè)計(jì)眯搭，就是視頻播放器的細(xì)節(jié)體驗(yàn)窥翩。首頁的視頻為自動播放，其中包含不同的狀態(tài)鳞仙，如加載中寇蚊、播放中、加載失敗等棍好，在不同的狀態(tài)下點(diǎn)擊進(jìn)入詳情頁仗岸，同樣需要提供對應(yīng)的一些狀態(tài)展示，以及其中包含的彈幕借笙、聲音等的處理策略扒怖。
此外，還有視頻詳情頁的交互业稼，頁面包含的操作盗痒、信息非常多，包括頭像低散、名稱俯邓、關(guān)注按鈕、彈幕熔号、表情稽鞭、進(jìn)度條、分享引镊、評論等朦蕴，需要將這些信息合理的歸類布局，同時考慮到用戶操作的便捷性弟头。以下是設(shè)計(jì)過程中嘗試的不同布局方案：
針對彈幕吩抓，我們花了比較長的時間去研究，目前美國還沒有一款類似國內(nèi)嗶哩嗶哩的彈幕視頻應(yīng)用占據(jù)主流亮瓷，而從可搜集到的資料來看琴拧，美國市場是否能夠接受彈幕這種亞文化還是個未知數(shù)降瞳。然而我們還是相信中美年輕人的本質(zhì)訴求是相同的嘱支，愿意去互動蚓胸、表達(dá)自我是年輕人的共同特質(zhì)，所以還是決定試一試除师。
針對彈幕的展現(xiàn)樣式沛膳，做了三種不同的交互方案，做成動效demo汛聚，進(jìn)行問卷測試：
其中上下滑動的方案投票占比最高锹安，然而由于問卷是投放在直播產(chǎn)品中，而直播的評論樣式和這種方式相同倚舀，所以數(shù)據(jù)有可能受到影響叹哭。于是又仔細(xì)閱讀了所有用戶的主觀原因評價：
左右滑動的方案：用戶認(rèn)為非常酷痕貌、新鮮风罩，雖然這種方式國內(nèi)很常見，但是美國幾乎還沒有同類產(chǎn)品采用這樣的方式展現(xiàn)評論舵稠。并且彈幕和視頻的展現(xiàn)區(qū)域更靠近超升，避免視線上下跳動。
上下滑動的方案：和一些主流產(chǎn)品哺徊，如FB直播的形式比較像室琢，符合閱讀習(xí)慣，中規(guī)中矩落追。
左右出現(xiàn)氣泡的方案：用戶認(rèn)為這種樣式有趣盈滴，比較像iMessager，更愿意去回復(fù)轿钠，參與互動雹熬。
經(jīng)過衡量比較，最終選取了方案一：考慮到作為一個新的產(chǎn)品谣膳，期望通過一些設(shè)計(jì)上的差異點(diǎn)給用戶一種全新的體驗(yàn)感受竿报，形成品牌記憶點(diǎn)。另外继谚，方案一的信息更靠近烈菌，視覺焦點(diǎn)更集中。
與此同時花履，也對用戶的接受程度做了問卷測試芽世，尤其是對『美國用戶是否會覺得彈幕對看視頻造成干擾』這個問題，進(jìn)行了調(diào)研：67%的用戶反饋認(rèn)為彈幕并沒有打擾到視頻觀看诡壁。
另一個關(guān)鍵問題是济瓢，首個版本是否要同時提供彈幕和評論，如果是妹卿，那么兩種形式如何并存旺矾？一種處理方式是蔑鹦，兩個功能分開，彈幕承載實(shí)時信息箕宙，而評論承載沉淀的信息嚎朽。另一種解決思路是彈幕和評論采用同一套內(nèi)容，只不過彈幕只是一種UI上的趣味表達(dá)柬帕。但這樣的處理哟忍，會使彈幕水分較大，沒辦法實(shí)時的根據(jù)影片展現(xiàn)高潮點(diǎn)和情緒爆點(diǎn)陷寝。
這個問題引起了團(tuán)隊(duì)中很大的分歧锅很，為了統(tǒng)一認(rèn)知湾宙，分析了不同方案的優(yōu)缺點(diǎn)瘾晃，拉相關(guān)人一起討論：
經(jīng)過討論最終決定，第一個版本只提供彈幕便斥。原因是：1.彈幕對美國用戶來說是一個全新的形態(tài)饶火，如果和評論并存鹏控，擔(dān)心用戶會分不清兩個功能，學(xué)習(xí)成本較大肤寝。2.先只提供彈幕玩法当辐，可以更直接的通過數(shù)據(jù)和用戶反饋驗(yàn)證出效果。3.將更多精力和開發(fā)資源用于打磨好彈幕的細(xì)節(jié)體驗(yàn)鲤看，聚焦到這個核心亮點(diǎn)上缘揪。
2.風(fēng)格設(shè)計(jì)探索
在風(fēng)格探索階段，首先圍繞三個設(shè)計(jì)關(guān)鍵詞搜集相關(guān)圖片义桂，制作風(fēng)格情緒版找筝。之后通過討論，選出最能夠代表產(chǎn)品風(fēng)格慷吊、氛圍的意向圖片袖裕。
之后圍繞圖片進(jìn)行風(fēng)格概念稿的嘗試，在交互和視覺上做一些突破性的創(chuàng)意探索溉瓶。
經(jīng)過討論確定了一個主風(fēng)格急鳄，并從概念稿中吸納好的細(xì)節(jié)，融入到最終的UI設(shè)計(jì)當(dāng)中堰酿，最終的部分設(shè)計(jì)稿：
關(guān)于logo：logo嘗試了很多方案疾宏，最終選出的這一個不是設(shè)計(jì)上最完善的，但是是大家一致覺得最符合我們的設(shè)計(jì)關(guān)鍵詞與定位的触创。當(dāng)然還有很多可以優(yōu)化的地方坎藐，例如目前的輪廓識別性比較差，而且風(fēng)格細(xì)節(jié)不夠完整哼绑。
視覺方案上的一些細(xì)節(jié)處理：首頁視頻卡片右上角放置的表情岩馍、調(diào)節(jié)視頻進(jìn)度條的笑臉入口碉咆、以及界面文案旁邊的emoji元素、視頻詳情頁的表情用一個彎曲的線連接等兼雄，都是我們期望的、能夠通過這些點(diǎn)讓年輕用戶覺得有趣帽蝶，覺得這是一個輕松赦肋、好玩的像玩具一樣的娛樂化應(yīng)用。
關(guān)于視頻詳情頁的背景：采用了一個高斯模糊的背景励稳，而沒有采用像其他競品一樣黑色的背景佃乘，也是基于產(chǎn)品定位的考慮，用黑色背景可以最大程度突出視頻內(nèi)容驹尼，但我們期望用戶除了看視頻以外趣避，也能夠關(guān)注到彈幕等互動信息，并積極的參與活動新翎。所以視頻詳情頁中的展示不是像電影院一樣的一個沉浸式的環(huán)境程帕，而更像是chat room的氛圍。用淺色的背景可以讓上面的文字信息更易讀地啰，氛圍也更加輕松愁拭。
這個高斯模糊在安卓平臺上通過技術(shù)手段處理成本較大，因?yàn)榻o了默認(rèn)兩張靜態(tài)的圖亏吝，寫到了安裝包中岭埠，一張偏深色、一張偏淺色蔚鸥，隨機(jī)出現(xiàn)惜论，這樣從用戶感知上會覺得頁面是有一些變化的。沒有給更多顏色是因?yàn)閳D片較大止喷，會使安裝包加大很多馆类，拖慢安裝速度。
Google Play配圖設(shè)計(jì)弹谁，也同樣重點(diǎn)突出了產(chǎn)品的核心亮點(diǎn)蹦掐，并在風(fēng)格上延續(xù)統(tǒng)一：
當(dāng)然以上的設(shè)計(jì)決策是基于我們設(shè)計(jì)師自己的判斷，至于是否能得到美國年輕用戶的喜愛僵闯，還需要驗(yàn)證的卧抗，我們圍繞著選定風(fēng)格做了四種延展的設(shè)計(jì)，進(jìn)行問卷調(diào)研用戶的喜好鳖粟，結(jié)果如下：
圍繞用戶的投票和主觀評價社裆，我們又進(jìn)行了一輪細(xì)化設(shè)計(jì)打磨。
三向图、實(shí)現(xiàn)階段
產(chǎn)品demo開發(fā)完成后泳秀，我們預(yù)留了一段時間用于做預(yù)調(diào)研标沪，了解用戶對這個全新的產(chǎn)品會怎么看，使用感受如何嗜傅。我們通過usertesting這個平臺金句，發(fā)出apk安裝包，提供用戶一些完成的任務(wù)和問題吕嘀，用戶一邊使用违寞，一邊think aloud，回答問題偶房。
以下是五位用戶分別給出的三個形容詞趁曼，用以概括初次對產(chǎn)品使用的印象。其中colorful棕洋、entertaining挡闰、fast被重復(fù)提及￡蹋可以說明我們的設(shè)計(jì)風(fēng)格給用戶的印象比較深刻摄悯，并且用戶能夠感受到這是一個娛樂化的產(chǎn)品、比較輕快愧捕。
以下是選取一些用戶具體的反饋評價射众，可以看出用戶對產(chǎn)品整體的核心亮點(diǎn)有感知，并且反饋比較正面晃财。
正面反饋集中在產(chǎn)品的核心定位叨橱、互動玩法、視覺風(fēng)格断盛，以及簡單易用的交互上罗洗。負(fù)面反饋集中在設(shè)計(jì)細(xì)節(jié)上，如圖標(biāo)表意問題钢猛、一些操作不符合預(yù)期問題等伙菜。收集到這些問題后，我們快速給出優(yōu)化方案命迈，在新的迭代版本中去修正贩绕。
以上就是目前已經(jīng)完成的產(chǎn)品第一個階段的工作，從3月份開始做調(diào)研探索壶愤，到最終上線淑倾，歷時兩個月左右，有幾個重要的體會收獲：
1.針對創(chuàng)業(yè)型小團(tuán)隊(duì)的工作方式：除了專注于產(chǎn)品體驗(yàn)以外征椒，設(shè)計(jì)師也需要注重維護(hù)好和合作的產(chǎn)品娇哆、開發(fā)等角色的工作體驗(yàn)，盡量讓每個核心角色都認(rèn)同產(chǎn)品的方向、思路和重要決策碍讨。這樣進(jìn)行設(shè)計(jì)推動會更加容易治力。例如對一個關(guān)鍵問題大家有分歧，應(yīng)該更理性的分析利弊勃黍，讓核心角色有發(fā)言權(quán)宵统，并及時同步思路，讓大家達(dá)到認(rèn)知的統(tǒng)一覆获。
2.如何做突破性的設(shè)計(jì)：目前的設(shè)計(jì)马澈，公司內(nèi)部認(rèn)為比較有特點(diǎn)和記憶點(diǎn)，和同類競品差異很大锻梳，尤其是作為一個新推出的產(chǎn)品箭券，需要讓美國年輕人有認(rèn)同净捅，一定要有一些特別的疑枯、難以名狀的『潮點(diǎn)』才能夠打動用戶。如果采用傳統(tǒng)的需求到交互再到視覺的流程蛔六，很難得到一個很出彩的設(shè)計(jì)荆永，我們學(xué)習(xí)Snapchat，從創(chuàng)意出發(fā)国章，用設(shè)計(jì)發(fā)散思維倒推具钥，先讓設(shè)計(jì)師比較少限制的去嘗試，再收斂液兽，把亮點(diǎn)融入到產(chǎn)品中去骂删，這樣的方式讓我們得到了一個理想的結(jié)果。
3.用戶的反饋與驗(yàn)證：做海外產(chǎn)品的設(shè)計(jì)四啰，需要傾注更多精力在用戶的調(diào)研上面宁玫，因?yàn)椴涣私猓孕枰嗟尿?yàn)證柑晒，通過驗(yàn)證可以了解更多事實(shí)欧瘪。國外年輕人接觸的周遭、喜歡的潮流事物匙赞、使用的品牌和產(chǎn)品和國內(nèi)還是有很大差異的佛掖。通過各種渠道，盡可能的多了解涌庭，在設(shè)計(jì)時才能更加有把握芥被。
產(chǎn)品安卓版本APP下載地址：https://play.google.com/store/apps/details?id=com.cmcm.videodope&hl=zh-CN
