Retour

Halloween Manor

Un jeu d’Halloween sur navigateur : vous êtes le fantôme d’un vieux manoir sombre et possédez portraits, miroirs et rocking-chairs pour effrayer des visiteurs munis de lampes torches jusqu’à les faire fuir par la porte d’entrée. Les visiteurs sont la mascotte Triboo en costumes d’Halloween, réalisée avec l’API Tripo, du costume jusqu’à l’animation.

Auteur: Theodore
Essayer en direct
Halloween ManorEssayer en direct

Description

Halloween Manor est un mini-jeu d’Halloween qui tourne directement dans le navigateur. Vous êtes le fantôme d’un vieux manoir sombre : des visiteurs poussent la porte, lampe torche à la main, et votre rôle est de posséder les objets de la maison, de choisir le bon moment pour apparaître et de les faire détaler un à un en hurlant par la porte d’entrée. Jusqu’à quatre visiteurs peuvent se trouver en même temps dans la maison, arrivant parfois à deux, et chacun a plus ou moins de cran — les étiquettes de nom vous indiquent qui est trouillard et qui est sceptique.

Il y a deux sortes d’objets. La boîte à musique et la porte de la cuisine sont des leurres : elles émettent un son qui attire quiconque l’entend. Les lampes, le rocking-chair, le portrait, le miroir sur pied, ainsi que le lit et l’armoire de la chambre sont des objets d’effroi, et ils ne fonctionnent que si quelqu’un regarde — un œil s’allume au-dessus d’un objet lorsque quelqu’un peut le voir à cet instant précis. Le principe de base consiste à attirer d’abord, puis à effrayer : la boîte à musique se combine avec la lampe de la chambre, la porte de la cuisine avec le rocking-chair. Le portrait représente une dame ordinaire jusqu’à ce que vous le possédiez : ses yeux se tournent alors et son visage fond pour devenir quelque chose d’horrible ; un visage jaillit du miroir sur pied ; et six tableaux d’horreur sont accrochés aux murs du vestibule, du couloir, du bureau, du salon et de la chambre.

Les visiteurs ne voient que ce que leur lampe torche éclaire. Quand un faisceau tombe sur vous, vous devenez plus dense et ils s’arrêtent pour vous fixer — mais cela ne suffit pas à les effrayer. Appuyez sur F ou faites un clic droit pour apparaître : les lumières alentour faiblissent deux fois, comme des ampoules défaillantes, et 0,6 seconde plus tard, vous prenez la forme d’une silhouette sombre et restez ainsi 1,5 seconde en relevant lentement la tête. L’apparition n’effraie que deux types de personnes : celles qui braquent leur lampe torche sur vous, et celles qui, déjà nerveuses, peuvent vous voir. Plus elles ont peur, plus le choc est violent : servez-vous donc d’abord des objets pour ébranler les visiteurs, puis apparaissez pour porter le coup de grâce. L’apparition a un temps de recharge de 18 secondes.

Maintenez le bouton gauche de la souris sur un objet pendant environ une demi-seconde pour poser un piège : le givre le recouvre peu à peu, et le piège se déclenche de lui-même quand quelqu’un s’approche. Vous pouvez avoir deux pièges à la fois, et un piège se désarme si personne ne vient dans les 60 secondes. Quand votre réticule vise un objet, une ligne de givre ténue se dessine sur le sol et délimite la zone où il peut effrayer (ou attirer) les visiteurs, et un petit œil s’allume devant le nom d’un visiteur quand votre prochaine action va l’effrayer. Après votre action, l’indication affichée près du réticule vous dit ce qui s’est passé — « Theo jumped » ou « No one saw it ».

Une partie dure une nuit, soit environ cinq minutes. Le premier visiteur entre dès le début, puis un autre toutes les 12 secondes, jusqu’à ce qu’ils soient quatre dans la maison. Au bout de 3 min 20 s, la nuit se referme — la lumière du porche s’éteint et plus personne ne vient — et à 4 min 30 s, l’aube se lève et ceux qui sont encore à l’intérieur repartent d’eux-mêmes. Quand le dernier est parti, le registre des visiteurs s’ouvre : l’heure d’arrivée de chacun, ce qui l’a mis en fuite ou s’il est reparti à l’aube, avec une phrase de conclusion qui dépend du nombre de visiteurs que vous avez fait fuir. Il n’y a ni score, ni victoire, ni défaite ; choisissez Keep haunting pour continuer, ou Another night pour recommencer.

Commandes : à la souris et au clavier, le jeu se joue à la troisième personne — vous êtes le fantôme. Cliquez pour verrouiller la souris, flottez avec WASD (même à travers les murs), orientez la vue avec la souris et rapprochez ou éloignez la caméra avec la molette. Cliquez sur un objet situé à moins de 4 mètres pour le posséder, maintenez le bouton gauche pour poser un piège, et appuyez sur F ou faites un clic droit pour apparaître. Esc libère la souris et affiche toutes les commandes, M coupe le son, et la qualité graphique se règle dans le coin inférieur droit. Vous ne voyez pas les visiteurs à travers les murs : suivez donc le bruit de leurs pas — c’est plus facile avec un casque. Sur téléphone et tablette, le manoir devient une maison de poupée vue du dessus : touchez un objet pour le posséder, et faites pivoter la vue. Ce mode n’a ni apparition, ni pièges, ni tableaux — effrayez de nouveau un visiteur avant qu’il ne se soit calmé, et il prendra la fuite.

Un navigateur compatible WebGPU, comme une version récente de Chrome ou d’Edge, est recommandé ; les navigateurs sans WebGPU basculent automatiquement sur WebGL2. C’est un jeu solo, sans connexion à un compte ni téléchargement, mais le premier chargement prend un petit moment, le temps de récupérer les modèles et de compiler les shaders. L’interface du jeu est en anglais.

Comment Tripo a été utilisé

Tous les personnages du jeu — les visiteurs munis de leurs lampes torches comme le fantôme que vous incarnez — ont été créés avec l’API Tripo ; la maison, les meubles et les objets sont construits par le code à partir de formes de base, et les tableaux, le portrait et le visage du miroir sont des textures 2D distinctes.

  • Visiteurs : Triboo, la mascotte de VAST, l’équipe derrière Tripo, en quatre costumes d’Halloween — un vampire victorien, un explorateur nocturne muni d’une lanterne, une sorcière et un squelette dessiné à la main. L’image-vers-image de Tripo met d’abord Triboo en T-pose, et les quatre costumes partent tous de cette seule et même image, si bien que les proportions concordent et que les personnages se riggent proprement ; une seconde passe d’image-vers-image ajoute le costume tout en conservant le corps rond et noir, le logo sur le devant et les baskets jaunes, la tenue étant conçue comme des accessoires de figurine en vinyle : chapeaux, capes et cols.
  • Modèles des visiteurs : chaque image de costume est déclinée en quatre vues, puis le multivue-vers-3D de Tripo construit un modèle doté de textures PBR. En vue à la troisième personne, vous voyez surtout les visiteurs de dos, et les quatre vues permettent de bien rendre les capes et les étoles dans le dos ; les textures sont débarrassées de leur éclairage précalculé, afin que ce soient les lampes et les lampes torches du jeu qui se chargent de la lumière.
  • Rigs et animation : après une vérification de riggabilité, le rigging automatique de Tripo met en place un squelette humanoïde, puis huit animations prédéfinies de Tripo sont appliquées — attente, marche, course, regard circulaire, peur, fuite et deux types de sursaut. Avant l’export, un script Blender affine chaque visiteur de la même façon : le corps en boule, le chapeau et la cape bougent d’un seul bloc avec le torse, les accessoires proches des jambes ne s’étirent pas avec elles, le nombre de triangles est plafonné et le root motion est supprimé. Chaque visiteur pèse environ 1,1–1,7 MB, avec des textures WebP.
  • Le fantôme : le texte-vers-image de Tripo a produit quatre images conceptuelles, et celle qui a été retenue est passée par l’image-vers-3D de Tripo pour devenir un modèle blanc, sans texture — la brume froide translucide, la façon dont il s’épaissit dans le faisceau d’une lampe torche et la forme sombre et solide qu’il prend quand il apparaît sont toutes dessinées par les propres shaders du jeu, il n’a donc besoin d’aucune texture. Un nettoyage dans Blender a ensuite enfoncé le visage à l’intérieur de la capuche pour en faire un creux profond, ramené le modèle sous les 8 000 triangles et précalculé l’occlusion dans les sommets, si bien que l’intérieur de la capuche et les plis profonds s’assombrissent.

Comment le jeu tourne dans le navigateur

Pas de moteur de jeu : le jeu repose directement sur le renderer WebGPU de three.js, avec TypeScript et Vite, et bascule automatiquement sur WebGL2 dans les navigateurs sans WebGPU. Le build est un ensemble de fichiers statiques aux chemins relatifs, si bien qu’il s’ouvre depuis n’importe quel sous-chemin, sur n’importe quel hébergement statique.

Les lampes torches sont les sources de lumière les plus importantes de la maison : chaque visiteur en porte une, et chacune projette ses propres ombres. Le shader du fantôme calcule, pixel par pixel, dans quels cônes de lampe torche il se trouve — dans un faisceau, il s’épaissit, son contour se resserre et il prend un peu de la chaleur de la lampe torche, tandis qu’en dehors, il reste une brume froide. Quand il apparaît, il passe à un matériau « solide » sombre qui bloque la lumière et écrit la profondeur, un peu plus clair du côté qu’éclaire une lampe torche. Lorsque le fantôme traverse les murs et les meubles, ceux-ci se dissolvent autour de lui, bordés de givre.

Tous les sons sont synthétisés en direct avec Web Audio — le jeu ne contient pas un seul fichier audio. Les hurlements, le grincement du rocking-chair, le bourdonnement électrique de la lampe, la boîte à musique, le coup sonore quand le visage jaillit du miroir et l’ambiance de la maison sont tous générés par le code. Quand vous ne voyez personne à travers les murs, c’est au bruit de leurs pas que vous retrouvez les visiteurs.

Le bouton de démarrage attend que la maison, la première tenue de visiteur et la précompilation des shaders de toute la maison soient prêtes ; cliquez dessus, et la nuit commence en 20 millisecondes environ. Les autres tenues se téléchargent en arrière-plan pendant que vous jouez, et rejoignent la rotation une fois leurs pipelines compilés. Le scintillement des lumières est limité pour protéger les joueurs photosensibles : aucune lumière ne faiblit plus de trois fois en l’espace d’une seconde. La qualité graphique se décline en deux niveaux, haute et basse ; en qualité basse, le rendu se fait à 75 % de la résolution.