Adobe XDで思わず見ちゃう可愛いアニメーションを作ってみた♡

 

Adobe XDの自動アニメーションで作る、
ちょっとだけ動くテキストアニメーションです♪

「ちょっとだけ」がミソね。

Adobe XD 基本の使い方こちら

 

 

How to

1. 正方形のアートボードを作る

 


2. アートボードをクリックして、右側の【塗り】を選択
3.「ベタ塗り」から「線形グラデーション」に変更して、お好きなグラデーション作ってね。

 

4. 画像枠を作って、画像をドラッグ&ドロップ

 


5. テキスト入力
「PIANO」と1単語で打つのではなく、
1文字ずつ「P」「I」「A」「N」「O」と打つ。

 

6. アートボードをコピペ連打

 

 

7.
2枚目の「P」を少し上にあげる>
3枚目の「I」を少し上にあげる>
4枚目の「A」を少し上にあげる>
5枚目の「N」を少し上にあげる>
6枚目の「O」を少し上にあげる>

 


8. 【プロトタイプ】をクリック
ループするように青い矢印をつなげていきます。

プロトタイプ設定
【トリガー】時間 0秒
【アクション】自動アニメーション
【イージング】スナップ 0.2秒

※【自動アニメーション】にしないと、つながりで動作しないので注意です。

 

 

完成〜♡
いいかんじ。女子受けよさそう。ふふ

 

 

View this post on Instagram

 

Amity_senseiさん(@aaamity)がシェアした投稿

 

 

Adobe XD 自動アニメーションについての他記事