sprout-guard

Sprout & Guard (萌芽小院) est un jeu web de tower defense végétal entièrement statique, au style livre d'illustrations crémeux. Le joueur collecte du soleil, plante des végétaux et défend un jardin de 5 rangées × 9 colonnes. Le projet propose deux niveaux sélectionnables indépendamment : le Jardin ensoleillé comprend 3 vagues d'attaque, adapté à la découverte des mécaniques de base ; le Jardin au coucher du soleil comprend 4 vagues et ajoute des défis plus relevés comme les barricades, les seaux métalliques et les zombies rapides. Le jeu comprend cinq plantes : Tournesol, Pisto-pois, Noix, Lance-glace et Bombe cerise, chacune avec un coût en soleil et un rôle différents. Le joueur doit cliquer sur le soleil pour obtenir des ressources, choisir une carte de plante pour la planter, et utiliser les mécanismes de temps de recharge, d'arrachage et de brouette unique par rangée pour faire face aux attaques de zombies. Le projet prend en charge la souris sur ordinateur et les raccourcis clavier (1–5 pour choisir une plante, 6 pour la pelle, espace pour mettre en pause, Échap pour annuler la sélection). Il propose également une mise en page immersive en paysage pour téléphone et tablette, et tente de passer automatiquement en plein écran. Les records de niveau et les réglages sonores sont enregistrés localement dans le navigateur. Le jeu ne comporte aucune dépendance d'exécution tierce, aucune requête de ressources externes ni service backend. Lorsque les fichiers sont complets, il peut fonctionner hors ligne via un serveur HTTP local. En raison de l'utilisation des ES Modules du navigateur, il n'est pas possible d'ouvrir directement index.html en double-cliquant : il faut démarrer un serveur statique (par exemple python -m http.server 8000) puis accéder au jeu. Le projet peut également être déployé directement sur GitHub Pages, sans étape de build. La structure du code est claire : index.html gère la structure de la page, style.css s'occupe de l'interface façon livre d'illustrations et de l'adaptation en paysage, main.js gère les interactions, les animations et le son, engine.js implémente les plantes, les zombies, les vagues et les règles de victoire ou de défaite, et art.js est responsable du dessin des personnages et des décors sur Canvas.