本文介紹了微光 5.0 從前期調研、確立目標、解決問題到設計反饋的一系列設計流程。

更多設計復盤：

一、背景

在加入微光團隊之后，見證了微光從 4.0 到 5.0 的變遷，在版本不斷迭代的過程中各種碎片化的點狀需求滿足了當時業務的發展，當我們抽離出業務俯看整個產品設計時我們發現微光在當下的節點需求更加整體性的思考什么樣的體驗更加符合當下的微光業務模式。

隨著微光與華視達成版權合作，更多優質的影視資源注入微光，微光的功能也逐漸豐富化，用戶可以在微光一起看、一起聊、一起聽、一起唱，用戶觸達“一起”的途徑變得更加多元，產品也要優化消費場景和建立品牌形象來建立用戶口碑、提升轉化。

因此，微光 5.0 版本應運而生。我們以“遇見美好的陪伴”作為產品的初心，以現有業務為基礎，結合我們充分的用戶洞察，從全新的視角出發，在業務模式、產品框架、信息結構、品牌符號等方面進行了重構與升級。

二、前期調研

1. 用戶分析

在社交類產品用戶群體中新用戶和老用戶由于接觸產品的時間有客觀差距，用戶行為表現也應當從不一樣的視角來理解。因此，我們通過用戶分層作為抓手，向下拆解不同用戶對于產品的使用訴求進行針對性設計。

核心老用戶需求明確，房間、廳核心玩家快速觸達首頁、派對頁；非核心老用戶需求較明確，廳、動態用戶決策牽引熱映頁、派對頁；高活新用戶在廳、房間新玩家，樂于付費效率提升搜索頁、內容詳情頁；低活新用戶用戶不知道微光如何使用心智透傳加入派對、新手引導。

數據來源：來自二月份神策《微光核心用戶洞察報告》

2. 線上問題

根據 4.0 版本上線后一段時間的反饋跟蹤，我們從用戶端、業務端、數據變化及真實使用等維度對線上問題點進行整合，共有以下幾個方面：

①業務心智模糊

當新用戶進入微光之后不知道應該如何操作，功能多但定位模糊，新用戶進入首頁之后無法快速進入核心功能

②分發效率低

用戶進入核心場景之后二級頁面、三級頁面沒有做好流量分發，許多用戶進入到場景之后發現只有自己一個人無法達成一起看的目的

③信息結構混亂

內容卡片瀏覽動線混亂，用戶在第一時間看不到關鍵信息內容。內容卡片尺寸比例、圓角、字號劃分不清晰，增加用戶理解成本

④首頁內容結構單一

首頁內容過于單一，用戶在首頁一直會刷到同質化的廳房間，在廳房間維度沒有做到根據用戶偏好進行篩選，在內容方式維度沒有做到多種信息內容展現，從而造成廳內容單一，用戶活躍度低的情況

三、設計目標

對于用戶、產品、設計、廳主等不同業務方的反饋進行整合之后，梳理出微光 5.0 全新設計的設計目標：

提升基礎體驗：通過界面優化來強調業務優先級，通過容器重構幫助內容卡片等重要信息展示區域有效信息更好的轉達，通過內容信息的整合與分發提升效率。

強化品牌記憶：通過 6 年來微光小微小光形象作為超級符號進行延展并沉淀品牌基因，在多場景觸達的時候利用品牌元素使產品更具有辨識度，強化用戶沉浸感。

四、解決問題

1. 基礎體驗優化

在基礎體驗優化設計目標上我們向下拆分，分成了界面優化、容器重構、效率提升三個設計策略，我們嘗試通過用戶分層行為偏好來分析，這三個設計策略之后存在相互促進的關系，將其整合即可形成基礎體驗優化的閉環。

同時這三部分也有著各自的解法。在界面優化部分我們通過功能性角度出發，完善了流媒體類型運用格式塔原理幫助用戶快速找到所需內容；加強了社交模塊幫助用戶搭建社交關系；增加了新的運營位幫助運營內容更快觸達；整合了內容卡片類型使同類型產出更加規范統一；強化決策牽引，提升用戶啊轉化，利用關鍵功能“一起看“做同場景分發。

在下面將具體講解不同設計策略的具體解法。

問題一：業務心智模糊，用戶進入 app 不知道該做什么？

解決方案：界面優化-加強社交模塊，幫助用戶搭建社交關系

根據前期調研中拆解關鍵功能“一起看”入口我們發現：社交關系非常重要， 老用戶有大量的私聊頁加入、跟好友、邀請等，新用戶應盡快促進用戶形成社交關系。在私聊頁、跟好友、app 邀請等入口的次均時長明顯很高，社交關系帶動的一起看消費更加的深入。 一起聊和中立用戶也表現出社交向進入一起看比例偏高，且消費數據更好。消費效率表現為：社交向>主動選擇（搜索、推薦、首頁加入）>被動推薦（滑動切換）。

因此，我們在 5.0 版本的設計中在首頁金剛區做了優化，清晰的劃分出了重點功能與次重點功能，將社交向的遇見、群組和核心功能一起看的視覺重心增強。不管是新老用戶都可以在進入首頁清楚的知道微光的核心功能，解決了用戶反饋新用戶不知道進入后該如何使用的問題。

問題二：信息結構混亂，用戶無法第一時間看到核心內容

解決方案：界面優化-完善流媒體類型，優化結構分組

隨著華視版權合作的達成，微光也融入更多更加豐富的流媒體資源，但由于之前內容雜糅在一起，用戶很難能夠快速便捷的找到對應的消息內容。面對更加龐大的流媒體資源的時候，我們將其進行結構分組。按照“分類記憶法”中的描述，當有大量內容的時候，先確定大分類，再確定子分類，能夠幫助我們快速鎖定目標，找到對應內容。

那么在頁面的設計過程中，我們運用格式塔原理，將臨近的內容歸位一類，幫助我們將大量的流媒體資源進行分類梳理，幫助用戶快速找到想要的內容。

問題三：首頁內容結構單一，營銷內容轉化低

解決方案：界面優化-優化營銷場景觸達

在原版一級頁面的運營位采用通用 banner 的形式，不同功能的營銷都集中在同一位置進行分發，這樣容易造成部分重要營銷內容展示時間過短，用戶在一級頁面無法快速看到重要營銷內容造成點擊率很低，影響首屏列表流量轉化。

改版后，將影視運營位插到首頁列表之中，提高了重點營銷內容的流量轉化。針對影視資源的內容形態，我們設計出“破形運營位”的概念，在重點營銷的影視內容中，根據業務方給到的物料進行二次加工，突出影視資源主體人物，建立頁面視覺錨點，提升營銷場景流量轉化。

問題四：內容卡片多，重點信息不突出，增加用戶閱讀成本

解決方案：容器重構-內容卡片結構化

在之前的版本中，內容卡片作為首頁關鍵內容，承擔著流量分發，房間付費轉化等重要功能。除了在首頁之外，在熱映頁面、搜素頁面、派對頁面都有大小不同的內容卡片。如何把不同場景的卡片進行規范化設計，看起來更加優雅統一，成為 5.0 版本我們所優化的問題。

因此，在 5.0 版本的設計過程中我們對于這一問題給到的解法是將不同大小的內容卡片進行結構化，采用 16:10 的比例，對于上下間距進行統一，根據用戶的閱讀順序，我們將視覺重心放在頁面左下角方便用戶閱讀，右上角放運營類信息，通過結構化的內容擺放，使信息更加具有秩序感。

問題五：分發效率低，用戶進行一起看的鏈路復雜

解決方案：效率提升-一起看功能同場景分發

在之前對于用戶分層的基礎上，我們對于用戶在核心場景一起看的行為進行分析，我們發現：

用戶活躍后的功能滲透率偏低，即使是核心的一起看老用戶，在活躍后也僅有不到 50%的用戶會進入一起看的廳/房間；在用戶活躍后的進房引導做的不夠深入。
中立用戶對一起看功能同樣十分感興趣，進入一起看的次數很高。但途徑比較單一。

因此，我們在設計的過程中增加了新的一起看場景，在 5.0 版本中我們增加了非常多優質的影視資源，那么在影視資源的頁面中，除了介紹影片本身之外，增加了每個影視資源的一起看，使用戶能夠更加便捷的看到相關的影視內容。

問題六：分發效率低，核心內容轉化觸點少

解決方案：效率提升-強化決策牽引，提升用戶轉化

所有的信息都是為了內容的轉化。因此，我們在設計的過程中排查了各個關鍵的節點來看哪些節點可以做房間內的轉化。在排查的過程中我們發現：無論新老用戶在搜索位置搜索影片的頻率都很高，于是我們開始探究如何運用搜索位置來進行用戶轉化。

我們給到的解決方案是：運用搜索頁面的空白區域，新增內容推薦位，通過排行榜的形式給用戶推薦，幫助用戶做出選擇。強化決策牽引，幫助用戶在不知道看什么的時候給出決策意見，提升用戶進入房間的轉化。

5.0 主要頁面展示

2. 強化品牌記憶

隨著微光用戶群體及功能內容的變化，舊版 LOGO 的視覺風格和氛圍無法滿足年輕化用戶訴求，需要打造更加積極、具有陪伴感的形象。

因此，在品牌設計上，我們從品牌基因和品牌符號兩方面進行出發，在品牌基因部分主要介紹了從 0-1 探索微光新 LOGO 的過程，在品牌符號部分，我們根據新的 LOGO，提煉出超級符號來適應更多的使用場景。

①品牌基因-遇見溫暖的陪伴

根據之前品牌的訴求和產品的愿景，我們在 5.0 版本提出全新的 slogan——遇見溫暖的陪伴。希望用戶在使用產品的時候能夠感受到溫暖與陪伴。

因此，在品牌基因探索的過程中，我們也以起點來進行分析——**什么是溫暖的陪伴？**我們分析了與溫暖、陪伴相關的場景，來提取我們的主題色和品牌元素。

②品牌基因-微光的“光”

微光在產品成立之初就突出體現光的元素，光代表著溫暖、陪伴、生命力。而這樣的情緒價值也是我們 5.0 版本想傳遞給用戶的概念。因此，在品牌基因的探索過程中，我們以自然界的光為主體，進行演變延伸出品牌元素。

③品牌基因- 整合與提煉

根據上訴的品牌基因探索，我們從品牌 slogan、自然元素的映射、Z 時代用戶的三個層面提煉出品牌的光元素、品牌輔助顏色、品牌關鍵詞。

同時，在 5.0 的版本上我們依舊延續品牌的 IP 形象——小微和小光。我們給小微與小光不同的色彩（小微為紫色，小光為粉色），來進行差異化設計。突出男女在同一場景下相互陪伴的氛圍。同時在logo樣式上采用更加可愛具有親和力的對角線形態，提升對于年輕用戶的吸引力。

④品牌 LOGO- 設計規范

在我們 logo 設計完成后，我們對 logo 進行了標志基礎規范的制定，在標志基礎規范里面六部分內容，分別是標準化制圖、標志標準組合方式、標志常用組合方式、標志安全區、標志特殊應用墨稿、反白稿、標志最小應用等內容

⑤品牌符號- 利用小微小光建立品牌容器

當 logo 的形象確定后，我們利用小微小光碰撞的形態建立品牌符號，來幫助品牌應用性更廣，在平面海報或 banner 的設計中，我們運用更具親和力的人物照片及貼紙來幫助整體年輕化氛圍感的塑造。

⑥品牌符號- 貼紙元素的應用

在本次改版的視覺語言搭建的過程中，貼紙作為十分重要的一部分承載著 5.0 版本的情緒傳達，我們把年輕用戶對于社交場景的期待通過貼紙形式進行表現。同時作為品牌化搭建的重要環節貼紙在視覺化的界面、情感化彈窗、營銷活動 H5、banner 都能作為很好的設計語言表現微光 5.0 的產品氣質。

五、設計結果

在微光 5.0 上線之后，我們跟進了上述問題點，從數據維度來看，不管是新增功能還是優化項數據都得到了較為明顯的提升。整體留存和新增用戶也有較為明顯的提升，下圖為具體數據：

六、總結

微光 5.0 版本的全新升級，標志著微光從社交協同類產品往社交影音類產品跨越的關鍵一步，很高興自己能在這次大改版中完成體驗及品牌設計從 0-1 的升級。

體驗設計作為距離用戶最近的一方，在“以用戶為中心”的原則下，我們嘗試達到業務與用戶訴求、用戶訴求與設計美感之間的平衡。我們希望“遇見美好的陪伴”不僅僅只是一句口號，更是每一個使用產品的用戶能夠把這樣的愿景帶到日常生活當中，獲得溫暖和快樂。