ボタン作成手順を見る - Webデザイン - CS2.jp

Fireworks ボタン作成10

1. 矩形ツールで長方形を描きます。
角丸の半径を１００、グラデーションで色を2色にし、枠線はグレーにします。

2.フィルタオプションでグレーのグロー内側、べベル内側、ドロップシャドウをかけます。

3.楕円ツールで円を描いた後、矢印を描き、楕円にエンボス(押下)にします。

4.文字を書いてドロップシャドウで馴染ませれば完成です。

Fireworks ボタン作成09

初心者向け簡単なボタン作成です。

１矩形ツールで長方形を描きます。

２べベル内側で「スムース」、「幅１０」、「コントラスト75％」、「やわらかさ3」にします。

３文字を書いて、ドロップシャドウで馴染ませて完成です。

Fireworks ボタン作成08

このボタンを作ります

１．まず、矩形ツールで長方形を書きます
今回はサイズ262pxX53px
グラデーション上部色#f29200、
下部色#fff000

にしています。
枠線はなし。

濃い色を６５％くらいの位置に指定

グラデーションツール
矢印がでている状態で、SHIFTキーを押しながらグラデーションをかけると、45度ずつ移動し、垂直になります。

２．プロパティインスペクタの中の「角丸の半径」を100、「フィルタ」でべベル外側、スムース、幅２、柔らかさ２、にします。

３. 次にボタン上部の「つや」部分を作ります。
別の場所で上記と同じ角丸長方形を作ります。さきほど作ったものより上下左右１ピクセル小さく作ります。（ここでは260pxX51px）色は白、透明度７０％

4. その上に楕円ツールで長方形より大きい楕円を作成します。
同じく色は白、透明度７０％

5. 二つを中央寄せにします。

2つ同時に選択して、Ctrl＋Alt＋2（テンキーなど）で左右中央揃えができます。
Ctrl＋Alt＋5で上下中央揃えができます。

6. 2つのパスを結合
メニューの「修正」から「パスの結合」にある「交差」を選択します。

パスとパスの交差している部分が残ります。

7. 作ったつや部分を先ほどのボタンに乗せます。
※ここではわかりやすいように枠線は描いています。

8. 文字を書き、背景より暗いドロップシャドウを入れて文字をはっきりさせます。

余計な枠線などを消して完成です。

Fireworks ボタン作成07

１．矩形ツールで矩形を作ります。
グラデーションにし、「フィルタ」でべベル外側、幅４、コントラスト75、やわらかさ３にします。

２．文字を書きます

３．文字に背景より濃い色のドロップシャドウを入れます。

完成です。

Fireworks ボタン作成06

矩形ツールで長方形を作成します。

色はグラデーションにせず、「基本」にします。

フィルタの中で「グロー内側」を選択し、幅４、透明度65％、やわらかさ４にします。

長方形上部に半分くらいの長方形を作成します。角丸の半径は80、エッジはぼかすようにしましょう。

ハイライトが見えるように、上部に楕円ツールで円を描き、「グラデーション」、「楕円」、「エッジをぼかす」にします。

上部に矩形ツールで高さ3くらいの矩形を描きます。

文字を書きます。

スライスして完成です。

Fireworks ボタン作成05

1.矩形ツールで好みの色とサイズで長方形を作ります。

2.プロパティインスペクタの角丸の半径を合わせます。(ここでは77にしています)

3.「フィルタ」の「べベル内側」に幅2、やわらかさ2、コントラスト100、「隆起」に設定します。

4.文字を書きます。

5.文字は見やすいように背景より暗い色のドロップシャドウをかけます。
その時も見やすいように、幅2、やわらかさ2、コントラスト100、「隆起」に設定しましょう。

6.最後に「フィルタ」中の「べベル外側」で「スムーズ」、幅2、色は一段濃い色、やわらかさ2、コントラスト100、「反転」に設定します。

完成です。

Fireworks ボタン作成04

1、矩形ツールで長方形を描きます。

2.プロパティインスペクタの角丸の半径を50、塗りはグラデーション、枠線なしにします。

3.プロパティインスペクタの中の「フィルタ」で「べベル内側」、「フラット」、幅2、コントラスト100,やわらかさ1にします。

4.文字を書いて完成です。
ボタン一覧へ

Fireworks ボタン作成03

1.矩形ツールで長方形を描きます。プロパティインスペクタの角丸の半径は100、塗りはグラデーション、枠線は1にしましょう。

2.フィルタの中で、「べベル内側」、「スムーズ」、「幅２」、「コントラスト100」、「やわらかさ2」にします。

3.文字を書きます

4.パスで右に三角形を作りましょう

ボタン一覧へ

Fireworks ボタン作成02

矩形ツールで長方形にします。

塗りはグラデーションにして、枠の線は太さ１にします。

プロパティインスペクタの角丸の半径を１００％にします。

「フィルタ」の中の「べベル内側」、「スムーズ」、幅4、コントラスト１００％、やわらかさ２、「隆起」にします。

文字を書きます。

文字にはドロップシャドウ、幅2、コントラスト１００％、やわらかさ２にします。

完成です。

ボタン一覧へ

Fireworks ボタン作成01

作成手順
1.矩形ツールで好みの色とサイズで長方形を作ります。
線の枠色は一段濃い色に設定しましょう。

2.プロパティインスペクタの角丸の半径を合わせます。

3.「フィルタ」の「べベル内側」に「フラット」、幅2、やわらかさ2、コントラスト100、「ハイライト」に設定します。

4.文字を書きます。

完成です。

ボタン一覧を見る

料金について

９点パック

≫ 料金案内
≫ パーツ詳細はこちら

４点パック

≫ 料金案内
≫ パーツ詳細はこちら

トップページ全部パック

≫ 料金案内
≫ パーツ詳細はこちら

成約率の高いホームページをデザイン致します！
最高のクオリティで納得！満足！していただけるようご要望にお応えいたします。

お問い合わせ

≫ お問い合わせはこちら（24時間受付）

インプルーブデザインワークス
住所：〒861-8010 熊本県熊本市上南部3丁目32-10
代表：和田真徳
info@design-improve.com
電話：096-288-3124