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

Material Design とは

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for みっちゃん みっちゃん
May 29, 2023
Programming
0
100

Material Design とは

Avatar for みっちゃん

みっちゃん

May 29, 2023
Tweet

More Decks by みっちゃん

See All by みっちゃん
Do you use git worktree?
Avatar for みっちゃん mitchan
0
100
Android値受け渡し大全 〜 設計を制する者が「渡す」を制す 〜
Avatar for みっちゃん mitchan
1
6.9k
2024年にチャレンジしたことを振り返るぞ
Avatar for みっちゃん mitchan
0
290
DroidKaigi初めて登壇したレポ
Avatar for みっちゃん mitchan
1
230
実践！難読化ガイド
Avatar for みっちゃん mitchan
0
3.7k
「実践！難読化ガイド」事前予告編
Avatar for みっちゃん mitchan
0
300
画面遷移 〜iOSとAndroid〜
Avatar for みっちゃん mitchan
0
370
パソコン音痴な私がモバイル開発界隈でぬくぬく成長している理由
Avatar for みっちゃん mitchan
0
560
ドキュメントから adbコマンドの仕組みを読み解く
Avatar for みっちゃん mitchan
1
360

Other Decks in Programming

See All in Programming
The Past, Present, and Future of Enterprise Java
Avatar for ivargrimstad ivargrimstad
0
780
ベクトル検索のフィルタを用いた機械学習モデルとの統合 / python-meetup-fukuoka-06-vector-attr
Avatar for monochromegane monochromegane
2
480
CDIの誤解しがちな仕様とその対処TIPS
Avatar for futokiyo futokiyo
0
220
SourceGeneratorのマーカー属性問題について
Avatar for tkym htkym
0
200
new(1.26) ← これすき / kamakura.go #8
Avatar for utagawa kiki utgwkk
0
2.5k
車輪の再発明をしよう！PHP で実装して学ぶ、Web サーバーの仕組みと HTTP の正体
Avatar for H1R0 h1r0
1
130
仕様漏れ実装漏れをなくすトレーサビリティAI基盤のご紹介
Avatar for Kuniwak orgachem
PRO
6
2.4k
今からFlash開発できるわけないじゃん、ムリムリ! (※ムリじゃなかった!?)
Avatar for Sora Arakawa arkw
0
120
GC言語のWasm化とComponent Modelサポートの実践と課題 - Scalaの場合
Avatar for Rikito Taniguchi tanishiking
0
120
20260228_JAWS_Beginner_Kansai
Avatar for Takuya Yonezawa takuyay0ne
5
590
ふつうのRubyist、ちいさなデバイス、大きな一年 / Ordinary Rubyists, Tiny Devices, Big Year
Avatar for chobishiba chobishiba
1
480
Linux Kernelの1文字のミスで 権限昇格ができた話
Avatar for rona rqda
0
1.9k

Featured

See All Featured
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
Avatar for Tammy Everts tammyeverts
11
860
Bioeconomy Workshop: Dr. Julius Ecuru, Opportunities for a Bioeconomy in West Africa
Avatar for AKADEMIYA2063 akademiya2063
PRO
1
75
Designing Powerful Visuals for Engaging Learning
Avatar for Mike Taylor tmiket
0
290
Context Engineering - Making Every Token Count
Avatar for Addy Osmani addyosmani
9
760
The MySQL Ecosystem @ GitHub 2015
Avatar for Sam Lambert samlambert
251
13k
JavaScript: Past, Present, and Future - NDC Porto 2020
Avatar for David Neal reverentgeek
52
5.9k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
Avatar for mongodb mongodb
49
9.9k
Abbi's Birthday
Avatar for Violet Bock coloredviolet
2
5.5k
Leading Effective Engineering Teams in the AI Era
Avatar for Addy Osmani addyosmani
9
1.7k
Faster Mobile Websites
Avatar for Dean Hume deanohume
310
31k
Balancing Empowerment & Direction
Avatar for Lara Hogan lara
5
950
More Than Pixels: Becoming A User Experience Designer
Avatar for Michelle Schulp Hunt marktimemedia
3
350

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