SlideShare une entreprise Scribd logo
1  sur  10
Télécharger pour lire hors ligne
    Todo o trabalho de design envolve a solução de
     problemas visuais e de organização de elementos:

                           Blocos	
  de	
  
                           texto	
  
     Imagens	
                                Tabelas	
  
Vantagens	
  
Introduz	
  uma	
  ordem	
  sistemá8ca	
  no	
  Layout	
  
       Diferencia	
  8pos	
  de	
  informação	
  

                  Facilita	
  a	
  leitura	
  

           Rapidez	
  na	
  diagramação	
  

Vários	
  colaboradores	
  no	
  mesmo	
  projeto	
  
Construir	
  um	
  grid	
  eficaz	
  
    significa	
  destrinchar	
  seu	
  
 conteúdo	
  em	
  termos	
  de	
  suas	
  
qualidades	
  visuais	
  e	
  semân8cas	
  
   de	
  seu	
  espaço	
  8pográfico	
  
O	
  projeto	
  de	
  um	
  grid	
  depende	
  de	
  duas	
  fases	
  de	
  desenvolvimento:	
  


                               Primeira	
  fase	
  
     Avaliação	
  das	
  caracterís8cas	
  informa8vas	
  e	
  as	
  exigências	
  de	
  
                              produção	
  do	
  material	
  

                 Prevenção	
  de	
  eventuais	
  problemas	
  como:	
  
                        Títulos	
  compridos	
  demais	
  
                               Cortes	
  de	
  imagens	
  
                    Espaços	
  vazios	
  por	
  falta	
  de	
  material	
  
O	
  projeto	
  de	
  um	
  grid	
  depende	
  de	
  duas	
  fases	
  de	
  desenvolvimento:	
  


                               Segunda	
  fase	
  
Dispor	
  o	
  conteúdo	
  de	
  acordo	
  com	
  as	
  diretrizes	
  montadas	
  no	
  grid	
  
           O	
  grid	
  NUNCA	
  pode	
  prevalecer	
  sobre	
  a	
  informação	
  

      Oferecer	
  uma	
  unidade	
  geral	
  sem	
  destruir	
  a	
  viltalidade	
  da	
  
                                composição	
  
                       Variedade	
  de	
  soluções	
  inesgotável	
  
Elementos	
  do	
  Grid	
  
Um	
  grid	
  é	
  formado	
  por	
  

 Colunas	
                           Módulos	
  

Margens	
                           Guias	
  
                                  horizontais	
  
 Zonas	
  
                                 Marcadores	
  
espaciais	
  
Margens	
  
 Colunas	
  



               Guias	
  



               Zonas	
  
               espaciais	
  
Módulos	
  

               Marcadores	
  
Colunas	
  –	
  Alinhamentos	
  ver8cais	
  que	
  criam	
  divisões	
  horizontais	
  entre	
  as	
  margens	
  

Módulos	
  –	
  Unidades	
  individuais	
  de	
  espaço	
  separadas	
  por	
  intervalos	
  regulares	
  

Marcadores	
  :	
  Indicadores	
  de	
  Localização	
  

Zonas	
  espaciais:	
  Grupos	
  de	
  módulos,	
  que	
  juntos,	
  formam	
  campos	
  dis8ntos.	
  
Cada	
  campo	
  pode	
  receber	
  uma	
  função	
  específica	
  .	
  Ex:	
  Imagens	
  ou	
  	
  bloco	
  de	
  texto	
  

Guias	
  horizontais:	
  Alinhamento	
  para	
  orientação	
  dos	
  olhos	
  no	
  formato	
  

Margens	
  :	
  Espaços	
  “nega8vos”	
  entre	
  o	
  limite	
  da	
  página	
  e	
  o	
  conteúdo	
  

Contenu connexe

Tendances

PLANO DE ENSINO - EDITORAÇÃO ELETRONICA
PLANO DE ENSINO - EDITORAÇÃO ELETRONICAPLANO DE ENSINO - EDITORAÇÃO ELETRONICA
PLANO DE ENSINO - EDITORAÇÃO ELETRONICA
aulasdejornalismo
 
Arquitetura de Informação - Sistemas de Navegação
Arquitetura de Informação - Sistemas de NavegaçãoArquitetura de Informação - Sistemas de Navegação
Arquitetura de Informação - Sistemas de Navegação
pospipoca
 

Tendances (20)

PLANO DE ENSINO - EDITORAÇÃO ELETRONICA
PLANO DE ENSINO - EDITORAÇÃO ELETRONICAPLANO DE ENSINO - EDITORAÇÃO ELETRONICA
PLANO DE ENSINO - EDITORAÇÃO ELETRONICA
 
Aula 6 - Design e Processo de Design de Interfaces de Usuário
Aula 6 - Design e Processo de Design de Interfaces de UsuárioAula 6 - Design e Processo de Design de Interfaces de Usuário
Aula 6 - Design e Processo de Design de Interfaces de Usuário
 
Palestra - Grid : Estudos de Caso
Palestra - Grid : Estudos de CasoPalestra - Grid : Estudos de Caso
Palestra - Grid : Estudos de Caso
 
Projeto Gráfico | Pictogramas
Projeto Gráfico | PictogramasProjeto Gráfico | Pictogramas
Projeto Gráfico | Pictogramas
 
Arquitetura de Informação - Sistemas de Navegação
Arquitetura de Informação - Sistemas de NavegaçãoArquitetura de Informação - Sistemas de Navegação
Arquitetura de Informação - Sistemas de Navegação
 
O que é Arquitetura de Informação e UX Design: visão de uma bibliotecária inf...
O que é Arquitetura de Informação e UX Design: visão de uma bibliotecária inf...O que é Arquitetura de Informação e UX Design: visão de uma bibliotecária inf...
O que é Arquitetura de Informação e UX Design: visão de uma bibliotecária inf...
 
Composição e Diagramação
Composição e DiagramaçãoComposição e Diagramação
Composição e Diagramação
 
Aula01 conceito design
Aula01 conceito designAula01 conceito design
Aula01 conceito design
 
Aula 3. frameworks front end
Aula 3. frameworks front endAula 3. frameworks front end
Aula 3. frameworks front end
 
Diagramação de revistas
Diagramação de revistasDiagramação de revistas
Diagramação de revistas
 
UX - UI DESIGN / MÉTODOS
UX - UI DESIGN / MÉTODOSUX - UI DESIGN / MÉTODOS
UX - UI DESIGN / MÉTODOS
 
Introdução ao CSS
Introdução ao CSSIntrodução ao CSS
Introdução ao CSS
 
Design Editorial | Estruturas
Design Editorial | EstruturasDesign Editorial | Estruturas
Design Editorial | Estruturas
 
Metodologia do Design 01
Metodologia do Design 01Metodologia do Design 01
Metodologia do Design 01
 
Projecto e Produção Multimédia
Projecto e Produção MultimédiaProjecto e Produção Multimédia
Projecto e Produção Multimédia
 
Usabilidade aula-01 Introdução
Usabilidade aula-01 IntroduçãoUsabilidade aula-01 Introdução
Usabilidade aula-01 Introdução
 
Noções de Design Gráfico
Noções de Design GráficoNoções de Design Gráfico
Noções de Design Gráfico
 
Direção de Arte Publicitária - Intro
Direção de Arte Publicitária - IntroDireção de Arte Publicitária - Intro
Direção de Arte Publicitária - Intro
 
METODOLOGIA DE DESIGN
METODOLOGIA DE DESIGNMETODOLOGIA DE DESIGN
METODOLOGIA DE DESIGN
 
Design Editorial | Elementos Editoriais
Design Editorial | Elementos EditoriaisDesign Editorial | Elementos Editoriais
Design Editorial | Elementos Editoriais
 

En vedette

Fundamentos Do Grid Parte 2
Fundamentos Do Grid Parte 2Fundamentos Do Grid Parte 2
Fundamentos Do Grid Parte 2
renatamruiz
 
[DIG2012] Criando um grid
[DIG2012] Criando um grid[DIG2012] Criando um grid
[DIG2012] Criando um grid
Eduardo Novais
 
4 principios planejamento visual
4 principios planejamento visual4 principios planejamento visual
4 principios planejamento visual
renatamruiz
 
Fundamentos de um bom layout
Fundamentos de um bom layoutFundamentos de um bom layout
Fundamentos de um bom layout
renatamruiz
 
Um pouco de arte parte 1
Um pouco de arte parte 1Um pouco de arte parte 1
Um pouco de arte parte 1
renatamruiz
 
Um pouco de arte parte 2
Um pouco de arte parte 2Um pouco de arte parte 2
Um pouco de arte parte 2
renatamruiz
 
Um pouco de arte parte 3
Um pouco de arte parte 3Um pouco de arte parte 3
Um pouco de arte parte 3
renatamruiz
 
Planejamento gráfico editorial
Planejamento gráfico editorialPlanejamento gráfico editorial
Planejamento gráfico editorial
Atitude Digital
 
Cores E TransparêNcias
Cores E TransparêNciasCores E TransparêNcias
Cores E TransparêNcias
renatamruiz
 
Projeto gráfico - Livro - neemias tamura
Projeto gráfico - Livro - neemias tamuraProjeto gráfico - Livro - neemias tamura
Projeto gráfico - Livro - neemias tamura
Neemias Tamura
 
Análise Planejamento Gráfico - Jornal O Globo
Análise Planejamento Gráfico - Jornal O GloboAnálise Planejamento Gráfico - Jornal O Globo
Análise Planejamento Gráfico - Jornal O Globo
Edenilton Santos
 

En vedette (20)

Fundamentos Do Grid Parte 2
Fundamentos Do Grid Parte 2Fundamentos Do Grid Parte 2
Fundamentos Do Grid Parte 2
 
[DIG2012] Criando um grid
[DIG2012] Criando um grid[DIG2012] Criando um grid
[DIG2012] Criando um grid
 
4 principios planejamento visual
4 principios planejamento visual4 principios planejamento visual
4 principios planejamento visual
 
Fundamentos de um bom layout
Fundamentos de um bom layoutFundamentos de um bom layout
Fundamentos de um bom layout
 
Cor
CorCor
Cor
 
Um pouco de arte parte 1
Um pouco de arte parte 1Um pouco de arte parte 1
Um pouco de arte parte 1
 
Um pouco de arte parte 2
Um pouco de arte parte 2Um pouco de arte parte 2
Um pouco de arte parte 2
 
Um pouco de arte parte 3
Um pouco de arte parte 3Um pouco de arte parte 3
Um pouco de arte parte 3
 
Design Editorial | Introdução
Design Editorial | IntroduçãoDesign Editorial | Introdução
Design Editorial | Introdução
 
Planejamento gráfico editorial
Planejamento gráfico editorialPlanejamento gráfico editorial
Planejamento gráfico editorial
 
Grid
GridGrid
Grid
 
Projeto Livro: design guideline e estratégias
Projeto Livro: design guideline e estratégiasProjeto Livro: design guideline e estratégias
Projeto Livro: design guideline e estratégias
 
Diagramação de Jornais
Diagramação de JornaisDiagramação de Jornais
Diagramação de Jornais
 
PG Aula 2
PG Aula 2PG Aula 2
PG Aula 2
 
Cores E TransparêNcias
Cores E TransparêNciasCores E TransparêNcias
Cores E TransparêNcias
 
Um pouco de arte - parte I
Um pouco de arte - parte IUm pouco de arte - parte I
Um pouco de arte - parte I
 
E-books e Grids Adaptativas (Design Responsive)
E-books e Grids Adaptativas (Design Responsive)E-books e Grids Adaptativas (Design Responsive)
E-books e Grids Adaptativas (Design Responsive)
 
Um Pouco De Arte Parte II
Um Pouco De Arte Parte IIUm Pouco De Arte Parte II
Um Pouco De Arte Parte II
 
Projeto gráfico - Livro - neemias tamura
Projeto gráfico - Livro - neemias tamuraProjeto gráfico - Livro - neemias tamura
Projeto gráfico - Livro - neemias tamura
 
Análise Planejamento Gráfico - Jornal O Globo
Análise Planejamento Gráfico - Jornal O GloboAnálise Planejamento Gráfico - Jornal O Globo
Análise Planejamento Gráfico - Jornal O Globo
 

Similaire à Fundamentos do Grid - parte 1

06-engenharia de softwere Análise e Projeto de Software.docx
06-engenharia de softwere Análise e Projeto de Software.docx06-engenharia de softwere Análise e Projeto de Software.docx
06-engenharia de softwere Análise e Projeto de Software.docx
JulioCesar371362
 
Visão Geral Arquiteturade Software
Visão Geral Arquiteturade SoftwareVisão Geral Arquiteturade Software
Visão Geral Arquiteturade Software
elliando dias
 
Banco de Dados Ágeis e Refatoração
Banco de Dados Ágeis e RefatoraçãoBanco de Dados Ágeis e Refatoração
Banco de Dados Ágeis e Refatoração
elliando dias
 

Similaire à Fundamentos do Grid - parte 1 (20)

Grid
GridGrid
Grid
 
Padrões de projetos
Padrões de projetosPadrões de projetos
Padrões de projetos
 
DDD – Domain Driven Design
DDD – Domain Driven DesignDDD – Domain Driven Design
DDD – Domain Driven Design
 
JAVA REFLETCION
JAVA REFLETCIONJAVA REFLETCION
JAVA REFLETCION
 
Gateway de linha de dados
Gateway de linha de dadosGateway de linha de dados
Gateway de linha de dados
 
06-engenharia de softwere Análise e Projeto de Software.docx
06-engenharia de softwere Análise e Projeto de Software.docx06-engenharia de softwere Análise e Projeto de Software.docx
06-engenharia de softwere Análise e Projeto de Software.docx
 
Bancos de Dados Geográficos
Bancos de Dados GeográficosBancos de Dados Geográficos
Bancos de Dados Geográficos
 
Desenvolvimento web com vs2012: Uma visão geral
Desenvolvimento web com vs2012: Uma visão geralDesenvolvimento web com vs2012: Uma visão geral
Desenvolvimento web com vs2012: Uma visão geral
 
Indo alem do_mvc_node_js
Indo alem do_mvc_node_jsIndo alem do_mvc_node_js
Indo alem do_mvc_node_js
 
Arquiteturas de sistemas reais
Arquiteturas de sistemas reaisArquiteturas de sistemas reais
Arquiteturas de sistemas reais
 
Asp net mvc
Asp net mvcAsp net mvc
Asp net mvc
 
Visão Geral Arquiteturade Software
Visão Geral Arquiteturade SoftwareVisão Geral Arquiteturade Software
Visão Geral Arquiteturade Software
 
Zachman framework
Zachman frameworkZachman framework
Zachman framework
 
Um guia bem básico de Bootstrap + Less
Um guia bem básico de Bootstrap + LessUm guia bem básico de Bootstrap + Less
Um guia bem básico de Bootstrap + Less
 
HTML/CSS Patterns
HTML/CSS PatternsHTML/CSS Patterns
HTML/CSS Patterns
 
Arquitetura Limpa @ 32º CocoaTalks BH
Arquitetura Limpa @ 32º CocoaTalks BHArquitetura Limpa @ 32º CocoaTalks BH
Arquitetura Limpa @ 32º CocoaTalks BH
 
Aula07 - Sistemas Distribuídos - Aula de Revisão da NP1
Aula07 - Sistemas Distribuídos - Aula de Revisão da NP1Aula07 - Sistemas Distribuídos - Aula de Revisão da NP1
Aula07 - Sistemas Distribuídos - Aula de Revisão da NP1
 
Modelagem e elaboração de componentes
Modelagem e elaboração de componentesModelagem e elaboração de componentes
Modelagem e elaboração de componentes
 
Banco de Dados Ágeis e Refatoração
Banco de Dados Ágeis e RefatoraçãoBanco de Dados Ágeis e Refatoração
Banco de Dados Ágeis e Refatoração
 
Corbawebserves
CorbawebservesCorbawebserves
Corbawebserves
 

Plus de renatamruiz

Plus de renatamruiz (19)

Palestra espm
Palestra espmPalestra espm
Palestra espm
 
Blogs de moda: um fenômeno
Blogs de moda: um fenômenoBlogs de moda: um fenômeno
Blogs de moda: um fenômeno
 
Palestra joinville
Palestra joinvillePalestra joinville
Palestra joinville
 
Palestra jaraguá
Palestra jaraguáPalestra jaraguá
Palestra jaraguá
 
Processos de impressao
Processos de impressaoProcessos de impressao
Processos de impressao
 
Como escrever na web
Como escrever na webComo escrever na web
Como escrever na web
 
Arquitetura de informação
Arquitetura de informaçãoArquitetura de informação
Arquitetura de informação
 
Aula publicidade internet
Aula publicidade internetAula publicidade internet
Aula publicidade internet
 
Publicidade na internet
Publicidade na internetPublicidade na internet
Publicidade na internet
 
Comunicacao Digital
Comunicacao DigitalComunicacao Digital
Comunicacao Digital
 
Alguns conceitos - Mídias Sociais
Alguns conceitos - Mídias SociaisAlguns conceitos - Mídias Sociais
Alguns conceitos - Mídias Sociais
 
Diagramação
DiagramaçãoDiagramação
Diagramação
 
Teoria Das Cores
Teoria Das  CoresTeoria Das  Cores
Teoria Das Cores
 
Tipologia
TipologiaTipologia
Tipologia
 
Planej Visual Os Quatros PrincíPios BáSicos
Planej Visual   Os Quatros PrincíPios BáSicosPlanej Visual   Os Quatros PrincíPios BáSicos
Planej Visual Os Quatros PrincíPios BáSicos
 
Principios Design
Principios DesignPrincipios Design
Principios Design
 
Um Pouco De Arte Parte III
Um Pouco De Arte Parte IIIUm Pouco De Arte Parte III
Um Pouco De Arte Parte III
 
Moda Para Usar
Moda Para UsarModa Para Usar
Moda Para Usar
 
Mídias Digitais - Aula 1
Mídias Digitais - Aula 1Mídias Digitais - Aula 1
Mídias Digitais - Aula 1
 

Dernier

8 Aula de predicado verbal e nominal - Predicativo do sujeito
8 Aula de predicado verbal e nominal - Predicativo do sujeito8 Aula de predicado verbal e nominal - Predicativo do sujeito
8 Aula de predicado verbal e nominal - Predicativo do sujeito
tatianehilda
 
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...
PatriciaCaetano18
 
SSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffff
SSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffffSSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffff
SSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffff
NarlaAquino
 
Teoria heterotrófica e autotrófica dos primeiros seres vivos..pptx
Teoria heterotrófica e autotrófica dos primeiros seres vivos..pptxTeoria heterotrófica e autotrófica dos primeiros seres vivos..pptx
Teoria heterotrófica e autotrófica dos primeiros seres vivos..pptx
TailsonSantos1
 
Os editoriais, reportagens e entrevistas.pptx
Os editoriais, reportagens e entrevistas.pptxOs editoriais, reportagens e entrevistas.pptx
Os editoriais, reportagens e entrevistas.pptx
TailsonSantos1
 
matematica aula didatica prática e tecni
matematica aula didatica prática e tecnimatematica aula didatica prática e tecni
matematica aula didatica prática e tecni
CleidianeCarvalhoPer
 

Dernier (20)

E a chuva ... (Livro pedagógico para ser usado na educação infantil e trabal...
E a chuva ...  (Livro pedagógico para ser usado na educação infantil e trabal...E a chuva ...  (Livro pedagógico para ser usado na educação infantil e trabal...
E a chuva ... (Livro pedagógico para ser usado na educação infantil e trabal...
 
Recomposiçao em matematica 1 ano 2024 - ESTUDANTE 1ª série.pdf
Recomposiçao em matematica 1 ano 2024 - ESTUDANTE 1ª série.pdfRecomposiçao em matematica 1 ano 2024 - ESTUDANTE 1ª série.pdf
Recomposiçao em matematica 1 ano 2024 - ESTUDANTE 1ª série.pdf
 
PROJETO DE EXTENSÃO I - TERAPIAS INTEGRATIVAS E COMPLEMENTARES.pdf
PROJETO DE EXTENSÃO I - TERAPIAS INTEGRATIVAS E COMPLEMENTARES.pdfPROJETO DE EXTENSÃO I - TERAPIAS INTEGRATIVAS E COMPLEMENTARES.pdf
PROJETO DE EXTENSÃO I - TERAPIAS INTEGRATIVAS E COMPLEMENTARES.pdf
 
8 Aula de predicado verbal e nominal - Predicativo do sujeito
8 Aula de predicado verbal e nominal - Predicativo do sujeito8 Aula de predicado verbal e nominal - Predicativo do sujeito
8 Aula de predicado verbal e nominal - Predicativo do sujeito
 
Projeto de Extensão - DESENVOLVIMENTO BACK-END.pdf
Projeto de Extensão - DESENVOLVIMENTO BACK-END.pdfProjeto de Extensão - DESENVOLVIMENTO BACK-END.pdf
Projeto de Extensão - DESENVOLVIMENTO BACK-END.pdf
 
Produção de Texto - 5º ano - CRÔNICA.pptx
Produção de Texto - 5º ano - CRÔNICA.pptxProdução de Texto - 5º ano - CRÔNICA.pptx
Produção de Texto - 5º ano - CRÔNICA.pptx
 
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...
 
aula de bioquímica bioquímica dos carboidratos.ppt
aula de bioquímica bioquímica dos carboidratos.pptaula de bioquímica bioquímica dos carboidratos.ppt
aula de bioquímica bioquímica dos carboidratos.ppt
 
Seminário Biologia e desenvolvimento da matrinxa.pptx
Seminário Biologia e desenvolvimento da matrinxa.pptxSeminário Biologia e desenvolvimento da matrinxa.pptx
Seminário Biologia e desenvolvimento da matrinxa.pptx
 
PROJETO DE EXTENÇÃO - GESTÃO DE RECURSOS HUMANOS.pdf
PROJETO DE EXTENÇÃO - GESTÃO DE RECURSOS HUMANOS.pdfPROJETO DE EXTENÇÃO - GESTÃO DE RECURSOS HUMANOS.pdf
PROJETO DE EXTENÇÃO - GESTÃO DE RECURSOS HUMANOS.pdf
 
Slides Lição 05, Central Gospel, A Grande Tribulação, 1Tr24.pptx
Slides Lição 05, Central Gospel, A Grande Tribulação, 1Tr24.pptxSlides Lição 05, Central Gospel, A Grande Tribulação, 1Tr24.pptx
Slides Lição 05, Central Gospel, A Grande Tribulação, 1Tr24.pptx
 
SSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffff
SSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffffSSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffff
SSE_BQ_Matematica_4A_SR.pdfffffffffffffffffffffffffffffffffff
 
migração e trabalho 2º ano.pptx fenomenos
migração e trabalho 2º ano.pptx fenomenosmigração e trabalho 2º ano.pptx fenomenos
migração e trabalho 2º ano.pptx fenomenos
 
Projeto de Extensão - ENGENHARIA DE SOFTWARE - BACHARELADO.pdf
Projeto de Extensão - ENGENHARIA DE SOFTWARE - BACHARELADO.pdfProjeto de Extensão - ENGENHARIA DE SOFTWARE - BACHARELADO.pdf
Projeto de Extensão - ENGENHARIA DE SOFTWARE - BACHARELADO.pdf
 
Jogo de Rimas - Para impressão em pdf a ser usado para crianças
Jogo de Rimas - Para impressão em pdf a ser usado para criançasJogo de Rimas - Para impressão em pdf a ser usado para crianças
Jogo de Rimas - Para impressão em pdf a ser usado para crianças
 
Teoria heterotrófica e autotrófica dos primeiros seres vivos..pptx
Teoria heterotrófica e autotrófica dos primeiros seres vivos..pptxTeoria heterotrófica e autotrófica dos primeiros seres vivos..pptx
Teoria heterotrófica e autotrófica dos primeiros seres vivos..pptx
 
PROJETO DE EXTENSÃO I - AGRONOMIA.pdf AGRONOMIAAGRONOMIA
PROJETO DE EXTENSÃO I - AGRONOMIA.pdf AGRONOMIAAGRONOMIAPROJETO DE EXTENSÃO I - AGRONOMIA.pdf AGRONOMIAAGRONOMIA
PROJETO DE EXTENSÃO I - AGRONOMIA.pdf AGRONOMIAAGRONOMIA
 
Os editoriais, reportagens e entrevistas.pptx
Os editoriais, reportagens e entrevistas.pptxOs editoriais, reportagens e entrevistas.pptx
Os editoriais, reportagens e entrevistas.pptx
 
matematica aula didatica prática e tecni
matematica aula didatica prática e tecnimatematica aula didatica prática e tecni
matematica aula didatica prática e tecni
 
Araribá slides 9ano.pdf para os alunos do medio
Araribá slides 9ano.pdf para os alunos do medioAraribá slides 9ano.pdf para os alunos do medio
Araribá slides 9ano.pdf para os alunos do medio
 

Fundamentos do Grid - parte 1

  • 1.
  • 2.   Todo o trabalho de design envolve a solução de problemas visuais e de organização de elementos: Blocos  de   texto   Imagens   Tabelas  
  • 3. Vantagens   Introduz  uma  ordem  sistemá8ca  no  Layout   Diferencia  8pos  de  informação   Facilita  a  leitura   Rapidez  na  diagramação   Vários  colaboradores  no  mesmo  projeto  
  • 4. Construir  um  grid  eficaz   significa  destrinchar  seu   conteúdo  em  termos  de  suas   qualidades  visuais  e  semân8cas   de  seu  espaço  8pográfico  
  • 5. O  projeto  de  um  grid  depende  de  duas  fases  de  desenvolvimento:   Primeira  fase   Avaliação  das  caracterís8cas  informa8vas  e  as  exigências  de   produção  do  material   Prevenção  de  eventuais  problemas  como:   Títulos  compridos  demais   Cortes  de  imagens   Espaços  vazios  por  falta  de  material  
  • 6. O  projeto  de  um  grid  depende  de  duas  fases  de  desenvolvimento:   Segunda  fase   Dispor  o  conteúdo  de  acordo  com  as  diretrizes  montadas  no  grid   O  grid  NUNCA  pode  prevalecer  sobre  a  informação   Oferecer  uma  unidade  geral  sem  destruir  a  viltalidade  da   composição   Variedade  de  soluções  inesgotável  
  • 8. Um  grid  é  formado  por   Colunas   Módulos   Margens   Guias   horizontais   Zonas   Marcadores   espaciais  
  • 9. Margens   Colunas   Guias   Zonas   espaciais   Módulos   Marcadores  
  • 10. Colunas  –  Alinhamentos  ver8cais  que  criam  divisões  horizontais  entre  as  margens   Módulos  –  Unidades  individuais  de  espaço  separadas  por  intervalos  regulares   Marcadores  :  Indicadores  de  Localização   Zonas  espaciais:  Grupos  de  módulos,  que  juntos,  formam  campos  dis8ntos.   Cada  campo  pode  receber  uma  função  específica  .  Ex:  Imagens  ou    bloco  de  texto   Guias  horizontais:  Alinhamento  para  orientação  dos  olhos  no  formato   Margens  :  Espaços  “nega8vos”  entre  o  limite  da  página  e  o  conteúdo