網(wǎng)易出品的《王牌競速》游戲上線有一段時間啦，在骨頭老師為期一周的深度體驗之后～讓我們通過網(wǎng)易的《王牌競速》這款游戲，探究一下主機類競速類游戲的美術(shù)風格是如何設(shè)計的，同時也聊聊競速游戲里的鏡頭語言如何運用。

01??美術(shù)風格

主機競速UI風格

在主機競速游戲中，扁平/擬物/毛玻璃可以說是非常常見的搭配。

?扁平+擬物?

界面方面由于重視整體游戲的沉浸感，導致在UI表現(xiàn)上運用了用輕UI，重內(nèi)容的表現(xiàn)方式。

在游戲主UI里，為了不影響開車時的視野，UI設(shè)計上也是非常的輕量。這樣可以確保較少的干擾，同時給賽車特效更多的表現(xiàn)空間。

?毛玻璃效果?

在不同的光線環(huán)境和物品重疊下，其所代表的「背景模糊」效果不同于一般的漸變，色彩結(jié)合更加柔和，能夠和畫面中銳化過的部分產(chǎn)生鮮明的對比。

背景模糊仍然在面板樣式層面扮演了重要的角色，不過進一步被改進成了「亞克力材料」（Acrylic Material）風格，通過對亞力克板的仿真來構(gòu)建視覺層級。

背景增加了景深效果，視覺上往后退。

面板細節(jié)上充分利用了每個模塊，當作海報來設(shè)計。

競速游戲主UI對比

在《王牌競速》之前就出過《極品飛車》系列游戲和《狂野飆車》系列游戲，騰訊的《QQ飛車》也是至今很受歡迎的手游之一。

所以對于《王牌競速》的考驗就是如何在競速游戲之中做出差異化。

骨頭老師的一番體驗之下，發(fā)現(xiàn)《王牌競速》玩法上相對來說比寫實類競速游戲更休閑，所以在游戲美術(shù)上的表現(xiàn)上沒有《QQ飛車》這么卡通，更接近《極品飛車》的寫實風格。

《王牌競速》相比《極品飛車》在主UI的表現(xiàn)上背景足夠有空間感，右側(cè)的運營活動BANNER也足夠突出。

默認車頭的朝向指向了“前往速度節(jié)”，游戲內(nèi)的核心玩法都放在了這里。

02??品牌化視覺包裝

主機競速UI風格

《王牌競速》游戲的關(guān)鍵詞是“競速”，然而速度這個字非常抽象，咱們可以在游戲中看到很多類似這樣的流光速度線來做貫穿整個游戲美術(shù)包裝的SEED。

視覺SEED反復出現(xiàn)不僅可以提示玩家在同一個游戲，也可以增強代入感。

同時也將流光這個元素運用到了各個部分，賽季預告浮層。

升級和獲得物品的彈出浮層

以及進行中的狀態(tài)都有結(jié)合動效來表現(xiàn)

《王牌競速》整體的視覺包裝是以“王牌速度節(jié)”來做的整體包裝，所以在整體氣氛的表現(xiàn)上運用了很多熒光玫紅色和藍紫色作為搭配表現(xiàn)UI。

熒光涂鴉元素和在車上坐著的姿勢也致敬了LOL的 KDA女團《POPSTARS》里的設(shè)定。

主機競速UI風格

講真，《王牌競速》的這種視覺化較強的風格其實不太好做，控制不好的話很容易給人“殺馬特”之感。

因此《王牌競速》除了視覺SEED反復出現(xiàn)提醒玩家是在同一個游戲里外，對飽和度，冷暖炫光，文字排版，光影構(gòu)成也做了一定程度的統(tǒng)一，導致了完全不同的畫面色調(diào)下又是在一整個大的界面系統(tǒng)里。

在各種擬物化以及宣傳類的界面中，運用了3D渲染制作以及后期合成的手法。

對車輛場景，物件道具表現(xiàn)，進行了大量電影海報級別的合成制作。

王牌競速對每期活動道具以及車輛，都會針對其進行對應主題進行色彩和元素設(shè)計。

在整體飽和度和其他界面保證統(tǒng)一的大前提下，色調(diào)和光影會根據(jù)主題設(shè)計，讓玩家不會沉浸在長期的藍紫色畫面中感到視覺疲勞。

幸運盲盒機結(jié)合了現(xiàn)實生活中大家購買盲盒的體驗。

在這里抽的盲盒是可以選擇自己選定的盲盒，也可以隨機打開，在視覺表現(xiàn)的同時也充分考慮到了玩家的體驗。

03??品牌化視覺包裝

?鏡頭景別?

在游戲中運用了不同的景別來表現(xiàn)需要強調(diào)的游戲畫面，多用于重要的游戲進程和游戲界面。

從進入游戲開始，建立玩家對游戲的信任感，好的鏡頭語言設(shè)計也非常重要。

在這里給大家科普一下電影和電視的景別，根據(jù)景距、視角的不同，一般分為：特寫、近景、中景、全景、大全景、遠景、極遠景等。

這鏡頭就是從特寫到中景到小全景到大全景到遠景的一個“拉”鏡頭。

?變焦鏡頭?

剛進入游戲時采用了變焦拍攝，人物處在小全景的位置，同時鏡頭給了劃入的車手證一個特寫。

變焦拍攝：攝影、攝像機不動，通過鏡頭焦距的變化，使遠方的人或物清晰可見，或使近景從清晰到虛化。

321倒數(shù)特效動畫這里展現(xiàn)了賽車由近景切換為特寫，在點擊了“開始游戲”了之后，鏡頭出現(xiàn)了一個由“推”鏡頭至“拉”鏡頭的鏡頭運動，表現(xiàn)了賽車在剛發(fā)動引擎時的速度感。

?子彈時間?

子彈時間的視覺表現(xiàn)用在即將沖到終點的高光時刻，會給玩家更強的勝利感。

04??有效的動效設(shè)計

動效設(shè)計并不是可有可無的視覺修飾，也不是設(shè)計師炫技的手段，而是解決問題，提升體驗的有效工具，其存在明確的目的性。

闡述：更好的告知界面發(fā)生的變化

當界面中對象狀態(tài)需要發(fā)生變化時，可以用動效展示變化的過程，讓用戶更清楚的感知，闡述層級關(guān)系和界面變化。

提升：趣味性的內(nèi)容緩解用戶焦慮

例如加載動畫，可以有效降低用戶對時間的感知，對于用戶，他們關(guān)注的是感受到的速度，而不是應用實際消耗的速度。

把一些無效和枯燥的時間進行趣味性的調(diào)整，可以有效減少玩家在這個過程中流失。

在這里配合加載其他玩家和游戲內(nèi)容，界面背景的涂鴉會有高亮動效。

加載界面多多少少總會有點無聊，不同的賽車地圖用不同的畫面，可以吸引一部分玩家的注意力，同時用進度條來給大家做提示可以緩解焦慮。

（如果匹配成功這個小動畫能更好地利用就更好了～）

在執(zhí)照答題界面，這里選取的是人物的中景，執(zhí)照試卷如果回答正確會自動切換下一張。

及時反饋：讓用戶更有掌控感

當用戶執(zhí)行了某一操作后，動效是一個非常好用的反饋機制。

點擊了氮氣加速按鈕之后，玩家會得到一個動效反饋，同時加速后會飛到速度條處，及時反饋到了玩家速度提升到了多少，更好地輔助玩家提前預判下一個操作。

和玩家的綜合排名部分會顯示的速度比較快，節(jié)約時間迅速讓玩家進入下一賽程。

吸引：有效吸引用戶注意力，營造視覺焦點

當你想讓用戶關(guān)注某一個區(qū)域，或執(zhí)行某一個操作時，可以通過動效吸引他們的注意力，有效傳達信息。

兌換商店這里，為了表現(xiàn)神劍號的速度感，快到已經(jīng)沖出了畫面。

在“喜提新車”這里的動效表現(xiàn)做的比較突出盒子打開的一瞬間，加強了玩家獲得新車的滿足感。

總? 結(jié)

作為競速游戲，《王牌競速》選擇了寫實類競速游戲的美術(shù)風格，在整體游戲UI上做了較強的品牌化視覺包裝，游戲中還結(jié)合了鏡頭語言設(shè)計和有效的動效設(shè)計來輔助UI更好的讓玩家深入體驗游戲。

一塊硬幣有正反面，如果一味追求視覺而忽略了體驗，將適得其反。加強視覺效果短期內(nèi)是能吸引住大家的目光，但競速游戲中玩家的體驗感也不容忽視。

好的鏡頭語言和優(yōu)秀的動效設(shè)計是UI設(shè)計師乃至游戲人所追求的目標～大家共勉之～

大家對《王牌競速》的游戲美術(shù)有什么看法么？

還想看有關(guān)什么游戲美術(shù)的測評，

歡迎大家在評論區(qū)給我們留言哦～