Posted by | 江口 史和里 Shiori Eguchi |
みなさん、こんにちは!
前回に引き続き、Webデザインについて調べていたところ
”ニューモーフィズム”という聞き慣れない言葉。
New(新しい)+Skeumorphism(スキューモーフィズム)
=Neumorphism(ニューモーフィズム)
....スキューモーフィズムとはなんでしょうか??
スキューモーフィズム(英: skeuomorphism)またはリッチデザイン(英: Rich Design)とは、他の物質に似せるために行うデザインや装飾を指す用語である。 たとえば、紙製のカレンダーのような外見に似せたカレンダーのソフトウェアのデザインなどがあてはまる。
(Wikipediaより)
なんとなくイメージしてみるとするならば、
iPhoneのアプリアイコンでしょうか。
昔のOSのアプリアイコンでは、リアルで立体的なデザイン(スキューモーフィズム)に対し
最近は、フラットデザインが使用されているものが多いです。
例)Instagram
スキューモーフィズム・フラットデザイン、と出てきて
そして二つを掛け合わせた”ニューモーフィズム”と移り変わってきているようですね。
画像右のinstagramアイコンも、フラットではあるけどちょっと立体的。
実際にニューモーフィズムでデザインをつくってみました。
めちゃめちゃ便利なニューモーフィズムサービス☞☞☞ https://neumorphism.io/
マテリアルデザインとは違い、
ひとつの紙(レイヤー)が膨らんでいたりへこんでいるように見えるのが特徴。
どのように表現しているかというと、2種類のドロップシャドウ(影)をつけているためです。
影をぼかさずにくっきりさせるとこう。
意外と単純ですが・・・
影の色などを良い感じにするのが難しい・・。
シャドウの入れ方一つで、雰囲気ががらっと変わるのが不思議ですね。
以下おまけ。
ニューモーフィズム的・ボタン要素も作ってみました。※PC推奨
マウスポインタを上にのせたり、クリックしてみてくださいね!
Posted by Shiori Eguchi
<Remote>WEBコーダー/クリエイター 江口 史和里
|
ブログ 2023-11-18 19:26:00
乾燥する季節がやってきました。 横山です。 乾燥に檄弱な私はアマゾン湿地帯レベルで身の回 ...
ブログ 2021-01-21 22:57:00
ようやく、行けた『初詣』。 妻と中2の娘と娘の友達と4人で初詣へ行ってきた。   ...
ブログ 2022-05-29 23:50:00
こんにちは! 永原です! 今日は、映像制作もブライダルも初心者な私のお勉強ブログ第1弾です! (どうかあたたかい目でご覧ください笑) ...
ブログ 2021-02-04 19:24:00
こんにちは ひきちひきです 今日は、撮影の練習に行ってきたので 聞いて ...
ブログ 2021-12-30 16:38:00
こんにちは!たけばです^^ピークスマインドでは定期的に社員研修の一環で「エンタメ研修」といって舞台やショーなどを鑑賞させてもらう機会がありま ...
ブログ 2021-03-05 17:04:00
こんにちは!たけばです^^ 皆さん「マッシュアップ (=Mashup)」 という言葉を聴いたことがありま ...
ブログ 2021-12-06 18:34:00
こんにちは ひきちです 突然ですが ネ ...
ブログ 2021-01-23 18:29:00
皆さんあけましておめでとうございます! という訳で今回も前回に引き続き初詣 ...
ブログ 2023-07-27 21:22:00
こんにちは!宮崎です! 社員研修として 普段東京にいらっ ...
ブログ 2024-01-31 23:21:00
こんばんは!永原です! もう1月が終わりますねー。この間年越したばっかりなのに、、、。はやっっ!!! ブライダル業界はこの時期は閑散期で ...