Flash

ActionScriptで作るトランジション – 変わりマスク編

今回は、マスクの端に変わったシェイプを置いてみます。マスクの端に意味のある形があると、より印象に残る演出になるでしょう。例えば航空会社や旅行のサイトでは、このような飛行機の形をマスクの端につけると、いつも見るサイトと違った雰囲気を見ている人に感じてもらえるかもしれません。
マスクの端をシェイプにしたトランジション
transition5.jpg


マスクの先端につけるシェイプのほうは、BlendMode.HARDLIGHTでブレンドさせておきます。

plane.cacheAsBitmap = true;
plane.blendMode = BlendMode.HARDLIGHT;

基本的にはマスク編とほぼ同じ作りですが、マスク本体とシェイプの2つの表示オブジェクトを同時にトゥイーンさせるので、BetweenAS3.parallel()を使います。

var t1:ITween = BetweenAS3.to(frontMask, { x:0.0 }, 1.2, Quad.easeIn);
var t2:ITween = BetweenAS3.to(plane, { x:1500.0-630.8}, 1.2, Quad.easeIn);
var t:ITween = BetweenAS3.parallel(t1, t2);
t.addEventListener(TweenEvent.COMPLETE, tweenCompleteHandler);
t.play();

Author

  • Shuichi Ishikawa
    Shuichi IshikawaShuichi
    Ishikawa
  • MikasaHideyuki
    Hideyuki MikasaHideyuki
    Mikasa
Shuichi Ishikawa
執行役員/インタラクションデザイングループ

フロントエンド開発からクラウドサーバー構築まで、新しいことに興味がありすぎて時間が足りない制作部門リーダー。Adobeインフルエンサー。九州芸術工科大学→ドリームキャスト→サーバーサイド→フロントエンド→執行役員→早稲田大学大学院→Kinect v2

好きな飛行機
B787-8
好きな空港
SXM
好きな航空路
Y28
Hideyuki Mikasa
オーサリングエンジニア

mikasa's text