Webly: Criando Flores - Webly

Ir para

IMPORTANTE: Todos os tutoriais postados neste fórum irão automaticamente para o portal Webly. Contribua você também e faça parte da equipe de colaboradores que fazem a evolução da web. Obrigado.
Página 1 de 1

Criando Flores Avaliar tópico: ***** 2 Votos

#1 Membro offline   marcinha Ícone

  • It's evolution, baby!
  • Ícone
  • Grupo: Administradores
  • Posts: 1397
  • Cadastrado: 13-julho 06
  • Sexo:Male
  • Localização:Brasília
  • Interesses:iEvoluir ;)

Postou 26 maio 2007 - 10:02

Explorar os recursos do Fireworks é fundamental para criar elementos que nem sempre são fáceis de ser criados. Tenho certeza que uma flor se enquadra perfeitamente nisso, mais neste tutorial mostro com é fácil simplificar as coisas com um pouquinho de criatividade e aproveitando o melhor de cada função. O fiel da balança neste caso é o auto-shape Star, forma autómatica presente nas versões 2004 e 8 respectivamente.

Embora para o tutorial...

1º - Crie um novo documento de 300px height por 300px width fundo branco.

Imagem

2º - No painel de ferramentas vector selecione a opção Star e clique no palco. Automaticamente surgirá uma estrela com o tamanho definido em 190px height por 181px width.

Imagem

Imagem

Esta estrela contém pontos de controle (amarelo) em posições específicas, trata-se de um auto-shape (forma automática) do Fireworks. Veja em detalhe:

Imagem

3º - Crie um mais um lado nesta estrela, de cinco vamos para seis.

Imagem

Para dar a forma desejada, é preciso arrastar o ponto de controle arredondamento exterior.

Imagem

A forma vai diminuir e ficar mais ou menos com este aspecto:

Imagem

4º - Aumente a forma com a ferramenta Scale tool (atalho = q).

Imagem

No próximo passo vamos começar a colorir a flor.

5º - Selecione a forma e no painel de propriedades clique em preenchimento, escolhendo a opção gradient > radial.

Imagem

Resultado:

Imagem

6º - Duplique a forma (ctrl + c e ctrl + v ou ctrl + shift + d) e em seguida diminua com Scale tool (atalho = q) para posicioná-la ao centro:

Imagem

Em detalhe a copia posicionada ao centro:

Imagem

No próximo passo vamos começar o uso de filtros, indo painel de propriedades > live filters.

7º - Com a copia selecionada vamos usar quatro filtros em seqüência.

Shadow and Glow > inner glow

Imagem

Noise > add noise:

Imagem

Blur > zoom blur:

Imagem

E Sharpen > sharpen more:

Imagem

Olhe como já vai tomando forma:

Imagem

8º - Duplique a forma do centro e diminua um pouco:

Imagem

Em seguida posicione também ao centro:

Imagem

9º - Através do ponto de controle de adição de lados, vamos criar até o número 18:

Imagem

Imagem

Hum... quase lá...

Imagem

Na verdade já está com aspecto muito bacana, mais vou adicionar mais um detalhe a flor:

10º - Selecione está última forma duplicada e altere para preto a seguinte cor de seu preenchimento radial:

Imagem

Imagem

Pronto! Basta selecionar todos os objetos, agrupá-los (ctrl + g) e em seguida adicionar sombra em live filters > shadow and glow > drop shadow:

Imagem

Abaixo uma simples imagem só para mostra como podemos aproveitar bem o que foi ensinado.

Imagem

E aqui outra flor usando o mesmo método:

Imagem

Detalhe: Cada flor terminada pode ser colorida em adjust colors > hue/saturation. Foi isso que fiz para modificar a tonalidade dos dois exemplos acima.

Considerações Finais
Como sempre cito, o que foi ensinado nesta coluna pode e deve ser aperfeiçoado, afinal nos mostramos como criar, o resto é com você. Se vale mais uma dica, estas flores também podem sofrer edição da ferramenta Smudge tool, para isso basta transformá-las em bitmaps!


Fonte: http://www.fireblogbrasil.com/?p=131
Webly, onde a internet é + humana.
Tá esperando o que pra se cadastrar e participar? =]


www.nerdsinlove.com.br
0

#2 Membro offline   Bilck Ícone

  • Ícone
  • Grupo: Membros
  • Posts: 6
  • Cadastrado: 30-agosto 08

Postou 09 setembro 2008 - 04:27

é so eu, ou vcs naum vê as img?
0

#3 Membro offline   Clayton Ícone

  • Ícone
  • Grupo: Membros
  • Posts: 6
  • Cadastrado: 18-abril 08
  • Sexo:Male
  • Localização:Brasil
  • Interesses:Design, Arte, Desenho, Ilustração, Pintura, Fotografia, Photoshop, animação 3D e etc...

Postou 09 setembro 2008 - 09:22

Eu também não consigo visualizar as imagens. quando clico no texto e arrasto o cursor, não aparece o espaço onde deveriam estar as imagens, apenas as linhas com o texto.
May The Force be with you
0

Página 1 de 1


Resposta rápida

  

1 usuário(s) está(ão) lendo este tópico
0 membro(s), 1 visitante(s) e 0 membros anônimo(s)