box-shadowで表現する、「セミフラット」なズルいデザインテクニック

box-shadowで表現する、「セミフラット」なズルいデザインテクニック：ズルいデザイン（3）（1/2 ページ） 世の中、フラットデザイン流行りですが…… iOS 7がフラットデザインを採用したのを皮切りに、Webデザインのトレンドがフラットデザイン一色になってきましたが、立体感を完全に排した色面と空間、シンプルな描画の組み合わせだけのデザイン表現は、ある種ごまかしが効かず、また適切な利用方法を喚起させるようなUIも表現がなかなか難しいものです。 例えば、「ボタンは押せるもの」であると表現するための「押したくなる感じ」を喚起させる立体感は、ユーザビリティ面でもまだまだ有効です。今回は、流行のフラットデザインの中でも違和感なく使えて、また適切なアフォーダンスの表現が可能になる、「やりすぎていない立体感」を目指した、box-shadowを活用した各種ボックス表現の作り方を紹介します。 NGな

[amberjack115]

紹介報酬50万が気になって

[ken_c_lo]

お、公開されてた。スライドからちょっとだけマイナーチェンジしてます。

[kijtra]

この「うっすらシャドウ」に気づいてくれる非デザイナーがとれだけいるかなw

[trashtoy]

insetなbox-shadowはお手軽にリアル感が出せるのでよくやるｗ

[cibea]

デザインとコーディングの分業って相互理解がなきゃ成り立たなくなってきてる。両方できなきゃどっちもできない。scss前提の記事ですし。ズルいデザイン box-shadowで表現する、「セミフラット」なズルいデザインテクニッ

[skunk0915]

css ドロップシャドウ

[ml0021234]

css box-shadow

[typista]

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

[miguse]

たいして違いが判らないのでボクはデザイナーには向いてないとおもったまる

[ponajiro]

box-shadowで表現する、「セミフラット」なズルいデザインテクニック (1/2) 世の中、フラットデザイン流行りですが…… 　iOS 7がフラットデザインを採用したのを皮切りに、Webデザインのトレンドがフラットデザイン一色にな

[warriorking]

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

[teppeis]

相変わらずズルい！

[inulab]

box-shadow使いまくるとスクロール重くなるんだよね・・・

[nauthiz]

box-shadowのいろんな使い方。

[ledsun]

面白い

[kana321]

box-shadowを活用した各種ボックス表現の作り方を紹介。フラットデザインの中でも違和感なく使える「やりすぎていない立体感」とは？

[nakagaw]

インブラウザデザインすなー

[oppara]

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

[stumsky]

これ今度やってみよっと→「borderを使って線で表現する所を、さりげないbox-shadowを使って表現」 ズルいデザイン（3）：box-shadowで表現する、「セミフラット」なズルいデザインテクニック (1/2) - ＠IT

[atsushi1972]

box-shadowで表現する、「セミフラット」なズルいデザインテクニック (1/2) 世の中、フラットデザイン流行りですが…… 　iOS 7がフラットデザインを採用したのを皮切りに、Webデザインのトレンドがフラットデザイン一色にな

[shields-pikes]

内側へのうっすらシャドウは、わりと好き。気づくか気づかないかくらいの淡さで。

[bleu-bleut]

内側にぼかして高級感ってやつ、ベネット効果とかいうやつと思ったけど、同じようにしてもベタ塗りになるなぁ、、、rgba(0, 0, 0, 0.2) 0 0 20px 10pxだとサンプルっぽいのができるけど。

[habuakihiro]

メモメモ。

[sixteengram]

ズルいデザインシリーズ

[beintro335]

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

[ProRollerRider]

そうそう

[mawdw]

box-shadowで表現する、「セミフラット」なズルいデザインテクニック - @IT