SSブログ

背景が透明なアイコンを作る。 [ブログカスタマイズ]

私の希望は・・・

○自分でアイコンを作りたい!
○背景は透明にしたい!
○PCにインストールされているソフトで済ませたい!
(新たにソフトを買いたくない!)
○子供でもわかるような方法で!

というわけで・・・
1キロバイトの素材屋さん の「アイコンの作り方」を参考に
我が家のPCに入っているソフトと格闘した結果、
以下2つのソフトでできることがわかりました。

■Microsoft Windows(アクセサリの中)に付属されている「ペイント
■Microsoft Office(XP以前のみ)に付属されていた「Microsoft Photo Editor


ここでは私なみへいのプロフィール画像を使ってご説明します。

①まずはイラストを描くため、ペイントを起動。

paint_1.gif


②適当なキャンバスサイズにしておきます。

paint_3.gif
    
paint_4.gif


③いわゆる「ドット絵」で描いていきますので、800%の拡大表示、
  グリッドを表示にしておきます。

paint_5.gif

paint_6.gif


④実寸表示で確認しながら描くとわかりやすいです。

paint_7.gif


⑤描いていきます。
  キャンバスの大きさに合わせて描く場合は、その枠の中で修整して
  いかなければなりませんが、特に決めていない場合は②の方法で
  キャンバスを大きくするか、ポインタをドラッグして広げてください。

paint_8.gif


⑥描き終わったら、キャンバスの大きさを調整します。

paint_9.gif


⑦「背景」の部分をイラストと区別するため、イラストで使っていない色を
  背景色にしておきます。ここではグレーにしました。
  白のままでも構いませんが、イラストに白が使われているとその部分も
 透過されます。

paint_10.gif


⑧画像を「24ビット ビットマップ(.bmp)」で保存します。

paint_11.gif


⑨続いては背景の透過処理をするため、フォトエディタを起動。

paint_2.gif


⑩赤の矢印で示した所をクリックするとペンのポインタが表示。

paint_12.gif


⑪透明にしたい所をクリック。

paint_13.gif


⑫透明感を少なくしたい場合はパーセンテージを小さくします。

paint_14.gif


⑬透過された部分が(わかりにくいですが…)チェックで表示されました。

paint_15.gif


⑭必ず「PNG形式(.png)」で保存します。

paint_16.gif


イラストの代わりに色でやると、透明感のある背景素材が作れます。
ちなみに、このブログの記事やサイドバーの背景は「白・透過性60%」に
なっています。

ただし、Windows Internet Explorer 6 以前のバージョンでは
表示されないようです。

表示させたい場合にはその方法を紹介されている方がたくさん
いらっしゃいますので、申し訳ありませんが検索していただいて
ご自分に合った方法でカスタマイズしてみてくださいね。


フォトエディターがない方には・・・
N Galleryさんの 「ペイントTips」でWordを使って透過させる方法が紹介されてます。
ちょっと手間は掛かりますが、ご参考までに。(7/2追記)
nice!(4)  コメント(7) 
共通テーマ:パソコン・インターネット
※コメントを公開したくないという方は、 お手数ですが拍手のコメント欄からお願いします。 拍手いただけるととてもウレシイです。
秘密のコメントも書き込めます。
ページトップへ

nice! (So-net blogユーザー限定)

コメント

usaco

ペイントはよく利用しますが
自分でイラストを作るとは思いませんでした~。
点でイラストを作っているとは知っていましたが
ペイント内にもあったんですね~無知でした(≧∀≦)
出来たらヘッダーを作りたいですが
幅770ともなると確認しづらいですね( ≧Д≦ )
没頭しすぎて肝心なブログがアップできなくなりそうです(笑)
透過させるのはxp以前のものなんですね。。。
我がPCには見つかりませんでした。
ペイントで出来たらいいのに・・・なんて( ´艸`)

また、こちらにも遊びに来てくださいね!!!
by usaco (2010-07-01 21:27) 

なみへい

⇒ usacoさんへ

私もグリッド線が出せるなんて全然知りませんでした!
でも意外と大変[汗汗]
感覚で描いていると左右対称になってなかったり・・・。
透過ですが、実はwordで出来る方法もあります。
http://homepage3.nifty.com/graphics/tips/paint05.html
こちらも試してみましたができました♪
ご参考までに。

たくさんのnice!本当にありがとうございました[ラブラブハート]
これが最後…ですね。
もちろん!これからも遊びに行きますよ~[__パー]
これからもよろしくお願いします!!

by なみへい (2010-07-02 11:39) 

usaco

見ました♪
wordなら出来そうです♡
本当にソネではお世話になりました♡
また新たによろしくお願いしますヾ(o´∀`o)ノ

ブログに載せるかは?ですが
ちょいと暇つぶしに頑張ってみます!!!
by usaco (2010-07-02 23:28) 

なみへい

⇒ usacoさんへ

引き続きコメントありがとうございます♪
現在のデザインで十分カワイイですけど
イベントの季節が近づくと…(笑)
ぜひぜひトライしてみてくださいね~(^o^)/
by なみへい (2010-07-03 14:02) 

Viagra cialis levitra

沒有醫生的處方
how much does a cialis cost http://kawanboni.com/ Cialis 20 mg
by Viagra cialis levitra (2018-04-14 01:09) 

RogerLew

<a href="http://pinkwire.7m.pl/news/107-okisheva-vera-skachat-knigi-besplatno-bez-registracii.html#">Окишева вера скачать книги бесплатно без регистрации</a> программа для удаления флеш плеера скачать бесплатно <a href=http://arvara.7m.pl/posts/642-instrukcija-po-ohrane-truda-dlja-dezhurnyh-po-obschezhitiyu.html#>Инструкция по охране труда для дежурных по общежитию</a>
<a href="http://onglanab.7m.pl/articles/184-zolotoi-klyuchik-skachat-knigu-besplatno-fb2.html#">Золотой ключик скачать книгу бесплатно fb2</a> приложение гитара про скачать <a href=http://agviter.7m.pl/articles/283-new-headway-beginner-skachat-besplatno-pdf.html#>New headway beginner скачать бесплатно pdf</a>
http://kittbirthhofs.7m.pl/news/14-instrukcija-kak-luchshe-vyebat-babu.html
а
by RogerLew (2018-09-05 14:34) 

コメントを書く

お名前:[必須]
URL:
コメント:
画像認証:
下の画像に表示されている文字を入力してください。

この広告は前回の更新から一定期間経過したブログに表示されています。更新すると自動で解除されます。