Des scans d’un vieux projet

Cliquez sur les images pour les afficher en grand (sauf la dernière, ha ha ha).

Cet article ne concerne pas Squarity, mais il pourrait.

Il s’agit d’un super projet de jeu vidéo que j’avais imaginé il y a une quinzaine d’années. Il est fortement inspiré de la série de jeux « Skweek », en particulier Tiny Skweeks et Fury of the Furries.

Tiny Skweeks est un jeu de réflexion construit sur la même idée qu’Atomix. Vous déplacez des éléments qui ne peuvent s’arrêter tant qu’ils n’ont pas rencontré un mur ou un autre objet.

J’avais bien aimé, même si les niveaux d’introduction sont trop nombreux, et que certains objets sont un peu déroutants (une dynamite sélective qui n’explose que lorsqu’un tiny de la même couleur passe dessus, wtf ?).

Fury of the Furries est un jeu de plate-forme très mignon, mais que j’avais trouvé super chiant car les tinies que l’on dirige ont l’inertie d’une baleine dans un lac de miel. Le jeu est cependant doté d’une idée intéressante : Les tinies ont 4 couleurs différentes, avec un pouvoir spécial pour chacun.

Je me suis dit : pourquoi ne pas faire une suite au jeu de réflexion, en reprenant l’idée des pouvoirs différents ?

Les tinies, concept art

Avec :

  • Le tiny jaune. Il peut faire du feu sur une case adjacente, pour détruire certains types de murs et faire fondre les blocs de glace.
  • Le tiny vert. Il peut lancer un grappin pour attirer un bloc de glace vers lui. Son grappin lui permet aussi de passer par dessus les trous.
  • Le tiny rouge. Il peut détruire certains types de bloc de pierre en tapant dedans.
  • Le tiny bleu. Il boit de l’eau, ce qui lui permet ensuite de créer un bloc de glace.

Le principe initial reste le même : les tinies se déplacent mais ne peuvent être arrêtés en chemin.

Les blocs de glace sont des éléments de jeu importants : les tinies peuvent shooter dedans. Ça les déplace dans une direction, jusqu’à rencontrer un mur où un objet. Si un bloc de glace cogne un autre bloc de glace, le mouvement se transmet.

Élaboration de niveaux

Le level design de jeux de réflexion n’est pas un travail simple. Lorsqu’on veut créer une énigme un peu difficile, il faut prendre garde à ne pas se réfugier dans des techniques pourries : inventer des éléments au comportement trop complexe ou imprévisible, enchevêtrer une grosse quantité d’éléments simples obligeant la personne qui joue à tester 65 536 combinaisons, cacher des éléments sans aucun indice, …

Je suis parvenu à créer une demi-dizaine de niveau que je juge « difficile sans être pourris ». Je n’ai pas pris le temps de créer des niveaux faciles. Si j’avais concrétisé ce super-projet, j’en aurais bien évidemment placé au début du jeu en introduction, pour faire progressivement découvrir les éléments du jeu.

Niveau 1

Le brouillon :

Le niveau au propre (si on peut appeler ça du propre).

Remarquez le tiny vert à gauche, et le jaune un peu plus haut à droite.

J’ai expliqué le fonctionnement des différents éléments du niveau. Pour faire plus classe, c’est en anglais (me demandez pas pourquoi). Vous n’arriverez peut-être pas à me relire, alors je ferais éventuellement l’effort de transcrire ces descriptions en vrai texte. Ça dépendra de vous (voir plus loin).

Niveaux 2a et 2b

Les niveaux sont rangés dans leur ordre de création, et non par difficulté. En fait, le premier me semble être celui le plus difficile.

Pour ces deux niveaux, je me suis donné pour objectif de me concentrer sur un pouvoir d’un seul tiny.

Le niveau 2a fait beaucoup intervenir le grappin du tiny vert, tout en restant très simple, avec très peu d’éléments interactifs.

Le niveau 2b remplit moins bien l’objectif. Il fait beaucoup intervenir la flamme du tiny jaune, mais aussi le grappin du tiny vert. Il comporte des éléments complexes tel que la dalle avec une flèche rotative et le bouton « push me » (la personne qui joue l’actionne en cliquant directement dessus, pas besoin d’y amener un tiny).

Au fur et à mesure que je créais ces niveaux, je me disais qu’il faudrait revoir les pouvoirs des tinies. Le vert est trop overkill avec son grappin et sa capacité à passer par-dessus les trous. Mais le niveau 2b tel qu’il est conçu actuellement nécessite les deux pouvoirs.

D’un autre côté, le pouvoir du rouge est un peu pourri, il faudrait lui ajouter une autre particularité. Peut-être quelque chose par rapport aux fruits. Il pourrait être automatiquement attiré par un type de fruit particulier, ou avoir la possibilité d’attraper un fruit en passant à côté.

De toutes façons, il ne faut rien s’interdire. On pourrait imaginer encore d’autres couleurs de tinies, avec d’autres pouvoirs.

Niveau 3

On remarquera sur le brouillon les mots « lune » et « soleil » en bas à droite. J’avais écrit à l’arrache sur la feuille les paroles de la chanson « j’ai demandé à la Lune ». Ne me demandez pas pourquoi.

Voici le niveau au propre.

Je le trouve un peu nul. Trop alambiqué, trop de boutons qui font chacun trop de choses.

Vous avez certainement remarqué la présence d’une bouboule multicolore dans tous les niveaux. C’est la « rainbow-ball » (je n’avais pas vraiment défini ce que ce serait). Lorsque vous amenez un tiny dessus, vous gagnez le niveau.

Dans le Tiny Skweek original, le but est de placer chaque tiny sur la plate-forme lumineuse de sa couleur. J’en ai décidé autrement pour mon jeu. Un unique objet à récupérer me semble plus souple, permet de concevoir des niveaux plus variés, et aiderait au déroulement de l’histoire. L’objet final à récupérer pourrait être différent selon le niveau : une clé, les plans d’une invention secrète, un bébé tiny à délivrer, un gâteau, etc.

Les fruits sont des bonus facultatifs. Mais attention, il faut toujours finir par la rainbow-ball, car le niveau se termine dès que vous la prenez. On aurait quelque chose du genre : 1 point par fruit, 5 points pour la rainbow-ball. Bien entendu, on reste fair-play : il est toujours possible de récupérer la rainbow-ball et tous les fruits d’un niveau donné, en une seule fois.

J’avais pensé à une progression à la Mario64. Le score global est égal à la quantité de points obtenus à chaque niveau. Lorsque ce score atteint certains seuils, des niveaux suivants sont débloqués. Ainsi, la progression n’est pas complètement entravée par des niveaux trop difficiles, et ça donne envie de refaire des niveaux pour lesquels on n’a pas obtenu le score max.

Niveau 4

Avec la présence d’un tiny bleu.

Je n’ai pas pris de décision définitive concernant son pouvoir. Pour ce niveau, il peut créer une infinité de bloc de glace. Il n’a pas besoin de boire d’eau. D’ailleurs, il n’y a pas d’eau dans le niveau.

Lorsque j’ai dessiné tous ces niveaux, j’avais leur solution en tête. Je peux vous garantir qu’il en existe une pour chacun d’eux, permettant à chaque fois de récupérer tous les fruits et la rainbow-ball.

Vous voulez rire ? Je n’ai pas noté les solutions ! À l’époque, je me disais que je parviendrais bien à les retrouver.

J’ai fait l’exercice pour le niveau 1, et après avoir galéré un peu, je l’ai re-résolu. Pour les autres, je ne vous garantis rien. Faudrait que je fasse l’effort.

Niveau 5

Le brouillon.

Et le niveau presque au propre.

Il n’y a pas de couleurs, et il n’y a pas la description détaillée des éléments. Dans mes souvenirs, les petits nuages à gauche sont simplement des arbres, équivalents à des murs. Entre deux arbres se trouve une fontaine. Un tiny bleu peut y prendre autant d’eau qu’il veut. Autour du tiny bleu de droite sont placées des bassines d’eau. Chacune peut être utilisée une seule fois, pour créer un bloc de glace.

Attention, le carré à côté du tiny du bas est un bloc de glace, et non pas un mur normal. Sinon, ilne peut même pas sortir de la salle !

L’Overworld

La notion d’overworld est commune à plusieurs jeux vidéos. À l’occasion, je ferais un article dessus. Il s’agit d’un monde englobant tout le jeu, vous vous y promenez pour accéder à différentes endroits ou niveaux.

L’exemple le plus emblématique que je connaisse est Secret of Mana. Vous appelez le super-dragon Flami et vous survolez la carte en mode set, pour vous rendre où bon vous semble. Quelques autres exemples jetés au hasard : Skyblazer, Commander Keen 4 & 5, Sam et Max, Super Smash Bros, Mandragore (sur TO7-70).

Pour l’overworld de mon super projet, je me suis inspiré de la carte générale du monde de Fury of the Furries. J’avais imaginé différentes zones sur la planète, on zoome dessus et on sélectionne un des niveaux. Ceux où le score max n’a pas été atteint s’affichent différemment, pour indiquer que ça vaudrait le coup de le retenter.

Mouais, c’est pas vraiment un overworld puisque le personnage ne se promène pas dedans. C’est juste un menu de sélection avec de la déco, voili voilà.

Qu’est-ce qu’on pourrait bien faire de tout ce bazar ?

À l’époque, ce projet me semblait pharaonique (et absolument génial, bien entendu). Je ne connaissais que le Pascal, le C++, et un peu de .NET. Je me disais que ça prendrait des années de tout coder : le système de jeu, les menus, l’interface, les interactions entre éléments, etc.

Maintenant que j’ai plus d’expérience, et surtout maintenant que j’ai Squarity, ça serait assez rapide de programmer une première version, avec quelques éléments simples, des dessins moches et des niveaux qui s’enchaînent linéairement. Mais est-ce que ça va intéresser des gens ? Là est la question.

Alors voilà ce que je vous propose. Vous me faites des petits commentaires d’encouragement dans cet article, vous me manifestez votre intérêt pour ce projet, et selon le nombre, je débloque des succès.

  • Pour un seul commentaire, je fais un autre article dans lequel je réécris les descriptions des éléments de jeu de mes feuilles. Je vous ajoute d’autres brouillons de niveaux, et je crée un niveau supplémentaire au propre.
  • Pour deux commentaires, j’essaye de retrouver les solutions des niveaux existants, je les décris dans un autre-autre article, et j’ajoute encore un niveau au propre.
  • Pour quatre commentaires, je crée des petites gifs animées montrant pas à pas les solutions des niveaux, et je commence à dessiner un tileset. À vous de juger l’intérêt de ce succès, par rapport à mes talents de dessins en pixel art.
  • Si on arrive jusque là, ce sera déjà un truc de ouf-ouf’, je réfléchirais alors aux succès suivants, jusqu’à éventuellement arriver à une version jouable dans Squarity. Il faudra aussi que je pense à mettre des tinies féminines. Le femwashing est à la mode.

Lâchez vos comm’s les zouavouilloux et les zouavouillettes !

Et l’image de femme ronde alors ?

Eh bien comme ce jeu fait intervenir des blocs de glace, il me semble approprié de mettre une photo de sculpture de glace représentant des seins.

En plus, ça permet de faire le jeu de mot « sein de glace / saint de glace ». Ha ha ha !!!

Tant pis si c’est même pas la période des saints de glace.

Une petite vidéo pour finir

(Sans femme ronde, désolé).

Je n’ai pas l’habitude de mettre des vidéos dans mes articles, je trouve que ça distrait par rapport au propos original, et c’est beaucoup moins souple que du texte et des images qu’on peut reprendre, copier-coller, corriger, rechercher, etc.

Aujourd’hui, nous ferons une exception, car elle vaut son pesant de poil de tinies.

Lors de mes recherches documentaires, j’ai échoué sur cette page, contenant un lien vers la vidéo ci-dessous.

Un reportage datant de 1992 sur le studio de développement Kalisto, qui a créé la série des jeux Skweek. Moi qui suis toujours un peu nostalgique, me voilà servi.

J’adore le passage où le chef demande au geek à cheveux longs combien de temps il lui faudra pour réaliser une première démo des musiques. Le geek répond à l’arrache : « dans une semaine ». Ça c’est de la gestion de projet de déglingouf’. J’ai eu l’impression de revoir Zarma.pro, l’ancienne boîte où je bossais (à Kalisto, les sujets de travail sont plus rigolos, quand même).

Bisous, et encore une fois, lâchez vos comm’s !

Pourquoi je crée Squarity ?

Lors d’une enième conférence de coaching en création de startuffe, un quelconque corporate-bullshiste officiel a dit : «start with ‘why’, not with ‘what’ or ‘how’».

Ce n’est pas ce que j’ai fait avec Squarity. J’ai starté with « on-va-d-abord-s-assurer-de-la-faisabilité-technique-de-l-idée », car compiler du python en live dans un navigateur web, c’était pas gagné d’avance. Maintenant que je suis à peu près sûr que ça fonctionne, je peux continuer with « why ».

Vous trouverez dans mon repository de doc le texte officiel détaillant ce why et les spécificités de Squarity par rapport à d’autres moteurs de jeux.

Il y a d’autres raisons, plus intimes, provenant de l’adolescent immature que je suis. Je ne les ais pas mises dans le texte officiel, car ça pourrait dérouter des personnes qui ne connaissent ni moi, ni Squarity.

Mais si vous êtes sur ce blog et que vous ne vous êtes pas encore enfui, il est fort possible que vous me connaissiez déjà un minimum, donc que mes bêtises plus intimes ne vous choquent pas. Ce qui nous amène à :

« Pourquoi je crée Squarity ? » version adolescent immature

Les raisons sont à peu près classées de la moins bizarre à la plus bizarre.

Puzzlescript

Le déclic a été provoqué par PuzzleScript. En découvrant cet outil, je me suis dit que son potentiel était énorme, mais qu’il manquait tous les à-côtés : un espace d’échanges, une doc plus fournie avec des exemples commentés, un système de débug plus élaboré, des tests unitaires, des vraies images pour les sprites, etc.

J’étais parti pour forker/contribuer au projet et apporter progressivement ces à-côtés. Mais je me suis aussi souvenu de cet article de Sam et Max, expliquant que créer des « Domain Specific Language » est souvent une idée à la con, et qu’il vaut mieux créer une API sur un langage existant (au hasard le python). Ce que je suis en train de faire.

Un DSL pour tous les serpents (pas que les pythons)

Anna Anthropy et ZZT

Souvenir de mes années collèges.

Je joue à Jill of the Jungle. Un petit readme publicitaire y est inclus, mentionnant le jeu ZZT et son éditeur de niveaux. C’est du mode texte, ce qui est techniquement cheap, même pour l’époque. Je remise ce souvenir au fond de mon cerveau pour un éventuel rappel ultérieur. Je passe à d’autres choses, principalement : mater les seins de mes camarades de classe.

Il y a deux ans, alors que l’idée de Squarity commençait à germer dans mon esprit, je tombe sur la collection de livres « Boss Fight Books ». L’un d’eux, écrit par Anna Anthropy, a pour sujet ZZT. Je me fait offrir ce livre pour mon anniversaire, dans le but de parfaire ma culture concernant les jeux dotés d’un éditeur de niveaux.

Je découvre Anna, les histoires qu’elle a traversées, son engagement pour la diversité culturelle et la fanzinicité des jeux vidéos, la foisonnance de mondes ZZT que des adolescents déversaient sur les serveurs BBS. Je me sens bizarre en lisant l’histoire de Drako et son « Edible Vomit », je me vois dans le trou qui aurait pu être comblé « if only you had committed more », j’ai une petite larmichette à la dernière page où elle se remémore avoir échoué à récupérer 5 symboles de Venus violets.

J’aimerais avoir le soutien de Anna Anthropy pour Squarity. Je n’ose pas la contacter pour l’instant, car le projet n’en est qu’à ses débuts. Plus tard, peut-être.

J’ai récemment fini « Caves of ZZT » et je m’attaque à « Town ».

Nostalgie de ma renommée Turbo Pascalienne

Au lycée, je créais des petits jeux et des animations en Turbo Pascal. Je vous en ais parlé, et j’ai publié une partie de ces vieux trucs.

Je les mettais sur des disquettes et les distribuais à mes potes. Ils trouvaient ça génial. J’ai donné des cours à certains d’entre eux. J’étais une putain de re-sta. Auprès d’une catégorie très restreinte de lycéens, certes, mais une putain de re-sta quand même.

Il faut donner le plus de moyens possibles aux ados actuels d’expérimenter la démarche de créer des choses en informatique et de les partager. Ce ne sera pas sous forme de disquettes ni de programmes Pascal, mais si ça peut être sous forme de jeux dans Squarity, ça me rendrait très heureux.

Renommée, renommée… Qui es-tu, renommée ?

Augmenter ma capacité à finir mes projets

Comme vous le savez, j’ai un historique créatif assez fourni : jeux, dessins, textes, … Cependant, mon ratio « projets vraiment terminés / projets envisagés » est très peu glorieux. Je ne me fais plus d’illusion, je sais maintenant que j’ai du mal à m’investir dans un projet personnel sur du long terme. Mes plus hauts scores ont été le dessin animé Pru-Pra-Prok et le jeu Blarg, qui ont chacun duré une année (pour un résultat hautement discutable). Ma participation au Magazine 42 a duré plus longtemps, mais je considère ça comme un enchaînement de petits projets, et non pas un seul gros.

Face à mes difficultés à rester motivé sur du long terme, j’ai logiquement décidé de me lancer dans un gros projet de long terme, dont la finalité est de m’aider à créer des petits projets de court terme, à savoir, des jeux dans Squarity.

Comment ça, c’est pas logique ?

L’hôtel Ryugyong : un projet pas fini, mais lumineux.

L’amour, bordel ! L’amour !

Souvenir de mes années lycées.

Je suis amoureux d’une fille. Je passe plusieurs mois à penser à elle sans rien oser faire. Puis je lui écrit une lettre d’amour. Une envolée lyrique classique, mais franchement pas dégueue. Avec le mot « princesse » dedans.

Sauf que je n’ose pas venir lui en parler. Je ne lui montre aucun signe d’intéressement. À tel point qu’elle se demande si ce n’est pas une blague, si ce n’est pas un crétin random qui a écrit cette lettre pour se foutre de ma gueule et/ou de sa gueule à elle.

Il faut que j’en parle à mes potes (ceux mentionnés précédemment, qui me considèrent comme une re-sta), mais même ça, je n’ose pas le faire.

Alors je crée un jeu, sur le même principe qu’Atomix, en 3D iso et avec plusieurs étages. Je place une lettre du prénom de mon amoureuse sur chaque étage, puis je construis un niveau à partir de ça (du level design de dingo !). Je montre ce jeu à mes potes, qui découvrent la vérité.

Quelques jours plus tard, j’envoie l’un des potes révéler à cette fille que ce n’est pas une blague et que je suis vraiment amoureux d’elle. Encore quelques jours plus tard, dans un ultime boost de courage, je vais moi-même lui parler. Comme vous vous en doutez, elle me congédie poliment.

On n’est pas sorti ensemble. Puis j’ai perdu les fichiers du jeu. À moins que je ne les ais consciemment effacés. Je ne sais plus.

Un jeu vidéo n’est qu’une solution parmi d’autres pour révéler un amour, directement à la personne concernée, ou par pote interposé. La seule solution dont j’étais capable à l’époque. J’aimerais que Squarity soit un moyen pour plein de gens d’exprimer plein de choses.

Elle était magnifique comme ça.

Ma dépendance à la création de jeux

J’ai une dépendance légère au jeux vidéos, mais aussi une dépendance à la création. Je suppose que ça provient de mon indécrottable désir d’auto-flattage d’égo, et peut-être aussi d’une certaine envie de pouvoir suprême. La première fois que j’ai compris le concept de la programmation (alors que je ne savais pas programmer), j’ai réalisé que ça pouvait faire de moi un Dieu. Un Dieu d’un monde limité à un écran, mais un Dieu quand même.

Alors j’ai pris tous les outils de création de jeux qui me tombaient sous la main et j’ai fait tout et n’importe quoi avec. J’ai …

  • dessiné des décors de Saphir,
  • fait de l’Ascii Art sur un TO7-70,
  • modélisé un début de château avec 3D Construction Kit,
  • créé un cosmo-shoot et un casse-brique-Metroidvania avec Klik’n Play (les sauvegardes se corrompaient toutes seules, ce logiciel est une arnaque),
  • architecturé des niveaux de Doom (la compilation plantait avec le message « nodes will be inaccurate », DoomCad est une arnaque),
  • organisé des enchainements d’événements improbables dans Incredible Machine,
  • produit une suite complète de niveaux de Logical,
  • bidouillé des maps de Warcraft 2,
  • imaginé un gigantesque jeu dans le style Tiny Skweeks, avec des dizaines d’éléments,
  • level-designé un niveau de Jama-Jama (jeu qui a disparu de l’internet),
  • raconté un début d’aventure épique dans Drod,
  • conceptualisé un langage universel permettant de formaliser des règles de jeu de Match-3,
  • programmé des jeux en Pascal, en Delphi, en C++, en python, en PuzzleScript, en slip, en fer, en enfer,
  • j’en oublie.

Alors voilà. Squarity est l’aboutissement de tous ces trucs, en même temps que le démarrage d’un tas d’autres trucs. Venez, on va s’amuser !

Tout a commencé dans une piaule de cet acabit.

Le serveur Discord de Squarity

Joyeuses fêtes. Comme d’hab’, le moment de Noël-Nouvel an est l’occasion d’avancer mes projets, because vacances, et c’est bien cool.

J’ai créé un Discord pour Squarity. C’est ici : https://discord.gg/D5SYnk8u3j .

Je m’en servirais pour publier les annonces de mise à jour. Il y a aussi divers espaces pour montrer les jeux que vous faites, poser des questions techniques, ou tout simplement parler de n’importe quoi.

C’est un début.

Si vous avez déjà un compte Discord, ce serait super sympa de venir, même si vous n’avez rien à raconter. Juste pour montrer qu’il y a des gens qui s’intéressent à ce projet.

J’ai également créé un compte sur un serveur mastodon, histoire d’avoir une bonne conscience auprès des libristes :
https://mstdn.io/@recher

J’annoncerai les mêmes choses sur le discord et sur mon compte mastodon. Vous pouvez vous raccrocher à un seul des deux, celui que vous préférez.

Hypothétiquement, il y aura un jour un vrai forum et des vrais comptes où on pourra enregistrer ses jeux, mais ça c’est pour une date indéterminée.

Un peu de couleurs pour finir l’année, avec Romekia Brown.

Iodification du python squaritien

Coucou ! Quatre fois n’est pas coutume, je viens encore vous parler de Squarity.

J’ai réussi à régler le problème de lenteur. J’ai lâché la librairie JS Brython, pour la WebAssembly Pyodide.

Argh, du code binaire !

D’aucuns-et-d’aucunes considèrent que les WebAssembly sont le mal absolu, car, tout comme le code binaire des fichiers exécutables, c’est non lisible par un humain. Ça va à l’encontre de l’un des dogmes du web, qui énonce que tous les composants d’un site doivent être analysables, même si cette analyse peut être compliquée. Le HTML, le javascript, le CSS, le JSON sont écrits avec des mots, et non avec des nombres. C’est en partie en raison de ce dogme que les navigateurs vont définitivement virer la technologie Flash.

J’oblige donc votre navigateur à exécuter du code que vous ne pouvez comprendre aisément, ce qui fait de moi un vilain.

Ce à quoi je répondrai : « Mouiimmpfboapf, ça va bien. Le code source de Pyodide est disponible sur internet. D’autre part, avez-vous tous les codes sources de tous les exécutables que vous lancez sur votre machine ? ». À mon avis, la seule personne qui peut vraiment le prétendre serait Richard Stallman.

(TODO : insérer ici une photo à poil de Richard Stallman, pour équilibrer par rapport à la quantité de photos de femmes rondes à poil qu’il y a dans ce blog)

Heuwargl, le chargement est lent !

L’exécution de code python dans un navigateur est plus rapide par Pyodide que par Brython. J’ai fait quelques benchmarks au doigt mouillé, en particulier avec le jeu Loops in Pool. La propagation de la boue et de l’eau sont maintenant beaucoup plus fluide.

Dans la version précédente de Squarity, j’avais testé avec un délai de 1 milliseconde entre chaque propagation, et c’était quand même lent. Alors j’ai mis 400 millisecondes pour ne pas surcharger la machine. Dans la nouvelle version, j’ai re-essayé 1 milliseconde, l’animation s’est accélérée significativement. Je l’ai laissé ainsi, youpi.

Cependant, l’initialisation de Pyodide est très lente. Il faut télécharger 20 Mo de bazar, alors que Brython tient en moins de 10 Mo (et c’est déjà beaucoup pour du javascript !). Ensuite, le navigateur doit interpréter et démarrer la WebAssembly, ce qui prend encore quelques secondes.

« Dans le monde dans lequel on vit », tout doit aller très vite. Une dizaine de secondes d’attente peut décourager certaines personnes. Ce choix de Pyodide me fera donc perdre une base potentielle de user-client-partner. Mais je préfère décourager définitivement un petit nombre, plutôt que ralentir continuellement tous les futurs fidèles qui utiliseront Squarity.

Je mettrai une barre de progress la plus précise possible. On accepte plus facilement d’attendre lorsqu’on voit un décompte qui avance. Actuellement, le progress n’est qu’une liste de 8 étapes, dont 6 sont pratiquement instantanées et 2 sont très longues. C’est pas du tout suffisant.

Prototype d’une barre de progress avec estimation de temps incertaine.

Si je pouvais éviter le re-téléchargement des 20 Mo une fois que ça a été fait, ce serait top. Je sais bien que le navigateur a un cache, mais celui-ci a une fâcheuse tendance à se vider. On a le droit de stocker des WebAssembly dans du local storage ?

J’ai également testé sur smartphone. Ça fonctionne (j’en n’étais vraiment pas sûr), par contre l’exécution reste super lente. Les fuckings millenials de la génération Ÿ écoperont des deux inconvénients : lent à l’initialisation ET à l’exécution. Je laisse comme ça pour l’instant, tant pis. De toutes façons, le premier truc à régler concernant l’utilisation sur smartphone serait le responsive design cradingue. Et dans un futur très lointain, on pourrait carrément imaginer une app.

Il suffira juste d’accepter le postulat qu’une app mobile exécutant du code python arbitraire ne constitue pas une faille de sécurité. Ha ha ha. Je ne suis même pas sûr de ce postulat concernant les sites web. Re-ha re-ha re-ha. Bref : y’a du boulot.

En tout cas, Pyodide est beaucoup plus simple à intégrer que Brython. Pour exécuter du python, j’ai une fonction à appeler, avec le code en paramètre. On peut directement lire/écrire les variables javascript, les exceptions python sont automatiquement remontées, avec traceback et message. J’ai tout ce qu’il me faut.

Avec Brython, je devais pré-placer mes variables d’échanges dans un truc à la con, mettre mon code dans une balise script, lancer une fonction sans paramètres, prier pour que la portée des variables ne se vautre pas toute seule, et lire les données de retour dans le truc à la con sus-mentionné. Je ne vous (re)parle même pas de la récupération des erreurs où j’ai eu recours à des astuces tellement tordues que mon cerveau a préféré les oublier !

Vive Pyodide. De plus, je ne désespère pas que dans quelques siècles, si l’humanité n’a pas entièrement crevé pour une raison quelconque, les navigateurs web soient nativement dotés d’un interpréteur python. Que l’on ait enfin une alternative sérieuse à ce javascript de merde.

L’ancêtre de Pyodide sur smartphone

Qui veut dessiner un beau tileset ?

Mon jeu-phare, les aventures de H2O, mériterait bien un petit coup de polish (dans le sens polissage, pas dans le sens polonais). Mais je ne suis pas un dessinateur assez doué pour ça.

Alors j’ai posté un message chez la communauté PixelJoint, pour leur demander qui serait assez gentil pour me redessiner le tileset de H2O, en mieux.

Je me suis fendu d’une explication détaillée de toutes les tiles.

Si vous élevez des pixels chez vous, n’hésitez pas à vous manifester sur le forum de PixelJoint. Il s’agit d’un concours en mode bisounours, dans lequel tout le monde gagnera. C’est à dire que je ne prendrais pas le meilleur tileset, mais je ferais une version du jeu H2O pour chaque tileset qui sera proposé.

Pour l’instant, je n’ai eu qu’une seule proposition, via message privé. Je peux m’en contenter, le pixel-artiste m’a fait un super boulot. Vous le verrez très bientôt lorsque j’aurais mis à jour le jeu.

Pour le bon plaisir de ce projet Squarity, j’ai dû me créer un compte Twitch, un compte Ludum Dare, un compte GoDaddy, un deuxième compte pythonanywhere et maintenant un compte PixelJoint. Tellement populaire, tellement social.

Il y a de jolies choses sur PixelJoint

À propos de social

L’une des prochaines grosses étapes de Squarity sera de créer un lieu d’échange et de contenu. Ça me permettra de recenser les jeux existants, de publier les release notes, d’ajouter des articles et des tutoriels, d’aider les codeureuses en herbe, etc.

Je ne sais pas encore sous quelle forme je ferai ça. Le plus simple serait un serveur Discord, mais j’aimerais éviter d’être trop dépendant d’un réseau social existant, quitte à payer un petit peu. Peut-être que ça se finira avec une instance Mastodon et un CMS à l’arrache.

Mais j’aimerais aussi éviter d’obliger les gens à se créer un enième compte sur un enième site. J’essaierais peut-être d’intégrer des authentifications tierces : les boutons « sign in with Google », « sign in with Github », etc.

Bien évidemment, je ne connais pas grand chose dans ce domaine, ça risque donc de me prendre du temps et d’être un beau bordel. On verra bien. Peut-être que dans trois semaines, j’écrirais un article de blog larmoyant expliquant que c’est trop compliqué, que j’abandonne tout, et que je préfère encore utiliser tout mon temps libre à zapper en continu sur Twitch.

(TODO: insérer ici une image prise sur Twitch de gens pixelisés déguisés en serpent qui font passer des arcs électriques dans de la vapeur d’eau pour voir si ça la disperse et qui ensuite font de la peinture sur corps).

À propos de corps

Petit rattrapage de tous les précédents articles n’ayant pas d’images de femmes rondes.

Voici Nicole Nurko, dont je vous ai précédemment parlé :

Ainsi que Kim Manana :

Et la sublime-bling-bling Gabriella Lascano :

Pro-tip : lorsque vous voulez parcourir un compte Instagram (d’une femme ronde ou pas) et que vous ne voulez pas vous inscrire car, comme dit précédemment, vous en avez marre de vous créer des comptes de partout, vous pouvez remplacez dans l’url « instagram.com » par « imginn.com ». Vous aurez toutes les photos sans les pop-ups lourdingues.

À la chopraine, comme on disait dans les années 1990.

Classement Ludum Dare et presque un jeu de Soko-punk

Ludum Dare

Voici mon classement au Ludum Dare.

Il y a eu 800 participations dans la catégorie « Compo ». Une trentaine de personnes ont noté mon jeu.

  • Overall: 513ème
  • Fun: 426ème
  • Innovation: 144ème
  • Theme: 530ème
  • Graphics: 578ème
  • Humor: 438ème
  • Mood: 545ème

Pour une première participation, c’est pas si mal. Je suis assez content de mon classement en « Innovation ».

Manifestement, le jeu de mot dans le titre du jeu : « Loops in Pool » n’a pas vraiment fait décoller mon classement en Humour. On fera mieux la prochaine fois.

Presque Soko-punk

Et voici un lien vers le jeu que nous avons créé en live mercredi soir.

Il est pas fini, mais ça fait quand même des trucs. Il faut imaginer que l’héroïne que vous dirigez n’est pas censée pouvoir passer dans des éclairs.

Du Sokoban-like dans une ambiance Steam Punk.

Le but est d’électriser toutes les boules, mais vous n’êtes pas obligé de toutes les connecter ensemble dans un même graphe connexe. Lorsque le but est atteint, il aurait dû y avoir un petit « print » pour dire bravo, et un passage vers un hypothétique niveau suivant.

Une fois de plus, je me suis heurté à la lenteur de Brython. Dans mon code, j’avais un double parcours imbriqué de toutes les tiles du jeu, pour vérifier quelles boules doivent être électrisées. Rien que ça, ça mettait quelques secondes.

J’ai arrangé le code pour que ce soit plus rapide. Mais cette lenteur pose de plus en plus problème, même pour des jeux que j’aurais cru simple. J’ai peut-être une piste pour régler ça, je vous en reparle quand je l’aurais testée, c’est à dire dans un délai non défini.

À nouveau, pas d’image de femme ronde. Désolé. Je me rattraperais au prochain article. En attendant, vous pouvez chercher « yathbeauty » sur Twitter, TikTok et instagram. Très jolie, et elle sait comment se tenir pour nous faire profiter de ses atouts.

Twitch ce mercredi à 22h !

Gzolb les prolos.

Petit article très rapide, juste pour dire que mercredi 28 octobre, à 22h, je streame sur twitch. On créera un petit jeu sur Squarity, en live.

Ça se passera par ici : https://www.twitch.tv/recher_squarity

Oh, et sinon j’ai trouvé le moyen d’afficher les messages d’erreur et la traceback quand le code python plante. Ce sera mis en prod d’ici mercredi, ce qui me permettra de beaucoup moins galérer.

Pas d’image de femme ronde parce que c’est vraiment un tout petit article. Mais si vous voulez prospecter par vous-même, tapez « Nicole Nurko » dans un moteur de recherche.

Ludum Dare 47 post-codem

Comme annoncé dans mon précédent article, j’ai participé au Ludum Dare. Vous pouvez jouer à ma contribution directement par ici.

La tradition dans les game jams est d’écrire un « post-mortem », c’est un petit (grand) texte que l’on écrit à tête reposée après avoir bossé comme un oufzor pendant tout un week-end à créer un jeu.

Je trouve l’expression « post-mortem » étrange. Je ne suis pas mort, même si ça a été assez intense et que j’en suis sorti fatigué. Donc : « post-codem ».

Fonctionnement du jeu

Les premiers retours m’indiquent que c’est difficile à prendre en main au départ. J’ai donc fait une petite vidéo de démo explicatoire. J’y parle anglais, c’est une catastrophe. Vous avez le droit de mettre en mute.

L’aire de jeu est une piscine qui se recouvre entièrement de boue et de lierre (les petits traits verts). Vous sélectionnez une première case, en appuyant sur le bouton « 1 », puis vous en sélectionnez une deuxième, et elles s’échangent. Le but est de construire, par échanges successifs, des boucles fermées de lierre, ce qui déclenche la suppression de la boue qui est à l’intérieur.

Il faut commencer par créer une boucle à côté de la fontaine d’eau en haut à gauche. L’eau avance lorsqu’elle est en contact avec une zone sans boue. Vous devez la propager petit à petit jusqu’à l’arrivée en bas à droite.

Vous ne pouvez pas échanger une case si elle n’est pas unie, c’est à dire ayant un mix de boue et d’eau. C’est gênant lorsque vous avez deux boucles proches : vous ne pouvez pas créer de mini-boucle entre les deux pour les fusionner. J’ai donc ajouté un pouvoir spécial, lorsque vous activez le bouton « 2 » sur une case comportant de la boue, un trait vert se rajoute, qui peut vous permettre de finaliser une boucle.

Par le pouvoir du lierre !!

Post-codem au sujet du jeu

Le thème était : « Stuck in a Loop », c’est à dire : « Coincé dans une boucle ».

Il y a deux modes de participation au Ludum Dare :

  • Jam : vous avez 3 jours pour créer un jeu vidéo, en équipe ou en solo. Vous pouvez réutiliser des images, des sons et des codes existants (en respectant les licences et autres fucking copyright, évidemment).
  • Compo : c’est le « hard mode ». Vous n’avez que 2 jours, en solo. Tous les éléments de votre jeu doivent être originaux et doivent avoir été créés durant ces 2 jours. Obligation de partager le code source. Mais vous pouvez utiliser des outils de création privatifs (Unreal Engine, par exemple).

J’ai choisi compo. C’est pas que je veuille me la péter en démarrant directement en hard mode. C’est juste que j’avais mon week-end de dispo, mais pas le lundi après. Et les autres contraintes de la compo me convenaient.

Bien entendu, je n’ai pas eu le temps de réaliser toutes les idées que j’avais. Ça arrive à chaque projet (artistique ou non). Comme c’est systématique, on sait à l’avance qu’on ne pourra pas tout faire, on peut donc diminuer ses prétentions dès le départ. Mais même ainsi, les prétentions restent trop grandes, et on finit toujours par finir à l’arrache.

Ouais, à la

Comme dirait Helmut : voilà un jeu de mot franco-allemand qui Kohl très bien à l’article.

Échec de la continuous delivery

J’ai tellement galéré à coder (j’explique pourquoi dans le dernier chapitre de cet article), que ce n’est que le dimanche à 12h que j’ai eu une version pre-pre-alpha, comportant uniquement la fonction d’échange et la détection des boucles.

Note pour les prochains Ludum Dare : se réserver des petites plages de temps pour tester et faire tester son jeu par des gens quelconques. Ça permet d’ajuster la difficulté et éventuellement de glaner de nouvelles idées.

Ce que j’avais imaginé au début : coder un petit bout de truc, le montrer aux gens qui vivent avec moi, même si ça ne constitue pas un vrai jeu, montrer le bout de truc suivant, et ainsi de suite. On aurait avancé tous ensemble durant le week-end, ces mini-démonstrations régulières auraient permis de me faire pardonner le fait que je me serait comporté en geek pendant 48 heures.

Au lieu de ça, j’ai passé les trois premiers quarts du week-end à grogner devant mon ordinateur. Lorsque quelqu’un venait me voir, je lui grognais que rien ne marchait. Pas très interactif.

Groumpf ! A marche pô !

Échec de l’explication du mécanisme du jeu

J’avais prévu de faire un petit tutoriel, qui s’est terminé en un pseudo-manuel écrit en 20 minutes, sous forme de docstring au début du code python. J’ai ensuite pseudo-copié-collé ce manuel pour le mettre dans la description Ludum Darienne.

Ça n’aide pas trop à comprendre le fonctionnement du jeu quand on le découvre. D’où la petite vidéo que j’ai faite après. Qui est elle-même créé à l’arrache, mais ça c’est parce que j’ai très peu d’expérience dans ce domaine. Je cause très mal anglais alors que d’habitude en vrai conversation je m’en sors potablement. De plus, on m’entend prendre de grandes inspirations avant chaque phrase. C’est malaisant.

Même la longueur de la vidéo est une erreur. J’explique tous les mécanismes du jeu durant les 4 premières minutes, puis je passe 6 minutes à terminer ma partie. Lorsque les ordispectateurtrices-joueureuses arrivent sur ma page Ludum Darienne, ces personnes voient une vidéo ayant une durée de 10 minutes. Elles ne la regardent pas forcément, parce que c’est trop long. Si la durée affichée avaient été plus courte, il y aurait eu plus de chances qu’elles cliquassent sur « play », parce que gâcher 4 minutes de sa vie dans notre monde actuel est quelque chose d’encore à peu près acceptable. Ce serait d’ailleurs intéressant de connaître la probabilité de clic sur un bouton « play » en fonction de la durée d’une vidéo, mais ce n’est pas le sujet.

Les graphismes sont manifestement beurkys. Les explications du jeu utilisent le terme « vines » (du lierre), il faut comprendre que ça correspond aux traits verts. Ces traits sont une représentation métaphysique aristotélicienne du lierre quand on n’a pas eu le temps de le dessiner correctement.

Possible échec de la promotion de Squarity

Cette participation au Ludum Dare, et les futures participations à d’autres game jams, n’ont pas pour but de créer un jeu génial qui sera premier au classement et restera dans la mémoire de l’humanité (même si ça me plairait bien). Le but est de promouvoir Squarity.fr, ma plate-forme de création et partage de jeux.

Je veux provoquer chez les Ludum Daristes une réaction de type :

« Voyons voir ce jeu… Moui bof. Pas génial.

Oh, mais quelle est donc ce site web étrange… Squarity ? Mais que vois-je dans la partie droite ? Une fenêtre de texte avec du code python dedans, et d’autres informations qui semblent définir le jeu auquel je suis en train de jouer !

Que va-t-il se passer si je change des trucs et que je clique sur le bouton de validation en-dessous ? Oh bon sang ! Le jeu se modifie instantanément ! Ce site est génial ! Je vais de ce pas m’en servir pour créer tous mes prochains jeux. Je participe au Ludum Dare, c’est bien que je veux créer des jeux pour le restant de ma vie !

Mon avenir sera squaritien ou ne sera pas ! »

Pour provoquer une telle réaction, il faut bien entendu que Squarity soit amélioré (ce qui se fera progressivement), mais la moindre des choses aurait été que je commente mon code python, afin d’aider le monde à comprendre son fonctionnement, et par là même le fonctionnement de Squarity.

J’ai échoué sur ce point, mon code est cradingue et très peu documenté. J’essayerais d’arranger ça dans les jours à venir. Et puis je voulais aussi créer un mini-jeu tutoriel de Squarity. Tant de choses à faire, comme d’habitude…

Les carrés sont l'avenir du monde

Succès de la fontaine !

J’avais prévu d’afficher la quantité de mana sous forme d’une jauge dans un coin de l’aire de jeu. Mais en me levant le dimanche matin, j’ai eu une idée géniale : Squarity ne permet que d’afficher des images, mais la transparence est gérée. Lorsque le mana est bas, je peux noircir la fontaine en superposant plus ou moins de pixels noirs transparent dessus !

Pas besoin de perdre de temps à dessiner une jauge de mana et à coder des choses compliquées pour l’afficher. Avec 4 lignes de code dégueux et un seul sprite supplémentaire (créé rapidement à partir du sprite de la fontaine, en mettant tous ses pixels en noirs-transparents), j’avais un indicateur de mana bien mieux intégré dans le jeu.

Pour fignoler le tout, j’ajoutais un petit log indiquant la quantité exacte de mana lorsqu’on sélectionne la fontaine.

À droite de la fontaine se trouve l’image correspondant à son « ombre ».
if self.pool_mana < 100:
    nb_fountain_darking = (100 - self.pool_mana) // 5
    for _ in range(nb_fountain_darking):
        gamobjs.append("darkfountain")

Je vois aussi cette fontaine comme un très très lointain clin d’œil à l’un de mes jeux préférés intemporels et intraspatial : Might and Magic – World of Xeen.

Alamar, you misguided mechanism ! You’ll destroy us all !

N’ayant pas peur de faire de la surenchère, je rajoutais un autre lointain clin d’œil à World of Xeen : dans le pseudo-scénario de mon jeu, le personnage de la « Countess du Swagging » est une référence au mot de passe secret « Count Du Money ».

Cette fontaine est un auto-clin d’œil, puisque c’est le logo de New World Computing

Si jamais je continuais le dev de ce jeu

Je note ici toutes les idées que je pourrais rajouter dans une hypothétique version post-ludum.

Faciliter le début en pré-plaçant du lierre

Si on n’a pas de bol, on commence comme ça :

Peu de lierre partent de la zone d’eau. Pour y coller des boucles, on risque d’être obligé d’utiliser le pouvoir d’ajout de lierre. Or c’est un pouvoir qui coûte assez cher en mana, car on ne devrait normalement l’utiliser qu’en dernier recours.

J’aurais dû ajouter automatiquement quelques connexions partant de la zone d’eau. Quelque chose comme ça :

C’est beaucoup plus facile de tracer un chemin depuis le trait vertical qui est sous la zone jusqu’au trait diagonal, ou bien depuis le trait horizontal à droite jusqu’au trait diagonal, et ainsi créer une première boucle sans s’arracher les cheveux.

Une « learning curve » moins violente

Il faudrait ajouter des niveaux. Les premiers seraient rendus plus facile par :

  • un tutoriel,
  • des maps plus petites,
  • des délimitation de cases plus marquées,
  • l’absence de traits diagonales.

J’ai eu beaucoup de remarques au sujet des délimitation de cases. Les gens analysent la map, repèrent une case qui leur convient, et s’aperçoivent ensuite que ce n’en est pas une mais que c’est 4 coins de 4 cases différentes. J’avais fait exprès de brouiller les limites entre les cases parce que je trouvais ça cool et j’aime créer des choses difficiles pour ensuite prendre un air condescendant auprès des gens qui n’y arrivent pas. Mais peut-être que j’ai overkillé.

Alors que les grands comédiens gomment les coupures entre vers lorsqu’ils déclament des alexandrins, je gomme les coupures entre cases lorsque je crée des jeux grid-2D.

J’embroche vos rimes, mon épée vous tru-Cid.

Un monde ouvert

Il y aurait une aire de jeu plus grande que ce que peut afficher l’écran. On ne pourrait pas scroller partout. On aurait un personnage et le scroll serait limité autour de lui. On pourrait déplacer ce personnage uniquement vers une case recouverte d’eau. Pour progresser dans le monde, il faudrait donc faire des boucles et propager l’eau petit à petit.

Par contre, ça gâcherait un peu si on permet de faire des boucles géantes, et surtout il y aurait le risque que le temps de calcul de vérifs des boucles soit trop long. Donc il faudrait limiter les tailles de boucle. Ce qui pourrait être sujet à des bonus : au début on ne peut faire que des boucles ayant une longueur de 5, puis 6, puis 7, etc.

Bien entendu, ce grand monde ouvert serait truffé de bonus, de mana, de sorts et de pouvoirs à gagner. Pour récupérer quelque chose, il faudrait amener son personnage dessus, donc l’entourer avec une boucle.

Et puis des passages secrets et des zones super compliquées à atteindre. Par exemple un grand couloir de 3 cases de large avec un super bonus au bout.

Je voulais aussi faire une super blague, avec un genre de quête annexe. Une map où l’objectif serait à côté du point de départ, mais il y aurait un grand mur entre les deux. Il faudrait faire tout un détour pour l’atteindre. À la fin, le personnage aurait dit : « j’ai du créer toutes ces boucles de lierre juste pour parcourir une grande boucle qui me ramène à mon point de départ ! WTF ? ». Haha, lolilol potentiel.

D’autres idées en vrac

L’échange entre une case de boue et une case d’eau ne coûterait pas de mana, mais ne ferait que déplacer les lierres de l’eau sur la case de boue. On perdrait les lierres de boue. Ça nettoie la piscine et ça encourage à étendre l’eau le plus possible, pour conquérir des lierres qu’on pourra ensuite placer gratuitement.

Des statistiques :

  • longueur & surface de la plus grande boucle réalisée,
  • nombre de boucle créées en une seule action,
  • maximum de mana atteint,
  • rentabilité (mana gagné / mana dépensé),
  • nombre de case d’eau créées,
  • etc.

Et bien sûr, des achievements et des bonus liés à ces stats.

Des robots

Quand on fait une boucle, ça ne supprime pas immédiatement la boue. Il faut poser des petits robots nettoyeurs qui enlèvent la boue autour d’eux. Ils fonctionnent pendant un temps limité. Donc si on les pose sur une boucle trop grande, ils ne nettoieront pas tout et la boue se repropagera dans la boucle. Si on les pose sur une boucle plus petite, ils nettoient tout, la boue ne se propage pas car elle ne peut pas traverser les lierres. On peut alors déclencher la propagation de l’eau vers la boucle nettoyée.

C’est une idée qui reste à finaliser. Parce qu’actuellement, l’eau peut passer à travers le lierre. Donc si on commence à nettoyer une boucle avec des robots, l’eau peut alors se propager tout de suite dans une boucle dont le nettoyage n’a pas été terminé, et ça peut donner n’importe quoi.

Ou alors on dit que l’eau ne passe pas le lierre. Et on doit enlever manuellement le lierre qui sépare l’eau de la boucle nettoyée. À réfléchir si on a envie.

Je laisse cette idée là où elle est, j’ai peur d’avoir embrouillé tout le monde en la décrivant.

Robot nettoyant la boue (à moins que ce soit l’inverse)

Post-codem concernant Squarity

Voici maintenant mes retours en tant que simple utilisateur/créateur de cette plate-forme de jeu.

Les messages d’erreur, rogntudjuu !

Comme l’a si bien dit 10kbis en commentaire de mon précédent article, il faut les messages d’erreur et les tracebacks !

Quand le code du jeu plante à l’initialisation, le message s’affiche comme il faut dans la console du navigateur. Mais quand ça plante pendant l’exécution d’une callback, on a que d’alle. On ne sait pas où ça a planté, ni pourquoi. Je n’ai pas encore pris le temps de régler ce problème.

Je pensais être capable de coder du python sans visibilité sur les messages d’erreur. Je m’étais dit : « je suis super fort, et au pire, je pourrais toujours débuguer à coups de print ».

Débuguer à l’aveugle, c’est ce que j’ai fait pendant tout le week-end. C’est la raison pour laquelle je n’ai eu une version pre-pre-alpha que très tard. Ça m’a aussi mis de sérieux doutes sur ma capacité à sortir quelque chose de jouable avant la fin.

J’avais prévu, après le Ludum Dare, de me poser un peu concernant le dev, faire un semblant de road-map, nettoyer et documenter un peu mon code. Mais là, nope. Avant de faire tout ça, il faut que je règle cette non-gestion des erreurs.

Bien. Il me reste 12h pour faire tout le reste et j’ai pas encore mangé.

Ajouter les événements de clics de souris

Je m’étais promis que pendant le Ludum Dare, je m’occuperais uniquement du jeu, sans mettre à jour le site Squarity. Je voulais prouver que la présente version est suffisamment aboutie pour créer un jeu, même très simple, même avec beaucoup de galère.

Puis j’ai réalisé que Loops in Pool serait beaucoup plus pratique si on pouvait directement cliquer sur les cases. Alors j’ai décidé que je ferais une entorse à ma promesse et que je rajouterais à la va-vite la gestion des clics dans Squarity.

Finalement, je n’ai pas du tout eu le temps de faire ça. Je suis donc parvenu à être suffisamment à l’arrache pour tenir ma promesse. Youpi !

Ayez l’amabilité de bien vouloir gérer ce mulot, mon brave.

Ça peut être très lent

Exécuter du python dans un navigateur web, c’est lent. Je m’en doutais un peu, mais je ne pensais pas que ça se révélerait dès maintenant.

Lorsqu’on échange deux tiles, il faut attendre une ou deux secondes avant de pouvoir faire autre chose. C’est le temps pour vérifier si l’échange a créé une boucle ou pas. On exécute pour cela un algo pourri de Dijkstra sur 2240 pauvres petits nodes. Ça devrait se faire instantanément, or ce n’est pas le cas.

C’est pour ça que la boue se remplit progressivement au début. Si je calculais toute la propagation dès le départ, ça prendrait vachement de temps et on pourrait croire que le jeu ne marche pas.

Heureusement, quand on fait des jeux simples nécessitant peu de traitement, il n’y a aucun problème, le jeu du magicien et H2O en sont des preuves. Mais il ne faut pas trop abuser.

Je n’ai pas de solution miracle pour ce problème, juste des pistes :

  • Faire des tests de performances, en déduire des manières de coder plus rapide que d’autres et les documenter dans des bonnes pratiques. Je suppose que le python dans un navigateur se code et s’optimise différemment par rapport au python normal.
  • Essayer de faire des traitements parallèles ou asynchrones. Je ne sais même pas si on peut faire ça proprement dans un navigateur web, que ce soit en javascript ou en python.
  • Mesurer en live les performances du code, pour repérer les parties de code les plus ralentisseuses.
  • Optimiser l’affichage. Au lieu de redessiner toutes les tiles à chaque fois, on en marque certaines comme « dirty ». Seules celles-là seront redessinées. Mais, je ne suis pas sûr que ça améliore grandement la vitesse.

D’autre part, j’ai fait une modif qui me semble cool : j’ai redirigé les print. Normalement, ils vont dans la console du navigateur. Moi je les affiche dans la zone de texte en bas à gauche. Figurez-vous que ça aussi, ça ralentit tout. Faites une dizaine de print à chaque appui de bouton : ça devient horrible, même dans un jeu simple.

Je ne sais pas pourquoi. Est-ce que le navigateur doit recalculer tout le DOM à chaque fois qu’on écrit dans un élément <textarea> ? Ce serait embarrassant. En attendant, l’effet de bord est très amusant : le seul moyen actuel de débuguer est de faire des prints, mais les prints ralentissent tout. Bon courage !!!

Je ne parviendrais peut-être pas à régler ce gros défaut de lenteur, ce qui risque de bloquer des créateurtrices potentieleulleux dans la réalisation de leurs jeux.

Ça ne me fera pas abandonner ce projet, ni déroger de mon idée principale : créer et partager des jeux 2D en python dans un navigateur web. C’est ce que je veux faire, et plus que ça, c’est aussi ce que j’ai envie d’avoir. Je veux utiliser mon propre outil pour créer une foisonnance de jeux bizarres/amusants/pulpesque/dérangeants/moches/etc. Bref, des jeux que je veux voir exister.

Un jeu « pulpe-zinesque » créé par Anna Anthropy, dont je vous parlerai à l’occasion

Autres trucs-en-vrac

Il faut des sons et de la musique. C’est prévu, mais les conseils que j’ai pu récolter à l’occasion du Ludum Dare me confirment que c’est très important pour se démarquer. Si j’avais pas un tas de choses déjà prioritaires, je prioriserai les sons.

Les images des objets ne peuvent pas déborder de leur tile. On peut faire sans, mais pour dessiner un trait qui rejoint deux tiles en diagonale, il faudrait pouvoir placer quelques pixels sur les tiles diago-adjacentes. Ça mériterait un petit dessin pour vous expliquer, mais là, pfouf, cet article est déjà bien assez long.

L’image de tileset devrait pouvoir être uploadée depuis le disque en local, dans le navigateur (en local aussi, du coup). Actuellement, il faut publier l’image sur un site d’hébergement, et ce à chaque changement. Même si on ne souhaite pas publier son jeu. C’est relou. En ce qui me concerne, je met l’image dans un repo github. Mais les push d’images dans github ne sont pas instantanément mis à jour dans leur site web.

Tôt ou tard, il me faudra un lieu d’échange et de création de contenus autour de Squarity (articles, documentation, tilesets, jeux, …). Je me permettrais de commencer par un tout petit truc. Mais il me le faut vraiment ce petit truc, car actuellement j’ai rien du tout, à part des comptes sur des rézosociaux « annexes », comme ce blog. Or, ces comptes n’ont pas pour utilité principale de décrire Squarity. Il va falloir que je me lance dans un mini-CMS Django, et/ou une instance Mastodon, ou autre chose de mieux si vous avez une idée.

Rappelons que l’utilité principale de ce blog est de vous faire découvrir des images de femmes rondes. Ceci ne va pas changer de sitôt. À ce sujet je vous présente llindaa23

À la prochaine, je me remet sur mon code et mes gestion d’erreurs.

Démarrage d’un gros projet complètement à l’arrache !

Ce que j’avais prévu

1 : Faire les fonds de tiroir de mes activités créatives, packager proprement les trucs qui méritent de l’être, même ceux qui ne sont pas finis. C’est ainsi que vous avez eu Blarg sur github, Kawax, Pru-pra-prok, l’archivage de tous les articles du magazine 42, L’animation du tunnel pour l’UTBM, une grosse série d’article concernant mon dernier changement de crémerie, et tout un tas d’autres machins.

2 : Terminer en packageant mes très vieux programmes Pascal que j’écrivais au lycée et à l’UTBM, et les mettre à disposition ici.

3 : Écrire un article de blog émouvant dans lequel j’explique que je me sens prêt à démarrer un gros projet créatif. Expliquer que ça fait un peu peur, que jusqu’à maintenant, le peu de projets que j’ai réussi à mener jusqu’au bout étaient soit de taille moyenne, soit une succession de mini-projets (par exemple, tous les articles pour le magazine 42). Ajouter qu’il est fort possible que j’abandonne au bout de deux mois pour cause de découragement honteux, ou pour cause de découverte d’une toute nouvelle idée que je croirais encore meilleure. Terminer l’article en demandant à mes lecteurtrices, avec des trémolos dans la voix, quelques commentaires de soutien pour ce nouveau projet, même si je ne l’ai pas du tout décrit pour le moment. Insister sur le fait qu’un soutien inconditionnel de leur part serait une magnifique démonstration de fidélité, rappeler (toujours avec des trémolos) que ce blog existe depuis plus de 10 ans et que certains d’entre vous me suivent depuis plusieurs années.

4 : Espérer deux ou trois commentaires de soutien, pas plus, pour ne pas être déçu.

5 : Travailler pendant un mois ou deux sur ce projet secret.

6 : Écrire un nouvel article, montrer la première version du projet même si elle est bancale. Expliquer que c’est une plate-forme de création de mini-jeux web en 2D sur une grille. Annoncer qu’il suffit de savoir coder un peu en python pour créer des premières choses toutes simples. Ajouter qu’il n’y a pas besoin d’installer de logiciel ou de s’inscrire (mais il faut quand même un compte github pour partager ses jeux). Arguer du fait que, même si la plate-forme est simple, sa souplesse permettrait de créer des jeux très variés tels que des Match 3, un Laser Tank, voire des jeux de stratégie comme Advance Wars. Préciser tout de même qu’il ne sera jamais possible de placer des objets à cheval entre deux cases de la grille, que c’est un choix conscient destiné à assurer la simplicité. Donner l’exemple de Zelda sur la NES, qui ne serait pas recréable sur cette plate-forme puisque le personnage peut se trouver entre deux cases. Terminer sur un ton faussement humble en disant que je me suis inspiré de PuzzleScript, Drod et même ZZT.

7 : Écrire une doc, pas forcément complète ni bien peaufinée, mais qui expliquerait au minimum comment créer et partager des jeux. Espérer que quelques personnes commencent à s’y mettre, même si c’est rustique et pas du tout ergonomique dans un premier temps.

8 : Améliorer encore le projet pendant quelques mois.

9 : Participer au Ludum Dare (une compétition de création de jeu en un week-end). Ne pas s’attendre à un glorieux classement, mais utiliser cette participation pour montrer la plate-forme au plus de gens possible.

10 : Éventuellement, créer une vidéo ou un stream sur twitch montrant la genèse du jeu créé pour le Ludum Dare. Utiliser cette vidéo comme tutoriel et comme démo de ce qu’il est possible de faire.

12 : Donner rendez-vous aux prochains Ludum Dare, tous les 6 mois. Indiquer que l’on profitera de ces compétitions pour s’imposer des dead lines fixes, qui devraient apporter la motivation nécessaire pour produire régulièrement de nouvelles versions de la plate-forme.

13 : Continuer comme ça sur plusieurs années, et voir jusqu’où ça nous mène.

Pour l’instant, ça mène ici.

Ce qu’il s’est réellement passé

1 : Réaliser qu’il n’y a plus que quelques mois avant les grandes vacances, et qu’on aimerait avoir une première version du projet à ce moment là.

2 : Laisser en plan le packaging des vieux jeux Pascal.

3 : Réaliser une première version ultra à l’arrache de la plate-forme, afin de pouvoir la montrer aux potes qu’on retrouvera pendant les vacances.

4 : Ne pas oser parler de ce projet aux potes en question, parce que l’occasion ne s’est pas présentée et que j’ai toujours l’impression de passer pour un mendiant quand je quémande de l’attention aux gens, même quand c’est mes potes.

5 : Continuer de bosser sur le projet, pester intérieurement que, comme toujours, ça avance trèèès lentement.

6 : Au passage, créer une chaîne twitch et s’amuser à streamer des Clash of Code, même si ça n’a absolument rien à voir avec la choucroute.

7 : Réaliser que le prochain Ludum Dare est dans à peine quinze jours, que la plate-forme est à peu près utilisable mais pas du tout documentée, qu’on n’aura pas forcément le temps de la documenter d’ici là, et qu’on n’a rien annoncé pour l’instant.

8 : Jeter à la gueule de ses lecteurtrices le lien vers la plate-forme : http://squarity.fr.

9 : Leur jeter un autre lien à la gueule, en croyant que ce sera suffisant pour comprendre comment créer et partager des jeux : squarity.fr#fetchez_githubgist_darkrecher/bd49300f9c480b789a70315155571e9d/raw/gamecode.txt

10 : Espérer que l’on arrivera à faire quelque chose de pas trop pourri pour le Ludum Dare.

11 : Continuer comme ça sur plusieurs années, et voir jusqu’où ça nous mène.

Pour conclure, inévitablement

12 : Expliquer que le mot « squarity » signifierait « la carrétitude », puisque les jeux sont créés sur un quadrillage en 2D. Ajouter que le fait d’aimer les carrés n’empêche pas d’aimer aussi les courbes. Pour illustrer ce propos, insérer une image de Myesha Boulton :

13 : S’endormir sur son clavier parce qu’il est tard.