maio 01, 2008 from fabiano's blog
Apesar de não ser um grande fã do Internet Explorer, vale o desafio de tentar recriar os efeitos do logo do IE7 e claro, no Fireworks.
Vamos mostrar aqui como fazer esses efeitos e utilzar diversas e novas ferramentas do fireworks que não tinhamos usado antes nos tutoriais.
PASSO 1
Vamos começar criando nossa letra, aqui vamos usar a letra "a". Escolhemos a fonte Helvetica, mas você pode usar a que preferir. Deixe ela na cor #000. Agora vamos trabalhar ela em curvas, para isso clique com o botão direito nela e vá em Convert to paths. Ele irá converter e deixar agrupado o layer, desagrupe para podermos trabalhar com os pontos mais pra frente.
PASSO 2
Agora duplique esse layer e neste de cima aplique um Gradiente Bars e com as cores como mostramos na figura.
PASSO 3
O layer que ficou por baixo será nossa borda preta. E para isso este de cima precisa ser um pouco menor. Selecione o comando Modify > Alter Path > Inset Path. Selecione Inside e width 5.
Depois faça como na figura seguinte, selecione os pontos e vá modificando para deixar eles bem alinhados e com bom espaçamento. Na parte de baixo é legal deixar bem perto da borda para criarmos o efeito certo.
PASSO 4
Agora vamos aplicar bevels e shadows nesse layer. Serão 2 Bevels e 1 Inner Shadow. Deixe os valores como na figura em cada um dos filtros.
PASSO 5
Boa parte da estrutura está pronta agora temos que começar a colocar os efeitos. Vamos fazer o reflexo na parte de cima. Para isso, simplesmente duplique o layer do "a" azul e apague os pontos selecionados na figura. Depois ajuste a curva e aplique um Gradiente Linear com os lados #FFF e 0% de alpha em um dos lados.
PASSO 6
Agora vamos fazer o efeito de luz que aparece na parte de baixo. Será feito com 3 elipses. Aplique as cores como na figura e repare que usamos sempre um Feather e um filtro. Depois agrupe os 3 elementos.
PASSO 7
Vamos aplicar uma máscara agora nesse grupo. Selecione o "a" azul copie (CTRL+C), depois vá em Modify > Mask > Paste as Mask . Duplique esse layer e aplique o filtro Overlay nos 2 layers com alpha de 60% no de cima.
PASSO 8
Precisamos agora criar os arcos amarelos. Vamos usar elipses para fazer eles. Crie 2 elipses como na figura. Para deixar elas no formato e tamanho desejado, use a ferramenta "Q" na opção Distort que facilita bastante.
Depois de criar as duas elipses vá em Modify > Combine Paths > Punch. O arco final está na cor #F8A30A. Faça uns ajutes na ponta de baixo parecer que ela passa por trás da letra.
PASSO 9
Nesta forma aplicamos um Inner Glow com os valores 2 50% 6 0. Depois vamos criar uma nova forma com a ferramenta Pen. Deixe por baixo do arco com o gradiente linear com as duas cores #F8A30A e um lado com alpha 0% como mostra a figura.
PASSO 10
Agora vamos criar a sombra do arco. Duplique o arco amarelo, diminua ele e deixe na cor preta. Aplique agora um Gradiente Radial e deixe bem suave as cores trabalhando com os valores do alphas no gradiente.
Agora aplicamos uma máscara nesta sombra. Copie o "a" azul (CTRL+C) e faça o mesmo processo anterior, selecione a sombra e vá em Modify > Mask > Paste as Mask .
RESULTADO FINAL
Seu efeito deve ter ficado parecido com este!
Podemos colocar também um complemento ou brincar com algumas cores.
