不定期俺日記ver.2

何というか適当に。



『昨今どうよ』

follow me on Twitter

  • --年--月--日スポンサーサイト

  • 上記の広告は1ヶ月以上更新のないブログに表示されています。
    新しい記事を書く事で広告が消せます。

  • 2008年09月03日musicmaker

  • というわけでまあ、musicmaker体験版を立ち上げると、こんな感じの画面になっています。
    mmtamesi02.gif
    MMは作曲ソフトとしてはループシーケンサーを主体としたものですが、ループシーケンサーとは何ぞや的な話になるわけでして。
    でまあ、わしも疎いのでかなり”感じ”な説明になりますが、ループシーケンサー=ループ素材を使用、加工して音楽を構成するもの、と考えていたりします。

    では、そのループ素材とは何ぞや的な話になっていくわけですが、ループ素材とは、荒っぽくまとめると”音楽の一部(数小節分)のデータをループ可能にしたもの”という感じで。
    つまり音楽を構成する音符の並びを、楽器ごとに、数小節単位でデータ化し、それを選んで並べていくことで”曲”とする、ということ。
    このループの個数は、現在莫大な数になっており、多種多様なものを”再構成”出来る状況になっているのですな。

    MMで言うと、左下の枠が、左から右に”音楽のジャンル””楽器””その楽器で奏でられるループ素材”という感じになっています。
    じゃ、実際にループ素材を使用してみましょう。
    mmtamesi03.gif
    体験版はスタイル(曲ジャンル)が一つですし、まずは面倒なのでベースの一番上にある素材を、画面中央のトラック左上に持っていく、と。
    するとまあ、
    mmtamesi04.gif
    こんな感じになります。
    このループ素材はベースで、二小節分のデータなのが解りますな。
    んじゃ、聞いてみんとす。画面中央下の三角プレイを押す。
    New01.mp3
    ちょっと短くて、ベース単体ということしか解りませんな。
    では、これをちょっとループ化=八小節分くらい連続してみます。
    先ほどと同じように同じループを右に並べていってもいいのですが、表示された素材の右端を右にドラッグすると、ループが連続伸張されます。
    mmtamesi05.gif
    こんな感じね。
    で、これを聞いてみる。あ、上の黄色い小節範囲のカーソルの右側のを、八小節目まで移動しておくのを忘れないように。
    八小節にしたので、四ループです。
    New02.mp3
    おお見事に繋がってる繋がってる。
    つまりこれが”ループ”ってことなわけです。

    じゃあ、ちょっと曲っぽく遊んでみましょうか、と。
    左下の楽器から、ドラムを選び、やっぱ面倒なので一番上の素材を二番目のトラックに、
    mmtamesi06.gif
    こんな感じで持っていって、
    mmtamesi07.gif
    ほい貼り付け完了。
    んで、聞いてみる。
    New03.mp3
    あ、何かいきなりそれっぽくなったように感じるのはわしだけですか。
    人によってはここらへんで、
    「閃いた」
    となるような気もします。

    じゃ、次はパーカッションを重ねてみんとす。mmtamesi08.gif
    素材はやっぱり一番上で。
    パーカッションは二小節ループなので、右端ドラッグで伸ばす。
    で、この状態でまた聞いてみる。
    New04.mp3
    結構賑やかになってきました。
    ただ、ちょっとメロディが乏しいですな。なので、最後にシンセの一番上の素材を貼り付けてみます。
    mmtamesi09.gif
    よし、こんな感じで。
    で、聞いてみる。
    New05.mp3
    どんなもんでしょ。
    無造作に各楽器の一番上の素材を貼り付けていったわけですが、こういうものが出来ます。
    ぶっちゃけ、音楽というものにアプローチするとき、「もの凄く敷居が低くなった」と思うのは自分だけでしょーか。
    このやり方は、究極的な意味では自分の作りたい曲(音符の並び)を作るのは至難ですが、ループ素材を多く揃え、それらを組み替えたり加工していくことによって、気軽に”自分の聞きたい音曲”に近いものを作っていくことが可能だと思います。

    なお、自分的な感覚で言うと、ループ素材を取っ替え引っ替えやって自分の中にある音楽と近いものを作っていく感覚は、
    「アーマードコアなんかの装備品入れ替えまくりの楽しさ」
    と似た感覚だったりします。
    「ああじゃないこうじゃないこれでどうだろうかテストテストテストああいい感じだけどもうちょっと詰められるんじゃないかと思ったらこっちの方向性もいいよなあ」
    という感じ。
    いや正直ハマりますわコレ。

    ともあれループ素材と、それによる作曲(編曲?)のやり方を摘んだところで、次はMMの”自動作曲”について、という感じで。

    んじゃまた明日ー。

  • 2008年08月11日そういうわけで

  • ホライゾンの紹介ムービーのメイキング的な話。

    使用ツールは以下の感じです。
    ●ムービー部分基礎作製
    :FLASMAKER3
    =現MOTIONMAKER4
    http://www.e-frontier.co.jp/motionmaker/4/

    ●音楽部分作製
    :MUSICMAKER
    http://www.ah-soft.com/musicmaker/index.html

    ●FLASH→AVI変換
    :SWF>>AVI
    http://www.avi-swf-convert.com/default.asp
    ※説明はこちら
    http://www.gigafree.net/media/flashenc/swf2avi.html

    ●AVI、音楽統合
    :videostudio9
    =現videostudio12
    http://www.corel.com/servlet/Satellite/jp/jp/Product/1210622733304

    というのが大体のところです。
    ほとんどのソフトが学割版出ていたり、videostudioなんかは旧式の廉価版が出ているので、揃える、もしくは一つを手に入れるならば財布的にも安全だと思います。

    なお、今までにどんなもんを作ってきたかというと、
    ・FLASHMAKER
    :obstacleのプロトflash=http://detroit.vc/upload/swf/obpdemo.html

    ・musicmaker
    :今回のBGM

    ・videostudio
    :DWFなど

    この中で特に強力なのがFLASHMAKERで、機能的には高価なFLASH作製ソフトには及びませんが、製作の手軽さという意味では高価ソフトがハルバードならこっちはショートソードな感じ。
    オブスタのデモを観て頂くと解りますが、簡易な会話デモなら動き付きで作ることが可能です。
    左のカテゴリ”自作”の中で操作など解説していますので、そちら参照。
    これをベースに、
    「画面上のものを動かす」
    という概念に親しんでおくと、他のツールなどを扱うのが楽になると思います。

    そしてMUSICMAKERですが、これはループシーケンサー主体の作曲ソフトで、基本はループ素材という”数小節の音楽素材(ドラム、ギター、シンセなどなど)をタイムラインに貼り付けていくことで曲を作っていく(どっちかって言うと編曲)というツール。
    更にはその機能を利用した”自動作曲”という機能もあります。

    videostudioはこのタイプのソフトの定番品ですが、画面の効果や絵や文字を重ねることが出来るため、DWFのようなものがこれ一本で作れます(絵とかを作る必要はある)。
    あれ、キャラの顔重ねたり文字書いたりは、videostudioの基本機能なのですだよ。

    これらを今回、統合して作ってみた、という感じですな。
    基本は、

    ●グラフィックの素材作製

    ●作曲

    ●曲に合わせて素材を動かすFLASH作製

    ●FLASHをムービー(AVI)変換(ここで音が削除される)

    ●ムービーに音入れ直し+動画形式変換

    という流れ。
    とりあえず明日からは、趣味でこういうのを作る際の手順とか解説という感じで。
    んじゃまた明日ー。

  • 2006年03月23日そういうわけで

  • 一気に変数の話をやってみんとす。

    んでまあ、変数いうたら何かと言いますと、「プログラム上における代数」のことと荒っぽく考えてOKなのかなどーかな的な。
    たとえば、

    a=1

    ってやつですよ奥さん。この場合、「aに1を入れる」わけで。
    この場合、プログラム的に、

    print a

    ってやったら(全角ではやらんけどな)、出る答えは1ですな。
    変数っていうのは、まあ、代数を使ってそのようにいろいろと、
    「仕込む」
    ためのものだと御理解プリーズ。
    --------------------------
    でまあ、FM3の変数が主に何に使用されるかと言いますと、
    「条件式」
    です。

    この条件式というのは何かというと、
    「もし、変数~(1)の数値が~(2)であるなら、~(3)をしろ」
    という式のこと。
    FM3では、変数と条件式において、

    ・変数定義(つまり変数の個数を増やす)
    ・条件式における変数~(1)の指定
     :定義した変数に限る
    ・変数~(1)の数値変更
     :変数~(1)に~を代入する
     :変数~(1)に~を足す
     :変数~(1)から~を引く
     :変数~(1)に~を掛ける。
     :変数~(1)を~で割る
     :変数~(1)を~で割った余りにする
     :変数~(1)を指定範囲の数値でランダムに代入する
    ・条件式における数値~(2)の範囲指定
     :変数~(1)の値が~(2)に等しい
     :変数~(1)の値が~(2)以上
     :変数~(1)の値が~(2)以下
     :変数~(1)の値が~(2a)以上で~(2b)以下
    ・条件式における~(3)
     :ページの移動
     :オブジェクトの表示等々……。

    ということが可能、と。
    今、学校でどのくらいのレベルのPC授業受けてるかはあまり解らないのですが、これ、「if then」としてbasicでもcでも使いますやね。
    なお、条件式は複数置くことが可能なので、
    実質上は、else部分を書くことが出来ますし、面倒さえ感じなければswitchと同様のことも可能です。全部選択指定するので、switch文の代わりはえれえ面倒ですが。

    ※余談
    else文は、「それ以外だったら~をする」という文。
    つまりこれがあると「もし、変数~(1)の数値が~(2)であるなら、~(3)をしろ。”それ以外だったら~をする”」という文を作れます。
    FM3ではこれがないので、同じことをねらう場合は、条件式を二つ並べて、
    「もし、変数~(1)の数値が~(2)であるなら、~(3)をしろ」
    「もし、変数~(1)の数値が~(2)でないなら、~(4)をしろ」
    とすることになります。
    なお、
    「~(2)でないならば何もしない」
    ならば、else構文はいりません。

    でまあ、この条件式があると何が出来るかと言えば、初期段階で作った、
    「メタ会話」
    のようなものが作れるわけです。
    あれ、
    十個の表情ごとに、
    「ボタン二つによる十表情の変化確率=二十式」
    持っており、つまり表情ごとにこの条件式が二十個並んでます。
    合計で二百の条件式が並んでいて、他にもいろいろやっておりますが、(たとえばリザルトのマーク表示も”もし否定した回数が~以上なら、ここにこのマークを表示”とやってるので、あのシーンだけで45の条件式)流石に数が多くなってくると、選択式ではなくスクリプト打ち込みでペーストしたくなりますな。
    つーかswitchって偉大でしたわ……。

    まあ、使い方によっては結構いろいろ出来るのです。

    たとえば、
    「変数”天候”に、ランダムで1~100を代入する」

    「もし変数”天候”が1~20だったら、雨のページに移動」
    「もし変数”天候”が21~50だったら、曇天のページに移動」
    「もし変数”天候”が51~100だったら、晴れのページに移動」
    ってやったら、もうこれ朝の挨拶準備が完了ですだよ。
    昨日の天候の影響を与えたいなら、
    「変数”天候”に、ランダムで1~100を代入する」

    「もし変数”昨日の天候”が1~20だったら”天候”を-20する」
    「もし変数”昨日の天候”が31~50だったら”天候”を-10する」
    「もし変数”昨日の天候”が51~100だったら”天候”を+10する」

    「もし変数”天候”が1~20だったら、雨のページに移動」
    「もし変数”天候”が21~50だったら、曇天のページに移動」
    「もし変数”天候”が51~100だったら、晴れのページに移動」
    とかね。
    これ大雑把なものですが。

    他にも、ドアの絵に対して、
    「鍵を取得しているなら変数”鍵”を1にする」

    「もし変数”鍵”が1なら、ドアをクリックしたとき次ページに移動する」
    とか。

    この、変数と条件式が使えるというのは、結構大きなことだったりします。
    少なくとも静的なプログラムはかなりまかなえるかと。
    ----------------------------
    んじゃ、前回のflashを改造するつもりで、変数と条件式をこっちも使ってみます。

    前回の流れはこうでした。
    ■「流れ」
    1:ページ1、赤巫女出現

    2:赤巫女をクリック→N→停止のままクリック待ち



    3:ページ2、黒巫女出現

    4:黒巫女をクリック→N→停止のままクリック待ち



    1に戻る

    これ、延々とループしますが、終わりがほしいですな。
    だから、
    「幾度かループしたら、二人が一つの画面にそろって終了」
    としたい、と。

    んで、条件式を考えますが、これはつまり、
    ・「ループ回数が一定になったら、終わりのページに飛べばいい」
    ということです。
    しかし、前回のflashはクリックで画面変更で、
     赤巫女→黒巫女
    の順番があります。
    ループが成立するのは、黒巫女を見て赤巫女に戻ったときです。
    ここで周回数をカウントすればいい。
    変数的に言うと、
    「変数”ループ数”は、赤巫女のページに来たとき+1される」
    もしくは、
    「変数”ループ数”は、黒巫女のページが終了したとき+1される」
    という、どちらかなわけですな。
    ここでは前者を選びます。
    (※何故前者かというと、周回数が成立し、黒巫女ページから最終ページに移る際も1カウントしてしまい、周回数が余分に増えてしまうからです。もし今後、最終ページ以降を作る場合があったならば、それは混乱すると考えました。ただ、赤巫女ページをカウントページにした場合は”1カウントしれからその周回が始まる”ことに注意です)
    そしてこれは、黒巫女を見ることががループの転換タイミングにあたるということでもあります。
    だから条件式は、
    ・「ループ回数が一定になった後に黒巫女ページで黒巫女をクリックしたら、終わりのページに飛べばいい」
    ということです。

    流れ的に書きますと、

    1:ページ1、赤巫女出現
     :周回用変数を+1

    2:赤巫女をクリック→N→停止のままクリック待ち



    3:ページ2、黒巫女出現

    4:黒巫女をクリック→N→停止のままクリック待ち



    5:「もし周回用変数が~ならばページ3に移動」→N→1に戻る



    6:ページ3、赤巫女、黒巫女出現
     :終了


    ということですな。
    だからやってみる。
    -------------------------
    まあまずは3ページ目の作成です。
    「条件式が先じゃないの?」
    って話もあるんですが、ページを指定することがあるので、条件式などでリンクを作るより、先にページを作っておいた方が齟齬がない、と。
    ken37.jpg
    んでまあ、このときに赤巫女と黒巫女を置きますが、メインウインドウ下の「使用中の画像」をクリックして、現在までに使用している画像一覧を出す、と。
    ken38.jpg
    これで、毎度素材フォルダから投げ込まないですみます。

    ken39.jpg
    3ページ目の最終的な配置はこんな感じ。左右から入ってくるアニメーションで。
    ページのストップも忘れないようにします。(つーか忘れた)

    そしたらまず、周回用変数のカウントから入ります。
    1ページ目を開き、
    ken43.jpg
    ページのプロパティを開き、左下の”ページ開始時に変数をセット”を選択。

    変数は最初から、プリセットとして変数1~6まで定義されてます。(好きに使えるし、名前も変えられる)
    ここでは面倒なので名前を変えず(いいんかそれで)、変数1を周回カウント用変数とします。
    ken44.jpg
    「変数1に、1を足す」
    と選択。
    これで、
    「ページ1に来たとき、変数1は+1される」
    という変数操作が行われるようになりました。

    こんな感じで、そのページやそのオブジェクトで使用している変数操作や、条件式はそれぞれ確認できます。
    ken45.jpg

    続いて黒巫女です。
    2ページ目を開き、
    ・「ループ回数が一定になった後に黒巫女ページで黒巫女をクリックしたら、終わりのページに飛べばいい」
    これ↑を考えるわけですが、
    「クリックしたら条件式発動」
    なので、黒巫女クリック時のリンク判定に条件式を与えることにします。
    黒巫女を右クリックして”リンクの設定”を選び、
    ken46.jpg
    ”変数の値で移動”を選択、と。

    ken47.jpg
    だいたい何やるかが解ったと思います。
    「三周していたならば、黒巫女をクリックしたら最終ページに飛ぶ」
    というわけです。

    なお、黒巫女のリンク条件式は、これだけではいけません。
    「三周していたならば」
    の、”これ以外”が設定されてないからです。
    このままだと、
    「三周していない場合、ページはストップする」
    ようになります。
    だから条件式を重ねます。

    「三周してないとき、黒巫女をクリックしたら、ページ1に移動」

    というやつですな。
    ken48.jpg

    条件式をが二つ重ねたので、黒巫女のリンク条件式はこうなります。
    ken49.jpg
    これ、他にも条件式の組み方はいろいろあると思います。
    カウントは+1ずつしかされないので、
    「周回数が3に等しいなら」
    でもいいのですというかそれが綺麗。
    ”以上””以下”を振るのは、
    「今後、もしも”+1”以外のカウントがある場合」
    を想定したもので。これは自分の昔からのプログラム的用心です。
    ”以上”と”以下”ならば、”等しい”を超えても対応できるので。

    んじゃまあ、ここでswfファイルを吐きだしてみましょう。
    http://ramiltass.homeip.net/www/upload/swf/ken007.html
    どんなもんでしょ。

    -------------------------
    んでまあ、これではちょっとまだ寂しい。
    完全に終わってしまいますし。
    だから、
    「また最初に戻れるようにする」
    というようにしたい、と。

    アイデアとしては、
    「最終ページの画面に”again?”などとテキストを出し、それを押すと1ページ目に戻る」
    というようにします。

    やることはといえば、最終ページの表示について以下を追加します。

    1:again?表示

    2:クリックされた?→N→入力待ち



    3:周回数を0にする。
     :1ページ目に飛ぶ

    というやつですな。

    で、文字の表示は、画面上の”オブジェクト”→”テキストの設定”を選びます。
    ken40.jpg

    んで、テキスト設定ウインドウにテキストを打ち込む。
    ken41.jpg
    まあいろいろありますが、あんまし気にしなくていいです。
    ただ一つ覚えておくべきは、
    「文字サイズの自動調整」
    のクセですな。
    一度文章を打ち込むと、その範囲をFM3は覚えます。
    そして文字サイズの自動調整がチェック入っていると、
    「そのテキストを打ち直したとき、覚えた範囲内に納めてしまう」
    ということをします。
    どういうことかというと、
    「一文字を大きく書いた」
    場合、その一文字をやはり長文にしようとすれば、
    「同じ面積に長文を押し込む」
    ことになります。
    何かねらいがあるのではない限り、同じテキストオブジェクトの文を書き直すなら文字サイズの自動調整は切っておいた方が無難です。

    んで、文字は絵と同じオブジェクトなので、リンクもアニメも付与できます。ここではやりませんが、条件式だって付与出来ます。
    ken42.jpg
    ken50.jpg
    こんな感じですな。

    なお、
    ・ページのプロパティで”ストップ”。
    ・ページのプロパティで、ページ終了時に変数1を0にする。
    というのを忘れずに。

    と、これでとりあえず完成。
    http://ramiltass.homeip.net/www/upload/swf/ken008.html
    こんなところですな。

    条件式は言葉のパズルのようなものです。覚えておくといろいろ出来るようになります。
    そして、テキストは、リンクや条件式など使える素材だと解れば、簡易なノベル系が出来るようになると思います(セーブデータの吐き出しが出来ないので、ゲームとしての実用化はアレですが)。
    いろいろ、アイデア次第でどうにかなるんではないかなあ、と。

    今後、FM3では自分的コツとか思いついたらアップしていこうと思います。
    つーか、ホームページビルダーとの同梱版もあるんですな……。
    意外と使ってる人おおいのかしらん。
    個人的には、
    「flashってどんなの? まず、ちょっと触れてみたい」
    って人にはスゲーいいツールだと思います。
    flash8などに移行する際も、
    「もっとも使うアニメーションを、flash8でスクリプトを組むことで、flash8の技術習得と移行を済ませる」
    ということが出来ますし。
    とにかく、あのアイコンによるアニメ設定はMT車に対するATなところもあるかと思うのですが、
    「完成を、やる前から大きく想像できる」
    という意味で強いよなあ、と。
    そうやってパターニングを覚えた上で、他の上級ソフトに移行すれば、頭の中でやりたいことが大体見えているので、
    「何をしていいか解らなくなる」
    ということもなくなるんでは、と。
    そんな感じのツールだと自分的には思いました。
    ううむ。

    ともあれここまで読まれた方、おつきあいくださってありがとうございます。
    んじゃ、明日からまた通常でー。

  • 2006年03月20日よっしゃ

  • flashの作例もあと、一、二回で終わりそうです。
    つーか初歩的なことをやってるつもりが、初めて気づくこと多くてえらい勉強になってます……。
    おそらく専門用語とかアレになってると思うのですが、そこらへんは自分用として御容赦プリーズ。

    んで、前回でアニメーションのことをやった、と。
    今回は、
    「複数ページにまたがるflashを作る」
    というところで一つ。

    複数ページというのは何かといえば、flashの動きがある程度一段落ついたときに、
    「新しい絵や動作に切り替えるとき、そのままのページで作業していると重かったり物量積み重なって管理がしにくかったりする」
    ので、解りやすいように、
    「次のページ」
    を作り、そこからまた新しく次の動きを作るのですな。
    ゲームでいうと面を変える感覚に近く、アニメでいうとカットを変える感覚に近いです。
    つまり、何も書いていないページを出すと、そういうことで。

    なお、ページを変更すると、
    ・さっきまでのページでおいていた素材類は引き継がない
    ので、背景などはすべて置き直しになります。

    ともあれ、あまり深いことは考えず、前回の犬巫女のページをページ1として、新規ページを追加してみます。

    下、ページリストで右クリックするとウインドウがでますので、
    ken27.jpg
    ”ページの追加”を選択。
    そうすると、
    ken28.jpg
    まあこんな感じでページ2が追加されます。

    んでまあ、どうしようかと。
    とりあえず、相方をページ2に置くことにします。
    ken30.jpg
    こんな感じで。

    そして現状、ページ1は表示終了後にページ2に移行するのがデフォルトの設定です。
    ここでswfファイルを出せば、赤が表示後、黒が表示され、そのまま(後ろのページがないので)止まるものになるかと。

    ただまあそれだとおもしろくないので、
    ●リンクの設定
    を試してみます。
    つまりは、
    「巫女絵をリンクのボタンとして使い、巫女をクリックするとページを移動するようにする」
    というわけです。

    ■「流れ」
    1:ページ1、赤巫女出現

    2:赤巫女をクリック→N→停止のままクリック待ち



    3:ページ2、黒巫女出現

    4:黒巫女をクリック→N→停止のままクリック待ち



    1に戻る

    というところでしょうか。
    ではまず、赤巫女にリンク設定を行います。
    ken29.jpg
    赤巫女の絵をクリックしてから右クリックすると、こういう選択がでるので、”リンクの設定”を選ぶ、と(これ、2ページ目作る前のSSなので、そこらへん御考慮プリーズ)。

    すると、
    ken31.jpg
    選べるのは、
     1●クリックしてもジャンプしない
     2●特定のURLにジャンプ
     3●フラッシュ内の特定ページにジャンプ
    で、三つ目が有用です。
    2を使うと、サイトのページ移動操作などに使えますな。企業のflashなどはこの機能を使って操作してるわけです。

    でもまあここは、
    「赤巫女をクリックしたらページ2に飛ぶ」
    ようにしたいので、ページを指定でページ2としておきます。
    別に「次のページ」を選んでもいいんですけど。

    んで、黒巫女側のページに行き、同じように黒巫女絵を右クリックして「リンクの設定」を選びます。
    ken32.jpg
    こっちはページ1に飛ぶように指定ですな。

    んでまあ、ここで両者巫女に登場アニメを与えておきます。
    「スピン登場」
    で、
    「フレームすべてを登場に使用する」
    というところでしょうか。
    ken33.jpg
    ken34.jpg
    こんな感じにしておきます。
    なお、クリック判定は登場開始時から持っています(変更できませんので、そこらへん注意)。

    んで。
    ここで一つ忘れているといかんことがあります。
    それは先述したことではありますが、
    「ページは、タイムラインを消費後、次のページに自動的に移行する」
    ということです。
    だから、1ページ目の赤巫女にリンク設定をしていても、
    「ページ1を、タイムライン終了後に”ストップ”しておかねば、自動的にページ2に行ってしまいます」
    ということで。

    だからページ1を開き、横の空白あたりを右クリックします。
    ken35.jpg
    するとこういう選択がでるので、
    「ページのプロパティ」
    を選びます。

    ken36.jpg
    やっぱり「ページ終了後の動作」というのがあるので、これを「ストップ」にしておきます。
    黒巫女のもしておきましょう。

    ここで「流れ」を確認しておきます。
    1:ページ1、赤巫女出現
     ・アニメーション 

    2:赤巫女をクリック→N→停止のままクリック待ち
     ・リンクの設定(クリックしたらページ2へ)
     ・ページプロパティ(終了後、クリックされるまでストップ)



    3:ページ2、黒巫女出現
     ・アニメーション

    4:黒巫女をクリック→N→停止のままクリック待ち
     ・リンクの設定(クリックしたらページ1へ)
     ・ページプロパティ(終了後、クリックされるまでストップ)



    1に戻る

    というところですな。

    そしてこれをswfファイルとして吐き出すと、
    http://ramiltass.homeip.net/www/upload/swf/ken006.html
    こーなります。

    ループ系のflashはこれの応用でできあがります。
    なお、
    「テキスト文を表示する」
    という事柄を間に挟み込めば、
    「ビジュアルノベル的なものがすぐできる」
    ということでもあります。

    要するに、

    1:背景表示

    2:キャラ登場
     :文章表示

    3:ボタン表示

    4:ボタンを押した?→N:ボタン押し待ち



    次のページへ

    ということなわけで。
    なんかいろいろなものが出来そうな気配ではあります。

    ともあれ次は変数の話を一つ。

    んじゃまた明日ー。

  • 2006年03月17日そういうわけで

  • 昨日のflashに変化を与えてみんとす。
    ken12.jpg
    まあこの画像を右クリックするか、画像を左クリックしてアクティブにした後、上部メニューから、
    「オブジェクト→アニメーションの設定」
    を選ぶ、と。

    右クリックの場合は、
    ken16.jpg
    こんなウインドウが出ます。
    やはり「アニメーションの設定」を選択する。

    そしてここからが、他のflash作成ソフトとflashmakerの違い、だと思う展開というか何というか。
    本来、flashというのはスクリプトと呼ばれる言語に従って絵を動かします。たとえるなら画像がサイトの表示、スクリプトはhtmlデータですな(例えが悪いか)。
    しかしFlashmakerは、
    「よく使うタイプのスクリプトを、アイコンとしてまとめて選択式にし、スクリプトを打つことが出来ないようにした」
    というものになっています。
    要するにテンプレート化というか、マニュアル車からAT車にしたというか。
    だから、「アニメーションの設定」を選ぶと、他社ツールでは大まかな動きを指示するためのウインドウとそれを補正するためのスクリプトウインドウが出るものですが、flashmakerの場合、
    ken17.jpg
    こんな感じのアニメーションアイコンが並ぶ。

    アイコンは、
    「登場」
    「(登場後後の)移動、動作」
    「退場」
    の三グループに分かれており、これのどれを入れても良いことになっています。

    ※つまり
    「登場から即退場アニメにしてもいい」
    「始めからいきなり出ていて、退場するだけにしてもいい」
    「退場しなくてもいい」
    という感覚。

    制約があるとすれば、
    「各アニメーション、詳細設定までは出来るが、大きく変わるわけではない」
    「登場・移動、動作・退場、は、その順番を護らねばならない(たとえば退場の後に移動、動作、登場は出来ない)」
    「このアニメーションを止めて、そしてキー反応待ちにする、ということは出来ない=但し、アニメーションするオブジェクトにキー反応を与えることは可能」
    「アニメーションは、1オブジェクトにつき、最大で登場一個、移動、動作一個、退場一個しか与えられない」
    というところでしょうか。

    なお、アニメーションのアイコンウインドウは何故か大きさが変更できず、一覧を見ることが出来ません。
    だからちょっと作ってみた。

    ●登場アニメ一覧
    anime01.jpg

    ●移動、動作アニメ一覧
    anime02.jpg

    ●退場アニメ一覧
    anime03.jpg


    これだけの動きを、オブジェクトに対して与えることが出来る、と。
    そして”これ以上のことが出来ない=スクリプト制御出来ない”がゆえに、
    「flashmakerのアニメーション製作は高速です」
    いやホント。偉い早い。

    いやまあ、実際、長々書いてきたから忘れてる人も多いと思いますが、実質今までやって来たことって、
    「ドキュメントを開いて、その上に画像をドロップしただけ」
    なのです。
    ぶっちゃけ一分掛からないですやね。
    そして、
    「右クリックでウインドウ開いてアイコン選ぶだけでアニメーションflashが作れる」
    って、コレ確かに凄まじい話です。

    ともあれ実践として、アニメを入れてみる。
    ・入場にフェードイン
    ・退場にフェードアウト
    という、まあ、
    「現れて消える尻」
    というアニメーションですな。
    ken18.jpg
    んでまあ退場まで選んでタイムラインを確認すると、
    ken19.jpg
    こんな風になっております。
    タイムラインの表示バーの左右を占める白部分、左が入場フェードイン、右が退場フェードアウトの所要時間です。
    中央の空白部は、”移動、動作”のアニメを設定すると入るようになります。
    なお、フェードインとフェードアウトが白いのは、アニメーションアイコンを選択するウインドウを見て貰えば解ると思いますが、
    「アニメーションは動きごとに色でグループ分けされている」
    んですな。
    別色に属する動きを入れれば、その色となります。

    ※余談
    なお、フェードイン、フェードアウトは他の登場、退場アニメとは別格で、これらだけは、
    「移動、動作アニメと重ねることが出来ます」
    つまり、移動、動作のアニメーションをフェードインしながら、フェードアウトしながらつかえるわけで。
    多くの登場、退場アニメは「フェードインしながら」「フェードアウトしながら」というのを詳細設定で設定できますが、それを移動、動作側にも与えられるわけですな。

    なお、このタイムラインにおける表示バーは、自由に伸縮可能で、中のアニメも同様です。但し、アニメーション部分は、
    「そのアニメーションを描くフレーム数」
    ですから、
    「アニメーション部分を短くすると、動きの荒いアニメになる」
    わけですな。
    今回の場合は24フレ持っていますから、24fps下では一秒で現れ、半秒存在し、一秒掛けて消えていくアニメになります。

    そしてここまで出来たら、とりあえずプレビュー見る。
    ken14.jpg
    上部アイコンバー、左から三つまでは大体解ると思います。
    四つ目のSWFはflashファイルの吐き出し。
    次のフィルム全体は、全シーンのプレビュー。
    次のフィルム一部は、そのシーンのみのプレビューです。
    シーンプレビューで確認し、動きを確かめます。

    ※余談
    すげえー、と思ったのが、音楽を重ねて入れているとき、シーンプレビューでは、
    「その音楽が、そのシーンでは”ここから始まる”場所から始まってくれること」
    だったりします。
    これが出来てないと、音と動きを合わせるのが偉い大変なのですな。
    意外とコレ出来てないツール多いです……。

    んで、動きを確かめてオッケーだったら、swfファイルとして吐き出す。
    ここまで五分も掛からない、と。
    そして出来上がったのがコレ。

    http://ramiltass.homeip.net/www/upload/swf/ken002.html

    とりあえず現れて消える尻が出来ました。
    んで、ちょっと試しとして、
    「タイムラインをいじるとどうなるか」
    をやってみます。
    ken20.jpg
    こんな設定ですな。

    http://ramiltass.homeip.net/www/upload/swf/ken003.html

    こんな感じでタイミングが変化します。

    んじゃ、勢い余って動きのある登場を作ってみましょう。
    「上から現れる」
    というのを使います。

    ken21.jpg
    これですな。
    左のチェックがちょっと小さいですけどご確認。
    ・フェードイン登場。
    ・近くから現れる
    というのにチェックを入れています。
    このうち、
    「近くから現れる」
    というのは、
    「その絵の下端を、画面最下ラインにつけた状態をスタートとする」
    ということです。つまり始めから絵が画面に入っているところからスタートになります。
    これにチェックを入れていないと、
    「絵が、何もない画面に、上から落ちるように入ってくる」
    ことになります。
    そしてタイムラインも(ここでは見えませんが)、登場のみで60フレーム使用するようにしました。

    なお、キャラの置き位置は、
    ken22.jpg
    こうなります。
    これは、
    「”上から入ってくる”絵が、最終的にどこでストップするか」
    を、置き位置で示すものです。
    もし尻の部分を置いていた場合、60フレーム掛けて、キャラの最下部分から尻までスクロールして停まることになります。
    当然のように、「下から入ってくる」を選んだ場合は、この逆になります。

    そしてフェードイン、フェードアウトのタイムバーを変えたときにも明確ですが、こういう動作系のアニメは、
    「そのアニメのタイムバーを伸縮させることで、移動速度を変えれる」
    ことになります。
    つまり左から右への移動を24フレーム掛けて行うのに対し、12フレームで行った場合、移動速度は二倍になります。
    中割が欠けるため、動作の綺麗さは半分になりますが、どこまで許容できるかで考えておくと吉です。

    んで、このflashは、

    http://ramiltass.homeip.net/www/upload/swf/ken004.html

    こうなる、と。
    ぶっちゃけ、音に合わせてこんな動きを連続させるだけでMC的なものは出来てしまう気が……。
    ううむ。

    と、そんなところで。
    次、余裕あったらシーンとか、そっち行こうと思います。

    ●余録
    なお、動きの中に「揺れる」というのがあるんですが、
    http://ramiltass.homeip.net/www/upload/swf/ken005.html
    どう考えてもそっち系にしかならん気が……(流石に尻でやるのは気が引けた)。
    波の動きにでも使うんでしょうか……?
    うーむ……。

  • 2006年03月16日それでは

  • flashをテキトーに作ってみんとす。
    まあ、画像をドラッグアンドドロップで載せればいいだけなので、

    ken12.jpg
    とりあえずこんな感じで一つ。
    何故に尻かという疑問に対しては、こうしておけば少なくとも人類の半分は見るだろうと言う聡明な判断によるものであり、これから先作られるflashを見たくもないのに見てしまった男性は、
    「く、……こんな男のいうなりになるなんてっ……」
    とかつぶやくとあまり意味がないですというか一生で言う機会無い台詞だと思うのでここで言ってみるのはいかがなものでしょうかと書こうとして何だこの日記と気づきました一文長っ。

    あ、あと、左ウインドウの素材ファイルのパレットは「マイネットワークに対応していない」ようです(見落としかも)。
    が、保存などはLAN側に出来ます。未対応というわけではないのですな。
    なので、素材類は別ウインドウとしてエクスプローラなりでLAN側の素材フォルダを開き、そこからドラッグアンドドロップすると使えます。

    んで、置いてみると、タイムラインがこうなるはず。
    ken15.jpg
    基本設定で、置いたオブジェクトは60フレーム表示されます。
    つまり、現在24fpsなので、60÷24=2.5秒ってとこですな。
    なお、このフレームのタイムラインバーは、一フレーム単位で伸縮可能です。

    ですがタイムラインの60フレ中、この画像は表示しっぱなしなので、
    「このままだと止め絵に見える」
    はずですな。

    やってみる。

    http://ramiltass.homeip.net/www/upload/swf/ken001.html

    「く、……こんな男の言いなりになるなんてっ……」
    うるせえ。
    でまあ、表示されましたが、マジに止め絵にしか見えません。
    しかし実際は、
    「一秒間に24回書き直している」
    のです。

    そういう意味ではflashが出来たと言ってもいいでしょう。
    んじゃ、明日はちょっと変化を加えてみます。

  • 2006年03月15日続き

  • というわけで作成例の作業続行と行こうと思ったんですが、肝心なことを一つ失念。
    それは、
    「透過素材」
    を作る方法を構築しておくこと。
    透過素材ってのは何かというと、ken06.jpg
    まあこういうものであるのことよ。
    つまり、PC上では画いうたら四角の形状内に収まるしかないわけですが、そうだとすると、
    「書いていない部分を透明にするにはどうするか」
    な話が必要になる、と。
    上の画像だと、重なってる部分、描いてない場所がちゃんとヌケてますな。フツーの場合、こうはならない。
    これは何も描いていない部分に、データとしての透過色が設定されてるわけです。

    gifの場合は検索掛けるなりすればやり方出ると思うので、今回は自分用ということでフォトショ使用のpng透過色設定を一つ。

    まあ、こういう画像↓を出します。背景は透明です。
    ken08.jpg
    そしたら、以下の手順を踏む。

    ●表示部分を結合

    ●画のレイヤーを複製

    ●複製レイヤーの表示部分を保護

    ●画の部分を純黒で塗りつぶす

    ●チャンネルで選択範囲

    ●レイヤーマスクの作成(アルファチャンネルの作成)

    ●選択範囲に従い、アルファチャンネル上に置ける、画がある部分を消去

    ●複製レイヤーを消去

    ●チャンネルでRGB表示

    ●チャンネルでアルファチャンネル(マスク)を不可視状態にする

    ●レイヤーに戻る

    ●画像の統合
    ※これちょっと記憶で書いてるので、間違ったら後々訂正します。うろおぼえですまんす。

    とすると、以下のように白背景の一枚画が出来る、と。
    ken09.jpg
    単に白背景に見えるけど、チャンネルに行ってアルファチャンネルを表示して、レイヤーに戻ると、赤い背景になってるはず。

    んじゃ表示、
    ken11.jpg
    おお、ヌケてるヌケてる。

    要は、アルファチャンネルでマスク(隠す板、と考えるべきか)を作り、マスクからキャラ部分を抜いて、すかしたいところにアルファチャンネルを残したまま隠して統合→保存。
    この方法は、
    ・アルファチャンネル
    ・アンチエイリアス含みの範囲指定
    ・PNG保存
    が出来るタイプのグラフィックツールでないと出来ないかと思います。
    専門的なことはよくわからないので、他方法あったり、考え違いもあるのかと思いますが、とりあえず自分はこんな感じでやってますということで。
    ツールによってもいろいろあると思うので、必要だと思った方は各自調べてみてください。

    んで、
    「こんなん作り方わからねえー」
    という人は、
    「四角い素材を作ればいい」
    のだと思います。
    ぶっちゃけ、先日のデモで、
    「カード風の表示」
    をやってますが、アレ、ヌキが出来なかったときのために作ったものです。
    あの形状だったら、透過色設定が無くても大丈夫。
    他にもたとえば、
    「顔グラフィックウインドウ」
    などを作ってしまえば、やはり透過色設定なしでいろいろ出来ます。
    ここらへん、工夫と納得次第だと思うので、考えた方が勝ちかと。

    んじゃ明日から作例というか練習入ります。

  • 2006年03月14日んじゃあ不勉強ながら

  • FLASHMAKER3でのFLASH作成の実演を、研究の手始めにしてみんとす。
    目的は、
    ・flashについてまだよーわからんので諸機能の理解などのため
    ・FM3についての理解を深めてみんとす
    ・飽きたり忙しくなったらやめる
    という感じ。最後のは目的じゃねえー。
    なお、FM3のサイトはhttp://www.ifour.co.jp/product/flashmaker3/

    んで、FM3のマニュアルはマジに必要事項だけ書いてあるタイプのものなので、詳細はガイド本によりますというかこのガイド本でようやく”操作系”のマニュアルという感覚が個人的には。
    http://www.bnn.co.jp/books/archives/2005/09/flashmaker_3.html
    こんな本も出るようですな。
    http://www.bnn.co.jp/books/archives/2006/03/flashmaker_moti.html

    んではまずFM3を起動する。
    ken01.jpg
    新規作成ウィザードを選ぶと、
    ken02.jpg
    画像小さすぎたなあ(遅いって)。
    で、ここで「空のドキュメント」を選ぶ。
    すると、
    ken03.jpg
    こんな感じにドキュメント(つまり作る画像枠のサイズ)を聞いてくる。
    デフォルトは800×600だけどこれは大きすぎるわけで。
    今回は作例なので300×200としておく、と。
    あと右上ではフレームレートを聞いてきてます。

    ※フレームレート=一秒間に何枚描くか。

    デフォルトは12ですが、コレは一秒間に12回画像を書き換えるということ。なのですが、結構ガクガクするので、無駄に24フレームにしておきます。
    なお、作業は一フレーム単位で行うのが基本ですが、
    「後でフレームレートを変更した場合。作ってきた表示画像の表示フレームは自動で変更されません」
    つまりフレームレート12fps上に置いて、画像60フレームのflashアニメを作った場合、60÷12=五秒のアニメとなります。
    が、あとでこのflashドキュメントをフレームレート二倍の24fpsにした場合、その60フレーム動作の画像は120フレームに自動変更されません(※特殊操作で出来るのかも)。
    60フレームのまま、2.5秒のフラッシュアニメとなります。
    これは全素材がそのままなので、後からフレームレートを変えることは、
    「ひどいことになる」
    というわけで。
    だから初期段階で、24fpsくらいにしとくわけですな。

    なお、これが12fps60フレの場合。
    http://ramiltass.homeip.net/www/upload/swf/kenkyu0112.html
    そしてこっちがそれを24fpsに変更した場合。
    http://ramiltass.homeip.net/www/upload/swf/kenkyu0124.html
    書き換えのコマ数は同じですな。

    んでまた、このドキュメント作成のときには、背景の色をどうするかを聞いてきます。
    いろは結構指定できたりブレンドで作れますが、
    「白か黒が無難」
    であるとは思います。
    理由としては、
    1:素材を置いたとき、縁が見やすいので位置が補正しやすい。
      (素材の縁色などによって白か黒かを選択)
    2:フェードイン、フェードアウト時に自動でフラッシュ、ブラックアウトになる。
    というところで。
    特に2の理由が強いです。というのも、アニメーションの場面転換で用いるフラッシュアウト(白)やブラックアウトは、FM3に”画面効果”が無いため、その表現を作ることになります(白板や黒板を、高速でフェードイン~フェードアウトさせる)。
    白板や黒板も、当然に画ですからデータを持つのですが、背景が白や黒だと、
    「上に乗っている画像をフェードイン、フェードアウトさせるだけで同じ効果が得られる」
    ということになります。

    んじゃ、さっきのを使って試しましょう。
    こっちが、バック白でキャラの方がフェードアウト。
    http://ramiltass.homeip.net/www/upload/swf/kenkyu0124.html
    こっちは、キャラの上に白板をフェードインしてます。
    http://ramiltass.homeip.net/www/upload/swf/kenkyu02.html
    当たり前っちゃ当たり前だけど変化は無いですな。
    ちなみにどっちも、この程度だとファイルの大きさに差はないです。大きな画像になると差が出るとは思っています。ともに61kb。

    なお、フラッシュとブラックのインアウトは、作られるムービーに雰囲気的な影響を与えます。白が多ければ清涼的、黒が多ければ重厚的になるわけですが、もし素材フェードで背景色を出してその効果を狙うなら、初期段階で全体のイメージを考えておいた方が吉です。
    それ以外としては、手間とか、素材管理の差で使い分け、ファイルの大きさが気になるなら率先して省略していく方がいいでしょうか。

    あ、なお、オブジェクトを「描く」というのも方法としてはあるし、そっちの方が有用だと思うんですが、わし、そっちの方は食わず嫌いなのですいませんが考えてません。
    おそらく、初めてflashしてみようかいう人には、オブジェクトを描くよりも素材を置けた方が直接的に面白いんじゃないかとも思うわけで。
    そんな感じで御了承下さい。

    以下続く。

    ※追記
    あ、昨日言っていたオブスタプロトタイプのデモのムービー化は、試しているのですが上手くいってません。
    videostudioでデータを取り込むと、音が鳴らず、どうもnemesis表示のあたりで動きが止まってしまうという状態で。音データを外してswfにしして、videostudio上でmp3と合成した方がいいのかな、とか。
    こちらとしてもflashがムービー化できないと、企画提示の時などムービーで持ち出せた方が楽なこともあるのでなかなか難しい、と。
    ちょっといろいろ試してみようと思います。が、上手くいかなかった場合は申し訳御座いません。うーむ……。

    エディタの”追記”でコレ書いたら、”続きを読む”に回されてアジャパーみたいな。
    見えないといかんことなのに隠してどーするとか。
    この追記機能は何の追記のためにあるんだろーか……。

  • 2006年03月13日何だか

  • so01.gif「デモが出来たよ。
    結局土日潰して完成。ネタは俺的ファンタジーというかもう使い回すだけ使い回したオブスタクルの――」
    hio.gifキャー! 使ってマワしますのー!!
    dia02.gif…………
    so01.gif「……まあそういうわけで、オブスタクルのプロトタイプの架空ゲームデモというか何というか。

    思い切り嘘デモ(サイズ500×400だし)なので、
    「これが発展して何かになる」
    とか考えないでくださいな、と。
    というか、現状、
    「こんなん作ってるって誰も知らないはず(笑)」
    という感覚ですし、素材もほとんど即興なので。

    また、これはオブ本編とは仕事として直接的には関係ないものなので、これがアレでナニとか連載再開とか、川上の気分がobに乗ってきたとか、そういうのの話や邪推は御容赦下さい。OBVの素材も使ってますが、あれも含めて自分素材は本編からはちょっとイレギュラーなので。
    純粋にネタとして面白がりたかっただけですので(作業も自宅の余暇時間のみです)、そこらへん、ご考慮頂けますと幸いです。

    あ、あと(まだあんのか)、
    書いてある英語らしきものは英語の形をした謎言語なので。
    つうか今、動いてるのを観ていたら、
    「書いた自分が読んで意味が解らないものが川のように流れていった」
    「何かsyntaxerrorが出そうなスペルがあった」
    いやよつばすごく驚いた。
    また、デモ作りながらテキトーに考えた言葉を入れてありますので、コレを読んでもobの秘密に迫れるとか、他シリーズに云々とか、そんなんは無いです。これ元にそこらへん語らないように御注意。(このデモの中だけで、”どんなゲームなんだ”ってのは有りです)
    マジに、
    「架空でこういうゲームが外国にあって、LOGINあたりで紹介されていたらどんなかなあ」
    みたいな、そっち重視したノリで作っていたので。

    sa01.gif「あと、音楽の方は
    音楽:happyblessing
    http://happyblessing.com/
    こちらのほうから、フリー素材をいただきました。どうも有り難う御座います。というか結構ここツボかもしれません。
    というか、デモがどー考えても曲に助けられてますねコレ……」
    so01.gif「あとまあノリとしては80年代末期から90年代初頭の海外製ゲームみたいな。AMIGA4000とか知ってる人は解るレベルのもので、そーでないなら逆に純粋に観られると思います。スタークラフトには世話になったなあ」
    so01.gif「んでダウンロードはこっち。
    http://ramiltass.homeip.net/www/upload/swf/obpdemo.html
    サーバ管理のramiltass氏は、ホントにどうも有り難う御座います」
    sa01.gif「なお、データは12mbくらいあります。また、flashなのでマシンによって再生状況がかなり変わります。ぶっちゃけうちのメインPCは1.5ghzの約800mbくらいのメモリ積んでますが、それでも結構”アレ?”な感じになってます。画像はちょっと劣化するんですけど、明日あたりにはムービー化してアップしようとも思っています」
    so01.gif
    「あと、最後の選択は、
    ・replay=一回だけ再生
    ・repeat=エンドレス
    ってことで一つ」


    ともあれ観て頂けると、それだけで幸いです。
    どもどもです。
    というか今観たらモニタの関係で見えてなかったしくじりが……!!
    まあそれも含めて「作ってるだけでも楽しかった」のでオッケーオッケー。

    しかしFLASHMAKER3、結構出来てしまうんだなあ……。
    何か恐れ入った気分であったりします。
    ううむ……。
    と、そんなところで。
    んじゃまた明日ー。

    «  | HOME |  »

    適当に

    最近どうよ?

    自画像

    川 上 ですよ

    川 上 ですよ



















    上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。