WWW Watch

HTML5 ロゴがクレイジーに迫ってくる何か。「Golden Hat Contest」 に応募してみた

「HTML5 ロゴを使ったクレイジーな何か。もしくは、ハット (hat.ioロゴ) を使ったクールな何か。」 をお題に開催されている Golden Hat Contest に応募してみました。

HTML5hat.io ってサイトで、デベロッパーやクリエイター向けのコンテスト 「Golden Hat Contest (ゴールデンハット コンテスト)」 っていうのが開催されています。

その、1st Contest の方のお題が 「HTML5 ロゴを使ったクレイジーな何か。もしくは、ハット (hat.ioロゴ) を使ったクールな何か。」 とのことでしたので、クールなのは無理だけど、クレイジー (技術的な意味じゃなくて) なやつなら行ける! ってことでちゃちゃっと作って応募してみました。

コンテストの概要としては下記の通り。

昨今のWeb技術の進化は著しいばかりで、少し前までとは桁違いの表現力を備えています。当コンテストでは、技術力の高さや理解の正確さなどもさることながら、前述のような表現力を最大限に活かした「面白い作品」「クレイジーな作品」であることを特に重視したいと考えています。誰も見たことがないような表現やアイデアを、お待ちしています!

Golden Hat Contest : 1st Contest HTML5 on hat.io から引用

で、募集要項は、下記のように、

  1. テーマは「HTML5ロゴ」「ハット」どちらをモチーフにしても構いません。
  2. 制作にあたっては必ず、HTML5、CSS、JSの技術を用いてください。

Golden Hat Contest : 1st Contest HTML5 on hat.io から引用

HTML5 のロゴか、ハット (hat.ioロゴ) をモチーフにしていて、HTML5、CSS、JavaScript を使ってればいいってことなので、応募期間の間に他の人がすごいのを作ってくる前、まだ応募の敷居が低いうちに、一番乗りで出してやるぜと、仕事の合間にサクッと作って、勢いで応募しておきました。後悔はしていない……

HTML5 ロゴがクレイジーに迫ってくる何か

スペースハリアーにインスパイアされてみた。ちなみに、Google Chrome でしか動かないと思います。Firefox とかだと、地面がスクロールしない。Firefox でも動くように修正しました。ホントはハリアーさんも飛ばそうと思ったんだけど、いい画像がなかったんで断念。

なお、この地面のスペースハリアー的な何かは、jsdo.it で TFujinami 氏が公開されていたものを使わせていただいています。これがメインなので、私ほとんど何もしてないっていう噂も……

HTML5 のロゴは、W3C HTML5 Logo のサイトで公開されているものの、SVG バージョン。地面は前述の通り、TFujinami 氏のソースコードを基に。ロゴも CSS でアニメーションさせてるだけなので、技術的にたいしたことはやってないです。

最初はもっとたくさんロゴを飛ばしてみたんだけど、目がチカチカして危険なニオイがしたので間引きました。でも間引きしたらクレイジー感がなくなっちゃった。最初はもっとクレイジーな感じだったんだけど。

ということで、このコンテストの応募期間は 2013年05月08日 00:00 までとのことで、まだまだ時間がありますので、今後はもっとホントにクールでクレイジーなヤツが集まってくると思いますが、そういうの作れる方、試しに応募してみてはいかがでしょうか。

Recent Entry

全ての記事一覧を見る

Hot Entry

逆引きおすすめエントリー