Layout e Direção de Arte

Prévia do material em texto

38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 1/
L A Y O U T 
E D I R E Ç Ã O 
D E A R T E
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 2/
O Q U E É ?
Responde
aqui!
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 3/
O Q U E É ?
Um LAYOUT é uma composição visual digital 
ou impressa que apresenta elementos visuais 
harmonicamente distribuídos em um determinado 
espaço e com determinado propósito.
 
Também pode ser chamado de PROJETO GRÁFICO, 
pois, toda criação visual possuí elementos que 
estruturam sua composição. 
Toda imagem tem uma intenção - um propósito: 
tornar algo público / vender / convencer / convidar, etc..
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 4/
O Q U E É ?
Logo, o ato ou ação de pensar ou criar um layout pode 
ser chamado de: LAYOUTAR ou fazer a DIREÇÃO DE ARTE 
- ou seja, pensar e criar a concepção gráfica para 
variados formatos de peças e produtos visuais.
Atenção: a concepção de um layout não precisa iniciar 
direto no computador, pode partir de um esboço manual 
feito à mão, é um ótimo exercício para quem tem 
habilidade em desenho. Quando feito desta maneira, 
chamamos esse esboço de RAFE. 
(ou Rough em inglês)
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 5/
E L E M E N T O S 
C O M P O S I T I V O S 
d o l a y o u t
• • M a n c h a g r á f i c aM a n c h a g r á f i c a
• • G r i d e d i a g r a m a ç ã oG r i d e d i a g r a m a ç ã o
• T i p o g r a f i a s
• C o r
• I m a g e n s e g r a f i s m o s
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 6/
D i a g r a m a r é d i s p o r d e f o r m a
o r d e n a d a e c o e r e n t e o s
d i f e r e n t e s e l e m e n t o s q u e
f a z e m p a r t e d e u m a p á g i n a .
S a b e r c o l o c a r e s s e s 
e l e m e n t o s n a p á g i n a é 
i m p o r t a n t e p a r a a b o a 
l e i t u r a e d e c o d i f i c a ç ã o
d e i m a g e n s . ”
Fe r n a n d a M a r i n e + C h i n a
L a y o u t a r
c o m p o s i ç ã o
d a c r i a ç ã o .
“
841 mm
420 mm210 mm
105 mm52 mm
11
89
 m
m
59
4 
m
m
29
7 
m
m
14
8 
m
m
74
 m
m
A8
A6
A7
A5
A4
A3
A2
A1
A0A0
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 7/
f o r m a t o s
d e p a p e l
Nossos tipos de papéis são normatizados pela ISO - Orgnaização 
Internacional de Normatização, com a norma ISO 216. Para o design e as 
artes gráficas, são classificados em 3 séries: A, B e C. Onde:
• A série A, cada formato difere do seguinte por um fator de 2 ou ½.
• A série B, são formatos intermediários
• A série C, destinados a envelopes para artigos de papelaria em 
formatos da série A. 
• Altura x Largura da raiz quadrada de 2 (dois) √ 2 = 1,414, ou seja os 
formatos oficiais de papéis existentes no mercado, não são quadrados 
perfeitos, e sim derivações retangulares.
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 8/
f o r m a t o s
d e p a p e l
• PRINCIPAIS FORMATOS:
A4 - 21x29,7 cm ou 210x297mm (oficio/revistas/cartazes, etc)A4 - 21x29,7 cm ou 210x297mm (oficio/revistas/cartazes, etc)
A3 - 29,7x42 cm ou 297x420mm (cartazes/posters, etc)
A5 - 14,8x21cm ou 148x210mm (panfleto/ flyer/ folheto, etc)
A0 - 84,1x118,9cm ou 841x1189mm (posters/ lambe-lambe, etc)
para ir além...
Leitura:
» Botões em UI Design
» Guia de formatos para mídia display
» Guia completo do design: formato 
para redes sociais 
Indica
aí!
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 9/
f o r m a t o s
D I G I T A I S
No meio digital, o formato para as imagens e peças gráficas são em 
PIXEL - ou unidade de medida: px, vamos estudar detalhamente mais a 
frente sobre isso. Por ser um formato dinâmico, os tamanhos das peças 
para estess formatos são constantemente atualizados com o passar 
os anos e o avanço das tecnologias. Atualmente os formatos mais 
trabalhados digitalmente são:
- HD: 1280x720 px ou 720x1280px
- Full HD: 1920x1080 px (horizontal) ou 1080x1920px (vertical)- Full HD: 1920x1080 px (horizontal) ou 1080x1920px (vertical)
- Sites e Landing pages: 960px ou 1400px de largura com altura variável
- Newsletter: 900 px de largura com altura variável
- Post Card (quadrado): 800x800px ou 1000x1000px
- Redes Sociais - variados tipos e formatos.
https://medium.com/tableless/botoes-em-ui-design-e8e8a7473747#:~:text=O%20mais%20adequado%20nesse%20cen%C3%A1rio,um%20tamanho%20m%C3%ADnimo%20de%2034px.
https://blog.hariken.co/formatos-midia-display/
https://pluginmkt.com.br/blog/o-guia-completo-do-design-formato-para-redes-sociais
https://pluginmkt.com.br/blog/o-guia-completo-do-design-formato-para-redes-sociais
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 10/
T I P O S &
f o r m a t o s d e
l a y o u t
TIPO S
• T r a d i c i o n a i s
• C r i a t i v o s
• I n s t i t u c i o n a i s
• C a m p a n h a s
• P r o m o c i o n a i s
A L G U N S U S O S
• C a r t a z e s e P o s t e r e s
• F l y e r s e f o l h e t o s
• C a r t õ e s d e v i s i t a s
• S i t e s e a p l i c a t i v o s
• P e ç a s p a r a r e d e s s o c i a i s
• C e n á r i o s e a m b i e n t e s v i r t u a i s
• V í d e o s e a n i m a ç õ e s
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 11/
L A Y O U T
t r a d i c i o n a l
Apresenta uma composição mais rígida, 
sólida e equilibrada, muito utilizado 
em criações para o jornalismo ou para 
a venda de produtos e serviços. Possui 
bastante harmonia e uma característica 
mais formal e harmônica.
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 12/
L A Y O U T
c r i a t i v o
Apresenta uma composição mais ousada 
e disruptiva. Explora os recursos 
visuais para chamar bastante atenção, 
geralmente são assimétricos, propõe uma 
interatividade e geralmente apresenta 
surpresas e não conformidade. 
Bastante utilizados na publicidade, ou 
para divulgação de produtos ou serviços 
direcionado à um público mais jovem ou 
ativo.
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 13/
L A Y O U T
i n s t i t u c i o n a l
Carrega a identidade visual de uma 
marca, produto ou serviço. Geralmente 
é composto por um conjunto de 
características visuais que representam 
aquela marca, produto ou serviço. 
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 14/
L A Y O U T
c a m p a n h a
Apresenta uma configuração visual 
temporária que durante um período de 
existência serve para transmitir a ideia ou 
conceito por trás daquilo que está sendo 
divulgado. 
O layout de uma campanha para um produto de 
uma marca, pode ser diferente do layout da 
identidade desta marca.
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 15/
L A Y O U T
p r o m o c i o n a l
Muito utilizado pelo segmento do varejo, os layouts 
promocionais tem como principal apelo mostrar os 
produtos e vendê-los.
 
O apelo aqui não está apenas na estética, mas sim na 
exibição do preço atrelado às imagens dos produtos. Pode 
ser semelhante à um layout tradicional, ou apelar para 
profusão abusando de uma composição bastante carregada.
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 16/
Vamos identificar 
diferentes tipos de 
layout?
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVERLAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 17/
Vamos identificar 
diferentes tipos de 
layout?
M A N C H A G R Á F I C A
MA R G E M S U P E R I O R
M A R G E M I N F E R I O R
M
A
R
G
E
M
 
E
S
Q
U
E
R
D
A
M
A
R
G
E
M
 
D
I
R
E
I
T
A
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 18/
Mancha gráfica é um espaço delimitado para uma composição 
dentro de um espaço vazio (ou em branco). Serve para 
estruturar o GRID da peça e delimitar as suas margens. O 
ideal é que toda sua composição aproveite o máximo de área 
central do espaço disponibilizado.
CLARO que você pode usar toda a área para criar, mas 
ATENÇÃO, evite colocar informações importantes nas margens 
do layout, pois estas são áreas de menor prestígio no 
layout.
M A N C H A G R Á F I C A
& m a r g e n s
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 19/
Á R E A D E O U R O
d o l a y o u t
Ret â n g u l o á u r e o
Assiste
aí!
pra saber mais
Conceito vindo da geometria, trata-se da figura mais 
perfeita matematicamente e esteticamente falando, logo, 
são estéticamente agradáveis. A razão dos seus lados 
será sempre igual à (Phi) = 1,618.
Um retângulo áureo tem a interessante propriedade de, 
se o dividirmos num quadrado e num retângulo, o novo 
retângulo é também áureo.
https://www.youtube.com/watch?v=sle5e74nYv8
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 20/
R e p e t i n d o e s t e p r o c e s s o i n f i n i t a m e n t e e u n i n d o o s c a n t o s d o s q u a d r a d o s f o r m a d o s , o b t é m - s e u m a 
e s p i r a l a q u e s e d á o n o m e d e e s p i r a l á u r e o . A á r e a c o m m a i o r a b e r t u r a n o e s p e r i a l , s e m p r e 
r e t e r á a m a i o r a t e n ç ã o v i s u a l d o n o s s o o l h o .
PÓS GRADUAÇÃO EM DESIGN EDITORIAL ALUNOS
DIAGRAMAÇÃO - ATIVIDADE 1
BRUNO RICHARDS
MARCOS MIRANDA
PÓS GRADUAÇÃO EM DESIGN EDITORIAL ALUNOS
DIAGRAMAÇÃO - ATIVIDADE 1
BRUNO RICHARDS
MARCOS MIRANDA
PÓS GRADUAÇÃO EM DESIGN EDITORIAL ALUNOS
DIAGRAMAÇÃO - ATIVIDADE 1
BRUNO RICHARDS
MARCOS MIRANDA
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 21/
PÓS GRADUAÇÃO EM DESIGN EDITORIAL ALUNOS
DIAGRAMAÇÃO - ATIVIDADE 1
BRUNO RICHARDS
MARCOS MIRANDA
PÓS GRADUAÇÃO EM DESIGN EDITORIAL ALUNOS
DIAGRAMAÇÃO - ATIVIDADE 1
BRUNO RICHARDS
MARCOS MIRANDA
PÓS GRADUAÇÃO EM DESIGN EDITORIAL ALUNOS
DIAGRAMAÇÃO - ATIVIDADE 1
BRUNO RICHARDS
MARCOS MIRANDA
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 22/
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 23/
mas calma, há uma forma mais 
rápida e simples para definir a 
área de ouro de um layout...
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 24/
Á R E A D E O U R O
d o l a y o u t
Reg r a d o s t e r ç o s
Ainda se apoiando na geometria, esta regra é um 
guia para composição de imagens e layouts em um 
grid 3x3 (ou 6x6 ou 9x9 ... sempre dividindo 
por 3 partes)para criar um foco ativo onde as 
linhas do grid se cruzam.
Inclusive, este recurso foi adicionado às 
câmeras dos nossos smartphones, muitas vezes 
chamado de grade, ajuda a equilibrar a 
composição das nossas fotografias.
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 25/
M a s a t e n ç ã o : a z o n a d e o u r o d a i m a g e m a c o n t e c e n o p o n t o o n d e a s r e t a s 
s e c r u z a m , e n ã o n o m e i o d a s f o r m a s .
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 26/
GRID - Grelha (trad. literal) 
 Malha gráfica (trad. adaptada)
É o planejamento visual para estruturar os eixos de alinhamento e 
distribuição das informações, objetos e elementos num plano. Atua 
principalmente no ordenamento e alinhamento visual.
O grid é um pensamento estrutural de uma 
composição visual, valorizando a distribuição das informações de 
acordo com sua importância. O que precisa ser visto primeiro?
G R I D &
d i a g r a m a ç ã o
ONDE V O U O N D E V O U 
P O S I C I O N A R O S P O S I C I O N A R O S 
E L E M E N T O S ?E L E M E N T O S ?
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 27/
é p o s s í v e l p e r c e b e r c o m c l a r e z a a s á r e a s e p o s s i b i l i d a d e s c r i a t i v a s ? é p o s s í v e l p e r c e b e r c o m c l a r e z a a s á r e a s e p o s s i b i l i d a d e s c r i a t i v a s ? 
q u e t i p o d e p e ç a g r á f i c a e s t a r i a s e n d o r e p r e s e n t a d a p e l o s g r i d s a c i m a ?q u e t i p o d e p e ç a g r á f i c a e s t a r i a s e n d o r e p r e s e n t a d a p e l o s g r i d s a c i m a ?
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 28/
g r i d s s ã o v e r s á t e i s e e s s e n c i a i s - n ã o i m p o r t a o t i p o o u f o r m a t o d a p e ç a g r á f i c ag r i d s s ã o v e r s á t e i s e e s s e n c i a i s - n ã o i m p o r t a o t i p o o u f o r m a t o d a p e ç a g r á f i c a
a t r a v é s d o g r i d , o r g a n i z a m o s : a t r a v é s d o g r i d , o r g a n i z a m o s : F O R M A e F U N Ç Ã O .F O R M A e F U N Ç Ã O .
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 29/
G R I D
a n a t o m i a d o
Cons i d e r a n d o
u m a p á g i n a
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 30/
G R I D
a n a t o m i a d o
ou P I X E L So u P I X E L S
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 31/
G R I D &
d i a g r a m a ç ã o
t i p o s
• Re t a n g u l a r e s
• C o l u n a s
• M o d u l a r
• H i e r á r q u i c o
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 32/
Consiste numa área espacial retangular central que ocupa a 
maior parte da composição, que é definida pelas margens. Essa 
área é o contentor de todo o conteúdo da obra. Mais indicado 
para casos onde leitura de grandes textos, por ser longa e 
pouco interessante visualmente, por isso precisa de uma área 
mais confortável e clara.
G R I D
r e t a n g u l a r
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 33/
Muito utilizado em publicações periódicas, como jornais, 
revistas, websites e aplicativos. Permite uma exploração 
maior do layout como elemento gráfico, se comparado ao grid 
retangular, e costuma ter uma proporção mais equilibrada de 
imagem-texto. É constituído de eixos verticais dispostos em 
forma de colunas com espaçamentos entre si. Propõe-se o que 
o alinhamento e dimensão horizontais dos elementos sejam 
delimitados pelos eixos, enquanto os atributos verticais 
tenham maior liberdade. As colunas geralmente são delimitadas 
vertical e horizontalmente pelas margens. Devido à sua 
flexibilidade, o uso do grid de colunas se tornou comum em 
diversos meios: revistas, jornais, livros e web.
G R I D e m
c o l u n a s
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 34/
O n ú m e r o d e 
c o l u n a s p o d e 
v a r i a r d e a c o r d o 
c o m a s d i m e n s õ e s 
e a f i n a l i d a d e d o 
l a y o u t q u e v o c ê 
e s t á c r i a n d o
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUTE DIREÇÃO DE ARTE 35/
O grid modular tem maior ocorrência em composições visuais 
únicas, como revistas, os pôsteres e peças publicitárias. 
Organiza a informação numa estrutura clara e concisa, porém é 
frequentemente taxado como monótono e previsível. É definido 
por eixos horizontais e verticais que criam áreas retangulares 
denominadas módulos ou áreas espaciais. Os módulos são 
delimitados, ou não, pelas margens da página. São melhores 
para controlar o tipo de informação mais complexa encontrada 
em jornais, calendários, gráficos e tabelas.
G R I D
m o d u l a r
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 36/
É o mais orgânico dos grids Sua construção se baseia no 
conteúdo - atribuindo pesos e importância ao conteúdo, 
portanto é específica para cada composição. É bastante 
aplicado nas produções contemporâneas de diversos meios: 
revistas, peças publicitárias e websites. Sua utilização 
na web se destaca, pois foi o modelo de grid que mais se 
adequou a este suporte multimídia e interativo. É construído 
por eixos de distâncias variáveis que reforçam a hierarquia 
do conteúdo. Pode ser dividido em seções. Facilita a 
hipertextualidadehipertextualidade e interatividade.
O que é HIPERTEXTO?
G R I D
h i e r á r q u i c o
Responde
aqui!
38TÉCNICO EM MULTIMÍDIA, ENSINO MÉDIO PROFº CHINA DESENVOLVER LAYOUT AULA 4 LAYOUT E DIREÇÃO DE ARTE 37/
Vamos 
exercitar?
Analise o layout dos sites abaixo 
e identifique que tipo de grid foi 
utilizado na sua composição, justifique 
sua resposta. 
» Buzzfeed
» China Filho
» Google
» Behance
» Medium
Referências desta aula
AMBROSE, Gavin; HARRIS, Paul. Grid. Porto Alegre: Bookman, 2009.
AMBROSE, Gavin. Design básico: grids. São Paulo. Bookman, 2008.
ROTOVISION, Editores. Grids: soluções criativas para designers gráficos. Porto Alegre: Bookman, 2009.
SAMARA, Timothy. Grid: construção e descontrução. São Paulo: Cosac Naify, 2007.
TONDREAU, Beth. Criar grids: 100 fundamentos de layout. São Paulo: Blucher, 2009.
RIBEIRO, Milton. Planejamento visual gráfico. Editora: LGE, 2007
LUPTON, Ellen & PHILLIPS, Jennifer Cole. Novos Fundamentos do Design. São Paulo: Cosac Naify, 2009.
SAMARA, Timothy. Elementos do Design: guia de estilo gráfico. Porto Alegre: Bookman, 2010
BELTRÃO, Hannah. Os 7 princípios do design e como aplicá-los ao criar seu site. Wix. Disponível em . Acesso em dezembro, 2020. 
BATISTA, Éricles. Um breve manual de hierarquia visual. Designerd. Disponível em . Acesso em dezembro, 2020.
IMAGENS:
Acertvo pessoal, Behance, Freepik, Flaticon, 
Google Imagens, Unsplash e Wix.
https://buzzfeed.com.br/
http://www.chinafilho.com.br/
https://www.google.com/
https://www.behance.net/galleries/graphic-design
https://medium.com/
; )