Illustratorを使ったWebデザインのテクニック

作成した要素をライブラリに登録する

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

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
このレッスンでは、Webサイト用にデザインした様々なパーツを、AdobeIllustratorCC2014から追加された新機能「ライブラリ」に登録する方法を練習していきます。また、シンボルとライブラリの違いについても、ご説明します。
講師:
07:43

字幕

このレッスンではWebサイト用に デザインした様々なパーツを Adobe Illustrator CC 2014 から 追加された新機能「ライブラリ」に 登録する方法を練習していきます また今までにもあった機能 シンボル こちらと ライブラリの違いについても ご説明します 今ご覧いただいているのは ひとつ前のレッスンで作成をした ボタンのパーツのデザインです このそれぞれのボタンを まずはライブラリに 登録をしておきましょう 冒頭でもふれましたけれども ライブラリの機能は Creative Cloud (CC) の2014から 追加された新機能です アップデートをした方は一番最初に このライブラリのパネルが 開きっぱなしになっていますので ご覧になった方も いらっしゃるかもしれません このライブラリにグラフィック ですとかカラーですとか テキストのスタイルを登録をしておくとIllustrator だけではなく Creative Cloud の他のアプリケーション でも利用することができます 登録をするのはすごく簡単で 登録をしたいこちらの要素を ドラッグ&ドロップするだけです 「アートワーク1」 という名前で 登録されましたので ダブルクリックをして 「 btn 」 という名前に変えておきます 他の2つも同様に作業しましょう ドラッグ&ドロップして 「 btn-hover 」 一番下は 「 btn-active 」 という名前にしておきます ライブラリに3つの グラフィック要素が追加されました 新しいファイルでこちらの ライブラリに追加した要素を 利用するには 新規ファイルを作っても ライブラリパネルの中に 先程 登録した要素が そのまま入っています 使いたいものを右クリックして 「ドキュメントで使用」を選べば 新しいファイルの中に 今 利用しようとした要素が 配置されます 右クリックして 「ドキュメントで使用」を選択すれば オーケーです Illustrator だけではなく Photoshop でも同じことができます アプリケーションを Photoshop に切り替えてみましょう ライブラリパネルの中に 先程 作成したものが すでに登録されています 同期されてこちらに読み込まれています では新規ファイルを使って 配置をしてみましょう 新しいファイルをひとつ作って 「ライブラリ」ボタン「btn」の上で 右クリックをします 「ドキュメントで使用」を 選択すると このように要素が配置されますので Enter または return キーを押します このように先程作ったボタンが 表示されました レイヤーパネルを見てみますと このボタン btn の要素は スマートオブジェクトになっています ということは このスマートオブジェクトの アイコンをダブルクリックしますと Illustrator で編集することが可能です 例えば今 “お問い合わせ” となっているこの文字を “お申し込み” に編集してみます 保存してファイルを閉じます そして Photoshop の方に移動しますと “お申し込み” に変わっています ここでライブラリと シンボルの違いについて お話をしておきたいと思います Illustrator の方に戻って もう一度新規ファイルを作って ご説明をしていきましょう ライブラリから配置をした素材 2つ同じ btn を配置してみます こちらをひとつ編集したとしても この編集はもうひとつライブラリから 配置した要素には反映されません またライブラリの中にある こちらの btn にも編集は反映されません ライブラリの機能を使って 配置した要素同士 こちらは連携していない状態です ではシンボルですと どうなっていたか 確認してみましょう シンボルのパネルを開きます こちらの要素をシンボルとして 登録をします 名前は 「 btn-02 」 にしておきましょう 種類は flash 読み込みの時の 種類ですので ここでは指定をしなくて結構です このまま「OK」を押します シンボルとしてボタンが登録されました では このシンボルをいくつか このように配置をします そしてどれかひとつを 編集しようとすると このようなアラートが出ます 「シンボル定義を 編集しようとしていますー」 「シンボルの編集内容はすべての インスタンスに適用されますー」 「続行しますか?」 「OK」を押して 「お申し込み」を例えば… 「送信」に変更しましょう そして編集を終了すると すべてのインスタンスが 一気に変わっていることがわかります これがライブラリを 使用した時との違いです もう一度まとめますと ライブラリに登録をしたものは 他のアプリケーション 例えば Photoshop と連携が可能です ですけれどもマスターを変更して すでに配置をしたそれぞれの要素に 一括変更することはできません シンボルの方は Illustrator だけの 機能ですけれども この元々のシンボルを変更すると すべてのインスタンスに対して 変更が一気に反映されます このそれぞれの特性を活かして 使用シーンごとに 使い分けていただけると もっと作業効率が 上がるかと思いますので ぜひお試しください 以上 Adobe Illustrator を使って Webサイト用に デザインした様々なパーツを ライブラリ それからシンボルに 登録する方法を練習しました シンボルとライブラリ それぞれの特徴を知って 便利に使い分けてください

Illustratorを使ったWebデザインのテクニック

このコースではIllustratorを使ったWebデザインの方法を学びます。IllustratorをWebデザイン用の設定に変更するところから始め、各種端末向けのドキュメントやユーザーインターフェイスの作成ができるようになるまで順を追って説明します。このコースを見れば、整理されてエレガントなIllustratorドキュメントが制作できるようになるでしょう。

7時間03分 (52 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 3,990
発売日:2015年04月09日

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

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

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