SlideShare uma empresa Scribd logo
1 de 39
Material Design.Do Skeumorfismo ao Flat Design, como o Google revolucionou as interfaces digitais
Thomas Patrício Machado
UX Designer
22 Anos
Healfies — we are hiring =)
1. Skeumorfismo
2. Flat Design
3. Material Design
Skeumorfismo
Skeus (Recipiente ou ferramenta)
+
Morphe (forma)
Linha de comando
Mouse
Interface Gráfica
Flat Design
Sem profundidade
Simplicidade dos
elementos
Foco no tipografia
Foco na cor
Abordagem minimalista
Porque Flat Design?
Microsoft Metro UI
Microsoft Zune
Windows 8
Apple IOS 7
Google Material Design
Chileno
Trabalhou na Palm (WebOS)
Cientista da Computação
Matias Duarte
Não é um
Framework mas
sim um Style
Guide
https://material.google.com/
A volta da
profundidade
Princípios
Material is the metaphor Bold, graphic, intentional Motion provides meaning
O que é o Material?
Profundidade
dá
significado
Movimento natural
Como usar?
Angular Material
Material Design Lite
Materialize
Obrigado!
facebook.com/Thomachado
https://br.linkedin.com/in/thomaspmach

Mais conteúdo relacionado

Semelhante a Material Design - Do Skeumorfismo ao Flat Design, como o Google revolucionou as interfaces digitais

Cap 5 Compreendendo Como As Interfaces Afetam Os UsuáRios
Cap 5 Compreendendo Como As Interfaces Afetam Os UsuáRiosCap 5 Compreendendo Como As Interfaces Afetam Os UsuáRios
Cap 5 Compreendendo Como As Interfaces Afetam Os UsuáRios
Marcelo Bitencourt
 

Semelhante a Material Design - Do Skeumorfismo ao Flat Design, como o Google revolucionou as interfaces digitais (20)

Handoff - Como o Designer pode facilitar a vida do Desenvolvedor - Diego Vela...
Handoff - Como o Designer pode facilitar a vida do Desenvolvedor - Diego Vela...Handoff - Como o Designer pode facilitar a vida do Desenvolvedor - Diego Vela...
Handoff - Como o Designer pode facilitar a vida do Desenvolvedor - Diego Vela...
 
Design da interação / Design da experiência: considerações sobre um campo de ...
Design da interação / Design da experiência: considerações sobre um campo de ...Design da interação / Design da experiência: considerações sobre um campo de ...
Design da interação / Design da experiência: considerações sobre um campo de ...
 
Apresentação Flat
Apresentação FlatApresentação Flat
Apresentação Flat
 
Design de Interação: O que você tem a ver com isso?!
Design de Interação: O que você tem a ver com isso?!Design de Interação: O que você tem a ver com isso?!
Design de Interação: O que você tem a ver com isso?!
 
Deep Dive Material Design, e um pouquinho sobre mobile UX
Deep Dive Material Design, e um pouquinho sobre mobile UXDeep Dive Material Design, e um pouquinho sobre mobile UX
Deep Dive Material Design, e um pouquinho sobre mobile UX
 
Design de interação e robótica.
Design de interação e robótica.Design de interação e robótica.
Design de interação e robótica.
 
UX - UI DESIGN / MÉTODOS
UX - UI DESIGN / MÉTODOSUX - UI DESIGN / MÉTODOS
UX - UI DESIGN / MÉTODOS
 
Design de interfaces gráficas
Design de interfaces gráficasDesign de interfaces gráficas
Design de interfaces gráficas
 
Engenharia de Software - Unimep/Pronatec - Aula 7
Engenharia de Software - Unimep/Pronatec - Aula 7Engenharia de Software - Unimep/Pronatec - Aula 7
Engenharia de Software - Unimep/Pronatec - Aula 7
 
Google Material Design - Conceito, aplicações, código e web components
Google Material Design - Conceito, aplicações, código e web componentsGoogle Material Design - Conceito, aplicações, código e web components
Google Material Design - Conceito, aplicações, código e web components
 
Experimentação de um produto
Experimentação de um produtoExperimentação de um produto
Experimentação de um produto
 
História da UX no Brasil - v1.1
História da UX no Brasil - v1.1História da UX no Brasil - v1.1
História da UX no Brasil - v1.1
 
Design De Interfaces
Design De InterfacesDesign De Interfaces
Design De Interfaces
 
Flat Design e a Re-Cultura da Interface
Flat Design e a Re-Cultura da InterfaceFlat Design e a Re-Cultura da Interface
Flat Design e a Re-Cultura da Interface
 
Indo além do Design Centrado no Usuário
Indo além do Design Centrado no UsuárioIndo além do Design Centrado no Usuário
Indo além do Design Centrado no Usuário
 
O Designer no Mundo da Tecnologia da Informação (TI)
O Designer no Mundo da Tecnologia da Informação (TI)O Designer no Mundo da Tecnologia da Informação (TI)
O Designer no Mundo da Tecnologia da Informação (TI)
 
Metro UI na IxDA Floripa
Metro UI na IxDA FloripaMetro UI na IxDA Floripa
Metro UI na IxDA Floripa
 
Cap 5 Compreendendo Como As Interfaces Afetam Os UsuáRios
Cap 5 Compreendendo Como As Interfaces Afetam Os UsuáRiosCap 5 Compreendendo Como As Interfaces Afetam Os UsuáRios
Cap 5 Compreendendo Como As Interfaces Afetam Os UsuáRios
 
TDC2017 | São Paulo - Trilha Design Thinking How we figured out we had a SRE ...
TDC2017 | São Paulo - Trilha Design Thinking How we figured out we had a SRE ...TDC2017 | São Paulo - Trilha Design Thinking How we figured out we had a SRE ...
TDC2017 | São Paulo - Trilha Design Thinking How we figured out we had a SRE ...
 
Construção de Software - 1º/2017
Construção de Software - 1º/2017Construção de Software - 1º/2017
Construção de Software - 1º/2017
 

Material Design - Do Skeumorfismo ao Flat Design, como o Google revolucionou as interfaces digitais