Tendências em Design de Interação: Interfaces Tangíveis, Mobilidade e Web 2.0
#Loumarathon - Tendências de Design
-
Upload
rafael-guimaraes -
Category
Documents
-
view
219 -
download
0
description
Transcript of #Loumarathon - Tendências de Design
![Page 1: #Loumarathon - Tendências de Design](https://reader031.fdocument.pub/reader031/viewer/2022020223/579075ac1a28ab6874b5af3b/html5/thumbnails/1.jpg)
7 TENDÊNCIAS DE DESIGN
LOUMARATHON
![Page 2: #Loumarathon - Tendências de Design](https://reader031.fdocument.pub/reader031/viewer/2022020223/579075ac1a28ab6874b5af3b/html5/thumbnails/2.jpg)
1 - UM NOVO FLAT
A nova fase desse estilo explora bem mais as formas e os principais elementos passam a ter as cores dinâmicas, o uso de sombras delicadas – que dão profundidade sem “pesar” no layout – e a combinação de fontes e botões fantasma.
![Page 3: #Loumarathon - Tendências de Design](https://reader031.fdocument.pub/reader031/viewer/2022020223/579075ac1a28ab6874b5af3b/html5/thumbnails/3.jpg)
1 - Um novo flat
![Page 4: #Loumarathon - Tendências de Design](https://reader031.fdocument.pub/reader031/viewer/2022020223/579075ac1a28ab6874b5af3b/html5/thumbnails/4.jpg)
A expressão certa será: quanto maior, melhor e, principalmente para as plataformas web, o design das interfaces vai usar imagens grandes e destacadas, que mostrem o propósito ou o tema de um site, aplicativo ou material sem precisar de muitas informações. Até os menus e barras devem sumir dos layouts, dando espaço a uma navegação ainda mais clean.
![Page 5: #Loumarathon - Tendências de Design](https://reader031.fdocument.pub/reader031/viewer/2022020223/579075ac1a28ab6874b5af3b/html5/thumbnails/5.jpg)
VIMEO
![Page 6: #Loumarathon - Tendências de Design](https://reader031.fdocument.pub/reader031/viewer/2022020223/579075ac1a28ab6874b5af3b/html5/thumbnails/6.jpg)
3 - DESIGN FEITO PARA SER RÁPIDOO tempo das pessoas está cada vez mais curto e isso significa que elas querem respostas, reações e resultados de maneira instantânea. Então, tanto nas plataformas digitais quanto no meio offline, invista em conteúdo que pode ser acessado de um jeito rápido, em diferentes lugares e seja voltado ao toque.
![Page 7: #Loumarathon - Tendências de Design](https://reader031.fdocument.pub/reader031/viewer/2022020223/579075ac1a28ab6874b5af3b/html5/thumbnails/7.jpg)
LONDON BUSINESS SCHOOL
![Page 8: #Loumarathon - Tendências de Design](https://reader031.fdocument.pub/reader031/viewer/2022020223/579075ac1a28ab6874b5af3b/html5/thumbnails/8.jpg)
4 - A DOBRA SUPERIOR DE PÁGINA “MORREU”Agora que a rolagem de tela é cada vez mais comum e assimilada pelos usuários, além da grande variedade de tamanhos de telas e dispositivos, pode-se afirmar com segurança que o conceito de dobra superior de página começa a ficar cada vez mais irrelevante.
![Page 9: #Loumarathon - Tendências de Design](https://reader031.fdocument.pub/reader031/viewer/2022020223/579075ac1a28ab6874b5af3b/html5/thumbnails/9.jpg)
AIRBNB
![Page 10: #Loumarathon - Tendências de Design](https://reader031.fdocument.pub/reader031/viewer/2022020223/579075ac1a28ab6874b5af3b/html5/thumbnails/10.jpg)
5 - AS ANIMAÇÕES VOLTARAM
Os aplicativos mobile é que têm definido o que os usuários esperam em termos de experiência. Os Apps estão usando motion para transmitir significado e, só agora, os websites estão começando a fazer o mesmo.
Novas tecnologias, como animação CSS estão se tornando mais fáceis de usar e mais populares, além de funcionarem sem a necessidade de plugins e sem os tradicionais problemas de velocidade e compatibilidade.
![Page 11: #Loumarathon - Tendências de Design](https://reader031.fdocument.pub/reader031/viewer/2022020223/579075ac1a28ab6874b5af3b/html5/thumbnails/11.jpg)
![Page 12: #Loumarathon - Tendências de Design](https://reader031.fdocument.pub/reader031/viewer/2022020223/579075ac1a28ab6874b5af3b/html5/thumbnails/12.jpg)
6 - LAYOUTS DE CARTÃO
Lançado pelo Pinterest, os cartões estão em toda parte na web, porque eles apresentam informações em pedaços médios perfeitos para a exposição. Cada cartão representa um conceito unificado. Uma vez que eles agem como "recipientes de conteúdo", a sua forma retangular torna mais fácil de re-organizar para diferentes pontos dispositivos
![Page 13: #Loumarathon - Tendências de Design](https://reader031.fdocument.pub/reader031/viewer/2022020223/579075ac1a28ab6874b5af3b/html5/thumbnails/13.jpg)
TNW NEWS
![Page 14: #Loumarathon - Tendências de Design](https://reader031.fdocument.pub/reader031/viewer/2022020223/579075ac1a28ab6874b5af3b/html5/thumbnails/14.jpg)
7 - MICROINTERAÇÕES
As Microinterações são “Momentos específicos do produto para realização de uma tarefa”. Essas acontecem ao nosso redor, a partir de desligar o alarme em seu telefone, ao curtir uma imagem de gatinho no Facebook. Cada ação feita sem um segundo pensamento
Microinterações tendem a fazer, ou ajudá-lo a fazer, várias coisas diferentes: 1. Comunicar um status; 2.Ver o resultado de uma ação; 3.Ajudar o usuário manipular algo;
![Page 15: #Loumarathon - Tendências de Design](https://reader031.fdocument.pub/reader031/viewer/2022020223/579075ac1a28ab6874b5af3b/html5/thumbnails/15.jpg)
Twitter – quando você ultrapassa o limite de 140
caracteres, destaca de vermelho os excedentes.
![Page 16: #Loumarathon - Tendências de Design](https://reader031.fdocument.pub/reader031/viewer/2022020223/579075ac1a28ab6874b5af3b/html5/thumbnails/16.jpg)
Facebook – quando é aniversário do seu amigo, aparece um
ícone de bolo de aniversário ao lado de seu nome no chat.
![Page 17: #Loumarathon - Tendências de Design](https://reader031.fdocument.pub/reader031/viewer/2022020223/579075ac1a28ab6874b5af3b/html5/thumbnails/17.jpg)
WordPress – “você estava esperando mais etapas? Desculpe desapontá-lo.”
Uma frase divertida que torna o final do processo de registro único.
![Page 18: #Loumarathon - Tendências de Design](https://reader031.fdocument.pub/reader031/viewer/2022020223/579075ac1a28ab6874b5af3b/html5/thumbnails/18.jpg)
Obrigado.
Referências
That's all folks!
www.awwwards.com/6-web-design-trends-you-must-know-for-2015-2016.html
www.aldeiacoworking.com.br/design/5-tendencias-design-para-2016-e-que-voce-pode-comecar-aplicar-ja/
www.praetzel.com.br/2015/07/7-tendencias-de-web-design-para-2015-e-2016/