Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥

Material Design とは

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

Material Design とは

Avatar for みっちゃん

みっちゃん

May 29, 2023
Tweet

More Decks by みっちゃん

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

Other Decks in Programming

See All in Programming
ID管理機能開発の裏側 高速にSaaS連携を実現したチームのAI活用編
Avatar for Atsushi Kawamura (atzz/a2c) atzzcokek
0
180
分散DBって何者なんだ．．． Spannerから学ぶRDBとの違い
Avatar for kensho iwashi623
0
170
ViewファーストなRailsアプリ開発のたのしさ
Avatar for sugiwe sugiwe
0
380
AIと協働し、イベントソーシングとアクターモデルで作る後悔しないアーキテクチャ Regret-Free Architecture with AI, Event Sourcing, and Actors
Avatar for Tomohisa Takaoka tomohisa
5
18k
非同期処理の迷宮を抜ける: 初学者がつまづく構造的な原因
Avatar for PADAone pd1xx
1
530
『実践MLOps』から学ぶ DevOps for ML
Avatar for Satsuki Nagae nsakki55
2
550
【CA.ai #3】ワークフローから見直すAIエージェント — 必要な場面と“選ばない”判断
Avatar for SatoAoaka satoaoaka
0
200
Why Kotlin? 電子カルテを Kotlin で開発する理由 / Why Kotlin? at Henry
Avatar for Agata Naomichi agatan
2
6.1k
Full-Cycle Reactivity in Angular: SignalStore mit Signal Forms und Resources
Avatar for Manfred Steyer manfredsteyer
PRO
0
170
[堅牢.py #1] テストを書かない研究者に送る、最初にテストを書く実験コード入門 / Let's start your ML project by writing tests
Avatar for Shunsuke KITADA shunk031
11
6.8k
テストやOSS開発に役立つSetup PHP Action
Avatar for Atsushi Matsuo matsuo_atsushi
0
140
TUIライブラリつくってみた / i-just-make-TUI-library
Avatar for kazto kazto
1
310

Featured

See All Featured
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
791
250k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Avatar for Marc Duiker marcduiker
35
2.3k
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
46
7.8k
No one is an island. Learnings from fostering a developers community.
Avatar for Antonio thoeni
21
3.5k
What’s in a name? Adding method to the madness
Avatar for Product Marketing Alliance productmarketing
PRO
24
3.8k
The MySQL Ecosystem @ GitHub 2015
Avatar for Sam Lambert samlambert
251
13k
A better future with KSS
Avatar for Kyle Neath kneath
240
18k
Practical Orchestrator
Avatar for Shlomi Noach shlominoach
190
11k
Faster Mobile Websites
Avatar for Dean Hume deanohume
310
31k
GitHub's CSS Performance
Avatar for Jon Rohan jonrohan
1032
470k
Mobile First: as difficult as doing things right
Avatar for Swwweet swwweet
225
10k
VelocityConf: Rendering Performance Case Studies
Avatar for Addy Osmani addyosmani
333
24k

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