このチュートリアルでは、素早く動く文字のGIFアニメを作る方法を紹介します。

• Step1 ： はじめに
  
• Step2 ： テキストレイヤーを作成
  
• Step3 ： モーションブラーレイヤーを作成
  
• Step4 ： ImagereadyでGIFアニメを作成
  
• Step5 ： 完成
  

Step1：はじめに

このチュートリアルは、一般的なアニメーションの作成方法ではありません。
Adobe Photoshop / Imagereadyは、今回のチュートリアルのような小規模アニメーションのために使われます。
通常のテキストレイヤーとモーションブラー（移動してブレて見える）テキストレイヤーを加えて、アニメを作る方法を紹介します。
下の画像は私が作った例です。
[You must be registered and logged in to see this image.]




Step2：テキストレイヤーを作成

複数のテキストレイヤーが必要です。
モーションブラーテキストレイヤーを複製します。
アニメーションに加えたい3～5個のフレーズを選択してください。
それらが正確に中央に寄って、一直線になっているか確認してください。
[You must be registered and logged in to see this image.]









Step3：モーションブラーレイヤーを作成

3～5枚のテキストレイヤーを用意し、3～5枚のモーションブラーレイヤーを作っていきます。
それぞれのテキストレイヤーを複製してください。
（レイヤーパレットで）それぞれの複製したレイヤーが、複製元のテキストレイヤーのすぐ上にくるように配置してください。
決して、すべてのモーションブラーレイヤーを上にして、すべてのテキストレイヤーを下にしないようにしてください。
複製したレイヤーごとに、「フィルタ」-「ぼかし」-「ぼかし（移動）」を下の設定で適用してください。
[You must be registered and logged in to see this image.]




Step4：ImagereadyでGIFアニメを作成

Imagereadyで、「ファイル」-「編集」に行ってください。
「ウィンドウ」-「アニメーション」に行き、使用可能であることを確認してください。
アニメーションボックスに新しいレイヤーを作成してください。（ごみ箱アイコンの左側）
最初のレイヤーに対して、それを最初のモーションブラーテキストにしてください。
時間を0.1秒に設定してください。
次に、レイヤーボックスの下に行き、その時間をクリックしてください。
その後、2番目のレイヤーの時間を1.0秒に設定してください。
人が読めるように、テキストレイヤーがより長く目立つようにするためです。
[You must be registered and logged in to see this image.]
クリックして拡大
あなたが前のステップで行ったことを繰り返してください。
しかし、そこにもう一段階加えてください。
アニメーションボックスは、モーションブラーとテキストが繰り返されているはずです。
最後のテキストのあと、最初に戻って繰り返します。
[You must be registered and logged in to see this image.]
クリックして拡大




Step5：完成

アニメーションボックスの左下がForeverになっていることを確認してください。
再生をクリックして、どのように表示されるか確認してください。
テキストレイヤーがあなたが望んだようになっていなかったら、それぞれのアニメーションに対して、テキストレイヤーまたは
モーションブラーレイヤーが非表示になっていないかどうか確認してください。
このチュートリアルは、放射状のぼかしを使って上下に動くようにするなど、様々な異なった方法で使うことができます。
psdファイルを置いておきます。
[You must be registered and logged in to see this image.]





引用:Web Design Library　著者:Muxla.com　翻訳：日下部]