サンプルトップ

 音楽はつけていません。

ここに収録のサンプルは送信後のメールを変換後に一部編集しているものがあります。そのため”ぴあにしも”本来のソースとは若干違うものがあります。基本的には”ぴあにしも”だけでできることを前提にしております。
またHPに載せる必要からWEB用に素材へのファイル指定方法を変更しております。
※このサンプルを保存してメール用に使用することができない場合があります。
あくまでサンプルなので、ひな形として使用しないようお願いいたします。

作者も組み合わせ次第でどのようなアイデアが生まれるのかはわかりません。あくまでも一例として取り上げておりますので、皆様には感性とひらめきで可能性を引き出していただけると嬉しく思います。

サンプルは別のページで開かれます。
※画像がちらつく場合は、インターネット一時ファイルの設定で【ページを表示するごとに確認する】以外に変更すると軽減できます。

コンテナを使用したエンディング

１、Closed Door サンプル1

エンディングではドアとして使用する１つのコンテナの配置を【左端・右端の位置で指定する】【上端・下端の位置で指定する】機能で「左端=Left基準の0px」「右端=Right基準の0px」「上端=Top基準の0px」「下端=Bottom基準の0px」にします。
これによりコンテナはウィンドウ表示領域いっぱいに表示されることになります。
このコンテナに背景色ブルーにし【表示開始効果】で”ぱっと現れる”設定にします。【表示開始時間】はドアが閉まり始める時間に合わせています。 note：【表示開始効果】は他の効果を使用してもおもしろいでしょう。

ドアが閉まった後に表示される煉瓦画像のあるボックスとその上に表示されるメッセージはメッセージボックスを重ねて表示させています。
サイズを大きさの差分変え、Center配置で設定します。後ろ側メッセージボックス１にはメッセージを入れていません。
先にタイル画像を背景画像に設定したメッセージボックス１を【タイマー】で表示開始させ、時間差でメッセージボックス２を同じく【タイマー】で表示させています。【表示効果】もそれぞれ別のトランジション効果で行っています。

カメラやその仲間たち・宇宙船は【VML+TIME回転】で移動や回転・透過を行っており、宇宙船から照射される光線は縦長のコンテナを”ぱっと現れる”=>”ぱっと消える”で表示、このコンテナには背景画像を”上から下へスクロール”で動かしてビームのように見せています。
「曲線の座標微調整ができるようにした方が使いやすい」という、あやなおたかしゅんさんからの助言により実現させていただいた、終点座標の直接入力により、宇宙船の停止位置やカメラの停止位置微調整が楽でした。

ストーリー途中に表示される文字は現在バージョンではコンテナで実現できます。コンテナのメッセージ入力欄に<span style="font-size::48pt">一匹の亀が・・・</span>などタグを入れることが可能です。

尚、最初のオープンドアは”Loading Message”の”左右に開く”で、各ドアであるTableには煉瓦画像を背景画像としてセットしています。

重ね順は、ドアコンテナ < メッセージボックス１ < メッセージボックス２ < 著作表示ボックス < Loading Messageに設定しています。

２、Closed Door サンプル２

基本的にはサンプル１と同じコンテナで閉じるドアを行っています。【表示開始効果】に”pushWipe”を用いて右から現れるように見せかけています。
またこのコンテナには縦長の背景画像をセットし、”右にスクロール”させています。

最後に表示される”The End”はメッセージボックスで、フォントやフォントサイズ・フォントカラーなどを設定して”fadeトランジション”で表示させています。Scripinaフォントがない方はゴシックで表示されると思います。

著作表示ボックスの重ね順を一番大きくすることで最前面に表示されるようにしています。

表示開始時間や表示サイズ、表示効果や重ね順を工夫することで、コンテナでもオープンドアやクローズドドア、ストーリーのナレーションメッセージとして利用することが可能になります。

３、Closed Door ２つのコンテナで左右にドア表示 サンプル４ ・・・長いです

このサンプルは少し遊び心で作りました。メッセージボックスを最後に表示させていますが、ドアを最後に表示させて閉じるのも良いかと思います。

メッセージボックスが表示される前に表示される左右のボックスはコンテナで、左右に二枚配置させるために、表示開始時間や表示変化時間を同じにしています（同時に表示させるため）。

配置方法ですが、基本的にはサンプル１と同じで、左側のボックスは右端の位置をCenter基準で0pxに、右側ボックスは左端の位置をCenter基準で0pxとして、半分ずつ表示させています。

【VML+TIME回転】

１，回転＋透過＋移動のいくつか　サンプル３

【VML+TIME回転】機能でサンプル作成しました。ここでは動きのみのサンプルです。

回転と透過変化と移動を組み合わせると処理能力の低いマシンでは回転がぎくしゃくすることがあります。

基本的にそれぞれの動作時間内に透過変化と曲線移動と角度変化をTIMEで行うものです。

【ウィンドウサイズの複数画像ボックスで画像入れ替えに見せかける】

１、サンプル5

説明はなし

 【リング--輪の中にはまり込む--同じサイズの画像を曲線移動+TIME並列動作のアイテムをペアで使用する】

１、サンプル6----画像使用許可いただいております。

このサンプルの素材はすべてゆみこさん作です。

帽子はこの２つを使用しています。重ね順を変えていますが移動曲線などは全て同じ。SPにある機能の【同じサイズの画像を曲線移動】で行っています。
この２つの画像サイズは全く同じに作られています。枝木や女の子のZ-INDEX値に対し、挟み込むようにZ-INDEX値を設定して、全く同じ動作を行わせることで一体となって動いているため、一つの画像のように見えます。

この【同じサイズの画像を曲線移動】機能は１つしかありません。大小の花輪は【TIME並列動作】で２つのアイテムをペアで使用して【同じサイズの画像を曲線移動】と同じことを実現しています。

画像はと で、これも同じサイズの画像です。
 【TIME並列動作】ではサイズを変更できるので、小さい花輪は縮小して表示させています。大きな花輪も最後にサイズ変更により小さくなっていくようにしています。

【ポップアップのサンプル】サンプル7

WEB用に編集しておりますので、保存してメールにすることはできません。

Copyright(c) 2004 My Software. All rights reserved.