編輯導(dǎo)語：游戲社交是現(xiàn)在人們常選擇的社交方式之一，不過若想讓更多用戶愿意留存在游戲社交平臺上，產(chǎn)品在設(shè)計層需要強(qiáng)化社交屬性，并讓用戶更容易上手操作。本篇文章里，作者針對一款游戲社交產(chǎn)品的首頁改版案例進(jìn)行了拆解，一起來看一下。

一局APP是一款年輕化的游戲社交平臺。隨著產(chǎn)品的發(fā)展和用戶數(shù)量的增長，游戲數(shù)量也隨之?dāng)U張，舊版首頁的諸多問題就會逐漸暴露出來，為了給用戶帶來更好的瀏覽和使用體驗，UE團(tuán)隊推動了此次首頁的改版設(shè)計。

通過訪談和內(nèi)部討論，我們發(fā)現(xiàn)，舊版首頁的問題集中在以下三點：視覺重點多而雜，游戲入口難識別，社交信息展示較弱。

所以本次升級的主要設(shè)計手段為：簡化頁面視覺復(fù)雜度，提高游戲入口識別性，強(qiáng)化社交屬性，以提升游戲和房間入口點擊率和游戲滲透率。

一、簡化頁面視覺復(fù)雜度

1. 提高游戲入口展示面積

游戲入口是一局首頁最為重要的模塊。改版前低頻操作區(qū)占頁面比例過大，不利于游戲入口展示，我們通過壓縮頭部區(qū)域，將游戲入口面積增加20%，為游戲展示的動態(tài)化和多樣化提供更多空間，從而提高游戲的點擊欲望，促進(jìn)游戲轉(zhuǎn)化。

2. 減少顏色種類，用色更克制

改版前首頁游戲入口為了展示更多一局獨(dú)特的設(shè)計語言，用色和風(fēng)格相對復(fù)雜，大面積多種顏色的應(yīng)用，再加上復(fù)雜的IP形象，很容易產(chǎn)生視覺焦慮，讓人抓不到重點。

所以在在顏色方面，也從以前的5種顏色對應(yīng)游戲類型，優(yōu)化為3種顏色隨機(jī)選用，房間入口改為白色卡片，更突出游戲區(qū)內(nèi)容。

二、提高游戲入口識別性

1. 增加入口類型，精煉視覺語言

改版前游戲入口，由 背景+游戲名+IP 構(gòu)成，用戶只能依靠名稱識別游戲內(nèi)容，很難對游戲內(nèi)容產(chǎn)生想象和認(rèn)知，背景顏色的飽和度也偏高，元素繁多。

所以對于游戲入口，我們做了以下優(yōu)化：

1）增加游戲入口類型

從單一圖片入口，改為大+小兩種類型，重點運(yùn)營的游戲采用大卡容器承載，給予重點游戲更強(qiáng)的吸引力，增強(qiáng)內(nèi)容識別性。

2）重新提煉設(shè)計語言

延續(xù)一局視覺語言，提取真實世界中游戲機(jī)的形狀和紋理，應(yīng)用在界面中，豐富游戲?qū)傩浴?/p>

2. 尋找內(nèi)在驅(qū)動力，強(qiáng)化用戶使用動機(jī)

我們從游戲設(shè)計中吸取經(jīng)驗，以游戲設(shè)計八角模型為指導(dǎo)，將游戲入口中能夠影響用戶內(nèi)在驅(qū)動力的信息提取并強(qiáng)化，在提高入口識別性的同時吸引用戶點擊。

動機(jī)：好奇未知

1）游戲靜態(tài)入口變?yōu)閯討B(tài)入口。對于未知內(nèi)容，精美的動態(tài)視頻能表達(dá)更豐富的信息，遠(yuǎn)比靜態(tài)圖像更具吸引力，更易激發(fā)用戶對完整游戲的好奇心。

2）規(guī)范小入口圖標(biāo)。舊版游戲入口，僅使用游戲IP，識別性差，達(dá)不到展示內(nèi)容的目的，相反由于IP形象風(fēng)格和裝扮類似，容易引起用戶的疑惑。

3）“查看更多”拖拽延續(xù)。繼續(xù)滑動“查看更多”，區(qū)域隨手勢延伸，促進(jìn)用戶完成繼續(xù)滑動的動作。

三、強(qiáng)化房間社交屬性房間信息與社交信息重新排布

動機(jī)：社交建聯(lián)

1）房間信息與社交信息重新排布，上方小區(qū)域橫排展示該房間游戲相關(guān)的信息，下方區(qū)域外露更多玩家信息，增強(qiáng)社交屬性讓用戶更快get到人數(shù)、名稱、性別等社交信息。

2）新增房間玩家頭像展示，動態(tài)展示人數(shù)變化，強(qiáng)化社交屬性，激發(fā)社交動力。

四、寫在最后

一局的進(jìn)化之路剛剛開啟，后續(xù)我們也將會基于從小眾游戲社區(qū)向游戲平臺轉(zhuǎn)型的方向繼續(xù)探索，持續(xù)迭代，打造更好玩更沉浸的游戲體驗。閑暇之余，叫上好友來一局！

作者：百度MEUX，百度移動生態(tài)用戶體驗設(shè)計中心，負(fù)責(zé)百度移動生態(tài)體系的用戶/商業(yè)產(chǎn)品的全鏈路體驗設(shè)計

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

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