PhotoshopでレスポンシブWebデザイン!

PhotoshopでWebデザインする際の設定チェック

全333コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
このレッスンでは、PhotoshopでWebサイトのデザインカンプを作成する前に、必ず実施しておきたい設定チェックについてお話していきます。
講師:
04:28

字幕

このレッスンでは Photoshop でWeb サイトのデザインカンプを作成する前に必ず実施しておきたい設定チェックについてお話ししていきます。Photoshop のバージョンはCC 2015 以上にアップデートしてもしこのコースで解説するすべての機能を使うのであればCC 2015.1 以上にしておきましょう。また、デザインスペースと呼ばれる新しいユーザーインターフェースを利用したい場合にはOS のチェックも忘れないでください。Mac でしたら OS 10.10 のYosemite 以上Windows でしたら 8.1 以上が必要になります。では、もう少し見ていきましょう。もしデザインスペースを利用する時は「環境設定」を見ていきます。Mac の方はメニューバーの「Photoshop CC」から「環境設定」Windows の方は「編集」から「環境設定」を開きます。そして「テクノロジープレビュー」の項目を開いてください。こちらに「デザインスペースを有効にする」というチェックボックスがあります。もしデザインスペースを使えなくて困ったなという方はこの環境設定のところのチェックが入っているかどうかを確認してください。 繰り返しになりますがOS が Mac でしたら Yosemite 以上Windows でしたら 8.1 以上の時にこのチェックを入れたり外したりすることができるようになっています。では新規ファイルを作りながらもう少し Web 用の設定について確認をしていきます。今新規ドキュメント作成のダイアログボックスを開きました。この時カラーモードが必ず「RGB カラー」になっていることをチェックしてください。Web サイトのデザインカンプを作る時はCMYK ではなく必ず RGB を選んでいただくことになります。そして長さの単位も pixel になっていることを確認してください。この長さの単位は「環境設定」からもチェックすることができます。Mac の方はメニューバーの「Photoshop CC」から「環境設定」Windows の方は「編集」から「環境設定」で「単位・定規」のところを開きます。ここで pixel になっていることを確認してください。「定規」の方も「文字」の方も pixel にしておくことが必須ですのでよくチェックしておきます。もう1つ、新規ファイルを作成する時に確認しておきたい項目があります。 もう一度新規ドキュメント作成のダイアログボックスを開きました。この時にドキュメントの種類を「アートボード」にしておくと1つのドキュメントの中で複数のアートボードを使ってデザインを進めることができます。1画面しかデザインしないよということが必ず決まっている場合は「Web」でも宜しいんですけれどももし1つのドキュメントの中でアートボードを複数増やしていきたい場合はこちらを選択してください。そうしますと、アートボードのサイズを予め設定された様々な端末、代表的な画面の大きさから選んで作成することができます。ここでは仮に iPhone 6 を選んでみます。750×1334 pixeliPhone 6 の画面のサイズになりましたので右上の OK を押して作成します。ここまで Photoshop で Web サイトのデザインカンプを作成する前に必ず実施しておきたい設定のチェックについて話してきました。このレッスンを参考にして作業を始める前にぜひご自身の環境を整えておいてください。

PhotoshopでレスポンシブWebデザイン!

モバイルデバイスにおいてWebを適切に表示させるための仕組みであるレスポンシブWebデザインは、すべてのWebデザイナーにとってもはや必須の取り組むべきテーマです。また最近ではPhotoshopでも美しいカンプを簡単に作れるようになりました。このコースではレスポンシブWebデザインのカンプをPhotoshopで効率的に作成するテクニックを具体的に説明します。

2時間16分 (26 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 1,990
発売日:2016年03月02日

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。