Depois de meses de promessa, vou tentar explicar agora passo-a-passo, como que eu faço alguns dos headers que compõe o visual do Blog do NewsErrado.

Então, sem mais delongas seguem os screenshots e alguma breve explicação.

Partindo do pressuposto que o seu photoshop já está aberto, clique em NEW [Ctrl+N] (não vou colocar a descrição de cada menu em português, pois além de não saber, me daria mais trabalho ainda, hehehhehe)

printscreen001

Vai abrir uma janelinha para especificar o tamanho, coloque tudo igual a imagem abaixo:

printscreen002

Em seguida, clique em OPEN [Ctrl+O]

printscreen003

Escolha uma imagem bem bonita.

printscreen004  printscreen005 

Copie essa imagem para dentro da janela que você tinha feito antes

printscreen006

Agora clique no "T", da barra de ferramentas, que é a função para escrever um texto. Escreva o nome do seu blog.

 printscreen007

Escolha a fonte. A do Blog do NewsErrado é a Reznor.

 printscreen008

Ajuste o tamanho. Caso queira fazer igual o nosso, siga a imagem.

printscreen009

Nessa parte eu ajustei a frase de cima do nome do blog.

 printscreen010

Agora vem um ajuste fino, de cores e efeitos na fonte. Lá na parte dos "layers", clique com o botão direito, e escolha a opção "styles". O primeiro ajuste é a cor do preenchimento da fonte.

 printscreen011

Seguindo mais ou menos esse gradiente do exemplo, fica um estilo meio "web 2.0"

 printscreen012

Logo depois eu coloco uma borda.

 printscreen013

E depois uma sombra quase imperceptível para dar um efeito mais bonito.

 printscreen014

Com o botão direito eu copio as propriedades do texto grande, para a frase pequena.

 printscreen015 printscreen016

Eu ainda ajustei mais uma vez a imagem de fundo colocando-a um pouco mais pro lado. Feito isso, vamos salvar para a web.

 printscreen017

Esse grau de compactação marcado, deixa uma qualidade boa e um tamnho pequeno de arquivo.

 printscreen018

Pronto! É só dar o nome que quer que o header tenha e tá pronto o serviço.

 printscreen019 

Uma dica importante é não esquecer de salvar o arquivo original PSD, para que os futuros headers sejam mais fáceis de fazer.

HEADER

Pronto. Divirta-se e crie vários. Se criar um para o BNE não esqueça de me enviar, pois se ficar pelo menos um pouco bonito, vai aparecer por aqui.

 

PS.: é especial pro Tonho esse post.

Postado por Tags: , , , , , , Categorias: Design, Imagem, Utilidades
778

Comentários do Facebook

Possuímos dois sistemas de comentários, você pode escolher o que mais lhe agrada. :-)


Comentários do Blog

11 Comentários

  1. Lucas disse:

    A melhor opção para salvar uma foto é a PNG (Portable Network Graphics) ela mantém 100% a qualidade e salva em um tamanho módico.

    JPEG (ou .jpg) Geralmente é utilizada em fotos salvas por camera de celulares ou cameras digitais, nao é uma alternativa muito boa para trabalho profissionais

    GIF Cria imagens animadas

    • Lucas,

      Concordo em parte contigo.
      O PNG pode ficar muito pesado se usado com fotos por exemplo. Ele é uma boa opção para desenhos e trabalhos com um degradê saliente. Mas não pode ser uma regra, pois a compactação do JPG é muito melhor se comparado.

  2. Allan disse:

    Foi mt bom o tuto que o site trouxe. Apesar do meu Photoshop ser o CS5 e em Português eu consegui fazer mais ou menos.. Olha aew o link do header que eu fiz: http://img375.imageshack.us/img375/6441/semttulo4u.png

    VALEW

  3. Bibs disse:

    gente eu fiz tudo direitinho e deu certo, mas eu não sei como salvar o arquivo original PSD D: comofas?

  4. aws disse:

    muito bom esse tutorial, mas vc sabe me dizer como eu faço para colocar quando ja se tem um outro header no blog que venho junto com a template?

  5. Toda vez que clico em “Salvar para a Web” o photoshop fecha.
    Pelo menos dessa vez eu tinha salvo em PSD antes.

  6. SE O TONHO CONSEGUIU, TODO O TRABALHO VALEU A PENA!

  7. Carol K. disse:

    Vou fazer uns magenta e lilás…rs. Mas, sério…vou fazer uns depois te mando…!Com essa super aula, fica fácil, até o Sr. antonio consegue!

  8. Matheus disse:

    Carol, essa tua dúvida vai depender da seguinte questão: é uma imagem de poucas cores (tipo um desenho), ou é uma imagem de muitas cores (tipo uma foto). O gif mantém um tamanho pequeno quando trabalhando com poucas cores. Já o JPG otimiza os pixels existentes em uma foto, sendo então a minha preferência, pois quase sempre trabalho com uma gama maior de cores. :)

  9. Carol K. disse:

    Sempre que salvo pra web, salva como gif, ou jpg. Ql´vc acha melhor…

Deixe uma resposta