Download - Pensando em UX / UI com o material design
![Page 1: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/1.jpg)
Pensando em UX/UI com o Material DesignThiago Marques
![Page 2: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/2.jpg)
Olá!
Thiago Marques
![Page 3: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/3.jpg)
UX & UI
![Page 4: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/4.jpg)
User EXperience User Interaction
![Page 5: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/5.jpg)
User Experience
![Page 6: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/6.jpg)
Dann Saffer (http://www.odannyboy.com)
![Page 7: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/7.jpg)
UX is not UI
![Page 8: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/8.jpg)
UX Designer
Lado Emocional
Facilidade de Uso
Fuidez e Clareza
Parte Criativa e Visual
Elementos consistentes
O famoso "Designer"
UI Designer
![Page 9: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/9.jpg)
![Page 11: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/11.jpg)
O Material Design em siwww.google.com/design
![Page 12: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/12.jpg)
Objetivo 1
![Page 13: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/13.jpg)
Objetivo 2
![Page 14: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/14.jpg)
Os 3 princípios
![Page 15: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/15.jpg)
1.Metáfora
![Page 16: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/16.jpg)
2. Forte, gráfico e intencional
![Page 17: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/17.jpg)
3. Movimento fornece significado
![Page 18: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/18.jpg)
3D World
![Page 19: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/19.jpg)
Luz e Sombra
![Page 20: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/20.jpg)
Propriedades
1 dpiDensity-independent Pixels
9mm, o que corresponde a cerca de 48dp.
margem de 8dp
![Page 21: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/21.jpg)
Dos & Dont's
![Page 22: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/22.jpg)
![Page 23: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/23.jpg)
![Page 24: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/24.jpg)
![Page 25: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/25.jpg)
![Page 26: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/26.jpg)
![Page 27: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/27.jpg)
![Page 28: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/28.jpg)
![Page 29: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/29.jpg)
![Page 30: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/30.jpg)
1. Status bar
2. App bar
3. Background
4. Cards/Dialogs
![Page 31: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/31.jpg)
CoresRecomendacao Google:
500 (cores primárias)
3 - primária
1 - secundária
![Page 32: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/32.jpg)
Opacidade
![Page 33: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/33.jpg)
Opacidade
![Page 34: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/34.jpg)
Barra de Status
![Page 35: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/35.jpg)
Cor Destaque
![Page 36: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/36.jpg)
Cor Destaque
![Page 37: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/37.jpg)
Cor Destaque
![Page 38: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/38.jpg)
![Page 39: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/39.jpg)
![Page 40: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/40.jpg)
![Page 41: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/41.jpg)
![Page 42: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/42.jpg)
![Page 43: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/43.jpg)
![Page 44: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/44.jpg)
Integracao
![Page 45: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/45.jpg)
Roboto
![Page 46: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/46.jpg)
Roboto
![Page 47: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/47.jpg)
Devicesdesign.google.com/devices
![Page 48: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/48.jpg)
E não para...
![Page 49: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/49.jpg)
E agora? Por onde comecar?
![Page 50: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/50.jpg)
Material Design
Litegetmdl.io
![Page 51: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/51.jpg)
Polymerpolymer-project.org
![Page 52: Pensando em UX / UI com o material design](https://reader038.vdocuments.com.br/reader038/viewer/2022103010/587670461a28abd0018b5fd3/html5/thumbnails/52.jpg)