frog ok?

FLASH BASIC

スケッチ、イラスト、テストムービー、プロトタイプ、すべてを見て学ぶ

スケッチ、イメージボード、プロトタイプなどの作品素材を収録していますので、制作の軌跡を探ることができます。文章や図では伝えにくい制作者「勘」を感じてください。

sample 001

sample 001

sample-001[プロモーションムービー]
ネット講座のプロモーション用に作成したムービー。ストリーミングサウンドを使ってアニメーションとシンクロさせています。音声は講義録音のものを使用しているためクオリティは高くありません。BGMは、ACIDというループシーケンサーで作成したものを使っています。

作品データ; dat_sample001フォルダ
orientation.fla[完成ムービー(サウンド無し)]再生
test_orientation.fla[ダミー画像でシンクロ・テストしたムービー]
lip_sync.swf[リップシンク素材(口パクのアニメーション)]
fire.swf[アニメーション素材(吹き出す炎)]
character.eps[キャラクター素材(パーツ分けしたもの)]
backg_design.eps[背景素材(パーツ分けしたもの)]

sample 002

sample 002-1

sample 002-2

sample-002-1[ベクトルグラフィック]
ベクトルグラフィックのサンプルです。筆のタッチで描いていますが、ビットマップの画像とは異なり、解像度に依存しません。フルスクリーン表示させて、その威力を確認してください。「Expression 3」(お奨めのツールです)で描き、Flash MXに読み込んでいます。

作品データ; dat_sample002フォルダ
01_vektor_sample.fla[完成ムービー(静止画)]
01_vektor_sample.swf[完成ムービー(静止画)/SWF]再生
01_vektor_sample.xpr[Expression 3のオリジナルファイル]
01_export.swf [Expressionから書き出したSWFファイル]
01_comparison.fla[ペンタッチを比較したテスト]
01_comparison.swf[ペンタッチを比較したテスト/SWF]再生

sample-002-2[ズーム・アニメーション]
このアニメーションもベクトルグラフィックの凄味を感じることができると思います。UFO?がどんどん近づき、宇宙人の顔がアップになり、宇宙人の帽子の中に‥。たった15KBしかありませんから、フルスクリーンで楽しんでください。

作品データ; dat_sample002フォルダ
02_face_in_face.fla[完成ムービー]
02_face_in_face.swf[完成ムービー/SWF]再生
02_face_in_face.eps [キャラクター素材(パーツ分けしたもの)]

sample 003

sample 003

sample 003

sample-003[モーションブラー]
このサンプルは、いかに少ない絵数で動かすか、というアニメーションです。絵の何枚かを”ぼかす”ことで動感を表現しています。いわゆる「モーションブラー」の技法を採用してみました。たくさん素材を用意しましたので、いろいろ改良してみてください。

作品データ; dat_sample003フォルダ
motion_blur.fla[完成ムービー]
motion_blur.swf[完成ムービー/SWF]再生
motion_blur_test1.fla[テストムービー(ぼかし無し)]
motion_blur_test1.swf [テストムービー(ぼかし無し)/SWF]再生
motion_blur_test2.fla[テストムービー(ぼかし)]
motion_blur_test2.swf [テストムービー(ぼかし)/SWF] 再生
motion_blur_test3.fla[テストムービー(改良版)]
motion_blur_test3.swf [テストムービー(改良版)/SWF] 再生
Long_shot.psd[モーションブラー素材(ぼかし無し)]
Long_shot_effects30.psd[モーションブラー素材(ぼかし)]
Close_up.psd[モーションブラー素材(ぼかし無し)]
Close_up_effects20.psd[モーションブラー素材(ぼかし)]
frame_planning.eps [カメラフレームのプランニング図]

sample 004

sample 004

sample 004

sample-004[キャラクターアニメーション]
走るキャラクターのアニメーションです。このサンプルの場合は、制作の進め方に工夫があります。「キャラクターバンク方式」を採用しました。可能な限り、パーツ分けして管理しています。アクションスクリプトは使用していませんので、[ライブラリ]の中身を見ると驚くかもしれません。ムービークリップの入れ子が複雑です。クリップを開きながら、どういう構造になっているか確認してみてください。入れ子の作業ですから最初の計画は必須ですが、実際の作業は短時間です。これが、FLASHを使うメリットですね。

作品データ; dat_sample004フォルダ
walk_machine.fla[完成ムービー]
walk_machine.swf[完成ムービー/SWF]再生
walk_machine_test1.fla[走りテスト]
walk_machine_test1.swf[走りテスト/SWF] 再生
walk_machine_test2.fla[”びびり”カメラテスト]
walk_machine_test2.swf[”びびり”カメラテスト/SWF]再生
walk_machine_test3.fla[キャラクターバンクのテスト]
walk_machine_test3.swf[キャラクターバンクのテスト/SWF]再生
walk_machine.eps[キャラクター素材]
character_bank_imageboard フォルダ
 >character_bank_imageboard.html[イメージボード(Web用)]
 >character_bank_imageboard.psd [イメージボード]表示

sample 005

sample 005

sample 005

sample-005[ズームアニメーション(中級編)]
ズームアニメーションのサンプルです。sample-002の中級編として見てください。ムービークリップの中にムービークリップを入れる「入れ子(ネスト化)」を駆使しています。アクションスクリプトを使って、もっと効率よく作成できるのですが、このサンプルでは「スクリプトを使わなくても」ここまで表現できるということを感じてほしいと思います。sample-004と同様に、構造は複雑でも、作業時間は驚くほど早い。FLASHアニメーション制作の魅力です。

作品データ; dat_sample005フォルダ
zoom_lens_camera.fla[完成ムービー]
zoom_lens_camera.swf[完成ムービー/SWF]再生
car_dmy_test.fla[ダミーによる動画テスト]
car_dmy_test.swf[ダミーによる動画テスト/SWF]再生
car_test.fla[描画した車で動画テスト]
car_test.swf[描画した車で動画テスト/SWF]再生
car_vibration_test1.fla[振動表現とバンク]
car_vibration_test1.swf[振動表現とバンク/SWF]再生
car_vibration_test2.fla[振動表現の拡張]
car_vibration_test2.swf[振動表現の拡張/SWF]再生
car.eps[素材「車」のイラスト]
background_device.eps[背景イラストとパスのデザイン]
drawing_process.gif[素材「車」の描画プロセス案]表示
figure_of_structure.gif[構造図]表示
work_process.gif[アニメーション作業の計画]表示

sample 006

sample 006

sample 006

sample 006

sample-006[モーショングラフィック]
Flashが最も得意とするモーショングラフィックのサンプルです。Flashには、基本的にトゥイーンの機能しかありません。つまり、移動、拡大縮小、変形、回転、色変換などの処理を組み合わせたアニメーションが適しているのです。ムービークリップの中にムービークリップを入れる「入れ子(ネスト化)」の構築ができますから、アイディア次第でさまざまな表現が可能になります。作品制作のためのアイディア集も収録しました。(100以上あるアイディアから31を抜粋)数分で作れるものばかりですが、まとまるとアイディアノートとして作品作りに役立ちます。

作品データ; dat_sample006フォルダ
motion_graphic1.fla[完成ムービーA]
motion_graphic1.swf[完成ムービーA/SWF]再生
motion_graphic2.fla[完成ムービーB]
motion_graphic2.swf[完成ムービーB/SWF]再生
motion_graphic3.fla[完成ムービーB(ぼかし)]
motion_graphic3.swf[完成ムービーB(ぼかし)/SWF]再生
motion_graphic.eps[グラフィック素材(パーツ分け)]
motion_blur_parts.gif [ムービーBの「ピンぼけ」素材]表示
motion_graphic_idea[モーショングラフィックのアイディアノート]
1234567891011121314
1516171819202122232425
262728293031

sample 007

sample 007

sample 007

sample 007

sample 007

sample 007

sample-007[モーションディスプレイ]
Flashトゥイーン・アニメーションの究極に挑戦したサンプルです。完成ムービーを(右クリック(Macは「Ctrl」クリック)して)拡大してみてください‥。
Flash 5 で制作した古い作品ですから、ごく基本的なトゥイーンしか使っていません。駆使したのは、モーションパス技法です。「モーションパスで動かした絵」を他のモーションパスで動かす、といった構築方法で複雑な動きを表現しています。膨大な素材やアイディアスケッチから厳選して収録しました。アニメーション・デザインの試行錯誤を見てください。(※Flash 5の基本機能しか使っていませんが、FLAファイルはMX形式で保存されています。Flash MXを使用してください。)

作品データ; dat_sample007フォルダ
motion_display.fla[完成ムービー]
motion_display.swf[完成ムービー/SWF]再生

line_test.fla[モーションパス・スケッチ]
line_test.swf[モーションパス・スケッチ/SWF]再生
rocket_orbit.gif[ロケットの軌道スケッチ]表示
basic_model1.fla[構造スケッチ-1]
basic_model1.swf[構造スケッチ-1/SWF]再生
basic_model2.fla[構造スケッチ-2]
basic_model2.swf[構造スケッチ-2/SWF]再生
pass_design.gif[モーションパスのデザイン]表示
noise_test1.fla[ノイズ(振動)のテスト]
noise_test1.swf[ノイズ(振動)のテスト/SWF]再生
noise_test2.fla[ノイズ・バリエーション]
noise_test2.swf[ノイズ・バリエーション/SWF]再生

construction_base.gif[モーションディスプレイのパーツ]表示
basic_model3.fla[骨組みの構築]
basic_model3.swf[骨組みの構築/SWF]再生
drawing_processe.gif[ロケットの描画プロセス]表示
rocket_finish.gif[ロケットの完成イラストレーション]表示
rocket_finish.eps[ロケットイラスト素材]
basic_model4.fla[ロケットの設置]
basic_model4.swf[ロケットの設置/SWF]再生
basic_full_version.fla[初期プロトタイプ]
basic_full_version.swf[初期プロトタイプ/SWF]再生

motion_pass_test.fla[モーションパスの試行錯誤]
motion_pass_test.swf[モーションパスの試行錯誤/SWF]再生
display_design.gif[本体カバーのイラストレーション]表示
display_design.eps[本体カバー素材]
motion_display_fin1.fla[ディスプレイ組み立て-1]
motion_display_fin1.swf[ディスプレイ組み立て-1/SWF]再生
display_parts.gif[部品の一覧]表示
motion_display_fin2.fla[組み立て完了]
motion_display_fin2.swf[組み立て完了/SWF]再生

sample other...

アート作品「ma10」

アート作品「cycle」

ビデオをレイアウトしたFlashムービーサンプル

sample-other...[アート]
dream render が企画・運営しているFlashのオンライン講座「FLASH GROOVEhttp://admn.net/fg3/]」を聴講されている方(福田まや さん)が制作した作品です。DVD用のショートアニメーションをFlashで制作するという試みでした。DVDに収録されている作品は、音付きですが、ここには元になったSWFファイルを収録しました。(サウンドはありません。)Flashの基本機能だけで作られていますが、画風にオリジナリティがあり、独特の世界観を持った作品になっています。

作品データ; dat_sample_otherフォルダ
ma10.swf[完成ムービー(サウンド無し)]再生
cycle.swf[完成ムービー(サウンド無し)]再生

sample-other...[ビデオプロモーション]
2001年におこなったケータイ向けコンテンツ・プランニングのデモムービーです。Flash Player が、NTTドコモの携帯電話(505i)に搭載され、話題になりました。現在、PDAやケータイなどのモバイル環境でもFlashコンテンツの需要が拡大しています。このムービーは、ケータイ向けコンテンツ制作を解説したビデオ映像を読み込み、SWFで公開したものです。ビデオ映像の枠(フレーム)に注目してください。かすれた感じを表現しています。
(イラストレーションおよび映像出演は、イラストレーターのノブオヤマダ氏)

作品データ; dat_sample_otherフォルダ
project_movie フォルダ[ビデオプロモーション・テスト]再生

 

BACK

Copyright(C)2003. [youji sakai] All rights reserved.