起點課堂會員權益
職業體系課特權
線下行業大會特權
個人IP打造特權
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導直播
12場專業技能直播
會員專屬社群
榮耀標識品牌設計探索：讓品牌融于應用之中
本篇文章主要是回顧DOV品牌設計，主要分為提案前準備、圖像系統設計、界面控件優化、動效主題鋪陳、運營規范制定等五個環節。enjoy~
項目概述
2017年短視頻產品爆發，有別于一般短視頻產品，DOV主要講求透過短視頻記錄生活，并且將短視頻分享給熟人關系鏈好友，透過短視頻本身作為媒介達到社交的目的。目標族群明確的定位在于高中以上的年輕族群。設計的任務除了基礎的體驗之外，更應該將分享生活的輕松感以及時下年輕人的生活態度結合至產品之中，藉由視覺的手法提升用戶的記憶與認同。
本次DOV的品牌設計在基礎UI已具備的條件下，上線前兩周經過討論，以QQ family中人氣最高的多福熊作為吉祥物，品牌LOGO也沿用了多福的形象，為了有更全面的品牌感受，本次DOV品牌的設計包含了LOGO、吉祥物、圖形系統、動效系統、常規運營規范等等。
回顧DOV品牌設計，主要可分為提案前準備、圖像系統設計、界面控件優化、動效主題鋪陳、運營規范制定等五個環節。
一、提案前準備
以兩周含開發還原的時間來說，完成全部五個步驟不切實際，故上線前必須至少完成圖像系統設計以及界面控件設計的層次以確保用戶體驗的完整。在時間有限的情況之下，提案前準備至關重要，好的準備可以避免走彎路，也可以將時間精準的投入在創意之中。
首先提案前準備階段是關鍵頁面的選擇，以及明確設計方向。
1.1 提案關鍵頁面選擇
提案關鍵頁面的抉擇有幾個要點：
（1）高效率
若要提高效率則不能在任何地方浪費設計資源（人力、時間），品牌風格提案建議在3幀畫面以內，免去不必要的工作量，除此之外，三幀畫面也是移動端設計在PPT上展示最理想應用空間的幀數。
（2）高檢視
必須確保方案的呈現上可以概覽日后延展的各種可能，以品牌方案階段為例，必須兼顧圖像與UI的協調、大面積展示時的效果、以及最小限度展示時是否還能延續品牌的感受。
在DOV提案中，設計選擇了具有最大面積展空間的Login場景，保證最好的視覺效果可以被檢視，其次選擇資料卡，驗證圖像與UI面積各50%時的協調性，最后選擇消息列表，確認即使幾乎沒有圖像輔助是否還能延續品牌感受。
1.2 明確設計目標
設計的內容必須為目標服務，DOV的slogan為無樂不作，目標族群為18-25歲一線城市年輕人，故視覺風格一方面朝向年輕人群中較頂端的潮流族群為主，另一方面則向大眾流行的風格作嘗試。
設計團隊此次刻意簡化方向，不做太多的關鍵字發散想象，原因在于雖然關鍵字發散想象雖然有幫助于設計師勾勒大致感覺，但沒有被收斂或是沒有被二次形容、亦或者沒有被類比為圖像的關鍵詞基本上無法形成共識，過長的發想時間也不符合互聯網公司的敏捷特質。敏捷和明確是DOV品牌設計的前提。
二、圖像系統確定
完成了設計前準備，后面則是圖像系統確定的階段，此階段分別是風格發散以及設計細節的挖掘。
2.1 風格的發散
多人提案的過程中如果沒有明確的共識往往會難以發揮，單純的定義方向往往會造成設計師們重復設計路線或者命題太廣導致難以下手的問題，所以本次DOV團隊采用容器+內容的設計發散方式。所謂容器，即是指常用的基本視覺原理、設計技巧等等歸納出可能的設計方式。
視覺原理與經典的設計手法能比較直接地引起用戶視覺心理上的主觀反應，具有強且純粹的視覺沖擊力。所謂內容，則是屬于可以象征DOV目標人群的符號，這些符號往往透過符號學中的定錨效應讓用戶有更深層次的認同感。
除此之外，此次提案也使用極度繁復的原則。在眾多社交產品中，過度干凈純粹的設計在當下各種日益娛樂化手營造視覺氛圍的競品app中已經難以取得優勢，且一些朝向年輕化或是潮流化的時尚品牌或者藝術家近年來也大量的使用極繁的手法來影響設計的走向，這是一個趨勢。
透過容器+內容的設計方式，可以簡單的提煉出可能的手法。如下：
經由這些設計方式的組合，順應設計的目標，依照大眾化的口味以及潮流的風格分別有以下五組方案。
方案A：利用簡單的等比級數分割畫面，在畫面切割的模組內填入潮流中常用的斜紋、X等符號，形成穩定肌理之后再與DOV熊作形態上大小的對比，營造精致且沖擊力飽滿的畫面。
方案B：透過反覆的方式在畫面背景中鋪陳穩定的節奏營造熱鬧的社交氛圍，另外透過前方特寫的多福形成強烈對比，制造出強烈的視覺沖擊感吸引用戶目光。
方案C：同方案B利用對比的手法塑造視覺沖擊感受，同時簡化了DOV的形象并帶入了類似潮流公仔翻玩造型內材質的手法，兼顧了品牌符號的印象也帶入潮流氛圍。
方案D：利用具有涂鴉手感的字體設計手法填滿背景，透過字體形塑潮酷的氛圍，背景前景以資訊量多寡、面積差異等方面做對比處理，形成有態度且豐富的畫面感。
方案E：將潮流中常用的X符號與多福熊做組合，安排在等比級數分割的框架之中形成韻律之美，同時部分元素加上了潮流常用的流光材質，讓DOV的意象完全與潮流形象貼合。
最后方案整體全覽如下，在跨度上包含了潮流與大眾流行，透過攔訪驗證，左起2、4、5方案也受到了用戶明確好評，反饋，但基于4、5的用戶好惡較極端，故最終選了方案2作為DOV的主視覺。
2.2 設計細節挖掘
整體品牌風格定案后，選擇用戶在體驗過程中最高頻的下拉上滑場景以及必經的登錄流程中植入彩蛋，在上線前以有限的精力內用最小的設計投入換得最多的精致感以及情感傳遞。
三、界面調性重塑
大面積的圖像氛圍以及體驗路徑上必經的關鍵點品牌化之后，界面本身的品牌調性也必須跟進，讓靜態的平面上達到圖像與界面最大的契合，此次DOV分別在界面的造型以及界面的效果做調整。
3.1 造型統一
造型上統整了所有界面的輪廓，以大圓角呼應了圖像系統親和的特質。
3.2 效果統一
效果上一致采取了具有Y軸偏移的投影，透過營造漂浮層次過程中減少過硬的線段分隔，達到親和的特質。
四、動畫主題鋪陳
除了圖像元素以及控件元素外，由于動畫可以透過結合品牌印記、動效曲線、情節設計等部分，形成令人有記憶點并且愉悅的效果，所以在品牌化的過程中是為畫龍點睛的環節。
4.1 動效曲線
UI操作的場景之下，DOV利用了特別的動效曲線，將減速度的時間延后，加上適當的位移塑造動效快速到位且有慣性回彈的果動感效果，讓整體的氛圍高效率與高趣味性共存。
4.2 品牌印記
一般動效主題大多止于動效曲線，而DOV則除了共同的動效曲線外，融入了品牌吉祥物以及更生動活潑的擠壓型變，讓動效的記憶點更加鮮明。
4.3 情節設計
除了令人有記憶點的動效曲線以及融入品牌識別的形變，動效本身因為具有時間軸的特性，在適當的場合中可適度加入簡單的動作情節，讓APP的氛圍更輕松有趣。（備注：DOV1.2.1版本后已無消息列表下拉刷新）
五、運營規則制定
APP本身具有完整的視覺品牌調性之后，對外的一切宣傳與運營也需要讓用戶有固定的認知，透過制定通用的運營專用字體、以及通用的輔助圖形，明確定義可發揮區域，讓DOV運營設計品質事半功倍，且每次活動都可以加深用戶對DOV的印象。
5.1 DOV運營字體
DOV運用“造字工房素白“字體，取其圓潤且適合用于標題的特性大幅減少每次運營情況都需要重新寫標準字的困擾，另外邊緣加上立體畫的手法，讓DOV運營字體體量更充足，更有沖擊力。
5.2 DOV運營圖形
DOV運營場景擁有專屬的monogram pattren，除了可以讓背景豐富以外，每個單元都可以依照運營的需要替換，由此去保證共同的設計手法。
六、設計總結
品牌化設計在過去往往發力于Logo、吉祥物、以及部分線下場景的組合運用，這類組合體現品牌傳播效果上稍嫌不足，但若能全盤鋪陳線上落地的場景，嚴格把控設計方向，不僅可以設計在多人協作的情況下輕松的把控一致調性，更可以讓軟件本身以及運營項目持續的強化用戶記憶與設計的效率。
DOV上線后經歷了兩次大改版以及精簡視覺設計師的投入下仍保持同樣的氣質以及配合產品高效的產出，證明了方法的可行也保證了后續設計體驗的一致。讓用戶從應用中各個場景體驗到品牌精神，可能將會是品牌化設計的重要趨勢。
作者：六林，公眾號：騰訊ISUX
來源：https://mp.weixin.qq.com/s/mG3eVQlYS-RjShAHgjqifg
題圖來自Unsplash，基于CC0協議
- 目前還沒評論，等你發揮！
