《#1》 CS4のステージ環境に慣れよう 

2009年5月 1日 (金)

CS4で、Flashデビューしよう!   
DigiConマガジンでFlash講座スタートするよ

            

もくじ

            

■このサイトだけでゼロから覚えられるFlash入門講座を開講します   
■Flashってどんなソフト?    
■この講座ではどんなことが学べる?

            
このサイトだけでゼロから覚えられるFlash入門講座を開講します
           

niwa

            

DigiCon Magazine読者のみなさん、はじめまして!   
にわとり助手(以下【に】)です。

            

この春からの新連載   
「CS4ではじめる! アニメーションクリエイティブのためのFlash」    
は、Flashを使ったムービー制作や、インタラクティブコンテンツづくりを、チュートリアル形式でみなさんと一緒に学んでいくオンライン講座です。

            

この講座では、初めてFlashに触れる方が、Flashでのムービー、インタラクティブコンテンツの基礎を理解できるまでをフォローします。

            

雑誌も本も買わなくてもこの連載だけで大丈夫!というくらい易しく、を目標に掲げます。   
なので、これまで

            

「Flashはムズカシソー」      
「やってみたいけど教えてくれる人居ないし」      
「以前挫折した」

            

というみなさんにぜひ、チャレンジしていただきたいと思っています。   
連載中は、何度やっても解説どおりにできないとか、こういう内容も教えてほしいというリクエストも受け付ていきます。いっしょにがんばっていきましょう!

      

この講座でFlashを教えてくれる先生は、ウェブデザイナーのななきち先生(以下【な】)です。

            

にわとりのわたしは助手で、この講座の進行のお手伝いをしていく予定です。

            

また次回以降はTBS DigiCon6.comのスタッフ、しらたまちゃんも一緒にFlashを学んでいきます。

■Flashってどんなソフト?

              

niwa kino

              

今回は、まだFlashの実際の操作はしません。まず、Flashってどんなことができるのかを、ななきち先生に教わっていきましょう。

        

Flashは、アニメーションムービーの作成が得意なソフト

              

【な】:Flashは、「スプラッシュページ」や「Flashムービー」など、滑らかな動きのあるウェブページやウェブコンテンツを作れるソフトの定番です。たとえば、下に示すようなサイトなどがあります。Flashサイトでは、映像のように画像や文字を動かすだけでなく、クリックでメッセージを表示したりキャラクターに反応させるなど、さまざまな動きが作れます。

              

sacas 
例1:http://sacas.net/

              

赤坂サカスのウェブサイト。トップ部分にはFlashが使われています。イメージモーションやフキダシの表示などがトップページを彩っています。画面の左右にカーソルを移動するとスライドして別のイラストが表示できます。   

              

hw 
例2:http://www.adobe.com/jp/

              

アドビ システムズ社のトップページの上部分ももちろん、Flashが使われています。    
    
     

ブログに貼って楽しめる「世界遺産ブログパーツ(ON AIRカウンター)」です。このような小さなバナーやブログパーツなどにも、Flashがよく利用されています。
例3:http://www.tbs.co.jp/download-akasaka/bp_02.html

 

映像編集でよく使うAfter EffectsやPremiereとはどう違う?

              

【に】ところでTBS DigiCon6.comのユーザー内では、FlashよりAfter Effectsなどのほうがよく使われている気がします。Flashは、映画やアニメーションの作品づくりにはあまり使われないように思いますが、なぜですか?

              

【な】Flashでもアニメーションが作成できますが、そう多くないかもしれませんね。現在はやはりウェブ作品が主流でしょう。ちなみにアニメーションや動画を扱うソフトでも、素材によって、得意とする分野がソフトごとに異なります。Flashは、パソコン上で描いた2Dイラストを動かすのが得意なソフト。PremiereやAfter Effectsなどは、ビットマップの映像を加工するのが得意。つまり実写した素材の加工向けです。


ちなみに、Flashは、今回のバージョンのCS4のから、3D空間の表現も作れるようになりました。それにFlashでも、実写映像を取り込むことはできるので、実写とイラストやインターフェースを組み合わせるという場合、Flashは非常に使いやすいソフトです。


<映像制作のさまざまなツール(表)>







実写が得意 Final Cut、Adobe Premiere、iMovieなど
特殊加工(レタッチ)が得意 After Effectsなど
イラストにアニメーションが得意 Flashなど
3Dが得意 Autodesk Maya、3DS Maxなど
              

 

【に】現在はウェブで公開するアニメーション、ウェブサイトだけでなく、ケータイやゲーム機、DVDビデオのインターフェースなど操作が必要とされるコンテンツの制作でFlashは用いられていますね。

              

【な】そうですね。それから、Flashと、After Effects、Premiereは同じアドビ製品なので、まずFlashを学んでそのあと興味のあるソフトへステップアップするのもよいと思いますよ。

                      

インタラクティブな操作ができるマルチメディアコンテンツが作れるソフト

              

【に】映画のプロモーションサイトのようなものでは、ほとんどの場合にFlashが使われていますよね。

              

【な】そうですね。動きがあって楽しいだけでなく、自由度の高いレイアウトにしたいときは、Flashを使ってウェブサイトを作ることが多くなります。最近面白いな、と思ったサイトは映画「天使と悪魔」の公式サイトです。静止画写真をかなり使っているけれど、Flash上の効果で映像を観ているような面白さが出ていましたよ。

              

【に】Flashならば、HTMLでレイアウトするのと違って、絵を描くように自由に写真、映像とイラストを組み合わせて配置し、動かせるのも魅力ですね。

              

【な】Flashでは、ActionScriptというプログラム言語が使えるので、ちょっと複雑なゲームなんかも作れてしまいます。よく、Flashを使った無料ゲームサイトなど、ありますよね。

              

【に】クリックだけでできる密室脱出ゲームの「クリムゾンルーム」などもFlashゲームの元祖ですね。

              

プログラミングによって、さらに高度な操作ができる

           

【な】さらにActionScriptを極めれば、データベースと連携したサービスや商取引のサイト構築もできます。そのため、アニメーションやインタラクションだけでなく、Flashが利用できる範囲はとても広くなっています。

           

【に】へー、すごい。でも、ウェブ向けのプログラムには、PerlやJavaScript、Rubyなどいろいろな言語があるなか、なぜActionScriptが必要なんですか?

【な】それはひとことで言って、Flashが操れる唯一のプログラム言語だからです。また、同じサービスでも、Flashで自由度が高いデザインを活かせば、複雑な操作もわかりやすく、使い勝手がよく改善できます。そこで、Flashをもっと使いたい、イコール、そのプログラム言語としてActionScriptは必須というわけです。

           

(注※Flashをつかったサイトやインターフェースでも、サーバサイドでは別のプログラムが利用できます。一般的にフロントエンド側のプログラムとしてActionScriptが利用されていると考えていいでしょう)

           

【に】たしかに! にわとりも、Flashでつくられたチケット販売サイトや銀行サイトを利用した際、使いやすいなぁと思ったことがあります。そういうキレイで使いやすいサイトをつくりたい場合には、ActionScriptも勉強しないとならないのですね!

           

【な】ActionScriptも、そういった大規模なシステムのために使うものはプログラムの能力が必要ですが、ごく簡単なものならばまったく文系タイプの人でもムリなく覚えられ、カッコイイものができちゃいます。この連載でも、インタラクティブな操作に必要なActionScriptを紹介していきます。

            

adbstore    
図3:https://store3.adobe.com/cfusion/store/index.cfm?store=OLS-JP&nr=0#loc=ja_jp&catID=SPECIALS&view=ols_cat&store=OLS-JP

           

アドビストアのページ。このページでは、FlexとFlashの技術が使われています。   

           

図4:http://www.adobe.com/cfusion/showcase/index.cfm?loc=ja

           

そのほかにも、「nike products」(ナイキのプロダクト検索ウェブページ)などや「ぽちっとアスクル」など、ビジュアル的に美しく、複雑な操作が行えるサイトでFlashが活用されています。「アドビショーケース」から各種のサイトを閲覧できます。

           

映像配信にも欠かせないFlash

           

【な】TBS DigiCon6.comでFlashといえば、忘れてはならないのは、Flashの映像配信のための機能です。

           

【に】動画共有サイトのYouTubeやニコニコ動画、各種の配信サイトでもFlashが使われていますね。

           

【な】そうです。Flashには、軽量でネットワーク上で配信がしやすい「flv」というフォーマットの動画ファイルを作成したり、オリジナルの動画配信用インターフェースを手軽に作成する機能があります。また、別売の配信サーバー(Flash Media Server)との連携すれば、大規模な動画配信サービスを運営することも可能です。

           

【に】世界的に人気のリアルタイム動画配信サービス「USTREAM」もFlash Media Serverを使っているそうですね。

           

【な】ハンディビデオなどが普及したことでビデオ配信は個人でも手軽に行えるようになり、今後よりニーズが上がっていきそうな分野です。

           

図5:http://www.tbs.co.jp/koisuru_seiza/

           

「真野恵里菜 オリジナルネットドラマ『恋する星座』」は、ネット上で展開中のドラマ。Flashビデオの技術で配信されています。

           

■この連載ではどんなことが学べる?

           

Flashは本当にさまざまなコンテンツが作れるツールであること、なんとなくおわかりになったと思います。最後に、次回第1回からのチュートリアル内容について少し紹介しておきます。

           

【に】Flashってクリエイター心をくすぐるソフトですね。すぐにつくりはじてみたくなりました!

           

【な】次回からは、秋までに、Flashムービーの基本設定にはじまり、動画の配信チャンネルのインターフェース、また、配信コンテンツとなるアニメーションの作成まで、やってみたいと思っています。

           

【に】自分でアニメーションを作ったら、それを公開できるFlashインターフェースをつくるんですね。楽しみです!ではみなさん、次回からをお楽しみに!

           
   

<Adobe Flashのデモ版について>

             

Adobeのウェブサイトでは、60日限定でフル機能が利用できるFlash CS4 Professional体験版のダウンロードが行えます。もし、まだFlashの購入を迷っている人がいれば、ぜひ、試してみましょう。※初めて起動したときから60日間起動できます。

             

https://www.adobe.com/cfusion/tdrc/index.cfm?product=flash&loc=ja

トラックバック

このページのトラックバックURL:
http://www.typepad.jp/t/trackback/387238/19755719

このページへのトラックバック一覧 DigiCon Tips CS4ではじめる! アニメーション クリエイティブのためのFlash:

コメント

コメントを投稿

コメントは記事の投稿者が承認するまで表示されません。

《#1》 CS4のステージ環境に慣れよう