Eu faço assim: salvando as imagens para web

Lá nos bastidores do blog a gente tá sempre falando de photoshop e de como ele é engraçado às vezes. Já reparou como existem zilhões de formas de se chegar num mesmo efeito usando este software? E, dependendo da percepção de cada pessoa, algumas coisas são mais simples ou mais complicadas. Trocando figurinha com as meninas, eu vivo descobrindo coisas novas e aprendendo truques que facilitam muito a minha vida de scrapper. Às vezes eu ensino também e a troca de experiência é bem enriquecedora. Por isso… a gente resolveu iniciar uma série de posts para mostrar como cada uma de nós executa determinada tarefa no photoshop – como eu fiz no dupla inspiração da semana passada, mostrando as técnicas diferentes da Mic e da Aninha Reis para aplicar o stroke. Acho que vai rolar uma troca bem bacana, pois vocês também vão compartilhar com a gente o que sabem a respeito de cada assunto abordado!

O primeiro tema da nossa série, como eu coloquei ali em cima, é salvar as imagens para a web. Quem participa de fóruns e está sempre publicando seus trabalhos em fóruns e galerias on line, sabe que existem uns macetes que fazem toda a diferença na hora de salvar seu arquivo. Conversando com as meninas da equipe percebi que o procedimento usado por cada uma é basicamente o mesmo e se constitui em mesclar as camadas, redimensionar a imagem, aplicar o efeito sharpen e, por fim, salvar o arquivo.

Passo a passo:

1 – antes de iniciar, crie uma cópia do seu .psd clicando em Image / Duplicate… para evitar que você salve seu arquivo em baixa resolução por engano.

2 – Mescle as camadas usando o comando Flatten Image do menu Layer.

bsaveweb1.jpg

3 – Aperte as teclas Alt+Ctrl+I (ou vá em Image / Image Size…) e configure as dimensões desejadas para o seu arquivo.

saveweb3.jpg

4 – Quando você redimensiona o arquivo, sua imagem perde bastante da nitidez, problema que pode ser resolvido através do comando sharpen. Existem várias formas de fazer, com resultados diferentes. Escolha o que mais lhe agrada.

a) Você pode aplicar o sharpen direto na hora do redimensionamento, em Image / Image size… basta escolher a opção Bicubic Sharper no campo Resample Image.

bsaveweb2.jpg

b) A Dani prefere usar o Smart Sharpen (Filter / Sharpen / Smart Sharpen) e configurar os parâmetros do efeito. Você pode visualizar os settings que a Dani geralmente usa através da figura abaixo:

saveweb21.jpg

c) Eu já gosto de usar o Sharpen automático do photoshop mesmo em Filter / Sharpen / Sharpen. A diferença é realmente muito grande, como vocês podem ver na imagem comparativa abaixo. Repare como os elementos e o journaling ficam bem mais nítidos, todos os detalhes ressaltam.

bsaveweb3.jpg

5 – Prá salvar o arquivo utilize a opção Save for Web, encontrada no menu File. Uma janela igual a esta se abrirá, na qual você poderá ajustar a qualidade do .jpeg em função do tamanho em kB que você precisa para seu arquivo. As galerias geralmente suportam 150kB.

bsaveweb5.jpg

Action free

Como este é um processo bem repetitivo e chatinho de se fazer, você pode criar uma action para fazer tudo isso em apenas um clique do mouse. Eu criei um set que inclui o redimensionamento das imagens para quatro tamanhos diferentes: 500px, 550px, 600px e 700px. A action possui o seguinte PAP: duplicate image / flatten image / resize / sharpen (automático) / save for web (com opção para vc ajustar a qualidade e nomear o arquivo) / close.

Sinta-se a vontade para FAZER O DOWNLOAD da action. Não é necessário dar crédito nenhum para mim na hora de upar os layouts nas galerias, a action é só uma ferramenta para facilitar a vida mesmo. Espero que gostem!

Veja AQUI como criar ou instalar uma action.

E aí, tem alguma dica para compartilhar com a gente a respeito desse asssunto? Vamos adorar saber!

Um beijo e até +!

anaamorim.jpg

19 Comentários em “Eu faço assim: salvando as imagens para web”

  1. Aninha que post mais completo!!! Amei!!!

    Responder

  2. Amooooooooooooooooo seus posts Aninha, vc arrasa nas explicações nos minímos detalhes e com action ainda pra facilitar a vida, já baixei obrigada!

    Responder

  3. Gosto muito desses tutoriais de Photoshop
    Valeu a dica!
    Bjs

    Responder

  4. Ana,

    Ótima dica,faço mto eese procedimento,mas não coloco meus L.Os. nem minhas fotos na web.
    Realizo esse procedimento com todas as minhas imagens(fotos mesmo) que vou trabalhar.
    Posso explicar como faço,mas não sei onde eu posto a minha maneira e não sei como vcs colocam os quadros(telas do Photoshop) no blog para demonstrar a explicação no blog.
    Se vc me explicar como faço isso ,acho que tb poderei postar algumas dicas que aprendi quebrando a minha cabeça e estudando mto o livro do Photoshop.

    Bjinhos,

    Tô Amando este Blog de uma maneira geral,ele não é fútil.

    More Kissinhos.

    Responder

  5. ANinha vc é uma santa, sempre fico me matando para transformar os LOS para as galerias!!! Obrigada! Obrigada!!!

    Responder

  6. arrasou…. obrigada mais uma vez pela dica!!! estou fascinada pelo mundo do PS

    Beijos em todas
    fê Pacheco

    Responder

  7. Esse tuto está demais!E essa action a minha favorita!
    Nunca pensei que redimensionar uma imagem ficaria tão fácil! :)
    Obrigada Aninha!!! Adorei a action e todos os detalhes do tuto!

    Responder

  8. Ai Aninha! Que anjo é você!!

    Se soubesse o malabarismo que eu fazia pra redimensionar!!!!
    Vou tentar instalar o action! =DD

    Beijos

    Responder

  9. adorei o post… sempre adoro as dicas de voces!! Queria fazer uma pergunta… se alguem souber e quiser me ajudar, eu gostaria de saber como redimensiono varias imagens, sem ter que fazer uma a uma. Se que existe um jeito, mas nao tenho ideia, então faço uma por uma!! Se alguem souber eu iria adorar
    Obrigada a todas
    bjs

    Responder

  10. Obrigada Aninha,salvou meus scraps!!!
    Carinhos…

    Responder

  11. Nossa até um action para facilitar a vida? Já to baixando… Por isso sou fã desse blog…

    Bjinhos. Fiquem com Deus meninas!

    *Narinha* =)

    Responder

  12. Báh Aninha que tudo esta dica… eu não fazia a mínima idéia que usar sharpen melhorava nesse nível o LO para web!! Arrasou!!!
    Obrigada pela action!!!

    estrelinhas coloridas

    Responder

  13. Aninha,
    Arrasou com a dica. Acredita que eu não usava o sharpen?? Já testei aqui e realmente muda muuuuito. Agora meus LOs vão ficar mais bonitinhos nas galerias. hahahaha
    Obrigada!!!
    Bjo grande!

    Responder

  14. Muito obrigada pela dica!Arrasou!Eu na minha ignorãncia de iniciante rs,não fazia nada disso,apenas redimensionava a imagem e só rs…Realmente da uma bela diferença,já salvei a action e li o tuto como instalar.Valeu!!

    Responder

  15. Nossa Aninha! Não tinha como não comentar nesse post, mesmo atrasada, quero te agradecer muito!
    Adorei o tuto e amei a action, já testei!
    Obrigada!
    Beijos, Cá!

    Responder

  16. MUUUUIIIIIITOOOOOOOOOO obrigada pela dica!!
    Nossa, eu já estava desistindo de postar na única galeria q
    postava.

    Essa dica foi super útil!

    Estou favoritando teu blog.

    Agora vou conhecer mais um pouquinho dele!

    Responder

  17. Aninha fOfa, eu faço isso na unha e as meninas do CT da Dúnia me falaram da sua action! Vim aqui baixar e agradecer!! beijocas nas meninas e em vc! Regi

    Responder

  18. [...] Ou vocês podem fazer como a Ana Amorim faz.  As instruções estão aqui.  Ela, inclusive, fez uma action super útil pra facilitar as nossas vidas, mas o link está [...]

  19. oiê… vim aqui na maior cara de pau prá pedir em nome do “movimento das novatas”, que vc ative novamente o link da sua action!!!!
    Por favor, por favor, por favor….

    Obrigada e beijocas, amei o tuto viu!!!!

    Lu Martins’s last blog post..NSD chegando…

    Responder

Comente

CommentLuv Enabled

Você pode usar essas tags XHTML: <a href="" title=""> <abbr title=""> <acronym title=""> <blockquote cite=""> <code> <em> <strong>