ズルいデザイン（4）：ズルいデザインテクニックを生かして作る、汎用性のあるズルいボタンデザイン (1/3) - ＠IT

2013/09/12 773 users ズルいデザインテクニック 汎用性 集大成 スライド 改定

さて今回は、ズルいデザインテクニックの集大成ともいえる「ズルいボタン」です。これまでの連載で取り上げた数々のズルいデザインテクニック、「ズルいテキストシャドウ」「ズルいグラデーション」「ズルい角丸」、そして前回解説した「ズルいボックスシャドウ」を用いたズルいボタンの作り方を解説します。 今回のズルいボタンに関しては、以前にズルいデザインテクニックのスライドで紹介したものから大幅に改定を加えて、より... 続きを読む

ズルいデザイン（3）：box-shadowで表現する、「セミフラット」なズルいデザインテクニック (1/2) - ＠IT

2013/08/21 568 users box-shadow 描画 皮切り 組み合わせ トレンド

box-shadowを活用した各種ボックス表現の作り方を紹介。フラットデザインの中でも違和感なく使える「やりすぎていない立体感」とは？ 世の中、フラットデザイン流行りですが…… iOS 7がフラットデザインを採用したのを皮切りに、Webデザインのトレンドがフラットデザイン一色になってきましたが、立体感を完全に排した色面と空間、シンプルな描画の組み合わせだけのデザイン表現は、ある種ごまかしが効かず、... 続きを読む

ズルいデザイン（3）：box-shadowで表現する、「セミフラット」なズルいデザインテクニック (1/2) - ＠IT

2013/08/21 568 users box-shadow ズルいデザインテクニック

世の中、フラットデザイン流行りですが…… iOS 7がフラットデザインを採用したのを皮切りに、Webデザインのトレンドがフラットデザイン一色になってきましたが、立体感を完全に排した色面と空間、シンプルな描画の組み合わせだけのデザイン表現は、ある種ごまかしが効かず、また適切な利用方法を喚起させるようなUIも表現がなかなか難しいものです。 例えば、「ボタンは押せるもの」であると表現するための「押したく... 続きを読む

ズルいデザイン（2）：SassやCompassを使って、ズルいデザインテクニック (1/2) - ＠IT

2013/02/27 272 users Sass Compass グラデーション 個々 角丸

SassやCompassを使って、少ない手間でちょっといい感じに見せる小ズルいTipsを紹介。グラデーション、角丸のお手軽かつ効果的な使い方とは？ シリーズ第2回、前回に続き、今回もSassやCompassを使って、少ない手間でちょっといい感じに見せる小ズルいTipsを紹介します。 今回は、グラデーション、角丸のお手軽かつ効果的な使い方について解説します。 （注）このページでは、個々のデザイン要素... 続きを読む

ズルいデザイン（1）：少ない手間と知識でそれなりに見せる、ズルいデザインテクニック (1/2) - ＠IT

2012/12/05 1663 users ズルいデザインテクニック 少ない手間 知識 プログラマ 個々

Webプログラマ、Webエンジニアの皆さんが、個人で作るWebサービスやハッカソンなどで、短期間に集中してサービス開発してローンチしたいときに、もうちょっと自分でイイ感じにデザインできるといいなあという声をよく聞きます。 この企画は、そんなプログラマが、少ない手間で簡単に、ちょっといい感じのデザインに見せるための、ちょっとした小ズルいTipsを紹介します。 （注）このページでは、個々のデザイン要素... 続きを読む

Railsプログラマはこれを入れればすぐにズルいデザインをはじめられます！ - blog.mah-lab.com

2012/11/07 261 users Railsプログラマ blog.mah-lab.com

先日のプログラマ向けデザイン勉強会で発表された「少ない手間と知識で"それなり"に見せる、ズルいデザインテクニック」（by 赤塚さん）の中に書かれていたSassのMixinをRailsで使えるGemにしてみました。 zurui-sass-rails: https://github.com/mahm/zurui-sass-rails sample: http://zurui-sample.heroku... 続きを読む