Gadjet personalizado

• Tweet
• Sharebar

• Tweet

Coluna de Fireworks – Gadjet personalizado

Introdução

Olá comunidade MXStudio!
Um dos últimos desafios do MXstudio, foi sobre gadjets.
O que são gadjets?
imagem
Todos os itens à direita são gadjets, o desafio propõs à ser feito o 2° de cima para baixo.
O intuito desse artigo, não é mostrar como tudo foi feito, mas sim, dar uma boa base.

.

Pré-requisitos

O tutorial foi desenvolvido no Adobe Fireworks 8.
PNG

Objetivos

Fazer um gadjet.

Gadjet personalizado

Quase sempre quando vou fazer algo, prefiro fazer uma base, para depois realmente ir trabalhando para deixar como quiser, para fazer o gadjet não foi diferente, vou mostrar o exemplo do que havia feito, e o que acabou saindo no final, para vocês já terem uma boa idéia.

Em primeiro lugar, vamos abrir um novo arquivo, para começarmos à realmente trabalhar.
Escolha um tamanho que lhe agrade, o escolhido por mim foi de 207 * 225.

Logo após, vamos selecionar a ferramenta Rounded rectangle, para fazermos um retângulo com bordas arredondadas.
Escolha o tamanho desse retângulo, vale lembrar que dependendo do tamanho que você colocar, não ficará muito agradável colocar os outros tamanhos proposto no artigo, tente seguir sempre uma mesma linha de pensamento de acordo com o tamanho.
O tamanho escolhido por mim, foi de 150 * 187.

Selecione o nosso retângulo criado anteriormente, e vamos ao live filters*
Clique no “+” para abir as nossas opções do live filters, vamos em Shadow and glow> glow

Vamos dar um glow bem fraco, apenas para dar um pequeno efeito, esteja à vontade para configurar diferente, veja a imagem da configuração de exemplo usada:

* – Localizado no painel properties, veja a imagem para melhor entendimento:

Duplique o retângulo, para isso basta apertar CTRL + SHIFT +D.
Lembre-se dessa sequência de teclas, pois facilita muito o trabalho.
Agora sim, vamos mudar bastante o retângulo.
Continuamos nos live filters, vamos adicionar dois inner glow e um glow.
Veja as configurações de exemplo, caso queira mudar, esteja à vontade.
Para acessar o inner glow, vá em shadow and glow> inner glow.

Duplique o retângulo (lembre-se da sequência de teclas, CTRL + SHIFT +D), desative tudo o que estiver no live filters, para isso, selecione o que queira deletar e aperte no “-”.
Depois de ter duplicado o retângulo, vamos adicionar um gradiente nesse, novo retângulo.
Se você não sabe criar um gradiente, ou tem alguma dúvida, veja os retângulos verdes.
Isso foi acessado pelo painel properties.

Duplique o retângulo, coloque ele na cor preta (mesmo jeito que você colocou o gradiente, mas ao invés de gradiente, ponha em solid).
Baixe a opacidade para 5.

Vamos duplicar novamente o retângulo, adicionaremos outro gradiente (bars).

Adicionei mais duas layers, porém não fizeram quase nenhuma mudança aparente, baixem o PNG e vejam todas as layers.

Agora, vamos começar adicionando dois gradientes brancos, vindo de cima.
Duplique o nosso retângulo novamente.
Veja maiores explicações abaixo:

Adicionei algumas outras layers, mas não modificou quase nada.
Duplique a layer do retângulo, ponha a cor preta, e vamos mudar o blend mod para soft light, abaixei a opacidade para 20.

adicionei a logo do mxstudio, e coloquei um glow, veja a configuração usada:

resolvi tirar algumas partes do artigo, para o pessoal não ficar apenas grudado no artigo, mas sim, fazendo o seu, mas caso alguém queira ver como tudo foi feito, é só baixar o .PNG.

Resultado:

Depois dei uma trabalhada no fundo:

Fica bonito deixar apenas o retângulo em escala de cinza, e o resto colorido.

Enfim, use a sua criatividade!

Considerações finais

Vimos nesta coluna, como fazer um gadjet personalizado, caso queira ver algo que não expliquei na coluna baixe o .PNG.

Espero que vocês tenham gostado desta coluna e até a próxima.

Autor: João Castro – jpcastrobr – Colunista de Fireworks e Photoshop do MXstudio

Qualquer dúvida envie um email para jpcastrobr@mxstudio.com.br ou acesse o nosso fórum.

Escrito por joaocastro on março 23, 2007. Arquivado em Fireworks. Você pode seguir as respostas a esse artigo pelo RSS 2.0. Você pode deixar respostas para esse artigo