【鬥陣特攻】都說ow2的ui變醜了,到底醜在哪?為什麼這麼不順眼?


3樓貓 發佈時間:2022-10-11 14:03:21 作者:vanillapepsi Language

前言

說實話,2016鬥陣特攻發佈的時候,筆者是被它前衛和簡潔的藝術概念所吸引的。鬥陣特攻各方面的設計可以說是業界標杆也不為過。自從ow2發佈第一次beta測試,玩家就對關於ui以及美工的爭議不斷。筆者作為一名設計人想探討:

——從設計學的角度出發,ow2的各項美術設計:到底為什麼我們覺得醜了?


【鬥陣特攻】都說ow2的ui變醜了,到底醜在哪?為什麼這麼不順眼?-第0張

本文僅對設計角度進行評論,含有少量專業術語,儘量寫得通俗易懂。僅從一個6年玩家的個人角度出發,也歡迎在評論區積極討論


圖像的加工與簡化

首先我們來講講鬥陣特攻的遊戲模式面板。

ow在剛開服不久時大型更新過一次ui,相信不少老玩家還記得,從原來的“測試”味“走向更成熟更簡潔的風格,這也是ow第一個在美術風格方面的大型更新。

【鬥陣特攻】都說ow2的ui變醜了,到底醜在哪?為什麼這麼不順眼?-第1張

鬥陣特攻最初的遊戲面板

【鬥陣特攻】都說ow2的ui變醜了,到底醜在哪?為什麼這麼不順眼?-第2張

守望1的遊戲面板

如圖所示,ow1後來的面板無疑是令人賞心悅目的。無論是從簡潔的幾何圖案還是鮮明的配色,都很好得配合了鬥陣特攻世界觀的宗旨:未來,科技,前衛,大膽

我們可以看到每個小面版的顏色非常鮮明,大膽運用了撞色、明暗對比等。比如快速模式是橙黃/天藍等互補色的配色,街機和競技則是不同明度的綠色、紫色等。同時這些圖案几乎都是由大面積的色塊組成的,使每一個小部分看起來都是一個整體。再通過五個面積相等的模式色塊,組成一個大的整體。一旦有了整體和規律性,這麼多鮮亮的顏色運用起來就一點也不顯廉價。

【鬥陣特攻】都說ow2的ui變醜了,到底醜在哪?為什麼這麼不順眼?-第3張

安迪沃霍爾的波普藝術也運用了相似的技巧

【鬥陣特攻】都說ow2的ui變醜了,到底醜在哪?為什麼這麼不順眼?-第4張

具象的人物

我們可以同時觀察面板上出現的人物形象,同樣也是由模型形象中提煉出精簡的色塊組成的。在複雜的人物上只保留了其輪廓/特點,而不在畫面中過多贅述,才能和這些大膽的顏色完美地融合進這個小整體中,可以看出設計師花了很多心思在這些設計上。


我們再反觀ow最初的面板,每個人物的形象都是直接採用了模型本體,而背景雖然有純色/統一色系,但不難看出模型本身由於其真實性會出現很多與畫面不符合的顏色,導致每一個單獨的小整體看起來雜亂無章,顏色髒且略顯廉價。


原理講完我們接下來說說2的不足之處。

ow2的風格比1做得更簡潔,然而簡潔中卻缺少了ow1一向秉承的設計感。

它的格式是使用灰度色塊人物做背景,在正中放一個高飽和度的遊戲模式圖標。

第一個問題:失敗的視覺信息傳達

這幾個遊戲模式的圖標雖然很明顯,但是放在每個小塊面上還是顯得太小了。你可以單獨想象把其中一個模式拿出來,這個彩色的部分在畫面佔比非常小,有點像需要寫字在白紙正中間,結果寫了一個不大不小的字。從它作為說明和信息傳遞的功能性來說,這個表達無疑是不夠有效的。同時背景的人物形象雖然用幾何色塊精簡過,但它實在是太暗了,不仔細看根本看不太清,可以說是一個完全多餘的設計。

【鬥陣特攻】都說ow2的ui變醜了,到底醜在哪?為什麼這麼不順眼?-第5張

ow2的遊戲面板

第二個問題:配色與輪廓的不和諧

這五個模式的配色也非常讓人一言難盡。高飽和的藍、紅、綠、紫、黃,在畫面中非常突兀。這些配色的圖標設計也缺乏統一感。對比ow1的幾何感,ow2在圖標的設計中多出了兩個圓潤的”東西“:街機模式和訓練模式。其他三個都是有稜有角的圖形,唯獨這兩個圓圓的,彷彿在一堆長方體中多出來兩個球,非常難看。

【鬥陣特攻】都說ow2的ui變醜了,到底醜在哪?為什麼這麼不順眼?-第6張

鼠標放在面板上觸發的動畫

ow2多加了一個鼠標停留在面板上會觸發一個人物模型動畫的效果。這個和ow初代界面的有異曲同工的醜,原因也出在過於繁瑣的畫面和配色的失調。可以看出它想和ow1保持相似的配色,然而缺少了精簡的過程,使畫面出現了很多不該出現的顏色,導致了畫面的塑料廉價感,也是ow2最受詬病的一點。

【鬥陣特攻】都說ow2的ui變醜了,到底醜在哪?為什麼這麼不順眼?-第7張

ow1的職位選擇界面

【鬥陣特攻】都說ow2的ui變醜了,到底醜在哪?為什麼這麼不順眼?-第8張

紅配綠,賽狗屁

這兩張對比圖可以清晰地看到ow2的設計給人一種直觀的醜。從意義不明的高飽和漸變配色和多餘的六邊形框,都在侮辱玩家的審美和遊戲的世界觀。最過分的是這裡下面的排隊時間還用了鮮綠色。這裡已經不知道怎麼吐槽了,無法理解的審美與設計。(這個六邊形的框也是從頭像的素材扣的)


醜陋廉價的段位圖標

筆者特意做了個對比圖以及添加了輔助線。

我們可以看到ow1中段位圖標的長款比例幾乎是相同的

,其中每個圖標的線條整潔流暢,充滿幾何美感。上色和特效更是簡潔,更加突出了圖標本身的設計感。可以說是設計師的用心之作了。

【鬥陣特攻】都說ow2的ui變醜了,到底醜在哪?為什麼這麼不順眼?-第9張

段位圖標的對比

反觀ow2的圖標更像需要強行和1不同,被隨便塗鴉出來的。首先長寬沒有固定的比例,有細有寬,宗師圖標甚至太寬,導致頭重腳輕,只有一個字,醜。筆者認為這樣的圖標設計是完全不合格的,甚至達不到專業水平,而鬥陣特攻和暴雪已經是一個非常成熟的公司了。配色和特效也過分浮誇與鮮豔,一股塑料味。這些低幼和不專業的設計都導致了它看起來十分廉價。

線條更是無法理解地用了曲線,而每個段位所用的代號材質(白銀黃金鉑金等)大多數時候很難看到曲線,再加上鬥陣特攻如此科幻的故事背景,筆者實在不能認同曲線的裝飾。

【鬥陣特攻】都說ow2的ui變醜了,到底醜在哪?為什麼這麼不順眼?-第10張

隔壁wow的圖標設計大量運用了曲線

如果用在魔幻背景下,曲線設計的金屬或許更合適。

這一切廉價低幼的設計配上ow2現在價格不菲的氪金系統,像極了小作坊頁遊


效率低下的信息傳遞

【鬥陣特攻】都說ow2的ui變醜了,到底醜在哪?為什麼這麼不順眼?-第11張

ow1的最後時刻(淚目)

【鬥陣特攻】都說ow2的ui變醜了,到底醜在哪?為什麼這麼不順眼?-第12張

ow2的主界面

主頁少了很多東西,比如設置和亮眼表現。現在全部都要從別的入口進去,使本來只要鼠標點一步的過程變得十分繁瑣。主頁本身就已經是menu了,右下角又多了一個menu的字樣,多餘到令人發笑。對比ow1一目瞭然的信息傳遞,2的按鍵讓人摸不著頭腦。


同樣的問題新的計分面板也存在。由於沒有視覺重心,信息傳遞的效率比之前降低了。

【鬥陣特攻】都說ow2的ui變醜了,到底醜在哪?為什麼這麼不順眼?-第13張

ow1的計分面板

ow1的計分面板採用的是比賽數據+英雄個人數據,以及敵我陣容的模式,在數據方面,重點突出了消滅數量,傷害值,佔點時間以及治療量和死亡的數據,而英雄特殊數據寫在了右面。

為什麼筆者認為左邊的是突出呢?因為人看文字時的視覺方向是從左到右的。在比賽中分析數據時,先看到的東西往往需要更重要,更直觀。

而在畫面中上部顯示的敵我陣容也非常高效地傳遞了信息。當我們需要看陣容和大招進度時,視覺重點首先放在了畫面正中央上,也就是一個大的整體,這使得看陣容和大招進度一目瞭然。

所謂的“一目瞭然”也就是好的設計運用在信息傳遞裡可以達到高效率的效果。廣告中經常用這樣的技巧,使要突出的對象以最直觀、最明顯的方式展現在觀眾面前,以達到讓人記住的效果。

【鬥陣特攻】都說ow2的ui變醜了,到底醜在哪?為什麼這麼不順眼?-第14張

ow2的計分面板

而 ow2的計分面板用了三個大塊,分別計算了敵我的比賽數據以及英雄個人的特殊數據。然而一眼看過去,很難去決定眼睛先看什麼,因為它們的面積佔比過於相似了。也就是說這三個面板佔據的信息數量沒有主次。如果在激烈的比賽中按下tab查看數據,比如說大招情況,我們的眼睛很難馬上聚焦到畫面中左側小小的一排,更不要說立刻辨識一個單獨的小數字來判斷那是誰的大招了。

筆者作為一個安娜玩家,想給激素刀的時候,由於經常看不清大招進度條是誰的,導致每次都會晚0.5秒甚至更多。然而在團戰中,這細微的猶豫和差距往往決定了比賽的勝負。個人認為這種低效的設計是一個非常致命的失誤,畢竟玩家的眼睛不是機器人。


地圖畫面缺少氛圍

很多人都說ow2的地圖變得沒有那麼美麗了,筆者認為是地圖中刪掉了很多細節。這裡用訓練靶場做例子,因為這是我打開ow2第一個進的圖。

(筆者1和2都是用的同一個畫面設置,不存在特效開得不一樣的問題)

【鬥陣特攻】都說ow2的ui變醜了,到底醜在哪?為什麼這麼不順眼?-第15張

 

【鬥陣特攻】都說ow2的ui變醜了,到底醜在哪?為什麼這麼不順眼?-第16張

仔細觀察建築物色調(冷暖)的不同

訓練靶場應該是在南極洲附近。ow1運用了冷光渲染了冷調的環境色,使整個畫面看起來讓人有一種寒冷的感覺。空氣中有薄薄一層的冷霧,這裡的霧不僅起到調和畫面氛圍的作用,個人認為還有增加景深的效果。白色建築的反射光也和整個畫面顏色融合地很好。對比ow2,1的畫面更加柔和,整體色調也更清晰。

ow2去除了冷霧的感覺,建築物相比之前色溫暖和了不少,讓整個靶場看起來沒那麼冷了。然而結合外面冰天雪地的景色,讓地圖減少了真實性。建築物的暖調與外景的冷調也有一絲不和諧。

【鬥陣特攻】都說ow2的ui變醜了,到底醜在哪?為什麼這麼不順眼?-第17張

寒冷的霧氣

【鬥陣特攻】都說ow2的ui變醜了,到底醜在哪?為什麼這麼不順眼?-第18張

溫暖的建築?

這兩張圖可以更清楚地感受ow2相比之下缺少了寒冷的感覺,建築物的深灰色看起來像渲染還沒完成。建築底部是暖灰色和其餘顏色格格不入,顯得粗糙廉價。這樣的現象不止在靶場一個地圖出現過,幾乎每張圖都多多少少缺失了氛圍和溫度感。鬥陣特攻靠著其優秀的地圖設計吸引了包括筆者在內的很多玩家,然而ow2這樣的質量很難讓人信服這是鬥陣特攻的續作。


總結

筆者認為細節決定成敗,ow這次對於細節的把控顯然是非常粗糙的,不再是以前的鬥陣特攻了。

【鬥陣特攻】都說ow2的ui變醜了,到底醜在哪?為什麼這麼不順眼?-第19張

令人唏噓的鬥陣特攻1

相信有很多人和筆者一樣對ow的更新並不滿意,醜陋的設計、低效率的信息和廉價的配色,無一不在辜負玩家對鬥陣特攻的期望。本文不對遊戲性進行過多評價,然而作為一個被ow精美的藝術風格吸引的玩家,無疑是非常失望的。希望在未來的更新中能進行重新設計,畢竟現在沒有經費問題了。

由於篇幅有限,這次先寫到這,也歡迎在評論區討論你的看法


© 2022 3樓貓 下載APP 站點地圖 廣告合作:asmrly666@gmail.com