得益于游戲產業蓬勃發展,社會對游戲的接受度不斷提高,中國電競同樣也迎來井噴。據統計,中國有領跑全球的6億玩家規模,其中超過4.3億手游玩家都在不同程度上參與或關注電競賽事。但像王者KPL 這樣極其強調競技水平的精英賽事,只有極少數頂部玩家能參與其中,就算是王者榮耀的高校聯賽,也僅僅是覆蓋了高校群體。普通玩家在整個電競鏈條中,多數條件下只能觀看賽事,無法參與到實際的競技當中。到底有沒有更加社交化的賽事,能讓更多的用戶親身參與其中,從競技層面上去享受游戲,而不僅僅只當吃瓜群眾呢?
我們從社交化的角度出發,由 QQ空間聯合騰訊微視策劃了一項旨在真正做到全民參與的親民版電競賽事——騰訊微視星聯賽。星聯賽希望在以下三方面打造「最社交」的電競賽事:
覆蓋廣:與星聯賽聯動的《王者榮耀》、《絕地求生·刺激戰場》、《絕地求生·全軍出擊》以及《QQ飛車》四款移動端游戲,作為騰訊旗下關注度極高的手游,自身已具備非常好的玩家覆蓋面和游戲黏性,配合QQ空間的社交屬性,兩者強強聯合,起到1+1>2的效果,帶來更多活躍和內容。
影響大:每個用戶可以拉幾個好友一起組隊,通過以一帶多這種方式,發揮社交平臺的優勢,力求轉化更多的潛在用戶。同時,星聯賽在每款游戲中進行推廣,加上合作團隊虎牙平臺主播資源的助力,擴大賽事的輻射范圍。
門檻低:組隊幾乎無任何門檻,只需通過 QQ 拉夠好友加入隊伍就可以。賽制規則相對寬松,如2個隊友以上進行的匹配、排位模式即可計算積分,并不要求你必須有太強的實力,也能享受游戲快樂。同時,因考慮到這四款游戲的用戶畫像有一定差異,我們提供每款游戲可以跟不同好友參賽的能力。
一、Logo設計
在設計賽事 logo 時,既要融入品牌元素,又要反映游戲賽事的競技性、娛樂性。從品牌特性與游戲特性中提煉出共通的視覺符號,再將視覺符號融合到整個 VI、UI系統之中,通過多種渠道的實際應用,不斷強化受眾對此符號的感受與印象,從而進一步擴展賽事活動的知名度及影響力,有效提升品牌曝光及美譽度。
一個成功的 logo 需要有其獨特的品牌個性與視覺特征,在此我們采用圖形、字體、色彩三位一體的設計方法,選取最有代表性的視覺符號作為圖形與字體的通用元素,通過統一的色彩搭配與材質渲染,保證其整體視覺的一致性。
項目初期我們以代表空間品牌的核心圖形——星星作為出發點開始構思,從星星形狀中逐步提煉出等邊三角形、V形等基礎元素,這些簡潔的元素可適配多樣的組合方式,形成可關聯的視覺符號貫穿到整體的設計之中。
V 可視作 Victory 的縮寫,象征電競玩家角逐勝利的雄心壯志。我們運用5個 v 互相穿插,組成與空間 logo 外輪廓相仿的星形圖案作為整個 logo 的 C位圖形。
字體設計中,選用矩形造字法,厚重的筆畫使字形看上去更加沉穩有力。最下方用一個波狀線條連接「星聯賽」三個漢字下三宮的筆畫,這個筆畫看上去像是心電圖的電波紋樣,正好契合電競賽事緊張刺激的活動特性。
logo 整體以正六邊形作為穩定的外圍框架,由一正一倒兩個三角區域疊加構成。其中星形圖案、賽事名稱貼合正三角區域自上而下依次排開,而背景的「V」狀圖形與贊助商標簽則順著倒三角區域的走勢布局,圖形和字體上檐兩側均有一小截45°尖角飛出,保持圖文風格一致的同時讓 logo 顯得更尖銳挺拔。
最終應用于 UI界面的是3D化的 logo,考慮到與比賽的四款游戲調性相配,選用了百搭的玫瑰金作為 logo 主體材質,因為四款游戲UI 中均有融入很多金屬元素;這種材質也方便適配不同贊助商的品牌色。
1. 主KV設計
主KV 設計最大的挑戰是如何將四款游戲的元素融合到同一氛圍里,主KV 的風格需要與 logo 有所呼應,同時它也將奠定 UI界面的視覺基調。盡管主KV 所能呈現的是一個固定的空間,我們依然希望用戶看到時能瞬間聯想到豐富的故事性場景,為此我們設計了三個方向的概念稿:一是插滿各種游戲道具的武器星球;二是結合「鐵王座」的梗,設計一個游戲道具打造的至尊王座;三是由游戲中的元素共同組成的勝利之門。最終選擇了和 logo 外形更加適配的倒三角形「勝利之門」這一方案作進一步細化。
白模階段,同樣運用了打散重組的方式,將四項游戲的元素自然地集結到主體模型中;王者榮耀標志性水晶塔之一的立方體組成整個倒三角頭部,「兩肩」的劍與翅膀是游戲內角色武器及部件;倒三角兩側上半部分為 QQ飛車中熱門的賽車模型,下半部分則是出自絕地求生與刺激戰場的各種槍械。在勝利之門的左右兩側,設計了兩個充滿未來感的「焊槍」,「焊槍」主體由 QQ飛車的賽車零件改造而來。
最終渲染營造出一種未來魔幻感的賽博朋克風格,茫茫宇宙中,若然浮現一扇巨大吱嘎作響的金屬門,門中心熠熠發光的 V 字引領著競技者們走向勝利之路。我們希望通過這種三維虛擬的表現形式第一時間抓住用戶眼球,增強畫面對用戶的感染力。
二、界面設計
1. 組件
組件可以說是界面的點睛之處,也是品牌 DNA 比較直觀的體現,有助于品牌的識別和認知。本屆星聯賽參賽游戲有四款,所拉取的數據各不相同,邏輯復雜,導致頁面多、展示內容多、結構復雜,在設計過程中遇到不少的問題,我們對其反復打磨,不斷優化。
頁面頭部
首頁是對四款游戲相關數據的集合展示,同時激發用戶報名,所以首頁的頭部對所傳達的內容要精準、有吸引力、有記憶點。在這里我們直接將主KV 稍加調整用于頭部主視覺,強調品牌的同時,又精準的表達活動內容。
游戲詳情頁是對具體一款游戲相關數據的展示,頭部運用等邊三角形元素對 logo 加以修飾,結合本款游戲的 CG原畫,增強頁面的游戲感和競技感。
戰隊詳情頁主要展示本戰隊的排名、戰績、參賽場次等數據,主要以內容展示為主,頭部與游戲詳情頁保持一致,增大戰隊名稱和戰隊數據的展示面積,增強用戶參與感,烘托戰隊競賽氛圍。
圖標
本屆星聯賽包含的四款游戲:《王者榮耀》、《絕地求生-刺激戰場》、《絕地求生-全軍出擊》以及《QQ飛車》,可總體分為三種類型,在icon的設計中體現出每款游戲特點的同時還要與星聯賽整體的視覺調性保持一致,首先提取四款游戲具有代表性的元素,分別來代表:報名玩家、參賽戰隊、對戰場次。
王者榮耀提取元素:戰盔、盾牌、劍。
兩款吃雞游戲提取元素:三級頭盔、徽章、平底鍋。
QQ飛車提取元素:賽車頭盔、方向盤、旗子。
圖形以三角形為基礎,添加質感,折角由45°角相切而成,三角邊框協調圖標之間的平衡感,確保圖標體量感統一。
星聯賽分為兩大賽區,東部賽區、西部賽區,設計元素選取東、西英文首字母「E」「W」加入45°斜角,結合東部賽區、西部賽區字樣,因東西部為對抗關系,顏色選用主流電競賽事采用的紅藍色,圖標主要用于戰隊分區展示。
邊框
星聯賽活動中有大量的圖片展示,比如每款游戲的輪播圖、賽事和戰隊精彩視頻、積分商城獎品展示、浮層等等。這些都是很好體現品牌感的位置,也是界面細節的體現。拿首頁游戲輪播圖為例,我們以 logo設計中所提取圖形元素為基礎,運用2D模擬3D效果的手段,搭配玫瑰金色,雕琢細節,強化質感,并貫穿到全部的邊框設計中。
按鈕
星聯賽活動邏輯相對復雜,所用按鈕之處比較多,在所有頁面中報名頁面流程最多,所需按鈕狀態多樣,設計過程中將不同狀態按鈕創建成獨立組件,可以快速調用到所需的頁面中,便于調整。
2. 活動頁面
星聯賽界面的整體視覺設計緊跟主 logo 和主KV 的設計風格,保持一致的設計調性,提升品質感,打造星聯賽品牌識別性,加深品牌印象。
在界面設計中,我們利用星聯賽logo 和 KV設計中所提煉的圖形元素、色彩搭配,對風格、類型完全不同的《王者榮耀》、《絕地求生-刺激戰場》、《絕地求生-全軍出擊》、《QQ飛車》四款游戲進行統一,保留游戲各自特色的同時,在整體界面里符合星聯賽視覺調性,以達到求同存異的效果。
星聯賽整體界面,以2D的表現方式為主,在一些控件、邊框以及烘托頁面氛圍修飾圖形等,運用2D的設計手段模擬3D效果,在提高設計速度和降低設計的成本的同時,達到精致細膩的視覺效果,與 logo 和主KV 的造型、色彩、質感、細節保持一致,字體與 logo 都有尖角飛出,整體調性契合,再稍加質感,增加界面細節。
三、活動延展
目前騰訊微視星聯賽已于7月30日開啟,除了線上運營部分,線下亦舉辦了貼近受眾的嘉年華活動。
騰訊微視星聯賽項目通過在設計中自然的品牌植入與線上線下雙渠道的活動曝光,在賽事、選手和玩家之間形成了良性發展的生態圈,進一步增強了用戶黏性,有效提升了商業伙伴及目標用戶群體心中的品牌高度。在后續或許會繼續舉辦星聯賽的第二屆、第三屆賽事,如何在延續品牌主視覺的基礎上進一步優化視覺表現、推進創意革新?在未來的設計中,我們會帶著這些疑問進行持續性的探索。線下我們亦將舉辦更多活動,大家敬請期待。
「延續品牌基因的視覺案例」
復制本文鏈接 文章為作者獨立觀點不代表優設網立場,未經允許不得轉載。
發評論!每天贏獎品
點擊 登錄 后,在評論區留言,系統會隨機派送獎品
2012年成立至今,是國內備受歡迎的設計師平臺,提供獎品贊助 聯系我們
AI輔助海報設計101例
已累計誕生 737 位幸運星
發表評論 為下方 7 條評論點贊,解鎖好運彩蛋
↓ 下方為您推薦了一些精彩有趣的文章熱評 ↓