弊社でもUI関連の業務はAdobe XDが主流となってきましたが、内容によってAdobe Illustratorで素材を作成することもまだまだあります。
素材ごとにアートボードを分けて素材作成をし、一括で書き出しをする方も多いはず。
少ない素材ならまだいいのですが、素材数が20…30…となるとアートボード名をきちんと設定しそのまま書き出し、それを開発へ渡す…という流れにするのが理想です。
しかし少しの書き出し方法の違いで、書き出した後のファイル1つ1つの名前を変更しないといけないことも…。
今回はアートボード名そのまま素材書き出しする方法を説明していきます。
まず素材ごとにアートボードを作り、それぞれに名前をつけてみます。
ボタン通常時と押下時の素材10個分のイメージです。
アートボード名そのままでPNGやSVG書き出しを行うためには、
ファイル>書き出し>スクリーン用に書き出し から行います。
そうすると書き出し設定画面が表示されます。
フォーマットなどの設定をして「アートボードを書き出し」をしましょう。
※ちなみに書き出すアートボード はチェックで選択できます
これでアートボード名そのまま素材書き出しすることができました！
こちらはMacのFinderで見たときの表示です。
逆に以下の方法で書き出しを行うと、全ての素材名の頭に共通の文言をつけられるようになります。
ファイル>書き出し>書き出し形式… から行います。
が、必ずつける必要があるため、アートボード名そのままで書き出すことができなくなってしまいます。
デフォルトはファイル名が表示されます。
今回はわかりやすくするため「頭につける文字をここで設定」に変更してみました。
このように書き出されるため、もし「頭につける文字をここで設定_」が不要な場合は
1つ1つファイル名を変えていく必要が出てきます。地味に辛い…
いかがだったでしょうか？
書き出し自体は後者の方法でも可能であるため、前者の方法を知らなかった方もいらっしゃるかもしれません。
目的にあった書き出し方法を使って、無駄な作業に時間をかけないよう工夫していきましょう！