遊戲角落設計最佳做法

以下設計最佳做法有助於確保使用者在各種裝置和平台上,在 YouTube 上玩遊戲時提供最佳體驗。

除了作業系統元件外,遊戲角落體驗主要包含以下三個元件:

  • 遊戲角落動作
  • 遊戲畫布
  • 選單和對話方塊

顯示三個元件位置的畫面檢視畫面

這些遊戲設計最佳做法提供針對遊戲畫佈建構遊戲的建議。

調整遊戲大小

遵循這些做法,確保遊戲適用於不同的螢幕大小和方向。

調整遊戲大小,並根據畫布的大小和長寬比調整使用者介面。

顯示未以全螢幕模式玩遊戲

如果遊戲無法依照遊戲畫布大小和顯示比例完全回應,請使用左右黑邊或上下黑邊。

觸發捲軸

避免觸發捲軸。捲軸會對遊戲體驗和一般導覽造成負面影響。填滿畫布時,避免導致遊戲在畫布中捲動。捲軸可用於刻意捲動,例如在遊戲 UI 中捲動瀏覽長垂直清單時。在理想情況下,遊戲必須完全負責可視區域。

遊戲資源調度

在不同螢幕解析度中清楚呈現 (不會模糊、像素化或延展)。

在解析度較低的螢幕 (例如 360x800 行動裝置) 和高解析度螢幕 (例如 3840x2560 電腦螢幕) 上算繪遊戲 UI (文字、圖示) 時,遊戲 UI 會適當縮放。

清楚且模糊的獎盃圖示並排比較

避免在放大至大螢幕時,避免低解析度光柵化素材資源。

字體排版

確保在各種裝置和螢幕大小上均清晰易讀。

按鈕、選單和對話泡泡等遊戲中顯示的文字必須在不同裝置和螢幕大小上清楚易讀。方法是自動縮放及調整文字,或提供使用者調整字型大小的設定。

如果文字小於 18 pt,或者文字為粗體且小於 14 pt,請將色彩對比率設為至少 4.5:1。

如果文字為其他格式,色彩對比率至少須為 3:1。

如需一般參考資料,請參閱 WCAG2.1

使用較大的字體,且字體粗細和對比鮮明,方便使用者閱讀。在本例中,對比度為 4.48:1。 避免使用小型字體和低對比色。在這個示例中,對比度為 3.07:1。

互動

本節將說明使用者互動和相關元素的最佳做法。

觸控目標

調整觸控目標的大小,方便使用者互動。

確保觸控目標至少為 48x48 dp,且目標之間留有至少 8 dp 的空間 (請參閱「質感設計指南」),以利互動。

在此範例中,視覺化轉譯按鈕為 24 dp,隱藏的觸控目標則在圖示周圍 12 dp,藉此達到 48x48 dp 的觸控目標。

顯示轉譯後按鈕的尺寸

在圖示和按鈕周圍加入邊框間距,提升觸控目標大小。

按鈕

為每個按鈕狀態使用不重複的樣式:

  • 已啟用
  • 已停用
  • 懸停 (適用於非觸控輸入裝置)
  • 專注
  • 按下

您也希望按階層區分按鈕。例如「開始」選單中的主要與次要動作按鈕 (請參閱 按鈕的 Google Material 2 設計指南)。

顯示各種狀態樣式檢視畫面

區別每個按鈕狀態的專屬樣式

鍵盤輸入

為提升遊戲在不同裝置和使用者的無障礙程度,除了觸控和滑鼠輸入外,還支援所有遊戲控制項和螢幕瀏覽功能的鍵盤輸入功能。

如果遊戲支援鍵盤輸入功能,請允許使用者使用 Esc 鍵關閉任何遊戲內的選單和對話方塊。這除了有視覺化的關閉按鈕 (例如頂端角落的 X 圖示) 以外。強制回應或對話方塊的常見示例包括「設定」選單、「暫停」選單、錯誤訊息,以及「說明」資訊彈出式視窗。

避免將任何動作對應到長按 Esc 鍵,因為這種做法的用途是在電腦版網路瀏覽器退出全螢幕模式。

如果遊戲已註冊按鍵事件監聽器:請勿搭配 Esc 按鍵事件使用 preventDefault()。在 Safari 中進入全螢幕模式時,這樣會導致遊戲在不離開全螢幕模式的情況下使用按鍵按下事件。

觸覺回饋

建議您視情況使用觸覺回饋 (震動) 讓遊戲更有趣、更具臨場感。

關鍵遊戲時刻

本節說明遊戲中的重要時刻,為玩家提供良好的體驗。

教學課程

提供簡短的教學課程或新手入門等級,協助新玩家一臂之力。

新手上路可確保使用者瞭解基本的遊戲過程和必備遊戲基本知識,能夠盡情暢玩遊戲。

由於遊戲角落旨在讓使用者能快速輕鬆地開始玩遊戲,請盡可能減少新手上路體驗。雖然並非所有遊戲都需要教學課程,但大部分遊戲都是透過一些新手上路形式獲得好處。請考量玩家必須知道的關鍵機制、規則和技能,才能成功暢玩遊戲並享受遊戲樂趣。

教學課程可以是以下格式:

  • 遊戲開始前的一組畫面 (最好能視情況在遊戲中配合情境顯示)
  • 使用者執行的實際教學課程等級

暫停

向使用者清楚說明遊戲狀態。

向使用者清楚說明遊戲暫停時,以及如何恢復遊戲。避免讓使用者認為遊戲凍結或停止運作。

顯示「暫停」和「繼續」按鈕

清楚將遊戲狀態標示為「已暫停」,並提供恢復遊戲的明確動作 (按鈕)。

比賽結束

通知使用者已經完成上個關卡或已完成遊戲。

如果遊戲有明確的結束 (例如,關卡數量有限),請向使用者清楚說明這項事實。這可避免玩家認為遊戲損毀或凍結。在理想情況下,遊戲會表揚並讚揚玩家完成遊戲。

音訊

遊戲可包含特效、語音和背景音樂的音量控制選項。控制項可以包含滑桿來調整音量或兩者皆有的靜音切換。

背景、SFX、對話方塊的不同音訊設定

無障礙功能

無障礙設計可讓使用者遊玩並享受遊戲。

有別於網頁和軟體設計,遊戲設計的業界標準無障礙功能指南不存在。如需查看多元包容遊戲設計的其他指引,請參閱「遊戲無障礙指南」。建議您思考如何將這些規範應用於遊戲設計。