FireworksでWeb2.0デザインしてみる – Part.1

先日、勢いで Macromedia Fireworks 8 を購入しました。私はどうも Photoshop や Illustrator が苦手、というか使いこなせません。メニューが豊富すぎてわけがわかんない。が、Fireworks はバージョン2 ぐらいから会社で使っていて、相性がいいのです。

で、せっかく買ったので、Web2.0っぽいデザインにチャレンジしてみました。まずは第一弾。「mirror reflection（反射）」です。

こういうやつ。

反射させたいオブジェクト（A）をコピー＆ペーストで複製（B）します。
複製したオブジェクト（B）を選択して、[修正]-[変形]-[縦反転]で反転させます。
反転させたオブジェクト（B）を元のオブジェクト（A）の下に移動させます。
反転させたオブジェクト（B）を選択して、[コマンド]-[クリエイティブ]-[イメージのフェード]を選び、メニューから右上のボタンを選択して、[OK]を押します。
プロパティパネルの「透明度」を適当な値に変えます。
完成！けっこうカンタンでしょ？

なお、Reflection.js というJavaScriptのライブラリを使えば、同じようなことができるそうです。すげー！

About this entry

オススメ

価格: ￥ 2,499

Amazon オススメ度： 2.5

[...] 参考にサイト http://jmblog.jp/archives/46 [...]

[...] jmblog.jp – FireworksでWeb2.0デザインしてみる – Part.1 [...]

[...] http://jmblog.jp/archives/46 Tags: Fireworks, チュートリアル [...]

yoshi 10.19.06 / 8pm

「mirror reflection（反射）」を参考にしてサイトのトップを作ってみました。自分の場合はphtotshop+イラレですが。記事大変参考になりました。

モカ 03.10.08 / 9am

　はじめまして！
　私もFireworks大好きです。
　こんなに簡単に鏡面反射イメージが出来るとは知りませんでした。
　有り難うございます。
　活用させてもらいます。

コメントはこちらから

XHTML: 次のタグが使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>
Gravatar に対応しています。

リンク