PSD からテキスト情報を抽出するスクリプト

こんにちは。デザイナーの高口です。

デザイナーの皆さんは、デザインを開発者に伝える時、どのようにしていますか？ 口頭で伝える、印刷したデザインに書き込む、指示書を作る…様々な手法があると思いますが、どれも時間がかかりますよね。

そこで今回は、伝える手間を少しでも減らすべく、PSD からテキスト情報を抽出するスクリプトをご紹介いたします。

1.スクリプトをダウンロード

まず、下記のリンクからスクリプトをダウンロードして下さい。
(ご利用に際しては、自己責任にてお願いいたします。)

ダウンロード ： TextExportToCSV

ダウンロードしたファイルを解凍すると「TextExportToCSV.jsx」というファイルがありますので、下記のフォルダにコピーして Photoshop を再起動して下さい。

Windows – C:\Program Files\Adobe\Adobe Photoshop CS6\Presets\Scripts
Mac – /Applications/Adobe Photoshop CS6/Presets/Scripts/

※環境によっては違う場所にあります。

2.PSD を開き、スクリプトを実行

次に、テキストを抽出したい PSD を開き「ファイル」→「スクリプト」→「TextExportToCSV」からスクリプトを実行します。

3.CSV ファイルで出力完了

スクリプトを実行後、CSV ファイルが指定した場所に保存されますので
「Shift-JIS、カンマ区切り」で開いてください。
「テキスト、フォントの種類、フォントのサイズ・色（HEX,RGB）」が表示されます。

あとはこれを開発者の方に渡すだけで、フォントの指示とはおさらばです。

※スクリプト実行時に

スクリプト実行時にレイヤー数が多すぎる場合、実行に時間がかかってしまいます。
その場合、レイヤーの検索機能で不要なレイヤーを削除してから実行するとスムーズです。
※ Photoshop CS6 からの機能です。

いかがでしたでしょうか？
フォント指示の簡略化という些細なものですが、皆様の手助けになれば幸いです。

フェンリルのオフィシャル Twitter アカウントでは、フェンリルプロダクトの最新情報などをつぶやいています。よろしければフォローしてください！