Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
ニューモーフィズムってどうなの
Search
toridori
December 10, 2024
Technology
0
400
ニューモーフィズムってどうなの
凹凸なデザインが特徴的なニューモーフィズム。あまり流行ってないイメージだったけど、最近あるアプリがニューモーフィズムを採用して流行ってるらしい。自分も影響受けてさわってみました。
toridori
December 10, 2024
Tweet
Share
More Decks by toridori
See All by toridori
Locustでmacから開発環境に負荷試験をしてみた
toridori_dev
0
190
N + 1 問題の概要と Railsにおける解決方法
toridori_dev
0
160
Aurora Cloneで QA環境をつくってみた
toridori_dev
0
250
toridori base webをv0で爆速で作った話
toridori_dev
0
200
ハイパーパラメータチューニングって何をしているの
toridori_dev
0
390
KoT APIでプチ業務改善を試してみた
toridori_dev
0
410
MUI DataGridProコンポーネントの紹介
toridori_dev
0
640
あの日行ったマージの仕組みを僕達はまだ知らない。
toridori_dev
0
310
DBマイグレーションとORMについて
toridori_dev
0
230
Other Decks in Technology
See All in Technology
about #74462 go/token#FileSet
tomtwinkle
1
280
AI Agentと MCP Serverで実現する iOSアプリの 自動テスト作成の効率化
spiderplus_cb
0
470
GA technologiesでのAI-Readyの取り組み@DataOps Night
yuto16
0
260
SREとソフトウェア開発者の合同チームはどのようにS3のコストを削減したか?
muziyoshiz
1
100
自作LLM Native GORM Pluginで実現する AI Agentバックテスト基盤構築
po3rin
2
240
stupid jj tricks
indirect
0
7.9k
OCI Network Firewall 概要
oracle4engineer
PRO
1
7.8k
生成AIとM5Stack / M5 Japan Tour 2025 Autumn 東京
you
PRO
0
190
Escaping_the_Kraken_-_October_2025.pdf
mdalmijn
0
120
FastAPIの魔法をgRPC/Connect RPCへ
monotaro
PRO
1
710
C# 14 / .NET 10 の新機能 (RC 1 時点)
nenonaninu
1
1.5k
定期的な価値提供だけじゃない、スクラムが導くチームの共創化 / 20251004 Naoki Takahashi
shift_evolve
PRO
3
290
Featured
See All Featured
Unsuck your backbone
ammeep
671
58k
A Tale of Four Properties
chriscoyier
160
23k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
9
580
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
45
2.5k
Into the Great Unknown - MozCon
thekraken
40
2.1k
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
23
1.5k
Context Engineering - Making Every Token Count
addyosmani
5
180
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
6.1k
GraphQLとの向き合い方2022年版
quramy
49
14k
Embracing the Ebb and Flow
colly
88
4.8k
Transcript
ニューモーフィズム ってどうなの 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にも適用してみた 適用後 適用前
• 背景に真っ白や真っ黒使うのは難しい ◦ 真っ白使うとハイライト、真っ黒はシャドウがみえなくなる • 余白は広めにないと厳しい ◦ シャドウやハイライトを表示するスペースがないと凹凸感がでない • 画像コンテンツとの相性はそんなによくなさそう
◦ 背景色とコンポーネントの色が一緒じゃないと凹凸感がでない • アクセントカラーに原色系を使うのは難しい ◦ 全体的に柔らかいイメージになるので、キリッとした色と相性が悪い • 角ばったデザインにするのは難しい ◦ 全体的に柔らかいイメージになるので、カチッとしたデザインと相性が悪い わりと制約が多いなという印象 マテリアルデザインのものに無理やりニューモーフィズムを適用した感想なので、 最初からニューモーフィズムならでてこない感想ではあるかも