Fireworks CS4

3 jours | 2-FW-CS4B

Formations Informatiques > PAO / CAO / DAO / Webdesign > Webdesign

Objectifs

Réaliser des graphismes statiques ou animés, destinés à être intégrés à des pages web : illustrations et photographies optimisées, boutons et interfaces avec des effets de survol, Gif animés

Participants / Pré-requis

Une bonne connaissance de l’outil informatique est indispensable. La connaissance d’un éditeur HTML, d’un outil de dessin vectoriel et de retouche d’image sont un plus.

Contenu

Principe de l’édition graphique pour le Web

• L’interface personnalisable de Fireworks CS4
• Formats de graphisme pour le Web, effets d’animations HTLM, transparence
• Palettes de couleurs spécifiques
• Dimensions et résolution des graphismes Web
• Principes d’exportation et d’optimisation
• Découverte des fonctionnalités de Fireworks.
• Les modes de travail de Fireworks : vectoriel, bitmap et calque Web

Créer une illustration vectorielle

• Tracés simples et paramétrages
• Courbes de Bézier et polygones complexes
• Modification de tracés vectoriels : transformer, aligner, disposer, combiner, grouper
• Mise en couleur et application de textures
• Application d’effets et sauvegarde des réglages

Créer, importer, retoucher une image Bitmap

• Importer une image bitmap préparée dans Photoshop
• Réaliser une retouche bitmap simple sous Fireworks

Créer des textes avec effets

• Création de texte courant
• Placer un texte dans un tracé, sur un tracé
• Mettre en forme du texte
• Application d’effets
• Conversion en tracés, modification des tracés

Exportation de graphismes Web simples

• Choix des fonctions d’exportation : GIF, JPEG ou PNG
• Paramétrage et optimisation des images : palettes, taux de compression

Créer des graphismes interactifs : principes de base

• Gestion de la couche Web : principes DHTML FIREWORKS
• Tranches et Zones sensibles rectangulaires et polygonales
• Gestion des états multiples pour l’interaction

Créer des zones sensibles

• Création de zones sensibles simples et multiples
• Paramétrage des zones sensibles
• Exportation

Créer des boutons avec effets de survols

• Création d’un symbole « bouton »
• Affectation des effets de survols du bouton
• Création d’occurrences du bouton, disposition en barre de navigation
• Exportation

Créer une interface interactive avec effets de survols disjoints

• Création de tranches et de zones sensibles
• Création des états pour préparer les « états de survol »
• Paramétrage des actions / palette des comportements
• Application pour le Web
• Exportation

Créer un menu JavaScript

• Structurer un menu contextuel, le créer
• Paramétrage et tests
• Exportation

Créer un gift animé

• Création des images pour l’animation
• Assemblage, paramétrage du Gif animé
• Exportation Gif ou SWF

Intégration des fichiers exportés dans une édition HTML

• Régler les exports images et HTML
• Insertion du HTML Fireworks dans un éditeur HTML
• Export des images et des CSS associés
• Exporter un prototype de site fonctionnel au format PDF