Fireworks

FIREWORKS

>> ESTE BLOG FOI CRIADO POR: ANGEFFERSON ÉRICO.

INÍCIO COREL PS FW FL HTML / CSS DW PHP

INTRODUÇÃO AO FIREWORKS

DEFINIÇÃO:

O Fireworks é um editor de imagens de bitmap e desenho vetorial desenvolvido pela Macromedia, posteriormente adquirido pela Adobe. Suas funcionalidades focam a publicação gráfica na Internet, por isso inclui suporte a GIF animado, PNG e imagens fatiadas, além de possuir ótima compressão de imagens. A partir da versão MX, ganhou integração com outros produtos da mesma linha, Dreamweaver, Flash e Freehand.

Com a aquisição da Macromedia em 2005 pela Adobe, houve um choque entre os seus programas, Fireworks e ImageReady, Dreamweaver e GoLive, Freehand e Illustrator. Assim, o objetivo da Adobe foi em criar um conjunto mais poderoso de soluções para a criação, gerenciamento e entrega de conteúdo e experiências atraentes em múltiplos sistemas operacionais, dispositivos e mídias.

O desenvolvimento do ImageReady foi cancelado prevalecendo o Fireworks como editor gráfico para Internet.

- NESTE SOFTWARE, VOCÊ APRENDERÁ A CRIAR SITES E PORTFÓLIOS DE QUALIDADE E BOM DESIGN.

- PARA UTILIZAR O FIREWORKS, ACONSELHAMOS QUE VOCÊ TENHA CONHECIMENTO DE COREL DRAW E PHOTOSHOP.

Qual a diferença entre um blog e um site?

Uma dúvida muito comum para maioria das pessoas é "Qual a diferença entre um blog e um site?"
Tecnicamente, os dois são similares, pois são compostos de páginas HTML e são acessados através de um endereço de internet.

O que diferencia um blog de um site é a maneira pela qual o conteúdo é gerenciado e a interação com o público alvo. Para facilitar o entendimento, vamos fazer algumas analogias:

O site é como uma apresentação corporativa da empresa, portanto é mais formal do que um blog.

O blog é como um amigo que entende muito sobre um assunto e gosta de compartilhar dicas com seus amigos, portanto é mais informal do que um site e quem gerencia um blog em geral possuem autonomia total para publicar suas opiniões.

Neste artigo vamos comparar algumas diferenças fundamentais entre blogs e sites para entender como utilizá-los da forma adequada para sua empresa.

Diferenças entre Blog e Site

A tabela abaixo ilustra as principais diferenças entre blogs e sites. Lembro que, atualmente, muitos sites são atualizados com frequência.

	BLOG	SITE
Objetivo	Informar e interagir com clientes e pessoas interessadas no tema do blog.	Informar produtos/serviços da empresa e potencializar negócios.
Estrutura	Navegação muito simples com posts ordenados por data e classificados por categorias.	Navegação mais rígida e formal. Possui uma Home Page para destacar as principais áreas do site.
Conteúdo	Mais informal e focado em um tema específico. Atualizado com grande frequência.	Mais formal e com fluxo de aprovação mais rígido. Atualizado com pouca frequência.
Quem gerencia	Em geral, uma ou mais pessoas especializadas no tema com total autonomia publicação.	Área de marketing. Muitos são estáticos e dependem de produtoras web para ter seu conteúdo alterado.
Interação com o público	Os comentários são a grande característica dos blogs. Os visitantes podem comentar os posts e dar opiniões, seja contra ou a favor do coteúdo.	A interação com o site em geral são através de formulários de contato, e-mails, e quando muito com atendimento via chat.
Divulgação	O blog tem visitas com origem no site principal, mas muitas delas são de visitantes frequentes e, muitas vezes, do Google. O Google gosta de conteúdo frequente, portanto os blogs são muito encontrados nas buscas. Muitos blogs são promovidos de forma "viral".	Divulgação oficial da empresa. O site também é encontrado no Google, mas em geral tem menos apelo "viral".
Facilidade para desenvolvimento	É possível criar um blog em minutos usando plataformas gratuitas de blogs comohttp://wordpress.com ou http://www.blogspot.com. O WordPress também pode ser instalado FACILMENTE no seu domínio (http://br.wordpress.org/).	Mais complicado, pois envolve a participação de muitas pessoas. Em geral, é desenvolvido por agências digitais.

DEFINIÇÕES

DICAS DO PROFESSOR

1- INTERFACE

> PAINEL DE FERRAMENTAS: Ele está dividido em 6 (seis) seções; a saber: Selecionar; Bitmap; Vetor; Web; Cores e Exibir.
> PAINEL DE PROPRIEDADES: Cada ferramenta selecionada abrirá um painel com ferramentas inerentes a ferramenta selecionada.
> INTERATIVIDADE: Fatias e Pontos de Acesso são objetos da web que especificam áreas interativas em um gráfico da web. As fatias cortam uma imagem em seções exportáveis para que possamos aplicar comportamentos de sobreposição; animação e links de URL.
> OTIMIZAR: No Fireworks é o processo que prima pela qualidade das imagens exibidas na web. Há toda uma técnica no Fireworks para conseguir a "perfeição" da otimização.
> BITMAPS: São gráficos compostos de pequenos quadrados coloridos denominados pixels; que se combinam como os ladrilhos de um mosaico para criar uma imagem.
> VETORES: Denominamos Objeto de vetor; um gráfico de um computador cuja forma é definida por um caminho. A forma deste caminho é determinada por pontos que são plotados ao longo dele. A cor de traçado do objeto de vetor acompanha o caminho e seu preenchimento ocupa a área dentro dele. O traçado e o preenchimento determinam a aparência do gráfico quando publicado para impressão ou na web.
> GRADIENTE OU DEGRADÊ: Trata-se de um recurso que permite ao Web Design aplicar uma transição de cores ou tonalidades de cores. Tipos de Gradientes: Linear; Radial; Retângulo; Cone; Contorno; Acetinado; Explosão; Dobras; Elipse; Barras; Ondulações e Ondas.
> CORES DE PADRÃO OU TEXTURAS: Aplicam texturas diferentes no Fireworks. Texturas: Folhas, Madeira; Metal-Placa, Bolhas e Ilusão.
> OPACIDADE: Determina a claridade da imagem.
> ESTILOS: Predefinem estilos de textos e objetos no Fireworks.
> CAMADAS: É o local onde estão alojados os objetos trabalhados no Fireworks.
> MÁSCARAS: Servem para ocultar ou mostrar partes de um objeto ou imagem.
> BOTÕES: São tipos essenciais de símbolos usados como elementos de navegação para uma página da web.
> MENUS POP-UP: São exibidos em um navegador quando o usuário move um ponteiro sobre um objeto da web de acionamento ou clica nesse objeto, que pode ser uma fatia ou ponto de acesso.
> LAYOUT: São retângulos que aplicados de forma correta podemos deixar os mesmos com uma aparência chamativa e atraente.
> TIPOLOGIA: É a forma que o website é desenvolvido; sendo esta condizente com o gosto da maioria do público alvo; sendo assim criado dentro dos parâmetros que condizem com a temática do website.

MAIS SOBRE O FIREWORKS

Princípios básicos do Fireworks O Adobe® Fireworks® é um programa versátil para criação, edição e otimização de gráficos da Web. Você pode criar e editar imagens de bitmap e de vetor, projetar efeitos da Web, como sobreposições e menus pop-up, recortar e otimizar gráficos para reduzir seu tamanho de arquivo e poupar tempo automatizando tarefas repetitivas. Você pode exportar ou salvar um documento como arquivo JPEG, arquivo GIF ou um arquivo de outro formato. Esses arquivos podem ser salvos junto com arquivos HTML contendo tabelas HTML e código JavaScript, para que você possa usá-los na Web.

Desenhar e editar objetos de vetor e bitmap O painel Ferramentas do Fireworks inclui seções distintas que contêm ferramentas para desenhar e editar vetores e bitmaps. A ferramenta selecionada determina se o objeto criado é um vetor ou um bitmap. Depois de desenhar um objeto ou texto, você pode usar uma ampla variedade de ferramentas, efeitos, comandos e técnicas para aprimorar gráficos ou criar botões interativos de navegação. Você também pode importar e editar gráficos em JPEG, GIF, PNG, PSD e muitos outros formatos de arquivo.

Adicionar interatividade a gráficos Fatias e pontos de acesso são objetos da Web que especificam áreas interativas em um gráfico da Web. Fatias cortam uma imagem em seções exportáveis às quais você pode aplicar comportamentos de sobreposição, animação e links de URL. Em uma página da Web, cada fatia aparece em uma célula de tabela. Use as alças de sobreposição de arrastar e soltar em fatias e pontos de acesso para atribuir rapidamente comportamentos de troca de comportamentos de imagem e sobreposição. Use o Editor de botões do Fireworks e o Editor de menu pop-up para criar gráficos interativos especiais para navegação em sites da Web.

Otimizar e exportar gráficos Use os eficientes recursos de otimização do Fireworks para obter o equilíbrio certo entre tamanho de arquivo e qualidade visual aceitável para gráficos exportados. O tipo de otimização escolhido depende das necessidades dos seus usuários e do conteúdo. Após a otimização de gráficos, a etapa seguinte é exportá-los para uso na Web. No documento PNG de origem do Fireworks, é possível exportar arquivos de vários tipos, incluindo JPEG, GIF, GIF animado e tabelas HTML contendo imagens fatiadas em vários tipos de arquivo.

Gráficos de vetor e de bitmap Computadores exigem gráficos em formato de vetor ou bitmap. Compreender a diferença entre os dois formatos pode ajudar você a compreender o Fireworks, que contém ferramentas de vetor e bitmap e é capaz de abrir ou importar ambos os formatos.

CLIQUE EM APRENDA MAIS

BANNER CRIADO NO FIREWORKS

BANNER ANIMADO NO FIREWORKS

EXPORTAR LAYOUT DO FIREWORKS PARA O DREAMWEAVER

TESTE FINAL

Teste Final Prático - Fireworks

Observando os vídeos tente desenvolver uma página da web!!

Teste Final - Fireworks

Teórica

1- O que é o Fireworks?

2- O que constituí a interface do Fireworks?

3- Quais os procedimentos para criação de Efeitos No Fireworks? E mascáras?

4- O Fireworks cria animações simples. Como as mesmas são desenvolvidas?

5- O que é a fatia? E o Botão Roloover?

6- Como organizar a pasta raiz?E como Otimizar um Website no Fireworks?

7- Qual a dimensão padrão para uma página da web? E como estabelecer o vínculo entre as páginas?

8- Trazer uma apresentação de slides sobre tudo o que você aprendeu no Fireworks.

9- Trazer uma Síntese com passo a passo para criação de um website no Fireworks. ( Impressa no word com folha de rosto - Pergunte ao professor como fazer).

10- O que é (são):

1- Web Design:

2- Email Marketing:

3- Banner:

4- Menu Pop-Up:

5- Janela Pop-Up:

6- Plataformas:

7- Design de Site: