Papel de Parede 2009

• Tweet
• Sharebar

• Tweet

Olá, pessoal

2009 está batendo à nossa porta e que tal criarmos um papel de parede bem bacana para “enfeitar” nosso desktop?

Pré-Requisitos

• Facilidade quanto ao manuseio do Fireworks CS3

Objetivo

• Criar um papel de parede para desktop nas dimensões 1024×768 pixel

Conteúdo

1º Passo – Criação do Background (fundo)

De início, vamos criar um novo documento no Fireworks com as dimensões 1024×768 pixel e com fundo branco (Canvas color)

Em seguida, criaremos um retângulo com as mesmas dimensões, sem borda e com preenchimento Gradient Radial de acordo com a imagem a seguir:

Fig. 01: Fundo Gradient Radial

2º Passo – Criação da Textura para o Background

Agora vamos criar um efeito realístico inserindo uma textura grungy ao nosso background. A imagem está disponível para download clicando AQUI!

Feito o download, vamos importá-la e colocá-la sobre o fundo verde com as mesmas dimensões, 1024×768 pixel.

Com a imagem selecionada, vamos aplicar um filtro para deixá-la em escala de cinza. Para isso, acessemos a opção Filters > Adjust Color > Hue/Saturation… e configuremos da seguinte maneira:

Fig. 02: Efeito Gray Scale (Escala de Cinza)

Em seguida, aplicaremos 70% de opacidade e com o Bland Mode Overlay.

Fig. 03 – Aplicação do filtro Overlay

Vamos agora aumentar a sensação de “peso” da imagem, duplicando-a, rotacionando em 180º e colocando sua opacidade em 20% para chegarmos a este resultado:

Fig. 04: Rotação e aplicação de opacidade

Para termos um resultado mais aprimorado, podemos inserir outras texturas e trabalhando-as com sua opacidade e filtros.

Tomei como base outra textura. Clique AQUI e faça o download.

Fig. 05: Inserção de nova textura

O importante aqui é ir duplicando as camadas, rotacionando, aplicando opacidades até que cheguemos a um ponto que nos agrade.

Baixe AQUI o background com todas ações aplicadas acima.

3º Passo – Criação de Textura para o Texto

Bom, vamos criar um texto diferente com uma textura de grama. Então, clique AQUI, baixe a imagem que utilizaremos e a importe para o palco.

Em seguida, utilizando uma fonte “cheia” como Arial Black, Swis721 BlkEx BT ou alguma similar, escrevamos 2009 (cada número em uma camada) sobre a grama com 50% de opacidade e cor branca.

Fig. 06: Texto sobre a grama

Agora vem a parte mais trabalhosa. Para ficar um efeito bacana, precisamos contornar com a ferramenta Pen tool, todos os números de uma maneira não-uniforme.

4º Passo – Organizando os Layers (Camadas)

Para entendermos melhor, a idéia é a seguinte: estilizar cada numeral para que possamos fazer uma colagem da grama sobre cada um e aplicarmos alguns efeitos de sobra, 3D, etc. Portanto, precisamos criar no painel Layers (Camadas), pastas individualizadas para cada número, onde deverão conter 1 número e uma cópia da grama, como na imagem abaixo:

Fig. 07: Organização das camadas

Perceberam que eu gosto de organizar, dando nomes às camadas. Assim fica mais fácil de trabalhar.

5º Passo – Utilizando a Ferramenta Pen Tool

Vamos à transpiração agora…hehehe

Selecionando a camada Nº 2, o layer 2, com a ferramenta Pen tool iremos criar um contorno “pontiagudo”, ou seja, fazer uma vetorização do numeral, mas criando algumas pontas, o que fará com que pareça mais real. Veja como ficou na imagem abaixo:

Fig. 08: Contorno com Pen tool

Agora vem a mágica, rsrsrs…

Primeiramente, devemos ocultar o numeral 2 (clicando no olho ao lado da camada); em seguida, recortar a imagem da grama; posteriormente, selecionar o vetor criado com a Pen tool e fazer uma colagem especial (CTRL+SHIFT+V).

Para podermos visualizar o efeito, é preciso ocultar as outras imagens de grama nas outras camadas, ok?!

E teremos isto:

Fig. 09: Resultado do contorno

Agora, na camada foi criada um junção entre o contorno e a imagem. Sendo assim, para retirarmos a borda deste contorno, devemos clicar na grama (que ficará com um contorno verde) e acessar o Painel Properties e retirarmos a cor da borda.

Fig. 10: Retirando a borda

6º Passo – Aplicando Efeitos

Pessoal, precisamos agora, criar um efeito tridimensional e começaremos com a aplicação de uma sombra e outros efeitos, ok?!

Primeiro, dupliquemos a camada que contém o número com a grama. Esta deverá ficar sobre a original e exatamente na mesma posição sobre ela.

Agora, vamos aos efeitos. Com a cópia selecionada, no Painel Properties, acionemos em Filters, a opção Photoshop Live Effects e façamos os ajustes a seguir:

Fig. 11: Aplicação de filtros do Photoshop

Duplicando novamente a camada original, vamos aplicar mais alguns efeitos. Esta nova cópia deve ficar sobre as demais.

Fig. 12: Aplicação de novos filtros

E pra fecharmos esta etapa, no Painel Properties, vamos colocar a opacidade em 55%. O resultado até agora é este:

Fig. 13: Resultado até aqui

7º Passo – Criando um Efeito 3D

Nesta etapa, faremos um efeito tridimensional. Então, novamente, vamos duplicar a camada original e colocá-la abaixo de todas as outras. Com ela selecionada, vamos desagrupar a imagem (CTRL+SHIFT+G), apagando a grama e deixando o contorno.

Com o contorno selecionado, vamos preenchê-lo com a cor preta e, com as teclas direcionais do teclado, vamos movendo-o para a direita e para baixo até ficar como a imagem a seguir:

Fig. 14: Deslocamento de sombra

Agora, vamos aplicar um filtro especial acessando Filters > Blur > Motion Blur e aplicar a seguinte formatação: Angle: 135º | Distance: 30.

E pra encerrar esta etapa, coloquemos a opacidade em 50%.

Fig. 15: Efeito Motion Blur

E pra finalizarmos esta etapa, devemos fazer mais duas cópias da sombra e para cada cópia, devemos deslocá-la mais para “dentro”, isto é, para esquerda e para cima. Deixando a opacidade em 40% e 30%, respectivamente para cada cópia e uma Blend Mode > Multiply.

Fig. 16: Resultado até aqui

8º Passo – Aprimorando o Efeito 3D

Até aqui nosso trabalho está indo bem, mas logicamente que dá pra melhorar ainda mais um “cadim”…rsrs

Vamos duplicar então, a camada que recebeu o último efeito (ela está sobre todas as outras) de Drop Shadow e Bevel and Emboss, lembram? Com a cópia dela, vamos posicioná-la abaixo de todas as sombras e aplicar o filtro em Filters > Adjust Color > Color Fillna cor Preta e Blend Mode > Multiply.

Feito isso, fazendo alguns deslocamentos para direita e para baixo, teremos, finalmente, um belo exemplo imagem 3D.

Fig. 17: Resultado final

9º Passo – Aplicação da Técnica Novamente

Trabalhoso? Que nada!

Agora só falta aplicar a mesma técnica para os outros números…hehehe

Mãos à obra!

O resultado final é este:

Agora é só acessar meu blog, fazer o download e colocar em seu desktop. =D

http://www.carloshps.com.br/blog/papel-de-parede-2009/

Um abraço e até a próxima.

Autor: CarlosHPS Webdesigner – Colunista Fireworks do Portal MXSTUDIO

Não deixem de me fazer uma visita em meu blog – www.carloshps.com.br/blog e ao meu portfólio – www.carloshps.com.br/portfolio

Escrito por CarlosHPS Webdesigner on novembro 27, 2008. Arquivado em Fireworks. Você pode seguir as respostas a esse artigo pelo RSS 2.0. Você pode deixar respostas para esse artigo