Criar Thumbs no Photoshop utilizando Actions

Estamos ai mais uma vez pessoal.

Hoje trabalharemos com Actions dentro do Photoshop.

Esta técnica é muito utilizada para criação de thumbs para sites. Por exemplo: temos as fotos ampliadas e queremos que a princípio apareçam reduzidas, onde dentro de seu site ao clicar, elas se expandem para que veja grande na tela.

Desta forma, a utilização de Actions facilita bastante se você for trabalhar com uma quantidade muito grande de imagens. Pois você faz a técnica uma unica vez e depois aplica para todas as demais, deixando com que a tecnologia faça o resto por você.

Vamos começar!!

Descrição: Criação de thumbs utilizando actions

Versão: Photoshop CS5, em inglês.

Grau de dificuldade: 9,0

Tutorial produzido ao som de: Sugar Ray – Answer the phone

1- passo: Escolha pelo menos 3 imagens grandes para que podemos utilizar. Eu escolhi 3 imagens de Bariloche (Argentina). Vejam abaixo:

2- passo: Após escolhidas as fotos que vamos utilizar, vá na sua Área de Trabalho (Desktop) e crie uma pasta com um nome que depois você reconheça que é para lá onde serão salvas suas fotos transformadas pela action. Eu a nomeei de ‘Imagens Convertidas’.


3- passo: Agora arraste e abra todas as fotos no Photoshop.

4- passo: Vamos começar a criar a AÇÃO (action).

Abra o painel de Actions no canto direito superior ou dê um Alt+F9.

Clique na pasta em Criate new set. Depois dê um nome para sua pasta / projeto. Chamarei de ‘Thumbs’, pois é justamente o que faremos. Dê OK!

Agora ao lado da pasta clique em Criate new action. Dê um nome para sua action, no caso deixarei ‘Action1′conforme ja apareceu para mim. Clique em RecordA partir de agora, tudo que você fizer no photoshop será gravado. Portanto muito cuidado até completar corretamente toda a ação que você quer dar à sua action.

5- passo: Clique em uma das fotos que você esta trabalhando e vamos aplicar as preferências que queremos utilizando uma delas como modelo. Vá em Image > Image Size ou então Ctrl+Alt+i. Digamos que nosso thumb tenha 90 x 60 px. Isso vai variar de acordo com o layout do site de vocês.

6- passo: Vá em File > Save for Web & Devices ou Alt+Shift+Ctrl+S. Escolha as preferências desejadas como GIF ou JPG, qualidade, etc… e dê Save. Agora você deve salvar esta foto SEM RENOMEAR na pasta que criamos no desktop ’Imagens Convertidas’.

7- passo: Feche esta foto, e ao perguntar se quer salvar, dê NÃO. Para não substituir a foto grande original. Vá novamente ao seu painel de Actions e agora aperte em STOP. A partir de agora não será mais gravado, e suas ações deverão estar conforme imagem abaixo.

8- passo: Agora vá em File > Automate > Batch… Escolha as preferências conforme figura abaixo. Set: escolha sua pasta. Action: é o nome da sua action. Source: Coloque arquivos abertos. Destination: a pasta de destino que criamos no desktop. E por fim OK.


Agora você verá a mágica da tecnologia trabalhar pra você. Como estamos trabalhando com poucas imagens neste exemplo não dará pra curtir ficar vendo o Photoshop trabalhar por muito tempo.

Para finalizar. Abra a pasta que criamos no desktop e lá estarão seus thumbs.

Espero que tenham gostado.

Deixem seus comentários. Abraço!

Escrito por VTaddone on março 17, 2011. Arquivado em Photoshop. Você pode seguir as respostas a esse artigo pelo RSS 2.0. Você pode deixar respostas para esse artigo

7 respostas a Criar Thumbs no Photoshop utilizando Actions

  1. Adorei essa aula.Eu tenho o CS5 .Eu não tenho site sou apenas uma pessoa da terceira idade curiosa em aprender coisas novas.A explicação está ótima e no final parece mesmo mágica ver as imagens se transformando automaticamente na dimensão desejada.
    Obrigada amigo por compartilhar .
    um abraço! Jullie

  2. Obrigado pelo carinho Jullie. Espero que aprecie os demais tutoriais.
    Abraço.

  3. Aprendi muito em sites como o seu. Achei muito útil esse tutorial e já estou usando.

    Parabens

    Bruna

  4. Muito obrigado Bruna.

  5. muito bom, achei simples e direto.

  6. Obrigado Tati. Super útil não é verdade?
    bjs

Deixe uma resposta

O seu endereço de email não será publicado Campos obrigatórios são marcados *

*

Você pode usar estas tags e atributos de HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>