この記事は、2017年8月22日に公開してから再編集、アップデートを随時行っています。新しいツールを加え、サービスが終了しているツールは削除し、合計40個のPhotoshopプラグイン、拡張機能を紹介しています。 Photoshopはどんなデザインの作成にも使える、多目的で便利なツールです。しかし、特定の作業をしようとすると、時間がかかってしまうことも。そんなときは、フォトショップ拡張プラグインでをつかって、自分好みにカスタマイズしてみましょう。 今回は、デザインの制作ワークフローを改善し、効率をアップするPhotoshopの拡張機能、プラグインをまとめてご紹介します。 Photoshop作業を爆速に！便利すぎる無料ツール、拡張機能、素材あつめました。 オキテ破りの写真加工！フォトショップ無料アクション素材100個まとめ【保存版】 無料Photoshop拡張プラグインまとめ Craft P

Adobe MAX 2018が開催され、Adobe Senseiをはじめ、XD, Photoshop, Illustrator CC 2019にさまざまな新機能が実装されました。 今回のアップデートは「ワークフロー効率化」が主で、各ソフトウェア単体だけでなく、連携しての生産性も向上させる機能が満載です。 Adobe Sensei Adobe Senseiベースの生産性を向上させる機能は、CC 2019でもかなり追加されています。数多くあるのですが、主なものをピックアップします。 Photoshop CCの「コンテンツに応じた塗りつぶし」で、適用するコンテンツのより精密なコントロールが可能に。 Illustrator CCのフリーグラデーションで、より自然なグラデーションを生成。 InDesign CCの「内容を自動認識に応じて合わせる」で、画像の内容を検出してサイズに合わせた切り抜きを自動

ウェブサイトとモバイルアプリにFacebookシェア機能を実装して、利用者の理解と信頼を得られるアプリエクスペリエンスを構築するためのベストプラクティスについて説明します。

「Group Layer Renaming」はその名の通り、レイヤーをリネームしてくれるPhotoshopのスクリプトです。 新しいネタではありませんが、画像アセットと合わせて使うと便利だったので紹介します。 導入 「Group Layer Renaming」をダウンロード ダウンロードはこちら。 [KAM] Layers Renamer - APR.jsx ファイルがダウンロードされます。 ダウンロードしたjsxデータをPhotoshopのスクリプトフォルダに格納する 格納場所は使用しているOSやPhotoshopのバージョンによって異なります。 下記はAdobe Photoshop CC 2017の場合。 Windows　C:\Program Files\Adobe\Adobe Photoshop CC 2017\Presets\Scripts Mac　Macintosh HD/App

こんにちは。デザイナーの高口です。 デザイナーの皆さんは、デザインを開発者に伝える時、どのようにしていますか？ 口頭で伝える、印刷したデザインに書き込む、指示書を作る…様々な手法があると思いますが、どれも時間がかかりますよね。 そこで今回は、伝える手間を少しでも減らすべく、PSD からテキスト情報を抽出するスクリプトをご紹介いたします。 1.スクリプトをダウンロード まず、下記のリンクからスクリプトをダウンロードして下さい。 (ご利用に際しては、自己責任にてお願いいたします。) ダウンロード ： TextExportToCSV ダウンロードしたファイルを解凍すると「TextExportToCSV.jsx」というファイルがありますので、下記のフォルダにコピーして Photoshop を再起動して下さい。 Windows – C:\Program Files\Adobe\Adobe Photo

オリジナルはPhotoshopの「書き出し」で画質を100%にして書き出した画像です。画像によっては81%にしても目視では差がわからなかったので、それくらい下げちゃっても良さそうですけど、ざっくりとしたデフォルトとしては85%が良さそうです。91% → 85%の方が85% → 81%より圧縮率がいいんですね。 サンプル画像 上の表にある「sampleXX.jpg」の画像をまとめて圧縮したファイルを用意しました。ご参考までに以下からダウンロードどうぞ。 サンプル画像をまとめて圧縮したファイル（ZIP / 3.4MB） ちなみに、表で91%と81%になっているのはImageOptimで設定できるのが、なぜかその数値だったからです。90%、80%には設定できませんでした（v1.8.0）。 職場で作業するときのプロセスはだいたい以下のような感じです。 PhotoshopやAffinity Desi

コンテンツ目次 「被写体の選択」機能 「選択とマスク」機能 「選択とマスク」（複雑な背景バージョン） オブジェクト選択ツール レイヤースタイル「ブレンド条件」 消しゴムツール 自動選択ツール クイック選択ツール 多角形選択ツール ペンツール チャネル設定 色域指定 レイヤーマスク クリッピングマスク 境界線を調整 さいごに、 1. 「被写体の選択」機能 もっとも簡単な、最新の切り抜きテクニック。 ボタンをクリックして、数秒待つだけで完成という、嘘のようなホントのはなし。 試しに、こちらの写真の女性を選択してみましょう。 元の画像をコピー（Command/Ctrl+J）したら、プロパティパネルの「被写体を選択」をクリック。 たったこれだけで、女性モデルのみを選択することができました。 選択範囲をレイヤーマスクとして適用したら、完成です。 Adobe Stockで「背景の削除」も一発完了 実は

WEBデザインの際にヘッダー・フッターやグローバルナビなど、共通のデザインになるパーツはまとめて管理したほうが効率的ですね。 今回は共通パーツの管理に非常に便利なPhotoshopの機能「レイヤーカンプ」をご紹介したいと思います。 レイヤーカンプとは？ レイヤーカンプを使用すると、1 つの Photoshop ファイルで、複数のレイアウトバリエーションを作成、管理および表示することができます。 引用元：アドビサポート Photoshopファイルの、ある状態をいくつも記録しておいてくれて、ボタン一つでその状態に切り替えることができる機能で、配置先のPhotoshopファイルからも状態を切り替えることが可能です。 レイヤーカンプでは レイヤーパネル内のレイヤーの表示と非表示 ドキュメント内のレイヤーの位置 レイヤースタイルや描画モードの適用によるレイヤーの外観 上記３種類のオプションが記録でき

Photoshopのデザインからコーディングをするとき、CSSについては今までエクステンションのCSS3Psというのを使っていたのですが、 最近動かなくなったようなので代替をさがしたお話です。 今まで使っていたCSS3Ps レイヤーを選択して、エクステンションのCSS3Psのウィンドウを押すだけで、CSSを吐き出してくれていたのですがサイトが無くなったのか表示されなくなりました。 CSS3Ps いつもこれでCSSをコピーしていたので困りました。 既存の機能であったCSSをコピー それで他にCSSを吐き出してくれるエクステンションはないかと調べたのですが、既存の機能でありました。 Windows：レイヤーを右クリック→CSSをコピー 知らなかった！ コピーすると以下のようにペーストできるようになります。 .角丸長方形_1 { border-radius: 5px; background-co

The Blog | Welcome to Adobe Blog アドビのブログでは、Creative Cloud、Document Cloud、Experience Cloudの最新情報や役に立つ情報を紹介しています。

みなさんはAdobe Photoshopでどのように画像を書き出してますか？ 最新のPhotoshopではさまざまな画像書き出し機能が搭載されていますが、どれを選択するかで手間が異なります。 本記事ではPhotoshopのさまざまな画像書き出し機能を紹介し、最適な画像書き出し方法を検証します。 この記事はPhotoshop CC 2022 (23.5.0)で検証しています。 この記事のポイント 新しい画像保存方式（書き出し形式、クイック書き出し）は手間が少ないので、作業効率が良い 新しい画像保存方式はデフォルト設定で、小さなファイルサイズの結果を得られやすい アニメーションGIF保存は「Web用に書き出し（従来）」を使う Photoshopの画像書き出し方法一覧 Photoshop CCにおいて、画像を書き出す方法は分けて5種類あります。 書き出し形式 ［ファイル］→［書き出し］→［書き出

The Blog | Welcome to Adobe Blog アドビのブログでは、Creative Cloud、Document Cloud、Experience Cloudの最新情報や役に立つ情報を紹介しています。

2018年3月のアップデートで、Adobe XDは大幅に機能が強化されました。 その内の一つがPhotoshopとの連携強化。XDで.psdファイルを開くだけで、アートボード、レイヤー、アセットが編集可能な状態で利用できます。 さらに、.sektchファイルにも対応しました。こちらもアートボード、レイヤー、シンボル、エフェクトがそのまま扱える状態で利用できます。

The Blog | Welcome to Adobe Blog アドビのブログでは、Creative Cloud、Document Cloud、Experience Cloudの最新情報や役に立つ情報を紹介しています。

Photoshopはデザインに欠かせない便利なツールですが、そのまま使っているだけではもったいないです！ Photoshopでの作業がさらに捗る便利なプラグイン・機能拡張を紹介します。 ここで紹介するものは、当方の日本語環境（Win/Mac, CC 2015）で利用しています。 よく使うドキュメントはテンプレートとして管理 レイヤー数が多くても目的のレイヤーにすぐにアクセス ガイド引きの定番「GuideGuide」は大幅バージョンアップ ガイド引きは「QuickGuide」も欠かせない スクリーントーンや集中線を生成する「Comic Kit」 磨りガラスのようなエフェクトを与える「Blur Like Jony」 カラー・テキスト・フォントサイズなどに変数が使える「Ditto」 ガイドライン作成に欠かせない「Ink」も大幅バージョンアップ 複数の要素を変形させる時に位置はそのままで レイヤー

Ink CC2015にインストールしたので、その手順を。 ダウンロードした「Ink.1.5.3.zip」を解凍します。 CC2015で利用する時は、「Ink.1.5.3」内の「Photoshop CC 2015」フォルダを開きます。 「Photoshop CC 2015」フォルダ内の「Ink.zip」を解凍します。 ※フォルダの中身は変更しないでください。 解凍したInkフォルダを移動するフォルダを開きます。 OS X: ライブラリ\Application Support\Adobe\CEP\extensions\ Win 64: C:\Program Files (x86)\Common Files\Adobe\CEP\extensions\ Win 32: C:\Program Files\Common Files\Adobe\CEP\extensions\ 「extensions」フ