ブログ - 2021-10-21 10:56:00

【Webデザイン】シンプルおしゃれな”ニューモーフィズム”とは??

Posted by 江口 史和里
Shiori Eguchi

みなさん、こんにちは!

前回に引き続き、Webデザインについて調べていたところ

”ニューモーフィズム”という聞き慣れない言葉。

 

New(新しい)+Skeumorphism(スキューモーフィズム)

=Neumorphism(ニューモーフィズム)

 

....スキューモーフィズムとはなんでしょうか??

スキューモーフィズム(英: skeuomorphism)またはリッチデザイン(英: Rich Design)とは、他の物質に似せるために行うデザインや装飾を指す用語である。 たとえば、紙製のカレンダーのような外見に似せたカレンダーのソフトウェアのデザインなどがあてはまる。

(Wikipediaより)

 

 

なんとなくイメージしてみるとするならば、

iPhoneのアプリアイコンでしょうか。

昔のOSのアプリアイコンでは、リアルで立体的なデザイン(スキューモーフィズム)に対し

最近は、フラットデザインが使用されているものが多いです。

 

福岡|九州|映像制作|プロジェクションマッピング|ドローン|ホームページ|ライブ配信|特殊撮影|イベント|レーザー|特殊効果|CG制作|写真撮影|youtube|チャンネルプロデュース|モデル|音響|照明|レンタル|キャラクターデザイン|ロゴデザイン例)Instagram

スキューモーフィズム・フラットデザイン、と出てきて

そして二つを掛け合わせた”ニューモーフィズム”と移り変わってきているようですね。

画像右のinstagramアイコンも、フラットではあるけどちょっと立体的。

 

 

実際にニューモーフィズムでデザインをつくってみました。

めちゃめちゃ便利なニューモーフィズムサービス☞☞☞ https://neumorphism.io/

マテリアルデザインとは違い、

ひとつの紙(レイヤー)が膨らんでいたりへこんでいるように見えるのが特徴。

 

どのように表現しているかというと、2種類のドロップシャドウ(影)をつけているためです。

影をぼかさずにくっきりさせるとこう。

福岡|九州|映像制作|プロジェクションマッピング|ドローン|ホームページ|ライブ配信|特殊撮影|イベント|レーザー|特殊効果|CG制作|写真撮影|youtube|チャンネルプロデュース|モデル|音響|照明|レンタル|キャラクターデザイン|ロゴデザイン

意外と単純ですが・・・

影の色などを良い感じにするのが難しい・・。

シャドウの入れ方一つで、雰囲気ががらっと変わるのが不思議ですね。

 

以下おまけ。

ニューモーフィズム的・ボタン要素も作ってみました。※PC推奨

マウスポインタを上にのせたり、クリックしてみてくださいね!

 

Posted by Shiori Eguchi
<Remote>WEBコーダー/クリエイター 江口 史和里

江口 史和里が書いたその他記事

2022-01-23
今年の一文字
2019-12-22
かごしまの旅

ブログ TOP

ブログ 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月が終わりますねー。この間年越したばっかりなのに、、、。はやっっ!!! ブライダル業界はこの時期は閑散期で ...