Flex + PSD Layout = Blog - Tutorial v.1

   

Depois de ter anunciado a criação de um layout para implementação no flex, venho agora apresentar o tutorial de como fazer a separação de layers no Photoshop, e a sua devida importação para o flex.

 

Neste exemplo podem encontrar alguns detalhes de código que pode ser muito util, como o alinhamento central do blog, algum css (externo), viewstack e linkBar, bem como colocar todas as nossas imagens no flex.

 

Se contar-mos com o tamanho da framework (cerca de 220 kb) e sabendo que o final da nossa aplicação compilada o tamanho do swf é de 297kb, conseguimos incorporar as imagens no flex, e fazer o seu layout com apenas 77kb de dados e com uma imagem bem original no flex, quase uma skin.

 

Podem fazer o download do pdf com o tutorial aqui.

Dentro do pdf encontram-se os downloads para o layout.psd (ficheiro de origem do psd com os devidos grupos do layout) bem como o link para o código fonte e visualização online que também podem ver aqui  com o código disponível e umas pequenas alterações.

Aguardam-se opiniões e já agora deixem as vossas experiências gráficas em comentário.

Abraço.

versão pdf temporariamente indisponivel.
Deixe um comentário ou um Trackback

3 Comentários

  1. Maio 29, 2008 às 12:07 pm | Permalink

    Explorando o que pouco se fala! Parabens, Mario!

    É bom saber fazer na unha, antes do Thermo dar as caras!

  2. Maio 29, 2008 às 3:11 pm | Permalink

    Ótima iniciativa! Se quiser ajuda na hora de integrar como wordpress é só dá um toque.

  3. Diego M Salvanha
    Janeiro 7, 2009 às 6:41 pm | Permalink

    por favor.. me mandem o pdf por email.. n estou encontrando.,.. mt obrigado

Um Trackback

  1. [...] Entradas » Ultimos Comentários » Entradas Populares » » Flex + PSD Layout = Blog - Tutorial v.1 » Adobe Dreamweaver e Fireworks CS4 Online. » Flex + PSD Layout + msdevstudio = Free [...]

Deixe um comentário

O seu email nunca será publicado ou partilhado. Campos obrigatórios estão marcados com um *

*
*