忍者ブログ
フリーのドローソフト『Inkscape』をあつかう人のブログ
×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

長らくかかってしまいましたが、ようやく公開と相成りました。
この間にもアクセスがあったようで、期待してこられた方は大変申し訳ありません。

いろいろとワードに書き続けていたら、枚数が26ページととんでもない数になってしまって、悩みました。結局ままに公開しましたが、記事の長短が激しいです。
そして、自分で言うものあれなんですが・・・見にくい様な。画像のサイズが固定されてしまったり、個人的に不都合もあるのですが、追々直せたらと思います。
この講座に関してご意見がありましたら、遠慮なくご連絡下さい。「この説明がわからない!」とか、「こんなものも描いてほしい!」といったものでもOKです。出来る限りご希望に添えたいと思いますw

さて、Inkscapeはもうじき新バージョンが出そうな雰囲気ですが、あまり盛り上がっているように見えませんね・・・。やはりペイントツールと違って、専門的な感じが抜けないのでしょうか。個人的にすごくお手軽に使えるソフトだと思っているのですが、なかなか難しいものです。
ちなみに、新バージョンはしばらくお預けです。パソコンが限界ですので・・・。新しく買い換えたら入れてみたいと思ってます。

今後は、雑記メインでブログを更新していきたいですね。講座にはすぐ飛べるよう、ジャンプページを作成する予定ですが、作り方がわからないので少々お待ち下さい。

それでは今後ともよろしくお願いします。
PR
さて、いよいよ講義も最終回です。今までは説明のためにイラストを活用しましたが、最後はこれまでのノウハウを生かして1枚完成させてみましょう。
記事が長くなるのはご了承下さい(^^;
 
という訳で、今回はお題を出しまして、細かく説明しましょう。
お題はこんなのでどうでしょう?
umi.png


夏の海といいますか、ビーチといいますか、そんな感じのイラストです。今回はこれでいきましょう。





1.レイヤー分け
まずは下準備ですね。いろいろモノがありますから、それぞれレイヤー分けをしましょう。慣れていれば、レイヤー分けをせずともそのまま作業に入れますが、慣れないうちはきちんと分けたほうが無難です。私自身も、レイヤー分けを誤った為に、パーツが行方不明になることが多々ありましたので・・・。
今回はこんな感じに分けました。

kouza04-1_1.PNG全部で10個ですね。順番もこのままです。
ここで見ていただきたいのは、一番上の枠ですね。
これは何かというと、印刷(用紙)サイズに合わせて一番上に囲いをつけているのです。これを行うと、どこまで出力されるかわかるので、全体の調整に便利です。まぁ、これは個人的に利用しているだけですので無くても構いません。
また、わかりやすいように日本語で分けていますが、これもお好みで構いません。どこに何があるかだけわかれば問題無しです。1,2,3・・・なんて数字だけでも結構ですよw


2-0. 描画・・・の前に
準備ができましたら、早速描画に入りましょう。・・・とその前にここで保存しておく事をおススメします。どこで落ちるかわかりませんので・・・(^^;
ちなみに描き出しはどこからでも構いません。好きなところから始めましょう。ここの説明では、下から順番に描いていきます。


2-1. 空の描画
一番下が空ですか。と思うかもしれませんが、要するに1番遠いところにあるものと考えて下さい。
大体上半分か3分の1くらいが空ですね。ここを描画します。
  kouza04-2_1.PNG
 
はい出来ましたw
ものすごく大雑把ですが、枠外は出力されないので適当で良いわけですね。こういったところで存分に手を抜きましょうw
色も何となく空っぽい色で大丈夫です。それに上から下に向かって線形グラデーションをかけています。




2-2. 雲の描画
空の次は雲です。これは空の範囲に描いてもいいですし、はみ出したってOKです。
kouza04-2_2.PNG
大体こんな感じですね。やっぱり枠の外は適当ですw
ベジエ線の使い方は大丈夫でしょうか?
雲の丸みを表現して下さいね。
また、雲の端部分を灰色で縁取り、ちょっとそれっぽくしてみました。





2-3 砂浜の描画
どんどんいきましょう。次は下の砂浜です。・・・ですが、空と同様なので、説明する事がありません。同じように下3分の1くらいを描画して下さい。
kouza04-2_3.PNG
一応色はCMYK値で0/8/33/5です。見た目で問題なければ特に注意する事はないでしょう。







2-4 海の描画
真ん中ですね。ここもそれほど難しいことはないと思いますが、コツだけは押さえておきましょう。
kouza04-2_4.PNG

まず上の部分。水平線という事で、若干丸みをつけています。さらに下の部分。ここは境目を白で縁取って、何となく波が来ているように表現しました。
真ん中の波は4点とって、曲げただけです。強い波なら鋭利に。穏やかなら横に広くでしょうか。大きさに準じて数を調整しましょう。海の色は100/57/0/17です。



2-5 ヤシの木の描画
本格的な描画はこの辺りからでしょうね。まずはどうなっているか見て下さい。
kouza04-2_5.PNG
これを見てお気付きになるでしょうか。
実はこの3本、1本をコピーして反転して貼り付けただけですw
こういうことがいとも簡単にできますので、ぜひ活用しましょうw
模様が途中で途切れています。もちろん出力されないからです。見える部分だけでOKです。
これは細かく説明しましょう。
 
 葉の描き方です。
kouza04-2_6.PNG
まず、三角形を作りましょう。そして、辺はすべて曲線にします。また、この時上の頂点はノードをスムーズにして角をなくしておきましょう。
最後にフィルに色をつけ、ストロークを削除すれば完成です。
これをコピーして増やしてもいいですし、一つ一つ作ってもいいですね。
コピーする場合は、反転を活用すると反対側の葉も作れて作業短縮になります。

 
kouza04-2_7.PNG幹の描き方です。
まずは適当に四角形を作りましょう。そうしたら、横の辺を曲げます。上下は曲げなくていいでしょう。ただし、長さは調整して下さい。何となくいい感じに仕上がりましたら、色を入れます。最後に幹の模様を入れましょう。今回はストロークで入れました。樹種によって描き方は工夫して下さいね。
 
 
 kouza04-2_8.PNG 

2
つを合わせて完成です。幹は前面にすると良いでしょう。ただし、今回のような場合に限ってですね。基本的に幹は隠れるものと考えて下さい。




2-6 スイカ、ボールの描画
徐々に難しくなってきますね。講座のしがいが出てくるというものですw
 kouza04-2_9.PNG
次はこのスイカとボールを描きましょう。どちらも円を使っているのは変わりません。どちらかというと、模様のほうが難しいです。
 
 
 
 
 
 
kouza04-2_10.PNG
まずはスイカから。スイカの本体は真円です。これは円コマンドをShiftを押しながら描画する事で作ることが出来ます。模様は説明が難しいので、実物を参考にされたほうが良いかと思います。簡単なコツですが、端を細く、真ん中を太めにすると、いい感じに見えてきます。
 

kouza04-2_11.PNG
続いてビーチボール。ちょっと色が見えにくかったので背景色を入れてあります。
真円は同じですね。これ、単純に横に見たものを描いても良かったのですが、あえてこんな微妙な角度にしました。Inkscapeのテクニックとは異なりますが、こんな感じのも練習して損はないと思います。パーツを見て頂ければわかるかと思いますが、奥2つは内側に曲がっています。こうすることで丸みを表現するわけですね。・・・とまあ、私が言うより実物を見ていただければわかると思います。パーツは円に合わせるように曲げましょう。

kouza04-2_12.PNG
最後は下の影ですね。これにも円コマンドを使いましょう。円コマンドを普通に使用すると、真円にするのは難しいですね。しかし、この場合は何となく一致しそうな楕円でいいですので、大きさに注意しながら2つの楕円を作りましょう。そうしましたら、配置を最背面にします。位置を調整して色を入れます。これは、砂浜の色に黒を加えたものを使いましょう。予め砂浜の色をコピーして貼り付け、黒の値を増やせばOKです。
ちなみにこの色は、0/8/32/12ですね。



2-7 浮輪の描画
徐々に完成に近づいてきましたね。オブジェクトもたくさん作りましたし、Inkscapeの操作は慣れてきましたでしょうか?
kouza04-2_13.PNG
それでは、次は浮輪です。これはちょっと面倒です。
柄が入っているから面倒・・・ではなく、面倒な理由は別にあります。説明の際にお話ししましょう。
ちなみに2個ありますが、やはりコピーで増やしています。また、大きな影がありますが、これはビーチパラソルの影です。配置の関係でここに入れています。
 
 kouza04-2_14.PNG
見えるか不安ではありますが、真ん中に線が入っていますね。これはさしたる問題は無いのですが、問題なのは本体のほうです。本体はこの線に沿っていません。途中で折れています。ということは、これは楕円で表現できない。もしくは難しいということです。本体自体は楕円なのですが、中心の穴は楕円では出来ません。一計を投ずることになります。
 
kouza04-2_15.PNG
パーツを分解するとこんな感じになっています。ここで注目してもらいたいのは、中心が空洞になっているということです。白を重ねてもいいのですが、今回の置き方では空洞でなければいけません。これには説明していないテクニックを使う必要があります。
 
 
 kouza04-2_16.PNG
 
 


上のようにオブジェクトを2つ重ね、ドラッグもしくはShiftで複数選択をします。そうしましたら、パスメニューから差分を選択します。すると、上の場合は真ん中が抜けます。基本的に大きさの異なるオブジェクトの場合、大きいほうのオブジェクトが残ります。小さいオブジェクトが差分として使われるわけです。また、同様の大きさの場合、選択順で決まります。後に選択したものが差分に使われます。
これを使用して浮輪の本体を作ります。
穴あきの楕円が出来ましたら、両端に少し角度をつけます。真ん中の穴にもちゃんとノードがありますので、それをコントロールしましょう。上の画像を参考に、浮輪に見える形にして下さい。真ん中の線はあってもなくてもいいと思います。模様はボールの要領で付けてみて下さい。面倒であれば、素のままでも結構です。
これが出来ましたら、面倒なものは終わりました。あと少しです。



2-8 ビーチパラソルの描画
面倒な浮輪が終わってしまえば、後は難しいことはありません。次はパラソルですね。
 kouza04-2_17.PNG


これもあまり説明のしようが無いのですが、傘のバランスに気をつけてノードを打ち込むくらいでしょうか。傘のスタイルはどんなものでも結構です。自由に作ってみて下さい。
 
 
kouza04-2_18.PNG 
パーツを分解するとこんな感じです。ベースも傘の形になっていますが、合わせるのに便利なだけで、必要なものではないですね。ただ、これは作業量が特別増えるものでもないので、作ったほうが楽かもしれません。
下の部分は、砂に埋まっている様子を表現したかったのですが、イマイチになってしまいました。
真ん中の模様は、お好きなものを入れて下さいね。



2-9 カモメの描画
最後はカモメですが・・・正直オマケもオマケで、あってもなくてもいいようなものですが・・・。
kouza04-2_19.PNG 

空の中心部分にありますね。しかしこれ、波の描き方と同様です。曲げてない分、これのほうが楽です。大きさと角度に注意しましょう。
 
 
 
 
 

  
以上ですべての描画が出来ました。枠を消して(非表示にして)出力してみて下さい。最初にお見せした画像が出来ていると思います。
これにて、Inkscapeの基本講座はおしまいです。お疲れ様でした。
いかがでしたでしょうか。Inkscapeがどんなソフトかはお分かりいただけたでしょうか。慣れてくるといろいろ複雑なものも描画できるようになるはずです。面白いと感じましたら、是非ご活用下さい。
フィルであれだけ描けるなら、ストロークっていらないんじゃないの?
いえいえ、そんなことはありません。フィルにはフィルの。ストロークはストロークの良さがそれぞれあります。
ストロークは外線とお話ししましたが、ベジエ線で描かれる線もストロークです。何となく線はストロークと思って頂ければ大丈夫でしょう。でも、フィルで作られた線はストロークとは呼びませんのでご注意を。
さて、ストロークはどんな時に使いましょう?ストロークの最大の良さは、どれだけ伸ばそうが曲げようが太さが常に一定という点。これを活かしましょう。
 
kouza03-1_7.PNG少々縮小していますが、細いほうが4pxのストローク太いほうが6pxのストロークです。簡単に羽のような形を作りました。これをコピーして増やし、45度、90度というように角度をつけて、中心で合わせます。
 
 
 
 
 kouza03-1_8.PNG
 
雪の結晶っぽいものができました。確かにフィルと比べると、あまり重要ではないかもしれませんが、ストロークはストロークなりに使い様があるということも覚えておいて下さいね。
こんな感じの模様をストロークで作って増やしましょう。
 
 

kouza03-1_9.PNGkouza03-1_10.PNG 
上のも含めて3つほど作ってみました。適当に線を引いて合わせるだけでも形になりますから面白いものです。
折角ですので、前の記事で描いた雪だるまに合わせて完成にしたいと思います。

-完成例-
kouza03-1_11.PNG
背景が寂しかったので、簡単に木を追加。真円よりは多少崩し気味のほうがかわいいと思いましたので、雪だるまを若干つぶしました。雪の結晶はぼかしてもいいですね。ストロークの色は、薄い青色に変えて、より雪っぽく仕立て上げました。
作品はともかく、フィルとストロークについてはぜひ理解して下さいね。
フィルはオブジェクトの主となる色と説明しましたね。なので、フィルだけを利用してモノを作るのは、普段Inkscapeを使うやり方となんら変わりはありません。よく、ドロー系のイラストには主線の見られないものがありますが、それはフィルのみを扱って作られているはずです。
kouza03-1_6.PNG 
このように、フィルだけで描くのは特別難しいわけではありません。ベジエ線で描いて、フィルに色を入れてストロークを削除するだけです。境目を見ると、ペイント系にあるはずの主線が全くありません。
主線がないと、色塗りがままならないと思われるペイントツールとの大きな差がここにあります。
いきなりフィル・ストロークといわれても何だかわかりませんよね。まずはフィル・ストロークがどこにあるのか画像で確認しましょう。
 
 kouza03-1_1.PNG
メニューのオブジェクトの項目の1番上にフィル/ストロークとありました。
 
 

 
kouza03-1_2.PNG

メニュー2段目、このアイコンもフィル・ストロークです。
 
kouza03-1_3.PNG画面左下、小さいですが上下にF/Sとあります。これもそれぞれフィル・ストロークの事です。
 
このように様々なところでフィル・ストロークをいじれるようになっています。これらを選択(左下の場合はダブルクリック)すると、以前にも登場しました、
 kouza03-1_4.PNG

こちらのウインドウが出てきます。
実際に細かく設定するにはこのウインドウを活用するのですが、簡易的にフィル・ストロークをいじるには左下の部分が圧倒的に便利です。
少なくとも、左下の部分でフィル・ストロークが操作できるということは頭に入れておいて下さい。
 
 
 フィル/ストロークの出し方はよろしいでしょうか。
では、フィルとは、ストロークとはそれぞれどのことを指すのでしょう。次の画像をご覧下さい。
 kouza03-1_5.PNG
大雑把に説明しますと次のようになります。
真ん中の黄緑色。オブジェクトの主となる色がフィルです。ストロークは外線の青色の部分。この線をストロークと呼びます。
この二つはそれぞれ重要ですので、どちらかをおざなりという訳にはいきません。でも大丈夫です。この二つは、Inkscapeでも1、2を争う利用頻度です。使っていれば、間違いなく慣れて気にならなくなります。


それでは、フィルとストロークそれぞれの個性を見ていきましょう。性質が異なるため、用途も違います。一例として見てみて下さい。
カレンダー
06 2024/07 08
S M T W T F S
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31
カウンター
フリーエリア
最新コメント
最新トラックバック
プロフィール
HN:
machimaru
性別:
男性
自己紹介:
Inkscapeでいろいろ描いてます。
バージョン:0.45pre1
バーコード
ブログ内検索

Copyright © [ Inkscapeな日々 ] All rights reserved.
Special Template : 忍者ブログ de テンプレート
Special Thanks : 忍者ブログ
Commercial message : [PR]