產(chǎn)品設(shè)計(jì)的基本原則：對產(chǎn)品業(yè)務(wù)最重要的操作按鈕必須放在最順手且最顯眼的位置
寫在前面
UGC=User generate content，即我們平時(shí)說的用戶產(chǎn)生內(nèi)容，指的是一個(gè)產(chǎn)品平臺(tái)內(nèi)的主要內(nèi)容是由平臺(tái)內(nèi)自己的用戶創(chuàng)建歹袁、上傳的，而且內(nèi)容的交互（贊閱踩評享藏等）也是由用戶來完成寝优，是移動(dòng)互聯(lián)網(wǎng)領(lǐng)域一個(gè)非常常見的形態(tài)条舔，比如知乎、微博等等乏矾，我們現(xiàn)在正在看的簡書亦然孟抗。
對于UGC產(chǎn)品來說，最重要的業(yè)務(wù)必定是【用戶發(fā)布內(nèi)容】钻心，一個(gè)健康的UGC平臺(tái)下凄硼，應(yīng)該有著一群用戶每天都在穩(wěn)定地輸出、更新內(nèi)容捷沸。那么這樣一個(gè)重要的操作應(yīng)該如何設(shè)計(jì)摊沉？本文將羅列市面上比較主流和不那么主流的幾種發(fā)布入口的設(shè)計(jì)，供大家參考亿胸。
一坯钦、駝峰式
這一種是市面上最常見的樣式，我們常用的今日頭條和簡書就是采用這種樣式侈玄。
此種設(shè)計(jì)通常把【新增內(nèi)容】的入口居中在底部的TAB欄婉刀，用戶可以很方便的用單手點(diǎn)擊觸發(fā)。之所以叫做駝峰式序仙，是因?yàn)楹芏鄷r(shí)候這個(gè)按鈕會(huì)被UI設(shè)計(jì)師做的比較大突颊，而且通常比TAB欄稍微突出一點(diǎn)，在視覺效果上就像一段凸起的弧形潘悼，看起來跟駱駝的駝峰一樣律秃。
如果是平臺(tái)內(nèi)存在多種形態(tài)的內(nèi)容，比如有圖文治唤、單圖棒动、視頻等等，通常點(diǎn)擊【新增】按鈕之后會(huì)有一個(gè)交互界面宾添，讓用戶選擇要發(fā)布的類型船惨，同時(shí)向系統(tǒng)申請軟硬件訪問權(quán)限（視內(nèi)容形態(tài)不同柜裸，一般會(huì)有相冊、麥克風(fēng)粱锐、攝像頭疙挺、地理位置等等）。
二 怜浅、置頂式
這也是一種比較常見的設(shè)計(jì)铐然，會(huì)把發(fā)布入口放在頂部導(dǎo)航欄的左邊或者右邊，之所以這么做恶座，是因?yàn)檫@些產(chǎn)品有著其獨(dú)特的業(yè)務(wù)側(cè)重點(diǎn)搀暑。
以【下廚房】為例，它的發(fā)布入口放在了頂部的左上角：
那我們再看看他的底部TAB欄：
我們可以通過這個(gè)TAB欄的設(shè)計(jì)來反推這款app的側(cè)重點(diǎn)
【下廚房】：是這款應(yīng)用的首頁位置跨琳，為用戶提供內(nèi)容瀏覽以及一些主要欄目的入口险掀，與其他常規(guī)app一樣，放在了最左邊湾宙；
【市集】：這個(gè)板塊，如果我沒記錯(cuò)的話冈绊，在早期的版本是沒有的侠鳄，那時(shí)候依稀還記得這個(gè)app的發(fā)布入口也是采用駝峰式布局，加入了這個(gè)業(yè)務(wù)之后死宣，產(chǎn)品經(jīng)理就把發(fā)布入口挪到現(xiàn)在的左上角了伟恶。這個(gè)業(yè)務(wù)是下廚房實(shí)現(xiàn)必要的商業(yè)嘗試的重要一環(huán)，所以底部欄這個(gè)重要的流量入口也有它一份毅该；
【收藏】：作為一款菜譜工具類app博秫，收藏菜譜絕對是最高頻的用戶操作，眶掌，因此把它放在中心位置挡育，妥妥的沒毛病朴爬；
【信箱】：個(gè)人消息的集合即寒，中規(guī)中矩放在右側(cè)第二個(gè)；
【我】：個(gè)人中心業(yè)務(wù)的入口召噩，與其他App一樣母赵，放在最右邊。
當(dāng)然以上只是個(gè)人的一點(diǎn)馬后炮具滴，至于下廚房家的PM是否是這么個(gè)想法凹嘲， 我們不得而知，（逃）
所以使用置頂式的原因之一构韵，可能是側(cè)重的業(yè)務(wù)有多個(gè)周蹭，而發(fā)布按鈕作為要突出的一個(gè)趋艘，不再適合放置于底部TAB欄，應(yīng)該單獨(dú)提出來
我們再來看看另外一款采用置頂式設(shè)計(jì)的UGC產(chǎn)品：小紅書
我們首先很容易就發(fā)現(xiàn)了他的發(fā)布入口被放置在右上角谷醉，用一個(gè)相機(jī)的小icon來表示--因?yàn)檫@是個(gè)以照片為基礎(chǔ)的UGC分享社區(qū)致稀。
然后我們也可以發(fā)現(xiàn)，這款app與其他的UGC產(chǎn)品不一樣俱尼，它的底部沒有常規(guī)的TAB欄抖单，取而代之的是左右兩個(gè)角落的浮窗，分別是消息中心與購物車的入口遇八。由于沒有底部tab欄來承載矛绘，而發(fā)布入口是一個(gè)必須放置在首頁顯眼位置的業(yè)務(wù)，于是出現(xiàn)在頂部也是順理成章的事情刃永。
所以采用置頂式設(shè)計(jì)的另一個(gè)原因货矮，可能是這款產(chǎn)品走精簡風(fēng)，并沒有設(shè)置傳統(tǒng)的底部TAB欄
小紅書是一款主打[小而美]格調(diào)的產(chǎn)品斯够，它的很多UI語言散發(fā)出一種獨(dú)特的的風(fēng)格囚玫，以及動(dòng)態(tài)交互都是很有個(gè)性的，有興趣的同學(xué)可以下載一個(gè)體驗(yàn)一波读规。（小紅書快給我廣告費(fèi)）
三 抓督、浮窗式
這是一個(gè)比較少見到的樣式（其實(shí)老外的一些產(chǎn)品上面倒是蠻多機(jī)會(huì)見到的）。
在這種設(shè)計(jì)上束亏，發(fā)布入口一般會(huì)以浮窗的形式出現(xiàn)在內(nèi)容list頁的右下角铃在，用戶在瀏覽內(nèi)容的時(shí)候，可以很容易地用單手進(jìn)行發(fā)布內(nèi)容的操作碍遍。
但是這種樣式不會(huì)直接放置在app首頁的入口定铜，而是一般會(huì)出現(xiàn)在UGC產(chǎn)品的某個(gè)專題活動(dòng)的內(nèi)頁，用戶可以在瀏覽該專題的同時(shí)怕敬，快速參與揣炕。
網(wǎng)易家的Lofter是其中一個(gè)例子，它的首頁是使用的典型的駝峰式入口：
然后我們點(diǎn)擊進(jìn)入它的某個(gè)攝影專題祝沸，比如下方的[膠片]，它又使用了浮窗式的設(shè)計(jì)：
Lofter是一款面向攝影愛好者的UCG平臺(tái)罩锐，它里面提供了很多不同的攝影專題，那么在這些專題頁中卤唉，需要突出的元素肯定是其他用戶往這個(gè)專題投稿的內(nèi)容涩惑，因此這些內(nèi)容的展示，不應(yīng)該被其他元素（如導(dǎo)航欄桑驱，其他欄目的入口等）竭恬，但是又要提供一個(gè)快速參與的入口跛蛋，所以采用小浮窗的形式，既不阻擋整體畫面的展示痊硕，也可以讓用戶快速參與到話題赊级。
四 、其他非主流打法
1. 雙入口式
顧名思義岔绸，這種樣式在一個(gè)頁面上有兩個(gè)發(fā)布入口理逊，通常一個(gè)為主--承擔(dān)大部分內(nèi)容的發(fā)布，一個(gè)為輔--只發(fā)布某種特定類型的內(nèi)容盒揉。
新浪微博就采用了這樣的設(shè)計(jì)晋被，它在頂部的左側(cè)，加入了一個(gè)快速發(fā)布短視頻內(nèi)容的入口刚盈，然后在底部的TAB欄羡洛，有著另一個(gè)發(fā)布入口，承擔(dān)了微博平臺(tái)內(nèi)主要的內(nèi)容的發(fā)布藕漱，包括了圖文/視頻/直播等等（講道理新浪微博已經(jīng)越來越像一個(gè)大雜燴了）
其實(shí)微博這個(gè)左上角的視頻發(fā)布欲侮，是模仿了Facebook前兩個(gè)版本更新之后帶來的新特性-視頻濾鏡，而且連第一次進(jìn)入這個(gè)功能的引導(dǎo)界面都是一毛一樣肋联，但是微博的業(yè)務(wù)太繁雜了锈麸，既有圖文微博，又有視頻牺蹄，還有直播，問答等等薄翅，總共16個(gè)類目之多沙兰，所以并不能像FB那樣做成簡潔的樣式，反而有種不倫不類的感覺翘魄。這里給新浪微博一個(gè)呵呵鼎天。
同時(shí)這個(gè)故事告訴我們斋射，產(chǎn)品經(jīng)理不是不可以模（chao）仿（xi）別家的產(chǎn)品，但是一定要跟自家的產(chǎn)品業(yè)務(wù)相結(jié)合但荤，不然就有種東施效顰的味道了罗岖。
2. 隱藏式
正如本人開頭所說，一個(gè)UGC平臺(tái)的健康運(yùn)營腹躁，很依賴于用戶的日常上傳新內(nèi)容桑包，所以會(huì)把內(nèi)容發(fā)布放置在非常顯眼而且容易操作的位置，但是也有一些UGC產(chǎn)品把內(nèi)容的瀏覽視作最重要的業(yè)務(wù)纺非，不允許有任何元素妨礙這個(gè)業(yè)務(wù)哑了，因此其他業(yè)務(wù)赘方，即使也是非常重要的業(yè)務(wù)嗎，也要為此讓步弱左，被隱藏或者被放置到其他非首頁的界面窄陡。
Pinterest就是這么一個(gè)例子，可能一些人會(huì)把它視作一個(gè)素材網(wǎng)站來看待拆火，但是如果我們剖析它的根本業(yè)務(wù)跳夭，它其實(shí)是一個(gè)遵循著[用戶上傳內(nèi)容--其他用戶對內(nèi)容進(jìn)行交互]這么一個(gè)典型的UGC業(yè)務(wù)閉環(huán)，因此應(yīng)該把它理解成一個(gè)UGC產(chǎn)品榜掌。
那我們可以看看它的發(fā)布入口优妙，它被放置在個(gè)人中心的頂部右側(cè)位置，而不是像其他app那樣放置在首頁：
而它的首頁憎账，則更專注于素材（即UGC內(nèi)容）的展示與交互上：
可以說Pinterest的這一做法是非常聰明的邪意，雖然作為一款非常依賴用戶上傳內(nèi)容的UGC產(chǎn)品，但是在移動(dòng)端上反砌，用戶打開app的目的更多是為了瀏覽素材和尋找創(chuàng)意雾鬼，而上傳內(nèi)容的操作，其實(shí)更加會(huì)集中在PC上的WEB頁面宴树，因此直接把發(fā)布內(nèi)容的入口給隱藏策菜，一來保持界面的簡潔，二來不會(huì)影響用戶瀏覽素材酒贬。
3. 野路子式
前面介紹了我們平時(shí)比較常用的樣式又憨，其實(shí)市面上的app千千萬，有相當(dāng)一部分并不采用這些樣式锭吨。
比如微信蠢莺，把發(fā)布朋友圈的路徑設(shè)計(jì)的比較深，如果用戶要發(fā)布一條朋友圈零如，那么通常路徑是這樣的：
打開app--點(diǎn)擊[發(fā)現(xiàn)]--點(diǎn)擊右上角的相機(jī)按鈕
這樣中間其實(shí)是多出來了一個(gè)步驟躏将。至于為什么這么設(shè)計(jì)，大概是張小龍的[工匠精神]吧考蕾，笑祸憋。
當(dāng)然還會(huì)有其他一些比較[不走尋常路]的應(yīng)用，并不一定說哪種是最好的肖卧，只能說一款產(chǎn)品必然有著更適合自身業(yè)務(wù)的設(shè)計(jì)方式夺衍。
最后
移動(dòng)互聯(lián)網(wǎng)時(shí)代，UGC是一種很重要的產(chǎn)品形態(tài)，如果有留意相關(guān)數(shù)據(jù)報(bào)告的話沟沙，我們會(huì)發(fā)現(xiàn)這類產(chǎn)品的用戶打開率和占據(jù)用戶使用設(shè)備時(shí)長比例上都是最高的河劝，在這種背景下，UGC產(chǎn)品的前景是非常的開闊的矛紫，而且有了用戶使用基礎(chǔ)赎瞎，我們在進(jìn)行商業(yè)變現(xiàn)嘗試的時(shí)候也會(huì)更加的容易。所以研究UGC產(chǎn)品對于產(chǎn)品經(jīng)理來說是非常有必要的颊咬。
希望此文對大家有幫助务甥。
