こんにちは、イメージ担当の長谷川です。 「品質を上げれば速度が落ちるし、速度を上げれば品質が…」 デザイナーにとってはこの品質と速度が非常に悩ましいですよね。 今回は UI や Web デザインのモックアップなどを、品質を保ったままサクっとデザインするときに役立つ Fireworks の拡張機能をご紹介します。 1. 作ったデザインを崩さずにまとめて縮小できる「Smart Resize」 Web ページのデザインデータを使ってスマートフォン用など異なったサイズのデザインを作りたいときなどに最適です。 【使い方】 インストールするとコマンドに「Smart Resize」が追加されます。 サイズ調整をしたいデザインを選択して コマンド＞ Smart Resize ＞ Attach を選択します。 後は黄色のコントロールポイントでサイズを調整するだけでテキストの改行などデザインを保ったまま自動的

こんにちは、イメージ担当の長谷川です。 今回は 1px にこだわったリッチな Web や UI デザインを更に立体的で奥行きのある雰囲気にする『MAX 塗り』を取り入れたグラフィック作成手法をご紹介します。 ところで『MAX 塗り』ってご存知ですか？ガンプラなどが好きな方はピンと来たと思いますが、プラモデルなどに興味がない人は全く分かりませんね。 『MAX 塗り』とはプラモデルに立体感を出すためにエッジから中央に向かってぼかしていく、昔からある「ぼかし塗り」や「グラデーション塗り」の技法です。 この技法で塗装されたプラモデルは単純に塗装したものより格段に迫力や存在感が上がります。プロモデラーの MAX 渡辺さんが良く使うプラモデルの塗装技術として通称『MAX 塗り』と呼ばれています。 Web や UI にこの『MAX 塗り』を取り入れる方法は簡単です。 作ったボタンや背景などのグラフィック

こんにちは、デザイナーの長谷川です。 今回は僕が普段気をつけている、ちょっと意識するだけでスッキリしたデザインになるレイアウトのコツをご紹介します。 デザイナーじゃない方も、企画書や簡単な UI のモックアップ、Web や雑誌のレイアウトなどに応用できると思いますので、ぜひ参考にしていただければと思います。 1. 上下左右のマージンを均一に Web デザインや UI デザインの要素全てに対して隣り合う要素との間隔やバナー、ボタンなどの外側と内側の要素の上下左右マージンをできるだけ均一にすることで、デザインがスッキリ見えます。 2. 内側のマージンは外側のマージンより狭く レイアウトなど一番外側とコンテンツの間隔より文章のかたまりや画像同士の間隔を小さくします。基本的にコンテンツのまとまりを作るためですので、デザインによっては広く取って区分ける場合もあります。 3. 段落の下は間隔を広く開け

こんにちわ。坪内です。 突然ですが、この2年ほどで集めた素敵なネットショップを一挙公開しちゃいます。はっきり言って、この記事書いてるだけで、何度もポチリかけたくらい、素敵なアイテムがてんこ盛りです。既に知っているショップも多いと思いますが、知らないショップがあったら是非チェックしてみてください。 ちなみに、数が多すぎて説明文書くのは断念しました。カテゴリ毎には分かれているので、実際にご自身の目で確認してみることをオススメします。