電競比賽包裝中的動效設計-使命召喚聯賽CDL

如果把遊戲本體看作是一個包裹，那麼遊戲介面設計可以看做包裹內的其中一部分內容。當包裹內的內容被玩家使用、把玩時，甚至是參加電競時，玩家所處的氛圍與遊戲本體應該有哪些關聯？

我想電競的視覺包裝將是解答這個問題的好答案，今天就來看下電競裡的視覺包裝都是如何設計動效的吧。

《使命召喚》的職業比賽叫“Call of Duty League”，簡稱為“CDL”，本文出現的相關內容都來自“Call of Duty League 2021”賽季。

LOGO圖形貫穿

該比賽畫面中出現的一些動態圖形變化，很多都和比賽的logo形態進行了結合。所以我們應該先看下其logo設計，看它是如何將自己的型體設計融入到比賽畫面的相關動態設計裡的。


如上圖，這個logo很有意思：主體圖形上並沒有任何直接體現COD遊戲本身的元素，而是用三個佈局成放射狀的塊面組成。

按照官方的解釋，這幾個圖形代表的是三個階梯。直觀上看，logo裡的階梯圖形顯然並不是正面視角的階梯，而是一種帶有透視，具備一定視角的。這個圖形顯然想要傳達一種從地面仰視階梯的感受。

從下圖的logo動態入場動畫也能看出，這個圖形是以特定角度觀察3D形態的階梯，並抽離了輪廓形成的：


官方解釋了這三個階梯從上到下分別代表的意義，即不同階段的遊戲玩家：

“標誌的頂端代表來自世界各地的職業球員，他們在城市團隊中爭奪使命召喚聯賽冠軍。職業球員是聯盟的命脈，體現了最偉大的技能、策略和競爭優勢。

第二層代表聯盟的業餘系統，在那裡尋求“成為職業”的有抱負的玩家可以競爭專用的獎池。業餘系統將類似於專業系統的遊戲玩法，並將全年提供線上和 LAN（區域網）公開組賽事。

第三層代表了使命召喚聯盟粉絲社群，他們對遊戲的難以置信的熱情以及以動態方式聯絡和競爭的願望使使命召喚聯盟的體驗真正獨一無二。”

這是一個很特別的角度，說明官方將遊玩遊戲的群體作為主體設計進了代表官方電競的“圖騰“之中，可謂用心良苦。

這個圖形的動態效果因而被用於比賽畫面的各個重要節點上，比如開賽前的開屏畫面：


又如在重要資訊畫面間切換時：


或者某些畫面退場時：


在一些畫面的切換之間，也不可或缺：


整體上，這個logo的動態圖形被貫穿在整個比賽畫面中。起到一種串聯作用。也是針對受眾進行品牌灌輸的一種手段。

壞訊號效果

從logo相關的這些動態效果裡，相信你已經察覺到大量的壞訊號效果的應用。

這種效果主要包含對原本圖形的破壞，閃切、彩虹偏移等效果來形成。是這個電競視覺包裝中的主軸動態語言。

如下幾圖所示的幾種不同的切換效果：





可見這種效果也基本上是開頭所見的logo動態圖形中出現過的。可理解是一種動態視覺語言的統一和延伸。

平面設計特點

CDL視訊中出現的相關包裝設計，都相對延續了遊戲本體中介面的設計風格，即都蘊含一些寫實軍事，科技感和扁平化設計語言。其字型設計也保持著COD系列的氣質：無襯線體，粗黑大字型，橫窄豎寬，輪廓銳利等。

但與遊戲本體不同的是，電競還要凸顯一種時尚的，競技的氛圍。所以CDL的視覺特徵中其實剝離了很多遊戲本體中偏“軍事化”的元素，僅保留乾淨利索，顏色乾淨的設計特點，形成了CDL自有的一種設計風格。

簡單來說，這種設計風格有三個特點：

首先是暗色條欄。這種條欄用於各種框體的襯底。不帶色相的顏色特徵，使它能適配畫面上任何一種其他顏色的元素。


其次是硬邊輪廓，這種設計特點讓整個設計風格更加硬朗。在這種輪廓設計的基礎上，沒有材質的圖形設計，更顯簡約時尚。


最後是戰隊的顏色設計，CDL為每個戰隊都設計了特有的顏色，搭配圖形設計本身的暗色無色相設計，讓戰隊元素對比非常鮮明。在快節奏的比賽過程中，觀眾更容易聚焦到所關注的戰隊相關資訊上。

以下這些圖片，都綜合性的體現了這種平面設計的三個特點：



可以看到，對色彩使用都已經收斂到僅有暗色底的情況下，在介紹戰隊時，所出現的戰隊所在城市圖片都是黑白色，除了更凸顯後邊出現的戰隊成員照片外，還透露出更酷炫的氣質。

總結

CDL整體的視覺包裝非常恰當的表達了COD這款遊戲的氣質。在其中的動態設計上有著非常具有個性化且穩定的設計。

穩定性靠的是延續自logo設計中的圖形特點與動態特點。

個性化靠的是它有風格的平面設計和動態設計。

如果你也關注電競，並好奇其他遊戲的官方電競都有哪些包裝設計，這些設計裡都是如何進行動效設計的，就請關注本系列的下一篇文章。

以上。


來源：COTA五號
原文：https://mp.weixin.qq.com/s/aUCU03WZqfiSkkZ8GhkH4A