第18話 Fireworks編3:マスク処理でお手軽にロマンチック画像を!
 
今回は、マスクという技術を使って手軽に、
画像の周りをぼかすテクニックを紹介しようかと思います。
どういうのかといいますと



このように画像を簡単にぼかしてあげることができます。
これに筆記体で文字入れとか入れるとさらに優しい雰囲気の
感じになるかもしれませんよね。

さて、これらの処理をするのは一件難しそうですが実は
慣れれば30秒でできてしまう簡単な処理なのです。
その方法をご紹介いたします。
(ちなみに編集に使用している写真は安田が長崎のグラバー亭で実際に
 自分で撮った写真ですので著作権上、HPに掲載しても問題ありません(笑))

(1)「ファイル」→「開く」→画像ファイルを選択

画像を開きます。

 

これで加工するための画像を開くことができました。

次に

(2)「楕円ツール」→黒い楕円を描く

画像の上に真っ黒の楕円を描きます。

 

画面に「ツールバー」が表示されているでしょうか?
もし表示されていなかったら「ウィンドウ」→「ツール」で表示させましょう。
ツールの中にある「楕円ツール」で真っ黒な円を描きます。
このときにレイヤー(「ウィンドウ」→「レイヤー」)を表示させますと
鉛筆のマークがあるかと思いますが、その鉛筆のマークを
バックグラウンドのところにします。

すると、「パス」というものがレイヤーで追加されたかと思います。
画面は以下のようになるはずですね。



(3)画像と黒の楕円を両方選択します。

選択の仕方は、(2)で黒の楕円を描きましたので
レイヤーでは、黒い楕円(パス)というところが選択されていると思いますが
シフト(Sihft)キーを押しながら、(1)で開いた画像をクリックすると
両方の画像((1)と(2))が両方選択されます。

(4)マスクとして統合

「修正」→「マスク」→「マスクとしてグループ化」

マスクということを説明するとちょっと難しい話になるのですが
そのグラフィック部分だけを黒く塗りつぶしたグラフィックのことでして
このマスクを使って特殊な重ね合わせ方式による描画をすることで余白が取り除ける
のです。

上記のようにすると、黒い楕円のところが抜き出されたかと思います。
これがマスクです。


(5)周辺をぼかす

レイヤーの中の楕円をクリックしたあと
塗り→エッジ→「アンチエアリスをオン」から「エッジをぼかす」に変更→値を10から30に変更


すると以下のような画像ができあがります。


たったの5動作でこのような画像ができてしまうのです。
Fireworksが便利だということがわかっていただけたでしょうか。



第19話 Flash編1:アニメーションのHPを作ってみよう!」
第17話 「Fireworks編2:3分でできるバナー作成」へ戻ります
目次に戻ります
ホームページ作成講座等あるパステル・ミディリンのTopに戻ります