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

カラーパレットを作成する

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

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
ここでは、Adobeの配色支援Webサービス「Kuler」を使って、Illustratorで利用できるカラーパレットを効率的に作成する方法について、解説していきます。
講師:
08:04

字幕

ここでは Adobe の 配色支援 Webサービス Kuler を使って Illustrator で使用できる カラーパレットを 効率的に作成する方法について 解説していきます デザインの仕事をしていると 時々配色に悩むことがありますよね クライアントさんから 完全に色の指定がされている時は あまり考えなくてもいいのですが 自分で配色をする自由がある場合 逆に悩んでしまうことが あるかもしれません そんな時 配色支援ツールを 使うことがあると思うのですが このレッスンでは AdobeID を持っていると 無料で利用できる Kuler という Webサービスをご紹介します アドレスは今 画面に映っていますように kuler.adobe.com ブラウザでこちらにアクセスをすると 利用することができます ではブラウザの方に移動してみましょう 今私は既に自分の AdobeID で Kuler のサイトにログインをしています もし AdobeID をお持ちでなくても 日本の Adobe のサイトから 無料で作成することができますので それを使ってログインしてみましょう Kuler は色に関する コミュニティサイトですので メニューの「探索」をクリックすると 他の人が作った配色を 閲覧することができます クリックしてみましょう この左上にある「探索」 こちらをクリックします そうしますと このように 他の人が作った配色が 一覧することができます もちろん これを使わせていただいても 大丈夫ですけれども 自分が好きな配色を作成して 登録をすることもできます そして Photoshop や Illustrator で利用できる カラーパレットのファイルを ダウンロードすることもできます たとえばクライアントさんから 秋の新商品紹介のページを 作ってほしい と依頼されたとしましょう 秋のイメージを前面に押し出した 配色をしてほしいと言うご希望ですけれども どのようにすればいいか 迷ってしまうかもしれません その時 Kuler のサイトで 検索してみると 他の人が登録した秋のイメージの配色を たくさん見つけることができます ただ一つ注意点があるのは 日本語で登録されている配色が あまり多くない場合があるので 英語で検索してみる方が 良い検索結果に なるかもしれないということです 今回のケースですと 日本語で「秋」と入れるよりも たとえば英語で「autumn」 と入力してみたり もしくは 「fall」 という単語で検索してみた方が たくさんの結果が出てきます 気に入った配色があったら クリックしてみましょう クリックすると 個別のページに移動してきます この個別のページには コメントを書きこんだり 各種SNSで共有したり もしくは五段階の評価 この星印で 五段階評価を付けたりというような コミュニティ機能がついています この中で一番ご紹介したいのは このメニューバーの中の 「ダウンロード」です こちらをクリックすると Photoshop や Illustrator InDesign 等で利用できる カラーパレットファイルを ダウンロードすることができます このファイルの拡張子は「.ase」という ファイルなんですけれども ダウンロードした後 Illustrator の中に 取り込んで 利用することができますので やり方をご説明しましょう 先程ダウンロードをクリックして もう既にファイルが落ちていますので ダウンロードのフォルダを開いてみます そうしますと今落としてきた この.aseファイルが ダウンロードのフォルダの中に 入っています これを Illustrator から 取り込んでみましょう 今度は Illustrator の方に 移動します Illustrator の スウォッチパネルを使います もしスウォッチパネルが 表示されていない方は メニューバーのウィンドウから 真ん中あたりにある 「スウォッチ」を選択してください スウォッチパネルの右上の ドロップダウンメニューを開いて 下から3行目にある 「スウォッチライブラリーを開く」 を選択します さらにサブメニューで 「その他のライブラリー」を選んでください そして先程ファイルを落としてきた ダウンロード こちらのフォルダから落としてきた .aseファイルを開きます そうすると今選んだ.aseファイル fallカタログという名前の 配色だったんですけれども こちらが取り込まれましたので ご自分のデザインで 自由に利用することができます さらに Kuler の中で自分自身の 配色を作ることができますので それもやってみましょう まだブラウザの方に戻りまして Kuler のサイトから 今度は「作成」をクリックします 新規の配色作成画面になりますので 「カラールール」の所を開いて いくつか用意されている この配色のメソッドを選んでください こちらを選んだら カラーホイールの中で 自分が気に入った配色になるまで 動かしていきます このカラーホイールを使った 配色だけではなく 写真をアップロードして その写真から色を拾って 配色を作るということも可能です その場合は 右上の このカメラのアイコンをクリックして ご自分の使いたいファイルを― 写真のファイルを選択して アップロードします このように 今 アップロードしたファイルの中から 自動的に色が何色か 拾われていますけれども これを移動して― 自分の気に入った配色になるまで 動かしていきます これで OK となりましたら この部分に 自分の気に入った名前を付けて 「保存」ボタンをクリックします これでもう簡単に 配色が保存されました ではこの自分が作った配色を 先程と同じように カラーパレットファイルを ダウンロードして使ってみましょう 右側のダウンロードの リンクをクリックをしたら ダウンロードフォルダの中に 今ダウンロードした.aseファイルが 入っていることを確認してみましょう これができましたら Illustrator の方に移動して スウォッチパネルの右上の ドロップダウンメニュー 「スウォッチライブラリーを開く」 「その他のライブラリー」 ダウンロードのフォルダから ご自分が作った .aseファイルを 選んで開きます 今ブラウザの中で作った配色が このように取り込まれました ここまで Adobe の 配色支援 Webサービス Kuler を使って Illustrator で利用できるカラーパレットを すばやく作成したり ダウンロードしたりする方法について お話ししてきました ご自分だけの配色を 是非作ってみてください

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

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

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

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

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

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