STIC:STIC I (Concordia)

Cette page fait partie des archives des cours Cours STIC (STIC I, STIC II,STIC III,STIC IV)

STIC

Archives STIC

Chantier STIC

Initiation à la pensée computationnelle avec JavaScript

Productions STIC

Ressources STIC

STIC:Contribution Wiki

STIC:Rapport STIC I et II

STIC:STIC I (Edda)

STIC:STIC I - Atelier technique 2

STIC:STIC I - exercice 1 (Drakkar)

STIC:STIC I - exercice 1 (Edda)

STIC:STIC I - exercice 2 (Edda)

STIC:STIC I - exercice 3 (Edda)

STIC:STIC I - exercice 4 (Edda)

STIC:STIC I - exercice 5 (Edda)

STIC:STIC I - exercice 6 (Edda)

STIC:STIC III

STIC:STIC III (2022)

STIC:STIC III (2022)/Exploration des Problématiques Liées aux Ponts et Détails

STIC:STIC IV

Sciences et Technologies de l'information et de la communication

Plan de cours pour la promotion Concordia 2022-2023, Master of Science in Learning and Teaching Technologies (MALTT).

Ce cours fait partie du domaine STIC (Sciences et Technologies de l'Information et de la Communication). Il comprend deux cours obligatoires: STIC I et STIC II, donnés chaque année. Deux Unités de Formation (UF) libres (STIC-III / STIC-IV), données en alternance une année sur deux, sont également reliées au domaine.

Équipe enseignante

Responsable du cours :

• Mattia A. Fritz, chargé de cours suppléant

Assistance technique et interventions :

• Stéphane Morand, ingénieur système TECFA

Le cours s'inspire de la philosophie et scénarisation d'origine élaborées par Daniel K. Schneider.

Objectifs

L'objectif principal du cours est une introduction aux technologies de l'information et de la communication d'un point de vue technique. Globalement, cet objectif se décline de trois manières :

1. Par une sensibilisation à la programmation et à la pensée computationnelle
2. À travers la conception, le développement et le déploiement d'applications web interactives en lien avec la technologie éducative
3. Avec la lecture et l'écriture collaborative de ressources techniques dans ce Wiki

Pour une plus ample description du cours voir :

• Fritz, M. A., & Schneider, D. K. (2019). Pensée computationnelle avec JavaScript: Le cours STIC I. Atelier@EIAH’19. Apprentissage de la pensée informatique de la maternelle à l’Université : retours d’expériences et passage à l’échelle. EIAH’19, Paris, France.

Compétences envisagées

Différentes compétences seront mobilisées pour atteindre l'objectif principal du cours :

• Comprendre le fonctionnement client-serveur du web et maîtriser la publication de fichiers sur un serveur distant (nom, extension et parcours)
• Apprendre les bases des langages de marquage/structuration de documents web (HTML5, XML, SVG et syntaxe Wiki)
• Apprendre les bases d'un langage pour définir les propriétés graphiques des contenus web (CSS)
• Acquérir des notions de base de la programmation et de la pensée computationnelle à travers le langage JavaScript
• Comprendre les fondements de l'interaction personne-machine à travers des simples applications web interactives qui sous-tendent des objectifs d'apprentissage pour un public cible
• Télécharger, installer et configurer des logiciels open-source
• Lire de la documentation technique, suivre des tutoriels de codage/programmation
• Chercher et trouver de l'aide et/ou des ressources utiles à la compréhension et/ou résolution de problèmes techniques
• Participer à un environnement de co-construction et partage de connaissances (ce wiki)

Intégration avec les autres cours/domaines

L'image suivante représente graphiquement, de manière indicative, l'intégration de STIC I avec les autres cours/domaines du MALTT. Il s'agit d'une intégration conceptuelle, mais vous êtes encouragé-es à exploiter des connaissances acquises dans les autres cours pour vos rendus !

Intégration indicative de STIC I avec les autres cours/domaines du Master

Le cours est surtout complémentaire au domaine ERGO, avec une approche à l'interaction personne-machine de type micro, tandis que ERGO a une approche plus holistique. Le cours s'intéresse en effet au design d'interface utilisateur ainsi qu'aux interactions qui peuvent sous-tendre, favoriser ou expliquer des processus d'apprentissage.

STIC I donne également quelques bases techniques qui peuvent être utiles dans le développement du domaine VIP.

Programme

Le cours STIC I a lieu les vendredis des semaines MALTT de la première année. Il est complété par des séances Atelier Webmaster obligatoires, les lundis matin des périodes 2, 3, 4, 5 et 6, dans lequel des outils et technologies du web corollaires ou alternatives seront illustrées.

Période 1

• Introduction au cours : modalités de participation et grille d'évaluation
• Exercice 1 Webdesign (HTML5/XML, CSS) et identité digitale (page utilisateur Wiki, profiles sur les réseaux sociaux, ...)
• Exercice 2 Introduction à la pensée computationnelle et à la programmation

Période 2

• Atelier technique 1
• Exercice 3 Programmation DOM avec JavaScript
• Exercice 4 Production d'une vidéo annotée et interactivé avec HTML5. Standards vidéo pour Internet, Production de vidéographies, Vidéo dans HTML5, Ajout de sous-titres

Période 3

• STIC:STIC I - Atelier technique 2
• Exercice 5 Drag and drop avec jQuery et jQuery UI
• Exercice 6 Bibliothèques JavaScript

Format et règlement du cours

Ci-dessous sont définis: le format général des travaux, l'évaluation, les règles concernant le plagiat et l'assistance.

Les travaux vous amèneront à acquérir les bases techniques et conceptuelles pour la réalisation de dispositifs en ligne. L'évaluation des étudiant-es se fera essentiellement par ce biais.

En règle générale, un exercice comprend trois composants:

1. Un ou plusieurs dispositifs informatiques. Un dispositif doit répondre à certains objectifs et viser un public cible que vous définissez. Il doit fonctionner sur les plans techniques et ergonomiques. Il doit répondre à un petit cahier des charges en rapport avec une thématique « MALTT ».
2. Un rapport pour chaque exercice qui décrit le dispositif pour d'autres personnes intéressées à l'utiliser / l'adapter à leurs besoins. Voir le lien suivant pour plus de détails :
   • Rapport STIC I et II
3. Une participation à ce wiki pour chaque période du semestre. Voir le lien suivant pour plus de détails :
   • Contribution Wiki obligatoire pour STIC

Que faire si vous maîtrisez déjà un sujet ou toute la matière ?

Ceux/celles qui ont des bonnes compétences techniques et qui maîtrisent déjà le sujet d'un exercice peuvent faire un exercice de substitution qui consiste à rédiger un tutoriel dans EduTechWiki français ou anglais. Cependant, nous déconseillons cette approche, car les étudiant-es sous-estiment souvent la quantité de travail nécessaire pour un bon tutoriel. Nous conseillons plutôt d'effectuer l'exercice et se concentrer sur les aspects ergonomiques ou pédagogiques.

Espace travaux

En règle générale, je vous demande de placer vos travaux dans des répertoires précis. Dans tous les cas, un travail doit toujours être accompagné d'un rapport qui sert également de "page d'accueil" pour l'évaluation de votre rendu.

Voici le schéma à utiliser pour la page d'accueil / rapport /etu-maltt/concordia/login/stic-1/exXX/ Par exemple: /etu-maltt/concordia/dupont/stic-1/ex1/welcome.html ou /etu-maltt/concordia/duran/stic-1/ex4/index.html

Il est donc obligatoire d'utiliser un fichier que le serveur Web reconnaît comme “index” (welcome.html, index.html). Veuillez utiliser des minuscules !!

Machine: tecfaetu.unige.ch

Répertoire web: /web/etu-maltt/concordia/login/stic-1/ex..

Important: chaque page déposée sur notre serveur doit être datée et signée et de manière visible sur la page (e.g., dans le "footer" en bas de page). Pour signer une page, mettez votre nom en tant que lien à votre page travaux ou votre page personnelle MALTT.

Assistance et contact avec l'équipe enseignante

L'assistance se fait directement dans la page des exercices sur ce même wiki. Pour chaque exercice, utilisez l'onglet discussion associée à chaque page de l'exercice. Procédure:

• Cliquez sur le "tab" discussion en haut de la page
• Pour ajouter un nouveau sujet, cliquez sur n'importe quel lien [nouveau] qui se trouve après le titre d'un message. S'il s'agit du premier message dans la discussion, la page affiche directement le formulaire pour écrire un message.
• Pour répondre à un message de manière hiérarchique, cliquez sur le lien [répondre] du message en question. Lorsque les sous-niveaux commencent à être trop élevé, vous pouvez éditer directement le code de la page.

Important: pour rester à jour sur des changements ou être avertis en cas de réponse à vos questions, suivez les pages des exercices en cochant l'étoile qui s'affiche en haut de la page. Lorsque vous suivez une page, vous recevez automatiquement un e-mail lors des changements du contenu ou de la discussion.

Utilisez les emails seulement pour des communications personnelles ou des problèmes qui impliquent le partage de données sensibles (e.g. problèmes d'accès au serveur). Insérez toujours tous les membres de l'équipe enseignante comme destinataires du message et des réponses. N'utilisez pas Moodle (ni Forum, ni messages privés) pour des communications ou recherche d'aide.

Évaluation et règles de participation

Règles générales pour la promotion "Concordia"

1. STIC I prévoit exclusivement des rendus individuels, sans travaux par groupes. Vous avez le droit de vous entre-aider, à condition de :
   • Rendre un travail qui présente des différences substantielles par rapport aux travaux de vos collègues (de la même volée ou précédentes) au niveau technique, conceptuel et/ou du public cible
   • Citer dans le rapport si vous avez reçu de l'aide par vos collègues. Vous pouvez les citer, cela peut faire augmenter leur note, mais pas diminuer la vôtre : chercher de l'aide est une compétence importante. Ceci dit, l'équipe enseignante est payée pour effectuer cette tâche, tandis que vos collègues doivent penser aux différents rendus aussi des autres cours.
2. Vos productions (dispositif, rapport et contributions wiki) doivent être correctement publiées dans les endroits spécifiés (e.g. votre page travaux, votre profil EduTechWiki, etc.) et dans les délais indiqués. Faites attention à ce que les liens pointent aux bons endroits !
3. Chaque page déposée sur notre serveur doit être datée et signée (e.g. vous pouvez ajouter votre nom et la date à la fin de la page)

Grille d'évaluation

Le cours utilise la même grille d'évaluation pour la plupart des exercices. Les critères d'évaluation considèrent des éléments techno-pédagogiques liés au dispositif et au rapport/fiche d'accompagnement de chaque exercice. Les critères d'évaluation sont les suivants :

Grille d'évaluation utilisée pour la plupart des exercices STIC I

Barèmes

Les critères d'évaluation sont spécifiés dans la grille d'évaluation de chaque exercice sur Moodle. Ici nous proposons des indications générales sur le système de notation :

• Une note de 5.5 correspond à un travail "parfait" (sur un plan technique et conceptuel) mais sans originalité. Pour avoir un 6 il faut ajouter une 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. Un crédit ECTS vaut 25 à 30h de travail apprenant. Autrement dit, 3 jours de travail devraient suffire pour obtenir un 5).
• 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
• Une note de 2 est donnée pour un travail très inachevé
• Une note de 0 sera donnée pour un travail non rendu

Retards et travaux non rendus

Nous n'accordons pas de délai supplémentaire de manière individuel, sauf s'il s'agit de cas particulier (maladie, ....)

Les exercices rendus en retard, mais encore pendant le semestre, seront pénalisés de 0.3 (petit retard) ou 0.6 (grand retard). Vous pouvez rendre les exercices en retard à n'importe quel moment pendant le semestre, il suffit de nous communiquer quand l'exercice est disponible sur vos espaces travaux. En général, nous corrigeons tous les exercices en retard à la fin du semestre.

Si, à la fin du semestre, vous n'avez pas rendu un ou plusieurs exercices, ces exercices seront automatiquement notés avec un 0 et pondérés dans la note finale, à moins que vous nous communiquez par email votre volonté de vous inscrire aux rattrapages. À ce moment, les règles des rattrapages s'appliquent (voir plus bas).

Sources et utilisation d'autres matériaux

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é. Il n'est pas autorisé de rendre un travail fait par quelqu'un d'autre "tel quel". Vous devez apporter une contribution propre qui modifie considérablement le travail original.

Dans certains exercices, vous avez le droit d'utiliser des fragments de code que vous ne comprenez pas, par exemple des librairies JavaScript ou du code que vous avez trouvé sur un forum ou un site, mais à condition de l'indiquer clairement !

Fraudes

Le plagiat (utilisation de matériaux non cités) sera puni. Rendre un travail fait entièrement par quelqu'un d'autre sera puni sévèrement, c.a.d. au moins une note de zéro pour l'exercice en question. En outre, pour les cas de plagiats sévères, on se réserve d'autres actions disciplinaires selon les règlements de la faculté.

Vous pouvez vous faire aider, mais il faut l'indiquer dans le rapport. En plus, vous devez maîtriser le produit rendu, être capable d'expliquer l'architecture du dispositif et de reproduire une version similaire. Je me réserve le droit de vous interroger sur la provenance du code et d'autres matériaux utilisés et de tester vos connaissances par d'autres moyens en cas de soupçon de fraude.

A priori je vous fais confiance, mais un étudiant qui démontre une très faible connaissance technique en classe et qui en même temps rend des travaux de haute qualité technique risque une interrogation sur la provenance du travail et doit démontrer ses compétences par un autre type d'évaluation de type interrogation orale, quiz, etc.

Conseils pour avoir une bonne note

Faites attention à bien lire l'énoncé et n'oubliez ni le rapport ni la contribution wiki! C'est le produit (dispositif + page d'accueil/rapport + contribution wiki) qui sera évalué. On n'évalue ni vos efforts ni vos connaissances en informatique. Placer des fichiers à des mauvais endroits entraînera également 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 inversement. Il faut simplement respecter les contraintes énoncées des 2 côtés.

Rattrapage pour la séance de septembre

Ceux qui ont eu une note insuffisante et/ou n'ont pas complété les exercices peuvent, selon le règlement, se présenter à la séance de rattrapage à la fin du semestre d'été. Vous avez le droit de rendre les mêmes exercices, mais avec une pénalité de retard de 1 point pour chaque exercice en retard. Si vous désirez par contre éviter cette pénalité je peux vous donner un travail supplémentaire de rattrapage. Ce travail supplémentaire supprime les pénalités de retard à condition que la note dépasse un 4 et il sera également évalué.

Les étudiant-es qui refont le cours l'année suivante ont le droit de présenter ou de reprendre/compléter des exercices faits l'année précédente, mais uniquement avec mon autorisation et s'ils sont similaires !

Délai: Une semaine avant la fin de la session des examens. Voir le Calendrier de la FPSE

Calcul de la note finale

Pondérations pour le calcul de la note finale Note finale = moyenne de tous les exercices + petit bonus participation en ligne

Il n'y a donc pas d'examen. Toutefois il existe la possibilité de discuter le bilan de votre travail à tout moment ou à la fin des cours. Il s'agira aussi de la dernière occasion pour mettre en cause une note que vous jugez injustifiée. Et pour rappel, je me réserve le droit de vous administrer d'autres évaluations en cas de soupçon de fraude.

Feedback et corrections

Le feedback pour chaque exercice est disponible dans l'espace Moodle du cours STIC I de votre volée et il est divisé en deux éléments :

• Un feedback individuel avec des commentaires dans la grille d'évaluation de chaque exercice. La grille est utilisée également pour corriger et noter vos rendus
• Un feedback collectif dans un message dans le forum des annonces de l'espace

Le module Moodle est uniquement ouvert aux participants et ne contient que les évaluations (feedback et notes).

Conseils

Répartition "type" du temps de travail

Voici une représentation graphique de la répartition conseillée du temps de travail pour chaque période. La taille des éléments est proportionnelle au temps conseillé pour chaque activité/étape :

Répartition "type" du temps de travail pour les périodes STIC I.

En résumé :

1. Commencer par lire le matériel pédagogique associé aux exercices. En général, les deux exercices pour chaque période présentent plusieurs aspects en commun. En même temps, testez et adaptez à vos besoins les exemples qui ont été abordés en salle de classe ou que vous trouvez dans le matériel pédagogique.
2. Dès que vous êtes à l'aise avec les contenus, planifiez vos exercices. Rappelez-vous que le rôle des exercices est principalement de consolider les aspects théoriques. Il est important de se poser des objectifs atteignables ! C'est mieux de rendre des applications simples bien structurées que des projets trop ambitieux que vous n'avez pas eu le temps de terminer !
3. Gardez assez de temps pour l'écriture de vos rapports (il s'agit de rendus universitaires !) et pour la contribution Wiki. Idéalement, la contribution devrait porter sur les arguments traités dans la période (pour consolider ultérieurement les acquis), mais ceci n'est pas obligatoire. Vous pouvez contribuer à tout article dans ce wiki ou celui en anglais selon les consignes explicitées dans la page STIC:Contribution Wiki.

Bonnes pratiques

• Tenez-vous au courant. Regardez la page "discussion" pour chaque exercice avant de vous lancer ... et participez ! Abonnez-vous aux fils RSS des pages discussion ou faites vous envoyer un mail par le wiki (cliquer sur l'étoile ou le bouton "suivre" en haut à droite).
• Lisez soigneusement les instructions sur cette page et celles qui sont données pour chaque exercice. Notamment, soyez sûr-e-s :
  • de comprendre la tâche
  • de poser les fichiers au bon endroit (commencez tôt même avec des dispositifs incomplets !)
  • de faire l'inventaire des outils que vous devez/pouvez utiliser
  • d'explorer les ressources mises à disposition
• Planifiez votre travail
  1. Faites toujours un petit exercice avant de vous lancer dans vos mini-projets (par exemple finir ce qu'on a commencé en salle de classe)
  2. Ensuite, étudiez les exemples donnés en cours et essayez de les modifier/adapter. Vous pouvez utiliser les exemples comme base pour votre travail sans aucun pénalité ou risque de plagiat.
  3. Enfin, faites un schéma qui résume vos objectifs et esquissez le scénario dans lequel vous comptez utiliser ou faire utiliser votre dispositif.
• Évitez de faire trop de "tourisme google" ! La plupart de l'informations nécessaires se trouvent dans les pages wikis et les ressources complémentaires listées dans les liens en bas de page.
• N'essayez pas d'impressionner avec des effets ou du code copier-coller que vous ne maîtrisez pas. L'objectif du cours et que vous compreniez ce que vous faites.
• Explorez et adaptez les outils (wiki, éditeurs, logiciels, ...) à vos besoins
• Minimisez la complexité de vos projets si vous avez l'impression d'être débordé-e-s
• N'ayez pas peur de montrer votre code en le publiant sur le serveur pour chercher de l'aide, même s'il est incomplet ou pas fonctionnel. C'est très utile pour qu'on puisse vraiment vous aider.

Matériel d'enseignement

Logiciels (obligatoires, mais choix libre)

Pour le cours il faut avoir :

• Un éditeur de texte. Le cours propose Visual studio code, mais si vous maîtrisez déjà un autre outil vous pouvez le maintenir.
• Un navigateur web avec des outils développeurs. Le cours propose Google Chrome ou Chromium, mais vous avez encore une fois le choix.
• Un éditeur XML. On conseille Exchanger XML Editor ou Visual studio code avec l'extension XML de Red Hat.
• Un logiciel de dessin SVG. On conseille Inkscape.
• Des logiciels d'édition d'image et vidéo peuvent également être demandés pour des exercices.

Matériel pédagogique pensé pour le cours

Depuis l'année académique 2018/2019, nous utilisons des ressources pédagogiques qui ont été conçues spécifiquement pour le cours STIC I. Il s'agit d'une sélection des ressources qui composent l'Initiation à la pensée computationnelle avec JavaScript :

• STIC I - Support de cours

Le matériel existe sous forme de pages EduTechWiki, mais peut également :

• être exporté en tant que PDF ou epub
• être imprimé à la demande via PediaPress