Material Design - Bold, graphic and intentional

Material é Uma metáfora, é uma teoria unificadora de um espaço racionalizado e de movimento. O material é fundamentado na realidade tátil, inspirado no estudo de papel e tinta, mas tecnologicamente avançado e aberto à imaginação e magia.

Esta apresentação foi feita na Google I/O Extended de Francisco Beltrão, organizada pelo GDG Francisco Beltrão.

Transcript

1. Material Design Bold, graphic, intentional
2. E aí! Meu nome é Wellington Mitrut...
3. Em 2014 o Google mudou toda a sua guideline de design
5. Mas o que é o Material Design?
6. De agora em diante, INDICA-SE usar o Material Design
7. Um pouco de história de interfaces...
8. O Papel
11. A primeira grande mudança: O COMPUTADOR
19. O SKEWOMORFISMO
20. “o Skeumorfismo é um ornamento físico, desenho ou técnica sobre um objeto feito para se parecer com um outro material ou técnica.”
23. O problema do skewomorfismo?
24. ADAPTABILIDADE
25. O paradigma do Flat design
27. No flat design, minimalismo é a palavra de ordem.
28. O flat design é elegante, mas não é perfeito!
29. O problema do flat design é: que os usuários perdem o contexto do que acontecerá quando interagirem com o site/app.
30. Quando os botões param de parecer botões ou começam a ficar muito parecidos visualmente com outros elementos, as pessoas começam a ficar confusas sobre qual será a reação ao clicá-los
31. Mas e aí? Como fazer uma interface melhor?
34. Qual o problema destas torneiras para o usuário?
35. Estas convenções co- existem!
36. Como estas torneiras, assim era o design para Android
37. Existiam diversas ‘torneiras’, você não sabia o que cada ícone poderia fazer...
38. Nada era centralizado, padronizado… isso frustra o usuário.
39. Interfaces touch
40. Android <3 features Android </3 interface
41. Designers e developers esqueceram do que é essencial:
42. Content First
43. O importante é transmitir informação da forma mais clara.
44. Para isso chegou o MATERIAL DESIGN
45. Os 8 princípios do Material Design
46. 1 - Material é Metáfora
48. 2 - Superfícies naturais ao toque
50. 3 - Dimensionalidade
53. 4 - Padronização
56. 5 - O conteúdo é gráfico
58. 6 - Ações claras
60. 7 - Mudanças partem do usuário
61. O usuário não espera algo que não parta dele
62. 8 - Animações devem ter contexto
65. E agora?
66. Mudar, mesmo que aos poucos...
67. Obrigado