みなさんはデザインをするとき、どのソフトを使っていますか?
きっと多くの方はPhotoshopやIllustratorを使っていると思います。
私もEC studioに入るまではそうでした。
しかし、今は違います。
PhotoshopやIllustratorではなく、Fireworksをメインに使っています。
EC studioのサイトページは主にFireworksでつくられているため
始めはPhotoshopの方が使いやすいな」と思いながら、
すすめられるままFireworksを使っていました。
でも、1ヵ月もしないうちにPhotoshop派からFireworks派に乗り換えました。
今ではFireworksがないとWebデザインの作業が進まないほどです。
今日はそんなFireworksの良さをご紹介したいと思います。
【10月18日 ポイントを2つ追加しました。】
FireworksがWebデザインに向いている6つのポイント
1.簡単に複数のレイヤーの移動できる。
Photoshopのようにレイヤーウィンドウから画像を選択しなくても
動かしたい画像を直接クリックすることで移動できます。
2.オブジェクトの種類が多い
星形、矢印、ドーナツ形や多角形など
複雑なシェープ形状のオブジェクトもすぐに出来ます。
また数値入力で形を変形でるので、サイズの微調整も楽に出来ます。
3.簡単にオブジェクトの見栄えを変更
ストライプやグリット線、和紙など様々なテクスチャを選ぶだけで
オブジェクトの見栄えがパッと変わります。テクスチャの種類も豊富です。
4.画像の切り出し
多角形のスライスが自動的に挿入されるので
選択したオブジェクトのサイズぴったりに画像が切り出せます。
作業も動作チェックもすばやく出来るので
WebボタンをつくるならFireworksのライブラリ機能はおすすめです。
5.Webボタンを簡単に作成
【サンプル】
↑ボタンにマウスをのせると画像が変わります。
このようなボタンをつくるためには
・最初に表示されるボタン ・マウスをのせた時のボタン
の２つのボタン画像をつくる必要があります。
そんなときに役立つのがFireworksのライブラリ機能です。
まず、最初に表示されるボタンをつくります。
そしてボタン画像を全て選択し
右クリック→「シンボル化に変換」で「ボタン」にチェックをいれ「OK」をクリックします。
するとタブが増え、最大4段階の変化が起こるボタンをつくることができます。
「アップ」…最初に表示されるボタン
「オーバー」…マウスをのせたときのボタン
「ダウン」…クリックしたときのボタン
「オーバーダウン」…クリックしたあとのボタン
「ヒット」…リンクの範囲
「アップ」が完成したあとは「オーバー」のタグへ移動します。
そして、そのままでは白紙の状態なのでプロパティ右側にある
「アップのグラフィックをコピー」をクリックします。
すると「アップ」タブにあるボタン画像が表示されます。
そして「オーバー」タグにある画像に「べベルの内側」など効果をつけ
マウスオーバーしたときの動きをつけましょう。
また画像全体を中心から右下へ1pxずつ移動させるとボタンが
へこんだようにみせることができます。
「ダウン」や「オーバーダウン」も同様に画像をつくっていきます。
それぞれのボタンが完成した後は右下にある終了をクリックします。
画像を保存するときは
「ファイル」→「書き出し」を選択し書き出しの種類を「イメージのみ」にします。
すると「アップ」だけではなく、「オーバー」や「ダウン」など
それぞれのボタンをまとめて書き出してくれます。
ボタン一つずつ書き出す手間が省けるので、とても便利です。
6.ボタンの動作確認をIEでチェック
5.でつくった画像をIEでプレビューし、実際にマウスをのせたときの動きを
チェックすることができます。
「F12」をクリックするとIEが立ち上がり実際にマウスオーバーをすると
画像が変わるようになります。
通常、ブラウザで動作確認をする場合それぞれの画像を書き出し
Javascriptなどマウスオーバーでボタン画像が変わるようソースを組む必要があります。
Fireworksならそんな手間もなく「F12」ボタンを押すだけで動作チェックができます。
作業も動作チェックもすばやく出来るので
ボタンをつくるならFireworksのライブラリ機能はおすすめです。
——————————————————————————————————
PhotoshopとIllustratorがあれば大体の画像がつくれるため
「わざわざFireworksを買わなくても…。」
と、Fireworksを使わないWeb担当者の方も多いと思います。
(私も以前はそうでした。)
でも一度、Fireworksを試してみてください。
逆にFireworksが手放せなくなりますよ。
関連した記事：
この記事にTwitterでコメント■ IT経営実践会
EC studio が長年培ってきた全てのIT活用ノウハウをマニュアルで提供！
国内初のGoogle Appsを利用した会員サービスです。
会員専用の掲示板による交流や
定期的に勉強会も実施しています。
中小企業の利益を増やす、IT経営実践会
この記事へのコメント (0)
コメントはまだありません。
ページの先頭に戻る
コメントを投稿