Illustratorを使ったアイコンのデザイン

ベクター図形への変換

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

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
スケッチしたデザインに基づいて、ツールを使いベクターの図形に変換していく過程を解説します。
講師:
08:13

字幕

このレッスンではスケッチしたデザインに基づいてツールを使い、ベクターの図形に変換していく課程を解説します。ここでまずそれぞれのアートボード上のドキュメントが、それぞれのレイヤーに対応しているかどうかを確認してください。こちらのアートボードが実際のオブジェクト作成のアートボードです。それがこのベクターアイコンのレイヤーにあることを確認してください。そしてスケッチは必ずロックされてスケッチのアートボードにあることを確認してください。それでは実際にツールを使って描画を開始していきます。例としてこちらのカレンダーのアイコンを再構築していきたいと思います。再構築の際には、後ろのこの点々で表示されているグリッドを目安にしてオブジェクトを作成していくと便利です。例えばこのカレンダーのアイコンですが、ここの長方形は縦に5マス横に7マスの大きさです。これを元にこのブランクのマスを使ってカレンダーのアイコンを作成していきます。まず長方形ツールで、縦に5マス横に7マスの長方形を作ります。この時に、初期設定の白と黒線の設定をします。そしてその中にもう一つ長方形がありますが、これはオブジェクトメニューから「パス」>「パスのオフセット...」これを選択してここから作成していきます。 「パスのオフセット」は、設定した図形よりも一回り大きいまったく同じ図形、または一回り小さいまったく同じ図形、そういうものを作る機能があります。ここでは一回り小さい長方形を作るので、オフセットにマイナス、この場合は 6px と入力してみます。プレビューを押すと、どのような結果が出るかが分かります。だいたい良いので、ここで OK で決定します。そしてカレンダー上部にも長方形を足していきます。もう一つは選択ツールを使ってWindows の Alt キーまたはMac の Option キーを押しながら移動します。これで2つ作ることができました。そしてカレンダーの中に小さいマスを作っていきます。ここで塗りと線の設定を変えます。線をなしに設定して塗りを黒に設定します。同じく Windows の Alt キーまたは Mac の Option キーを押しながらこの場合は Shift も一緒に押してください。そして Command+D、Windows は Ctrl+D で変形の繰返し。これを縦3列作っていきます。同じく Shift キーとWindows の Alt キー、Mac の Option キーをホールドしてください。 Ctrl または Command+D で変形の繰返しをします。これで基本的なパーツはすべて揃いました。ここから細部を編集していきます。選択ツールから角に丸みを足していきます。上部のこの小さい2つの長方形にも丸みを足していきます。両方選択して、キーボードの A を押します。そしてコーナーに丸みを足していきます。ここで塗りと線を変更していきます。線になしを設定して、塗りに白を設定します。さらに「オブジェクト」>「パス」>「パスのオフセット...」を使い、これよりほんの一回り大きい縦横比を固定した長方形を足します。この場合は一回り大きい長方形になるので、オフセットに 1px と入力します。プレビューで確認してください。大きさが良ければ OK を押して決定します。そして次にこの外側の大きな長方形に、この図形に沿って このようなくぼみを付けていきたいと思います。それには外側の長方形の図形と大きな長方形、これを選択して「シェイプ形成ツール」を使います。この時にくぼみを付けるためにWindows の Alt キーまたはMac の Option キーを押しながら、カーソルがマイナスサインになっていることを確認して、このようにくぼみを付けていきます。 そうしたら残りの図形も塗りと線をそれぞれ設定していきます。最後にこの上のこの部分を、例えば中間のグレーのような色に変更して少し見やすいようにします。このようになりました。元のスケッチと比較してみます。元のスケッチをベクターで再構築した例がこちらです。このような手順で残りのスケッチもベクターオブジェクトに変換していきます。そしてこれがすべてのスケッチをベクターオブジェクトとして再構築した結果になります。このレッスンでは、スケッチしたデザインに基づいてツールを使い、ベクターの図形に変換していく課程を説明しました。

Illustratorを使ったアイコンのデザイン

Illustratorはアイコンのようなシンプルかつ鮮明な図形の作成に最適です。このコースではアイコンデザインの基礎概念から実際のデザイン過程までを詳しく解説します。さらに完成したアイコンをさまざまな媒体に対応したデータに書き出す方法まで詳しく解説しており、とても実用的な内容になっています。

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

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

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

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