Mika's Waffle

編輯筆記：本文是由玩皮狗的UI設計師Alexandria Neonakis邀稿。 如果您也是遊戲的從業人員且願意分享您的經驗請連繫 Jason@kotaku.com   當我在2012年11月加入頑皮狗時，這個工作室從未有一位專職 UI 設計師或美術。距離最後生還者專案截止還有八個月，部分的 UI 原件已經有略有雛型，而 HUD（抬頭顯示器）的整體設計還沒開始，還有許多事情尚未決定。我必須負責決定我們 HUD 與選單系統的流程；與程式和遊戲設計師一同製作、測試並不斷修正；最後繪製每個物件確保它與現存的遊戲美術保有一致性。 有許多理由讓這個案子的挑戰相當獨特，最顯而易見的就是急迫性。八個月對兩個人來說要把一個完整的 UI 從原型（Wireframe）做到完成最終潤飾不算很足夠的時間。我們的主 UI 程式 Paul Burg 與我一同打造了一套快速設計的系統，可以製作與反覆修正全部的物件。我們認為最適合我們的流程是這樣：原型→製作→反覆測試→繪製美術並修飾。 在此我就攻略一遍這個打造出遊戲中最終UI與HUD設計的流程。 原始設計 一開始時武器選擇系統與最後生還者在E3 Demo的是一樣的。武器、彈藥、生命與消耗品位在螢幕左上角。數位方向鍵的左右可以來回選擇你全部的武器，上下則是選擇消耗品 這系統製作好時的機制是當 Joel 撿起一把新武器時，他會把目前持有的武器丟棄（同秘境探險），在測試過這套系統後，遊戲設計團隊認為讓Joel保有他發現的全部武器比較合理。這將讓玩家可以選擇他們認為最適合目前狀況的武器，讓他們對遊戲如何進行更有掌控性。這也為武器升級系統打開了一扇門。於是我們開始基於這樣的機制設計不同於目前系統的介面。 原型 我用Photoshop製作了基本的原型。當我設計原型時我不會被物件看起來怎樣困擾，我會優先專注於功能性與感受，如果妳可以讓一樣東西感覺起來不錯，那之後要裝飾成甚麼樣子都可以。 一般來說，我們聽到人們抱怨UI都不是它們看起來怎樣，而是太多UI使畫面看起來雜亂，還有／或它們感覺很遲鈍笨重。 許多早期的原型都顯示一個可以切換與升級武器的選單系統，我一開始想要讓這些系統同時顯示在畫面上。我會這麼做的理由是當像升級這樣的其他選項使用子層畫面時，我會傾向忽略它們直到不得不使用時。在許多