《星之卡比》系列遊戲，是由 HAL 公司開發，任天堂發行的人氣遊戲，受眾非常廣泛，不只遊戲好玩，本系列遊戲的 UI (使用者介面) 設計，也往往為人所稱道。在 2020 年的 CEDEC，就有一場主題演講，題目是「卡比用UI盛情款待！以『聯繫遊戲與玩家的UI』為目標」。以下是本場演場的概要：
本場演講的主講人是來自 HAL 公司的伊藤晴香、劍持紫，兩位都有著豐富的遊戲製作經驗，並在卡比系列最近期的《星之卡比 機器人星球》、《星之卡比 新星同盟》等作品擔任主要 UI 設計師。
首先，先介紹卡比的 UI 設計，有機個基本目標：
- 不會讓人迷惑的 UI
- 不會給予壓力或不快感的 UI
- 能夠留下印象、讓人心動的 UI
對卡比的 UI 團隊而言，設計 UI 時最重要的事情，是：
- 考量易用性
- 考量遊戲整體的流程
- 不要忘記玩心
那麼，什麼是容易使用的 UI 呢？大致上，有這樣的特性：
- 能夠知道自己現在的狀況
- 不會不知道接下來要做什麼
- 能夠想像按了這個按鈕會發生什麼事
不會帶來違和感與壓力，就是好的UI。
遊戲的UI，是聯繫玩家與遊戲之間的事物；好的 UI，能夠讓玩家順利的投入遊戲的世界。反之，就會影響玩家對遊戲的投入。
具體來說該怎麼做呢？
好用的 UI，就是能夠讓玩家輕鬆地取得所需要的資訊，因此 UI 設計，基本上就是做好資訊「取用」與「整理」的工作
首先，決定資訊的優先順位。UI 團隊會與遊戲設計團隊進行討論，把遊戲內所需要提供給玩家的資訊一一表列出來，並依高、中、低三個級別，分出他們的優先順位。
接著，將資訊加以分類，例如與地點相關的資訊、分數資訊、與遊戲進行相關的資訊等。
再來就是要將分類與排序好的資訊，在畫面上佈局配置。畫面佈局的第一個要點，是「接近」。
讓相同類別、高關聯性的資訊彼此接近，而不要四處分散，玩家自然能夠更容易取得需要的資訊。以《新星同盟》為例，畫面上方橫向的是世界的選擇標籤，畫面中間縱向的則是關卡資訊，兩類型之間不會搞混。
第二個要點，是「對齊」。
文字與圖像的配置，要做到縱向、橫向或中央對齊，如果沒做好對齊，會影響觀看上的順暢。傳統上文字以靠左對齊最為常見，但也需要視情況調整，例如《新星同盟》裡面的按鍵功能對照表，因為主要想凸顯的是按鍵圖示，而圖示較適合中央對齊，因此說明文字的部分，也配合採用中央對齊，保持整體的一致性。
第三個要點則是「重複」。
這是指將畫面內的設計元素統一、重複運用，使其模式化，在《新星同盟》裡面，錄音室、插畫畫廊、劇院等畫面的左上角，都採用了相同的斜向線條設計，僅替換文字、顏色和圖示，透過重複的設計元素，讓玩家可以很輕易的理解它們屬於同一種類的功能。
實際上，讀者看到現在應該也已經發現，本場演講所使用的投影片，標題區塊的配置正運用了這樣的「重複」設計元素。
接著是要記得為畫面加上「對比」。
可以藉由放大、變換色彩等等方式，強化資訊之間的差異，例如遊戲模式選擇時，目前選擇中的圖示會發亮、放大，在多人遊戲時，選擇中的圖示配色明顯不同。
最後，要考量視線的誘導。
電視畫面是橫向的，習慣上觀看者的視線會是從左上到右下移動，因此最重要的、最希望第一眼被看到的資訊，就要放在左上方。
上面所說的，對於設計師來說，應該都是理所當然的基礎，但卡比的 UI 團隊，會把這種「理所當然」視為需要仔細檢查的東西。
例如《新星同盟》的最佳時間畫面，左邊是初期的設計，經過檢查驗證之後，調整了三個項目，才成為了右邊的最終版本。
主要調整內容：
- 初期的最佳時間設計是將每個小關的時間排在一起，右邊再一個區塊顯示總和時間，調整後，總和時間與各小關時間整合成一個縱列，方便從上往下綜觀，也更好的呈現出兩種數據之間的階層關係。
- 將「最佳時間」的文字從時間數字上方移動到畫面右上方，因為玩家最關心最想快點看到的就是時間數字本身，相較之下，「這個畫面是最佳時間」的說明，重要性上反而是次要的，所以把數字放到視線最優先會去看的地方。
- 角色插畫對於告知「最佳時間」這個資訊而言並不必要，因此移除了插畫，換取更加凸顯重點資訊、更加整齊的空間配置。
接下來，進到卡比 UI 團隊的第二大重要事項：考量遊戲整體的流程。
有些人可能會碰過這種情況：在設計 UI 元件時，對於比較不那麼重要的資訊，就用比較小的圖示來繪製，最後卻導致最後整個 UI 上，充滿了許多辨識度很低的小圖示，讓畫面變得很難看。
又或者像這種情況：根據企畫書上所敘述的調性，繪製了特殊形狀的 UI 元件來配合，後來才發現這個 UI 元件會被重複使用在其他地方上，導致了 UI 元件與畫面調性完全不合的情況。
會出現這種狀況的原因，在於繪製 UI 時沒有考慮到遊戲整體的流程。因此，對卡比 UI 團隊成員來說，最重要的，是要能解讀規格，並將遊戲整體流程列入考量的能力。
比方說，企劃書上開出的規格，是要製作一個「A 進入」的 UI 元件，設計師不能只是單純把這個元件畫出來就好，而是要設想這個元件被配置到整個 UI 裡面時，會是什麼樣的狀態，再進一步考慮諸如「適合的尺寸大小」、「與鄰近的 UI 元件是否要統一色系」等等問題。
而在閱讀企劃規格書時，UI 團隊也會去確認，「這個元件是否僅只使用一次」，例如左邊的特殊模式畫面，「開始」、「排行」等選項的 UI 元件是專屬規格，不會在其他模式使用，因此就可以配合該模式的調性，為 UI 元件加入專屬的設計。相對的，右邊畫面裡的「是」、「否」UI 元件，會在複數的場合反覆使用，在繪製時，就採用了較為泛用的設計。
不只是單一場景，UI 設計時還要考慮與前後畫面之間的關聯，讓 UI 的主題、演出保持一致性或聯繫性。以《卡比獵人隊》裡的任務畫面為例，最上層的 UI，玩家個人檔案的圖案是手帳型的外觀，因此從這邊開啟的任務選項畫面，右側就有著手帳的活頁孔洞，再下一步的細項畫面，孔洞開在左側，呈現出這是「下一頁」的連續性，而從手帳封面、內頁主選項、任務列表，都可以看到皇冠及勳章這個共同的設計元素。
重點就是，UI 設計時，觀點要跳脫單一元件，整體的畫面、前後的畫面都要考慮，
才不會產生違和感。
卡比 UI 團隊的第三大重要事項，是不要忘記「玩心」。
UI 設計當然是以容易使用、能夠清楚直接的呈現資訊為基本原則，不過如果能夠在 UI 裡面加入一點可玩性或與世界觀相融合的設計，將能夠為玩家帶來更加興奮的體驗。
在「重視功能性的設計」與「充滿玩心的設計」之間如何取得平衡，往往讓他們花費許多心思。
以《新星同盟》的難度選擇畫面為例，他們加入了難度愈高，卡比的表情與介面演出就愈誇張的效果，即使因為圖像效果太過強烈，影響了文字的可讀性，卻具有更明確的資訊傳達效果。
又例如錄音室(音樂鑑賞)模式的畫面，主要的功能性僅止於選取曲目、播放音樂，卡比的 UI 團隊仍加入了卡比樂團、點唱機等許多視覺上的演出。
範例三則是先前提過的《卡比獵人隊》手帳型任務選擇畫面，製作了翻頁的演出效果。
卡比系列遊戲的一大特色是：收錄大量的遊戲模式。為了強調這種豐富的多樣性，他們不採取統一風格的設計，而故意讓每種模式都各自採用不同的圖像化字體，給玩家目不暇給的感覺，並且可以明顯看出各自屬於不同的遊戲玩法。
適當的為 UI 加入圖像或演出的變化，讓遊戲的 UI 光是看起來就覺得很有趣，能夠更加強化遊戲的魅力。
接下來，要談的是卡比系列在 UI 設計上的傳統與挑戰。多數人對「卡比系列」的印象，可能是「很可愛」吧？但對團隊而言，他們追求的並非可愛感，而是「溫暖感」。
先說系列作傳統上的溫暖感，最基本的，就是避免掉攻擊性的、尖銳的形狀，即使是在描繪銳角型物件時，最尖端處都仍是圓弧狀的。
其次，是避免使用刺激眼睛的強烈對比或顏色，就算是白底黑字的場合，也只有標題、副標會採用全黑全白色，內文會改用灰黑色，來降低整體的對比度。又例如投影片右側的道具欄，即使有需要呈現對比性，也會將深色稍微淡化，並減少在畫面上的整體所佔比例。
然後，是避免在單一畫面內放入大量的資訊。以這個範例介面來說，將玩家人數、模式、關卡的選項都放在單一畫面內，這是很常見的作法，也沒有什麼不好。
但因為卡比的玩家年齡層較廣，也包含了對遊戲較不熟悉的輕度玩家，所以有些情況下，他們會將選項拆開成多個畫面，讓玩家在一個畫面內一次只做一項選擇，創造一件一件事緩緩溫和向玩家確認的感覺，降低選擇上的困惑感。
貼心、設想、安心感，這些讓 UI 看起來舒服的要素，是卡比系列傳統的溫暖感，而在這系列遊戲持續發展新作的情況下，製作團隊也必然會面對許多新題材或風格的挑戰。
《機器人星球》，就是卡比系列遊戲中，相對強調科幻感的一作，左側的初期 UI 設計，是以機器人的駕駛艙面板為概念繪製，雖然造型上已經很圓滑，但還是給人冰冷厚重的感覺，經過調整後的最終設計，則變得較為明亮清爽。
《卡比獵人隊 Z》則是加入了奇幻 RPG 要素的作品，為了營造古典奇幻風格的氣氛，大量使用紙張、木紋等材質，無法像以往那麼色彩繽紛，為了彌補，在邊框裝飾上下了很多功夫，增加精緻度與豐富性。
《觸摸！卡比 超級彩虹》的特色是彷彿黏土構成的遊戲世界，UI 當然也盡量採用黏土風格呈現。
還有，設計時也要配合硬體的特性和時代的風格流行。在 3DS 上面的《三重豪華版》與《機器人星球》，採用的是「Skeuomorphism Design」(擬真化設計)，這是在智慧型手機上曾經流行一時的圖像設計方式，對於較低解析度的攜帶型主機來說，可以有效強化畫面的質感。
而到了高解析度畫面的《新星同盟》，時代流行的就變成了扁平化設計，也由於硬體提升了，所以可以加入許多的動態圖像與轉場效果。同時，他們也意識著不要搞得太過「可愛」，而加入了歪斜、「有形」的設計元素。
這部分的結論是，卡比的 UI 團隊，會將「基礎要素」與「溫暖感」作為設計的根基，再依照作品的特性，挑戰新的視覺風格。
最後，是卡比 UI 團隊所使用的工具介紹，這些工具有一部份是內部開發，沒有對外提供，但讀者可以參考這些機能，自己開發類似的工具，或尋找能夠達到類似效果的既有套件。
首先是素材表，他們有一個可以在網頁上檢視所有素材的工具，網頁上可以直接看到素材的圖樣、被使用的場所，而且這列表是自動產生。
圖像文字也有專門的列表，可以快速的一覽對照，查找每個語言所使用的字體等等，並可以讓檔案針對不同語言自動命名。
在圖像處理軟體裡面，使用了 GroupExporter 外掛，能夠讓採用固定重複圖層、與搭配不同圖層繪製出來的同類圖示，以自動批次方式快速輸出成檔案。
遊戲內，設計了文字寬度自動調整的機能，當文字長度超過顯示範圍時，會自動壓縮文字的寬度，避免換行爆格。
讓設計師可以自由指定字體大小、行距與顏色的設計。不同語言的顯示特性不同，例如日文會需要標註漢字注音，所以行距會保留較多，歐系語言則不需要，因此程式不能將顯示方式寫死，而要保留讓 UI 設計師手動調整的空間。
接著是與除錯相關的機能。首先遊戲在切換成不同語言時，要能即時顯示目前是哪個語言，畢竟不是每個設計師或測試員都精通多國語言，隨時顯示出來可以免除誤判。
然後，是隨時都可以顯示所有 UI 元件名稱與狀態的機能，將滑鼠移到「...」的框框上，就會顯示出該 UI 元件的檔案名稱、動畫畫格等狀態，當出問題的時候，可以迅速確認。
還有，將文字表示範圍視覺化的機能，這在進行多國語言化的時候，能夠起很大的幫助。
上述舉例的這些工具或功能，都可以增加開發環境的便利性，也就就能夠讓設計師們有更多反覆試誤的時間，以達到更好的 UI 呈現效果。
最後，回顧整場演講的重點，就是：
- 考量易用性
- 考量遊戲整體的流程
- 不要忘記玩心
- 建立傳統，並且持續挑戰！
