こんにちは、ロクナナワークショップの佐々木です。
最近のWebサイトには、「気持ちいい」と感じるような感覚を刺激する動きや、インタラクティブな仕掛けがいっぱい詰まっていますよね。

ユーザーに情報を提供するだけではなく、「驚き」や「楽しみ」といった、見る人に新しい感覚を発見・体感してもらう。

そこには、モーショングラフィック という手法が隠されているのです。

今日は、そんなイマドキのWebサイトを手掛けるクリエイタで、3Dを操るモーショングラフィック アーティストとして世界的にも活躍する ROXIK 城戸雅行さんにお話を伺いました。

■モーショングラフィックワークってどんなお仕事？
佐々木：城戸さんの作品には、モーショングラフィックを巧みに取り入れたFlashコンテンツが多くありますが、そもそも、モーショングラフィックワークってどんなお仕事なんですか？

城戸さん：「モーショングラフィックワーク」というのが、どこまでの範囲なのかによるけれど、ひとつの作品を作る場合の役割分担は、大きく分けると3つになるよね。

・企画
・デザイン
・プログラム

Flashにおいて、いわゆるモーショングラフィックというと、「何かしらのデザインをプログラムで動かす」ことにあたる。ただ、それだと作品にならないから、企画が必要になる。

■城戸さんが考えるモーショングラフィックワーク
僕の定義としては、モーショングラフィックワークというのは、企画（どうやったら「面白い・心地いい・感動する」ものになるのかを考えること）、プラスそれを表現するためのデザインと、実装するためのプログラミングになるのかな。

その3つのうち、デザインをやる人がデザイナーで、Flashの実装をするのがプログラマーで、企画をする人がプランナーとかディレクターとか、肩書きは色々だけど存在する。

僕は一通り担当しているから、この3つすべてを考えた上でのモーショングラフィックワークを行っている。

■「エコだ！動物園」ではマウスの動きで楽しい感覚を
僕が以前に制作した「エコだ！動物園」だったら、マウスをドラッグして上下にスライドしたり、回転させたりできる動きを取り入れている。
これは、僕がこの動きによって、ユーザーに「楽しい感覚」を提供できると思ったから。これによって、必然的に上下に長く伸びた画面構成が生まれて、それをもとにデザインを起こしていきました。
つまりモーショングラフィックスというのは、それ単体で考えることは出来なくて、アイデアとデザイン、そしてそれを実装するためのプログラムから成るわけです。

エコだ！動物園 アンコールワットさんの絵本

■城戸さん流　お仕事の進め方
佐々木：クライアントからは、どういう依頼が来て、どんな風に案件が進むんですか？

城戸さん：たとえば、以前に僕が作った作品 全日本バーベイタム選手権 を例にあげると、「Verbatim（バーベイタム）」のブランドを日本に浸透させたいと依頼が来る。

全日本バーベイタム選手権

１．企画
それをうけて、まずどのようにして展開していくべきかを考え、そのためにいくつかの企画をたてる。このときに提案した企画のうちのひとつが、現在展開されている「ロボットによる対戦ゲームを作りましょう」というもの。

２．デザイン
企画が決まったら、画面の流れやメニュー構成など細かいルールを決めながら全体の仕様を固めて、それをもとにデザインを行う。

３．プログラム
出来上がったデザインをもとに、プログラムで実装を行う。
ここはとても重要なステップで、単に仕様を満たせば良いというものではなく、いかに心地よさを感じてもらうか、かっこよさ・コミカルさを引き出すか、また余計な演出でストレスを感じさせないようにする必要もあります。注意深く何度もトライ&エラーを繰り返して完成に近づけていくのです。

この作品は、対戦するロボットの動きが命だから、企画、デザイン、プログラムと全体を通して、動きの表現・演出といった モーショングラフィック には結構こだわったよ。

■クリエイティブの本質がある
今回は、城戸さんにお話を伺って、ゼロからのモノ作りを教えてもらった気がします。
モーショングラフィックとは、デザイン（グラフィック）に動きを実装するだけではなく、クライアントの要望を受け「何を作って、どう見せたいか」「何を表現するか」を企画段階から考え、動きを考慮しつつデザイン・実装するすべてを指しているんですね。
そこには、クリエイティブの本質を感じました。

さて、そんな城戸さんは、4月23日（金）東京と、25日（日）大阪で開催のロクナナワークショップ イベント「 GEEKs　Flash モーションプログラミング 」に出演されます。イベントでは、モーションプログラムの仕組みや考え方について、じっくりお話していただく予定です。

・ GEEKs　Flash モーションプログラミング
・ ROXIK
・ エコだ！動物園
・ 全日本バーベイタム選手権
・ ロクナナワークショップ

■【プロに学ぶ67WS通信】の記事をもっとみる
・出版業界の新しいスキル！電子書籍のつくりかた
・動くサイトの謎を解く！中学の数学で作れるってホント？
・出来る人はオフィス不要！クラウドワークスタイル
・iPadで書籍革命！コメント付きデジタル本もあり？