Photoshopがもっと便利になるすごい機能拡張・プラグインのまとめ
Post on:2015年1月13日
Photoshopは標準機能だけでも便利なツールですが、もっともっと便利になる機能拡張やアクションを紹介します。
定番として入れておきたいものから、特別な使用シーンに使うものまで、優れ物ばかりです。

- Photoshopでのガイド引きに欠かせない強力な機能拡張
- 定番のGuideGuideは3.1.2にバージョンアップ
- 幅の異なる複数のガイドを一気に作成できる優れ物
- Photoshopのスウォッチをフォルダで管理
- カラーピッカーを開かずにカラーのコードを簡単コピー
- 複数のさまざまなオブジェクトのカラーを一元管理
- 手元の画像からシームレスなテクスチャを1クリックで作成
- ビットマップのオブジェクトをベクターに変換
- 画像にパースをつけてかっこよく見せる
- パラグラフのレイアウトを段組みに変更
- 要素のサイズやエフェクトやフォントなどの情報を書き出す
- エレメントやマージンのサイズを書き出してくれる
- 黄金比、黄金螺旋、黄金三角形、1/3ルール、対角線などを簡単に描く
- レイヤーパネルでの作業をいろいろ便利に
- UIデザインでのレイヤー作業が便利になる
- ウェブページのプロトタイプが簡単にできる
Photoshopでのガイド引きに欠かせない強力な機能拡張
ガイド関係はCC 2014になってPhotoshop自体の機能もかなり強化されましたが、この機能拡張の便利さは手放せません。

QuickGuide (無料)
対応:CC 2014
一番の特徴は選択範囲を元にガイドを引けること。上下左右・天地左右の中央など1クリックでガイドが引けます。またガイドのロック、コピーして別ファイルにガイドをペーストできるのも便利です。
インストール方法やより基本的な使い方は、下記ページを参考にしてください。
定番のGuideGuideは3.1.2にバージョンアップ
GuideGuideは当ブログで紹介したことがあり使用している人もいると思いますが、そのGuideGuideが大きくパワーアップしました。

GuideGuide 3.1.2 (無料)
対応:CS5, 5.5, 6, CC
右側の黒いパネルがGuideGuideの操作パネル、上下左右のマージン、カラムの数・サイズ、溝のサイズを数値単位で設定することができ、カラムと溝の中央、水平・垂直の中央、天地・垂直の際などは1クリックでガイドが簡単に引けます。一度設定したガイドはセットとして保存しておくことも可能です。
上記ページではオンラインデモがあるので、ダウンロードの前に試すことができます。
インストール方法やより基本的な使い方は、下記ページを参考にしてください。
幅の異なる複数のガイドを一気に作成できる優れ物
幅の異なるカラムなど、複数のガイドを一気に作成できる一味違ったガイドが引ける機能拡張です。

Speed Guide (無料)
対応:CS6, CC, CC2014
キャプチャの式はちょっと難しくて使いこなせないかも、、、という人でも大丈夫。例えば「10 20 40 100」と入力すると、左から10px 20px 40px 100pxの位置にガイドが引けます。四則演算以外にも独自の記号が用意されており「100px@5」で100px間隔で5回、「:10px」で右から10px、「$10px」で中央から10pxといった使い方もできます。
Photoshopのスウォッチをフォルダで管理
スウォッチをフォルダで管理できたら便利なのに、と思っていた人に朗報です。

Swatchy (無料)
対応:CC, CC2014
コンセプトは非常に面白いのですが、既存のスウォッチと互換性がないのが痛いところです。Swatchyのパネルにカラーを登録するには、全部新規で作成する必要があります。
カラーピッカーを開かずにカラーのコードを簡単コピー
カラーのコードを取得するために、カラーピッカーのパネルを開く必要はありません。

Hexy (無料)
対応:CC2014
カラーピッカーで前景色になっているカラーのコードを取得するだけのシンプルな機能拡張です。スポイトツールでカラーをクリックするだけで、コードがコピーできます。
複数のさまざまなオブジェクトのカラーを一元管理
テキストやボタンなど、さまざまなオブジェクトのカラーを簡単に一括で変更できます。

Prisma(無料)
対応:CS5+
ドキュメントに配置したテキストやナビゲーションやエレメントなど、さまざまなオブジェクトのカラーをグルーピングして管理することができます。
カラーをいろいろ試したい時、修正が入った時など、ばらばらの全オブジェクトにすぐ適用できます。
手元の画像からシームレスなテクスチャを1クリックで作成
シームレスなテクスチャを簡単に作成できます。

Seamless Textures Generator (無料)
対応:action:CS3+, extension:CC, CC2014
元画像(300px, 512px)を用意し、あとはクリックするだけで簡単にシームレスなテクスチャが作成できます。
ビットマップのオブジェクトをベクターに変換
ブラシなどで描いたビットマップのオブジェクトをベクターに変換します。

Pixel2Vector Converter (無料)
対応:action:CS3+, extension:CS5, CS6, CC, CC2014
最近のウェブデザインでは特にベクターデータを扱う機会が多くなってきていると思います。うっかりビットマップで作ってしまったオブジェクトを1クリックで、ベクターに変換します。繊細なビットマップをベクター化するのは難しいですが、アウトラインがしっかりしているものであれば問題なく変換できます。
画像にパースをつけてかっこよく見せる
Webページやスマホアプリを見せるのに、最近多いのがこのパースをつけたデザイン。

Perspective Actions (無料)
対応:CS, CC
写真画像やWebページ・スマホアプリなど、1クリックでパースをつけたかっこいい画像に仕上げます。アクションの途中で浮き具合のシャドウ調整も可能です。
パラグラフのレイアウトを段組みに変更
テキストのレイヤーはそのままで、段組みに変更します。

UberColumns(無料)
対応:CC, CC2014
カラム数、カラム幅を指定した段組みのレイアウトを簡単に作成できます。
要素のサイズやエフェクトやフォントなどの情報を書き出す
これを入れておけば、デザインのガイドラインや指示書の作成が驚くほどはかどります。

Ink(無料)
対応:CS6, CC
テキストやエレメントなど、さまざまなオブジェクトのサイズ、形、カラー、エフェクト、フォントの種類・サイズなどの情報を1クリックで書き出します。書き出された情報は別レイヤーでフォルダにまとめられています。
インストール方法や基本的な使い方は、下記ページを参考にしてください。
エレメントやマージンのサイズを書き出してくれる
上のInkも便利ですが、これはマージンも書き出すことができます。

Size Marks PS (無料)
対応:CS6, CC, CC2014
使い方は非常に簡単で、サイズを書き出したい箇所を選択ツールで選択し、スクリプトを実行するだけです。書き出すテキストのカラーなども簡単に変更できます。
インストール方法や基本的な使い方は、下記ページを参考にしてください。
黄金比、黄金螺旋、黄金三角形、1/3ルール、対角線などを簡単に描く
レイアウトや構図に重要な黄金比、黄金螺旋、黄金三角形、1/3ルール、対角線などのパスを簡単に描くことができます。

Divine Proportions Toolkit (無料)
対応:CS5, 5.5, 6
使い方は簡単、パネルにあるさまざまな構図のルールを1クリックするだけです。描くラインのカラーとサイズは、ブラシツールで設定します。
インストール方法や基本的な使い方は、下記ページを参考にしてください。
レイヤーパネルでの作業をいろいろ便利に
レイヤーパネルでの煩わしい操作をいろいろと便利にします。
以前、紹介した時からVersion 2にアップしています。

Layer Control 2 (無料)
対応:CC, CC2014
複数のレイヤーの名前の先頭や末尾に文字を加えたり、置換したり、全てのレイヤーのエフェクトをフラットにしたり、空のレイヤーを1クリックで全て削除したり、スマートオブジェクトを一括でラスタライズしたりなど、レイヤーパネルの操作のかゆいところに手が届く機能拡張です。
インストール方法や基本的な使い方は、下記ページを参考にしてください。
UIデザインでのレイヤー作業が便利になる
ヘッダとフッタだけのPSDにしたい、ナビゲーションやボタンなどパーツのみのPSDが欲しい、といったことが簡単にできます。

LayerCraft (無料)
対応:CC2014
使い方は簡単、使用するレイヤーを選択しボタンをクリックするだけで、それ用の新しいPSDが作成できます。また、スマホやタブレット用の画像(@1x, @2x, @3xなど)の書き出しにも対応しています。
インストール方法や基本的な使い方は、下記ページを参考にしてください。
ウェブページのプロトタイプが簡単にできる
プロトタイプやワイヤーフレームなどに使えるページレイアウトを数クリックでちゃちゃっと作れてしまう機能拡張です。

Velositey v2 (無料)
対応:CS6, CC, CC2014
ヘッダ、フッタ、コンテンツなど、さまざまなコンポーネントが用意されており、それらを組み合わせて、簡単にページレイアウトを作成することができます。そのままデザインのベースにも利用できてしまうくらいのクオリティです。
インストール方法や基本的な使い方は、下記ページを参考にしてください。
sponsors