你好,歡迎來(lái)到川北在線(xiàn)
微信
騰訊微博
新浪微博
國(guó)產(chǎn)游戲如何洗脫“頁(yè)游感”? 先從色彩、文字、界面與動(dòng)畫(huà)入手
時(shí)間:2016-11-03 11:35   來(lái)源:GameRes游資網(wǎng)   責(zé)任編輯:毛青青

  國(guó)產(chǎn)的MMORPG游戲總是蘊(yùn)藏著一種濃濃的頁(yè)游味。而這種“頁(yè)游感”卻不因引擎的改變,美術(shù)總監(jiān)的更換做轉(zhuǎn)移。當(dāng)我們認(rèn)為是國(guó)內(nèi)的商業(yè)化導(dǎo)致了畫(huà)面的雜亂時(shí),卻發(fā)現(xiàn)國(guó)內(nèi)代理的國(guó)外網(wǎng)游卻沒(méi)有這種廉價(jià)的頁(yè)游感。這種頁(yè)游審美源自何處?未來(lái)的自研網(wǎng)游又如何擺脫這種廉價(jià)感呢?

  本文將用幾個(gè)案例進(jìn)行分析。

  一、色彩與文字

  以《天龍八部》作為案例進(jìn)行分析。

  從《天龍八部》中我們可以看到。游戲中使用了不同的顏色來(lái)標(biāo)示不同的信息。顏色用來(lái)區(qū)分信息的優(yōu)先級(jí)和信息之間的親密度都很必要。但是滿(mǎn)屏幕的紅橙黃綠青藍(lán)紫的文字,導(dǎo)致了“If you highlight everything, you highlight nothing”的現(xiàn)象。所有的信息都混雜到了一起,本身應(yīng)該起到的區(qū)分作用完全失去了。

  僅僅從聊天界面,就能看出設(shè)計(jì)上的巨大問(wèn)題。顏色繁雜沒(méi)有區(qū)分度,還有糟糕的描邊。

  有趣的是,白色這種最醒目的字體顏色卻被擱置在一旁,反映了游戲界面美術(shù)在考慮顏色選擇的時(shí)候,認(rèn)為顏色越鮮艷,它越容易被辨識(shí)。然而事實(shí)卻不然。人們總是先認(rèn)識(shí)到明暗差異,才會(huì)認(rèn)識(shí)色相差異;译A上的辨識(shí)程度決定了整個(gè)游戲的信息辨識(shí)度。所以深色背景下,白色的顏色辨識(shí)度是最高的。

  同時(shí),顏色所代表的信息需要統(tǒng)一。在魔獸中,所有黃色文字都是反映的系統(tǒng)信息,比如玩家任務(wù),系統(tǒng)提示和個(gè)人UI。紅色都代表著敵人,藍(lán)/綠色代表著友軍。這樣讓玩家能夠更快的甄別出有用的信息,同時(shí)減少視覺(jué)負(fù)擔(dān)。

  但是到了國(guó)產(chǎn)網(wǎng)游這邊,系統(tǒng)UI的文字是黃色的,系統(tǒng)發(fā)的信息是紅色的標(biāo)題帶有粉紅的內(nèi)容。友軍是黃色的,敵人也是黃色的。這些顏色隨性地分配到各種游戲元素上,讓玩家難以理解,顏色本身的效用也丟失了。這反映了國(guó)產(chǎn)網(wǎng)游美術(shù)的另一大思想:“顏色越豐富越好”。這是教科書(shū)式的設(shè)計(jì)誤區(qū)。事實(shí)上好的設(shè)計(jì)正好相反,要用最少的顏色來(lái)區(qū)分游戲元素和信息就是最佳設(shè)計(jì)。

  左邊友方NPC和右邊敵方小怪竟然都使用了同樣的黃色;靵y顏色所代表的信息。

  國(guó)產(chǎn)網(wǎng)游還停留在有設(shè)計(jì)感就是漸變+浮雕+外發(fā)光+描邊的時(shí)代。如果說(shuō)十年前這種審美誤區(qū)之所以存在是因?yàn)閲?guó)人審美有滯后性,那么到今天的《新天龍八部》還繼續(xù)這樣的審美,那就實(shí)在沒(méi)有理由。在《天龍八部》里,所有的字都是帶有描邊的。而描邊放在中文字體上是致命的,它模糊了文字的結(jié)構(gòu),使得文字變得含糊難讀。因?yàn)槊柽吅痛煮w不一樣,它只是簡(jiǎn)單地在字體外圍加了兩三個(gè)像素,并沒(méi)有考慮到不同筆畫(huà)之間的關(guān)系。而這些描邊顏色也相對(duì)隨機(jī),黃配橙,粉配黑,白配藍(lán)等,花樣繁多。尤其到了聊天窗口中,文字小而擁擠,一大片黑色描邊的文字就像巴掌一樣打在玩家臉上。

  做減法,明確信息,顏色的目的。不盲目添加顏色和影響閱讀的文字特效。

  而這些設(shè)計(jì)者在做出黑色描邊的決定時(shí),一定是擔(dān)心不帶描邊的文字出現(xiàn)在亮色背景下會(huì)變得難以閱讀。但是因?yàn)榱奶齑翱诒旧砭褪巧钌尘暗,這種擔(dān)心便是多余的。

  除了“顏色越多越有設(shè)計(jì)感”的誤區(qū)之外,還有另一個(gè)教科書(shū)般的設(shè)計(jì)誤區(qū):“字體越豐富越有設(shè)計(jì)感。” 《天龍八部》一個(gè)畫(huà)面里具有四種不同的字體,楷體宋體行楷和變形行楷。而《魔獸世界》中只用了兩種字體。而兩種字體往往是游戲最適合的字體數(shù)量。一種裝飾性文字,一種閱讀性文字。這和海報(bào)設(shè)計(jì)如出一轍。過(guò)多的字體只能讓畫(huà)面混亂不堪。

  僅僅右上角的一虛地方,就用了三到四種字體。而且伴有不同的文字特效。

  《魔獸世界》中全局兩種字體,整個(gè)右上角只使用兩種顏色。用最少的元素表達(dá)信息。

  如果字體的繁多已經(jīng)給玩家的閱讀造成困難的話(huà),在文字上加上漸變特效就更加變本加厲了。尤其是當(dāng)文字并非作為裝飾性文字存在的時(shí)候。同時(shí)文字的拉伸也犯了字體設(shè)計(jì)的禁忌,更加讓畫(huà)面顯得低級(jí),雜亂。

  從地圖和底邊框可以看出游戲試圖使用水墨畫(huà)的風(fēng)格,水墨畫(huà)的風(fēng)格的關(guān)鍵詞是色彩對(duì)比度大,飄逸,平面。而游戲的其他內(nèi)容都使用了擬物化的漸變繪法,讓整個(gè)游戲風(fēng)格不倫不類(lèi)。

  UI上出現(xiàn)水墨風(fēng)格的元素,但是卻用更多沖突的元素來(lái)讓整個(gè)風(fēng)格不明晰。

  低端綠,很有可能是很多人對(duì)這種國(guó)產(chǎn)網(wǎng)游的第一印象。

  游戲內(nèi)試圖用最高飽和度的綠色作為植被的顏色,而這種滿(mǎn)屏幕綠油油的畫(huà)面經(jīng)常是國(guó)產(chǎn)網(wǎng)游的第一印象。在這種寫(xiě)實(shí)唯美的風(fēng)格下,對(duì)于樹(shù)的明暗概括尤其重要,而不是整棵樹(shù)用統(tǒng)一的綠色鋪開(kāi)。尤其是這種綠色是最低級(jí)的純綠。在生活中的樹(shù)葉是不會(huì)呈現(xiàn)同樣的顏色,這也暴露了美術(shù)經(jīng)驗(yàn)的不足。

  小結(jié)

  國(guó)產(chǎn)游戲的頁(yè)游品質(zhì)根源于落后的審美。游戲美術(shù)不熟悉設(shè)計(jì)常識(shí),反復(fù)堆砌設(shè)計(jì)元素,讓游戲畫(huà)面混亂不堪。在今后的游戲中,需要在游戲美術(shù)上做減法,能少用字體和顏色就盡量少用。整個(gè)游戲風(fēng)格必須統(tǒng)一,在游戲的美術(shù)工作開(kāi)始前就要定義整個(gè)藝術(shù)風(fēng)格。

  一定不要見(jiàn)到什么風(fēng)格好就往游戲里添加,堅(jiān)持已經(jīng)制定的美術(shù)基準(zhǔn)。國(guó)產(chǎn)網(wǎng)游的一大問(wèn)題就是界面中充滿(mǎn)了不同風(fēng)格游戲的元素。加劇了廉價(jià)感。

  二、界面和動(dòng)畫(huà)

  闡明國(guó)外和國(guó)內(nèi)游戲區(qū)別的最好方法,莫過(guò)于選擇同樣類(lèi)型,同樣玩法的游戲。而這次,我將從英國(guó)游戲公司King的《糖果傳奇(Candy Crush)》和國(guó)內(nèi)游戲公司樂(lè)元素的《開(kāi)心消消樂(lè)》進(jìn)行對(duì)比分析,分析重點(diǎn)將在界面的邏輯清晰度和動(dòng)畫(huà)統(tǒng)一性上。

  混亂和清晰

 —心消消樂(lè)中,剛剛進(jìn)入游戲的玩家會(huì)發(fā)現(xiàn)自己面前有十多個(gè)大小相同,優(yōu)先級(jí)不分上下的按鈕。各個(gè)按鈕的親密關(guān)系也十分混亂。引用設(shè)計(jì)師Robin Williams的話(huà)就是:“如果多個(gè)項(xiàng)相互之間存在很近的親密性,它們就會(huì)成為一個(gè)視覺(jué)單元,而不是多個(gè)孤立的元素。這有助于組織信息,減少混亂,為讀者提供清晰的結(jié)構(gòu)。”

  界面上圖標(biāo)沒(méi)有優(yōu)先級(jí)親密度的區(qū)分,不同功能的按鈕隨意的安置在界面上,視覺(jué)也沒(méi)有重點(diǎn)。

  在開(kāi)心消消樂(lè)中,活力值,星星數(shù)目,金幣和銀幣這些游戲內(nèi)資源屬于同一種類(lèi)型,它們應(yīng)該有更高的親密度。周賽,任務(wù),道具商店,果樹(shù)這些功能活動(dòng)的屬于一個(gè)親密度。它們?cè)谟螒蚶飸?yīng)該通過(guò)大小,形狀,色彩上表現(xiàn)出這些親密度。然而開(kāi)心消消樂(lè)中,這些按鈕之間沒(méi)有任何親密度的區(qū)別。

  糖果傳奇中,不同功能的按鈕都分類(lèi)放置,從形狀大小上進(jìn)行親密度區(qū)分,直觀(guān)傳達(dá)信息。

  糖果傳奇中,界面中的優(yōu)先級(jí)和親密關(guān)系做的非常明確。生命值,金幣,和郵箱被分為一組放在頂層,以圓角矩形來(lái)顯示;顒(dòng)放在側(cè)邊,以圓形圖標(biāo)來(lái)顯示。設(shè)置按鈕放在左下角,單獨(dú)顯示。游戲通過(guò)視覺(jué)語(yǔ)言來(lái)告訴玩家哪些信息是同一類(lèi)型的,哪些是你需要重點(diǎn)關(guān)注的。這就實(shí)現(xiàn)了設(shè)計(jì)的價(jià)值。交互設(shè)計(jì)不是為了讓事物好看,而是讓它們更利于事物和人的互動(dòng)。

  統(tǒng)一和隨意

  視覺(jué)語(yǔ)言需要有一定的規(guī)律。這樣可以讓玩家更信任這個(gè)游戲的設(shè)計(jì)。就像你無(wú)論在哪里開(kāi)車(chē),路牌的字體,樣式都是相同的。不會(huì)突然出現(xiàn)一個(gè)粉色的,帶有檸檬黃描邊的禁止轉(zhuǎn)向路牌。這視覺(jué)統(tǒng)一性會(huì)讓玩家信任整個(gè)視覺(jué)體系,提升交互效率。

  在游戲中,同樣的元素應(yīng)該遵循同樣的設(shè)計(jì)風(fēng)格。開(kāi)心消消樂(lè)利用右上角紅色圓點(diǎn)來(lái)表示未讀信息。這本身很符iOS的設(shè)計(jì)慣例。但是在同一個(gè)界面里,一個(gè)是圖標(biāo)用了陰影,配上帶有白色描邊的紅點(diǎn),一個(gè)是圖標(biāo)用的白色描邊,配著帶著黑色外發(fā)光的紅點(diǎn)。這并不是非常嚴(yán)重的問(wèn)題,但是經(jīng)常在游戲的很多不經(jīng)意的地方出現(xiàn)。暴露出游戲的質(zhì)量問(wèn)題。

  同樣是一個(gè)界面的圖標(biāo),連右上紅點(diǎn)的設(shè)計(jì)規(guī)范都不統(tǒng)一。

  不只是靜態(tài)

  這是很多時(shí)候被忽視的一點(diǎn)。游戲美術(shù)包含的不只是游戲中的畫(huà)面,還包含了游戲中的交互元素,例如動(dòng)畫(huà)。當(dāng)玩家點(diǎn)擊一個(gè)按鈕后,對(duì)話(huà)框會(huì)彈出。這個(gè)彈出方式每個(gè)游戲都是不同的。在《皇室戰(zhàn)爭(zhēng)》中,游戲采用了Spring的動(dòng)畫(huà)方式,對(duì)話(huà)框會(huì)張開(kāi)到一定程度然后縮回,就像是彈簧一樣。玩家無(wú)論點(diǎn)擊任何一個(gè)按鈕,呼出的對(duì)話(huà)框的動(dòng)畫(huà)都是采用的Spring函數(shù)。這樣整個(gè)游戲的回饋感非常強(qiáng),而且風(fēng)格統(tǒng)一。這種動(dòng)畫(huà)函數(shù)在游戲開(kāi)發(fā)中被稱(chēng)為T(mén)ween。

  游戲中,相同功能的交互會(huì)擁有相同的交互動(dòng)畫(huà)。反復(fù)增強(qiáng)交互的信任感,加強(qiáng)元素的統(tǒng)一性。

 ≠個(gè)簡(jiǎn)單的例子,當(dāng)電影中,一個(gè)駕駛飛船的人在一個(gè)星球上緊急著陸,前方就是懸崖,只見(jiàn)飛行員拉緊了剎車(chē),飛船漸漸地減速,眼看飛船就要抵達(dá)懸崖邊,我們聽(tīng)到吱吱呀呀的飛船慢慢停下的聲音,原來(lái)飛船前半部分完全露在了半空中,整個(gè)飛船在懸崖邊上搖搖欲墜。在這個(gè)過(guò)程中,飛船從高速滑行到剎車(chē)不是線(xiàn)性緩慢的過(guò)程,而是前面加速度非?,后面的加速度變得很慢。在最后飛船停下前的那五秒鐘,飛船可能只行進(jìn)了幾厘米。如果做成動(dòng)畫(huà),飛船的Tween應(yīng)該是二次函數(shù)。

 —心消消樂(lè)中的四個(gè)彈窗就用了三種不同的交互動(dòng)畫(huà),隨意的設(shè)計(jì)破壞了游戲的質(zhì)量和交互體驗(yàn)。

  在游戲中,這種動(dòng)畫(huà)應(yīng)該是穩(wěn)定的,統(tǒng)一的,可預(yù)知的。在糖果傳奇中,游戲所有的對(duì)話(huà)框都是下拉彈簧Tween。但是到了開(kāi)心消消樂(lè)中,僅僅左上角的四個(gè)按鈕,就有Spring,Sine和無(wú)Tween三種不同的Tween方式。普通玩家只能感受到這個(gè)游戲玩起來(lái)有一些別扭,看起來(lái)游戲有一些粗糙卻說(shuō)不上來(lái)。其實(shí)很多都表現(xiàn)在這些交互的不統(tǒng)一上面。

  英國(guó)King的糖果傳奇和國(guó)內(nèi)的開(kāi)心消消樂(lè)雖然屬于同類(lèi)產(chǎn)品,但是品質(zhì)上卻差異很大。這些差異也體現(xiàn)了國(guó)內(nèi)游戲研發(fā)時(shí)的不專(zhuān)業(yè)問(wèn)題。這些不專(zhuān)業(yè)并不是美術(shù)的問(wèn)題,而是質(zhì)量管控的問(wèn)題。團(tuán)隊(duì)里需要有人對(duì)動(dòng)畫(huà),風(fēng)格和UI有全面的了解,才能對(duì)整個(gè)游戲的質(zhì)量進(jìn)行評(píng)估。這也從某種程度上造成了想做精品游戲卻總是欠缺什么的后果。

   投稿郵箱:chuanbeiol@163.com   詳情請(qǐng)?jiān)L問(wèn)川北在線(xiàn):http://sanmuled.cn/

川北在線(xiàn)-川北全搜索版權(quán)與免責(zé)聲明
①凡注明"來(lái)源:XXX(非在線(xiàn))"的作品,均轉(zhuǎn)載自其它媒體,轉(zhuǎn)載目的在于傳遞更多信息,并不代表本網(wǎng)贊同其觀(guān)點(diǎn)和對(duì)其真實(shí)性負(fù)責(zé),本網(wǎng)不承擔(dān)此類(lèi)稿件侵權(quán)行為的連帶責(zé)任。
②本站所載之信息僅為網(wǎng)民提供參考之用,不構(gòu)成任何投資建議,文章觀(guān)點(diǎn)不代表本站立場(chǎng),其真實(shí)性由作者或稿源方負(fù)責(zé),本站信息接受廣大網(wǎng)民的監(jiān)督、投訴、批評(píng)。
③本站轉(zhuǎn)載純粹出于為網(wǎng)民傳遞更多信息之目的,本站不原創(chuàng)、不存儲(chǔ)視頻,所有視頻均分享自其他視頻分享網(wǎng)站,如涉及到您的版權(quán)問(wèn)題,請(qǐng)與本網(wǎng)聯(lián)系,我站將及時(shí)進(jìn)行刪除處理。



合作媒體
金寵物 綠植迷 女邦網(wǎng) IT人
法律顧問(wèn):ITLAW-莊毅雄律師