与 Michal Biniek 的问答:HTML5 黑客和 Dev Derby 常胜将军

编者注:Michal Biniek 是 Innogames Lagoonia 团队的前端开发人员,并且热衷于 JavaScript 和 HTML5/CSS3、WebSockets 和 WebRTC 等新兴 Web 技术。去年 11 月,michal.bMDN 开发者 Derby 中凭借 Rob in Soundland(一个奇幻的 Canvas 演示)获得了第二名。

这是 Michal 的演示第四次进入 Derby 决赛,也是他第三次获奖。如果您从去年 Derby 启动以来就一直关注它,您可能还记得看到过 Fly, fly!Too Many Fish in the Sea。祝贺 Michal,我们期待看到您的下一个演示!即将举行的 Derby 现已开放投稿:CSS 3D 变换、音频和 Web Sockets API。


请告诉我们关于开发 Rob in Soundland 的情况以及您的想法来源。

我最初的 Canvas 演示想法是准备某种可视化效果——声音可视化,可以实现视觉和听觉两种感官之间的良好连接。我认为如果用户可以通过键盘或鼠标与应用程序交互,那就更好了。

最终我决定开发一个简单的第三人称视角无限世界游戏,其中主角 Rob 在播放不同音符的彩色(几乎是迷幻的)方块中漫游。

有趣的是,游戏不包含任何外部媒体元素,例如图像或声音。所有内容都是使用 HTML5 技术生成的:图像在游戏开始时预先生成,声音使用 音频数据 API 即时创建和播放。

Rob in Soundland - Canvas demo screenshot

您还记得您的第一台电脑和第一个网站吗?

我的第一台电脑是 Elwro Junior——ZX Spectrum 电脑的波兰版本(此处为英文描述)。几年后,我得到了我的第一台 PC,里面装有 486 25MHz 处理器和一个神奇的“turbo”按钮。

我与网站的渊源始于 1999 年,当时我创建了一个关于我的爱好——滑雪和天文学的网站。我甚至使用 JavaScript 和 DHTML(很久以前的流行词)添加了一些动画。
从不使用 marquee 标签;)


您是如何开始编码和黑客攻击的?

我开始在 ZX Spectrum 上使用 BASIC 进行编码,但不久之后我就转向了新 PC 上的 Turbo Pascal。我认为重要的是,我的父亲是学校的 IT 教师——所以当我在编程方面遇到问题时,我总是可以向他寻求帮助。

对我来说,视觉是应用程序最重要的方面之一。因此,我发现 Delphi/C++ Builder 是构建 UI 的非常好的解决方案。这也是我从一开始就喜欢 HTML 的原因——作为构建 UI 的完美语言,结合 JavaScript,运行动画比在表单上运行动画要容易得多。

您提到您来自波兰的弗罗茨瓦夫,并在 Innogames 担任 Web 开发人员?您是远程工作吗?您使用什么工具进行开发?

实际上,我住在汉堡,半年前我在 Innogames 找到了一份软件开发工作。但是,我仍然经常去弗罗茨瓦夫。

我所在的团队负责开发 Lagoonia,这是 Innogames 开发的最新游戏之一。浏览器中的现代 Javascript 引擎使我们能够充分利用 JavaScript(以及 HTML5 中的新功能,如声音和画布)。我们可以创建能够轻松与基于 Flash 的游戏竞争的游戏,而无需额外的运行时机器!

Lagoonia by Innogames

我通常使用 Eclipse 开发 JavaScript 应用程序。我发现它是一个相当不错的代码编辑器(尽管有时速度较慢),并且代码自动完成功能运行得很好。对于测试和调试,我使用 Firebug 和 Firefox 中的内置控制台,这是有史以来最好的 Web 应用程序调试工具之一。

您玩在线游戏吗?哪些游戏影响了您的工作?您现在玩得最多的游戏是什么?

我在学生时代发现了在线游戏。我从 FPS 射击游戏开始,然后转向了诸如 MuOnline 之类的 MMORPG。我认为多人游戏是游戏的未来——与真正的玩家一起玩通常比与电脑对战更有趣。

我目前所在的公司 Innogames 也专注于在线游戏(主要是浏览器游戏),其中最重要的部分是与其他用户的合作。

我们仍然可以看到旧游戏(甚至来自 ZX Spectrum 时代的游戏)焕发新生,采用了新的精美图形和多人模式,这些游戏如今都是畅销品。然而,许多独立游戏向我们展示了全新的游戏概念——我认为这些类型的游戏对我影响最大。

除此之外,我真的很喜欢 Valve 游戏——尤其是 Half Life/Portal 宇宙中精彩的故事。

您 8 月份 History API 演示的 Nyan Cat 版本提醒我们,模因在互联网上传播的速度有多快。请告诉我们关于 Fly, fly! 的情况以及您的想法来源。

找到一个关于 History API 用法的原创想法相当困难,在我看来,History API 专门为使用 AJAX 设置内容的网站准备。但是,它也可以用作虚拟旅行的时间轴。这个项目的最初想法是乘坐飞机穿越不同的城市。
然而,我发现它很无聊,所以我决定添加流行的 Nyan Cat——最积极的模因之一——作为可选的交通工具。这个选择导致 Nyan Cat 在空中留下彩虹色的尾迹,而不是留下白线,这使得世界更加丰富多彩,对人们更加友好。

此外,所有内容都与演示的原始概念相匹配,甚至不同的图形看起来也更好——深色背景、Nyan Cat 而不是飞机,以及色彩缤纷的旅行路径。

Fly, fly - History API demo

自该计划启动以来,您已经提交了 7 个 Dev Derby 演示,其中 4 个成为决赛入围者。恭喜并感谢您!您正在开发另一个演示吗?您想告诉我们其他任何很酷的项目吗?

谢谢!目前我正在使用 触摸事件 开发另一个简单的游戏,但是项目规模有所扩大,我不确定我是否能在截止日期前找到足够的时间完成它。
Zombie-kiwi-touchevents-demo screenshot

同时,我与我的同事 Barry Nagel 正在开发我们自己的 HTML5 游戏框架,名为 Machine5。该项目的目的是找到创建令人惊叹的 HTML5 游戏的最简单方法,并为开发人员提供简单易维护的项目结构。

Machine5 game engine


当您想到 HTML5 和新的 Web 技术时,您最兴奋的是什么?

我真的很高兴 Canvas 元素 目前得到了广泛的应用,我可以自由地使用它。它是简单游戏的完美解决方案——我希望 WebGL 很快也能在所有浏览器上可用,因为它是一个允许创建全屏游戏的强大功能。将这些技术与新的音频 API 以及 WebSockets 或 WebRTC 作为通信流结合使用,我们很快就可以期待像 Counter Strike 这样的真正 FPS 游戏,或者像 Sims MMO 版本这样的不太暴力类型的游戏;)

还有其他人帮助您进行演示吗?您想提到任何人吗?

我要感谢 Robert Zatycki 为所有关于游戏和其他应用程序的潜在想法的集思广益。我们讨论过的一些概念已用于游戏中。

我还想感谢我的兄弟 Paweł 和 Łukasz,他们在我在发布演示之前仔细测试了我的演示,并提供了坦率的反馈。

是什么激励您参与 Dev Derby?您能更多地谈谈开源、Mozilla 以及您为何做出贡献吗?

在 Dev Derby 比赛之前,我为 Chrome Experiments 和 Opera Widgets 网站准备了一些演示。然后我收到了 John Karahalis 的消息,他提到了一个新的 Mozilla 项目,专门针对新技术的演示。

目前,我发现 MDNJavaScript 最好的资源之一。Mozilla 为贡献、准备和推广新技术所做的所有工作都非常出色,对现代互联网至关重要。Firefox 是最受欢迎的 Web 浏览器之一(在波兰是最受欢迎的!),我认为这是用户也赞赏 Mozilla 优秀产品的最佳例证。

开源的一个理念非常重要:即使在当今几乎每个概念都可以获得专利的情况下,仍然有很多人愿意毫无保留地与其他开发人员分享他们的经验。我发现分享代码可以成为获得代码质量反馈以及获得其他潜在(有时更好)应用程序解决方案建议的最佳途径。