Photoshop CC 新機能『Generator (生成)』のお話

１ヶ月以上空いたと思えば、２−３日でのブログ更新。勝手気ままな栃谷です。

さて、既にご存知の方も多いと思いますが、本日、Photoshop CCが14.1にアップデートされました。
今回は、Webデザイナーの方にとって価値のあるアップデートとなります。が、Photoshop CC提供開始後に発見された不具合修正なども対応しているので、すべてのPhotoshop CCユーザーはアップデートする事をお勧めします。

さて、これから今回搭載されたGenerator(生成)の機能について紹介したいと思います。

Photoshopはサイトの中に含まれる要素であるバナーやボタンなどのパーツから、
サイト全体のイメージのカンプを制作する（多くはクライアントへのデザインイメージの提示）目的などで、Webデザイナーの方にも広くPhotoshopをお使い頂いています。

。。。といっても、そのような目的でPhotoshopを使用した経験の無い方はイメージしにくい部分もありますよね。
多くのWebデザイナーがこれまで行っていたフローは

「Web用に保存」を利用して、作成した（または調整した画像・写真）素材がWeb上でどのように見えるか、ファイルがどれくらいになるかの確認。そして、レイヤーからスライスを作成（レイヤーに基づく新規スライス）→ Web用に書き出し
というものではないかと思います。
どういうことかというと、カンプとして作成した1枚絵の状態のものをパーツごとにバラバラにして、
その後オーサリングする際のパーツとして使用するのではないでしょうか。

この『レイヤーに基づく新規スライス』が追加されたのは、約10年ほど前にリリースしたPhotoshop CSあたりだったのではないでしょうか。
大変反響の多かった機能ですが、それ以前のバージョンをお使いの方は、手動でスライス範囲を作成する作業をしていました。
または、パーツを新規ドキュメントに貼り付けて個々に書き出すなど…
精密さが必要になる、骨の折れる作業です。『レイヤーに基づく新規スライス』は、それを救いました。

そして今回行われたアップデートは…
この、「Web用のパーツを書き出す」際に、より！重宝していただける機能です。
全く新しい画像データ書き出し機能です。
作業のステップは、Photoshopマガジンでも早速公開しています。
まずはこちらのページ、ご一読ください。（そしてまたここに戻ってきてね）

お分かり頂けましたでしょうか。
いくつかステップがありますが、レイヤー名を適切に指定することで、ライブで画像が書き出されます。
そして加えられた変更が、ライブで修正され、書き出された素材に反映されます。

レイヤー名をどのように指定したかで書き出される画像形式の変更、
JPEG/GIF/PNGといったファイル形式の変更だけではなく、その画質、サイズもレイヤー名に含めることで、適切に書き出されます。

※レイヤー名を指定する際には、約束事がいくつかありますのでご注意ください。
英文で恐縮ですが、こちらのページにいくつかの書き出しパターンが記載されていますので参考にしてください。
ムービーをみて頂ければ、用途のイメージもつきやすいと思います。

PSDの編集と同期した、全く新しい画像データ書き出し機能です。
まずは是非、お試しください。

そして、もうひとつ、可能になっている事があります。Edge Reflowとの連携です。
「エッジリフロー？？なにそれ？」という方。詳しくはADCのページをご覧ください。
簡単に紹介すると、マルチデバイス（PC、タブレット、スマホ）用のレスポンシブWebデザインのための
インタラクティブなモックアップを作成することができるツールです。（カタカナが多くてスミマセン）

昨年登場した新しいツールであるEdge Reflowもプレビュー5になり、機能拡張されました。
Photoshopで制作したカンプをReflow側がダイレクトに受け取り、デザインを反映させ
リアルタイムで各デバイスでのプレビューができるようになります。

こちらのイメージが非常に分かりやすいですね。↓

まさにEdge ReflowとPhotoshopの連携です。
今、トレンドのWeb表現も再現可能な環境になっています。

Web関連のお仕事をされている方は特に、是非キャッチアップしていただきたい機能です。

昨年末のアップデートに加えて今回もまた、Web関連の機能が強力に追加されているのがお分かり頂けると思います。
CS6以降、Webに携わる方に対して特に恩恵のある機能として追加されているもの、特に顕著なものは以下です。
・ピクセルへの最適化
・CSS書き出し
・テキストのアンチエイリアスオプションの追加
・Generatorテクノロジー（今回）

Creative Cloudで行われるアップデートには、いくつも作業効率に影響する機能が追加されます。
使う、使わないでは、大幅に作業量の違いが出てくることもあります。

今回追加された機能も、皆さんのワークフローに一役買ってくれるものに間違いありません。
機能を正しく理解し現場で活用して頂くためのヒントを、今後もなるべく漏らさずこの場で紹介していきます。

ということで、Photoshop CC 新機能「Generator (生成)」のお話でした。次回もできるだけ早くブログ更新し、有益な情報を皆さんに提供したいと思います。