passo2. Pressione Ctrl+N para criar um novo documento, defina o tamanho de 750×550 pixels, 72 dpis e modo de cor em RGBa abreviatura do sistema de cores aditivas formado por Vermelho (Red), Verde (Green) e Azul (Blue). Pressione a letra D para resetar as cores de Foreground e Background para preto e branco, pressione Alt+Backspace ou a letra G para selecionar a Paint Bucket Tool e clique no documento para preencher toda a layer com a cor preta. Pressione Ctrl+O e abra a imagem escolhida novamente, pressione Ctrl+A para selecionar seu conteúdo, Ctrl+C para copiar, volte ao documento que criamos e preenchemos com a cor preta e pressione Ctrl+V para colar a imagem. Posicione o rosto como na imagem abaixo. Pressione a letra E para selecionar a Eraser Tool, escolha um brush de pontas suaves e tamanho médio, apague tudo que estiver ao redor do rosto da pessoa na foto.

passo3. Pressione Ctrl+N para criar um novo documento, defina um tamanho de 20×20 pixels, 72 dpis e modo de cor em RGBa abreviatura do sistema de cores aditivas formado por Vermelho (Red), Verde (Green) e Azul (Blue). Pressione Ctrl+Shift+Alt+N para criar uma nova layer. Pressione a letra Z para selecionar a Zoom Tool, clique até o Zoom máximo. Selecione a Pencil Tool, com a letra B, e pressione a letra D para resetar as cores de Foreground e Background para preto e branco. Pressione a letra X do teclado para inverter as cores de Foreground e Background; com a cor branca como cor de Foreground, desenhe com a Pencil Tool uma letra L, pegando todo canto esquerdo do documento e a parte de baixo. Clique na layer Background e vá em Layer> Hide Layers, pressione Ctrl+A para selecionar o documento e vá em Edit> Define Pattern. Dê o nome de Grid para o Pattern criado e pressione Ok. Feche este documento, volte ao documento que estávamos trabalhando e pressione Ctrl+Shift+Alt+N para criar uma nova layer. Pressione a letra D para resetar as cores de Foreground e Background para preto e branco, pressione a letra X do teclado para inverter as cores de Foreground e Background; sua cor de Foreground deve ser a branca. Pressione a letra G para selecionar a Paint Bucket Tool. Na barra de opções da ferramenta mude o valor de Set Source for Fill Area para Pattern, ao lado irá aparecer a caixa de Patterns, escolha o Pattern que criamos, clique no documento para preencher com o Pattern.

04. Agora vá em Edit> Transform> Warp e deixe o grid como na imagem abaixo, pressione Enter quando terminar.

05. Defina a opacidade da layer em 20%, vá em Layer> Layer Style> Outer Glow, na caixa de Outer Glow defina o blend mode em Color Dodge, Opacity em 100%, Color em #FFFFFF, Spread em 0 e Size em 5 pixels, pressione Ok.

06. Pressione a letra P para selecionar a Pen Tool, certifique-se de que a opção Paths esteja marcada na barra de opções. Crie paths ao redor de alguns quadrados, ao final pressione Ctrl+Enter para ativar a seleção, vá em Select> Save Selection e dê o nome de buracos para as seleções, pressione Ok.

07. Com a seleção ainda ativa, pressione Ctrl+X para recortar o conteúdo das seleções e Ctrl+V para colar o conteúdo das seleções em uma nova layer. Pressione a letra V do teclado para selecionar a Move Tool e mova as peças para o lado direito do documento. Vá em Edit> Free Transform, com a tecla Shift pressionada, clique e arraste afim de diminuir levemente o tamanho das peças.

08. Pressione Ctrl+J para duplicar a layer. Pressione a letra V para selecionar a Move Tool, clique uma vez na seta direcional direita do teclado para mover a cópia da layer 1 pixel para direita. Repita o processo 10 vezes para conseguir o efeito abaixo. Pressione Ctrl+E 10 vezes para mesclar as layers copiadas. Vá em Layer> Layer Style> Gradient Overlay e defina o Blend Mode em Normal, Opacity em 80%, em Gradient escolha um gradiente que vá do #000000 para o #D58761 e o Angle em 180°, pressione Ok.

09. Agora vá em Layer> Layer Style> Pattern Overlay, defina o Blend Mode em Multiply, Opacity em 10%, no Pattern escolha o pattern chamado Metal Landscape e pressione Ok, agora vá em Layer> Layer Style> Outer Glow e defina o Blend Mode em Color Dodge, Opacity em 75%, Color em #FFFFFF e Size em 10 pixels, pressione Ok.

10. (Opcional) Caso queira criar mais peças, repita dos passos 06 ao 09.

11. Clique na layer do rosto da garota e vá em Select> Load Selection. Em Channel, escolha a opção buracos (a seleção que salvamos no passo 06) e pressione Ok para ativar a seleção. Pressione Ctrl+Shift+alt+N para criar uma nova layer, pressione a letra D do teclado para resetar as cores de Foreground e Background para preto e branco, pressione Alt+Backspace ou pressione a letra G para selecionar a Paint Bucket Tool e clique dentro da seleção ativa para preencher com a cor preta. Pressione Ctrl+D para desabilitar a seleção, vá em Layer> Layer Style> Bevel And Emboss, em Style escolha a opção Inner Bevel, em Depth defina o valor de 72%, Size em 5 pixels, Soften em 0 pixels, Angle em 0°, Altitude em 50°, Highlight Mode em Screen, Highlight Color em #DCA57E, Highlight Opacity em 100%, Shadow Mode em Multiply, Shadow Color em #000000 e Shadow Opacity em 75%, pressione Ok.

12. Clique na layer das peças separadas e pressione Ctrl+Shift+Alt+N para criar uma nova layer; esta layer deve ficar acima de todas as outras layers. Pressione a letra D para resetar as cores de Foreground e Background para preto e branco, pressione a letra X para alternar as cores de Foreground e Background, sua cor de Foreground deve ser a branca. Agora, pressione a letra B para selecionar a Brush Tool, escolha o brush que foi baixado e instalado no passo 01 chamado brush.abr, crie alguma fumaça como na imagem abaixo, vá em Layer> Layer Style> Outer Glow e defina o blend mode em Linear Dodge (Add), Opacity em 75%, Color em #FFFFFF, Spread em 0 pixels e Size em 5 pixels, pressione Ok

13. Pressione Ctrl+Shift+Alt+N para criar uma nova layer, dê o nome de Dark Blocks para a nova layer, pressione a letra P do teclado para selecionar a Pen Tool, crie alguns paths ao redor de algumas peças, pressione Ctrl+Enter para ativar a seleção, pressione a letra D do teclado para resetar as cores de Foreground e Background para preto e branco, pressione Alt+Backspace (a tecla acima do Enter) ou pressione a letra G do teclado para selecionar a Paint Bucket Tool e clique na seleção para preencher com a cor preta, defina o blend mode da layer em Soft Light.

14. Pressione Ctrl+Shift+Alt+N para criar uma nova layer, dê o nome de Light Blocks, repita o processo do passo 13 escolhendo alguns blocos que serão mais iluminados que outros, desta vez use a cor #FFFFFF (branca) ao invés da preta, ao final mude o modo de blend da layer para Soft Light

15. Clique na layer do rosto e vá em Filter> Blur> Surface Blur e defina o valor do Radius em 5 pixels e Threshold em 15 levels, pressione Ok. Vá em Layer> New Adjustment Layer> Levels, defina os valores de input em 10, 1.25 e 244, pressione Ok. Pressione Ctrl+Shift+Alt+N para criar uma nova layer, pressione a letra D do teclado para resetar as cores de Foreground e Background para preto e branco, pressione a letra B do teclado para selecionar a Brush Tool, escolha um brush de tamanho médio e pontas suaves. Defina a opacidade do brush em 40% na barra de opções da ferramenta, pinte algumas áreas de sombra na parte direita do documento.

16. (Opcional) Para finalizar a imagem, o autor adicionou uma tatuagem de código de barras no braço de Jéssica Alba. Para isso, basta pressionar Ctrl+O, abrir uma imagem em preto e branco de um código de barras, ir em Select> Color Range, em Select escolher Shadows para ativar a seleção ao redor do código de barras e pressionar ok. Pressione Ctrl+C para copiar o conteúdo da seleção, volte ao documento que estávamos trabalhando e pressione Ctrl+V para colar. Pressione Ctrl+T para abrir a caixa de Free Transform e, com a tecla Shift pressionada, clique e arraste para diminuir a figura, posicione no braço da pessoa e pressione Enter, mude o modo de blend da layer para Soft Light e, caso seja necessário, diminua a opacidade da layer. Ao final, sua imagem estará como na foto abaixo.

site de origem: httpHypertext Transfer Protocol (ou o acrônimo HTTP; do inglês, Protocolo de Transferência de Hipertexto) é um protocolo de comunicação (na camada de aplicação segundo o Modelo OSI)://10steps.sg/?p=6

]]> http://informatizado.com.br/2010/05/photoshop-desmanchando-um-rosto/feed/ 1 http://informatizado.com.br/2010/01/javascript-banner-rotativo-com-efeito-transitorio/ http://informatizado.com.br/2010/01/javascript-banner-rotativo-com-efeito-transitorio/#comments Sat, 09 Jan 2010 15:04:03 +0000 Daniel nunes http://informatizado.com.br/?p=6468 Leia mais »]]> Caros leitores fica aqui uma dica muito boa sobre códicos de banner rotativo em java, para você fazer aplicação em seu site ou até mesmo em blog.

Vamos utilizar uma solução pronta e gratuita que está disponível, inclusive com exemplo, no site slayeroffice.com – imageCrossFade.

No caso deste exemplo, vamos precisar do seguinte:

xfade2.css

#imageContainer {
height:235px;
}

#imageContainer img {
display:none;
position:absolute;
top:0; left:0;
}

xfade2_o.css

#imageContainer {
position:relative;
margin:auto;
width:495px;
border:1px solid #000;
}

xfade2.js

/*****

Image Cross Fade Redux
Version 1.0
Last revision: 02.15.2006
steve@slayeroffice.com

Please leave this notice intact.

Rewrite of old code found here: http://slayeroffice.com/code/imageCrossFade/index.html

*****/

window.addEventListener?window.addEventListener("load",so_init,false):window.attachEvent("onload",so_init);

var d=document, imgs = new Array(), zInterval = null, current=0, pause=false;

function so_init() {
if(!d.getElementById || !d.createElement)return;

// DON'T FORGET TO GRAB THIS FILE AND PLACE IT ON YOUR SERVER IN THE SAME DIRECTORY AS THE JAVASCRIPT!
// httpHypertext Transfer Protocol (ou o acrônimo HTTP; do inglês, Protocolo de Transferência de Hipertexto) é um protocolo de comunicação (na camada de aplicação segundo o Modelo OSI)://slayeroffice.com/code/imageCrossFade/xfade2.css
css = d.createElement("link");
css.setAttribute("href","xfade2.css");
css.setAttribute("rel","stylesheet");
css.setAttribute("type","text/css");
d.getElementsByTagName("head")[0].appendChild(css);

imgs = d.getElementById("imageContainer").getElementsByTagName("img");
for(i=1;i<imgs.length;i++) imgs[i].xOpacity = 0;
imgs[0].style.display = "block";
imgs[0].xOpacity = .99;

setTimeout(so_xfade,1000);
}

function so_xfade() {
cOpacity = imgs[current].xOpacity;
nIndex = imgs[current+1]?current+1:0;

nOpacity = imgs[nIndex].xOpacity;

cOpacity-=.05;
nOpacity+=.05;

imgs[nIndex].style.display = "block";
imgs[current].xOpacity = cOpacity;
imgs[nIndex].xOpacity = nOpacity;

setOpacity(imgs[current]);
setOpacity(imgs[nIndex]);

if(cOpacity<=0) {
imgs[current].style.display = "none";
current = nIndex;
setTimeout(so_xfade,8000);
} else {
setTimeout(so_xfade,50);
}

function setOpacity(obj) {
if(obj.xOpacity>.99) {
obj.xOpacity = .99;
return;
}
obj.style.opacity = obj.xOpacity;
obj.style.MozOpacity = obj.xOpacity;
obj.style.filter = "alpha(opacity=" + (obj.xOpacity*100) + ")";
}

}

O arquivo js vem com um aviso. Ele alerta para que o arquivo css esteja na mesma pasta do arquivo js. Se estiverem em arquivos separaros, é preciso indicar o caminho até o arquivo.

Esta linha controla o tempo de troca entre as imagens:

setTimeout(so_xfade,8000);

No caso, a cada 8 segundos a imagem é alterada.

E por último, no seu htmlacrônimo para a expressão inglesa HyperText Markup Language, que significa Linguagem de Marcação de Hipertexto, as imagens que serão alteradas:

<div id="imageContainer">
<img src="imagem1.jpgPEG (ou JPG) é um método comumente usado para comprimir imagens fotográficas." width="495" height="235" alt="imagem">
<img src="imagem2.jpgPEG (ou JPG) é um método comumente usado para comprimir imagens fotográficas." width="495" height="235" alt="imagem">
<img src="imagem3.jpgPEG (ou JPG) é um método comumente usado para comprimir imagens fotográficas." width="495" height="235" alt="imagem">
<img src="imagem4.jpgPEG (ou JPG) é um método comumente usado para comprimir imagens fotográficas." width="495" height="235" alt="imagem">
</div>

Agora é só testar e ver o resultado. Você também pode ajustar a altura e largura das imagens. Basta alterar o width e height dos atributos img e nos arquivos css.

faça download do cod_banner

vi no:httpHypertext Transfer Protocol (ou o acrônimo HTTP; do inglês, Protocolo de Transferência de Hipertexto) é um protocolo de comunicação (na camada de aplicação segundo o Modelo OSI)://www.mariosam.com/

flashhttpHypertext Transfer Protocol (ou o acrônimo HTTP; do inglês, Protocolo de Transferência de Hipertexto) é um protocolo de comunicação (na camada de aplicação segundo o Modelo OSI)://boo-box.com/bbli" alt="[bb]" />

ActionScripthttpHypertext Transfer Protocol (ou o acrônimo HTTP; do inglês, Protocolo de Transferência de Hipertexto) é um protocolo de comunicação (na camada de aplicação segundo o Modelo OSI)://boo-box.com/bbli" alt="[bb]" />

• Parte 1
• Parte 2
• Parte 3

a e b podem ser alterados a sua necessidade

onClipEvent (load) {
    var a = 1;
    var b = 1;
}
onClipEvent (enterFrame) {
    _x += (a=-a);
    _z += (b=-b);
}

Quem vê esta ilustração abaixo jura que foi feita no Photoshop ou em alguma ferramenta que faz tratamento de imagens e não em vetores, mas ela foi feita em vetores mesmo.

Vamos iniciar a nossa vetorização. Aproveite e clique aqui para baixar o vetor inicial. Está salvo em CorelDraw 8, para não termos problemas de versões.

1. Inicialmente separe as parte que estarão no arquivo Maca.cdr;

2. Vamos começar pela folha. Por isso deve-se separar cada objeto:2.1 Com a Ferramenta Bézier, faça um objeto dentro da folha:

2.2 Coloque as cores de fundo indicadas na imagem abaixo, selecionando o objeto e dando um duplo clique no preenchimento:

2.3 A imagem que irá aparecer será esta. Apenas coloque as respectivas cores no local indicado:

2.4 Com o objeto interno selecionado, utilize a Ferramenta de Contorno Interativo, de acordo como informado abaixo:

2.5 Na barra de configuração do Contorno Interativo, insira os dados:

Contorno = interno,|

Etapas de contorno = 9,|Deslocamento de contorno = 0,5 milímetros,|

Cores de contorno = linear,|Cor de fundo = branco,|

Preenchimento = C=45 M=0 Y=75 K=0. 2.6 A imagem deverá ficar da seguinte forma:

2.7 Agora faça algumas linhas, como apresentado abaixo, para demonstrar as estrias da folha, finalizando a sua edição:

3. Vamos agora fazer a edição do caule. Devem ser adicionadas as cores, como apresentado abaixo:

4. Agora na edição do maçã, devemos ter cuidado. Trabalharemos com imagens sobrepostas:

4.1 Selecione o vetor da maçã:

4.2 Após selecionar o vetor, siga as instruções abaixo:

4.3 Começe aplicando os valores de cores, nas camadas indicadas abaixo. Basta clicar na camada e dar um duplo clique no preenchimento do vetor como indicado abaixo:

4.4 Após clicar no preenchimento do vetor, irá aparecer esta janela, basta colocar os valores que estão indicado na imagem abaixo:

4.5 Faça, com a Ferramenta Elipse ou F7, um círculo oval na parte esquerda da maça, vetor A;

4.6 Com a Ferramenta Bézie:4.7 Faça um pequeno vetor na parte inferior da maçã, vetor B;

4.8 Crie um pequeno vetor na parte superior da maçã, como indicado na figura abaixo, vetor C:

4.9 Seguindo, vamos agora utilizar a mesma ferramenta de Contorno Interativo que utilizamos acima e inserir os seguintes dados:

No vetor A:

Contorno = interno,|

Etapas de contorno = 7,|Deslocamento de contorno = 0, 5 milímetros,|

Cores de contorno = linear,|Cor de fundo = branco,|

Preenchimento = C=10 M=75 Y=60 K=0.

No vetor B:

Contorno = interno,|

Etapas de contorno = 6,|Deslocamento de contorno = 0, 5 milímetros,|

Cores de contorno = linear,|Cor de fundo = branco,|

Preenchimento = C=35 M=100 Y=80 K=17.

No vetor C:

Contorno = interno,|

Etapas de contorno = 4,|Deslocamento de contorno = 0, 2 milímetros,|

Cores de contorno = linear,|Cor de fundo = branco,|

Preenchimento = C=26 M=91 Y=72 K=17. 5. Se todos os passos foram seguidos corretamente, deveremos obter o seguinte vetor:

6. Agora basta unir todos os vetores criados, sendo eles a folha, o caule e a maça, obtendo assim, este vetor:

Com a utilização de sombras e profundidade, podemos obter efeitos que nunca tínhamos pensador em usar, mas ainda não usamos ferramentas do tipo de aparagem, mistura interativa, dentre outras. Nos seguintes artigos usaremos. Espero que tenham gostado