Photoshop CS6にも対応！PSDからSVGにファイル変換できる無料スクリプトの導入手順を詳しく解説

SVGがブラウザ対応することで、使用頻度が上がってきました。制作の現場ではその修正の簡単さから、今後もSVGファイルが活用されるシーンは多くなりそうです。

 

こうなるとPhotoshopで作ったベクターファイルをSVGとして出力したくなりますね。ということで探してみると、こんな無料スクリプトがありました。

 

▼「PS to SVG」

http://hackingui.com/design/export-photoshop-layer-to-svg/

 

ちなみにこのスクリプトの対応状況は、

Photoshop CS5、 CS6｜（Windows／Mac）

となっています。

また最新のバージョンではうまく出力できないこともあるそうです。

 

「PS to SVG」を導入する手順

1.まず上記のサイトにメールアドレス（フリメ可）を登録すると、ダウンロードリンクが送られてきます。

 

 

 

こちらの「Download Now」をクリックすると、ZIPファイルがダウンロードされますので、解凍します。

 

2.次に解凍したフォルダごと、Photoshopのファイルフォルダの「Presets＞Scripts」へドラッグします。これでアクティベート完了です。

 

3.Photoshopを起動して「ファイル＞スクリプト」を見ると、「Save as SVG（SVGとして保存）」と「PS to SVG」というメニューが追加されていることを確認してください。

 

4.確認できたらなんらかのベクターファイルを作って、まずはPSDファイルとして保存しますが、この時つけた名前がそのままSVGファイルの名前になりますので、SVGファイルに合わせた名前をつけます。

 

5.そして先ほどの「PS to SVG」を選択すると、先ほどPSDファイルを保存した同じディレクトリにSVGファイルが出力されます。

 

 

ちなみに上記と同じやり方で「PS to SVG」はIllustlatorでも動くそうです。

とても簡単なのでPSDファイルからSVGファイルを出力したい時、ぜひ使ってみてください！

 

 

▼「PS to SVG」

http://hackingui.com/design/export-photoshop-layer-to-svg/

 

 

 

（※本稿は「Export your vector layers from PS to SVG in a single click!」を翻訳・編集したものです）