ピーぷーみーの楽屋裏

本室でおバカやってる猫とうさぎと飼い主の、これまたおバカな素の日常。

 ▼よろしければコチラもいかが・・・・寄り道、近道、抜け道のご案内▼
ピーぷーみー 猫ときどきうさぎの日常

当ブログの「本室」サイト。
猫うさの写真、まんが、等。
我流パソコン絵の描き方

当ブログの1カテゴリ。
パソコンでのお絵かき方法紹介してます。
まるでためにならない音楽雑記

みーままの別ブログ。
クラシック、吹奏楽、クラリネットの話。
<< 「パソコン絵」5番目の記事関連 | main | 行き当たりばったりライフ >>
5.余白が透明な絵を文書に貼る
今回は絵の描き方じゃなくて、絵の処理の仕方です。
目的は、ワードやエクセルなどの文書に貼るための、絵。

一般に文書や表計算ソフトでは、画像ファイルを読み込んで貼ることができます。
自分で描いた絵でも同様。

今回は校舎をバックに遊ぶ子供、としたいのですが・・・・・
あれれ、子供の絵を入れたら、バックの校舎と文字が、隠れちゃいました・・・
1
(絵の境界がわかりやすいように緑の点線枠をワザとつけてます)

パソコンで扱う画像ファイルは、みんな「四角形」です。
余白のない「物体だけ」の絵もよく見かけますが、
実はそれも四角形で、物体の余白を「透明」にしているだけなのです。

画像ファイルは普通に保存しても透明にはなりません。
特に「透明にする」処理をしてやる必要があるのです。

方法は2つありますが、まずは画像自体を透明にする方法。
使用ソフトは相変わらずAzPainterです。

【1】画像を「透過付きPNG」で保存する
絵を描き、最終的に保存する直前(つまりこれ以上描画したり縮小拡大したりしない)の段階で、
絵の上に新規レイヤを追加し、透明にしたい部分を塗りつぶします。
絵の輪郭より少し外側に線を描き、その外を塗りつぶすといいでしょう。
このとき注意することは、必ず「鉛筆」ツールを使うことと、
絵本体の中に”存在しない”色を使うこと。
2

拡大して見てみます。
絵本体は境界をなめらかにするため多くの色を使ってますが、
塗りつぶし部分は境界からベタ一色になってます。
3

この状態で「名前を付けて保存」します。
ファイルの種類は「PNG」にし、透過にチェックを入れます。
4
(PNGでなくGIFでも、透過処理ができます・・・両者の違いは、後述します)

すると次に、「透明色設定」の画面が出てきます。
ここで「どの色を透明にしたいのか」を設定します。
目的の色の上でクリックして、「OK」。
5

画像の保存ができたら、次は文書ファイルでの作業です。
今回はエクセルでの作業例です。
なお私が持ってるOfficeのバージョンは2003なので、その前提で話を進めます。

【2】エクセルで図を挿入する
画像ファイルを挿入するときは、
挿入→図→ファイルから で、さっき保存した画像を選びます。
6

挿入完了。
画像のサイズが大きかった(←これについても後述)ので、画面いっぱいの大きい画像が入りました。
それに、青めの紫だったところは、確かに透明になってますね。
7

画像をクリックし、右下のカドを持って目的の大きさまでドラッグして縮小します。
8
余白部分が透明なので重なった部分もちゃんと見えます。

ワードでの作業手順も、似たようなもんです。

以上は画像そのものを透過にする方法でしたが、
実はワード・エクセルなら、次のような方法も使えます。

【別の方法】透明じゃない絵をエクセル(ワード)で透明にする
透過処理をしなかった画像ファイルを【2】の手順で挿入します。
最初のサンプルのように余白が白くなっていて、背景が見えません。
この絵をクリックし、右クリックして、「図ツールバーの表示」をします。
9

出てきた「図ツールバー」の右から2番目のアイコンをクリックします。
マウスカーソルがスポイト状になるので、透明にしたい白の部分をクリックします。
10

白部分が全部透明になりました。アラ簡単。
11
この方法だと、【1】の時のように線の周りに白部分が残らず、
人物が輪郭にそってキレイに切り出された形になってます。校舎と重なった部分を見比べてください。
ただ、白が全部透明になったので、よく見ると人物の白いシャツも透明ですけどね。(笑

【1】の方法とどちらがよいかは、時と場合によって使い分けるのがいいでしょう。
たとえば↓この絵の「給食のせんせい」は
12
バックに他の絵や線が重なっているので、周りに少し白を残すことで、
湯気や動作を表す線も含む絵のワンセットを、より目立たせる効果があります。

次回は、「半透明の絵」を作る方法です。

 >>次の記事「半透明の絵を作る(文書用限定)
 >> もくじ <<
JUGEMテーマ:お絵描き

にほんブログ村 イラストブログへ にほんブログ村 イラストブログ 絵日記へ


・・・と、その前に。
後述をお約束していたGIFとPNGの違いや、画像の大きさについては、続きをどうぞ・・・・
一般に画像に透過処理が出来るのはGIFとPNGです。
両者の違いをごく簡単に挙げてみると・・・・
★GIFの特徴
使う色の数が256色に限定されるので、ファイルサイズが小さく済む。
その代わり、微妙な色合いなどが表現できない。
透過処理したものは、パソコンの環境を選ばず透明に見える。
★PNGの特徴
色の数は(放っとけば)フルカラー。色数が多いほどファイルサイズが大きくなる。
微妙な色合いも美しく表現出来る。
透過処理したものは、パソコンの環境により正しく表示されないことがある。

というワケで、ウェブの世界では、軽くて汎用性の高いGIFの方が多く使われます。
特にブラウザではシェアNo1の Internet Explorer(6以下)が透過PNGに対応していないのが、PNGにとっては致命的!
(試しに、コチラの記事に透過PNGを貼ってます。IE6以下の方は、透明になってないでしょ?)

でも、ウェブにアップするのでなく、自分のパソコンで作業する文書に使うのが目的なら、ファイルサイズも気にしなくていいし、美しく表現できる方を使った方がいい・・・・
今回のサンプルになった絵を拡大してみます。色合いの違いを、ご確認ください。

14

13

ただ、使うソフトとの相性も重要です。
私は普段ワード・エクセルなので問題ないですが、
一太郎(バージョン10)ではどうもPNGは読み込めないっぽいです。
その他、年賀状ソフトとか、使ったコトないのでわかりません・・・・

次に画像の「大きさ」について。
ウェブにアップする場合は、最初から表示サイズに縮小してから保存しますが、
文書に使う場合は、大きめに作っておいて、文書の中で縮小した方が、線などがキレイに出るような気がします。
(根拠はないんです。あれこれ試しているうちに、落ち着いた方法です。)
文書の場合は、パソコン画面上の見え方だけでなく、印刷結果も考慮する必要があるので、試行錯誤の手間は、2倍です・・・(^_^;)
| みーまま | 我流パソコン絵の描き方本編 | 23:01 | comments(0) | trackbacks(0) |
スポンサーサイト
| スポンサードリンク | - | 23:01 | - | - |









http://pipumi-mama.jugem.jp/trackback/478
     12
3456789
10111213141516
17181920212223
24252627282930
<< September 2017 >>
+ SELECTED ENTRIES
+ RECENT COMMENTS
+ LINKS
+ CATEGORIES
+ ARCHIVES
+ MOBILE
qrcode
+ PROFILE
+ RECENT TRACKBACK
+ SPONSORED LINKS