« STIC:STIC I - exercice 4 (Stella) » : différence entre les versions

De EduTech Wiki
Aller à la navigation Aller à la recherche
 
mAucun résumé des modifications
Ligne 1 : Ligne 1 :
#REDIRECTION [[STIC:STIC I - exercice 4 (Nestor-Pixel)]]
{{en construction}}
{{stic12}}
<categorytree mode="pages" depth="0" style="float:right; clear:right; margin-left:3px; border:1px solid gray; padding:0.7ex; background-color:#f9f9f9;">STIC</categorytree>
<categorytree mode="pages" depth="0" style="float:right; clear:right; margin-left:3px; border:1px solid gray; padding:0.7ex; background-color:#f9f9f9;">Tutoriels Flash</categorytree>
 
== Objectifs ==
 
# Comprendre l'architecture des boutons (et savoir en créer)
# S'initier à la logique du event-driven programming (event handlers +ActionScript simple)
# Utilisation du composant vidéo pour publier une vidéo
# Utilisation du composant bouton pour naviguer dans la timeline
# Savoir créer un "site Flash" (plusieurs images reliés par des boutons)
 
== Programme ==
 
=== Rappel clips ===
 
* [[Flash CS4 - Symboles et clips]]
 
En principe, toute animation sera faite à l'intérieur d'un seul clip et pas sur la timeline (chronologie) principale. Dans un frame (image) vous n'insérez que des boutons de navigation, ensuite vous placerez un seul clip qui lui contient toute la scène pour ce frame.
 
A la limite vous pouvez composer un frame à partir de plusieurs symboles et faire le scripting dans la calque "action". Globalement, je déconseille cette stratégie.
 
=== Le composant vidéo (I) ===
 
* Encodage flv et rognage
* Utilisation de vidéos flv avec la composante FLVPlayBack
* Videos dans la timeline (pas trop conseillés)
 
* Previews:
** [http://tecfa.unige.ch/guides/flash/ex/component-video-intro/flash-cs3-video-simple-server.html flash-cs3-video-simple-server.html]
 
* Handout: [[Flash CS4 - Composants videos]] (fr) ([[:en:Flash video component tutorial|Flash video component tutorial]] (en)
 
=== Son ===
 
* [[Flash CS4 - Son]] (ébauche)
* [[:en:Flash sound tutorial|Flash sound tutorial]]
 
=== Boutons et premier contact avec ActionScript ===
 
* Previews
** [http://tecfa.unige.ch/guides/flash/ex/buttons-intro/flash-cs3-image-map.html flash-cs3-image-map.html] (image maps)
** [http://tecfa.unige.ch/guides/flash/ex/buttons-intro/flash-cs3-rocket-launcher-as3.html flash-cs3-rocket-launcher-as3.html]
**  [http://tecfa.unige.ch/guides/flash/ex/buttons-intro/flash-cs3-simple-menu-site.html flash-cs3-simple-menu-site.html]
** [http://tecfa.unige.ch/guides/flash/ex/buttons-intro/flash-cs3-simple-slide-show-as3.html flash-cs3-simple-slide-show-as3.html]
* Handout: [[Flash CS4 - Boutons]] - ([[:en:Flash button tutorial|Flash button tutorial]])
** Boutons de la librarie
** Faire soi-même des boutons (y compris à partir de bitmaps)
** Définir un event-handler simple et enregistrer avec le bouton
* [[Flash CS4 - Symboles et clips]] (pour la définition de "symbol" et "clip").
 
=== Les composants ===
 
(petite sensibilisation)
 
* Handout: [http://tecfa.unige.ch/guides/flash/ex4/components-intro/flash-cs4-components-overview.swf flash-cs4-components-overview.swf]
 
=== Le composant bouton et ActionScript ===
 
* Previews
** [http://tecfa.unige.ch/guides/flash/ex4/components-intro/flash-cs4-simple-slide-show-menu.swf flash-cs4-simple-slide-show-menu.swf]
** [http://tecfa.unige.ch/guides/flash/ex4/components-intro/flash-cs4-simple-slide-show-menu-fewcode.swf flash-cs4-simple-slide-show-menu-fewcode.swf]
* Handout: [[Flash CS4 - Composant bouton]]
 
=== Les fragments de code ===
 
* Handout: [[Flash CS5 - Editeur ActionScript et fragments de code]]
 
== Exercice à rendre ==
 
'''A rendre''': Dimanche soir avant période 2 (un retard entraîne un pénalité de 1 point)
 
=== Tâche ===
 
'''Deadline''': Dimanche minuit avant la 2ème semaine présentielle.
 
Faites une application Flash de type "site" avec un menu. Elle doit comprendre au moins:
 
* Plusieurs "pages" navigables (au moins 4)
* Un menu (au moins sur le premier frame/image) et des boutons de navigation qui permettent d'accéder à chaque image.
* une video (simple ou augmentée d'une ou d'une autre façon)
* une animation (soit dans la timeline principale, soit dans un clip). Vous pouvez reprendre l'animation de l'exercice 2.
* un son qq. part dans le dispositif
 
Le sujet de l'animation doit être en rapport avec une thématique "MALTT"
 
(2) Documentez '''brièvement''' votre code dans ''File-> File Info'' (CS5) ou ) en y insérant les informations suivantes:
* Auteur
* Date
* Objectifs (soyez très courts)
* Crédits (si nécessaire, par exemple pour images et clip art réutilisé)
 
Si vous avez une ancienne version de Flash, essayez ''Modify->Document'', puis insérez:
<pre>
<nowiki>
=== Auteur et date ===
 
=== Objectifs ===
=== Crédits ===
</nowiki>
</pre>
 
=== Ressources externes ===
 
* Vous pouvez utiliser du "artwork" externe (mais pas plus que 66 %)
* Vous devez citer les sources !
 
=== A rendre ===
 
Le dispositif (code source et swf) est à mettre en ligne avec un petit rapport qui se trouvera ici:
/etu-maltt/______/____/stic-1/ex3
/etu-maltt/______/____/stic-1/ex3
 
Cette page de rapport doit inclure:
* Auteur et date
* Objectifs, ce que le dispositif est censé faire.
* Pas de longue explication de la production, mais un petit (!) résumé des étapes.
* Difficultés
* Auto-évaluation
* Références
* Un lien vers le dispositif Flash
* Un lien vers vos contributions wiki ou alternativement un résumé en une phrase ''plus'' un lien vers votre home page wiki. Il faut que l'on sache ce qu'il faut compter pour chaque exercice sans jouer aux détectives.
 
N'oubliez pas la contribution wiki obligatoire pour tous les exercices (sauf le 1) !
 
== Evaluation ==
 
Voici en gros les critères d'évaluation pour les exercices.
 
(1) Dispositif
# But - est-ce l'animation correspond à vos objectis: -/0/+
# Thématique MALTT -/0/+
# Artwork - qualité esthétique --/0/+/++
# Complexité:  -/0/+/++
# Respect des contraintes: --/-/0/+
# Documentation - Qualité de la documentation: --/0/+
# Documentation dans Flash - layer et symbol names par exemple: -/0
# Erreurs - Présence/absence d'erreurs: --/-/0
# Cohérence globale: +
 
(2) Contribution Wiki
# Utilité/quantité et qualité
 
(3) Rapport
# Présence des éléments requis
# Réflextions et contributions conceptuelles
 
== Aide ==
 
Utilisez la page discussion de '''cette page''' pour poser des questions.
 
Pour insérer un nouveau titre, utilisez simplement le "+".
 
'''Important''': Si vous cliquez sur l'étoile ("Ajouter cette page à votre liste de suivi"), le wiki vous enverra un mail après chaque modification de la page.

Version du 10 novembre 2010 à 14:20

Cet article est en construction: un auteur est en train de le modifier.

En principe, le ou les auteurs en question devraient bientôt présenter une meilleure version.


Cette page fait partie des cours STIC I et STIC II

Objectifs

  1. Comprendre l'architecture des boutons (et savoir en créer)
  2. S'initier à la logique du event-driven programming (event handlers +ActionScript simple)
  3. Utilisation du composant vidéo pour publier une vidéo
  4. Utilisation du composant bouton pour naviguer dans la timeline
  5. Savoir créer un "site Flash" (plusieurs images reliés par des boutons)

Programme

Rappel clips

En principe, toute animation sera faite à l'intérieur d'un seul clip et pas sur la timeline (chronologie) principale. Dans un frame (image) vous n'insérez que des boutons de navigation, ensuite vous placerez un seul clip qui lui contient toute la scène pour ce frame.

A la limite vous pouvez composer un frame à partir de plusieurs symboles et faire le scripting dans la calque "action". Globalement, je déconseille cette stratégie.

Le composant vidéo (I)

  • Encodage flv et rognage
  • Utilisation de vidéos flv avec la composante FLVPlayBack
  • Videos dans la timeline (pas trop conseillés)

Son

Boutons et premier contact avec ActionScript

Les composants

(petite sensibilisation)

Le composant bouton et ActionScript

Les fragments de code

Exercice à rendre

A rendre: Dimanche soir avant période 2 (un retard entraîne un pénalité de 1 point)

Tâche

Deadline: Dimanche minuit avant la 2ème semaine présentielle.

Faites une application Flash de type "site" avec un menu. Elle doit comprendre au moins:

  • Plusieurs "pages" navigables (au moins 4)
  • Un menu (au moins sur le premier frame/image) et des boutons de navigation qui permettent d'accéder à chaque image.
  • une video (simple ou augmentée d'une ou d'une autre façon)
  • une animation (soit dans la timeline principale, soit dans un clip). Vous pouvez reprendre l'animation de l'exercice 2.
  • un son qq. part dans le dispositif

Le sujet de l'animation doit être en rapport avec une thématique "MALTT"

(2) Documentez brièvement votre code dans File-> File Info (CS5) ou ) en y insérant les informations suivantes:

  • Auteur
  • Date
  • Objectifs (soyez très courts)
  • Crédits (si nécessaire, par exemple pour images et clip art réutilisé)

Si vous avez une ancienne version de Flash, essayez Modify->Document, puis insérez:


=== Auteur et date ===

=== Objectifs ===
 
=== Crédits ===

Ressources externes

  • Vous pouvez utiliser du "artwork" externe (mais pas plus que 66 %)
  • Vous devez citer les sources !

A rendre

Le dispositif (code source et swf) est à mettre en ligne avec un petit rapport qui se trouvera ici:

/etu-maltt/______/____/stic-1/ex3
/etu-maltt/______/____/stic-1/ex3 

Cette page de rapport doit inclure:

  • Auteur et date
  • Objectifs, ce que le dispositif est censé faire.
  • Pas de longue explication de la production, mais un petit (!) résumé des étapes.
  • Difficultés
  • Auto-évaluation
  • Références
  • Un lien vers le dispositif Flash
  • Un lien vers vos contributions wiki ou alternativement un résumé en une phrase plus un lien vers votre home page wiki. Il faut que l'on sache ce qu'il faut compter pour chaque exercice sans jouer aux détectives.

N'oubliez pas la contribution wiki obligatoire pour tous les exercices (sauf le 1) !

Evaluation

Voici en gros les critères d'évaluation pour les exercices.

(1) Dispositif

  1. But - est-ce l'animation correspond à vos objectis: -/0/+
  2. Thématique MALTT -/0/+
  3. Artwork - qualité esthétique --/0/+/++
  4. Complexité: -/0/+/++
  5. Respect des contraintes: --/-/0/+
  6. Documentation - Qualité de la documentation: --/0/+
  7. Documentation dans Flash - layer et symbol names par exemple: -/0
  8. Erreurs - Présence/absence d'erreurs: --/-/0
  9. Cohérence globale: +

(2) Contribution Wiki

  1. Utilité/quantité et qualité

(3) Rapport

  1. Présence des éléments requis
  2. Réflextions et contributions conceptuelles

Aide

Utilisez la page discussion de cette page pour poser des questions.

Pour insérer un nouveau titre, utilisez simplement le "+".

Important: Si vous cliquez sur l'étoile ("Ajouter cette page à votre liste de suivi"), le wiki vous enverra un mail après chaque modification de la page.