イラレのデータを背景透過で画像にする

こんちは、あーみです。

イラストレーター（illustrator、以下イラレ）で作成した細かいデータ、もしくは文字データをそのまま画像にしたい場合もある。

どうしたら、イラレを画像データにできるのか？　を検証してみました。

使用しているソフト

１）illustrator　CC

２）GIMP　2.10.8

GIMPとは、無料の画像編集・加工ソフトです。もちろん、Photoshopでもいいですよ。

イラレをPNG画像へ変換する

イラストレーターの文字組みデザインを画像にする方法です。

背景を透過させることが、大前提です。 ならば、保存形式はpngであることは決定。

１）イラレの画面を開きます

２）写真を削除、もしくはレイヤーで非表示にします
（文字は分かりやすくするため、黒にしてします）

３）ファイル　＞　書き出し（E)　＞　書き出し形式　＞　書き出し

４）「PNGオプション」が開くので、設定します

５）「OK」をクリック

６）文字だけのデザインが、背景透過（PNG形式）で保存された

７）GIMPを起動

８）6で保存したデータを開く

９）ファイル　＞　レイヤーとして開く　＞　背景に配置する画像を開く

10）文字が透過された状態で、背景画像が配置された

11）文字の大きさを考えて、縮小すれば完成です

完成した画像

文字も細い線も、きれいに出ています。

イラレの保存形式いろいろ

知っていれば、とてーも簡単なことなんですが。

「別名保存」では

イラレの別名保存では、PNG保存はできません。

「書き出し形式」では

でも「書き出し形式」にすると、もう少し保存形式が増えます。

知っているのと、知らないのとでは違いますね。

まとめ

デザインを考えて、そのままのデザインをWEBで使用したい…という場合があります。

イラレのデータを、ただスクリーンショットで撮影して、そのまま画像として使用できる場合もありますが、 画像と文字とは別々に使用したい場合も、ある。

文字デザインだけ、大きさ変えたり、配置変えたりとか。

スクリーンショットで1枚の画像として保存してしまうと、その調整ができないんですよね。

実は書き出しができる、とわかるまで、私はなんと

「イラレのデータをコピー」＞「GIMPで背景透明の新規ファイルを開く」＞「ペースト」

していたんですよ！！Σ(ﾟДﾟ)

そうすると、データ自体はペーストできるんですが、背景が透過されない。背景が白いままでペーストされるので、細い文字とか細かいデザインとか困るんですよ…

全部、GIMP上で必要ない白い部分を削除して透過させていたのです。

なんて面倒な！！！！！

AdobeでPhotoshop（フォトショップ）を使用していないと、互換性ないのかしら…と思ってしまいますが、なんと 無料の画像編集・加工ソフト「GIMP」 でも十分対応できます。

GIMPのダウンロードは下記からできますよ。↓

この記事が、あなたのお役に立ちますように。