BUT MMI2 · StratUX Rihab Doukkali · 2025-2026

TP6 - EXERCICES

EXERCICE 1

COMMENTAIRE - EXERCICE 1

Cet exercice était assez simple à réaliser. La logique du hover est rapide à comprendre et la mise en place ne pose pas de grosses difficultés. Le principal point d’attention a été la superposition entre le filtre et l’image, mais une fois réglée, l’effet fonctionne correctement. Le rendu est propre et correspond à ce que j’attendais.

EXERCICE 2 - Animations de chargement

COMMENTAIRE - EXERCICE 2

Cet exercice était plutôt agréable et assez simple à faire, parce que tout se joue surtout en CSS. Le plus long a été de trouver le bon rythme pour que les animations soient fluides (durées, délais, répétitions) sans que ça fasse “saccadé” ou trop rapide. J’ai aussi dû faire quelques ajustements sur les alignements et les tailles pour que chaque version reste propre et lisible. Au final, je suis contente du rendu, et ça m’a aidée à mieux prendre en main les animations CSS.

EXERCICE 3

COMMENTAIRE - EXERCICE 3

Cet exercice était plutôt sympa à faire parce que l’effet est visible tout de suite. Par contre, j’ai eu un peu de mal au début à gérer le lien entre le scroll et la rotation, surtout pour que ce soit fluide et pas trop rapide. J’ai aussi dû faire quelques essais sur le positionnement de l’hélice pour qu’elle reste bien placée pendant le défilement. Au final, le rendu est propre et l’animation fonctionne comme prévu.

EXERCICE 4

COMMENTAIRE - EXERCICE 4

Cet exercice était plus fun que les précédents, mais aussi un peu plus chaotique. Il y a beaucoup de choses qui se passent en même temps, donc ce n’était pas toujours simple de garder le contrôle sur les mouvements et les interactions. J’ai dû tester plusieurs fois avant d’obtenir quelque chose de cohérent, surtout avec les animations et les boutons démarrer / arrêter. Même si ce n’est pas parfait, le résultat fonctionne et l’exercice m’a permis de mieux comprendre comment combiner HTML, CSS et un peu de JavaScript ensemble.

EXERCICE 5

COMMENTAIRE - EXERCICE 5

Cet exercice n’était pas particulièrement compliqué. Les animations sont légères et reposent surtout sur du HTML et du CSS. Le plus important a été de bien doser les mouvements pour que l’iPhone et le bouton restent subtils et agréables visuellement. Globalement, l’exercice s’est bien déroulé et m’a surtout servi à consolider des bases déjà vues sur les effets au survol et les petites animations.