illustratorにてアセットの書き出しを行う場合

「ウインドウ」→「アセットの書き出し」でツールを表示させます。

「アセットの書き出し」へ書き出したい要素をドラッグします。 画像がグループ化されていない場合はあらかじめグループにしておかないと バラバラで書き出しされてしまうため注意が必要です。

「書き出し設定」から「拡大縮小」でサイズを設定していきます。 Retina化する際は2×を選択しましょう。

「スケールを追加」を押すと、一度に複数の形式で書き出すことが出来ます。 いちいち何度もボタンを押さなくても良いよう、まとめて書き出してしまいましょう。

形式はjpg、pngなどいろいろ選ぶことが出来ます。 「書き出し…」ボタンを押すとファイル場所を指定することが出来ます。

自動的に名前のついたフォルダ内に格納されるためとても分かりやすいです。 これでillustratorでの書き出しは完了です！

Photoshopにてアセットの書き出しを行う場合

レイヤーを右クリック→書き出し形式を選択します。

「書き出し形式」が開かれるため、「拡大・縮小」で大きさを選択していきます。 Retina化する際は100%を200%にすることで、2倍の大きさで書き出すことが出来ます。

「すべてを書き出し」ボタンを押してファイル場所を指定します。 Photoshopの場合は自動でフォルダは生成されず、そのまま画像が保存されます。