MicrosoftのWeb戦略―MIX11最速レポート

世界が認めた日本のクリエイティブ「SVG女子」――カヤック吾郷協氏に訊く

MIX11, mixjpn, SVG, カヤック, kayac, SVG女子, jsdo.it, レンダリング, アニメーション

この記事を読むのに必要な時間：およそ 2 分

コマを活かしたSVGの表現力

Q： 日本らしさ，インパクト，技術，これらの組み合わせからSVG女子が誕生したのですね。SVG女子というネーミングもとてもユニークですね。
それでは，SVG女子の特徴について教えてください。

吾郷： 技術的な面では，IE9がサポートしたSVGやHTML5のGPUアクセラレーションを活用したSVGレンダリングによるアニメーションという点が一番の特徴です。もう1つが，gihyo.jpでの連載でも取り上げられているjsdo.itをプラットフォームに使っている点です。jsdo.it上ではSVG女子アニメのタイムラインや構成も変更可能となっています。ユーザ参加型のパラパラAnimationができるのもSVG女子ならではですね。

ブラウザ上で色を変えて遊ぶこともできる

ブラウザ上で色を変えて遊ぶこともできる

Q： 今回，IE9に特化した作品とも受け取れるのですが，そのあたりは意識しているのですか？

吾郷： いえ，特別にIE9だから，ということを意識してはいません。というのも，IE9を含め，それぞれのブラウザが日々進化をし続けており，今は表現に関してブラウザ間の大きな差異はないと思っています。ですから，開発している最中も，IE9だからできる機能/できない機能というのを入れているつもりはないですね。ただ，繰り返しになりますが，当初のニーズにもあったように，IE9で強化されたGPUアクセラレーション，SVGの描画速度については意識しています。

Q： なるほど。では，SVGでアニメーションを作成するに当たってどのあたりを工夫しましたか？

吾郷： 最も工夫したのが，映像アニメーションをコマに落とす作業，「⁠アニメの最適化」です。元となるアニメは神風動画さんによるものです。これをそのまま使うとなると，データサイズが非常に大きくなり，サイトで扱うには無理があります。そこで，元のアニメの品質を落とさず，かつ，SVGで表現できる線画に落とし込むという作業を，弊社内の多くのデザイナーの協力を得て実現しました。
たとえば，線の本数を減らしたり，色味のある部分については特定の部分を塗った上で，レイヤを重ねて表現したりしています。こうすることで，元の素材が持っていた表現力は落とさずに，データサイズを落とすことができます。

未来のブラウザへの期待

Q： さて，今回のMIX11では，早くも次のInternet Explorerのバージョン，IE10のPlatform Previewがお目見えしました。エンジニアの視点から見て，Webブラウザの進化に対してコメントはありますか？

吾郷： IEだけではなく，他のブラウザに対しても言えることですが，これまでブラウザベンダが注力していた部分，とくにプログラマが不満に思っていた部分がかなり改善できていると感じています。たとえば，描画速度などは本当に改善されてきています。
開発者の視点では，ブラウザ上での開発効率に期待したいですね。Webの開発を行うとき，サーバサイドの開発環境が整っている一方で，フロントエンド側のツールはまだ少ないように感じています。たとえばJavaScriptのテストやデバッガツールです。このあたりは，ぜひブラウザベンダに注力してもらいたい点です。

4月26日，SVG女子日本デビュー！

Q： 最後に，日本のSVG女子リリースに向けてメッセージをお願いします。

吾郷： 今回，SVG女子を作成していてい感じたのが，技術的要素が強い部分については海外へのプロモーションを意識する必要があるなという点です。ブラウザの標準化が進むとともに，Webのグローバル化というのが進んでいます。
SVG女子に限った話ではないですが，弊社が提供しているwonderfl（wonderfl build flash online）やjsdo.itでも海外のユーザが多数おりますし，MIX11に参加させて頂き，これからはますます海外へ目を向ける必要があることを再認識できました。今後は，SVG女子のように世界公開の後に，日本公開という，日本のWebクリエイティブが増えていくかもしれません。

キーノート中，内容をイメージしたペインティングが行われていた。取材の最後に，完成した絵の前で撮影しました。吾郷氏左にあるのが，（⁠描き手の人の）SVG女子のイメージ

キーノート中，内容をイメージしたペインティングが行われていた。取材の最後に，完成した絵の前で撮影しました。吾郷氏左にあるのが，（描き手の人の）SVG女子のイメージ

さて，SVG女子の日本公開はIE9日本語版のリリース日である2011年4月26日0時です。リリース後には，ぜひIE9日本語版をダウンロードし，SVG女子を楽しんでください。jsdo.itを使えばSVG女子をforkできますので，ぜひ皆さんに，新しいSVG女子を生み出してもらいたいですね。
最後に，今回，日本マイクロソフト様と一緒に仕事をさせていただいて感じたのが，いわゆるネットの大手企業と，弊社のようなベンチャー企業のコラボレーションというのは非常に相性が良いという点です。そこで重要なのが，アイデアと技術です。これからも，日本のクリエイター，ベンチャー企業が，どんどん世界に向けて情報を発信していくことを願っています。

日本より一足早く全米で公開中。SVG Girl

日本より一足早く全米で公開中。SVG Girl

MIX11, mixjpn, SVG, カヤック, kayac, SVG女子, jsdo.it, レンダリング, アニメーション

著者プロフィール

馮富久（ふぉんとみひさ）

株式会社技術評論社クロスメディア事業室部長代理。

1975年生まれ。横浜市出身。1999年4月株式会社技術評論社に入社。入社後から『Software Design』編集部に配属，同誌編集長（2004年1月～2011年12月）や『Web Site Expert』編集長を歴任。その後，2008年9月に設立したクロスメディア事業部（現クロスメディア事業室）の責任者として，イベントやWeb・オンライン企画を統括。現在は，技術評論社の電子出版事業を中心に，デジタル・オンライン事業を取りまとめる。社外活動として電子書籍を考える出版社の会の代表幹事やWebSig 24/7のモデレーター，TechLIONプロデューサーなども務める。過去にIPAオープンソースデータベースワーキンググループ委員やアックゼロヨン・アワード他各賞審査員などの経験を持つ。

Twitte ID：tomihisa（http://twitter.com/tomihisa/）