Fireworksデフォルト以外のテクスチャを使ってみる

takako — Fri, 29 May 2009 16:18:46 +0000

いつもWebデザインのカンプ作成にはFireworksを使っていますが、プリセットされているテクスチャは、バージョン2～3ぐらいの時からあまり変わっていないような気がします。

もちろん、使い方によっては、”Fireworksで点線をつくる – ProjectDD Blog”のように非常に便利なものではあるのですが、サイト全体の背景画像パターンを作ったりするのには、少々物足りないですよね。

と思っていたら、同じくProjectDD Blogの管理者の方が、FWテクスチャ専用サイトを公開されました。

こちらのサイトでございます。
現在、300種類のテクスチャが配布されていて、これから随時増やしていくとのことです。すぐ使ってみたいものもあるし、自分がテクスチャを作る時の参考にもなりそうです。
ありがたいですね。

その他、FWのテクスチャ配布ページで私が調べていたページは、

このあたりですね。
FWの使い方について、詳しく書いているサイトはまだ少ないので、私も自分の持っているtipsなんかを公開していかなくてはと思っているところです。

ダウンロードしたのを参考に、自分のテクスチャ作りにも挑戦してみたいですね。

Fireworksで写真をマスクする方法

takako — Fri, 20 Feb 2009 15:36:19 +0000

以前、メインのブログに”Fireworksでよく使う小技 | 19740308(TM)”という記事を書いたのですが、イラレ・フォトショに比べてFWはチュートリアルや小技があまり見つからないなぁと思ったので、よく質問されることを書いておこうと思います。

私はWebのカンプはFWで作るのですが、「写真の切り抜き（マスク）もFWの中でやるよ～」というと、FW使わない人からは結構驚かれます。いや、ちゃんと出来ますよ！

これは、うちの猫の写真ですね。ひどい格好ですが気にしない！

これを、ちょっと違う形に切り抜いてみます。

写真の上に載せた、白い楕円の形に切り抜いてみますね。
レイヤーではこういう状態です。

切り抜きたい形のオブジェクトを作成して、ビットマップの上に配置します。
次に、両方を選択した状態のまま、メニューの「修正」→「マスク」→「マスクとしてグループ化」を選択します。

すると、上に載せた楕円系の形に写真がマスクされます。これだけなんですが、「マスクとしてグループ化」をよく知らない人が多いみたいですね。

この、上に載せるオブジェクに、あらかじめ「エッジをぼかす」を適用しておくと、

こういう効果をつけることができます。
この方法、もう少し詳細な解説を書きたいなと思っているので、今日は（眠たいし）ざっくり基本の手順だけ書いておきます。
応用方法としては、マスクする形のオブジェクトにグラデーションをかけたり、エッジをぼかす、線をつけておくなどをよく使います。

こ、今度はもうちょっと丁寧に書きます‥‥。