まだCS使ってるの?Photoshop CC使えばWEB制作が効率化!それが分かる動画

どうも。ノッツです(^o^)/

Adobeのクリエイティブソフトには、従来のCSと最新版のCreative Cloud(CC)があります。

WEB制作の現場でよく使われているPhotoshop

Photoshopを使ってWEB制作する際にCSとCCとでは、どんなことに違いがでるのでしょうか?

それについて紹介した動画がAdobeのYouTubeの公式チャンネルにて公開されていましたのでご紹介していきます。

スポンサーリンク

【CS vs CC徹底比較】もっと楽になるWeb制作 Photoshop

この動画内容について簡単に説明していきます。

画像の切り抜き何が変わったの?

「画像の切り抜き何が変わったの?」ということで、画像を切り抜いてから合成画像を作成する際に、作業の工程でどのような違いがでるのかを比べています。

従来のCSだと…

CSの場合、画像を切り抜いて合成する際にはいくつかの工程が必要で、時間がかかり面倒な作業が必要でした。

選択範囲の作成、エッジの調整、合成結果の確認、それぞれの作業が必要だったからです。合成の確認時のマスクは、下レイヤーの画像が見えないため、うまくいかなかったら最初からやり直しということも。

これがCCを使うと…!!

CCなら『選択とマスク』を使うことで、選択範囲の作成、エッジの調整、合成結果の確認までを同じウィンドウズ上で実行することができるのでスムーズに作業ができます。

ある程度の範囲を選択した後、エッジ調整などで境界線を調整しながらすばやく選択範囲を作成、その後にオニオンスキンで下のレイヤー画像を表示して合成結果をその場でいつでも確認することができるので、直感的な操作で合成ができます。あとからの修正も簡単。

最後に〈OK〉をクリックすれば、あっという間にマスクの完成です。

CCのほうが簡単!

素材の書き出し何が変わったの?

「素材の書き出し何が変わったの?」ということで、WEB用の素材を書き出す際にどのような違いがでるのかを比べてます。

従来のCSだと…

CSの場合、WEB用に書き出したい素材をその都度、スライスを切って1つ1つ書き出しする必要がありました。

書き出す素材が少なければいいのですが、書き出す素材が多いと大変な作業で手間がかかります。また、2倍解像度の画像を同時に書き出すことはできません。

これがCCを使うと…!!

CCならレイヤーごと書き出す『クイック書き出し』の機能を使うことができ、WEB用に書き出したい素材を一気に書き出すとができます。

書き出したいレイヤーをレイヤーパネルから選択して、『クイック書き出し』を実行するだけ。たったこれだけで書き出しの完了です。

『書き出し形式』という書き出し方法も選ぶこともでき、必要なサイズを追加して、JPEGなどの任意の形式を選ぶだけで、素材を一気に書き出すことができます。サイズはいくつか設定できるので、2倍解像度用の素材も同時に書き出すこともでき、素早い書き出しが可能です。

CCのほうが速くて便利!

ヘッダーの管理何が変わったの?

「ヘッダーの管理何が変わったの?」ということで、ヘッダー画像などの共通の素材を編集する際にどのような違いがでるのかを比べています。

従来のCSだと…

CSの場合、ヘッダーに修正依頼が入るとページ1つ1つに対してやり直すことになります。

2つ3つくらいなら良いかもしれませんが、共通の素材が増えてくると非常に効率が悪くなってしまいます。

これがCCを使うと…!!

CCなら『リンクを配置』の機能を使うことができ、リンクされたスマートオブジェクトを利用することで、共通の素材の修正を一括反映させることができます。

ヘッダーなどの共有パーツを個別のファイルで作成し、ヘッダーを『リンクを配置機能』を使って配置します。同様にすべてのファイルにヘッダーを配置。

こうすることで、修正が発生してもリンク元の画像を1つ開いてヘッダーを更新して保存すれば、全ページのヘッダーの更新が完了します。

CCのほうが便利!

複数サイズのバナー制作何が変わったの?

「複数サイズのバナー制作何が変わったの?」ということで、違うサイズのバナーを制作する際にどのような違いがでるのかを比べています。

従来のCSだと…

CSの場合、サイズ違いのバナーを1ファイルずつ管理することになり、編集する際に大変で効率が悪いです。

同じようなデザインを作成するのに、作成するサイズの数だけPSDファイルを作成しなければならず、ファイルごとに編集と管理が必要ということです。

これがCCを使うと…!!

CCなら1つのファイルでサイズ違いの素材を作成&管理することができます。同じファイル上で複数サイズの素材を編集することができるのです。

まずアートボードを追加して任意のサイズを指定します。アートボードはいくつでも作成可能。

アートボードで1つのデザインが完成したら、デザイン素材を他のアートボードに複製、素材のサイズや配置を調整して、すばやくサイズ違いのデザインを作成できます。次々にバナーが完成していきます。

修正作業も簡単で、編集したい素材であるスマートオブジェクトを1つ開き、デザインを変更して保存するだけで、すべてのアートボードに変更内容が一括反映されます。

CCのほうが便利!

スポンサーリンク

さいごに

簡単さで、便利さで、選ぶならやっぱPhotoshop CC!!

「新機能は必要ないし、日常的な作業ならCSのままで十分だ!」と考えている方もいると思いますが、Photoshop CCに移行することで頻繁に繰り返すような作業がもっとラクになります。

Adobeの公式サイトのAdobe CSとCCの違いを製品別に解説!(もっと楽になるWeb制作)のページにも今回の内容について書かれていますので興味のあるかたは是非見てみてください。

Photoshop CCは体験期間を利用することで一定期間無料で使うこともできますので、そういった期間を利用してPhotoshop CCのスゴさを是非体験してみてくださいね。

体験版はこちらから。

⇒ Photoshop CCの体験版

Photoshop CCについてはこちらから。

⇒ Photoshop CC

Photoshop CCを一つ利用したい場合はCreative Cloudの単体プランとなり月額2,180円かかります。

Photoshop CCの他にもLightroom CCを利用したい場合は、Creative CloudのフォトプランというPhotoshop CCとLightroom CCがセットに使える月額980円のプランもありますので、両方使いたい場合はこちらのプランを使うといいと思います。こっちのほうが安いです。

フォトプランの体験版はこちらから。

⇒ フォトプランの体験版

フォトプランについてはこちらから。

⇒ フォトプラン

フォトプランは単体プランと比べると、オンラインストレージが20GB(単体プランは100GB)となったり、Typekitが使えないなどといったことがありますが、安く使えるのでそれほど気にすることではないでしょう。

Lightroom CCとPhotoshop CCの他に、Illustrator CCやInDesign CCなども使いたい場合は、Creative Cloudのコンプリートプランという月額4,980円のたくさんのソフトが使用できるプランを使うといいでしょう。

プラン違いは、Creative Cloudのプラン比較表に書かれているのでこちらを御覧ください。

ぜひ、CCバージョンを使って、効率化されたデザインを生活を手に入れてくださいね!!!