Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Material Design とは

Avatar for みっちゃん みっちゃん
May 29, 2023
Programming
0
91

Material Design とは

Avatar for みっちゃん

みっちゃん

May 29, 2023
Tweet

More Decks by みっちゃん

See All by みっちゃん
2024年にチャレンジしたことを振り返るぞ
Avatar for みっちゃん mitchan
0
220
DroidKaigi初めて登壇したレポ
Avatar for みっちゃん mitchan
1
160
実践！難読化ガイド
Avatar for みっちゃん mitchan
0
2.7k
「実践！難読化ガイド」事前予告編
Avatar for みっちゃん mitchan
0
260
画面遷移 〜iOSとAndroid〜
Avatar for みっちゃん mitchan
0
190
パソコン音痴な私がモバイル開発界隈でぬくぬく成長している理由
Avatar for みっちゃん mitchan
0
460
ドキュメントから adbコマンドの仕組みを読み解く
Avatar for みっちゃん mitchan
1
300
2024年は難読化と仲良くなりたい
Avatar for みっちゃん mitchan
0
360
STORES二年生が得た新しい視点
Avatar for みっちゃん mitchan
0
290

Other Decks in Programming

See All in Programming
スタートアップの急成長を支えるプラットフォームエンジニアリングと組織戦略
Avatar for Yusuke Suto sutochin26
0
300
Google Agent Development Kit でLINE Botを作ってみた
Avatar for Kento.Yamada ymd65536
2
210
Blazing Fast UI Development with Compose Hot Reload (droidcon New York 2025)
Avatar for Márton Braun zsmb
1
270
20250628_非エンジニアがバイブコーディングしてみた
Avatar for ponponmikan ponponmikankan
0
600
XP, Testing and ninja testing
Avatar for seki at druby.org m_seki
3
220
PHP 8.4の新機能「プロパティフック」から学ぶオブジェクト指向設計とリスコフの置換原則
Avatar for 武田 憲太郎 kentaroutakeda
2
700
AIコーディング道場勉強会#2 君（エンジニア）たちはどう生きるか
Avatar for misaki.otb misakiotb
1
270
Railsアプリケーションと パフォーマンスチューニング ー 秒間5万リクエストの モバイルオーダーシステムを支える事例 ー Rubyセミナー 大阪
Avatar for Hayato OKUMOTO falcon8823
4
1k
5つのアンチパターンから学ぶLT設計
Avatar for Narihara narihara
1
140
『自分のデータだけ見せたい！』を叶える──Laravel × Casbin で複雑権限をスッキリ解きほぐす 25 分
Avatar for AkitoTsukahara akitotsukahara
1
600
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
Avatar for r-kagaya rkaga
50
32k
High-Level Programming Languages in AI Era -Human Thought and Mind-
Avatar for Hayato Ishida hayat01sh1da
PRO
0
690

Featured

See All Featured
GitHub's CSS Performance
Avatar for Jon Rohan jonrohan
1031
460k
A Modern Web Designer's Workflow
Avatar for Chris Coyier chriscoyier
694
190k
The Power of CSS Pseudo Elements
Avatar for Geoffrey Crofte geoffreycrofte
77
5.8k
How GitHub (no longer) Works
Avatar for Zach Holman holman
314
140k
The Cult of Friendly URLs
Avatar for Andy Hume andyhume
79
6.5k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
667
120k
StorybookのUI Testing Handbookを読んだ
Avatar for Shingo Yamazaki zakiyama
30
5.8k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
Avatar for Eileen M. Uchitelle eileencodes
26
2.9k
Practical Tips for Bootstrapping Information Extraction Pipelines
Avatar for Matthew Honnibal honnibal
PRO
20
1.3k
The World Runs on Bad Software
Avatar for Brandon Keepers bkeepers
PRO
69
11k
What’s in a name? Adding method to the madness
Avatar for Product Marketing Alliance productmarketing
PRO
23
3.5k
BBQ
Avatar for Matthew Crist matthewcrist
89
9.7k

Transcript

  1. Material Designとは 登壇者：みっちゃん

  2. Material Designはなぜ必要か 一番の目的はアプリのデザインを統一すること！ アプリはデザインが統一されている必要があります。 そのためにDesign Systemがあります。 2

  3. Design Systemとは アプリの中でデザインがブレないように用意するコンポーネントや、プ ロダクトにおけるデザインの決まり事 例えば、SmartHRさんはプロダクトのDesignSystemを公開されている 3

  4. Material DesignもDesign Systemです！！ 4

  5. Material Designをどう使う？ Material Designはあくまで手段 Material Designの全てを使わないといけないわけではない！ デザイナーさんとのやりとりをもっと円滑に行うためのユビキタス言語* （*全員で同じ言葉でコミュニケーションを行うための共通言語の定義） 5

  6. MaterialDesignは従来のデザインとどう違う？ 従来のデザイン（M2） • 凹凸がある・立体的 • elevation(陰)がある • 色が濃い • 四角い・角がはっきりしている

    Material 3 • 平面的 • elevation(陰)がない • 色が淡い • 全体的に丸い

  7. まとめ 可愛くなった。（♡） 7