遊戲UI界面設計心得

今天簡要分享一下遊戲的UI設計心得，也算是自己對之前部分工作內容的總結。

首先，什麼事UI，UI即User Interface（用戶界面）的簡稱。泛指用戶的操作界面，UI設計主要指界面的樣式，美觀程度。而使用上，對軟體的人機交互、操作邏輯、界面美觀的整體設計則是同樣重要的另一個門道。（抄自百度百科，不瞎扯了）

總之，大家對UI並不陌生，那麼，怎樣才是一個好的UI界面呢？我剛工作時認為一個漂亮的界面就是一個好的界面，凡向美術提需求必要其加上複雜絢麗的邊框，雍容華貴的底紋，角落裡要有精緻的圖標裝飾，想方設法讓所有美的元素都能出現在這個界面里。

這樣做當然是不行的。在遊戲中，每一個界面都是具有相應功能的，玩法也好養成也罷，界面展示的信息必須是這個功能需要讓玩家獲得的信息。這句話有些拗口，直白點就是：讓玩家看到你想告訴他的東西。如果加入一些不必要的元素，就勢必會增加玩家的理解成本：複雜的紋理會喧賓奪主，錯落的icon會讓玩家摸不清頭腦，邊邊角角的圖標會讓玩家誤以為這裡有什麼東西可以點擊。這些都不是我們想要的。所以，保證一個界面的簡潔十分必要。與其花里胡哨，不如突出重點，思考一下，我在這個界面中想告訴玩家什麼信息，想讓玩家進行什麼操作，將這些內容凸顯出來，就已經體現了這個界面應有的價值。

以上是我領悟的第一個道理。

我領悟的第二個道理是：按鈕就應該有個按鈕的樣子，頁簽就該是頁簽的形狀。千萬不要覺得自己做的東西是一種創新而去挑戰一些已經成為習慣的東西。當時在玩天諭，好像是觸發某個任務的條件是某個技能修鍊到多少級，角色技能界面是這樣的：

我理所當然地吧上門的技能升到了對應的級別，然而並沒有什麼卵用，系統仍然提示我技能等級不足。

我在整個技能界面裡面看了半天，不知道應該怎麼做。最後請教百度大法，終於發現，這裡竟然是一個按鈕！點進去是滿滿的養成，簡直把我氣得不行。

講道理，按正常的理解，這個界面叫做技能修鍊，上面那麼多技能到多少級就是技能修鍊到多少級。再者，上方的技能icon飽和度那麼高，吸引了所有注意力，「技能修鍊」顏色那麼樸素，完美地融入了背景。最關鍵的是，按鈕應該有一個按鈕的樣子，就算是半圓形的也請描個邊，更換一下材質，加個強光效果，讓我能感覺出它是能夠點擊的。

這個過程我重複了兩次，第二次我流失好久回歸又忘記了，只好再次請教百度。回頭我就仔細檢查了一下自己曾經做過的界面，發現的確存在過類似的問題。在設計的過程中，有時會很主觀地想當然，甚至還會為此洋洋得意，感覺自己做了了不起的創新，如果不是換個角度去思考，很容易陷入思維陷阱。現在我設計的每個界面都會讓同事看一遍，讓他把從界面獲取的信息說一遍，看看和自己的想表達的是不是一樣。

再深入一些就是一些用戶體驗的設計了，比如要在某個特定界面中使用一個道具，進入這個界面要按4下，而如果在包裹可以直接使用該道具進入這個界面只要按3下，那後者的體驗就是好於前者的。如果玩家獲得一個禮包，需要到包裹中才能打開，那我在他獲得禮包的時候就在主界面中允許他打開，那麼這種體驗就是很好的。如果我在購買道具時只能一下一下按小加號增加購買數量，那麼我增加一個拖動條或者數字輸入框，那就是極好的。這個東西我們稱它為「操作流」。一個簡潔而高效的操作流對於用戶體驗的提升，尤其是新手的留存，是非常明顯的。

隨著對遊戲的理解越來越深，我個人認為，遊戲UI界面最重要的一點，就是一個界面是否易於理解。我曾經看到過一個SLG遊戲，煞費苦心將出陣布兵界面做成太極的樣子，我看到這個界面的時候研究了半分鐘，還是沒看懂，於是單擊右上角的小叉，關掉了遊戲。果然，這個遊戲後來再也沒有聽到過什麼消息了，可能是跪了吧。這個就是反面例子。

總結一下，如果能讓玩家很容易GET到你的點，那麼這個UI界面就是成功的。如果這個界面的操作還很簡潔，那麼這個界面就是相當成功的。如果這個界面還很漂亮，那麼，這個界面就是非常成功的。

--------------------------------------------------分割線-----------------------------------------------------------

好了，以上都是方法論的東西，那具體到執行時應該如何去實現？

首先，想好你這個界面是用來幹什麼的。

請不要假裝思考了兩秒鐘就說已經很明確自己的目的了。舉個例子，很久很久以前我要做一個資源回收的系統，界面裡面我準備把被回收資源的3D模型全放進去。過了一會我老大跑過來問我怎麼想的，我說因為被分解的都是一些比較低級的道具，沒有展示的地方，但是我們也都辛辛苦苦建了模的，所以我想在回收系統里展示一下。我老大說哦，感情玩家要是覺得模型好看就不分解了？你有沒有想過載入資源量？你讓用2MB的小水管怎麼辦？你有沒有想過模型縮小可能會有鋸齒和噪點？

所以，明確自己的目的，不要為了目的以外的原因影響你的設計。除了這個界面（功能）最原始的目的，你每想再加一個東西的時候都要反覆問自己：加了額外的東西有什麼好處？會不會引發某些問題？如果不加會不會有什麼壞處？三思而後行。

其次，思考你需要在這個界面展示的信息。

這個說來也簡單，無非是，在養成系統中講清楚消耗什麼可以增長什麼屬性，玩法系統中講清楚規則。運營活動中講清楚資源便宜了時間有限大家快來買買買。但是把這個做好也是很難的，因為你要告訴玩家的信息有很多，總有重點和非重點，重點信息需要放在醒目位置，核心信息要甚至要加強提示。而非重點信息能藏起來就藏起來。做這步的時候請牢記你的目的性，舉個反面教材：仙俠道有一個星石的養成，同時插3個同屬性的石頭會激活一個技能。這種帶策略性的養成是非常受歡迎的，效果應該遠遠好於純數值方面的養成，讓玩家插3塊同屬性的石頭應該是這個養成的核心目的。但是他在做界面設計的時候根本沒有提示我插3個同屬性石頭會激活一個技能，只有在激活後放一個非常快速而且不明顯的特效。

然後，左上角「我的星石」點開後和下方的信息重複了（見下圖）。寸土寸金的養成界面怎麼能犯這種錯誤！

要是我的話，就把左上角的icon換成技能圖鑑，點開icon查看所有技能效果和激活條件。每次進入星石養成界面會有一個小氣泡指向這個icon，提示裝3個同屬性的石頭會激活一個新技能，過幾秒後氣泡自動消失。當激活了技能時，會有特效將3塊石頭連起來連起來亮一下，然後化作星星點點光粒飄向左上方的icon，然後砰砰砰彈幾個字「星石之力：慾火焚身1級<font color="green">已經激活</font>」

再接下來就是美觀方面的東西，這個就仁者見仁智者見智了，我提一點，是關於UI的明顯程度。一般來說，UI是越醒目越好的。背景是暗的那UI最好是亮的，背景是冷色調的UI是暖色調的，背景是花的UI是純色的總之要一眼看到。美觀是所有要點中優先順序最低的。當美觀與其他原則衝突時，優先考慮其他原則。好用大於好看，切記切記。

再接下來，就是便捷性的問題。有一個叫做3次點擊原則，大概的意思就是不要讓玩家點擊三次以上才能進入一個界面。這個表達的思想是好的，但是並不是所有的情況下都要按照這個要求，不然整個界面上都得是圖標了。舉個例子，比如時裝功能的入口，就可以相對藏得深一些，哪怕玩家多點幾次也沒關係，畢竟正常玩家不會沒事就進一下時裝界面。要是一個SLG遊戲，那布陣的入口一定要放在一個很方便的位置，要是布個陣得點三下，玩家分分鐘流失。

便捷性原則中還有一點，從一個功能中可以快速進入到另一個功能。比如強化到一半強化石不夠，能夠快速跳從養成界面跳轉到獲取強化石的玩法中。這點在前期相當重要，通過這種方式來引導新手玩家更快上手遊戲。前兩天聽魂世界劉哲的講座里他還特意提到了這點。

好了，大概想到的就是那麼多了。最實際的還是多做，多想，想好了再去做。話說回來，決定一個遊戲最重要的還是核心玩法和美術風格，界面什麼的實在沒有辦法起到逆天改命的作用。但是，就是這些細節堆砌出一個高品質的遊戲。作為一個遊戲策劃，通過不斷優化自己的遊戲，本來玩家要思考一下才能理解，現在玩家看一眼就能懂這個玩法是怎麼玩的，不是很有成就感嗎。讓玩家輕鬆地體驗到遊戲的樂趣，和玩家分享簡單的快樂，這才是一個遊戲設計者的樂趣。

好了，關於界面設計我能想到的就是這些，覺得我說的有道理的可以記下來，覺得我在瞎扯的也不要太較真，有不同想法的歡迎留言或私信。以後可能還會寫一些遊戲其他方面的分享，希望到時繼續交流。