[Mockup] Novo Layout de Página do Facebook para Download em .PSD

Compartilhe:

Novo Layout de Página do Facebook 2017 [ATUALIZADO 03/01/2017] – Atualizado com os novos tamanhos do início de 2017 e com as layers um pouco mais organizadas, continua funcionando como um Mockup em Smart Object (objetos inteligentes).

[ATUALIZADO 08/01/2017] – Incluído dimensões da área mobile para a capa.

Aqui começarei um textão sobre o novo layout de página do Facebook, mas se você quer fazer o download logo é só se cadastrar aqui embaixo e ir para a página de download do arquivo .PSD.

 

 

Nos últimos dias, grande parte das pessoas entraram em suas páginas do Facebook e notaram que o layout mudou, com isso, as medidas das imagens de capa e avatar também mudaram.

Quando falamos de medidas, notamos que o que teve uma maior alteração foi a imagem de capa, que antes media 851 x 315 px,  passou a medir 828 x 315px em junho de 2016 e agora sofreu pequenas alterações (2017) passando a medir 820 x 312px.

Sobre a mudança de 2015 para 2016, a maior diferença foi no layout como um todo, principalmente a posição dos elementos. Para quem criava projetos para mídias sociais algumas coisas foram facilitadas, mas outras interações não são mais possíveis. Por exemplo, aquela capa com uma foto que encaixava perfeitamente com a imagem de perfil, com intuito de integrar a imagem da capa com a imagem do perfil, não é mais possível, inclusive, com essa mudança, encontrei algumas capas desconfiguradas pelo Facebook a fora.

Por outro lado, como a imagem de perfil não fica mais em cima da capa, acaba facilitando a utilização da capa para outros fins. Basta observar a capa como um outdoor, você pode utilizar ela para divulgar um produto, links de suas redes sociais, seu site, ou ainda um download de um Ebook, Fontes, Freebies, etc.

Isso torna a utilização da capa um pouco mais estratégica e ainda, sem a foto do perfil atrapalhando a posição daquele texto que você queria escrever sobre capa…

Ah, não posso deixar de comentar, boa parte das pessoas estão comparando o novo layout das páginas do Facebook com o falecido Orkut, não posso negar que está bem parecido. Fotinho abaixo para relembrar.

novo layout de pagina do facebook parece com o orkut

Aproveitando o momento, é claro, criei esse template de Facebook em forma de mockup, assim você pode utilizar tanto para ter um preview de suas páginas antes de mandar para o cliente, ou utilizar em uma apresentação, além de ter os tamanhos corretos do novo modelo de página.

Mas Mockup de Facebook? Que bixo é esse?

Algumas pessoas nos grupos que postei o link de download do template de Facebook me perguntaram o que é um mockup, ou como utilizá-lo. Caso você seja uma dessas pessoas, aqui embaixo tem um vídeo do Clube do Design explicando como funciona.

Abaixo, algumas considerações explicando os tamanhos que utilizei para criação do template.

Tamanhos que utilizei no Mockup de Página do Facebook 2017 e algumas dicas extras.

Capa: 820px x 312px, um bom espaço para aproveitar de uma forma criativa 😉

Avatar: Visivelmente é de 170 x 170 px, recomendado pelo suporte do Facebook antes da atualização era de 160 x 160 px. Mas quando se faz um upload desse tamanho, o Facebook retorna uma mensagem sobre imagem com nitidez baixa, então, após abrir o objeto inteligente, a imagem está com 320 x 320 px, tamanho que a mensagem sobre nitidez não aparece mais, e você vai poder utilizar sem problemas.

Postagem nova 2017: 1000 x 1300 px ou 500 x 650 px (esses são apenas exemplos, na verdade é qualquer tamanho com proporção de 1 x 1.3) Esse novo tamanho não é cortado na timeline do aplicativo do facebook.

Postagem quadrada: 800 x 800 px, não é nenhum padrão recomendado pelo Facebook, a questão é que é um dos padrões mais utilizados pelos Social Medias, e por isso resolvi utilizar esse tamanho.

Postagem compartilhada: 476 x 249 (visual) mas eu costumo utilizar 600 x 315 px (mesma proporção, mas com números arredondados), esse tamanho serve para casos de compartilhamento de um link externo na página, para quem tem site e blog e compartilha artigos no Facebook, esse é o tamanho que aparece no preview do artigo, junto com o texto de descrição.

Espaço para aplicativos: 111 x 74 px, aqueles quadradinhos menores que você pode colocar sua loja, Instagram, Twitter, etc.

Extras

Textos: Os textos principais podem ser alterados, e alguns retângulos nos fundos de imagens também, possibilitando que você modifique o template.

Fonte utilizada: Arial, originalmente é Helvética, troquei pois a maioria utiliza Windows, mas você pode trocar para Helvética e ficar com o novo layout de página do Facebook ainda mais fiel ao original.

Formato de imagem: utilize PNG24 para salvar as imagens, dessa forma você preserva a qualidade da imagem e sua página fica ainda mais bonita.

Download do Novo Layout de Página do Facebook

Você pode baixar o novo layout de página do Facebook aqui embaixo.

 

 

Ah, não esqueça de deixar sua opinião, estarei atualizando esse artigo e também o template sempre que possível. Se quiser receber mais dicas assim, é só se inscrever na minha Newsletter aqui embaixo dos comentários.

Um abraço, e até a próxima!

 

 

O que achou do Artigo? Conta aí!

Onde me encontrar

Top