WebデザイナーのためのPhotoshop CC 2014の新機能まとめ

この記事は、Photoshop CC 2014 の新機能をWebデザイナー視点からまとめた記事です。

6月19日の「Adobe Create Now 2014」および、6月23日の「アドビ 報道関係者向けCreative Cloud 最新製品 デモセッション」で聞いた話を含みます。

Adobe Create Now 2014

新機能の一覧

現在私が把握している、Photoshop CC 2014 の新機能は以下のとおりです。
Webデザイン制作に深く関係しそうなものは太字にしています。

  1. ぼかしギャラリーのモーション効果
  2. 文字ツールでフォント検索が可能に
  3. ライブフォントプレビュー
  4. 開いたPSDにフォントが存在しなかった場合、Typekit のフォントで置換可能に
  5. スマートガイドでオブジェクト間の距離を表示、均等に配置が可能に
  6. リンクされたスマートオブジェクトのレイヤーカンプの切替が可能に
  7. 焦点領域
  8. 埋め込まれたスマートオブジェクトをリンクに変換
  9. リンクされたスマートオブジェクトのパッケージ化
  10. コンテンツに応じて拡大・縮小のブレンド・グラデーションの向上(スピードも400%向上)
  11. 3Dプリント機能でサポートする3Dプリンターが増えた、複数のトーンでのプリントに対応した
  12. Windows 8 でのスタイラスサポートの拡張
  13. カラールックアップテーブルの書き出し
  14. 大きなファイルから PNG を問題なく保存できる(2GBまで)
  15. グラデーションエディターで、option(Alt)キーを押しながらクリックして新規カラー(不透明度)分岐点を追加すると、その地点のカラー不透度)が適用される
  16. 「設定を同期」でワークスペースの同期が可能に
  17. レイヤーパネルの「CSS をコピー」で「シャドウ (内側)」のサポート。「box-shadow: inset」になる
  18. ブラシツールのブラシプリセットピッカーにて「最近使ったブラシ」の表示
  19. 「カラー」パネルを縦に伸ばすことができるように
  20. 「カラー」パネルのオプションでAdobeカラーピッカーのように「色相キューブ」と「明るさキューブ」が選択できるように
  21. MPEG-2 動画やドルビーオーディオのサポート(読み込みのみ)
  22. Sony RAW や Canon RAW などのビデオフォーマットのサポート
  23. 「コンテンツに応じる」の機能強化。「カラー適用」オプションでより自然に。「コンテンツに応じた移動」ツールではオプションバーの歯車をリッし、カラーの数値を増やすことでより自然に
  24. トーンカーブ補正のダイアログが新しくなった

すべてを詳しく紹介することはできないため、この記事では特にWebデザインに関連が深いものに絞って紹介します。

スマートガイドでオブジェクト間の距離を表示、均等に配置が可能に

移動ツールやパスコンポーネント選択ツールで、command(Ctrl)キーを押すと、長方形などのシェイプ間の距離を表示できるようになりました。

Photoshop CC 2014

複数のシェイプを均等に配置したい場合は、まず2つのシェイプを配置し、それらのシェイプを複製するなどして3つめを配置しようとすると、2つめのシェイプと等間隔に配置しやすいよう、スマートガイドが表示されます。

Photoshop CC 2014

Webコーディングスクール 体験レッスン受付中

文字ツールでフォント検索が可能に

テキストツールのオプションバー、または「文字」パネルのフォントファミリー名が表示されている部分にフォント名の一部を入力することで、フォントの検索が可能になりました。

Photoshop CC 2014

ライブフォントプレビュー

フォントファミリーの一覧の上にマウスカーソルがある時、カンバス内でそのフォントファミリーがプレビューされます。

Photoshop CC 2014 ライブフォントプレビュー

リンクされたスマートオブジェクトのパッケージ化

Photoshop CC から、ヘッダーやフッターなど、各ページの共通パーツを[ファイル>リンクを配置…]からリンクされたスマートオブジェクトとして配置できるようになりました。

それらのファイル(PSD)をまとめて他の方に送る際、[ファイル>パッケージ化…]からパッケージ化してひとまとめに送ることができるようになりました。

埋め込まれたスマートオブジェクトをリンクに変換

スマートオブジェクトを選択し、「属性」パネルの「リンクされたアイテムに変換」をクリックすると、スマートオブジェクトをリンクされたスマートオブジェクトに変換できるようになりました。

グラデーションエディターの改善

グラデーションエディターで、option(Alt)キーを押しながらクリックして新規カラー(不透明度)分岐点を追加すると、その地点のカラー(不透明度)が適用されるようになりました。

Photoshop CC 2014

「クリックのみ」だとグラデーションの色が変化してしまうのに対し、option(Alt)+ クリックだとカラーが変化しないため、微調整がしやすいです。

「カラー」パネルの改善

「カラー」パネルのオプションでAdobeカラーピッカーのように「色相キューブ」と「明るさキューブ」が選択できるようになりました。

Photoshop CC 2014 カラーパネル

Illustrator のように、「カラー」パネルを縦に伸ばすこともできます。

バグ修正

メニューの検索

OS X のほとんどのアプリでは、メニューの「ヘルプ」からメニュー項目の検索が可能です。

Photoshop CC で、ようやくこのメニュー検索に対応したのですが、たとえば「ぼかし」で検索して「フィールドぼかし…」などの項目を選択しても何も起きない(ダイアログが表示されない)ことがありました。

Photoshop CC 2014 ではそれが改善されたようです。

新しい問題

「キーボードショートカット」の表示バグ

[編集>キーボードショートカット]のダイアログの表示が、Windows版、Mac版ともにおかしいです。
「アプリケーションメニューコマンド」の表示領域が異常に狭く、仕切り部分を動かすこともできないため、長いメニューコマンドが最後まで表示されません。

追記: このバグは 2014.2.2 バージョンで修正されていることを確認しました。

Photoshop CC 2014 キーボードショートカット

Flash/Flexを使用したプラグインが使用不可

Photoshop CC 2014より、Flash や Flex を利用したプラグイン・エクステンション・拡張パネル類が使用できなくなりました。

そのため、CSS Hat や Renamy など多くのプラグイン・エクステンション・拡張パネル類がそのままでは使用できません。

CSS Hat を開発している企業からは、Flash/Flexを使用しないバージョンを開発中である旨のメールが届きました。

今後のバージョン表記について

これまでのように「17.0」のようなバージョン表記は今後は使用せず、「2014.1」のようなバージョン表記になるそうです。

古いバージョンが必要になった時は

「Creative Cloud」アプリケーション(メニューバーやタスクバーに常駐しているもの、なければ Spotlight やスタートボタンなどで「Creative Cloud」で検索)で「Apps」タブの下の方にある「すべて ▼」の部分をクリックし「以前のバージョン」を選択します。

「以前のバージョン」を選択

「Photoshop」の右にある「インストール」をクリックし、「CS6」や「CC」を選択します。

「インストール」をクリックし、「CS6」や「CC」を選択

最近の記事

Web制作関連動画

メルマガ会員向けの「コーダーにも役立つ補完AI『Codeium』の使い方」の動画を期間限定で公開しています。
CodeiumはGitHub Copilotと似ていますが、CSSなども補完できて、今登録すれば無料で使えます。

メルマガでは、Web制作者のためのAI活用やWordPress関連の動画など、さまざまな特典があります。ご興味ある方は、ぜひメルマガにご登録ください。
Index