2014を使って解決していくストーリー。ムチャ振りするクライアント、安請け合いするメンバー、それに振り回される制作者。無事にブラック案件を駆逐できるのか!?【今回の話】LPを無事納品したところクライアントがひと言「ファーストビューの一部を動かしたい」という。PSDを一晩でWebページにする最新Web制作フローを試してみた」で、ランディングページ(以下、LP)は、無事に納品できた。納品ついでに打ち合わせへ伺うと、公開まで少し時間があるのか、クライアントはもうちょっと何かを加えたそうにしていた。それ、動かないの?そして、指差された先にはフィーチャーエリアが。「動かすといってもいろいろやり方がありまして、例えば、この画像などの要素をアニメーションさせる方法や、ビデオを流す方法がありますが......」じゃあ、両方やっちゃおう!かっこいいじゃん。本国にもレビューに出さなきゃいけなくてさ。ビデオはこっちで用意するよー。「それはちょっと時間的にキビシ......」このLPを1日で作っちゃったんだから、いけるっしょー。Proのモーションエディターでイラレのように「線幅ツール」を使って、動かすことも次回「あ、ページ追加で。」またしても災い、またしても納期明日。要素をアニメーションさせて(そもそも仕様すらない)、ビデオを再生したいらしい。「LPをそんなに重たくしてどうするんだ」という気持ちはぐっと抑え込み「かっこいいじゃん」というクライアントのセンスとテンションを尊重することにした。帰社後「またムチャぶり請けてきたの?」という仲間の突き刺さる視線を華麗にかわし、デスクについてどうしたものかと考える。アニメーションに強いワークフロー、できればビデオも......。2014」があれば、何とかなるかもしれない。Animate)の2014版では、これまで制作できたDOMベースのアニメーションに加えて、HTML5ビデオを扱えるようになった。HTML5で再生するビデオはブラウザーの環境によって、最大で3種類のファイルを用意する必要がある。それらをコーディングしていくのが通常のワークフローだが、少々面倒だ。2014では、mp4とogvの読み込みに対応しており、これらのファイルを同じ名前で用意しておくだけで、適切なコードを生成してくれる。同じ名前でファイルを作っておき読み込ませる。このときに互換ファイルも認識されるビデオのファイルは自動再生することもできるし、ブラウザー標準のUIを表示することもできる。2014では、コードエディターが一新された。コードを入力する手間がほとんど省け、自らコードを入力しなくてもおそらくほとんどの場合に対応できるようになった。ビデオのコントロールもエディターを使って作ることができるようになっている。実行したい機能とターゲットを選択して[Enter]キーを押すと確定される。複数の機能を同時に実行することもできる。Animateのアニメーションを要素として扱えるようになった。Animateで作成して読み込ませることにした。Animateコンポジション]から挿入できる。ProでCanvasアニメーションを作ることも検討した方がいいだろう。メールマガジンをご購読ください。申し込みページへITmediaはアイティメディア株式会社の登録商標です。