こんにちは、イメージ担当の長谷川です。
今回は Apple がデザインしている iCloud アイコンのような美しい金属調の質感を Fireworks で表現してみました。
アレンジ次第で水平のエッチングやブラスト加工のようなイメージも簡単に作ることができます。
ぜひ Web や UI デザインの参考にしていただければと思います。
1. ベースのテクスチャを設定する
まずグラデーションの設定をします。
長方形ツールで作成するボタンなどのサイズより少し大きいサイズの四角を描き、グラデーションの塗りを円錐にします。
以下のように白とグレーを交互に設定します。右端と左端を同じ色にしないとグラデーションに線が出来てしまいますのでご注意ください。
ここでは濃いグレーを #666666、両端の薄いグレーを #999999 に設定しています。
次にノイズを適用量：10で追加します。これが同心円状のヘアラインの元になります。
そしてぼかし（放射状）を以下のように設定します。
ベースが完成しました。角丸や円形など作成したいオブジェクトの形でマスクをします。
2. ボタン風に加工する
ここで以下のようにハイライトとドロップシャドウの設定をします。
外側のラインはオブジェクトをクッキリと際立たせる為に入れています。
ここまで来たらほぼ完成ですね！
ボタンの上に任意のマークやロゴ等を配置します。ここでは、フェンリルのロゴマークが刻印されて黒く着色されたようになる設定にしています。
3. アレンジする
最初のステップで作ったベースになるテクスチャの設定を変更することで様々な金属表現ができます。
アレンジ次第で Web や UI デザインに幅広く応用できそうです。
—
フェンリルのオフィシャル Twitter アカウントでは、フェンリルプロダクトの最新情報などをつぶやいています。よろしければフォローしてください！
関連記事
