Webサイト制作を効率化!無料Photoshop拡張機能、スクリプトまとめ

psextension_top

 

デザイン作業に欠かせなツールPhotoshopは、プラグインや拡張機能を追加することで、機能面をさらにパワーアップさせてくれます。

 

海外デザインブログSpeckyboy.comで、Webサイト制作を楽にしてくれる、無料Photoshop拡張機能をまとめたエントリー「Free Photoshop Extensions for Web Designers」が公開されていたので、今回はご紹介します。

 

 

 

詳細は以下から。

 

 

 

Webサイト制作を楽にしてくれる、無料Photohsop拡張機能プラグインまとめ

 

TOOL CSS3PS

角丸やドロップシャドウ、グラデーションなどをCSS3で書きだしてくれる、コーディングに便利な拡張機能。最近のバージョンアップで、テキストスタイルにも対応。

css3ps

 

 

インストール方法および使い方を解説した、デモ動画がこちら。

 

 

 

TOOL Web Font Plugin

Googleフォントに同期しており、実際にWebサイトを公開するときと同じWebフォントを利用して、デザインを進めることができます。

ps_extension_08

 

 

 

TOOL FlatIcon

総計22000個以上のシンプルなフラット型アイコン素材を、検索することができる拡張ツール。そのままデザインに使えるだけでなく、カスタマイズ自由なベクター素材となっています。

flaticon_ps(2)

 

 

 

TOOL BlendMe.In

キーワードを入力すると、豊富すぎるベクターアイコン素材が探せ、そのままデザインに利用することができます。PSとAi両方に対応で、PSはPS6およびCCに対応となっています。

ps_extension_04

 

 

 

TOOL Skeuomorphism.it

お手元にあるPSDファイルを、ボタンひとつで、フラットデザインに仕上げてしまう拡張ツール。グラデーションや角丸が削除され、すっきりとしたレイアウトに変換します。

ps_extension_01(2)

 

 

 

TOOL Long Shadow Generator for Photoshop

影の長さや濃さ、グラデーションなど詳細に設定することができる、ロング・シャドウ作成ジェネレーター。

long_shadow_generator

 

 

 

TOOL GuideGuide

Webテンプレートに、グリッドやカラムガイドラインを、お好みの設定で作成する拡張ツール。 詳しい使い方は、こちらのエントリーで触れています。

ps_extension_02

 

 

 

TOOL Cut&Slice Me

ひとつのファイルから、iPhoneやAndroidスマートフォン、デスクトップなど複数デバイス用に、デザインパーツを自動でスライス、保存してくれます。

ps_extension_07

 

 

 

TOOL Layer Guides

開いているドキュメント左右上下に加え、中央にもガイドラインを一発で引くことができる拡張プラグイン。

ps_extension_10

 

 

 

TOOL 2X Scaler

Retinaディスプレイに対応する、2xサイズのデザインパーツを作成する、アプリ開発拡張ツール。

ps_extension_13

 

 

 

TOOL Layout Wrapper

完成したWebデザインテンプレートに適用すると、Safariブラウザ付きのプレゼンテーション資料に変換してくれます。

ps_extension_11

 

 

URLリンク付きのブラウザウィンドウが、ボタンひとつで完成しました。

beforeafter

 

 

 

TOOL Bounce

デザイン共有コミュニティDribbbleで公開された最新フィードを、Photoshop内でチェックできます。PSおよびAi, FireWorks, InDesign拡張ツールに対応しています。

bounce

 

 

 

TOOL SuperPNG

PNGファイルでの保存サイズを、劇的に抑えてくれる、Webサイト制作にはうれしいツール。

ps_extension_14

 

 

参照元リンク : Free Photoshop Extensions for Web Designers – Speckyboy.com