Tutorial: Efeito retrô nas fotos usando o Photoshop

Olá, pessoal!

Sentiram minha falta?

Durante a semana, vou postando as coisas por aqui.

Hoje vou postar um tutorial passo a passo e bem explicadinho de como deixar suas fotos com um ar "retrô", um toque vintage, usando apenas o Photoshop.

As imagens-bases usadas por mim serão estas (nesta primeira etapa, sem retoque nenhum, só com o logo do blog porque... Preciso nem explicar de novo, né?!):

Como vocês puderam ver, estão bem "desajeitadas".

Tive a ideia de manhã, mas só fui executá-la à tarde. A iluminação já não estava das melhores naquele horário e, além disso, não achei minha outra cartolina branca pra terminar o cenário! heheheheh!

Mas nem tudo está perdido!

Se Photoshop dá jeito até em bumbum cheio de celulite e mancha, porque não trabalharia a favor de criaturinhas tão... Naturalmente fofas? Hein?!

Pra isso, daremos às imagens que mostrei um tratamento vintage bem fofo, para que elas ganhem uma cara nova e um efeito que as deixem únicas!

Tratamento este que você pode fazer na sua casa com as suas fotos!
Lembrando que: As imagens são minhas, os prints e texto do tutorial também!

Vai copiar? Dê os devidos créditos!

Vamos iniciar com...

1. Preparação da imagem para receber os efeitos. (Caso já saiba como proceder aqui, pule para a etapa 2).
Comecemos pelo recorte!

Terminado, vai aparecer uma caixinha com duas opções: "Crop" e "Cancel". Selecione "Crop" e está pronto! Imagem cortada!

Ah, não quer cortar a imagem? Quer apenas retirar algum elemento dela?

Há várias formas de fazer isto. Vou explicar uma. Caso queiram saber mais alguma, peçam aqui que eu posto!

Limpou a área? Selecionou o que queria?

Agora é hora do...

2. Tratamento da imagem para receber o efeito!

A característica básica do estilo retrô em fotos é a luz. As fotos são iluminadas, como se o sol daquela manhã de domingo, em março de 1985 (já desgastado pelo tempo e meio alaranjado) trouxesse magia pro retrato.

Ahhhhh, mas minhas fotos ficaram mal iluminadas, tirei dentro de casa, ou com um solzinho fraaaaco...

Não fecha o post não, porque tem solução!

E o recurso é "Blending Mode" (Ou "modo de mesclagem", que se encontra na área das "layers" ou "camadas"). Veja as imagens a seguir e note a diferença:

Clique nas imagens para vê-las em tamanho maior.

Clique nas imagens para vê-las em tamanho maior.

Você pode usar também os ajustes da aba "Imagem": Brilho e Contraste, recursos simples e que já resolvem boa parte dos casos de má iluminação das fotos. (Image > Adjustments > Brightness/Contrast).

Agora, por favor, vamos ao que interessa?

3. Aplicação de recursos do Photoshop para "efeito retrô" em imagens.

Outra "chave" pro "efeito retrô" são os filtros usados pra dar aquela aparência de foto envelhecida, esquecida na gaveta da casa da mãe.

E, para isso, usemos 3 cores básicas como filtro: O azul, o laranja e (muito raramente) o marrom (já que, se você for parar pra pensar, azul + laranja = marrom).

E aí você me pergunta: Pra que clareei a foto?!

Porque os filtros já dão uma certa opacidade à foto. Se você não fizer o clareamento, a sensação será de uma foto pesada, densa e não é isso que queremos.

E como é feito o filtro?

Veja a seguir:

Cores que você pode usar (sem #, porque no Photoshop já tem):

Azuis:
#093252, #0090ff, #041d30, #4fa9fe, etc.

Laranjas:
#fed74f, #f9aa00, #ff9000, #ce7102, etc.

Podendo ser combinados (azul e laranja) na mesma foto, em camadas diferentes, de acordo com o tom que você quiser dar.

Mais cores? Acesse: http://www.mxstudio.com.br/Conteudos/Dreamweaver/Cores.htm

Não se esqueça de SEMPRE usar os modos de mesclagem! São eles que fazem da camada um filtro e não apenas uma cor sólida tampando a foto!

Olha como ficou! Tchaaaaraaaan!

Tá vintage? Tá.

Mas ainda pode ficar mais...

Como?

Usando texturas!

Quer ver o resultado?

Nesta, eu usei a textura de papel dobrado, que daremos total crédito a: http://fc08.deviantart.net/fs71/i/2010/277/5/0/folded_paper_texture_by_spiketheswede-d303ony.jpg . (Quem for usar, credite também)!

E como se aplica na foto?

Simples!

Clique na imagem para vê-la em tamanho maior.

Clique na imagem para vê-la em tamanho maior.

Gostaram?

Agora vamos ver como ficaram aquelas fotos que mostrei no começo do post?

Sem textura, só com o filtro.

Com textura do papel.

Nesta, além da textura de papel amassado, recortei a Aurora e coloquei um fundo floral vintage.

Sem textura, só com o filtro.

Com a textura do papel.

Sem textura, só com o filtro, neste caso mais azulado e "estourado".

Com textura.

A da Lola e Dulce já fiz direto assim, pois queria esse visual de revista 60's na foto.

Esta da Dulce, além do filtro e da textura, eu recortei o fundo e apliquei este de bolinhas.
Ela não tá uma autêntica "vintage" com esse vestidinho de bolinhas?

Com textura e filtro.

Filtros diferentes... Nesta...

E nesta!

Bom, espero que tenham gostado do tutorial!

Dúvidas, só mandar uma mensagem na aba "contato".

Beijos a todos.

Com carinho,

Notícias do mundo de cá (Parte 3).

Ooooi, galerë!

Sumi!

É, sumi mesmo.

Meus queridos alunos estavam em época de matrícula, por isso fiquei mais afastada daqui.

Além do mais, não é todo dia que tenho assunto pra postar aqui. Principalmente pelo fato de que tudo que eu escrevo é de minha autoria, com base em pesquisas ou em minhas experiências pessoais.

(Fazer blog dando "ctrl+c crtl+v" em texto pronto dos outros e copiando foto com desculpa de que é "inspiração" é moleza, né?! Não me presto a isso.).

Falando no blog, já faz uns dias que mudei (pela 982019892734 vez o cabeçalho). Gostaram?!

Mudei totalmente porque não queria nada parecido com os padrões que vejo por aí. Tem os elementos de design "das modinhas", mas os condensei na head, dando a ela a aparência de um layout de mini-blog.

Mini-blog?!

Aham! Por isso meu cabeçalho ocupa a tela toda!

É mesmo um mini-blog dentro do blog. Passe o mouse lá em cima e verás que ele é todo clicável! Além do menu incorporado (que você pode aprender a fazer aqui), coloquei outros links para postagens que gosto aqui no blog e que gostaria que lessem! *_* (E quem já leu, reler! Hehehehe)

Tem links em cada foto e em nosso slogan! Basta passar o mouse e clicar pra ver!

E por que fiz isso?!

Quero meu blog sempre parecidinho comigo, original e sem cópias.

Entendo que ninguém copia aquilo que não gosta (ou seja, se copia não é inveja e sim admiração). Porém, acho que não devemos imitar quem admiramos e sim superar. Já passei o tutô sobre o mapeamento do blog, só colocar a mão na massa e deixar a criatividade rolar!

Bom, falando de coisa boa, a família de plástico tem mais uma integrante. É a Demétria Maria!

Mary Kay+doll = Pessoa feliz que gosta de ganhar presentes!

Da esquerda pra direita: Tchutchuca, Demi e Penny!

Mas podem chamar de Demi! Foi a filha da minha madrinha que deu e demos a ela o nome de Demi, por causa da Demi Lovato (de quem ela é fã! heheheheh!). Consegui arrebatar mais duas pro mundo bonequeiro! Elas vieram aqui em casa e amaram as Pullips! *_*

Viram os presentes do dia: Mary Kay da minha madrinha e Demi da filha dela! Amei!

Falando em bonecas lindas, a Anahí lançou o lyric video de seu novo hit: Absurda. Não consigo ler este título e não lembrar daquele óculos de creyço! kkkk

Não é lindinho como o do Justin, nem tampouco a música me encantou como "Suit & Tie", mas... É Anahí, é a fadinha mais linda do mundo... Merece crédito!

Clique aqui para ver o lyric video!

E aí, gostaram?!

Falando em gostar, faltam poucos dias pra fevereiro e, pela primeira vez em anos não estou estressada nem tensa com a volta às aulas e a expectativa de como serão as minhas turmas, colegas docentes e escola!

Por quê?

Simplesmente porque eu não vou dar aula! Creio que a decisão por não voltar mais pra sala de aula de Ensino Fundamental e Médio tenha sido uma das mais acertadas de minha vida. Tive medo, adoro a área da Educação, mas aquilo não me fazia mais bem... Era necessário eu dizer "não" e reconhecer que a minha visão/concepção de Educação passa muito longe do que vi na maioria dos lugares onde trabalhei.

Vejam este video do Diego que vocês vão entender:

Felizmente, à cada dia, meus alunos da Letras me mostram que a Educação pode sim ser da forma que acredito: parceria, cooperação, troca de experiências e vivências, além da amizade e respeito mútuos!  E isso para mim é Educação!

Falando em alunos da Letras, deixa eu acabar de ver o jogo do São Paulo (perdendo de virada pro Bolívar - oh, shit!), porque amanhã acordo cedo pra trabalhar!

Beijos a todos!

Com carinho,

Tutorial: Menu no cabeçalho

Ooooi, gente!

O nosso post de número 102 vai ser um tutorial.

Isso mesmo!

E um tutorial bem útil pra quem quer dar um up no visual do blog e baixar a "Taxa de Rejeição" do blog (cujas dicas você confere aqui), já que você colocará as opções de navegação (menus) já no cabeçalho (primeira coisa que o seu leitor vê ao acessar seu blog)!

Pra quem não entendeu como funciona o menu no cabeçalho, basta voltar ao cabeçalho do meu blog! Vou colocar o print mastigadinho pra você não ter nem que subir a barrinha de rolagem!

Note que eu "subi" e incorporei ao cabeçalho as páginas do blog.Você pode incorporar outros links como fiz com a Fan Page do Facebook, Instagram, Flickr e link pro meu outro blog!

Vamos à construção deste cabeçalho?!

Digamos que os passos em si são bem simples. Trabalhoso mesmo é o processo!

Mas vale a pena!

Este será um tutorial beeeeem explicadinho, passo a passo sobre como fazer o cabeçalho com menu!

Se seguir direitinho o que eu vou falar aqui, tem erro não!

Well... Primeiramente, você vai ter que construir seu cabeçalho no Photoshop ou em qualquer outro programa decente de edição de imagem! (Não me vem com Paint, pelo amor de Jesus!)

As dimensões do meu cabeçalho são: 1874 X 913. (Daí você me pergunta: Como ela chegou a este número? Justo este número? E eu respondo: Depois dos testes que eu fiz, ia ser 1800 X 900. Porém, enfiei tanta coisa no cabeçalho que resolvi aumentá-lo. Simples assim!

Não se esqueça: Seu cabeçalho deve conter todos os itens presentes no seu já existente menu! E onde que você olha isto? Lá nas páginas que você criou (e que já estão publicadas no blog).


Na verdade, você vai "deslocar" as páginas, atualmente distribuídas em abas, acima da postagem, lá pra cima, no cabeçalho, sacou?!

Lembre-se: Quando estiver compondo o Menu dentro da imagem no cabeçalho, relacione todas as páginas. Lá na frente, você vai entender como colocar o link pra cada uma delas, ok?!

Uma dica: Crie sua imagem com fundo transparente.

Por quê? Porque aí aparecerá o fundo do blog e não dá aquela aparência "cortada", parecendo que o blog é um grande "puxadinho" que você foi encaixando elementos.

O fundo transparente dá a aprência de sobreposição. De que seu cabeçalho faz parte do blog, mas sem "brigar" com o fundo!

Daí você me pergunta: Por que salvar a imagem do cabeçalho em PNG e não em JPEG?

A grossíssimo modo, te respondo: Porque em PNG há a preservação da transparência (que a gente tanto quer pro cabeçalho), em JPEG não.

Enfim, salva a imagem, vamos à hospedagem dela.

E aí você me pergunta de novo? Pra quê hospedá-la em um site?! E eu te responderei mais adiante.

Por agora: acesse: http://beta.photobucket.com/ (ou qualquer site que hospede imagens), faça seu login (caso não tenha conta lá, crie uma, é rapidinho) e faça o upload do seu cabeçalho!

Guarde por enquanto o link que você obteve no Photobucket, pois você precisará dele agora mesmo!

Agora vamos à "mágica": Como fazer pra colocar link dentro do cabeçalho?! Pode isso, Arnaldo?!

Pode sim e se chama: Mapeamento de Imagem!

Com este recurso, você torna os itens de seu menu "clicáveis" já que ele alia as partes selecionadas da imagem do cabeçalho aos links que você desejar!

Achou "daora"?

Bora fazer então!

Acesse: http://www.image-maps.com/ (O trem é tão bom, que precisa nem criar conta!)

Você vai encontrar esta interface aqui. Siga as minhas instruções!

DICA: O link que você tem que pegar da imagem no photobucket é o "Direct link" (ou seja, o segundo das opções que aparecem à direita da tela). Qualquer dúvida, mande uma mensagem pela aba "contato", que eu esclareço!

Após clicar no botão, indicado, aparecerá esta tela aqui:

Fim de upload, clique onde indica a "setinha" e comecemos de vez o mapeamento!

 

 Bom, vai abrir esta tela aqui: Na maior parte dela, a imagem do seu cabeçalho, no canto direito, as opções do mapeamento.

Vamos a elas!

A primeira coisa a se fazer, quando ver esta tela é desmarcar todas as opções e deixar marcadas apenas as duas a seguir:

E agora começa o mapeamento em si. Basta seguir o que eu disser nas imagens. Para ver em tamanho maior, clique nelas.

Preste bem atenção nestes passos a seguir!

Terminou?

Hora de pegar seu código! Clique no local indicado:

E depois neste campo que indiquei com a seta.

Copie e cole o código em seu bloco de notas e vamos à parte final: A instalação de seu cabeçalho no blog!

Primeiramente, você precisa retirar o cabeçalho do seu blog. Como?

Há duas maneiras!

A primeira:

Pronto, você não tem mais cabeçalho!

Ah, teu cabeçalho não aceitou ser excluído desta forma?!

O que fazer agora?!

Relaxa, venha para esta etapa aqui (segunda maneira):

Repito: NÃO DEIXE DE SALVAR UMA CÓPIA DO CÓDIGO DE SEU LAYOUT, OK?! Fazendo isso, você pode mexer com segurança, sabendo que poderá voltar o blog ao que era antes, caso algo dê errado!

Aberta a edição, faça o que está descrito a seguir:

Pode ser que apareça a mensagem de que não é possível prosseguir a edição sem o cabeçalho. Dá nada não, clique confirmando a alteração que dá certo sim. O cabeçalho é removido!

Sem cabeçalho (por uma das duas maneiras de se retirar) vamos à inserção do novo cabeçalho:

Adicione o gadget "HTML/Java Script" e siga os passos abaixo:

 Prontinho!

Você agora tem um cabeçalho com menu integrado!

Gostaram?!

Espero que sim!

Dúvidas?! Mande um "alô" que eu esclareço!

Com carinho,