tag:blogger.com,1999:blog-39374513454816787512011-08-02T11:16:26.129-07:00Filipe Petterhttp://www.blogger.com/profile/08184222509453037190noreply@blogger.comBlogger11100tag:blogger.com,1999:blog-3937451345481678751.post-39971824043103665162009-06-17T16:34:00.000-07:002009-06-17T19:44:54.022-07:00<h2>Olá, nesse pequeno tutorial irei ensinar como criar um <a href="http://efeito-polaroid-fireworks.blogspot.com/">efeito polaroid</a> que dará a suas fotos um visual bem bacana.</h2><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://1.bp.blogspot.com/_b_jRZ5THaWI/Sjl-typmSMI/AAAAAAAAAXA/e-jMElLRYu8/s1600-h/efeito_polaroid_final.jpg"><img style="cursor: pointer; width: 441px; height: 294px;" src="http://1.bp.blogspot.com/_b_jRZ5THaWI/Sjl-typmSMI/AAAAAAAAAXA/e-jMElLRYu8/s400/efeito_polaroid_final.jpg" alt="Efeito polaroid Final" id="BLOGGER_PHOTO_ID_5348445357634635970" border="0" /></a><br /><br />Para começarmos a criar o <span style="font-weight: bold;">efeito polaroid</span> temos que imaginar que efeitos de sombra e luz são muito importantes.<br />Seria muito simples colocar uma imagem dentro de um frame branco e pronto.<br />É exatamente nesse ponto que começaremos.<br /><br />Crie um novo documento no Fireworks com as seguintes configurações:<br /><br /><span style="font-family:courier new;">Altura: 400px</span>, <span style="font-family:courier new;">Largura: 400px,</span> <span style="font-family:courier new;">Cor de fundo: #66CCFF <span style="font-style: italic;font-family:courier new;font-size:85%;" >(essa cor é essencial para podermos ver a sombra enquanto for criada)</span></span><br /><br />Cole a imagem que você deseja usar e crie um retangulo ao redor como na imagem abaixo.<br /><br /><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://3.bp.blogspot.com/_b_jRZ5THaWI/SjmBOmRRSTI/AAAAAAAAAXI/eBAWBPEbOAA/s1600-h/efeito_polaroid_01.gif"><img style="cursor: pointer; width: 400px; height: 400px;" src="http://3.bp.blogspot.com/_b_jRZ5THaWI/SjmBOmRRSTI/AAAAAAAAAXI/eBAWBPEbOAA/s400/efeito_polaroid_01.gif" alt="iniciando o efeito polaroid criando frame" id="BLOGGER_PHOTO_ID_5348448120270309682" border="0" /></a><br /><br />Aqui já temos uma imagem dentro de um frame, bem parecido com uma fotografia polaroid.<br />Mas para criarmos um <a href="http://efeito-polaroid-fireworks.blogspot.com/">efeito polaroid</a> mais realistico, vamos trabalhar com sombras e luz para dar um efeito de que a foto é de papel.<br /><br />Para criarmos o primeiro efeito de luz sobre o papel iremos copiar o frame branco e atribuir a ele um gradiente claro/escuro com transparência.<br /><br />Passo 1 - Copie e cole o frame branco, logo em seguida coloque ele sobre a imagem usando as teclas <span style="font-family:courier new;">Ctrl + ↑</span><br />Passo 2 - No item de cor vamos escolher <span style="font-family:courier new;">Gradiente</span> > <span style="font-family:courier new;">Linear</span> como na imagem abaixo<br /><br /><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://3.bp.blogspot.com/_b_jRZ5THaWI/SjmEJFM3hqI/AAAAAAAAAXQ/SbQ7CDq7sAk/s1600-h/efeito_polaroid_02.gif"><img style="cursor: pointer; width: 358px; height: 329px;" src="http://3.bp.blogspot.com/_b_jRZ5THaWI/SjmEJFM3hqI/AAAAAAAAAXQ/SbQ7CDq7sAk/s400/efeito_polaroid_02.gif" alt="criando sombra sobre a imagem com gradiente efeito polaroid" id="BLOGGER_PHOTO_ID_5348451324029011618" border="0" /></a><br /><br />Passo 3 - Configure o gradiente do preto para o branco criando dois pontos de transparência no meio.<br /><br /><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://1.bp.blogspot.com/_b_jRZ5THaWI/SjmFBXx4AQI/AAAAAAAAAXY/l_nnadB2eh0/s1600-h/efeito_polaroid_03.gif"><img style="cursor: pointer; width: 330px; height: 333px;" src="http://1.bp.blogspot.com/_b_jRZ5THaWI/SjmFBXx4AQI/AAAAAAAAAXY/l_nnadB2eh0/s400/efeito_polaroid_03.gif" alt="configurando gradiente sobre imagem efeito polaroid" id="BLOGGER_PHOTO_ID_5348452291088744706" border="0" /></a><br /><br />Esse será o resultado obtido:<br /><br /><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://3.bp.blogspot.com/_b_jRZ5THaWI/SjmFlCXTKtI/AAAAAAAAAXg/AAjYhJwvMIg/s1600-h/efeito_polaroid_04.jpg"><img style="cursor: pointer; width: 353px; height: 340px;" src="http://3.bp.blogspot.com/_b_jRZ5THaWI/SjmFlCXTKtI/AAAAAAAAAXg/AAjYhJwvMIg/s400/efeito_polaroid_04.jpg" alt="aplicando luz sombra sobre foto efeito polaroid" id="BLOGGER_PHOTO_ID_5348452903815424722" border="0" /></a><br /><br />É importante você usar o mouse para arrastar a linha do gradiente até ficar em diagonal, como na imagem acima.<br /><br />Para que o <a href="http://efeito-polaroid-fireworks.blogspot.com/">efeito polaroid</a> tenha maior realismo iremos criar um efeito de sombra para darmos uma cruvatura a nossa foto.<br /><br />Vamos criar outra cópia do frame branco e com a ferramenta <span style="font-family:courier new;">Pen Tool</span> iremos dar a seguinte curvatura na imagem.<br />Passo 1 - Clique sobre a imagem e desagrupe usando as telcas <span style="font-family:courier new;">Ctrl + Shift + G</span><br />Passo 2 - Usando a ferramenta Pen Tool clique sobre as linhas laterais, superior e inferior e arraste no sentido da linha, uma nova linha com duas marcações nas extremidades irá aparecer. Vá controlando essas marcações usando a ferramenta <span style="font-family:courier new;">Subselection Tool</span> até atingir o seguinte resultado:<br /><br /><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://1.bp.blogspot.com/_b_jRZ5THaWI/SjmI29OS-CI/AAAAAAAAAXo/NY0524SFGWw/s1600-h/efeito_polaroid_05.jpg"><img style="cursor: pointer; width: 395px; height: 397px;" src="http://1.bp.blogspot.com/_b_jRZ5THaWI/SjmI29OS-CI/AAAAAAAAAXo/NY0524SFGWw/s400/efeito_polaroid_05.jpg" alt="criando imagem da sombra sob foto efeito polaroid" id="BLOGGER_PHOTO_ID_5348456510208014370" border="0" /></a><br />Atribua a essa imagem a seguinte cor: <span style="font-family:courier new;">#333333</span><br />Em <span style="font-family:courier new;">Filters</span>, selecione a opção <span style="font-family:courier new;">Blur > Gausian Blur</span> nivel 4,0<br /><br /><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://3.bp.blogspot.com/_b_jRZ5THaWI/SjmJ2T3-VOI/AAAAAAAAAXw/yKeAuj5bioQ/s1600-h/efeito_polaroid_06.jpg"><img style="cursor: pointer; width: 366px; height: 270px;" src="http://3.bp.blogspot.com/_b_jRZ5THaWI/SjmJ2T3-VOI/AAAAAAAAAXw/yKeAuj5bioQ/s400/efeito_polaroid_06.jpg" alt="criando imagem de sombra sem foco efeito polaroid" id="BLOGGER_PHOTO_ID_5348457598620161250" border="0" /></a><br /><br />Posicione a imagem bem abaixo das outras usando as teclas <span style="font-family:courier new;">Ctrl + Shift + ↓</span><br />Acerte a imagem abaixo das outras para que a sombra atinja o seguinte resultado:<br /><br /><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://3.bp.blogspot.com/_b_jRZ5THaWI/SjmMEClrlXI/AAAAAAAAAYI/r8ZlcKDLdwE/s1600-h/efeito_polaroid_07.jpg"><img style="cursor: pointer; width: 400px; height: 400px;" src="http://3.bp.blogspot.com/_b_jRZ5THaWI/SjmMEClrlXI/AAAAAAAAAYI/r8ZlcKDLdwE/s400/efeito_polaroid_07.jpg" alt="imagem efeito polaroid finalizado" id="BLOGGER_PHOTO_ID_5348460033521456498" border="0" /></a><br /><br />Pronto aí está o <a href="http://efeito-polaroid-fireworks.blogspot.com/">efeito polaroid</a> criado na imagem. Você poderá trocar o fundo por uma imagem como eu fiz lá em cima na imagem de demonstração. E para fazer isso com outras fotos, é só recortar e trocar a imagem dentro do frame quantas vezes quiser.<br /><br />Espero que tenham gostado, não deixem de ver os próximos tutoriais. Até!<div class="blogger-post-footer"><img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/3937451345481678751-3997182404310366516?l=efeito-polaroid-fireworks.blogspot.com' alt='' /></div>Filipe Petterhttp://www.blogger.com/profile/08184222509453037190noreply@blogger.com0