« STIC:STIC I (Nestor-Pixel) » : différence entre les versions
| Ligne 89 : | Ligne 89 : | ||
* [[STIC:STIC I - exercice 7 | Exercice 7]] (Formulaires HTML/PHP) | * [[STIC:STIC I - exercice 7 | Exercice 7]] (Formulaires HTML/PHP) | ||
* [[STIC:STIC I - exercice 8 | Exercice 8]] (Génération SVG avec PHP | * [[STIC:STIC I - exercice 8 | Exercice 8]] (Génération SVG avec PHP) | ||
* [[STIC:STIC I - exercice 9 | Exercice 9]] (Installation et configuration d'une application PHP) | * [[STIC:STIC I - exercice 9 | Exercice 9]] (Installation et configuration d'une application PHP) | ||
Version du 5 décembre 2008 à 16:49
Sciences et Technologies de l'information et de la communication
Plan de cours, promotion "Oda 2007-2008", Master of Science in Learning and Teaching Technologies (MALTT)
Daniel K. Schneider avec Stéphane Morand
Le domaine STIC (Sciences et Technologies de l'information et de la communication) comprend deux cours obligatoires: STIC-1 et STIC-II plus 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).
En d'autres termes, il s'agit surtout d'une introduction aux "web applications", et particulièrement dans le domaine de l'éducation. Cet enseignement est donc très technique: les participants vont apprendre les outils informatiques de base (y compris une petite initation à la programmation). Mais ce cours comporte également des aspects théoriques et conceptuels qui seront surtout abordés au travers d'une lecture individuelle.
Stic I: Formats Internet et sensibilisation applications Web
- HTML avancé (pages interactives, CSS, etc.);
- XML de base (DTD, XSLT de base, XPATH);
- langages du XML Framework (XSLT, XSL/FO, RDF, SVG, etc.)
- graphismes vectoriels interactifs et animés avec SVG / X3D
- Formats pédagogiques
- Introduction au “scripting server-side”, langage: PHP;
Stic II: Applications Web et suite de formats internet
- concepts de base de la programmation, langages: PHP et Javascript;
- introduction aux bases de données SQL sur Internet, système MySQL;
- suite au “scripting server-side”, langage: PHP;
- introduction à la programmation “GUI” (user interfaces), langage: Javascript;
- Le DOM
Voir STIC-II
Plan période 1
Regardez chaque page exercise pour plus de détails.
XML, HTML etc
- Introduction à Internet et au WWW.
- Exemples de dispositifs Internet (XHTML, XML, Javascript, PHP, VRML, etc.) développés par les étudiants dans le cadre des cours STAF-14
- Design de simples sites et panorama de “home pages” à Tecfa
- CSS pour (X)HTML
- Introduction technique à XML
- Sensibilisation à XSLT (XML -> HTML)
- Note: CSS pour XML n'est pas abordé, CSS avec XML marche presque de la même manière que pour HTML
Activités et exercices
Activités sans exercices:
- Internet et Web (petite introduction sans exercice)
- http://tecfa.unige.ch/guides/tie/html/internet/internet.html (transparents)
- http://tecfa.unige.ch/guides/tie/html/www-tech/www-tech.html (transparents)
- XML (intro conceptuelle sans exercice)
Liste d'exercices (les ressources y associées sont dans ces pages).
- Exercice 1 (HTML + CSS)
- Exercice 2 (XML + DTD + XSLT)
- Exercice 3 (Page travaux, utiliser XML + modifier XSLT)
Plan période 2
Introduction à XML (suite)
On abordera ce thème d'abord par une petite discussion des exercices 2 et 3.
- DTD (suite)
- Autres grammaires: XML Schema et Relax NG
- XSLT (suite)
Applications XML
- Formats pédagogiques: IMS CP, SCORM 1.2, IMS LD, SCORM 2004.
- Introduction à SVG
- Autres formats vectoriels: Flash, SMIL, X3D
Activités et exercices
- Exercice 4 (IMS CP/SCORM 1.2)
- Exercice 5 (SVG)
- Exercice 6 (exercice 2 - version 2)
Plan période 3
Introduction server-side scripting
- Les formulaires HTML
- Introduction à PHP
Activités et exercices
Le dernier délai pour la remise des notes est le mercredi 6 février 2008. Il me faudrait avoir les travaux au moins une semaine en avant (mercredi 31 janvier minuit).
- Exercice 7 (Formulaires HTML/PHP)
- Exercice 8 (Génération SVG avec PHP)
- Exercice 9 (Installation et configuration d'une application PHP)
Formats des travaux, evaluation et assistance
Les travaux vous amèneront à acquérir les bases techniques et conceptuelles pour la réalisation de dispositifs en ligne. L'évaluation des étudiants se fera essentiellement par ce biais.
En règle générale, un exercice consiste à faire un dispositif informatique. Il doit être opérationnel pour un certain public cible (que vous définissez). Il doit fonctionner sur un plan technique et sur un plan ergonomique et il doit répondre à un petit cahier des charges en rapport avec une thématique «MALTT». Pour obtenir une note maximale il est indispensable de fournir également un très bon travail conceptuel (en rapport avec les thèmes MALTT plus théoriques par exemple). Chaque exercice est accompagé d'une page d'introduction et qui comprend un petit rapport.
Espace travaux
je vous demande de placer vos travaux dans des répertoires précis. Une page d'accueil et qui comprend un rapport doit les accompagner
Voici le schéma à utiliser pour la page d'accueil / rapport /etu-maltt/oda/login/stic/exXX/ Par exemple: /etu-maltt/oda/dupont/stic/ex1/welcome.html ou /etu-maltt/oda/duran/stic/ex4/welcome.php Il est donc obligatoire d'utiliser un fichier que le serveur Web reconnaît comme “index”
- Machine: tecfa.unige.ch
- Répertoire web: /web
Important: Chaque page déposée sur notre serveur doit être datée et signée avec votre page travail ou encore votre home page !
Consultez aussi les instructions en ce qui concerne votre “espace travaux” sur le WWW. http://tecfa.unige.ch/tecfa/teaching/staf10/survival.html
Assistance
Pour chaque exercice, utilisez la page discussion associée à chaque page
Procédure:
- Cliquez sur le "tab" discussion en haut de la page
- Pour ajouter un nouveau sujet, cliquez sur le "+"
- Pour répondre à un sujet, éditez la section en question.
Evaluation
Règles pour la promotion “Oda”:
- Vous seriez principales évalués sur travaux. Vous devez rendre tous les exercices. Il faut les rendre dans les délais indiqués et tout retard non justifié sera pénalisé (demandez un délai si vous avez des arguments).
- Pour chaque exercice vous pouvez gagner 0.25 - 0.5 points pour une participation active dans le wiki (en dehors des pages cours). Vous pouvez créer ou améliorer des pages qui concernent de près ou de loin le sujet de chaque exercice. Indiquez dans votre home page de ce wiki vos additions dans les deux wikis (en et fr).
- Finalement vous pouvez gagner un bonus pour une participation active dans les forms (assistance à vos collègues). Ce bonus sera attribué à la fin de chaque cours.
- Barèmes
- Une note de 5.5 correspond à un travail "parfait" (sur un plan technique et conceptuel) mais sans originalité particulière. Pour avoir un 6 il faut ajouter une haute dose d'originalité plus un rapport qui correspond aux normes académiques.
- Une note de 5 correspond à un travail qui satisfait globalement aux attentes et a donc atteint les objectifs fixés (1 crédit = 30h de travail apprenant).
- Une note de 4 correspond à un travail minimaliste (copier/coller, peu de contenu, code cassé, etc.).
- Une note de 3 (ou moins) correspond à un travail insuffisant
Tout travail inachevé ou en retard peut être rendu hors délais mais sa note n'excédera pas 5 (1 point de pénalité) afin de ne pas pénaliser les étudiant(e)s ayant fait l'effort de respecter l'échéancier. Notez aussi que chaque page déposée sur notre serveur doit être datée et signée et elle doit se trouver à l'endroit indiqué (1/2 point de pénalité) !
Faites attention à bien lire l'énoncé et n'oubliez pas le rapport ! C'est le produit (dispositif + page d'accueil/rapport) qui sera évalué (ni vos efforts ni vos connaissances en informatique). Placer des fichiers à des mauvais endroits entrâinera une pénalité !
On vous demande également de fournir un effort conceptuel qui dépasse l'exercice technique. Vous avez même la possibilité de «revendre» un dispositif fait pour STIC dans un des autres cours et inversément. Il faut simplement respecter les contraintes enoncés des 2 côtés.
- Sources
Pour vos exercices, vous avez le droit de reprendre des idées et des bouts de code, mais vous devez indiquer la source (nom de l'auteur + URL) à la fois dans votre code et dans votre rapport et indiquer ce que vous avez modifié. L'originalité sera primée et tout plagiat non-anoncé sera puni !
Je me réserve le droit de vous interroger sur la provenance du code utilisé. Vous avez même le droit d'utiliser des fragments de code que vous ne comprenez pas, par exemple des classes PHP, mais à condition de l'indiquer clairement !
Pondérations pour le calcul de la note finale Note finale = moyenne + bonus participation en ligne
Il n'y a pas d'examen. Toutfois il existe la possibilité de discuter à la fin des cours du bilan de votre travail. Il s'agira aussi de la dernière occasion pour mettre en cause une note injustifiée (par rapport aux autres).
Feedback / Corrections
Le feedback sera disponible dans Moodle (cours STIC I/STICII). Le module est uniquement ouvert aux participants et ne contient que les évaluations (feedback et notes).
Voir http://tecfa.unige.ch/tecfa/maltt/stic/c-n/ pour la promotion Nestor
Conseils du jour
- Tenez-vous au courant. Regardez la page "discussion" pour chaque exercice avant de vous lancer ... et participez ! C.f. aussi STIC:STIC I - Nouvelles (RSS feeds, lents à charger).
- Lisez soigneusement les instructions sur cette page et celles pour chaque exercice. Notamment, soyez sûrs:
- de comprendre la tâche
- de poser les fichier au bon endroit (commencez tôt!)
- de faire l'inventaire des outils que vous pouvez utiliser
- d'explorer les ressources mises à disposition
- Planning
- Faites tjrs un petit exercice avant de vous lancer dans vos mini-projets (par ex. finir ce qu'on a commencé en salle de classe)
- Ensuite étudiez plusieurs exemples !
- Ensuite faites un schéma qui résume vos objectifs et qui comprend une idée de votre design (différent selon la tâche)
- Evitez de faire trop de "tourisme google" ! La plupart de l'information nécessaire se trouve dans les transparents et les exemples.
- Soyez organisés. Pas de b****l sur vos disques durs ni sur nos serveurs. Faites un planning pour tous les cours (par ex. avec un petit gestionnaire de tâches) !
- Apprenez les outils (Wiki, Editeurs etc.) et minimisez la complexité de vos projets si vous avez l'impression d'être débordé(e).
Ressources
- Ancienne (!) toolbox
- http://tecfa.unige.ch/guides/toolbox.html
- Edutechwiki français (peu d'entrées, donc ce wiki)
- Fichier de commande
- Catégorie Technologies
- Edutechwiki anglais, par exemple
- La catégorie technologies
- Web application et Portalware (un des objectifs du cours et de vous montrer les éléments constituants d'une application Internet: Formats, scripting et base de données)
- List d'éditeurs XML (en anglais)
- STIC Zéro (Initiation MALTT)
- Kit de survie
- Moodle
Liste de logiciels
Vous pouvez installer ces logiciels au fur et à mesure quand vous en avez besoin. Au début du cours il faut un éditeur XML et un éditeur de programmation.
- Système et réseau
- Java 6 SDK (attention, il faut "SDK" pas juste le "JRE")
- winscp ou un autre FTP sécurisé
- un progromme de zip/unzip
- Navigateurs
- Plugins navigateurs
- Editeurs HTML (pour écrire des rapports)
- Editeur XML
- Editeurs de programmation
- Notepad++
- PSPad (alternative à Notepad)
- Emacs et Xemacs (à option)
- Emacs download
- Emacs (Edutechwiki en)
- Editeurs learning objects
- eXe eLearning XHTML editor
- eXe (Edutechwiki)
- Reload
- Reload Editor (edutech wiki)
- TENCompetence Learning Design Editor (ReCourse)
- Manipulation d'images
- Gimp
- Gimp for windows (download for Win)
- Graphisme vectoriel
- Inkscape (programme de dessin utilisant SVG come format)
- Vivaty Studio (programme de dessin X3D)
- Server web
- WampServer Serveur Apache/PHP/MySQL
- MoWes Portable (ancien WOS). Pour ceux qui veulent faire tourner le serveur sur une clef USB uniquement]
- WAMP (edutechwiki en)