文檔篇2-如何拼UI（上）

來自專欄遊戲策劃入門常識

今天姐姐生日，所以更一版。

這個是之前的存稿，算是寫文檔的正文，但是考慮到普及新人，所以前面寫了好幾篇來科普一下。

這份比較長，分上中下三部分（主要是存稿有限，每次更新2000-2500字左右）。會詳細說說拼界面需要考慮的點，最後並示範一次。

一、給你個理由

如果你覺得策劃的工作就是寫好文檔就可以了，那麼你面對的就是一堆山寨的界面，界面操作用起來完全不趁手。順便推一波鍋，「某某遊戲也是這樣的！」

如果舉的遊戲是賺錢的，就可以理直氣壯的說，這個系統這個玩法這個界面是經過驗證的！我參考（抄）的是流水xx千萬的產品。

如果例子不賺錢了？呵呵，不賺錢不叫好的產品會成為你的例子嗎？

身為有職業道德的遊戲策劃，那麼low的理由能用嗎？

當然可以！

只是你會被鄙視而已。Who care？只要遊戲賺錢就好了！！！

可惜，我從業多年都沒有碰到賺錢的遊戲，所以我只能增強策劃能力，保住飯碗。

主流的系統策劃，除了寫文檔，還需要懂得如何出UI需求，因為你是最了解系統的人！作為剛入行的人或許會有一下的疑問。

1. 我們只是策劃，為什麼還要拼UI？
2. UI、UE不是美術要做的事情？關策劃什麼事？
3. 拼UI就算了，為什麼還要拼得好看？

第一條：

對玩家來說，自己與系統（玩法）之間的交互，主要是通過界面作為媒介的。而策劃，需要對系統內容進行梳理，選擇，排列輕重，展示在界面上。

另外，你不把UI拼出來，難道還要美術把你文檔一個個字看完，然後和你BB幾個小時自己進行設計嗎？你能保證他畫的就是你要的？呵呵，只要字一多，美術妹子就會頭暈。

第二條：

理由上面也說了，你出了的是一個版面的結構，你需要知道這個界面能不能擺下你要的東西，這些東西重要的怎麼突出，信息什麼狀態等，都需要策劃列舉出來。能用圖片表現的，千萬不要用文字！

即使我們做的大部分系統都是根據原型去參考（抄）的，再結合自己的想法去進行修改或者優化。把能控制的東西都掌握在自己的手裡，為遊戲的成功增添小小的概率。

第三條：

最後記得，你就是底線。互聯網行業中，年輕人佔大多數（像我這樣的老餅，真是越來越少了），保不齊你遇到個菜鳥做你的系統，照著你UI拼完後還懟你一句：你需求就是這樣啊，百分百還原。

所以，你拼的界面就是最丑的底線。不要讓底線一低再低。

（丑的UI我就不放界面了，免得有人發現這需求是自己畫的，畢竟圈子那麼小）

二、規劃好比例

2.1-整體佔比

每個項目初始，都會定遊戲基礎解析度是多少。如果沒有，那麼也要和美術訂一個UI的比例。

得到最大屏幕大小後，可以制定每個系統的界面大小（全屏界面可以跳過此步驟）。

但是流程不一定是現有界面，後有內容。因為你會發現有些界面的內容很多，如果你都要擺上去的話，預先設計系統的大小就不適合，因為你的內容最重要。

圖片中，同樣一個遊戲，系統都是才有右半屏界面，但是兩個佔比不同。上圖是主要系統用的比例，由此可以看出它的比例是經過制定的，所以才會有大量系統去統一。

下圖的背包界面中，道具一行已經五個了（基本到了上限，再多就太密集了），這個就是由內容決定系統佔比大小。

同樣的系統中，因為需求不同，打開方式和整體佔比也會不同。例如下圖這款遊戲，它幾乎統一了所有功能系統的界面佔比。在設計時，你就需要盡量在這範圍內塞內容。

看到這裡，同樣遊戲不同系統，不同遊戲同樣系統，都有了一定了例子，不知道大家對整體佔比了解沒有？

沒有了解也沒關係，可以隨便拍腦袋定一個，定完後你繼續往下設計，覺得內容塞不下又可以改整體佔比的，就回頭把這個給改了。

2.2-個體佔比

個體佔比是什麼？先舉一個簡單的例子。

簡單舉幾個簡單的例子，讓大家先有個概念。

2.2.1-文字

1. 第一張圖的文字大小基本一致，一行容納十個中文字元。
2. 第二張圖標題比描述文字稍大，標題約一行十二個字，描述一行約十三個字。
3. 第三章標題一行九個字，描述一行約十二個字。

為什麼我會用任務引導做例子？因為他們的個體元素最簡單，基本是文字。在差不多整體佔比中，它個體元素佔比尤為突出。

策劃需要對於這些文字數量進行一定的規劃，雖然一開始規劃不一定準確，但需要給美術一個方向，最後再對此進行調整。

容納文字的多寡直接代表遊戲需要表達的信息量，當你是一個擁有一個複雜的遊戲背景時，需要更多文字去描述，避免頻繁的換行只能選擇小字型大小。

除了文字，個體元素還有什麼？

2.2.2-角色模型

角色模型顧名思義展示角色，一般全身，有些可以進行旋轉或者交互。

這個最容易定，定一個大概的範圍作為角色展示的大小。常見用於隊伍、角色界面、或者moba選英雄，這些都需要突出角色的形象。角色作用佔比越大，那麼佔據界面的比例越大。

同樣是三個不同遊戲對比，MOBA比較注重角色模型的表現，除了模型佔比大之外，此範圍內模型的尺寸也較大。

最左的RPG類遊戲中，模型佔比就稍弱了點。因為遊戲類型決定RPG更關注的劇情和內容，而MOBA則是英雄本身。前者是通用，後者是特色。

2.2.3-按鈕

什麼是按鈕，最基礎肯定是點擊出現各種反饋。根據反饋類型不同分為：分頁/功能/確認取消/關閉等。

怎麼指定按鈕的尺寸，讓整體界面錯落有致，功能凸顯？

使用頻率

常用代表技能系統。

市面上基本遊戲都有技能系統，而玩家在使用技能時，它們所有的按鈕都是一樣大小的？

又到了舉例子時間，最明顯的就是MOBA類技能。

根據技能的背景，我們可以分為兩類：英雄技能、召喚師技能。而英雄技能分為：普攻和技能。

這三種技能，有三種大小。為什麼要分大小？而不是一樣的？

如果這三個是同一級別，或者策劃沒有需求，美術或許都會化成一樣。但是仔細一想，技能間最大的差別就是使用頻率。

英雄技能因為常用，是主要戰鬥方式，可以先制定它的大小作為標準。

普攻使用最頻繁，沒CD，而且又是唯一，所以可以更大一點（但是又因為不重要，顏色會偏淡）。

召喚師技能一般CD長，使用頻率低，需要比標準大小更小一點。

重要性

系統的內容肯定會區分主次，因為有些內容你肯定需要突出，有些不重要。那麼你就需要根據主次去安排布局。

讓玩家打開這個界面時，就清楚知道我需要關注的是什麼，是哪個位置。

位置選擇

主要針對按鈕的位置，因為按鈕的位置大概都是固定的，所以預留了他們的位置，剩餘才是你可以隨意擺的位置。

縱觀所有界面（手游），一般按鈕都是在界面的底部，左右側等等。

因為這些位置，玩家橫著拿手機的時候，是最容易點擊的位置。

當然也有原因是第一批做手游的人這樣設計了，大家也都習慣了認同了，形成了默認的規則。如果你另外創新說更容易點擊，或許更多人也不會習慣。

不知道為什麼今天起床喉嚨特別痛，吃了葯也沒啥效果 。生日時，老公拿出他準備的禮物，他說是肥宅快樂肉......四川的氂牛肉乾......哭......

沒有鑽戒，沒有美容儀，沒有化妝品，沒有首飾，起碼你也給我買個遊戲碟啊！《底特律：化身為人》要出了啊。

推薦閱讀：