Portrait

Rapport Exercice 4

Mohammad Shabana - 07.12.2025

Cette page recense le rapport de l'exercice effectué pour le cours STIC. Vous pourrez y trouver le lien de l'exercice et des informations complémentaires concernant les objectifs, le design, la production, l’auto-évaluation, la bibliographie et les ressources utilisées.

Objectif

L’objectif de cette vidéo est d’accompagner les étudiants de la prochaine volée dans le cadre du cours STIC du MALTT. Chaque flashcard est conçue sous la forme d’un mini-tutoriel explicatif, présentant notamment la manière d’ajouter un bouton permettant de déclencher de la musique en HTML5. Le public cible est donc constitué des étudiants de la prochaine volée souhaitant intégrer cette fonctionnalité lors de la création de leur page personnelle dans le cadre de l’exercice 1 du cours STIC. c'est un tutoriel d'un coté pour mettre une image bien centrée en forme de bule et d'un autre coté ajouter plusieurs type d'interactivité.

Design

Mon dispositif permet de résoudre la problématique de l’implémentation d’un bouton déclenchant une musique en HTML5,le il n'ya pas vraiement de disgne dans la vidéo elle meme , mais plutot dans la platforme vidéo qui a évolué avec le temps j'ai commancé par quelqeue choses de simple et vide ensuite avec le temps pednant des semaines je rajoutais petit à petit des choses comme l'espace commentaire ou encore les couleurs radiante , car je veux avoir une platforme utilisable à long terme . meme au niveau des commandes j'ai changé les commandes de base pour ajouter mes propres boutons personnalisés .

Production

Concernant la partie de production, j'ai creé de 0 la platforme sans utiliser de code externes et cela m'a pris beaucoup de temps et je n'ai pas trouvé cela productif car j'ai oublié la moitié de ce que j'ai fais et j'ai également utilisé l'IA pour des partie dans les quelles nous sommes pas évalués comme parexemple la création de l'espace commentaire. j'ai également créer une miniature avec la balise poster cela est cool.

Écran Écran violet Étape 1

Auto-évaluation

Je suis satisfait du rendu visuel de la platforme mais pas de la vidéo car je n'ai pas eu l'occasion d'utiliser mes compétences de motange ici le montage reste très minimaliste et cela m'avait poussé à vouloir changé de thème et vouloir faire un tutoriel d'une acrobatie mais j'ai vu qu'il fallait faire quelqeue choses en liens avec le maltt .également j'ai trop mal géré mon temps car j'avais fait l'exercice déja depuis la p1 mais je l'avais pas vraiement finaliser donc quand je me suis remit à continuer j'ai me suis senti totalement perdu et j'ai eu des problème de gestion de temps dans le cours vip et adid qui m'ont poussé à delaissé un peu cet exercice car je pouvais faire vraiement mieux .

j'ai rencontré beaucoup de problème avec les vtt que jusqu'à maientenant j'ai pas compris .mes vtt s'affichait en décalé ou ne s'affichait pas dutout et d'un coup tout marchait sans explications et j'ai toujours pas compris la source du problème et comment je l'ai régelé car j'ai rien fait je commancé parexemple à changer les couleurs des boutons et d'un coup les vtt marchaient bien.

Bibliographie et sources

J’ai utilisé ChatGPT afin de convertir les pixels en valeurs souples comme les em, vh, etc., et pour réorganiser mon code. Je l’ai également utilisé pour obtenir des astuces et des suggestions en JavaScript,j'ai utilisé l'iA pour faire des parties qui n'étaient pas évaluées comme l'espace commentaire .

Les backgrounds animés et les musiques sont tirés de ce site, sans copyright.

Flaticon

Tous les icônes proviennent de ce site, également sans copyright.

Designed by studiogstock / Freepik

Liens Exercice 4

vidéo pédagogique Portfolio
Lancer la musique
template rapport