東莞易思訓(xùn)教育

7x24小時(shí)咨詢熱線

400-660-3310

當(dāng)前位置 : 好學(xué)校 東莞易思訓(xùn)教育 學(xué)習(xí)資訊 資訊詳情

游戲UI的五個(gè)基本設(shè)計(jì)原則

2021-12-28

UI決定了一個(gè)游戲的初體驗(yàn),甚至決定了玩家的初始留存,甚至可以說決定了一個(gè)游戲的品質(zhì),雖然看起來是表象的,卻是直指游戲核心的。

游戲UI的五個(gè)基本設(shè)計(jì)原則

1、視覺流的引導(dǎo)

視覺流,就是我們?cè)诓榭磫蝹€(gè)界面時(shí)的視覺流程。暫且先不考慮手勢(shì)的熱區(qū)范圍,單從眼動(dòng)軌跡來看,眼睛對(duì)于物體的關(guān)注本身是有一定的視覺規(guī)律的,比如最簡(jiǎn)單的從上到下從左到右的規(guī)律。一般而言,我們?cè)谠O(shè)計(jì)頁(yè)面的時(shí)候會(huì)盡量考慮人眼的視覺規(guī)律,比如最重要的功能不要放在視覺盲區(qū)范圍內(nèi)。但是在這里筆者要強(qiáng)調(diào)的是,眼睛的視覺流是可以通過對(duì)界面控件合理的層級(jí)羅列,恰當(dāng)?shù)牟季謥磉M(jìn)行有效引導(dǎo)的。

2、相似相近原則

相似相近,就是“風(fēng)格統(tǒng)一,同類相近”。

風(fēng)格統(tǒng)一,要**同一類圖標(biāo)外形上的一致,即使按鈕因?yàn)樽煮w長(zhǎng)短而變得長(zhǎng)短不一,但是至少?gòu)耐庑慰雌饋硎峭活惖摹?/p>

同類相近,同一類型控件的位置要離的近一些,即使沒有圖案的框選,也能知道它們屬于同一類按鈕。

3、色彩偏向和色彩層次

色彩偏向,在界面設(shè)計(jì)中,都應(yīng)該有一個(gè)色彩的偏向,也就是主色調(diào)。在任何一個(gè)畫面中,色彩都不宜過多,不同色系不要超過3種。這就好像穿衣服一樣,除非是高級(jí)設(shè)計(jì)師,擁有很好的配色駕馭能力,很少犯錯(cuò)那種,一般人拍在身上的顏色越多越花哨,整個(gè)檔次就越low。分享一個(gè)小技巧:在游戲界面中,可以使用黃金分割率來做出劃分,主色調(diào)約占60%,輔助色占30%,突出色占10%。

色彩層次,在UI制作中,因?yàn)榫_度要求很高,色彩的亮度和面積有個(gè)反比應(yīng)用關(guān)系,這很重要,因?yàn)樗苯記Q定了UI原色的主次關(guān)系問題。越亮的、純度越高的顏色在使用面積上慎之又慎,否則就會(huì)造成喧賓奪主以及對(duì)玩家視覺上的折磨,為了達(dá)到視覺上的等同效應(yīng),亮度、冷暖不同的顏色也要在面積上進(jìn)行微調(diào)。背景色經(jīng)常表現(xiàn)為無彩色(黑、白、灰),或者低飽和度的色彩。

4、字體節(jié)奏

很多人會(huì)覺得游戲中畫面最重要,字體是信息傳遞的輔助角色,這就錯(cuò)了,內(nèi)容的可讀性永遠(yuǎn)是排在首位的。我們?cè)诳磮D標(biāo)的時(shí)候會(huì)發(fā)現(xiàn)很多圖標(biāo)的可辨識(shí)度并不是很高,但是一旦添加了字體,馬上就可以理解功能。好的字體設(shè)計(jì),形狀和大小都會(huì)直接影響到玩家接收信息的速度。

5、目標(biāo)導(dǎo)向原則

目標(biāo)導(dǎo)向,在游戲中,每一個(gè)界面都是具有相應(yīng)目標(biāo)功能的,玩法也好養(yǎng)成也罷,界面展示的信息必須是這個(gè)功能需要讓玩家獲的信息。要明確自己的目的,盡量不要為了目的以外的原因影響你的設(shè)計(jì)。除了這個(gè)界面功能最原始的目的,你每想要加一個(gè)東西的時(shí)候都要反復(fù)的問自己:加了額外的東西有什么好處?會(huì)不會(huì)引發(fā)某些問題?如果不加會(huì)有什么壞處?多個(gè)維度好好想想,優(yōu)秀的設(shè)計(jì)都經(jīng)得起反復(fù)推敲。比如,充值界面的左側(cè)為什么一定要加個(gè)白無常?玩家會(huì)在充值的時(shí)候抽個(gè)空來欣賞你的立繪嗎?另外同一張立繪在多個(gè)界面中反復(fù)使用,你是有多缺乏設(shè)計(jì)想法,一定要在每個(gè)頁(yè)面中都加一張立繪來體現(xiàn)你有進(jìn)行過設(shè)計(jì)。這樣做的后果是:不僅降低了立繪本身的價(jià)值,也減慢了游戲資源的加載速度,并且讓界面變得復(fù)雜不易識(shí)別,造成玩家的審美疲勞。

收藏
分享到:

相關(guān)課程

相關(guān)資訊

東莞易思訓(xùn)教育

東莞易思訓(xùn)教育

認(rèn)證等級(jí)

信譽(yù)良好,可安心報(bào)讀

東莞易思訓(xùn)教育

已獲好學(xué)校V2信譽(yù)等級(jí)認(rèn)證

信譽(yù)值

  • (60-80)基礎(chǔ)信譽(yù)積累,可放心報(bào)讀
  • (81-90)良好信譽(yù)積累,可持續(xù)信賴
  • (91-100)充分信譽(yù)積累,推薦報(bào)讀

與好學(xué)校簽訂讀書保障協(xié)議:

  • 100%
  • 37
  • 1890
在線咨詢
;