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
210
DroidKaigi初めて登壇したレポ
Avatar for みっちゃん mitchan
1
150
実践！難読化ガイド
Avatar for みっちゃん mitchan
0
2.5k
「実践！難読化ガイド」事前予告編
Avatar for みっちゃん mitchan
0
250
画面遷移 〜iOSとAndroid〜
Avatar for みっちゃん mitchan
0
170
パソコン音痴な私がモバイル開発界隈でぬくぬく成長している理由
Avatar for みっちゃん mitchan
0
440
ドキュメントから adbコマンドの仕組みを読み解く
Avatar for みっちゃん mitchan
1
290
2024年は難読化と仲良くなりたい
Avatar for みっちゃん mitchan
0
360
STORES二年生が得た新しい視点
Avatar for みっちゃん mitchan
0
280

Other Decks in Programming

See All in Programming
AI Coding Agent Enablement in TypeScript
Avatar for Yuku Kotani yukukotani
15
6.2k
iOSアプリ開発もLLMで自動運転する
Avatar for Yuya Hirayama hiragram
6
2k
External SecretsのさくらProvider初期実装を担当しています
Avatar for logica / Takuto Nagami logica0419
0
190
『Python → TypeScript』オンボーディング奮闘記
Avatar for takumi_tatsuno takumi_tatsuno
1
120
OpenNext + Hono on Cloudflare で イマドキWeb開発スタックを実現する
Avatar for rokuosan rokuosan
0
100
Language Server と喋ろう – TSKaigi 2025
Avatar for pizzacat83 pizzacat83
2
570
JVM の仕組みを理解して PHP で実装してみよう
Avatar for memory m3m0r7
PRO
1
240
TypeScriptのmoduleオプションを改めて整理する
Avatar for おおいし bicstone
4
400
ドメイン駆動設計とXPで支える子どもの未来 / Domain-Driven Design and XP Supporting Children's Future
Avatar for nrs nrslib
0
350
#QiitaBash TDDでAIに設計イメージを伝える
Avatar for sigma ryosukedtomita
2
1.4k
CQRS/ESのクラスとシステムフロー ~ RailsでフルスクラッチでCQRSESを組んで みたことから得た学び~
Avatar for suzuki masayuki suzukimar
0
190
私のRubyKaigi 2025 Kaigi Effect / My RubyKaigi 2025 Kaigi Effect
Avatar for chobishiba chobishiba
1
200

Featured

See All Featured
Product Roadmaps are Hard
Avatar for C. Todd Lombardo iamctodd
PRO
53
11k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
Avatar for Kevin Liebholz kevinliebholz
32
5.8k
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
45
7.3k
How to Ace a Technical Interview
Avatar for Jacob Kaplan-Moss jacobian
276
23k
Easily Structure & Communicate Ideas using Wireframe
Avatar for Afnizar Nur Ghifari afnizarnur
194
16k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
Avatar for Eileen M. Uchitelle eileencodes
25
2.8k
RailsConf 2023
Avatar for Aaron Patterson tenderlove
30
1.1k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
Avatar for Chris Coyier chriscoyier
507
140k
Mobile First: as difficult as doing things right
Avatar for Swwweet swwweet
223
9.6k
The Pragmatic Product Professional
Avatar for Laura Van Doore lauravandoore
34
6.7k
4 Signs Your Business is Dying
Avatar for Josh Pigford shpigford
183
22k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
Avatar for Tammy Everts tammyeverts
1
61

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