2010年09月28日

HTML5 で書道が楽しめる The Shodo の完成度がすごい

ちまたでは HTML5 が話題ですね。

「HTML5 ではこんなこともできます」といった紹介はいろんなところでみかけますが、「じゃあ、ぶっちゃけ、どんなサイトが作れるのよ」のイメージが沸きにくい人も多いのではないでしょうか。そんな中、HTML5 の機能を活用した完成度の高いサイトが登場していました。

その名も The Shodo。

ブラウザ上で書道体験

The Shodo ではこんな感じにブラウザ上で書道を楽しむことができます。

書くときにカーソルの位置に手が大きめに表示されるのが本当に書道している気分にさせてくれます。

硯をクリックして色の濃さを選んだり、筆をクリックして筆の太さを選んだりもできます。

トップページで [Write] を選ぶと書き始められるのですが、最初に動画で墨を擦って筆に浸す様子が表示されます。書く前に気持ちを落ち着かせて精神を統一させろ、ということなのでしょうか。

他にも、サイトのトップページを表示した瞬間、白いキャンバスに墨でバサッ、バサッと描かれるような一瞬のアニメーションが表示されたりと、このサイトでは動画が効果的に使われています。

このようなページに溶け込むように動画を埋め込む表現は、今まで Flash の専売特許だったのですが、HTML5 の video タグのおかげで Flash を使わなくても可能になってきています。

ちょっとしたアクセントに動画をうまく使っていて、Flash を使わなくてもここまでできるのか…と感心してしまいました。

また、一部のブラウザでは audio タグで BGM が再生されるので、これもまた雰囲気を盛り立てています。

作った作品を twitter に投稿したり、ギャラリーに掲載したり、ギャラリーで他人の作品をリプレイしたり…。機能豊富です。

実はこのサイト、IE9 の可能性を伝えるために日本の Business Architects 社が作ったサイトのようです。

手元の PC は Windows XP だったので IE9 beta はインストールできなかったのですが、Firefox や Google Chrome でも問題なく動いています。IE9 でも同様に表示できるようになると思うとワクワクしてきます。

ITmedia の記事によると

ライバルの“主要Webブラウザ”では、遅くてまともに使えない
「9」の時代はすぐそこ！：Internet Explorer 9“β版”発表会で知る最新の“動き” (5/5) - ITmedia +D PC USER

だそうなので、IE9 ではかなり高速に動くようです。といっても IE9 に向けて最適化してるはずで、一概に IE9 がマンセーとは言い切れないですが、あの悪名が高かった IE でここまで動くというのは素晴らしいことです。

IE9 の他のサンプルは Beauty of the Web という特設サイトに掲示されているようです。