全349コースを10日間無料でぜひご覧ください。Libraries」を利用し、Photoshopのドキュメント内にコンポーネントを配置する方法を学びます。ドキュメント内にコンポーネントを配置する方法を学びます。サイトのパーツつまりコンポーネントとしてデザインしたテキストと写真のセットです。いう名前のグループの中にタイトルと写真と文章が入っています。こちらのコンポーネントは考え方としては伸び縮みを左右にしても成立するようなものになっています。横幅が伸び縮みした場合この丸い写真は常にセンターにある状態そしてテキストの方もこのように左右幅を変えることができる状態に想定しています。このコンポーネントをライブラリにグラフィックとして登録してみましょう。レイヤーパネルを一度切り離しておくと作業がしやすいので左側に寄せておきます。ライブラリパネルを開きます。いうグループを選択してライブラリパネルにドラッグします。マウスカーソルをパネルに重ねると「+」のアイコンが出てくるのでここで手を放します。いうグラフィックがライブラリに登録されました。実際にこれを使ってみましょう。レイアウト途中のドキュメントに移動してきます。レイヤーパネルが邪魔なのでもとに戻しましょう。グリッドに合わせたガイドラインを作ってあります。グリッドがありますので先程登録したこちらのコンポーネントを3つ分のグリッドの横幅に合わせて使っていく想定で配置してみたいと思います。キーを押すことで配置することができます。この時注意が必要です。ドラッグ&ドロップだけで配置をしてしまうとシンボルと同じような考え方でこちらのオリジナルを複製したものが配置されたということになってしまいます。しますと、編集する時にこちらのコンポーネントだけのテキストを書き換えたり写真を個別に差し替えたりということができなくなってしまいます。それを避けるために作業をやり直してみますがCommand+Zヒストリーパネルで元に戻してもう一度作業してみます。キーを押しながら配置してください。すると、コンポーネントを個別に編集することができます。キーを押す時と押さない時の違いを覚えておいてください。利用することができますので試しにやってみましょう。仮にこちらのサービスのロゴマークが差し変わったということにしたいと思います。方に移動してこちらが新しいサービスのロゴマークです。場合と同様にロゴマークを選択してライブラリパネルの中にドラッグ&ドロップします。画面の方に移動します。作ったロゴマークが同期されていますので今あるロゴマークと差し替えてみましょう。ロゴマークを選択してこのライブラリのパネルから新しいログマークをドラッグ&ドロップします。キーを押さずにドラッグ&ドロップしました。押さずに配置されたライブラリのグラフィックは全て編集内容が反映されるためです。キーを押さないと全体管理ができてオリジナルを編集すればその編集内容が全てに反映される、という違いがありますので是非使い分けをしてみてください。ロゴマークのところを差し替えてしまいましょう。古い方のロゴマークを非表示にして新しいロゴマークを所定の位置に入れてみます。活用できるという事例でした。ライブラリパネルの中にはグラフィックや写真だけではなくて文字のスタイルですとかよく使うカラースキームを登録しておくこともできます。統一したスタイルで様々なデザインを作りたいときこのカラースキーム、文字スタイルを活用することができるでしょう。ドキュメント内にコンポーネントを配置する方法を説明しました。PhotoshopでレスポンシブWebデザイン!モバイルデバイスにおいてWebを適切に表示させるための仕組みであるレスポンシブWebデザインは、すべてのWebデザイナーにとってもはや必須の取り組むべきテーマです。最近ではPhotoshopでも美しいカンプを簡単に作れるようになりました。このコースではレスポンシブWebデザインのカンプをPhotoshopで効率的に作成するテクニックを具体的に説明します。発売日:2016年03月02日このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。お問い合わせは、cs-jp@lynda.com宛までご連絡ください。無料レッスンを視聴するここから世界が拡がります。lynda.comとlynda.comのロゴは、商標登録されています。登録してからブックマークを使用してください。lynda.comにジャンプしました。