Será mesmo que esse tal de Flat Design que todos falam é a nova tendência no design? Conheça seus princípios.
Flat Design, o design plano. Com amor ou ódio, muitos comentam sobre esse novo conceito que surgiu.
Mas o que o Flat Design representa?
Essa tendência do web design é a pura simplicidade dos elementos, da clareza do layout. Se distingue por suas formas cleans e planas. O conceito funciona sem variações na estrutura do layout, como chanfros, relevo, gradientes ou outras ferramentas que adicionam profundidade. Cada elemento ou caixa é nítido. Nada realista é adicionado.
Mas ai você para e se pergunta… O que faz esse conceito ser funcional?
Tudo parte da hierarquia na concepção e colocação de elementos, para assim facilitar a compreensão e interação dos usuários. Por exemplo, com telas pequenas, há menos botões e opções, fazendo uma interface ser plana será relativamente mais fácil e prático de usar.
Vamos dar alguns exemplos de Flat design:
Sem efeitos
Simplicidade dos elementos
Usa-se muitos elementos de interface de usuário simples, como botões e ícones. Muitas vezes são formas simples, como retângulos, círculos ou quadrados. Se jogue no negrito com cor em botões clicáveis para incentivar o uso, talvez uma sombra diferenciada. Mas não confunda elementos simples com um design simples. Os conceitos de Flat Design podem ser tão complexos quanto qualquer outro tipo de esquema de design.
Foco na Tipografia
Nesse caso a tipografia é extremamente importante.
O tom das fontes deve corresponder ao esquema do resto do layout. Uma fonte muito produzida pode parecer estranho em um projeto super simples. Podem também ser ousadas, mas de forma simples e eficiente.
Foco na Cor
A cor pode ser o grande desafio. No Flat Design a paletas de cores, na maioria da vezes, são muito mais brilhante e mais colorido do que os de outros sites. Mas lembre-se que pra toda regra há exceções.
Os tons tendem a ser vibrante, sem matizes e tonalidades. Cores primárias e secundárias são populares. Além disso, certos tipos de cores também são usadas com freqüência. Nesta interação da tendência, cores retros – incluindo salmão, roxo, verde e azul – são especialmente populares.
Poderá ler mais dicas de paleta cores aqui.
Abordagem minimalista
Evite muita frescura na concepção geral do site. Cor e texto simples podem ser o suficiente. Se você quiser adicionar efeitos visuais, opte pela fotografia simples.
Espero que tenha ajudado!
E você? Vai aderir essa nova tendência?
😉
Agata Yamashiro
Nicolas Yamashiro
Bruna Dener
33 comments
Muito bom esse Post! É interessante divulgar bem detalhado essa nova tendência, pois muitas coisas surgem e somem no dia-a-dia, e o Flat Design é a opção do momento. E como bons designer, precisamos sempre ter opções…
Obrigada pelo feedback Fred! Abs! 🙂
A interface do Windows 8 foi o primeiro layout que vi seguindo esse estilo. A pergunta que fica: teria sido a Microsoft a levantar o Flat Design?
“Vai adquirir essa nova tendência?” Aderir, não adquirir!
Eric, me desculpe, você tem razão, obrigada por avisar!
Olá, muito interessante essa postagem, eu já observava essa tendência mas agora estou mais informado a respeito, para que eu possa aplicar em meu blog. Obrigado pelas dicas.
Que bom ter ajudado! 😉
ótimo post, adorei! Flat design é lindo, mas quando mais simples a interface, mais difícil concebê-la.
Obrigada pelo feedback Vanessa! 🙂
Vanessa, sem dúvidas. Aliar o simples com a tendência flat design é o que torna desafiador a criação. 🙂
Muito bom esse post, parabéns Agata Yamashiro e obrigado por dividir esse conhecimento.
Muito bom o post. Vou me inspirar com certeza! Abraços! =)
Artigo muito bom, já me cadastrei até ; )
Parabéns pela inciativa do blog, estamos sempre conhecendo maiores informações e também lendo sobre novas tendências e ficarmos antenados sempre.
Valeu Agata.
Obrigada mesmo! Ficamos agradecidos pelo feedback e pelo carinho! 🙂
É a prova da máxima “quanto mais simples, mais chic”
O post realmente ficou excelente, vou até mostrá-lo para meus clientes que ainda hoje insistem em ter sites cheios de “frufrus” e efeitos flash!
Obrigado!
Parabéns pelo artigo!
Flat é muito bonito e funcional.
Vou aplicar no meu site!
Valeu o
Agata Yamashiro muito obrigado pelo introdução sobre o que seria Flat Design me ajudou muito, excelente conteúdo! Parabéns!
Obrigada Matheus! 😉 Que bom que ajudou!
Ótimo texto, parabéns Agata.
Você poderia me passar tua biografia, ou me indicar algum livro sobre o assunto?
Sou estudante de Design e, estou fazendo um projeto sobre o “flat” e queria me fundamentar mais…
Aproveito e peço licença pra citar seu texto, (com seus devidos créditos, claro) *–*
Olá, gostei muito das suas dicas e gostaria de pública-la em minha nova Page no facebook.
E gostaria de pedir que vc desse um curtir e convidasse seus amigos que tbm gostam á curtir.
http://www.facebook.com/WebDesignerJB
Obrigado.
Flat Design com a grande ajuda da MS vai render muito e muito… gosto muito do estilo…
Ótima postagem sobre Flat Design, com texto bem elaborado e muito explicativo. Obrigado !
Ótimo posto, e o Flat Design está rendendo até hoje, com suas várias ramificações e modificações.