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

Material Design とは

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

Material Design とは

Avatar for みっちゃん

みっちゃん

May 29, 2023
Tweet

More Decks by みっちゃん

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

Other Decks in Programming

See All in Programming
たった 1 枚の PHP ファイルで実装する MCP サーバ / MCP Server with Vanilla PHP
Avatar for Shohei Okada okashoi
1
280
チームのテスト力を総合的に鍛えて品質、スピード、レジリエンスを共立させる/Testing approach that improves quality, speed, and resilience
Avatar for Hiroki Iseri goyoki
5
1k
Azure AI Foundryではじめてのマルチエージェントワークフロー
Avatar for 瀬尾佳隆 seosoft
0
190
AI駆動のマルチエージェントによる業務フロー自動化の設計と実践
Avatar for 岡本秀明 h_okkah
0
210
The Niche of CDK Grant オブジェクトって何者？/the-niche-of-cdk-what-isgrant-object
Avatar for hassaku63 hassaku63
1
500
dbt民主化とLLMによる開発ブースト ~ AI Readyな分析サイクルを目指して ~
Avatar for yosh_yumyum yoshyum
3
1.1k
GitHub Copilot and GitHub Codespaces Hands-on
Avatar for Kento.Yamada ymd65536
2
150
Flutterで備える！Accessibility Nutrition Labels完全ガイド
Avatar for 野瀬田　裕樹 yuukiw00w
0
170
Hack Claude Code with Claude Code
Avatar for Akihiro Okuno choplin
6
2.4k
すべてのコンテキストを、 ユーザー価値に変える
Avatar for Michiru Kato applism118
4
1.4k
NEWT Backend Evolution
Avatar for Rodrigo Ramirez xpromx
1
110
PicoRuby on Rails
Avatar for makicamel makicamel
2
140

Featured

See All Featured
Learning to Love Humans: Emotional Interface Design
Avatar for Aarron Walter aarron
273
40k
Bootstrapping a Software Product
Avatar for Garrett Dimon garrettdimon
PRO
307
110k
The Power of CSS Pseudo Elements
Avatar for Geoffrey Crofte geoffreycrofte
77
5.9k
Practical Orchestrator
Avatar for Shlomi Noach shlominoach
189
11k
Facilitating Awesome Meetings
Avatar for Lara Hogan lara
54
6.5k
Site-Speed That Sticks
Avatar for Harry Roberts csswizardry
10
700
Fireside Chat
Avatar for paigeccino paigeccino
37
3.5k
Put a Button on it: Removing Barriers to Going Fast.
Avatar for kastner kastner
60
3.9k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
Avatar for Kevin Liebholz kevinliebholz
34
5.9k
Easily Structure & Communicate Ideas using Wireframe
Avatar for Afnizar Nur Ghifari afnizarnur
194
16k
The MySQL Ecosystem @ GitHub 2015
Avatar for Sam Lambert samlambert
251
13k
Music & Morning Musume
Avatar for Bryan Veloso bryan
46
6.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