Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
2020-8-22 Zil✖️エキサイト LT
Search
MOTCCi
September 26, 2020
Technology
0
88
2020-8-22 Zil✖️エキサイト LT
MOTCCi
September 26, 2020
Tweet
Share
More Decks by MOTCCi
See All by MOTCCi
2020-10-31 CIST-LT✖️Zli LT
motochika
0
33
2020/9/11 TechDojo
motochika
0
13
2020-8-22 Zil✖️CA LT
motochika
0
63
2020/7/11 Zli✖️DMM 合同LT
motochika
0
26
新歓LT
motochika
0
28
2020/1/8 新年LT
motochika
0
11
Presentation for Firefox
motochika
0
16
Nvidia Demo
motochika
0
31
Other Decks in Technology
See All in Technology
急成長する企業で作った、エンジニアが輝ける制度/ 20250214 Rinto Ikenoue
shift_evolve
2
880
バックエンドエンジニアのためのフロントエンド入門 #devsumiC
panda_program
16
6.5k
Ask! NIKKEIの運用基盤と改善に向けた取り組み / NIKKEI TECH TALK #30
kaitomajima
1
450
20250208_OpenAIDeepResearchがやばいという話
doradora09
PRO
0
170
AWSでRAGを実現する上で感じた3つの大事なこと
ymae
3
1k
Culture Deck
optfit
0
330
Oracle Base Database Service 技術詳細
oracle4engineer
PRO
6
57k
The 5 Obstacles to High-Performing Teams
mdalmijn
0
270
『衛星データ利用の方々にとって近いようで触れる機会のなさそうな小話 ~ 衛星搭載ソフトウェアと衛星運用ソフトウェア (実物) を動かしながらわいわいする編 ~』 @日本衛星データコミニティ勉強会
meltingrabbit
0
120
MC906491 を見据えた Microsoft Entra Connect アップグレード対応
tamaiyutaro
1
480
RSNA2024振り返り
nanachi
0
500
飲食店予約台帳を支えるインタラクティブ UI 設計と実装
siropaca
6
1.4k
Featured
See All Featured
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
33
2.8k
Optimizing for Happiness
mojombo
376
70k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
27
1.5k
What's in a price? How to price your products and services
michaelherold
244
12k
Building an army of robots
kneath
302
45k
The MySQL Ecosystem @ GitHub 2015
samlambert
250
12k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
330
21k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
4
400
Mobile First: as difficult as doing things right
swwweet
223
9.3k
The Art of Programming - Codeland 2020
erikaheidi
53
13k
Become a Pro
speakerdeck
PRO
26
5.1k
Transcript
Material Design のススメ 2020/8/26 Zil✖エキサイト合同LT
自己紹介 広瀬 元周(MOTCCi) 会津大学B3 ・Androidアプリ開発に関連した技術を勉強中 Kotlinやアーキテクチャ,UIデザインなど ・趣味はサイクリング,スキー,映画観賞など 最近公開された「TENET」が気になる
Material Designとは Googleのプラットフォーム上で他のアプリを操作性を保ちつつ 利用できるデザインとして誕生 誰もが,どのデバイスでも使えて,表現したいブランドや アイデンティティを最大限引き出せることが目標
Material Designとは 3つの基本原則 ”Material is the metaphor” … 物質的である ”Bold,
graphic, intentional” … 適切なデザインの使用 ”Motion provides meaning” … 動作が自然
Material Designとは デザインの例
https://material.io/design/ 色のヒエラルキー 重要な色 ほど濃い
https://material.io/design/ 要素の境界 奥行きで 区別 透明度で 区別 色の違いで 区別
https://material.io/design/ 重要度 ① → ② → ③ 実例① ボタン
https://material.io/design/ 重要度の順番に 従ってる 同じ重要度で並べて はいけない 実例① ボタン
実例② FAB 良い例 何かを追加しそうかも .... https://material.io/design/ ※FAB FloatongActionButton
実例② FABボタン 悪い例 何を表しているか わかりづらい.... 文字は入れては いけない... https://material.io/design/
実例③ CardView 仕切りがなくて わかりづらい....
おわりに Material Designはユーザーにとって自然なものであ り、一貫した操作性を実現できる AndroidやiOSでも取り入れているアプリは多いので ガイドラインから外れることは望ましくない
より詳しく MaterialDesignの設計思想を探る https://note.com/usagimaruma/n/nb22f1bbca4c8 デザインと品質 https://developer.android.com/design?hl=ja MaterialDesign公式 https://material.io/develop/
試してみる Google Codelab https://codelabs.developers.google.com/ でMDCと検索すると、Kotlin,Swift,Web,Flutter等で マテリアルデザインのコーディングが体験できます
ありがとう ございました! Twitter @motcci Github motochika1 icon