- NeoStream
- 2Advanced
- WM Team
- Notedrem
- LifeMotion
- MONOcrafts
- Red Universe Clique na estátua e arraste
- Leo Burnett
- WhoWeStudios
- David Gary
- Get The Glass
- Templo da Pegação Sprite
Issaeee
Abrazz
Issaeee
Abrazz
E não desejo boa sorte pra ninguém, pois quem estuda não precisa de sorte!
Aqui então teremos uma video-aula de como montar esta galeria utilizando o Dreamweaver, PHP e MySQL.
Claro que, antes de começar a brincar, é preciso instalar o servidor Apache na sua máquina para usar o PHP.
Divirtam-se!
Até a próxima!
Extensão: Barra developer trial
Extensão: Comprar Barra developer
Buenas! Iniciando a idéia do blog, começamos com um dos meus programas favoritos: o Fireworks!
Constantemente eu recebo a mesma pergunta dos meus alunos: "Como usar o equilibrio e atingir um resultado final bom, em um novo website. Decidi criar uma sequência de artigos mostrando a construção do famoso Layout Legal.
Página inicial do projeto:
Página interna do projeto:
Clique aqui para fazer o download dos arquivos.
Como vocês viram, o layout não tem nada de muito complicado. A idéia principal é criar um trabalho limpo, bonito e combinando as cores. Vamos à primeira parte do trabalho:
Crie um novo arquivo no Fireworks, com as seguintes medidas:
Desenhe um retângulo e configure da seguinte maneira:
Vamos trocar o tipo de preenchimento para Linear, sendo a primeira cor #99CC00 e a segunda #E7F3C2, deixando o degradé configurado da seguinte maneira para o resultado abaixo:
Desenhe outro retângulo para fazermos o topo e siga as configurações:
Preenchimento: Linear
Primeira Cor: #0867BCSegunda Cor: #FFFFFF
Linha com espessura: 2Cor da Linha: #287BC5
Vamos adicionar o filtro Inner Glow
Cor do efeito: #287BC5
Chegaremos ao seguinte resultado:
Para finalizar a primeira parte, vamos importar as imagens: Logo e Imagem 1.
Posicionamento das Imagens:
Logo: X: 29, Y: 14
Imagem 1: X: 516, Y: 22
Vamos dar continuidade à série.
A imagem acima mostra a fase que interrompemos a criação do layout.
Desenhe um retângulo com a seguinte configuração:
Chegamos ao seguinte resultado para finalizarmos o fundo do site:
Crie a área da newsletter e desenhe um retângulo com a seguinte configuração:
Agora vamos configurar os efeitos do retângulo:
Preenchimento:Degradê Linear
Cor 1: #FF6600 - Cor 2: #FFC164Filtro Inner Glow: cor - #FF6600
Teremos o seguinte resultado:
Agora vamos adicionar os textos e criar os campos:
Assine nossa newsletter - Fonte: Agency FB, tamanho 18, estilo negrito e cor #FFFFFFFique por dentro das novidades - Fonte: Agency FB, tamanho 14, estilo negrito e cor #FFFFFF
Nome e E-mail - Fonte: Agency FB, tamanho 14, estilo negrito e cor #FFFFFFConfiguração das caixas de campo:
Cor de preenchimento: #FFFFFFCor do contorno: #666666
Veja o resultado:
Vamos construir o botão OK para finalizarmos esta parte:
Desenhe uma elipse no tamanho 67 x 67 com as seguintes configuraçõesPreenchimento: Radial, Cores: #FFFFFF e #438BCC
Contorno: #438BCCDeixe o degradê na seguinte posição:
Vamos adicionar os filtros:
Inner Glow:Cor do efeito: #438BCC
Drop Shadow:
Cor da sombra: #666666Agora faça o seguinte desenho com a ferramenta caneta:
Adicione o efeito Feather na quantidade 4, para finalizar o botão vamos adicionar o texto "OK".
Veja o resultado final:
O layout encontra-se assim até o momento:
Desenhe um retângulo de cantos arredondados modificando os cantos utilizando a tecla ALT. Em sequência aplique as configurações abaixo:
Preenchimento: Gradiente Linear nas cores: #009999 e #7CCACAContorno: espessura = 2 e cor: #009999
Agora duplique o retângulo criado, mantendo-o na mesma posição. Com a ferramenta Caneta (Pen tool) edite para chegar ao resultado abaixo:
Foi necessário fazer algumas alterações no preenchimento do retângulo duplicado, alterando as cores para preto e branco, sem contorno, opacidade 26% e Blend Mode para Screen.
Precisamos acrescentar os itens do menu: A Academia, Profissionais, Saúde, Novidades, Tabela de Horários, Fotos e Contato.
Utilizando os procedimentos citados acima criem as outras caixas:
Cores e efeito utilizado:
Caixa 1:
Preenchimento: #FFCC00 e #FF9900;Contorno: #FF6600;
Efeito: Inner Glow, cor: #FF6600 e tamanho: 2;Caixa 2:
Preenchimento: #FFFF66 e #CCCC00;Contorno: #CCCC00;
Efeito: Inner Glow, cor: #CCCC00 e tamanho: 2;Caixa 3:
Preenchimento: #619ED4 e #A8C9E8;Contorno: #70A8D8;
Criaremos os títulos de cada caixa:
Efeito do texto: Glow;
Adicionamos mais alguns itens para ilustrar o layout para finalizar:
Considerações finais:
No efeito criado atrás da imagem foi utilizado o filtro Alien Skin Splat!, que infelizmente não consta mais no Fireworks CS3।
Fonte: www.imasters.com.br