Dev Derby – 每月一次的开源技术演示竞赛

从六月开始,Mozilla 每月举办一次竞赛,以展示最新的 Web 技术。在这项国际竞赛中,个人可以提交演示,向世界展示在现代浏览器中使用开放和免费技术可以实现多少功能。

每月都会举办的 Mozilla Dev Derby 将围绕某项特定技术展开。评审团将选出获胜者,并颁发奖品,包括很棒的笔记本电脑包、Android 手机和独家的 MDN T 恤。最重要的是,你可以看到 Mozilla 在这里、在 Derby 网站上宣传你的名字,我们还会对所有获胜者进行简短的采访。

许多公司花费大量时间和精力来创建演示来宣传他们的浏览器、开发环境或平台。虽然这很棒,但我们认为专注于一次一项技术并构建更小、更专注且文档更完善的演示会带来更好的学习体验。这就是我们希望你成为驾驶员,向我们展示你能做什么的原因。学习新技术的最佳方法就是亲身体验。

Mozilla Dev Derby 的规则很简单:

  • 你的演示必须在当前版本的 Firefox、Firefox Beta 或 Firefox Aurora 中运行,无需插件。
  • 你必须包含所有源代码,包括任何二进制组件的源代码。
  • 条目描述必须清晰准确。
  • 演示必须主要是你自己的作品,不得包含未经授权的他人知识产权。
  • 你的条目名称不得包含任何 Mozilla 商标。
  • 条目必须使用开放的 Web 技术,例如 HTML、CSS 和标准 JavaScript API。
  • 允许使用免费提供的库和模块;不允许使用专有库和模块。

为了开始,我们选择了 CSS3 动画 作为第一个挑战。使用 CSS 对页面内容进行动画处理,并创建电影风格的开场动画(还记得 AT-AT 步兵车演示 吗?),向我们展示设计师如何在不需要插件或脚本知识的情况下进行动画处理。注意:Firefox 5 将引入对 CSS3 动画的支持。你应该 使用 Firefox Beta 或 Aurora 通道 参加此次 Dev Derby。你的演示无法在 Firefox 4 中运行。;-)

所以,女士们,先生们,启动引擎,前往 Mozilla Dev Derby 网站吧。

关于 Chris Heilmann

HTML5 和开放 Web 的布道者。让我们一起解决这个问题吧!

更多 Chris Heilmann 的文章……


20 条评论

  1. Sean Hogan

    “向我们展示设计师如何在不需要插件或脚本知识的情况下进行动画处理”是指页面上没有脚本吗?

    2011 年 6 月 7 日 下午 6:34

    1. Jay Patel

      @Sean:是的!使用 CSS3 动画,你不需要脚本就能让事物动起来。;-)

      2011 年 6 月 9 日 下午 2:34

    2. leo

      酷!

      2011 年 6 月 28 日 下午 11:41

  2. Dave Poyzer

    有趣的是,AT-AT 步兵车在 Firefox 中无法运行。

    2011 年 6 月 9 日 上午 10:32

    1. Jay Patel

      @Dave:原始版本在 Firefox 中无法运行……但我们已更新链接,其中包含一个可以运行的版本。快去看看吧!

      2011 年 6 月 9 日 下午 4:12

  3. Sean Hogan

    @Jay:谢谢,但我问的是演示提交——是否允许他们在页面中使用脚本?

    2011 年 6 月 9 日 下午 3:49

  4. Jay Patel

    @Sean:抱歉,回答你的问题:你可以在页面中使用 JS……但请确保 CSS 能在没有 JS 的情况下完成它需要做的工作。我们会根据一些因素进行评判……其中一项就是技术的应用……所以,只要你的演示中主要的吸引力是 CSS 动画,你应该没问题。

    2011 年 6 月 9 日 下午 3:53

  5. Richard

    AT-AT 动画在 Ubuntu 11.04 上的 Firefox 中无法运行。

    2011 年 6 月 19 日 上午 7:58

    1. Timothy

      现在可以了——Firefox 已在仓库中更新到版本 5,检查你的更新。

      2011 年 6 月 22 日 上午 4:10

  6. calvin

    我的 Mozilla 无法看到照片。

    2011 年 6 月 22 日 上午 9:55

  7. DGASKINS1

    你好,我在这方面是新手,请耐心点,我的视力不好,换句话说,我看得不太清楚,我需要很多帮助/ 我可以找到志愿者吗?

    2011 年 6 月 22 日 上午 10:50

  8. Kiel

    刚更新到 Firefox 5,AT-AT 看起来太棒了!

    2011 年 6 月 22 日 下午 2:10

  9. whoever

    Dgaskins1,我们在这方面的情况一样。
    你需要什么方面的帮助?

    2011 年 6 月 23 日 上午 9:27

  10. mielnka

    这真的很棒。 ;)
    从六月开始,Mozilla 每月举办一次竞赛,以展示最新的 Web 技术。

    2011 年 6 月 24 日 上午 11:06

  11. john

    更新到新版本,太棒了!

    2011 年 6 月 24 日 下午 2:09

  12. Narasimharao Chirunomula

    看起来很有趣。

    2011 年 6 月 25 日 上午 10:59

  13. CSS Webstandard-Blog

    Christian,这是一个很棒的想法,也是一种非常不错的竞赛。但 CSS3 动画只有 59 个提交,数量并不多。但参与者越少,获奖的几率就越大;o)

    2011 年 6 月 27 日 上午 7:42

  14. De Jonge

    我有一个挑战建议。

    目前 html5-games.org 上有 372 款游戏,其中只有 1 款是真正的“逃离密室”类型游戏。这里只列出了一款游戏:
    http://www.html5-games.org/index.php?category=Escape

    另外两款(冒险)游戏,“Grisly Manor 的秘密”和“KnifeTank:幽灵”,算是“逃离”游戏,但不是真正的逃离游戏。

    市面上有很多 Flash 逃离游戏。它们可以使用 WebGL、CSS3、Canvas、SVG 等创建。

    我认为这是一个有趣的挑战,因为即使是缺乏艺术技能的人也可以创造出有趣的东西。他们基本上可以使用某些开放的 Web 技术创建一个具有挑战性的谜题,并展示其可能性。通常情况下,某些物品是隐藏的,或者需要与其他元素进行交互。

    2011 年 6 月 28 日 上午 8:00

  15. amebe

    我喜欢它。

    2011 年 7 月 2 日 上午 5:46

  16. ariel

    我有一个挑战建议。

    目前 html5-games.org 上有 372 款游戏,其中只有 1 款是真正的“逃离密室”类型游戏。这里只列出了一款游戏:
    http://www.html5-games.org/index.php?category=Escape

    另外两款(冒险)游戏,“Grisly Manor 的秘密”和“KnifeTank:幽灵”,算是“逃离”游戏,但不是真正的逃离游戏。

    市面上有很多 Flash 逃离游戏。它们可以使用 WebGL、CSS3、Canvas、SVG 等创建。

    我认为这是一个有趣的挑战,因为即使是缺乏艺术技能的人也可以创造出有趣的东西。他们基本上可以使用某些开放的 Web 技术创建一个具有挑战性的谜题,并展示其可能性。通常情况下,某些物品是隐藏的,或者需要与其他元素进行交互。

    2011 年 7 月 3 日 上午 3:41

本文的评论已关闭。