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

サンプル

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

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

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

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

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

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

 ■ 立体枠のバナー作成

次は、立体枠のバナー作成です。
と言っても、込み入ったものは説明も操作も難しくなるから割と単純なものを作ってみましょう。

今回は、次のような素材を作成します。

◆立体枠の作成

まずは、「レイヤー」の「新規レイヤー」をクリックして新しいレイヤーを作成したら、パレットから「黒」を選び、「描画ツールバー」の「文字列」をクリックします。

次に、キャンパス上で文字を入れたい位置の左上隅をボタン上でクリックして、フォント名やサイズ、その他の設定を指定して「文字列」欄に文字を入力し、「OK」ボタンを押します。
この時、サイズは少し小さめがいいでしょう。

次に、新規レイヤーをさらにもう1つ作成した後、「描画ツールバー」の「選択範囲」をクリックし、文字を大きく囲むように範囲選択します。
この境界線の内側に立体枠が作成されますのでかなりの余裕を持って範囲選択してください。

そして、パレットから濃い灰色を選んだ後、コマンドメニューから「編集(E)」−「塗りつぶし(F)」をクリックします。
※この時、「描画ツールバー」の「塗りつぶし」を使用して塗りつぶしても問題ありません。

そのままコマンドメニューから「フィルタ(T)」−「4: 特殊効果」−「4: 立体枠...」をクリックし、「枠の大きさ」を指定して「OK」ボタンを押します。
今回「枠の大きさ」は「6」を指定しました。

次に、コマンドメニューの「選択範囲(S)」−「選択範囲の変更(M)」−「縮小(R)」をクリックし、縮小する大きさに先ほどの半分「3」を指定し、「OK」ボタンを押します。

そして、パレットから濃い灰色を選んだ後、コマンドメニューから「編集(E)」−「塗りつぶし(F)」をクリックします。
※この時、「描画ツールバー」の「塗りつぶし」を使用して塗りつぶしても問題ありません。
画面上は何も変わりません。

次に、コマンドメニューから「フィルタ(T)」−「4: 特殊効果」−「4: 立体枠...」を再度クリックし、「凹ませる」にチェックマークを付けたら「枠の大きさ」を指定して「OK」ボタンを押します。
今回「枠の大きさ」は「6」を指定しました。

枠の設定が問題ないようなら、「パレット」の「下のレイヤーと結合」をクリックして外側の枠と内側の枠をひとつにします。

そのままコマンドメニューの「選択範囲(S)」−「色指定(C)...」をクリックし、 「許容範囲」を「1」にして、「OK」ボタンを押し、そのままキーボードの「Delete」キーを押して完成です。
※この時、コマンドメニューの「編集(E)」−「削除(D)」をクリックしても同じです。

まずはこのままの状態を『PictBear』形式で保存しておきましょう。


◆素材の文字列に色を付ける
素材に色を付ける場合は、枠の色と文字列の色を別にすることができます。

まず、「レイヤー」で「レイヤー1」をクリックします。

次に、コマンドメニューの「選択範囲(S)」−「不透明部分の選択(T)」をクリックし、新規レイヤーを新しく1つ作成した後、塗りつぶしたい色をパレットから選択後、 コマンドメニューの「編集(E)」−「塗りつぶし(F)」をクリックします。
※この時、「描画ツールバー」の「塗りつぶし」を使用して塗りつぶしても問題ありません。

その後、キーボードから[Ctrl]+[D]を押しますと、画面表示は次のようになります。

「レイヤー」から先ほど作成した「レイヤー3」をダブルクリックします。

「レイヤー3」の「モード」を「スクリーン」に変更して「OK」ボタンを押します。


◆素材の立体枠に色を付ける
今度は、枠にの色を付けてみましょう。

まず、「レイヤー」で「レイヤー2」をクリックします。

次に、コマンドメニューの「選択範囲(S)」−「不透明部分の選択(T)」をクリックし、新規レイヤーを新しく1つ作成した後、塗りつぶしたい色をパレットから選択後、 コマンドメニューの「編集(E)」−「塗りつぶし(F)」をクリックします。
※この時、「描画ツールバー」の「塗りつぶし」を使用して塗りつぶしても問題ありません。

その後、キーボードから[Ctrl]+[D]を押しますと、画面表示は次のようになります。

「レイヤー」から先ほど作成した「レイヤー4」をダブルクリックします。

「レイヤー3」の「モード」を「スクリーン」に変更して「OK」ボタンを押します。


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

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


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