あなたがチェックアウトする必要があるWebデザイナーのための36のPhotoshopプラグイン
公開: 2017-09-24コア製品に便利な拡張機能を提供しているソフトウェアはWordPressだけではありません。 世界中のWebデザイナーにとって頼りになるツールの1つであるPhotoshopも、この可能性をサポートしています。 また、WordPressのプラグインと同様に、Photoshopプラグインもあらゆる種類の新機能を追加できます。
多くの読者がPhotoshopを定期的に使用していることを知っているので、今回は別の種類のプラグインリストを提供することをお勧めします。 以下に、Web上で見つけることができる最高のPhotoshopプラグインを示します。
彼らはあらゆる種類の改善でプログラムを強化します。 小さなスクリプトやショートカットから新しいモジュール全体に至るまで、ワークフローを劇的に改善し、Photoshopでの作業をさらに簡単にします。
準備？ それでは始めましょう。
PhotoshopプラグインWebデザイナーは無視すべきではありません
以下に、お気に入りのソフトウェアをさらに強化できるさまざまなカテゴリのPhotoshop用プラグインのリストを示します。
それを再燃させる
- 価格：無料
- 利用可能： CC 2015
そもそも、Retinaディスプレイ用のアセットをすばやく作成するための無料のプラグインがあります。 Retinize Photoshopに新しいアクションを追加して、画像を元のサイズでエクスポートしたり、サイズを2倍および3倍に拡大したりできます。
インストール後、[ウィンドウ]> [アクション]の下に新しいオプションがあります。 レイヤーまたはレイヤーのグループを選択し、アクションを実行し、ファイルに名前を付けて、スライスされたアセットを受け取るだけです。 網膜対応のウェブサイトを作成するのに最適です。
私をカット＆スライス
- 価格：無料
- 利用可能： CS6
レイヤーからアセットを直接エクスポートする別のプラグイン。 Cut＆Slice meは自動的に画像をトリミングし、PNGファイルとしてエクスポートします。 重複するスライス、複数のボタンの状態、およびいくつかの解像度を処理できます。 残念ながら、それは完全に最新ではありませんが、それでも古いバージョンのPhotoshopで動作します。
CSS3P
- 価格：無料
- 利用可能： CS3以降
名前が示すように、このサービスはPhotoshopレイヤーをCSS3に変換することができます。 特別なのは、クラウドベースのサービスであり、無料で使用できることです。
プラグインは、複数のレイヤー（テキストを含む）、ドロップシャドウ、グラデーション、境界線の半径などをサポートします。 それに加えて、SCSSやSASSにも対応できます。
コーナーエディター
- 価格：無料
- 利用可能： CC 2015
丸みを帯びた角を作成する必要がある場合は、このスクリプトが最適です。 これは、丸い角を作成するPhotoshopの機能を強化し、任意の多角形で機能し、複数の角スタイルを含み、複数のレイヤーを一度に複数編集できるようにします。
HTMLブロック
- 価格：無料
- 利用可能： CC 2015（Mac OSのみ）
次の候補では、HTMLとCSSをPhotoshopドキュメント内に配置できます。 これにより、ソフトウェア内で直接Webアセットを作成し、PSDファイルでオンラインアセットを使用できます。 後者には、Webフォント、外部CSSなどが含まれます。
Font Awesome PS
- 価格：無料
- 利用可能： CC
Font Awesomeは、人気と使用が増えているアイコンフォントです。 そのため、Photoshopファイルに含めることは意味があります。 ありがたいことに、このプラグインはそれをパイのように簡単にします。 無料でダウンロードしてインストールするだけで、準備完了です。
レイヤーズコントロール2
- 価格：無料
- 利用可能： CC、CC 2014
このプラグインは、Photoshopの厄介な側面のいくつかを簡単にする7つのスクリプトのコレクションです。 レイヤー名エディター、未使用のエフェクトを削除するオプション、空のレイヤーの自動削除、スマートオブジェクトのラスタライズ、類似ファイルの検索などが含まれています。 自由にダウンロードして、好きなように使用できます。
CSS Hat 2
- 価格： $ 39.99
- 利用可能： CC 2014-2017
CSS Hatは、レイヤースタイルをCSS3に自動的に変換します。 そうすれば、現場でグラフィックを実装する方法を考え出す代わりに、コピーして貼り付けることができます。
プラグインは、一度に複数のレイヤー、フォント、さまざまなフォントスタイルで動作し、LESS、SASS、Stylusなどを吐き出すことができます。 また、構文の強調表示など、コードエディタにある多くの機能も備えています。 CSS Hatは、古いPhotoshopバージョンでも使用できます。
ページレイヤー
- 価格： 35ドル
- 利用可能： Mac OSXのみ
このリストの多くのプラグインは、PhotoshopファイルをWebサイトに簡単に変換できるようにすることを目的としています。 ただし、その逆も同様に必要です。 それがページレイヤーの目的です。
プラグインは自動的にウェブサイトをPSDファイルに変換し、各ページ要素を単一のレイヤーとして保存します。 埋め込みブラウザで任意のページを開き、Photoshopに保存するだけです。 プラグインは無料ではありませんが、価格に見合う価値があるようです。
PNG帽子
- 価格： $ 27.99
- 利用可能： CS5、CS6、CC、CC 2014.1 +、CC 2015
CSS Hatと同じ人々によって作られたこのプラグインは、PNGファイルをエクスポートするPhotoshopの機能を強化します。 たとえば、圧縮率が高く、CSSルールをエクスポートできます。 PNG Hatには、満足できない場合の寛大な返金ポリシーも付属しています。
Fontself
- 価格： 49€
- 利用可能： CC 2015、CC 2017
次は、ドラッグアンドドロップで独自のフォントを作成できるプラグインです。 ウェブ上でタイポグラフィがますます重要になっている時代に、それは本当に良いことです。 （色付きの）画像とベクトルをOpenTypeフォントに変換するだけです。 カーニング、結紮などを制御します。 Fontselfも積極的に保守されているプラグインであるため、所有者は新しい機能を無料で入手できます。
ゲッティイメージズPhotoshopプラグイン
- 価格：無料
- 利用可能： CC2016以降
ゲッティイメージズには、ストック画像の膨大なコレクションと、それらをPhotoshopに直接インポートできるプラグインがあります。 何千もの高解像度画像を検索してフィルタリングし、購入したものをゲッティアカウントと同期します。
PSDクリーナー
- 価格： 19.99ドル
- 利用可能： CC 2014.1+
PhotoshopのレイヤーパネルをスーパーチャージするSourceによる別のプラグイン。 PSD Cleanerは自動的にレイヤー構造をスキャンし、改善の機会を示します。 名前のないレイヤーの検索、空のレイヤーの削除、キャンバスを超えて伸びるレイヤーの検索などに役立ちます。 要するに、それはあなたを整理し続けるでしょう。
WebZap
- 価格： 19ドル
- 利用可能： CS5以降
意外かもしれませんが、Photoshopは実際にはWebデザイン用に作られていません。 プログラムは写真編集ツールとして始まり、後にレイアウトを作成する機能が追加されました。
それを補うために、WebZapがあります。 プラグインは、Webレイアウトのモックアップをすぐに作成するための既製の要素を提供します。 960グリッドに基づいており、フォーマットされたLorem ipsumテキスト、ナビゲーション、ボタンなどを作成できます。
微妙なパターン
- 価格： 17.99ドル
- 利用可能： CC以上
Subtle Patternsは、無料のタイル可能なテクスチャパターンのライブラリです。 同じ名前のプラグインは、それらをPhotoshopダッシュボードにもたらします。 それでおしまい。
ScreenSnap
- 価格： 9.99ドル
- 利用可能： CC2014以降
Photoshopプラグインの次のリストはScreenSnapです。 このプログラムを使用すると、ドキュメント全体または選択した領域のいずれかから、PSDファイルからスクリーンショットを作成できます。 手動で切り抜いたり保存したりする必要はありません。フォルダを選択し、ボタンを1つクリックするだけで、問題ありません。 網膜のサイズであっても、他の人と作業を共有するのに最適です。
デュプリケーター
- 価格：無料
- 利用可能： CC、CC2014
ここには、同じオブジェクトが複数必要な場合に、レイヤーとレイヤーのグループをすばやく複製するための拡張機能があります。 必要なコピーの数と、それらの間隔をどのように設定するかを選択するだけです。
パースペクティブモックアップ
- 価格： 19ドル
- 利用可能： CC 2017
スクリーンショットからわかるように、プラグインのホームページには多くの冒とく的な言葉が含まれています。 それとは別に、このプラグインはデザインの遠近法のモックアップを作成します。 そうすれば、外から携帯電話やタブレットでどのように見えるかをよりよく理解できます。 プラグインには多くのプリセットがありますが、完全に編集することもできます。
サイズマークPS
- 価格：無料
- 利用可能： CC 2014
サイズマークを使用すると、マーキーツールを使用して、オブジェクトのサイズまたはオブジェクト間の距離のラベルを追加できます。 各ラベルは新しいレイヤーに保存され、完全にカスタマイズ可能です。 これは、PSDをWebサイトに変える人のための仕様を追加するときに非常に役立ちます。
フォンテア
- 価格：無料
- 利用可能： CC 2014、CC 2015
Photoshopのデフォルトのフォントの提供に不満がある人のために、FonteaにはGoogle Fonts（現在800以上）で利用可能なすべてのWebフォントが含まれています。 プラグインはまた、オンラインリポジトリを最新の状態に保ち、お気に入りのフォントのコレクションを設定できるようにします。
- 価格： 4.99ドル
- 利用可能： CC2015以降
このプラグインは、前述のゲッティイメージプラグインに似ていますが、Pixabayイメージライブラリ用です。 何十万もの無料のストック画像が含まれており、ワンクリックで追加できます。 プラグインには強力な検索オプションも含まれており、すべての画像はCC0ライセンスです。 さらに、それは非常に手頃な価格です。
ShutterstockやPexelsなどの他のストックフォトライブラリには、このようなプラグインが他にもあります。
LayerCraft
- 価格：無料
- 利用可能： CC、CC 2014
PhotoshopレイヤーからUIアセットをエクスポートするための別のプラグイン。 LayerCraftには、エクスポート時に画像を拡大縮小する機能があり、透明なピクセルをトリミングして、Retinaディスプレイ用にさまざまなサイズでエクスポートできます。
Lorem Ipsum Generator
- 価格：無料
- 利用可能： CS 5/6、CC
名前が示すように、これはLoremipsumプレースホルダーテキストを作成するためのプラグインです。 そうすれば、外部ソースからコピーする必要がなくなります。 ジェネレーターは、カスタマイズ可能な出力、ワンクリックでクリップボードにコピーする機能を提供し、アクティブに維持されます。
LoremPicsum
- 価格：無料
- 利用可能： CS、CC
これはLoremipsumバージョンに似ていますが、テキストの代わりにランダムな画像を作成します。 エリアを選択し、漫画を選択すると、プレースホルダー画像が表示されます。 楽しいギミック：画像は、フューチュラマ、ザシンプソンズ、ファインディングニモなどの人気のテレビ番組や映画からのものです。
ソーシャルキットプロ
- 価格： 9.99ドル
- 利用可能： CC 2015+
そして別のソースプラグイン。 これはすべてのソーシャルメディアを改善することを目的としています。 モバイルとデスクトップで広告を作成するためのテンプレート、カバー写真、プロフィール画像が含まれています。 Photoshop内で結果をライブプレビューすることもできます。
レイヤーガイド
- 価格：無料
- 利用可能：不明
ガイドは、すべてを構造化しておくためのPhotoshop内の重要なツールです。 ただし、処理が煩わしい場合があります。
このプラグインはそれを軽減することを望んでいます。 新しいボタンを追加して、レイヤーの側面だけでなく、水平方向と垂直方向の中央にもガイドを追加します。 ドラッグする必要はもうありません。クリックするだけで問題ありません。
ロングシャドウジェネレーター
- 価格：無料
- 利用可能： CS6、CC
プラグイン名は基本的にそれをすべて言います。 ロングシャドウジェネレーターは、Photoshopでロングシャドウを作成するのに役立ちます。 影の長さと不透明度、色、グラデーション、角度を制御できます。 次に、ワンクリックでそれらを追加します。
TinyPNG
- 価格： $ 50
- 利用可能： CS5、CS6、CC以上
TinyPNGは、WordPressにアップロードする前に画像を最適化するために私がよくお勧めするオンラインサービスです。 JPGファイルとPNGファイルを圧縮して、できるだけ小さくします。
このサイトは、画像編集ソフトウェア内で同じことを行うためのPhotoshopプラグインも提供しています。 プレビューと直接保存、拡大縮小、部分選択の使用などが可能です。 彼らのサイトが何らかの兆候であるならば、プラグインはお金の価値が十分にあります。
グリフォ
- 価格： 19ドル
- 利用可能： CS5、CC
Glifoは、PhotoshopからベクターアイコンをアイコンWebフォントとしてエクスポートするオプションを追加します。 FontAwesomeプラグインへの素晴らしい追加のように聞こえます。
スペックキング
- 価格： 19ドル
- 利用可能： CS5、CS6、CC2014以降
ただし、今回はプレミアムバージョンとして、Photoshopファイルに測定値と設計仕様を追加するための別のプラグイン。 サイズ、余白、フォントを測定し、編集可能なオーバーレイで仕様を自動的に作成します。 とてもシンプルで使いやすいように見えます。
エクスポートキット
- 価格： $ 19.33 /月
- 利用可能： CS6以降
このPhotoshopプラグインを使用すると、PSDファイルをHTML、CSS、WordPress、iOS、Androidなどに変換できます。 また、コラボレーション機能も含まれています。 非常に強力に見えますが、月額ライセンスが付属しており、完全に安価ではありません。
Photoshopソーシャルシェアプラグイン
- 価格：無料
- 利用可能：不明（Mac OSのみ）
リストの次の項目は、Photoshopに重要な共有機能を追加します。 これにより、プログラム内から電子メール、ソーシャルネットワーク、その他のプラットフォームを介してファイルを直接共有および公開できます。 フォーマットを選択するだけで、準備完了です。
それぞれを変換する
- 価格：無料
- 利用可能： CS5、CS6、CC
Transform Eachは、位置を変更せずに複数のオブジェクトを一度に変換できるスクリプトです。 それが何を意味するかは、以下のGIFで最もよく例示されています。 アンカーポイント、達成したい変換を選択すると、ワンクリックでそこに到達します。
ToonIt！
- 価格： 129ドル
- 利用可能： PhotoshopCS以降
最後に楽しいもの。 オンラインのグラフィックノベルを作成することを考えた場合、このサービスは非常に役立ちます。 通常の写真を漫画に変え、多くのプリセットと成熟したテクノロジーを備えています。 しかし、少し高価な面があります。
一言で言えばPhotoshopプラグイン…
PhotoshopはWebデザイナーにとって素晴らしいツールです。 それは強力で、機能が満載で、常に更新されています。
ただし、いくつかの追加機能やタスクを実行するためのより簡単な方法が必要な場合があります。 そこで、Photoshopプラグインが登場します。
上記のリストからわかるように、プラグインはさまざまな機能を追加できます。 ショートカットからまったく新しい機能まで。
そして、それはウェブデザインに役立つものだけです。 特に画像のレタッチに関しては、他にもたくさんあります。 追加するものはありますか？
あなたが好きでお勧めする追加のPhotoshopプラグインを知っていますか？ 以下のコメントセクションで共有してください！
VectorsMarket /shutterstock.comによる記事のサムネイル画像