検討中リストに追加しましたWebデザイナーイラストレーターまとめツールPhotoshop2016年1月22日Photoshop本当に使いこなせてる?通常の3倍速くなる!?Web制作が爆速化するPhotoshopプラグイン15選92WEB制作には欠かせないPhotoshop。Photoshopには便利なプラグインがたくさんあり、作業に応じて使いわけることでWEB制作が爆速化します!ガイド引き、レイヤー編集、レイアウト作成などを助けてくれるので、作業が通常の3倍は捗るでしょう。(※個人の感想です)そこで今回は、WEB制作を爆速化して作業時間を短縮してくれる、無料のPhotoshopプラグインを15個まとめてご紹介します。使ってみて損があるどころか、使わないと人生の時間を損するレベルのプラグインたちです!「自分のスキルの相場をしりたい」と思う方へ簡単4ステップ!スキルや経験年数をポチポチ選ぶだけで、あなたのフリーランスとしての単価相場を算出します!単価相場算出ページへ※相場算出に個人情報の取得はおこないません。配布サイト:http://arronhunt.com/extensions/keyboard-shortcuts/ツールボックスにショートカットを表示するプラグインです。各ツールを長押しすればショートカットが表示されますが、ショートカットをおぼえるまでいちいちクリックして確認するのは面倒です。このプラグインでショートカットを表示しておけば、スムーズにおぼえられますね。配布サイト:http://guchitaka.com/project-view/quickguidepro/「QuickGuide」は面倒なガイド引きを超絶簡単にしてくれるプラグインです。使い方はとっても簡単で、オブジェクト、または選択範囲に沿ってクリックするだけでガイドが引けてしまいます。配布サイト:http://gelobi.org/griddify/こちらも同じくガイド引きをサポートするプラグインですが、ピクセルを入力して細かいガイド引きができます。左から100pxごとにガイドを引いたり、100px・50px・25pxなど不等間隔でガイドを引いたり、より細かくガイド引きしたいとき重宝します。1/3ルールなど、レイアウト作成に使えるパスを作成してくれるプラグインです。使いたい構図を選択するだけで黄金比などをあてがうことができるので、美しいレイアウトの作成に役立ちます。今までそうした比率を意識したことがなかった方は、ぜひ使ってみてください。レイアウトのまとまりがぐっとよくなりますよ。plugin作成した要素のレイヤースタイル、フォント、サイズなどのデザイン情報をまとめて表示してくれるプラグインです。レイヤーを選択してボタンを押すと情報が表示されます。日本語版はありませんが、使い方が簡単なので英語が苦手な方でも問題ないと思います。スタイルガイドを作成するときなどに重宝するでしょう。GitHubオブジェクトのサイズ、オブジェクト間の距離など、指定した箇所のサイズを書き出してくれるスクリプトです。計測した箇所には計測結果がレイヤーとして追加されるので、スタイルガイド作成が爆速化します。PS」があった方が捗ります。Generator」、その名前の通り、長い影を簡単に作れます。作るとなると意外と面倒なシャドウを一瞬で作れるので、まさにWeb制作を爆速化するプラグインです。かゆいところに手が届く、便利で使えるヤツ。FlaticonPhotoshop上でベクターアイコン素材を検索し、そのまま使えてしまう非常に便利なプラグイン。フリープランはページあたり使えるアイコンは10個までとなっています。それ以上使用したい場合は、有料プラン($9.99)が必要です。Boxビットマップのオブジェクトをベクター化してくれるプラグインです。ベクターは拡大・縮小しても画質が低下しないので、Photoshopで描いたオブジェクトをIllustratorのようにベクター化したいときに使えます。Photoshopメインでデザインしている方はきっと助かると思います。styles.Photoshopで作成したオブジェクトをCSS3で書きだしてくれるプラグインです。Photoshopで作成した角丸やグラーデーションのボタンをCSS3で書き出せるので、なるべく画像を使わずサイトを軽量化したいときなどに使えます。配布サイト:missingpixels.ioスポイトツールでカラーをクリックすると、カラーコードをコピーしてくれます。コピーする手間が省けるのでWeb制作が捗ります。機能的にはすごーく地味なのですが、結構助かるんですよね。デフォルトで備わっていて欲しい機能です。D&K「Velositey」は4回クリックするだけでWEBサイトのレイアウトが出来上がるプラグインです。クリックするだけでいいので、ワイヤーフレームの作成が驚くほど簡単にできてしまいます。配布サイト:render.lyレイヤーを組み合わせて複数パターンのデザインを書き出してくれるプラグインです。複数パターンのデザインをひとつひとつ書き出す手間を省けます。利用には無料の会員登録が必要です。使い方はこちらのサイトの解説がわかりやすいです。extension複数のレイヤー名をまとめて変更したり、未使用のレイヤー効果を削除するなど、レイヤー編集を効率化する機能を5つ備えているプラグインです。使える機能は以下の5つ。Software適当に文章を作ってくれるプラグインです。ワイヤーフレームやサンプルを作るときに、テキスト部分に「テストテスト...」というのではイメージが湧きにくいですよね。ネットで適当なサイトからコピーしてくるのも、消し忘れたときのリスクを考えると問題があります。地味ですが意外と便利なプラグインです。配布サイト:LoremPicsumこちらは先ほどのプラグインの画像版といった感じです。適当に画像を差し込んでくれるので、カンプ画像などを拾ってくる手間が省けます。最後に簡単4ステップ!スキルや経験年数をポチポチ選ぶだけで、あなたのフリーランスとしての単価相場を算出します!単価相場算出ページへ※相場算出に個人情報の取得はおこないません。クリエイターの求人・案件探しは、レバテッククリエイターへレバテッククリエイターでは、フリーランスや派遣で働くクリエイターを対象とした求人・案件の提案サービスを行っています。Web業界やゲーム業界を中心に年間1000件以上(※)の取り扱いがあり、様々なスキルを活かせる案件の提案が可能です。自社調べ求人・案件探しの相談をするまた、「今よりも年収をアップさせたい」「トレンドに敏感な現場でWebデザインスキルを磨きたい」などの理由からフリーランスへの転向を検討している方には、無料の個別相談会も実施していますのでお気軽にご相談ください。業界に精通したプロのコーディネーターが、一人ひとりの希望や状況に合わせて丁寧にサポートします。「個別相談会」に申し込む役に立った/参考になったと思ったら、シェアをお願いします。EffectsMayaInDesignDreamweaverレバテッククリエイターおすすめコンテンツレバテッククリエイターはWeb・ゲーム業界に特化したデザイナー・クリエイター向けの求人・案件提案サービスです。us運営会社ヘルプフリーエンジニア案件エンジニア・クリエイター転職ハイクラス転職ITエンジニア向け新卒就活支援サービス案件の提案をご希望の方はお気軽にご相談下さい。無料サポート登録レバテック株式会社は、「プライバシーマーク」使用許諾事業者として認定されています。