全世界銷量超790萬份的《噴射戰士3》，其獨特的UI不僅便於理解也讓人印象深刻，那麼這樣的UI是怎樣設計出來的呢？
橘 磨理子
多摩美術大學平面設計畢業，2012年加入任天堂。主要負責《噴射戰士》1·2和《皮克敏3》的UI設計。
任天堂已經推出過《超級瑪利歐》、《薩爾達傳說》、《動物之森》等熱門IP，但這並沒有停下他們在新領域開發新作的步伐，這一次則是《噴射戰士》（官方譯名：斯普拉遁）。
不出所料，這部作品不僅大受歡迎，還在日本掀起了一波射擊遊戲的風潮。
相比其他遊戲，《噴射戰士》獨特的世界觀吸引了許多玩家：在這個世界裡，人類滅絕，而軟體動物進化成人形並統治世界。
而負責UI設計的橘磨理子希望在保持「易理解」和「新鮮感」平衡的基礎上，凸顯這一世界觀。
橘磨理子說：「UI 不應該太喧賓奪主，『易理解』比一切都重要。但藝術總監說『想要點新鮮的UI設計』。所以在《噴射戰士》中，我的目標就是在UI 的易理解與美術的新鮮感之間取得一個平衡。」
易理解與新穎感
UI要便於理解、但從美術上看又要有新鮮感。
為此，該如何設計UI？
首先，橘磨理子提到在思考《噴射戰士》UI 設計的時候，最先想到的就是要比較一下不同作品的UI 設計。
譬如將大名鼎鼎的《超級瑪利歐》系列的UI設計擺到一起進行思考，並從中尋找《噴射戰士》的特點。
「與UI 設計成品相比較，有助於我們定下品質的目標，也有助於我們做得更新穎。在設計的時候時常對比，更易於發現《噴射戰士》的特色所在。」
開發獨特的字體
《噴射戰士》在確定UI 風格上進展非常順利，卻在意想不到的地方碰了壁──在選擇遊戲內使用的字體的時候，沒有找到符合世界觀的字體。
於是乎，抱著「沒有字體的話就自己做」這種想法開始從零製作字體。
橘磨理子展示了字體設計初期的手稿，她表示：「這是最初的草圖。最初的勢頭和印象很重要，所以儘快畫了出來。即使是一個模糊的印象，也應該儘早向設計總監和其他設計師展示，以確定方向是否合適。我覺得這對開發周期短、製作人數少的遊戲來說非常重要。」
以草圖為基礎，微調字體。在設計時帶有「體育用品品牌」的意識去思考字體的厚度，有分量感、結實的文字，在此基礎加上液態般如同活物一般的線條，字體的設計就基本確定下來了。
「不單純要考慮新鮮感，還要注意在極限下的可讀性。對於被認為「難以辨認」的字，需要反覆微調字寬以及字距。」
就這樣，《噴射戰士》所使用的字體就做好了。與《超級瑪利歐》里所使用的字體擺到一起，不僅一目了然，也能傳達出其獨特的世界觀。
塑造UI的形狀
接下來，介紹按鈕和元件等UI的形狀。
橘磨理子希望：僅靠遊戲中所出現的UI，就能感受到《噴射戰士》的氣氛。
首先，我們從給人以「烏賊」和「運動」印象的詞彙開始，先寫下詞彙給人的印象。（烏賊：軟體、液體、海洋、活物、緩慢的、不均勻）（體育：厚重、強大、簡潔明了、快速、年輕）
再把這些詞給人的印象反映到UI設計當中。（滴水、歪斜、搖曳）
結果如下，即使還未上色也能感受到《噴射戰士》的氣氛：左圖是《超級瑪利歐》的UI風格，右圖則是《噴射戰士》的UI風格。
另外，按鈕和指針的動畫效果也考慮到了《噴射戰士》的特點做了特殊設計。
遊戲的配色
橘磨理子表示，《噴射戰士》的配色也希望凸顯遊戲風格。
「瑪利歐圖標是在自然光線下拍攝的，因此陰影的亮度較暗。但在《噴射戰士》上，我們想儘可能給人留下『明快清新』的印象，所以在陰影上使用的不是在亮度上調暗的顏色，而是與原本的色相所偏離的顏色。比如，黃色的陰影用的不是暗黃色而是橙色。粉紅色的話，我就會用紫色來搭配。」
下圖為《噴射戰士》的「服裝技能」圖標，左圖為草圖，右圖為正式版，可以看出不僅外形，顏色也有一定調整，這是為了方便辨認和理解。
「清晰」的UI
橘磨理子表示，可以通過讓畫面變為黑白來確認UI是否清晰。
我們先看彩色畫面。
然後把遊戲畫面設為黑白，就能很容易地確認UI是否清晰。
「黑色容易被人忽視，白色則引人注目。文字和圖示是最白最顯眼的，如果窗口和背景顯示成灰色，那這就是易認的介面。」
「除了把畫面弄成黑白外，還經常用到「眯眼看畫面」的手法。當你眯著眼睛看螢幕時，白色的部分會更顯眼。」
也就是說，《噴射戰士》調高了圖標的色彩飽和度，使之更加顯眼；而除此之外，窗口之類的背景則將飽和度設定得比較低。
也就是說，對重要的圖標使用高飽和度，只強調重要的內容。
UI 與3D間的平衡
為實現「易理解」所做的第二點就是平衡UI與遊戲3D模型。
在《噴射戰士》中，根據場景的不同，資訊的優先度也會發生變化。為此與3D模型設計人員溝通，請他們做出改變。
「在戰鬥畫面中，要把角色和場景擺在第一位。《噴射戰士》是用彩墨來塗地的遊戲。應儘量不擋住畫面，為此把UI 置於遊戲畫面的上方，底色統一為黑色，使兩種彩墨的顏色更加醒目。」
而在購買道具的界面中，請3D設計師刪掉了牆上的海報並模糊背景，讓3D設計師刪掉辛辛苦苦做出來的海報的確有點兒為難，但好在3D設計師也理解UI的重要性。
追求易理解和新鮮感的結果
可以說，UI 上的易理解與美術上的新鮮感是《噴射戰士》大受歡迎的重要因素。
作為一個新IP，《噴射戰士》得到了玩家的認可。
《噴射戰士》的獨特字體得到了玩家的歡迎。
相關的IP周邊也得到了玩家的認可，這可能就是UI設計的絕妙之處吧！
結語
如果說有哪個手遊利用好的UI吸引到玩家的注意，那筆者第一個想到的就是《第五人格》。獨特的UI不僅有助於營造世界觀，對於開發周邊也很有幫助。
