Rapport de l'exercice 4

1. Introduction

Ce rapport décrit le processus de création d'un site web HTML intégrant une vidéo sous-titrée. L’objectif principal était de concevoir une interface interactive, intuitive et visuellement agréable, respectant les standards modernes du web.

2. Fonctionnalités du site web

• J'ai intégré une vidéo pédagogique sous-titrée, il s'agit d'une présentation au sujet de l'apprentissage à domicile.
• J'ai également mis des contrôles personnalisés : lecture/pause, avance/recul de 5 secondes, gestion des sous-titres et activation/désactivation de la musique de fond.

2.1.Esthétique

J'ai opté pour l'utilisation de couleurs douces et accueillantes rappelant l'ambiance relaxante de la musique de fond afin d'aller dans le thème du sujet de la vidéo.

3. Technologies Utilisées

3.1. Vidéo pédagogique

J'ai tout d'abord préparer une présentation sur Canva, puis utiliser la fonctionnalité "Présenter et Enregistrer" afin d'intégrer une voix off.

3.2. Site Web

• HTML5 et CSS : pour structurer le site web et sa mise en page/stylisation.
• JavaScript : pour les interactions et contrôles dynamiques.
• VTT : pour intégrer les sous-titres à la vidéo.

5. Difficutlés rencontrées

• Il m'a été difficile de trouver un sujet pédagogique qui serait relié au MALTT, j'ai donc opté pour une petite présentation d'astuces dans la structuration et l'auto-discipline d'un apprentissage fait à domicile, notamment pour les élèves du niveau primaire/cycle. La plupart des astuces mentionnées peuvent également être données aux étudiants du MALTT lors des periodes à distance.
• Il m'a fallu un certain pour comprendre la gestion des sous-titres via le format WebVTT. Il faut notamment avoir un contrôle précis du temps de lecture afin de savoir si les utilisateurs auront le temps de lire avant que les prochains sous-titres n'apparaissent trop rapidement.

6. Résultats Obtenus

• Je pense avoir réussi à développer une interface fonctionnelle et esthétique.
• Les contrôles de la vidéo intégrée sont basiques mais restent fonctionnelles, toute fois, je n'ai pas mis de boutton "raccourci" dans la vidéo car j'ai trouvé la vidéo trop courte et l'apprentissage pas assez développé pour en intégrer un.

7. Perspectives d'Amélioration

• Il serait bien d'ajouter une liste d'outils intéressants pour l'amélioration de l'apprentissage à domicile.
• Adapter le design du site web pour mobile.