このページの講座 / イベント / キャンペーンは終了しました

このページでは、過去に開催された講座やイベント情報を掲載しています。現在ではご応募、お申し込み等は行われておりませんのでご了承ください。


Macromedia Flash 8: Advanced Design (フラッシュ8) / 講座ダイジェスト

Macromedia Flash 8: Advanced Designは、9つのユニットから構成されています。

以下の学習サイクルをユニット内で身につけることによって、Macromedia Flash 8(マクロメディア フラッシュ8)の必要な要素を習得していきます。

講座の学習サイクル

講座で使用するサンプル

実習で作成するサンプルはいくつかありますが、講座全体を通して作成する、フルFlashの再生サンプルWebサイトをご紹介します。上記の学習サイクルをユニット内で通して行うことで、このようなFlash(フラッシュ)コンテンツを作成できます。

Macromedia Flash 8: Advanced Design 講座で使用するサンプル

※Adobe Flash Player 8以上で動作します。Flash Player 7以前のバージョンでは正しく動作しませんのでご注意ください。

フルFlash(フラッシュ)のWebサイトを作成!

コンテンツ全体の設計

HOMEボタンCONTACTボタン、下のスクロールする画像などをクリックすると、画面が変わります。そこで、この動作をどのように作っているか?が気になると思います。まずは、タイムラインを使って効率よくコンテンツを作っていく方法を習得します。

オブジェクト指向プログラミング

このサンプルでは「見えない」部分ですが、オブジェクト指向プログラミングは非常に重要なトピックで、各所で利用されています。そのため、講座の最初の方でご説明します。「なんだか難しそう…」と思っている方も、ぜひこの講座で習得してください!繰り返しおさらいしますので、「オブジェクト指向プログラミング」をマスターする絶好のチャンスです。いったん身につけてしまえば、非常に便利で、かつ効率的な制作の手助けをしてくれることをご理解頂けるでしょう。

フィルタとブレンドモード

画面左上の「fs」と書いたロゴマークをご覧ください。

フィルタ

※場面によっては、少々見えにくいかもしれません。そのときは、ブラウザの再読み込み(リロード)を実行してください。再読み込みするたびに背景画像が変わりますので、見えやすいものにしてください。

マウスの位置によって、影(シャドウ)やぼかしの度合いが変わり、ロゴマークの見え方が変化しています。これは、Flash 8の新機能のフィルタブレンドモードを利用しています。この例のように、マウスの動きに合わせて(もしくはマウスに限らず)いろいろな変化を与える仕組みとして、ActionScriptによる制御の方法を習得します。

以下の部分もブレンドモードを利用しています。

ブレンドモード

マスクの使い方のノウハウ

CONTACTボタンをクリックすると、入力フォームが表示されます。

入力フォーム

右上と左下の角をよく見ると丸くなっていますが、実はもともとは角のあるムービークリップでした。これはマスク機能を利用しています。

コンポーネントのカスタマイズ

フォーム下部のチェックボックスをご覧ください。

チェックボックス

このチェックボックスは、いわゆる「Flashコンポーネント」と呼ばれるものです。

「あれ、チェックボックスの色は、確か緑色では…?」

これはカスタマイズして、色を変えています。

テキストのフォーマット

それでは、HOMEボタンをクリックしてみましょう。

テキストのフォーマット

ウィンドウの右上にあるボタンをクリックすると、表示テキストのフォントサイズが変化します。このように、フォントのサイズや色をActionScript(アクションスクリプト)で制御する方法もご紹介します。また、CSS (カスケーディングスタイルシート)を使用する方法もご説明します。

画像の一覧がスクロールするアニメーション

それでは、画面下部に目を向けてみましょう。

画像の一覧がスクロールするアニメーション

画像が横に並ぶ個所にマウスカーソルを移動させ、左右に動かしてください。カーソルの動きに合わせて、画像の一覧がスクロールします。さらに、カーソルが左右の端に近づくほど、スクロールも速くなります。画像一覧の左端、右端に行けば、スクロールが停止します。任意の画像にカーソルを合わせると、「VIEW」という文字を表示して枠線が付き、画像が明るくなっていきます。

このようなインタラクティブなアニメーションを、ActionScriptで実装する方法もご紹介します。

外部から画像を読み込むためのXMLデータ

クリックすると、選択した画像が大きく一面に表示されます。さらに、画面下部に選択中の画像に関するデータ(「Title」「Photographer」「Description」)が表示されます。

画像

ところでこのデータは、どこにあるのでしょうか?

これは外部のXMLファイルに記述されており、それを読み込んで表示しています。また、画像そのものもSWFファイルに埋め込まれているものではありません。外部のJPEG画像を読み込んでいます。このように、外部のデータや画像等のファイルを読み込み、「合わせ技」で処理をする方法とノウハウを習得します。

実践で使えるカタチに

ご紹介したのは、講座のごく一部分です(詳細は講座目録等をご参考ください)。実習では、もっと多くの技術を学習します。

しかし、これたのサンプルをご覧になっただけでも、「これ使えそう!」とか、「これやってみたかったんだよね!」という部分があったのではないでしょうか。このような内容を、「実践で使えるカタチ」で、短期間でもたっぷりお伝えするのがこの講座の特長です。

習得後、フルFlashサイトを制作する日も、そう遠い話ではないでしょう!

講座の詳細やお申し込みはこちらから!