使用Web Audio和SVG創建可訪問的突破遊戲

本文是Microsoft Web開發系列的一部分，詳細介紹了使用WebGL，Web Audio和SVG創建可訪問的突破遊戲，並證明了視覺吸引人的遊戲可以完全包容。 作者是巴比倫（Babylon.js）的合著者，受到啟發，在一次會議上談論可訪問性之後，創建了一個普遍可玩的遊戲。

遊戲，可在Web音頻兼容的瀏覽器（Check Caniuse.com）中播放，並在GitHub上使用，利用了幾個關鍵的可訪問性功能：

• >>空間聲音（Web Audio API）：允許視覺受損的玩家通過音頻提示跟踪球的位置。
可伸縮的SVG圖形：
• 確保在所有屏幕尺寸和分辨率上顯示最佳顯示。 >
aria live區域：
• 為屏幕讀者提供遊戲更新而無需顛覆性語音綜合。 >
>自適應遊戲玩法：
• 在可訪問模式下包含更寬的槳和修改的音頻提示，以增強可玩性。
用戶測試：
• 對視覺障礙用戶精緻的音頻和遊戲玩法進行了廣泛的測試。 >
開源代碼：
• 源代碼可在github上獲得社區貢獻。

開發過程和實驗：

>該項目始於使用SVG的簡單突破克隆，後來使用Babylon.js的WebGL Starfield背景增強。 事實證明，具有空間聲音的初始實驗對於直觀的遊戲玩法來說太複雜了。 作者的兒子建議使用聲音播放速率和效果指示相對於槳的球位置，這是通過迭代測試進行完善的解決方案。 以可訪問模式的更寬槳板，並將球放慢屏幕底部附近，進一步提高了可玩性。

與盲人用戶一起測試

表明，初始空間音頻過於復雜。 簡化用於使用左右渠道的音頻提示以進行定向指導更有效。

SVG查看框可確保在不同的屏幕尺寸和分辨率上進行完美的縮放。

附加功能：

• ARIA Live區域（而不是語音綜合）：傳達遊戲狀態（剩下磚塊，獲勝/損失，得分）
>
• > CSS樣式：在可訪問模式下提供高對比度的視覺效果，可為具有不同視覺能力的用戶易於切換。 即使在可訪問模式下，這也允許視覺上吸引人的遊戲。 >

>本文結論是通過強調項目在創造真正包容性遊戲體驗並鼓勵對開源代碼的進一步發展和貢獻的成功結束。 它還促進了其他Microsoft資源以用於Web開發和可訪問性。 >

以上是使用Web Audio和SVG創建可訪問的突破遊戲的詳細內容。更多資訊請關注PHP中文網其他相關文章！