クリエイティブクラウドの新機能:Photoshop CCのアップデートを説明します

Creative Cloudの新機能:Photoshop CC 14(2013年6月)- 02 ウェブデザイナー向けの一般的な改善

チュートリアルのすべてのビデオ クリエイティブクラウドの新機能:Photoshop CCのアップデートを説明

画像サイズダイアログの改善

選択的シャープナー と同様に、ダイアログボックスの外観が改良されました。ついに画像サイズダイアログに プレビュー 機能が追加されました。ダイアログボックスのサイズも 変更できます。

クリエイティブクラウドの新機能:Photoshop CC 14(2013年6月)- 02 Webデザイナー向けの一般的な機能と改善

今では プリセット が利用可能で、カスタム プリセット も作成できます。たとえば、私の場合、常に同じ画像サイズで大きなグラフィックを出力する必要がある場合、すぐにプリセットとして保存できます。ファイルブラウザが表示されたときに、プリセットに名前(ここでは「カバー用のショップ詳細画面」)を付けるだけで、そのプリセットがいつでも使用できるようになります。素晴らしい新機能!

クリエイティブクラウドの新機能: Photoshop CC 14 (2013年6月) - 02 Webデザイナー向けの一般事項と改善点

さらに、新しい 補間手法、すなわち (拡大時)細部を保持 が導入されました。これにより、画像の拡大時に、同時に軽微なシャープニングが行われるため、画像拡大時の鮮明さ維持が向上します。

補間手法が 細部を保持 に設定されていると、拡大時に軽微なシャープニングによる ノイズの削減 も同時に行われます。プレビューを使用すると、画像サイズの変更による予想される画像変化を最適に評価し、ノイズ低減に応じることができます。

Creative Cloudの新機能:Photoshop CC 14(2013年6月)– 02全般とWebデザイナー向けの改善

Webビューにテキストレイヤーを模倣する

顧客用のWebレイアウトを作成する際に、デザインを説明する際に、機器やブラウザによってテキストが若干異なることをお客様に説明します。

たとえば、当社のエージェンシーの事例(4eck-media.de)であるkosmetik-uhl.de ウェブサイトのホームページデザイン(上)と Webブラウザでの表示(下)をご覧ください。

Creative Cloudの新機能:Photoshop CC 14(2013年6月)- Webデザイナー向けの一般情報と改善点

現在、Photoshop CCには、テキストスムージングのオプションにWebモードが2つ追加されました。私のシステムでは Windows と Windows-LCD があります。MacユーザーはMacとMac-LCDを取得します。これにより、後でWebサイトでテキストがどのように見えるかを理想的に模倣できます。MacとWindowsが選択肢として用意されていたらより良かったです。私の印象では、Macではテキストが常にWindowシステムよりも少し強調されて表示されるためです。

クリエイティブクラウドの新機能:Photoshop CC 14(2013年6月)- ウェブデザイナー向けの機能と改善点

CSSをコピーする

当社のエージェンシーでは、Photoshop CS6まで有料のプラグインCSS Hatを使用して、ベクター形状やレイヤースタイルをCSS3コードに変換していました。この機能は現在Photoshop CCに組み込まれています。つまり、テキストレイヤーや形状レイヤーを右クリックしてCSSコードをコピーできます- そしてその後、エディターに貼り付けます。CSSコードが常にそのまま取り込まれるわけではないかもしれません(たとえば、絶対位置のため)、しかし、エクスポートしたCSSコードを新規に書くよりも編集しやすいです。

クリエイティブクラウドの最新情報: Photoshop CC 14 (2013年6月) – 02 Webデザイナー向けの一般情報と改善点

さらに、 レイヤースタイル も考慮されます。たとえば、私の形状に 影付き がある場合、CSS出力には box-shadow としてそれが表示されます。複数のオブジェクトをまとめてCSSでコピーしたい場合は、グループ化して右クリックして、グループに CSSコピー を選択します。

Creative Cloudの新機能:Photoshop CC 14(2013年6月)- ウェブデザイナー向けの一般的な改善事項

Webカラーをインポートする

Photoshop CCでは、 カラーピッカーパネル メニューを介して、Webカラーパレットに既存の色を追加または置換できます。ウェブページを1回保存するだけで、HTMLファイルやいくつかのCSSファイルなど、一連のファイルが得られます。それらで定義されたWebカラーをインポートできます。

Creative Cloudの新機能:Photoshop CC 14(2013年6月)- 02 ウェブデザイナー向けの一般的な改善

適切な色を取得したい場合、スクリーンショットとピペットを使わなくともよいです。たとえば、C4D-Treff.de のHTMLおよびCSSファイルをダウンロードして、そのカラー指定に従ってPhotoshopで他のメディアを作成したい場合は、それらをインポートできます。

Creative Cloudの新機能:Photoshop CC 14(2013年6月)- 02 ウェブデザイナー向けの一般的な改善