    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	
  

Fundamentos do Grid - parte 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  
  • 7.
  • 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