hat.io ってサイトで、デベロッパーやクリエイター向けのコンテスト 「Golden Hat Contest (ゴールデンハット コンテスト)」 っていうのが開催されています。
その、1st Contest の方のお題が 「HTML5 ロゴを使ったクレイジーな何か。もしくは、ハット (hat.ioロゴ) を使ったクールな何か。」 とのことでしたので、クールなのは無理だけど、クレイジー (技術的な意味じゃなくて) なやつなら行ける! ってことでちゃちゃっと作って応募してみました。
コンテストの概要としては下記の通り。
昨今のWeb技術の進化は著しいばかりで、少し前までとは桁違いの表現力を備えています。当コンテストでは、技術力の高さや理解の正確さなどもさることながら、前述のような表現力を最大限に活かした「面白い作品」「クレイジーな作品」であることを特に重視したいと考えています。誰も見たことがないような表現やアイデアを、お待ちしています!
で、募集要項は、下記のように、
- テーマは「HTML5ロゴ」「ハット」どちらをモチーフにしても構いません。
- 制作にあたっては必ず、HTML5、CSS、JSの技術を用いてください。
HTML5 のロゴか、ハット (hat.ioロゴ) をモチーフにしていて、HTML5、CSS、JavaScript を使ってればいいってことなので、応募期間の間に他の人がすごいのを作ってくる前、まだ応募の敷居が低いうちに、一番乗りで出してやるぜと、仕事の合間にサクッと作って、勢いで応募しておきました。後悔はしていない……
スペースハリアーにインスパイアされてみた。ちなみに、Google Chrome でしか動かないと思います。Firefox とかだと、地面がスクロールしない。Firefox でも動くように修正しました。ホントはハリアーさんも飛ばそうと思ったんだけど、いい画像がなかったんで断念。
なお、この地面のスペースハリアー的な何かは、jsdo.it で TFujinami 氏が公開されていたものを使わせていただいています。これがメインなので、私ほとんど何もしてないっていう噂も……
HTML5 のロゴは、W3C HTML5 Logo のサイトで公開されているものの、SVG バージョン。地面は前述の通り、TFujinami 氏のソースコードを基に。ロゴも CSS でアニメーションさせてるだけなので、技術的にたいしたことはやってないです。
最初はもっとたくさんロゴを飛ばしてみたんだけど、目がチカチカして危険なニオイがしたので間引きました。でも間引きしたらクレイジー感がなくなっちゃった。最初はもっとクレイジーな感じだったんだけど。
ということで、このコンテストの応募期間は 2013年05月08日 00:00 までとのことで、まだまだ時間がありますので、今後はもっとホントにクールでクレイジーなヤツが集まってくると思いますが、そういうの作れる方、試しに応募してみてはいかがでしょうか。