Pesquisar no blog

Mostrando postagens com marcador design. Mostrar todas as postagens
Mostrando postagens com marcador design. Mostrar todas as postagens

Slice Tool

Fatias são os fundamentos básicos para criar interatividade no Adobe Fireworks. Fatias são objetos da Web que existem essencialmente como código HTML. É possível exibi-las, selecioná-las e renomeá-las através da Camada da Web do painel Camadas.

A técnica de aplicação de fatias corta um documento do Fireworks em partes menores e exporta cada parte como um arquivo separado. Ao exportar, o Fireworks cria um arquivo HTML contendo o código de tabela para remontar o gráfico em um navegador.
Otimiza imagens Para download mais rápido.
Adiciona interatividade Para que as imagens possam responder a eventos do mouse.
Facilita atualizações Para partes de páginas da Web que são alteradas com frequência (por exemplo, fotos e nomes em uma página de "funcionário do mês").

Criar fatias retangulares

Crie fatias retangulares desenhando com a ferramenta Fatia ou inserindo uma fatia baseada em um objeto selecionado. Use guias de fatia (as linhas que se estendem do objeto de fatia) para determinar os limites dos arquivos de imagem separados nos quais o documento se divide ao ser exportado.


Criação de fatias retangulares
Desenhar um objeto de fatia retangular
Selecione a ferramenta Fatia .

Arraste para desenhar o objeto de fatia.

Nota: Para ajustar a posição de uma fatia enquanto você arrasta para desenhá-la, mantenha pressionado o botão do mouse, pressione e segure a barra de espaço e arraste a fatia até outro local na tela de desenho. Solte a barra de espaço para continuar a desenhar a fatia.

Criar uma fatia retangular com base em um objeto selecionado
Selecione Editar > Inserir > Fatia retangular. A fatia é um retângulo cuja área inclui as bordas mais externas do objeto selecionado.

Se mais de um objeto for selecionado, escolha Simples para criar um único objeto de fatia que abranja todos os objetos selecionados ou escolha Múltipla para criar um objeto de fatia para cada objeto selecionado.

Criar uma fatia retangular com base em um objeto selecionado
Selecione Editar > Inserir > Fatia retangular. A fatia é um retângulo cuja área inclui as bordas mais externas do objeto selecionado.

Se mais de um objeto for selecionado, escolha Simples para criar um único objeto de fatia que abranja todos os objetos selecionados ou escolha Múltipla para criar um objeto de fatia para cada objeto selecionado.

Se perdeu alguma parte, baixe o arquivo fonte abaixo e estude as camadas e efeitos à vontade.

Apostila Curso Fireworks para Web

http://www.castordownloads.com/download-curso-fireworks-para-web-2013-65895.html

Apostila gratuita ensina o básico de Photoshop

Apostila Photoshop CS5

É, clicar e baixar!

http://www.4shared.com/zip/MfbT_xZ2ba/3246_photoshop_cs5.html?

Sobre Objetos Inteligentes no Photoshop (Smart Objects)

A função dos Smart Objects  é preservar as imagens durante a edição. Levando em conta de que se trata de uma edição Não Destrutiva, você pode girar e redimensionar uma imagem sem perder a qualidade inicial. Para transformar uma imagem inicial em Smart Objects é muito simples.

1 - Com a imagem aberta, clique com o botão direito do mouse na camada da imagem e escolha a opção Convert to Smart Object.




No canto inferior direito será mostrado uma miniatura indicando que a camada é um Smart Object.

2 - Para editar um Smart Object, basta dar um duplo clique na miniatura. Na janela que surgir dê OK e faça todas as edições que precisar.
Em seguida, vá em: Arquivo/Salvar para atualizar seu Smart Object.

Dica: Você pode abrir uma imagem diretamente como um Smart Object. Basta ir em: Arquivo/Open as Smart Object



Vale lembrar que esse recurso está presente a partir da versão CS2.

Como Testar um Site Responsivo

Acredito que uma das piores tarefas em um projeto é a etapa de teste. Apesar de hoje em dia a diferença entre os navegadores estar cada vez menor (quem lembra do IE6!?) é importante testar seu site nos principais navegadores. Testar em Desktop é relativamente fácil, o desafio aqui é testar em dispositivos móveis.
Uma coisa é certa, se seu site responsivo quebra no desktop vai quebrar também no móbile. Eu ainda procuro validar meus códigos, pois assim consigo encontrar os erros mais grosseiros o mais cedo possível. 
Procure investir em um número de dispositivos e monte um laboratório de testes. Nada melhor quetestar seu site em um dispositivo real, somente ele lhe dará 100% de certeza. Aí você deve estar se perguntando: “qual aparelho comprar?”. Para não errar, invista nos mais populares. Mas isso vai depender também do tipo de projeto que você faz e a que tipo de mercado deseja servir. Escolha aqueles que são representativos, aqueles que seus clientes mais usam. Se possível use o Google Analytics para coletar informações relevantes dos dispositivos utilizados pelos usuários.
È impossível ter todos os modelos de dispositivos móveis existentes, por isso é importante o compartilhamento de dispositivos entre outros desenvolvedores e seus amigos. Procure criar comunidades entre seus amigos onde as pessoas possam encontrar e compartilhar dispositivos. Eu sempre que posso uso os aparelhos dos meus amigos para fazer alguns testes.