こんにちは、イメージ担当の長谷川です。
「品質を上げれば速度が落ちるし、速度を上げれば品質が…」
デザイナーにとってはこの品質と速度が非常に悩ましいですよね。
今回は UI や Web デザインのモックアップなどを、品質を保ったままサクっとデザインするときに役立つ Fireworks の拡張機能をご紹介します。
1. 作ったデザインを崩さずにまとめて縮小できる「Smart Resize」
Web ページのデザインデータを使ってスマートフォン用など異なったサイズのデザインを作りたいときなどに最適です。
【使い方】
インストールするとコマンドに「Smart Resize」が追加されます。
サイズ調整をしたいデザインを選択して コマンド＞ Smart Resize ＞ Attach を選択します。
後は黄色のコントロールポイントでサイズを調整するだけでテキストの改行などデザインを保ったまま自動的に調整してくれます。
極端なサイズ変更などをするとさすがに崩れますが、この拡張機能を使ってみるとちょっと感動します。
ダウンロードサイトはこちら
http://johndunning.com/fireworks/about/SmartResize
2. ボタンなどの背景を自動的に作ってくれる「Fill With Background」
ボタン画像のテキストだけをさっと消してくれます。
【使い方】
インストールするとコマンドの Objects に追加されます。
適用したいボタンの文字の部分などを長方形選択ツールで選択し、コマンド ＞ Objects ＞ Fill With Background を選択するだけです。
Cut From BackGround を選択すると、背景を自動的に作った上で選択範囲の部分をオブジェクト化してくれます。
編集可能なスクロールバーなども速攻で作れます。
ダウンロードサイトはこちら
http://johndunning.com/fireworks/about/FillWithBackground
3. CMS 構築などに超便利なアタリ枠画像用ツール「Placeholder」
この拡張機能は、画像サイズ、位置、メモ付きのアタリ画像を簡単に作れる拡張機能です。
画像サイズを変更すると画像サイズの文字も自動的に変更されます。
後から「これ何 Pixel？」がなくなります。
【使い方】
インストールすると オートシェイプツールから Placeholder が選べるようになります。画面をドラッグするとアタリ画像を描くことができます。
黄色いコントロールポイントでサイズを調整できます。画像サイズを調整するとラベルの数字も自動的に変わります。
ダウンロードサイトはこちら
http://johndunning.com/fireworks/about/Placeholder
4. 変倍してしまった、角丸オブジェクトをもとに戻す「Fix Rounded Rect Corners」
角丸のオブジェクトを知らない間にサイズ変更して後で元に戻せず、作り直したりしていませんか？
そんな時におすすめの拡張機能です。
【使い方】
インストール後、変倍してしまったオブジェクトを選択し、コマンド ＞ Objects ＞ Fix Rounded Rect Corners を選択するだけ。
縦横に伸びてしまった角丸が元に戻ります。
※グループ解除したオブジェクトには適用できません。
ダウンロードサイトはこちら
http://johndunning.com/fireworks/about/FixRoundRect
今回ご紹介した拡張機能は SnapCrab for Windows と併せて使っていただくとより一層作業効率が上がります。この機会にぜひご利用ください。
—
フェンリルのオフィシャル Twitter アカウントでは、フェンリルプロダクトの最新情報などをつぶやいています。よろしければフォローしてください！
関連記事
