ニューモーフィズム ってどうなの Ryota Horizumi 2024/11/29

ニューモーフィズムとは？

Fitness - neumorphism by Mariia Tokar

New + Skeuomorphism = Neumorphism (“New”morphismじゃないよ)

そもそもSkeuomorphismって？ 現実にあるものに似せることで、直 感的に操作できるデザイン iOS 6まではスキューモーフィズムが 採用されていた (iOS 7からはフラッ トデザインに移行していった)

Neumorphismって？ Fitness - neumorphism by Mariia Tokar リアルな質感や物理的な特性を反映する スキューモーフィズムに、フラットデザ インやマテリアルデザインのシンプルさ を組み合わせたデザイン ハイライトやシャドウを使用して凹凸感 が強調されているのが特徴

だけどあんま流行ってない... 2020年頃から話題になりこれから流行ってくかと思いきや、国内のメ ジャーなアプリで採用されてるケースはほとんどない...

一筋の光が... そんな流行ってないデザインを採用して 流行ってるアプリがあるらしい

Pokémon Trading Card Game Pocket DeNAとクリーチャーズ開発のもと、2024/10/30にサービス開始

ニューモーフィズムがいっぱい

ニューモーフィズムやってみる

一番シンプルであろう実装 凹の指定 凸の指定 凹 凸

toridori baseにも適用してみた 適用後 適用前

● 背景に真っ白や真っ黒使うのは難しい ○ 真っ白使うとハイライト、真っ黒はシャドウがみえなくなる ● 余白は広めにないと厳しい ○ シャドウやハイライトを表示するスペースがないと凹凸感がでない ● 画像コンテンツとの相性はそんなによくなさそう ○ 背景色とコンポーネントの色が一緒じゃないと凹凸感がでない ● アクセントカラーに原色系を使うのは難しい ○ 全体的に柔らかいイメージになるので、キリッとした色と相性が悪い ● 角ばったデザインにするのは難しい ○ 全体的に柔らかいイメージになるので、カチッとしたデザインと相性が悪い わりと制約が多いなという印象 マテリアルデザインのものに無理やりニューモーフィズムを適用した感想なので、 最初からニューモーフィズムならでてこない感想ではあるかも