Fireworksだけで綺麗な切り抜きをする場合の設定と方法

powered by hm solution

お問い合わせ:0120-290-727
受付時間:10:00~18:00(土日祝は除く)

お問い合わせ

Fireworksだけで綺麗な切り抜きをする場合の設定と方法

Photoshopが好きです。でもFireworksも好きです。

切り抜きを行うツールとしてphotoshopを使われている方は多いと思います。細かい、複雑な切抜きはやはりphotoshopの方が便利だったりしますが、
Web制作において忘れてはいけないFireworksでもかんたんに綺麗な切抜きができます。

今回は複雑な形と思われる
・水の切り抜き
・炎の切り抜き
の方法について記述したいと思います。

設定を変更しておく

編集→環境設定→編集→選択精度
01.fw
単純に高いほうが精度がいいです。
ここでは最高の10に設定。

“自動選択ツール”と”選択範囲をパスに変換”を使う

02.fw
自動選択ツール

Wで切り取る部分を選択

プロパティはこちら

03a.fw
“アンチエイリアスをオン”
許容量は切り抜きたい境目の色の差があいまいな場合は数値を低くして精度を高めたりして調整してください。

選択部分を削除

選択された切り取る部分を削除します。

選択してDelete

03.fw

さらに綺麗にしていく

素材によってはこれだけでも結構綺麗に切り抜けるんですが、
04.fw
よく見ると細かいところが汚かったり・・・
こんな場合は

Ctrl + レイヤーをクリック

レイヤーの不透明部分が選択されます。
05.fw
選択→選択範囲をパスに変換 でパスを作成。
07.fw
パスが作成されました。

06.fw

パスが作成できたら

Ctrl + Alt + Vでパスをマスクとしてペースト

08.fw
細かいところも綺麗になりました。

09.fw
もしこれでも綺麗になりきらない場合はダイレクト選択ツールAで部分的にパスを調整してみてください。

以上自動選択ツールを使った水の切抜き方法でした。

お次は”炎の切り抜き方法”

アルファチャンネル機能を使う

下準備としてレイヤー複製

Ctrl + Shift + Dでレイヤーを複製

11.fw
フィルタ→その他→アルファチャンネルに変換
(写真の背景が真っ白じゃない場合は事前に背景が白になるまで調整をしておく必要があります。)

アルファチャンネルに変換した画像

12.fw
アルファチャンネルに変換するとこうなります。

このレイヤーにもうひとつフィルターをかけます。

13.fw
フィルター→カラーを調整→反転

ビットマップに変換

14.fw

Ctrl + Alt ShiftZでビットマップに変換

フィルターをかけたレイヤーを切り取り

Ctrl + Xで切り取り

マスクとしてペースト

15.fw

Ctrl + Alt + Vでマスクとしてペースト

仕上げ

明度が全然薄いのでレイヤー複製で調整。

Ctrl + Shift+Dでレイヤーの複製

違和感ない程度に何度か複製してください。
16.fw
左に元画像を置いて比較しながら調整しました。

完成

17.fw

綺麗に切り抜きができました。
これで背景色が変わっても大丈夫ですね。

この機能を使いこなせば割とどんな画像もある程度違和感なく切り取りできます。
みなさんも試してみてください。

さきボー
デザイナーの寺本です。通称:さきボー/イエロー
美しいもの・かわいいものが大好きです。心が奪われます。
完璧な美しさの中に秘めた魅力的な欠点があればもっと心が奪われます。
そんな”人の心を灯せるデザイナー”を目指してます。
powered by hm solution
お問い合わせ
お問い合わせ
gmt
© hm solution, Ltd.