プロトタイプ製作ツールAtomicの使い方 アドバスンスドモーションを設定する方法

多くのプロトタイプ作成ツールが決まったアニメーションしか出来ない中、細かなアニメーションを再現できるプロトタイプ作成ツールを探していてAtomicに出会いました。

Atomicは有料ですが、新規登録後1ヶ月は無料で試用する事が可能です。

しかし、肝心なやり方が最初はイマイチ分からずに苦労しましたので、メモも兼ねて書いておきます。

1.キャンバスにオブジェクトを配置して左サイドバーのPAGESからPage 1を複製(Depulicate)します。

2.複製したPage 2のオブジェクトをアニメーション後の位置に移動させます。今回は下へスライドさせるものとします。

3.Page 1に戻り、ツールバー下から2番目のHotspotツールでクリック領域をドラッグして作成します。ここではオブジェクトの上に作成しました。

4.右サイドバーのINTERACTIONでGO TOをPage 2に、MOTIONを Adovanced motionにするとタイムラインが画面下に現れます。

5.シークバーをドラッグするか再生ボタンを押すとアニメーションを確認出来ます。タイムラインのバーを伸縮したり前後に移動させたりイージングを設定したりも出来ます。

スポンサーリンク
スポンサーリンク



フォローする