SlideShare uma empresa Scribd logo
1 de 63
Grid’s
Design Editorial
Definição
• O Grid é uma estrutura geométrica
constituída por eixos (comumente horizontais
e verticais) desenvolvida para auxiliar o
alinhamento de elementos textuais e
imagéticos numa composição visual.
Classificação
• Retangular
• De colunas
• Modular
• Hierárquico
Classificação
• Retangular
• De colunas
• Modular
• Hierárquico
Classificação
• Retangular
• De colunas
• Modular
• Hierárquico
Classificação
• Retangular
• De colunas
• Modular
• Hierárquico
Classificação
• Retangular
• De colunas
• Modular
• Hierárquico
GRID DE LINHA DE BASE
Grids
SAMARA, Timothy. Grid:
construção e
desconstrução. Cosac
Naify Edições, 2008.
MASSAS VISUAIS
Design Editorial
MÃO NA MASSA
Design Editorial
Definição – Mancha
1. Densa
2. Suave
Definição – Grid
a) 3 colunas
b) 2 colunas
c) 2 colunas + 1 de apoio
d) 6 colunas
Critérios
Diagramar uma longa reportagem em 4 a 6
páginas (2 lâminas), utilizando pelo menos 8
elementos da página.
O trabalho é individual e deverá ser entregue
até as 22h do dia 11 de setembro no formato
PDF, via Moodle e impresso.
Critérios
O trabalho tem peso 4,0
distribuídos da seguinte
maneira:
• Paleta cromática:
definição criteriosa das
cores utilizadas na
proposta [0,5]
• Elementos da página:
criatividade no uso de
elementos da página
impressa [1,0]
• Mancha gráfica e grid:
uso adequado das
especificações
distribuídas em sala [1,0]
• Tipografia: criatividade e
acabamento (tracking,
kerning, entrelinha,
variações) no uso de
famílias tipográficas [1,0]
• Discussão: discussão e
aplicação de conceitos [0,5]

Mais conteúdo relacionado

Mais procurados

Aula 11 design gráfico na publicidade rough e layout
Aula 11   design gráfico na publicidade rough e layoutAula 11   design gráfico na publicidade rough e layout
Aula 11 design gráfico na publicidade rough e layoutElizeu Nascimento Silva
 
Arquitetura de informação para Interface Digital
Arquitetura de informação para Interface DigitalArquitetura de informação para Interface Digital
Arquitetura de informação para Interface DigitalMarconi Pacheco
 
Design e design gráfico
Design e design gráficoDesign e design gráfico
Design e design gráficoDeisi Motter
 
Palestra - Grid : Estudos de Caso
Palestra - Grid : Estudos de CasoPalestra - Grid : Estudos de Caso
Palestra - Grid : Estudos de CasoLuiz Agner
 
Aula 4 - Comunicação Gráfica e Design
Aula 4  - Comunicação Gráfica e DesignAula 4  - Comunicação Gráfica e Design
Aula 4 - Comunicação Gráfica e DesignCíntia Dal Bello
 
Introdução a Projeto Gráfico.
Introdução a Projeto Gráfico.Introdução a Projeto Gráfico.
Introdução a Projeto Gráfico.Wunderman
 
Projeto 21. Aula 01: 1. Design, A Palavra; 2. O Conceito; 3. A Historia; 4. D...
Projeto 21. Aula 01: 1. Design, A Palavra; 2. O Conceito; 3. A Historia; 4. D...Projeto 21. Aula 01: 1. Design, A Palavra; 2. O Conceito; 3. A Historia; 4. D...
Projeto 21. Aula 01: 1. Design, A Palavra; 2. O Conceito; 3. A Historia; 4. D...Francisco Gómez Castro
 
Teoria do design aula 01 [conceitos basicos]
Teoria do design aula 01 [conceitos basicos]Teoria do design aula 01 [conceitos basicos]
Teoria do design aula 01 [conceitos basicos]Léo Dias
 
Aula 03 design gráfico na publicidade simetria e assimetria
Aula 03   design gráfico na publicidade simetria e assimetriaAula 03   design gráfico na publicidade simetria e assimetria
Aula 03 design gráfico na publicidade simetria e assimetriaElizeu Nascimento Silva
 
Linguagem bidimensional e tridimensional
Linguagem bidimensional e tridimensionalLinguagem bidimensional e tridimensional
Linguagem bidimensional e tridimensionalKadu Sp
 
Elementos básicos do desenho
Elementos básicos do desenhoElementos básicos do desenho
Elementos básicos do desenhoSandro Bottene
 
Fundamentos do Grid - parte 1
Fundamentos do Grid - parte 1Fundamentos do Grid - parte 1
Fundamentos do Grid - parte 1renatamruiz
 
Fundamentos Super Básicos do Design 2/2
Fundamentos Super Básicos do Design 2/2Fundamentos Super Básicos do Design 2/2
Fundamentos Super Básicos do Design 2/2Fábio Gonçalves
 

Mais procurados (20)

Aula 11 design gráfico na publicidade rough e layout
Aula 11   design gráfico na publicidade rough e layoutAula 11   design gráfico na publicidade rough e layout
Aula 11 design gráfico na publicidade rough e layout
 
Aula02 planejamento grafico
Aula02 planejamento graficoAula02 planejamento grafico
Aula02 planejamento grafico
 
Arquitetura de informação para Interface Digital
Arquitetura de informação para Interface DigitalArquitetura de informação para Interface Digital
Arquitetura de informação para Interface Digital
 
Produção gráfica
Produção gráficaProdução gráfica
Produção gráfica
 
Design e design gráfico
Design e design gráficoDesign e design gráfico
Design e design gráfico
 
Aula 05 linguagem visual
Aula 05   linguagem visualAula 05   linguagem visual
Aula 05 linguagem visual
 
Palestra - Grid : Estudos de Caso
Palestra - Grid : Estudos de CasoPalestra - Grid : Estudos de Caso
Palestra - Grid : Estudos de Caso
 
Tipografia
TipografiaTipografia
Tipografia
 
Aula 4 - Comunicação Gráfica e Design
Aula 4  - Comunicação Gráfica e DesignAula 4  - Comunicação Gráfica e Design
Aula 4 - Comunicação Gráfica e Design
 
Introdução a Projeto Gráfico.
Introdução a Projeto Gráfico.Introdução a Projeto Gráfico.
Introdução a Projeto Gráfico.
 
Projeto 21. Aula 01: 1. Design, A Palavra; 2. O Conceito; 3. A Historia; 4. D...
Projeto 21. Aula 01: 1. Design, A Palavra; 2. O Conceito; 3. A Historia; 4. D...Projeto 21. Aula 01: 1. Design, A Palavra; 2. O Conceito; 3. A Historia; 4. D...
Projeto 21. Aula 01: 1. Design, A Palavra; 2. O Conceito; 3. A Historia; 4. D...
 
Teoria do design aula 01 [conceitos basicos]
Teoria do design aula 01 [conceitos basicos]Teoria do design aula 01 [conceitos basicos]
Teoria do design aula 01 [conceitos basicos]
 
Aula 03 design gráfico na publicidade simetria e assimetria
Aula 03   design gráfico na publicidade simetria e assimetriaAula 03   design gráfico na publicidade simetria e assimetria
Aula 03 design gráfico na publicidade simetria e assimetria
 
Linguagem bidimensional e tridimensional
Linguagem bidimensional e tridimensionalLinguagem bidimensional e tridimensional
Linguagem bidimensional e tridimensional
 
Introdução ao design gráfico
Introdução ao design gráficoIntrodução ao design gráfico
Introdução ao design gráfico
 
Linguagem Visual
Linguagem VisualLinguagem Visual
Linguagem Visual
 
Elementos básicos do desenho
Elementos básicos do desenhoElementos básicos do desenho
Elementos básicos do desenho
 
Tipografia
TipografiaTipografia
Tipografia
 
Fundamentos do Grid - parte 1
Fundamentos do Grid - parte 1Fundamentos do Grid - parte 1
Fundamentos do Grid - parte 1
 
Fundamentos Super Básicos do Design 2/2
Fundamentos Super Básicos do Design 2/2Fundamentos Super Básicos do Design 2/2
Fundamentos Super Básicos do Design 2/2
 

Destaque

[DIG2012] Criando um grid
[DIG2012] Criando um grid[DIG2012] Criando um grid
[DIG2012] Criando um gridEduardo Novais
 
Uso do grid_tipografico
Uso do grid_tipograficoUso do grid_tipografico
Uso do grid_tipograficoFlavio Fargas
 
Fundamentos Do Grid Parte 2
Fundamentos Do Grid Parte 2Fundamentos Do Grid Parte 2
Fundamentos Do Grid Parte 2renatamruiz
 
Aula sobre Grids - Design Visual em Jornalismo
Aula sobre Grids - Design Visual em JornalismoAula sobre Grids - Design Visual em Jornalismo
Aula sobre Grids - Design Visual em JornalismoAlysson Lisboa
 
Projeto gráfico - Livro - neemias tamura
Projeto gráfico - Livro - neemias tamuraProjeto gráfico - Livro - neemias tamura
Projeto gráfico - Livro - neemias tamuraNeemias Tamura
 
Trabalho Sobre a Superinteressante - Elementos e Técnicas de Comunicação com ...
Trabalho Sobre a Superinteressante - Elementos e Técnicas de Comunicação com ...Trabalho Sobre a Superinteressante - Elementos e Técnicas de Comunicação com ...
Trabalho Sobre a Superinteressante - Elementos e Técnicas de Comunicação com ...Ingrid Schmidt
 
AV3 - 4 sem - ROTEIRO DE ESTUDOS - 2014/2
AV3 - 4 sem - ROTEIRO DE ESTUDOS - 2014/2AV3 - 4 sem - ROTEIRO DE ESTUDOS - 2014/2
AV3 - 4 sem - ROTEIRO DE ESTUDOS - 2014/2Cíntia Dal Bello
 
A Reinvenção do Design de uma Revista para o Novo Milênio
A Reinvenção do Design de uma Revista para o Novo MilênioA Reinvenção do Design de uma Revista para o Novo Milênio
A Reinvenção do Design de uma Revista para o Novo MilênioRicardo Jordão Magalhaes
 

Destaque (20)

[DIG2012] Criando um grid
[DIG2012] Criando um grid[DIG2012] Criando um grid
[DIG2012] Criando um grid
 
Design Editorial | Estruturas
Design Editorial | EstruturasDesign Editorial | Estruturas
Design Editorial | Estruturas
 
Design Editorial | Introdução
Design Editorial | IntroduçãoDesign Editorial | Introdução
Design Editorial | Introdução
 
Design Editorial | Elementos Editoriais
Design Editorial | Elementos EditoriaisDesign Editorial | Elementos Editoriais
Design Editorial | Elementos Editoriais
 
Uso do grid_tipografico
Uso do grid_tipograficoUso do grid_tipografico
Uso do grid_tipografico
 
Fundamentos Do Grid Parte 2
Fundamentos Do Grid Parte 2Fundamentos Do Grid Parte 2
Fundamentos Do Grid Parte 2
 
Diagramação 01.3
Diagramação 01.3Diagramação 01.3
Diagramação 01.3
 
Aula sobre Grids - Design Visual em Jornalismo
Aula sobre Grids - Design Visual em JornalismoAula sobre Grids - Design Visual em Jornalismo
Aula sobre Grids - Design Visual em Jornalismo
 
Projeto gráfico - Livro - neemias tamura
Projeto gráfico - Livro - neemias tamuraProjeto gráfico - Livro - neemias tamura
Projeto gráfico - Livro - neemias tamura
 
Trabalho Sobre a Superinteressante - Elementos e Técnicas de Comunicação com ...
Trabalho Sobre a Superinteressante - Elementos e Técnicas de Comunicação com ...Trabalho Sobre a Superinteressante - Elementos e Técnicas de Comunicação com ...
Trabalho Sobre a Superinteressante - Elementos e Técnicas de Comunicação com ...
 
Aula 02
Aula 02Aula 02
Aula 02
 
Tcc_linkedin
Tcc_linkedinTcc_linkedin
Tcc_linkedin
 
AV3 - 4 sem - ROTEIRO DE ESTUDOS - 2014/2
AV3 - 4 sem - ROTEIRO DE ESTUDOS - 2014/2AV3 - 4 sem - ROTEIRO DE ESTUDOS - 2014/2
AV3 - 4 sem - ROTEIRO DE ESTUDOS - 2014/2
 
Aula05 prod grafica
Aula05 prod graficaAula05 prod grafica
Aula05 prod grafica
 
Aula05 webdesign
Aula05 webdesignAula05 webdesign
Aula05 webdesign
 
Aula13 editoracao eletronica
Aula13 editoracao eletronicaAula13 editoracao eletronica
Aula13 editoracao eletronica
 
Aula07 midia digital
Aula07 midia digitalAula07 midia digital
Aula07 midia digital
 
A Reinvenção do Design de uma Revista para o Novo Milênio
A Reinvenção do Design de uma Revista para o Novo MilênioA Reinvenção do Design de uma Revista para o Novo Milênio
A Reinvenção do Design de uma Revista para o Novo Milênio
 
Você está preparado para ser um profissional 3.0?
 Você está preparado para ser um profissional 3.0? Você está preparado para ser um profissional 3.0?
Você está preparado para ser um profissional 3.0?
 
Aula04 midia digital
Aula04 midia digitalAula04 midia digital
Aula04 midia digital
 

Mais de Davi Denardi

Revisão de Ergonomia
Revisão de ErgonomiaRevisão de Ergonomia
Revisão de ErgonomiaDavi Denardi
 
Design de informacao wireframes
Design de informacao   wireframesDesign de informacao   wireframes
Design de informacao wireframesDavi Denardi
 
Edição, espelho e diagrama
Edição, espelho e diagramaEdição, espelho e diagrama
Edição, espelho e diagramaDavi Denardi
 
Arquitetura de informação
Arquitetura de informaçãoArquitetura de informação
Arquitetura de informaçãoDavi Denardi
 
Elementos da página impressa
Elementos da página impressaElementos da página impressa
Elementos da página impressaDavi Denardi
 
Objetivos do site e necessidades dos usuários - Introdução ao marketing digital
Objetivos do site e necessidades dos usuários - Introdução ao marketing digitalObjetivos do site e necessidades dos usuários - Introdução ao marketing digital
Objetivos do site e necessidades dos usuários - Introdução ao marketing digitalDavi Denardi
 
Objetivos do site e necessidades dos usuários - SEO
Objetivos do site e necessidades dos usuários - SEOObjetivos do site e necessidades dos usuários - SEO
Objetivos do site e necessidades dos usuários - SEODavi Denardi
 
Especificações funcionais e requisitos de conteúdo
Especificações funcionais e requisitos de conteúdoEspecificações funcionais e requisitos de conteúdo
Especificações funcionais e requisitos de conteúdoDavi Denardi
 
Paleta tipográfica
Paleta tipográficaPaleta tipográfica
Paleta tipográficaDavi Denardi
 

Mais de Davi Denardi (10)

Revisão de Ergonomia
Revisão de ErgonomiaRevisão de Ergonomia
Revisão de Ergonomia
 
Design de informacao wireframes
Design de informacao   wireframesDesign de informacao   wireframes
Design de informacao wireframes
 
Edição, espelho e diagrama
Edição, espelho e diagramaEdição, espelho e diagrama
Edição, espelho e diagrama
 
Ritmo editorial
Ritmo editorialRitmo editorial
Ritmo editorial
 
Arquitetura de informação
Arquitetura de informaçãoArquitetura de informação
Arquitetura de informação
 
Elementos da página impressa
Elementos da página impressaElementos da página impressa
Elementos da página impressa
 
Objetivos do site e necessidades dos usuários - Introdução ao marketing digital
Objetivos do site e necessidades dos usuários - Introdução ao marketing digitalObjetivos do site e necessidades dos usuários - Introdução ao marketing digital
Objetivos do site e necessidades dos usuários - Introdução ao marketing digital
 
Objetivos do site e necessidades dos usuários - SEO
Objetivos do site e necessidades dos usuários - SEOObjetivos do site e necessidades dos usuários - SEO
Objetivos do site e necessidades dos usuários - SEO
 
Especificações funcionais e requisitos de conteúdo
Especificações funcionais e requisitos de conteúdoEspecificações funcionais e requisitos de conteúdo
Especificações funcionais e requisitos de conteúdo
 
Paleta tipográfica
Paleta tipográficaPaleta tipográfica
Paleta tipográfica
 

Grid