STIC:STIC III: Difference between revisions

The educational technology and digital learning wiki
Jump to navigation Jump to search
m (Replaced content with '== STIC III - Nestor == '''Attention''': La page cours de STIC III est maintenant dans EduTechWiki français. (mais vous pouvez consulter l'historique…')
 
(11 intermediate revisions by 3 users not shown)
Line 1: Line 1:
== STIC III - Nestor ==
== STIC III - Nestor ==


Le domaine STIC (Sciences et Technologies de l'information et de la communication) comprend deux cours obligatoires ([[:fr:STIC:STIC I|STIC-1]] et STIC-2) documentés ici et une UF libre: '''STIC III'''. Les deux cours obligatoires traitent des bases techniques des systèmes d'information et de communication médiatisés par ordinateur. Elles permettent d'abord de concevoir des documents pour réaliser un système d'information partagé (XHTML, XML, XSLT, SVG), de s'initier aux applications interactives sur Internet (PhP, JavaScript) et de se familiariser avec les logiciels et les environnements qui supportent une interaction personne-personne à travers un réseau de communication (portails, groupewares et mondes virtuels).
'''Attention''': La page cours de [[:fr:STIC:STIC III|STIC III]] est maintenant dans EduTechWiki français.


STIC III peut changer de thème chaque année. En 2008/2009 il porte sur [[Flash]] et la programmation [[ECMAScript]] 4 ([[Actionscript 3]]). Ce cours est aussi ouvert aux étudiant(e)s de la première année MALTT.
(mais vous pouvez consulter l'historique de cette page ....)
 
; Prérequis
: Connaissances passive de l'Anglais (le matériel d'enseignement est en Anglais).
: Sinon, aucun
 
; Lieu et Dates
: Semestre d'automne 2007
: TECFA, tous les '''Mardis matin 9h-12:30h''' de la semaine présentielle.
 
; Crédits
: 6
 
; Evaluation
: Sur travaux (mini-projets)
 
; Logiciels
: [http://www.adobe.com/products/flash/ Adobe Flash CS3 Professional], soit vous travaillez sur une machine de TECFA, soit il faut l'acheter.
: [http://www.adobe.com/products/flex/ Adobe Flex] (on a une version gratuite) et/ou [http://www.adobe.com/products/flex/flexdownloads/index.html Flex SDK] plus un [[text editor]] avec support ActionScript.
 
== Plan période 1 ==
 
; Objectifs
: Maîtriser le dessin avec Flash CS3 (modes de dessin, transformations, couleurs)
: Faire des animations avec CS3
: Comprendre l'architecture des boutons (et savoir en créer)
: Comprendre la logique du event-driven programming (event handlers +ActionScript simple)
 
=== Le desktop ===
* Handout: [[Flash CS3 desktop tutorial]]
* Handout: [[Flash CS3 keyboard shortcuts]]
 
=== Le dessin ===
* Handout: [[Flash drawing tutorial]]
** Modes de dessin (object vs. merge)
** Palette des outils de dessin
** Couleurs et textures
* Handout: [[Flash layers tutorial]]
** Savoir s'organiser: layers, layer folders, la librairie, les scènes
* Handout: [[Flash object transform tutorial]]
** Select tool
** Free Transform Tool (y compris ses différents modes)
* Handout: [[Flash arranging objects tutorial]]
** Différence entre shapes, simple graphics, composite graphics, symbols, etc.
** Transformations vers différents types de "display elements"
** Alignement et snapping
* Handout: [[Flash colors tutorial]]
** Types de couleurs
** Color Gradient Transform Tool
* Resource: [[Clipart]] and [[texture]]
** Importation de graphismes vectoriels
 
=== Animation ===
 
; Frame-by-frame animation
* Previews: [http://tecfa.unige.ch/guides/flash/ex/frame-by-frame-intro/flash-cs3-shaking-hello.swf Shakin hello],
* Handout: [[Flash frame-by-frame animation tutorial]]
 
; Motion animation
* Previews: [http://tecfa.unige.ch/guides/flash/ex/motion-tweening-intro/flash-cs3-motion-tweening.swf Moving cat], [http://tecfa.unige.ch/guides/flash/ex/motion-tweening-intro/flash-cs3-motion-shape-tweening.swf Moving, changing cat], [http://tecfa.unige.ch/guides/flash/ex/motion-tweening-intro/flash-cs3-motion-guide-tweening2.swf Flying Rocket]
* Handout: [[Flash motion tweening tutorial]]
* Summary: [[Flash animation summary]]
 
; Shape tweening
* Previews: [http://tecfa.unige.ch/guides/flash/ex/shape-tweening-intro/flash-cs3-shape-tweening-intro.swf Simple shape morph], [http://tecfa.unige.ch/guides/flash/ex/shape-tweening-intro/flash-cs3-shape-tweening-tear.swf Simple shape and motion morph], [http://tecfa.unige.ch/guides/flash/ex/shape-tweening-intro/flash-cs3-shape-picture-morphing.swf traced bitmaps morph], [http://tecfa.unige.ch/guides/flash/ex/shape-tweening-intro/flash-cs3-shape-tweening-in-motion.html Shape tweening in motion]
* Handout: [[Flash shape tweening tutorial]]
 
; Résumé
* Summary: [[Flash animation summary]]
 
=== Son ===
 
* [[Flash sound tutorial]]
 
=== Les boutons ===
 
* 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 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
 
=== Exercices période 1 ===
 
* [[STIC:STIC_III/ex1|STIC III - Exercice 1]]
* [[STIC:STIC_III/ex2|STIC III - Exercice 2]]
* [[STIC:STIC_III/ex3|STIC III - Exercice 3]]
 
Voici en gros les critères d'évaluation pour les exercices.
 
# But - est-ce l'animation correspond à vos objectis: -/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 (notamment je veux voir '''aucun''' tween objet dans votre library !!: --/-/0
# Cohérence globale: +
 
== Plan période 2 ==
 
; Objectifs
: Savoir travailler avec qqs. composantes (butons et vidéo)
: Animations embarqués (movie clips)
: ActionScript dans CS3 (suite)
: Introduction à ActionScript/Flex
 
=== Le desktop (suite) ===
 
* Handout: [[Flash - being organized]]
 
=== Les composants ===
 
* Preview: [http://tecfa.unige.ch/guides/flash/ex/components-intro/flash-cs3-simple-slide-show-menu.html flash-cs3-simple-slide-show-menu.html]
* Handout: [[Flash components tutorial]] (surtout le chapitre d'intro)
** Utilisation des boutons
** Faire un "site web" avec Flash
 
=== La composante video ===
* Encodage flv et rognage
* Captions
* Utilisation de vidéos flv avec la composante FLVPlayBack
* Videos dans la timeline (pas trop conseillés)
* Insertion et utilisation de cue points
 
* Previews:
** [http://tecfa.unige.ch/guides/flash/ex/component-video-intro/flash-cs3-video-simple-server.html flash-cs3-video-simple-server.html]
** [http://tecfa.unige.ch/guides/flash/ex/component-video-intro/flash-cs3-video-simple-server-caption.html flash-cs3-video-simple-server-caption.html] (captions avec cue points)
** [http://tecfa.unige.ch/guides/flash/ex/component-video-intro/flash-cs3-video-goto-cues.html flash-cs3-video-goto-cues.html]
** [http://tecfa.unige.ch/guides/flash/ex/component-video-intro/flash-cs3-video-cue-events.html flash-cs3-video-cue-events.html]
* Handout: [[Flash video component tutorial]]
 
=== Interactivité  ===
 
* Jeux drag & drop
* Objets drag & drop
* Un peu de AS en plus
* Gérer les animations imbriquées (video clips)
 
; Objets interactifs et movie clips imbriqués
* Previews: :[http://tecfa.unige.ch/guides/flash/ex/action-script-3-intro/actionscript3-simple-object-manipulation.html actionscript3-simple-object-manipulation.html]
:[http://tecfa.unige.ch/guides/flash/ex/exams2007/final-exam-coap2110-solution-2007.html final-exam-coap2110-solution-2007.html]
* Handout: [[ActionScript 3 interactive objects tutorial]]
 
; Drag and drop
* Preview: [http://tecfa.unige.ch/guides/flash/ex/drag-and-drop-intro/flash-cs3-drag-and-drop-matching-3.html flash-cs3-drag-and-drop-matching-3.html]
* Handout: [[Flash drag and drop tutorial]]
 
; Résumé event handling
* Handout: [[ActionScript 3 event handling tutorial]] (complément)
* Handout: [[Flash games tutorial]] (complément, voir l'exemple)
 
=== Utilisation de libraries ActionScript ===
 
* [[AS3 TweenLite tweening engine]]
 
=== Exercices période 2 ===
 
* [[STIC:STIC_III/ex4|STIC III - Exercice 4]]
* [[STIC:STIC_III/ex5|STIC III - Exercice 5]]
* [[STIC:STIC_III/ex6|STIC III - Exercice 6]]
 
== Plan période 3 ==
 
=== Objectifs ===
 
* Apprendre un peu plus d'ActionScript
* Apprendre à naviguer dans le manuel de Adobe
* Utiliser une classe "pro"
 
=== Pages à lire ===
 
* [[Actionscript 3]]
* [[Flash ActionScript 3 overview]]
* [[AS3 Tutorials Novice]]
* [[AS3 Compiling a program]]
* [[AS3 example Drawing graphics]]
* [[AS3 example Message Box]]
* [[AS3 example Button]]
* [[AS3 example Positioning]]
* [[AS3 example Drag and Drop]]
* [[AS3 example Keyboard control]]
* [[AS3 Variable Types]]
* [[AS3 Control Flow]]
 
; Manuel
* Voir [[AS3 Links Documentation]]
Surtout:
* [http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/ ActionScript 3.0 Language and Components Reference] @ Adobe livedocs
* [http://www.adobe.com/go/programmingAS3 Programming ActionScript 3.0] @ Flex LiveDocs. Describes specific usage of the ActionScript 3.0 language and core Flash Player API
 
;Previews
* Quelques exemples ont été compilés ici: http://tecfa.unige.ch/guides/flash (répertoires as3...)
 
=== Exercices période 3 ===
 
''' (version 2007/8 - à refaire !!!) '''
 
* Un projet (compte pour 2 exercices)
* Ce projet doit contenir un minimum d'action script
* Un clip qui correspond à un objectif que vous définissez
* Qualité "professionnelle", c'est à dire appropriée par rapport à l'objectif.
* De préférence interactif ...
 
* Accompagné d'un petit rapport qui explicite les objectifs et qui contient une auto-évaluation à mettre à l'endroit habituel plus un lien depuis votre home page wiki.
* '''DEADLINE''': 1 février 2008
 
== Participants ==
 
Insérez votre home page wiki avec <nowiki>~~~</nowiki> et remplissez la home page !. Indiquez si vous êtes juste auditeur et faites des liens depuis votre wiki home page sur les exercices que vous avez fini.
 
=== Cours 2008/2009 ===
 
*
 
=== Cours 2007/2008 ===
 
* [[User:CyrilRebetez | Cyril Rebetez]] (auditeur)
* [[User:Morand3 | Louiselle Morand]] (volée Nestor)
* [[User:Vogon | Rolf Wipfli]] (volée Maya)
* [[User:Davidc|David Coll]]  (Nestor)
* [[User:Baptiste| Baptiste Ossipow]] (volée Maya)
* [[User:Dethurens | Yves Dethurens]] (volée Nestor)
 
== Liens ==
 
* [[Flash]] (c.f. cette pour des liens)
* [[Flash CS3 keyboard shortcuts]]
* [[Flash formats and objects overview]]
* [[Flash ActionScript 3 overview]]
 
Si vous voulez acheter un livre, on conseille:
 
* Veer, E.A. Vander and Chris Grover (2007). Flash CS3: The Missing Manual. ISBN 0596510446 - 527 pages. - [http://www.oreilly.com/catalog/9780596510442/ O'Reilly page] - [http://www.missingmanuals.com/cds/flashcs3tmm/ Missing CD-ROM] page.
* Moock, Colin, Essential ActionScript 3.0. ISBN 0-596-52694-6. (Pour gens qui aimeraient apprendre à programmer)
 
Faites attentions: On travaillera avec Flash 9 (CS3). Flash MX ou 8 n'est pas très différent en ce qui concerne le dessin et l'animation, mais ActionScript a complètement changé.


[[Category: Courses and workshops]]
[[Category: Courses and workshops]]
[[Category: Flash]]
[[Category: Flash]]

Latest revision as of 17:20, 19 February 2010

STIC III - Nestor

Attention: La page cours de STIC III est maintenant dans EduTechWiki français.

(mais vous pouvez consulter l'historique de cette page ....)

Retrieved from "https://edutechwiki.unige.ch/mediawiki/index.php?title=STIC:STIC_III&oldid=25438"