超初心者のホームページ作成 by atom
プルダウンメニュー左端 トップ はじめに/バナー 新着情報 HP作成 サンプル 関連サイト フリー素材 掲示板 その他 Google 余白 プルダウンメニュー右端
 《WEB素材の作成》
【メニュー】

サンプル

前置き
PictBearの入手
基本操作
画像の選択
画像の切り抜き
画像の保存
正確な画像の描画

浮き出しボタンの作成
影付きボタンの作成
ボタンの文字色変更
ボタンの表示色変更
ボタンの影の色変更
影つき文字の作成
縁取り文字の作成1
縁取り文字の作成2
縁取り文字に影を付ける
囲い枠のバナー作成
立体枠のバナー作成
切り抜きボタンの作成

円柱(円筒形)の作成
球体(ボール)の作成
円柱(円筒形)の影付け1
球体(ボール)の影付け1
円柱(円筒形)の影付け2
球体(ボール)の影付け2

クリスタルボールの作成
クリスタルボールの作成2

写真の型抜き
写真を浮き上がらせる
写真に影をつける
写真の縁をぼかす

※一度説明した内容は後になるほど簡略して解説されてる場合がありますので、出来る限り順番に読んでくださいね。

 ■ 縁取り文字の作成1

では、次に、次のような文字の周りを縁取った素材を作成してみましょう。

ただ、ここで解説する方法の縁取り文字は漢字のような細い線がある文字には向きません。
漢字などの場合は、その文字をかなり大きくしないと内側がつぶれてしまいきれいに見えないのです。
ですから、今回は単純なアルファベットを使用します。

◆浮き出した立体影付き文字
まず、新しいキャンバスを表示したら「レイヤー」の「新規レイヤー」をクリックします。

そして、パレットからどれかの色をクリックした後、「描画ツールバー」の「文字列」をクリックします。

次に、文字を入れたい位置の左上隅をボタン上でクリックして、フォント名やサイズ、その他の設定を指定して「文字列」欄に文字を入力し、「OK」ボタンを押します。

そして、そのままコマンドメニューの「選択範囲(S)」−「色指定(C)...」をクリックし、 「許容範囲」は「10」ぐらいを指定し、「OK」ボタンを押します。
すると次のように表示されます。

次に、 パレットから好きな色を選択し(今回は「黒」を選びました。)、ブラシの中の左端のブラシをクリックします。

そのまま、新しく新規レイヤーを1つ作成し、コマンドメニューの「編集(E)」−「境界線の描画(B)」をクリックします。

※この時、キーボードの「Insert」キーを押しても同じ処理が行えます。

すると、次のような表示になります。

次に、コマンドメニューの「選択範囲(S)」−「色指定(C)...」をクリックし、 「許容範囲」は「10」ぐらいを指定し、「OK」ボタンを押し、そのままコマンドメニューの 「選択範囲(S)」−「境界のぼかし(B)...」をクリックします。
すると次のような画面が表示されます。

このとき、ぼかしの設定値に「1」を指定し、「OK」ボタンを押しますと、キャンパスは次のように表示されます。

そのまま、新しく新規レイヤーを1つ作成し、コマンドメニューの「編集(E)」−「塗りつぶし(F)」をクリックします。

※この時、「描画ツールバー」の「塗りつぶし」を使用して塗りつぶしても問題ありません。

キャンパスは次のようになり完成です。

◆背景色の指定とトリミング
上記の素材の背景色を指定し、必要な大きさにトリミングしましょう。

まずは、まず、キーボードの[Ctrl]+[D]を押して選択範囲を解除した後、 「レイヤー」の「背景」をクリックします。

そして、「パレット」から好きな色を選択し、「描画ツールバー」の「塗りつぶし」をクリックしてキャンパスの白い部分をクリックして背景を塗りつぶします。

次に、「描画ツールバー」の「選択範囲」をクリックして、必要な部分を囲みます。

そして、コマンドメニューの「イメージ(I)」−「トリミング(T)」を行って出来上がりです。


 <用語の説明> 
トリミング 浮き出しボタンの作成」を参照してください。

■ 有料デザインテンプレート


Home  ↑ページトップ
page update:2007/11/12
Copyright (c) 2000-2004, All Rights Reserved & Produced by atom
技術提供:株式会社ピーオーピー
SEO対策 & ツール