切り抜きを行うツールとしてphotoshopを使われている方は多いと思います。細かい、複雑な切抜きはやはりphotoshopの方が便利だったりしますが、
Web制作において忘れてはいけないFireworksでもかんたんに綺麗な切抜きができます。
今回は複雑な形と思われる
・水の切り抜き
・炎の切り抜き
の方法について記述したいと思います。
設定を変更しておく
編集→環境設定→編集→選択精度
単純に高いほうが精度がいいです。
ここでは最高の10に設定。
“自動選択ツール”と”選択範囲をパスに変換”を使う
自動選択ツール
Wで切り取る部分を選択
プロパティはこちら
“アンチエイリアスをオン”
許容量は切り抜きたい境目の色の差があいまいな場合は数値を低くして精度を高めたりして調整してください。
選択部分を削除
選択された切り取る部分を削除します。
選択してDelete
さらに綺麗にしていく
素材によってはこれだけでも結構綺麗に切り抜けるんですが、
よく見ると細かいところが汚かったり・・・
こんな場合は
Ctrl + レイヤーをクリック
レイヤーの不透明部分が選択されます。
選択→選択範囲をパスに変換 でパスを作成。
パスが作成されました。

パスが作成できたら
Ctrl + Alt + Vでパスをマスクとしてペースト
もしこれでも綺麗になりきらない場合はダイレクト選択ツールAで部分的にパスを調整してみてください。
以上自動選択ツールを使った水の切抜き方法でした。
お次は”炎の切り抜き方法”
アルファチャンネル機能を使う
下準備としてレイヤー複製
Ctrl + Shift + Dでレイヤーを複製
フィルタ→その他→アルファチャンネルに変換
(写真の背景が真っ白じゃない場合は事前に背景が白になるまで調整をしておく必要があります。)
アルファチャンネルに変換した画像
アルファチャンネルに変換するとこうなります。
このレイヤーにもうひとつフィルターをかけます。
フィルター→カラーを調整→反転
ビットマップに変換
Ctrl + Alt ShiftZでビットマップに変換
フィルターをかけたレイヤーを切り取り
Ctrl + Xで切り取り
マスクとしてペースト
Ctrl + Alt + Vでマスクとしてペースト
仕上げ
明度が全然薄いのでレイヤー複製で調整。
Ctrl + Shift+Dでレイヤーの複製
違和感ない程度に何度か複製してください。
左に元画像を置いて比較しながら調整しました。
完成

綺麗に切り抜きができました。
これで背景色が変わっても大丈夫ですね。
この機能を使いこなせば割とどんな画像もある程度違和感なく切り取りできます。
みなさんも試してみてください。