スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
RSSフィード twitter Google Bookmarks スポンサーサイトをはてなブックマークに登録 はてなブックマーク
タグ /

GIMPでWEB2.0風バッジを作る

フリーソフトのGIMPでこのようなWEB2.0風バッジ素材を作成する方法をご紹介します。
GIMP
「ファイル」→「新しい画像を作成(幅:600px 高さ:400px)」 で新規キャンバスを開きます。

シェイプエディタ


メニューから「フィルタ」→「下塗り」→「シェイプ(Gfig)」で下図にある「シェイプエディタ」という画面を開いてください。

GIMP
・ツール:星の作成
・サイズ:32
・ストローク描画:オフ
・塗りつぶし:色で塗りつぶす(黒)

設定後、「編集」→「設定」を選択する。設定の画面では「アンチエイジング」にチェックを入れておく。

GIMP
↑キャンバス上でこのように描く。
描いたら、上図の赤い四角で囲った部分「1つのポイントを移動」し、
↓下図のように移動させ(赤丸で囲った点まで移動)、完了したら「閉じる」をクリック。
GIMP

縁取り


・メニューから「レイヤー」→「透明部分」→「不透明部分を選択範囲に」
・メニューから「選択」→「選択範囲を縮小」→「3px」を縮小する。(下図参照)
GIMP

・メニューから「選択」→「選択範囲を反転」
・メニューから「レイヤー」→「透明部分」→「選択範囲との交わり」
・新規レイヤー(透明)を追加し、名前を「縁」とします。
・メニューから「編集」→「背景色(白)で塗りつぶし」
・「縁」レイヤーの不透明度を80%にします↓
GIMP

このようになります。↓次はWEB2.0風の配色を施していきます。
GIMP

グラデーション


レイヤーの選択状態を「GFig」レイヤーに戻します。
ツールボックス中にある【ブレンド】ツールを選択し、マウスをドラッグしてグラデーションを描きます。
GIMP

この時、WEB2.0風のグラデーションを施しますと、WEB2.0風バッジの出来上がりということになります。グラデーションのテンプレートはこちらのサイトからGIMPにインストールできます。

130 Ultimate Web 2.0 Gradients for Gimp
Web 2.0 Gradients for Gimp

文字を入れて完成です。
GIMP



GIMPインストール方法
181個のGIMPグラデーション
0円クリエイター無料版
関連記事

RSSフィード twitter Google Bookmarks GIMPでWEB2.0風バッジを作るをはてなブックマークに登録 はてなブックマーク
タグ / GIMP
コメント一覧
コメントを残す


管理者にだけ表示を許可する

 | BLOG TOP | 

人気記事

スポンサードリンク

新着記事

プロフィール

日刊ウェブログ式を運営するナカタと申します。まだ開設して日も浅い拙いブログですが、どうぞよろしくお願いします。

リンク

LOOMICDESIGN

タグクラウド

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