使用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中文网其他相关文章！