• Trabalhei na Editora Gráfica do colégio e curso GPI
   como designer gráfico e como supervisor da

   equipe de criação/diagramação;

• Formado em Webdesigner pelo SENAC-RJ;

• Sou freelancer há 4 anos e tenho 8 clientes fixos;

• Participei da criação de mais 70 projetos web;
• E desde o final de 2009 todos os meus projetos são
   focados em negócio utilizando o CMS WordPress;

• À partir daí, eu criei mais de 10 temas exclusivos;
   (Nesse momento tenho 3 temas em desenvolvimento)

• E personalizei um pouco mais de 15 temas Premium
   editando XHTML/CSS de acordo com o projeto.
• Meus PSD’s tinham muitos efeitos
   desnecessários;

• Nenhum elemento era renomeado;

• Estrutura de elementos era
   desorganizada e pouco intuitiva;

• E depois do site finalizado, fazer
   atualização no documento era muito
   difícil e pouco produtiva.
Equipe GPI
(2002/2007)
Agente
Comunicação
(2007)
• Linha de produção por Henry Ford;

• Troca de experiência entre setores;
• Renomeie TODAS as camadas (layers)
  e pastas (folders);

• Use nomes que façam sentido para
  as sessões do layout;
• Crie pastas para as sessões do layout;

• Organize as pastas de cima para baixo

   acompanhando o layout;

• Separe as pastas por cores. Isso ajuda
   a identificação das sessões;
• Nunca redimensione o tamanho dos
   ícones;

• Se for usar banco de ícones, faça a
   busca no tamanho exato necessário;
1.   Mesclar elementos para evitar
     manipulação dos efeitos;

2.   Documente os estilos do layout;

3.   Recomendo o uso do Dropbox para
     a troca de arquivos;

4.   Revise tudo antes de passar os
     arquivos ao desenvolvedor né!? ;-)
1.   Mesclar elementos para evitar
     manipulação dos efeitos;
2.   Documente os estilos do layout;
3.   Recomendo o uso do Dropbox para
     a troca de arquivos;
• Meu artigo sobre o tema
  http://www.minim.in/1vS
• Slide do @Bernarddeluna e @victormontalvao
  no 15º EDTED da Arteccom
  http://www.minim.in/1Pr
• Icon Finder
  http://www.minim.in/1Pt
• Pencil Sketching
  http://www.minim.in/II
• 960 Grid System
  http://www.minim.in/1Ps

Criando temas em PSD pensando no Front-end e Back-end

  • 3.
    • Trabalhei naEditora Gráfica do colégio e curso GPI como designer gráfico e como supervisor da equipe de criação/diagramação; • Formado em Webdesigner pelo SENAC-RJ; • Sou freelancer há 4 anos e tenho 8 clientes fixos; • Participei da criação de mais 70 projetos web;
  • 4.
    • E desdeo final de 2009 todos os meus projetos são focados em negócio utilizando o CMS WordPress; • À partir daí, eu criei mais de 10 temas exclusivos; (Nesse momento tenho 3 temas em desenvolvimento) • E personalizei um pouco mais de 15 temas Premium editando XHTML/CSS de acordo com o projeto.
  • 5.
    • Meus PSD’stinham muitos efeitos desnecessários; • Nenhum elemento era renomeado; • Estrutura de elementos era desorganizada e pouco intuitiva; • E depois do site finalizado, fazer atualização no documento era muito difícil e pouco produtiva.
  • 7.
  • 8.
  • 10.
    • Linha deprodução por Henry Ford; • Troca de experiência entre setores;
  • 15.
    • Renomeie TODASas camadas (layers) e pastas (folders); • Use nomes que façam sentido para as sessões do layout;
  • 16.
    • Crie pastaspara as sessões do layout; • Organize as pastas de cima para baixo acompanhando o layout; • Separe as pastas por cores. Isso ajuda a identificação das sessões;
  • 17.
    • Nunca redimensioneo tamanho dos ícones; • Se for usar banco de ícones, faça a busca no tamanho exato necessário;
  • 21.
    1. Mesclar elementos para evitar manipulação dos efeitos; 2. Documente os estilos do layout; 3. Recomendo o uso do Dropbox para a troca de arquivos; 4. Revise tudo antes de passar os arquivos ao desenvolvedor né!? ;-)
  • 22.
    1. Mesclar elementos para evitar manipulação dos efeitos;
  • 23.
    2. Documente os estilos do layout;
  • 24.
    3. Recomendo o uso do Dropbox para a troca de arquivos;
  • 28.
    • Meu artigosobre o tema http://www.minim.in/1vS • Slide do @Bernarddeluna e @victormontalvao no 15º EDTED da Arteccom http://www.minim.in/1Pr • Icon Finder http://www.minim.in/1Pt • Pencil Sketching http://www.minim.in/II • 960 Grid System http://www.minim.in/1Ps