FC2ブログ

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

お花・マーガレットをイラストレーターCS6で簡単作成!

Macイラストレーターでお花のオブジェクトを簡単作成できます。
今回のイラレのバージョンは「CS6」です。

完成作品はコレ!
マーガレット作成


それでは早速作成方法の手順をご紹介。
ツールメニューバーから
楕円形ツールを選ぶ。
マーガレット作成1


花びらの一枚をイメージして楕円を作成。
このときに縦長に配置して作成する。
マーガレット作成2


作成した花びらオブジェクトを選択する。
マーガレット作成3


ツールメニューバーから回転ツールを選ぶ。
マーガレット作成4


ここで回転の中心点を下にずらしておく。
中心点は薄いブルーの小さなマーク。
マーガレット作成5


回転のウィンドウを出す。
ココがポイント!
※中心点をoptionキーを押したままダブルクリックする!

ウィンドウが出たら回転の設定を
角度-20度、プレビューにチェックして
「コピー」をクリックする。
マーガレット作成6


角度がついた複製が作成される。
複製が作成された直後、
まだ複製が選択状態になっている状態で、
同じ動作を繰り返す。
マーガレット作成7


上部ヘッダーメニューの「オブジェクト」をクリック。
「変形」→「変形の繰り返し」
ショートカットキーボード操作は、
コマンドキー+D
マーガレット作成8


コマンドキー+D の
ショートカットを繰り返すと花びらオブジェクトが
回転しながら複製されていく。
マーガレット作成9


角度を20度にしてあるため、数回繰り返し、一周すると
すべての花びらオブジェクトがシンメトリックに配置される。
マーガレット作成10


中心点の場所を試行錯誤してみて、実際に作成する
花の形になるよう調整する。
マーガレット作成11


花びら全選択し、オブジェクト、グループ化する。
マーガレット作成12


花の中心部分の円を作成。
マーガレット作成13


全選択して、
グループ化された花びらオブジェクトと、
中心の円オブジェクトが、
中心に重なるように調整する。
上部メニューより
「ウィンドウ」→「整列」で調整する。
マーガレット作成14


花びら、中心などに色付け、完成。
マーガレット作成15


最初の花びらや中心部分のオブジェクトの色づけを
こんな感じにしてみると…。
マーガレット作成16


このようなイメージに仕上げることができる。
マーガレット作成17


イラストレーターは本当に楽しいアプリケーションです。
今回はCS6の画面説明でしたが、この作業はCS1でも、
それより以前のバージョンでも作成可能なスキルです。
イラストレーターをお持ちなら、
是非かわいいお花を作ってみてください。

I'll be in touch.
スポンサーサイト

テーマ : イラストレーターを楽しもう!
ジャンル : ブログ

tag : CS6 adobe illustrator Mac 花びら フラワー マーガレット イラスト

イラストレーターリンク画像収集・整理スクリプト

Adobe Illustrator CS5
にて、AIファイルとリンク画像を収集して整理するスクリプトを紹介。

イラストレーターでDTP作業をしていると、
あちこちから画像やらをリンクさせてしまいがち。
さらには同一階層にメモや不要なファイル、
ボツ画像がたまり、最後の印刷入稿でトホホ状態に。

しかしCS5からはデフォルトで便利な収集スクリプトが付属。
今回は収集スクリプト方法を紹介。


リンクファイル整理スクリプト1
(1)まずは収集ファイルの格納先フォルダを作成。
例では「最終原稿」フォルダとしている。
場所はどこでもかまわない。


リンクファイル整理スクリプト2
(2)目的のイラストレーターファイルを開く。


リンクファイル整理スクリプト3
(3)ファイル→スクリプト→その他のスクリプト…
をクリック。


リンクファイル整理スクリプト4
(4)スクリプトの置いてある場所は、
アプリケーション→Adobe Illustrator CS5→スクリプティング→
サンプルスクリプト→AppleScript→出力の修正


リンクファイル整理スクリプト5
(5)「CollectForOutput.scpt」のスクリプトをクリック。


リンクファイル整理スクリプト6
(6)スクリプトを開始するかと聞いてくるので、
「OK」をクリック。


リンクファイル整理スクリプト9
(7)収集保存先の場所を聞かれるので、最初に作成しておいた
「最終原稿」フォルダを「選択」。


リンクファイル整理スクリプト7
(8)収集作業が開始される。
このスクリプトは「終わりました」などの合図が無い。
どれくらい時間がかかるかも予想できない。
そこで予めイラストレーターでリンクファイル数チェックを推奨。
フォルダの中がAIファイル1個+リンク画像数のみとなったら
スクリプト完了が把握できる。


リンクファイル整理スクリプト10
(9)スクリプトが収集されると、イラストレーターファイルは
「PDF互換ファイルを作成」状態で保存されている。
そのため通常のイラストレーターファイルより容量が大きくなっている。
スクリプトのデフォルト設定がそうなっているため。


リンクファイル整理スクリプト8
(10)印刷入稿などの場合は、必要に応じて
別名保存で再度保存設定を変更すること。


DTP作業の仕上げの悩みがこれでまたひとつ解消だっ!
Illustratorはやはり手放せないっ!


I'll be in touch.

テーマ : イラストレーターを楽しもう!
ジャンル : ブログ

tag : adobe cs5 Illustrator リンクファイル 画像収集 アップルスクリプト 印刷入稿 リンク漏れ防止 不要ファイル整理

オリジナルロゴを自由に作りませんか?

Adobe IllustratorとPhotoshopを使って、オリジナルロゴを自由に作りませんか?

イラストレーターはロゴをデザインしたり、書体を作るのに最高のアプリケーション。
フォトショップは画像の加工、お絵描き、素材作りと万能性抜群!
両者のいいとこ取りして、ロゴ作りで遊んでみよう。
今回はウルトラマンタロウのロゴを元に、パロディロゴを作ってみる。
ウルトラマンロゴ

では、さっそく作り方をご紹介!


AI編(イラストレーターから作業開始)

1 イラストレーターを起動。新規ファイル作成。
ウルトラマンロゴ01
あらかじめ、ペンツールを別ウィンドウで出しておく。
ペンツールの右下コーナーの三角印をクリックして、右側のバーをつまむと別ウィンドウとして独立して表示可能となる。

2 あらかじめ用意してあるトレース用の画像をレイヤー1に配置する。
ウルトラマンロゴ02

3 レイヤー1をロック。
新規レイヤー2をクリックしてアクティブ状態にする。
ウルトラマンロゴ03

4 レイヤー2に、ペンツールでトレースしてロゴを作成する。
ウルトラマンロゴ04
すべて一筆書きにこだわらず、「ウ」のように簡単作業でOK。

5 ロゴのトレースが完了。
ウルトラマンロゴ05
「タロウ」部分は別文字を合成するのでトレースはあえてしていない。

6 レイヤー1の目玉アイコンをワンクリックして不可視状態に。
ウルトラマンロゴ06
トレースラインの仕上がりを再確認。

7 アルファベットロゴの「T」を「R」に改造。
ウルトラマンロゴ07
カタカナの「タロウ」の書体風に「リオ」と作り変えてみる。

8 枠線「赤」でトレースしたベジエ線を、黒ベタに変更する。
ウルトラマンロゴ08
※線の塗りを無しにして、「塗り」だけで表示してみること。

9 イラストレーターのデータをPhotoshop画像にする準備。
ウルトラマンロゴ09
適当な枠線でロゴを囲む。「塗り」は無し。
※ロゴが画像のふちギリギリに配置されないようにするため。

10 上部メニューより、ファイル→書き出しを選ぶ。
ウルトラマンロゴ10

11 画像として書き出す場所を選択。
ウルトラマンロゴ11
保存形式のフォーマットはPhotoshop(psd)にする。

12 書き出しオプションウィンドウが現れる。
ウルトラマンロゴ12
「レイヤーを保持」にチェックを入れる。WEB用などで利用する場合、カラーモードは「RGB」にすること。


PSD編(フォトショップ作業開始)

13 Illustratorで画像として書き出したファイルをPhotoshopで開く。
ウルトラマンロゴ13
レイヤーウィンドウの右上端をクリック。
レイヤーオプションで「グループを結合」。
※画像を扱いやすくするため。

14 Illustratorでロゴの周りに黒線で枠を作ったので、ロゴ周りに余白の余裕がある。同時に黒の枠線も書き出しされている。
ウルトラマンロゴ14
最初にこの黒線は削除しておく。

15 (1)ツールメニューの選択範囲ツールでロゴの周りを適当に選択。
ウルトラマンロゴ15
上部メニュー「選択範囲」→「選択範囲を反転」。

16 (2)ロゴの周り(うすいピンクは参考)が選択された状態になる。
ウルトラマンロゴ16
キーボードの「delete」か、「編集」→「消去」。

17 ロゴの黒い部分だけを選択する。
ウルトラマンロゴ17
「選択範囲」→「色指定」。

18 「選択範囲」→「色指定」→「指定色域」→「シャドウ」を選択。
ウルトラマンロゴ18

19 「シャドウ」を選択するとプレビュー画面に黒の色部分だけが選択される様子がプレビューされている。
ウルトラマンロゴ19

20 黒の色部分だけが選択された。
ウルトラマンロゴ20
選択する目的は、ロゴを着色、加工するための準備。

21 選択状態をキープしたまま、上部メニュー「レイヤー」→「レイヤースタイル」→「グラデーションオーバーレイ…」。
ウルトラマンロゴ21

22 「グラデーションオーバーレイ」ウィンドウで描画モード「通常」、不透明度「100%」、スタイル「線形」、角度「90°」としておく。
ウルトラマンロゴ22

23 分岐点をクリックして、カラーをクリックすると分岐点部分のカラーを自由に変更できる。
ウルトラマンロゴ23
新しい分岐点はクリックすると追加される。
※作成したグラデーションは保存しておくことも可能。

24 さらにロゴを立体的に演出するため、レイヤースタイルを追加。
ウルトラマンロゴ24
「ベベルとエンボス」を選択。

25 さらにロゴを立体的に演出するため、レイヤースタイルを追加。
ウルトラマンロゴ25
「ベベルとエンボス」を選択。

26 レイヤーに2種類の効果が加わった。
ウルトラマンロゴ26
一度選択を解除する。
選択範囲→選択を解除、または
キーボード「comand+D」(Mac)
キーボード「control+D」(Win)。

27 ここからは背景制作。
ウルトラマンロゴ27
素材集などから背景画像を選ぶ。
選んだ画像のカラートーンを変更してみる。
「イメージ」→「色調補正」→「色彩・彩度…」。

28 黄色ベースだった色あいを赤ベースに変更。
ウルトラマンロゴ28

29 光り輝く効果のための素材を使用。
ウルトラマンロゴ29
素材はPhotoshopで作る。
ネットには様々なブラシフィルタがあるので探してインストールして使うのもよい。

30 ロゴと背景素材、光の素材を合成。
ウルトラマンロゴ30
赤の背景素材を開き、レイヤーの「背景」をクリックしてロゴファイルへドラッグする。

31 レイヤーの順番を上から「ロゴ」、「光素材」、「背景素材」と仕上げて
ウルトラマンロゴ31

【 完成 】

いかがですか? イラストレーターで遊びたくなりましたか~?

I'll be in touch.

テーマ : イラストレーターを楽しもう!
ジャンル : ブログ

tag : ウルトラマンタロウ イラストレーター フォトショップ ロゴ作成 ウルトラマンロゴ ウルトラマン書体 ブラシフィルタ adobe cs4 オリジナルロゴ

謹賀新年

2012newyear_card

2012年
あけましておめでとうございます。

本年最初のブログは年賀状をイラストレーターで作成!
です。

デザインプランを考える。
2012studiohermit_cardplan

といっても、簡単に生まれるわけではない。
そこでテーマや使いたい素材を書き出してみる。
今年は音楽を素材に使いたいと思っていた。
辰年の龍も外せない。
2012年への願いは「心のこもった生き方」である。
そこで音楽の素材をトーン記号にしてみた。
龍の曲線と融合できそうだからだ。
この時点ではウロコをハートにしようと思っていた。
テーマが決まった。
「龍、トーン記号、ハート」

次に生む苦しさ。
トーン記号にデザイン融合させる
「龍」を描くこと。

今回はPhotoshopを使用せずに、
すべてイラストレーターで作成!

(Photoshopは下絵をスキャンのみ)

1. トーン記号となる龍の絵を作成。
2012studiohermit_card01

2. イラストレーターで新規ファイル作成。
サイズはA4縦レイアウトなどでよい。
「メニュー」→「配置…」で、描いた下絵の龍を配置。
2012studiohermit_card02

3. 下絵に沿ってベジエ曲線(ペンツール)でそれぞれのパーツを描いていく。
こればかりは経験で修得するしかないが、イラストレーターの醍醐味はココ!
2012studiohermit_card03


4. キーポイントはレイヤーをうまく使うこと。

龍のラインをライトグリーンで描いていく。
そのときにレイヤーのプロパティでは赤など対称色を選ぶこと。
ベジエ曲線を作成するときのポイントが見やすくなる。
時々下絵のレイヤーを目隠ししてラインの形を確認する。
2012studiohermit_card04

5. レイヤーは増やし過ぎもよくないが、計画的に作成する。そのときにこまめにレイヤー名を作成しておくこと。
2012studiohermit_card05

6. 龍の曲線はシンプルだが、円に近い。
そのためにきれいなラインが要求される。
外ラインを太めに、塗りとラインの差がわかるようにコントラストカラーで確認。
2012studiohermit_card06


7. ウロコを作成する準備。

2012studiohermit_card07

8. ウロコパーツを作成したら、コピー&ペーストで配置していく。
その際に、オブジェクトを変形させながら、形に合わせて配置していくこと。
2012studiohermit_card08

9. ウロコとボディのパーツを使って、ヌキ取りしたウロコパーツを作成しておく。
パスファインダーの中抜きを使ってパーツを作っておく。
2012studiohermit_card09

10. 中抜き状態のボディパーツやウロコパーツはそれぞれ別レイヤーでとっておく。
2012studiohermit_card10

11. 各パーツは作業でわかりやすくするため色分けしておく。
最終的な色は最後の仕上げで決めていく。
2012studiohermit_card11

12. 龍がギョクをつかむ手を作る。
2012studiohermit_card12

13. 口もとのえくぼラインなど、細かい描写を追加していく。
2012studiohermit_card13

14. 龍の絵が完成したら、周りにトーン記号となるラインを追加していく。
アートボードからはみ出してもよいので、気に入るまでラインを作り込む。
2012studiohermit_card14

15. ピアノを弾く少年キャラクターの絵を描く。
新たなアイデアを生むのと異なり、これは簡単。
2012studiohermit_card15

16. 龍と同様に、下絵をベジエ曲線で作り込む。
2012studiohermit_card16

17. 最終的に着色して仕上げる。
この塗り絵の時が楽しいひととき。
絵の具を変えたり、筆を洗わずとも、何度も気に入るまで塗り直したりできるのがデジタル塗り絵の便利さと楽しさだ!
このときのために苦労してベジエ曲線を作り込むと言っても過言ではない。
2012studiohermit_card17

18. 頭の中で描かれているデザインをレイアウトにしていく。
イラストレーターの新規ファイルで、アートボードをハガキ横レイアウトサイズにする。
そこに作り込んだパーツやオブジェクトを配置してレイアウト作り。
2012studiohermit_card18

19. 完成したカード!
2012studiohermit_card

イラストレーターはラインが美しく、カラーもはっきりと見せることができます!。
これだから、イラストレーターはやめられないっ!
本年もどうぞよろしくお願いします!!


I'll be in touch.

テーマ : イラストレーターを楽しもう!
ジャンル : ブログ

tag : 年賀状 イラストレーター illustrator CS2 年賀状イラスト 音符 トーン記号 イラスト ドラゴン

イラストレーターで商用イラストを作成!(7)完成

(14)イラスト完成!
お客様イラスト1点。
サービススタッフイラスト3点。
(スーツ、制服、オペレーター)

イラストレーター

イラストレーターでは、一度ベースパーツを作成すれば、
様々な応用が自由自在。

イラストレーターの基本スキルですが、
イラストが完成したときは、もう気分はプロのイラストレーター!

【!】ワンポイントアドバイス
この商用イラストでテイストに気を使った点があります。
お客様イラストは、少し若く、かわいく見せています。
対してサービススタッフは、微妙にお客様よりも年上に見せて、
かわいさよりもまじめで、地味にしています。
このようなテイスト、気配りは、場合によります。
肝心なことは、クライアントの求めているニーズを読み取ることでしょう。

(6)へ戻ってみる
(1)の一番最初へ戻ってみる

I'll be in touch.

FC2ノウハウ

テーマ : イラストレーターを楽しもう!
ジャンル : ブログ

tag : アドビイラストレーター 商用イラスト イラストレーターの使い方 初心者のイラストレーター イラストレーターを使う 働く女性イラスト オペレーターイラスト 女性イラストの書き方 イラストレーターヘルプ スタジオハーミット

イラストレーターで商用イラストを作成!(4)

(9)同様に他のトレースを作業。
同様に他のイラストも下絵を元にトレースする。
イラストレーター

時々、ラインがきれいにカーブをしているかなどを見るために、
「original_illust」レイヤーの目玉アイコンをクリックして隠す。
なるべく拡大して、細部のカーブなどをチェックする。
イラストレーター


(10)楽しい塗り絵でお遊び!
ここからは塗り絵遊び。
好きな色で着色したり、ほほにグラデーションでお化粧したりと、
楽しみながら、着色していく。

フォトショップと異なるのが、きれいに着色できること。
ビットによる感覚ではないので、線の枠内隅々まで、きれいに着色される。
女性の顔に肌色を着色したら、赤のラインは無しにして、塗りだけにする。
イラストレーター


(5)へ続く!
(3)へ戻ってみる
FC2ノウハウ

テーマ : イラストレーターを楽しもう!
ジャンル : ブログ

tag : イラストレーター アドビ トレース レイヤーアイコン グラデーション 塗り絵 着色 イラストの書き方 ベジエ曲線 ベクターデータ

イラストレーターで商用イラストを作成!(2)

(4)各パーツの作成計画をイメージ。
最初に「お客」の人物イラストから着手。
まずは顔の輪郭をペンツールで作成していく。
ペンツールに慣れていなければ、オブジェクトツールで楕円を作成してもよい。
ここでツールパレットからよく使うメニューを独立させておくと便利。
ここではダイレクト選択ツール(白い矢印ツール)とペンツール
ツールメニューから分離させて、作業の近くに置いた。
イラストレーター

(5)ベジエ曲線の特性を知る。
ベジエ曲線ペンツールで使いこなすところがイラストレーターの妙技。
ここで好き嫌いがわかれるのが、このアプリケーションの特徴でもある。
女性の髪の先端が鋭く尖っている。
好み、目的にもよるが、ここでは先端を丸く、ゆるやかになるようにしてみる。
「線」ウィンドウはデフォルトで、線の先端が角張っており、ポイントの分岐点も直角である。
ここではポイントの分岐点を緩やかになるように図のアイコンにチェックを入れる。
イラストレーター

(6)各パーツを色分けのラインで作成。
ペンツールで作成するときは、下絵が見えるように、
塗りは無しにして、透明状態にする。
輪郭の線だけに色を使ってトレースしていく。
顔の輪郭と髪を赤、前髪をオレンジ、首を黄緑、胴体を緑、髪飾りを青、として
各パーツの線を色違いで作成。
これは後ほど、オブジェクトに色を塗るときにわかりやすくするため。
イラストレーター


(3)へ続く!
(1)へ戻ってみる
FC2ノウハウ

テーマ : イラストレーターを楽しもう!
ジャンル : ブログ

tag : イラストレーター CS2 CS4 アドビ ペンツール ベジエ曲線 商用イラスト イラストの書き方 CMYK変換 ベクターデータ

イラストレーターで商用イラストを作成!(1)

イラストレーターは苦手だと言う人がよくいます。
そんな人に、イラストレーターの魅力をお伝えしたいと思います。
今回は実践にも役立つスキルを紹介しつつ、商用イラストを完成させてみましょう。


完成予定のイラストは、
【商用広告の人物・女性イラスト】

イラストは4点。
お客1パターン、サービススタッフ3パターン。
サービススタッフの顔ベースはコピーして利用するため、
制服を3パターン作成します。


それではスタート!
(1)下描き用の絵を描く。
(約5~10分)
絵心に自信がなくても、だいたいの輪郭やイメージを描ければよい。
失敗しても、下絵はラフでよい。
この時点で簡単な色のイメージもメモしておくとなおよい。
イラストレーター

(2)スキャナーでスキャニング、イラストレーターに配置。(02)
イラストレーターで新規ファイルを作成。
メニューの「ファイル」→「配置」でスキャンした画像を配置する。
イラストレーターもフォトショップ同様、レイヤーをよく使う。
フォトショップもイラストレーターも、
レイヤーを使いこなすことで、楽しみ方が大幅に広がる!
最初に下絵を配置した「レイヤー1」に「original_illust」と名前をつけた。
イラストレーター

(3)トレース用の新規レイヤーを作成。(03)
レイヤーウィンドウの新規レイヤーアイコン、または右上の三角ボタンをクリックして、
新規レイヤーを作成。
下絵をトレースするので「trace_illust」と名前をつけた。
イラストレーター


(2)へ続く!

FC2ノウハウ

テーマ : イラストレーターを楽しもう!
ジャンル : ブログ

tag : イラストレーター CS2 CS4 アドビ 商用イラスト イラストの書き方 CMYK変換 スウォッチ DICカラー ベクターデータ

イラストレーターCS4で20thFOX映画のタイトルを作ってみよう!(2)

【イラストレーターで遊ぼう!】

(4)立体感を出すためのブレンドツール設定方法
オブジェクトから「ブレンドオプション」を選び設定をしておく。
今回はステップ数で設定し、数値は50とする。
いろいろと数値を入れて試してみて作成してみましょう。
20thcenturyfox_04

2つのオブジェクトを手前と後方の順で配置する。
20thcenturyfox_05

20thcenturyfox_06

(5)各パーツを組み合わせる
そっくり真似ても芸がないので、
「20th CENTURY DOG」としてみた。
20thcenturyfox_07

空の背景を入れて完成。
20thcenturyfox_08

(6)Photoshopで仕上げ。
照明効果を使ってさ、照明を照射した雰囲気を出してみた。
20thcenturyfox_09

イレストレーターとフォトショップの連携させると多彩に遊べます!
まるでデジタルリマスター版
「20th CENTURY DOG !!」

ステップ(1)へ戻る

I'll be in touch.

テーマ : イラストレーターを楽しもう!
ジャンル : ブログ

tag : スタジオハーミット illustrator cs4 20thcentury フォックス映画 ブレンド ブレンドオプション ステップ数 Adobe ハリウッド映画

イラストレーターCS4で20thFOX映画のタイトルを作ってみよう!(1)

【イラストレーターで遊ぼう!】
Adobe Illustrator CS4
20thcenturyFOX映画のタイトル作成方法!(1)
20thcenturyfox_09


今回はイラストレーターで映画のタイトルを作成してみます。
活躍するのは「ブレンドツール」です。

(1)素材の準備
参考とする画像を用意する。
20thcenturyfox_00

(2)書体部分のパーツを作成する
画像を参考に、各パーツをトレースしながら作成する。
似たフォントがあればそれを変形させて作ってもよい。
20thcenturyfox_01

(3)オブジェクトパーツを作成する
立体的なものを平面図に置き換えて
各分解パーツを作成し、組み合わせていく。
オブジェクトのポイント同士が吸着する設定にしておくと便利。
20thcenturyfox_02

20thcenturyfox_03

ステップ(2)へ
NEXT>>>

テーマ : イラストレーターを楽しもう!
ジャンル : ブログ

tag : スタジオハーミット illustrator cs4 20thcentury フォックス映画 ブレンド ブレンドオプション ステップ数 Adobe ハリウッド映画

スタジオハーミットRSS
プロフィール

STUDIOHERMIT

Author:STUDIOHERMIT
スタジオハーミットのオフィシャルブログです。Adobe Photoshop,Illustratorのスキル、Apple Macintosh関連の情報を配信しています。

最新記事
最新コメント
最新トラックバック
月別アーカイブ
カテゴリ
Mail form.

名前:
メール:
件名:
本文:

検索フォーム
リンク
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。