16 Couleurs

16 Couleurs – graphisme & jeu vidéo


2 Commentaires

Revision 2019 : lutins musiciens et auto-mitrailleuses

J’ai cette année fait le déplacement pour la Revision, la grand-messe de la demoscene qui attire 700 ou 800 personnes à Sarrebruck chaque année pendant le week-end de Pâques.

Ne voulant pas venir les mains vides, j’avais  prévu de présenter un graph oldschool, un graph « moderne », et un GIF animé. Objectif un peu trop ambitieux puisque du fait du manque de temps le GIF animé a dû passer à la trappe.

Life and Death of a Gnome, 320×256 32 couleurs

Ma contribution à la compétition Oldskool Graphics fut Life and Death of a Gnome, petite scène bucolico-fantastico-aigre-douce, une sorte de The Den version mais plus sombre pour annoncer l’approche de l’été. Côté technique, c’est exactement les caractéristiques de l’Amiga 500 avec une résolution de 320×256 pixels en 32 couleurs choisies parmi une palette de 4096, le tout entièrement réalisé sous Grafx2 si on exclut le croquis de départ sous Photoshop. Le tout représente une quinzaine d’heure de travail dont le dernier tiers dans des conditions un peu chaotiques à la Revision. L’image a terminé 4ème dans la compétition Oldskool Graphics.

Can’t Stop, Won’t Stop

Toujours à la pointe du progrès, j’ai aussi présenté une image dans la compétition Modern Graphics (une catégorie un peu fourre-tout qui regroupe images 2D, 3D et dessins et peintures sur papier) : Can’t Stop, Won’t Stop. Le travail a ici été effectué avec Blender, Photoshop et Leonardo. L’image a souffert d’un manque de temps assez évident mais je pense que ce concept de la Chine des années 20 ou 30 (période à laquelle le pays a sombré dans la guerre civile entre de nombreuses factions aux alliances changeantes) et des blindés de cette période a du potentiel. Je compte bien persévérer dans cette direction.

Qui dit Revision, dit une tripotée de releases d’excellentes qualité, ainsi je ne peux que vous recommander de regarder en particulier les contributions aux compétitions Amiga Démo, excellente cette année, Amiga Intro et PC 64k, 8k et 4k. Il y a beaucoup d’autres releases dans d’autres compétitions qui valent aussi le coup d’œil. Il y en a trop de bonnes pour les lister, mais vous pouvez découvrir le tout sur Demozoo.

 


Quelques notes techniques sur la réalisation du timelapse : comme pour la vidéo pour The Den, j’ai utilisé Autoscreen, FFMPEG et Shotcut pour la réaliser, mais entre les deux premières étapes, j’ai aussi passé les images à la moulinette ImageMagick pour éviter des problèmes de proportions lors du redimensionnement des images par FFMPEG. Pour plus de détails, voir les notes à la fin de mes explications de la dernière fois.

Publicités


Poster un commentaire

Forever 2019, le retour de la revanche des 8 bits

Comme chaque année, un petit coin champêtre de Slovaquie accueillait tout récemment sa traditionnelle demoparty consacrée exclusivement aux ordinateurs et consoles 8 bits, la Forever. Comme chaque année, j’ai participé à distance avec un graph pour Thomson TO8.

« Houston, we have a problem », 160×200, 16 couleurs (mode Bitmap16)

Par manque de temps, j’ai choisi de recycler un écran de titre de notre jeu pour Thomson TO8/TO9+ Mission: Liftoff qui n’avait pas été utilisé dans le jeu. Par chance, il convenait parfaitement au thème de la Forever cette année, « 8 bit aliens ».

Grâce aux dernières mises à jour de Grafx2, j’ai pu fournir ma contribution sous forme d’exécutable au format Thomson, plus précisément une image-disque avec un petit programme BASIC auto-exécutable qui affiche l’image.

Et comme nous vivons une époque caractérisée par une abondance presque sans limite, il n’y a pas une façon d’arriver à ce résultat, mais DEUX !

La méthode BIN

  • Assurez-vous que la résolution et la palette respectent les contraintes Thomson et sauvegardez l’image dans Grafx2 au format BIN : Save > MOTO > BIN
  • Créez une image-disque contenant uniquement ce fichier à l’aide de DCFDutil.
  • Chargez cette image dans votre émulateur Thomson favori (généralement DCmoto ou Téo) et tapez le programme suivant en BASIC 512 (auteur : Thomas Bernard) :
10 REM CHARGEMENT D'UNE IMAGE GrafX2
20 REM (C) THOMAS BERNARD
30 LOCATE,,0 'DESACTIVE CURSEUR
40 CONSOLE,,,,3
50 LOADM"HOUSTON.BIN"
60 REM PALETTE EN VRAM APRES L'IMAGE
70 FOR I=0 TO 15
80 BGR=PEEK(&H4000+8000+I*2)*256+PEEK(&H4000+8000+I*2+1)
90 PALETTE I,BGR
100 NEXT I
110 IF INKEY$="" GOTO 110
120 LOCATE,,1 'ACTIVE CURSEUR
130 REM AFFICHAGE DU COMMENTAIRE
140 FOR I=0 TO 31
150 C=PEEK(&H4000+8032+I)
160 IF C>=32 AND C<127 THEN PRINT CHR$(C);
170 NEXT I
180 PRINT
  • Vérifiez que l’image-disque n’est pas protégée en écriture et sauvegardez le programme sous le nom AUTO.BAT :
SAVE"AUTO.BAT"
  • Redémarrez l’ordinateur et lancer le BASIC 512 avec « B ».

La méthode TO-SNAP

  • Sauvegardez l’image dans Grafx2 au format MAP/TO-SNAP : Save > MOTO > MAP/TO-SNAP, puis même étapes que ci-dessus mis à part le programme BASIC 512 (auteur : Préhisto) qui est le suivant :
10 LOCATE,,0
20 DIM T%(10000)
30 DEFFNC(R)=MAX(-R-1,R)
40 LOADP "HOUSTON.BIN",T%(10000)
50 T=T%(10000)
60 T=T+1 : IF T%(T)<>-23206 THEN END
70 FOR I=15 TO 0 STEP -1 : T=T+1 : PALETTE I,FNC(T%(T)) : NEXT
80 T=T+1 : CONSOLE,,,,T%(T)
90 T=T+1 : SCREEN,,T%(T)
100 T=T+1 : POKE &H605F,T%(T)
110 PUT (0,0),T%(10000)
120 IF INKEY$="" GOTO 120
Image sur TO8

Et voilà la travail ! (Applaudissements)

Comme d’habitude, je recommande vivement de jeter un œil, voire deux, sur les releases de la Forever 2019 dont certaines sont réellement impressionnantes pour des machines qui ont entre 30 ou 40 ans d’âge. On notera des très bon graphs pour C64, Atari 8 bit et ZX Spectrum, plateforme qui a également été honorée par une superbe démo de Scoopex (oui, LE Scoopex mythique), malheureusement pas encore disponible.

graphs Forever 2019

‘Are you ready for Abduction?’ par Bocianu (Atari 8 bit) et Aliens Inside Us par CVM / ZeroTeam (ZX Spectrum)

Côté Thomson, on a pu y découvrir un graph de Pulkomandy, qui a aussi présenté un jeu à la Game & Watch dans une fast compo, et une démo / slideshow de Puls qui, dans la lignée de TO8 deMODed il y a deux ans, repousse encore un peu plus les limites en matière sonore sur Thomson en proposant la lecture de fichiers MOD dans une meilleure qualité et sur toutes les machines TO, dont l’antique et faiblard TO7/70 !


Mise à jour du 3 mai 2019 :

Les choses avancent rapidement, il y a maintenant une autre méthode pour afficher une image sur une machine Thomson, encore plus simple : l’outil en ligne MO/TO IMAGE TO BASIC qui génère directement le code BASIC nécessaire. Merci à Giuseppe Stassi pour cette solution très pratique.


2 Commentaires

Nova 2018

De retour de la Nova dans le Devon au Royaume-Uni (très jolie région, au passage), où j’ai présenté deux releases : un graph dans la compétition GFX old school et une invitation PC Engine pour la Datastorm par Up Rough dans la compétition Demo old school.

Ayant été beaucoup occupé les semaines précédant la party, mon graph a malheureusement été réalisé dans l’urgence absolue : esquisses en début de semaine, premiers pixels posés trois jours avant la party et gros du travail sur place. Pas de miracle à l’arrivée, mais je pense néanmoins que le concept a du potentiel et mériterait d’y accorder plus de temps. Niveau format c’est du pur Atari ST en 320×200 et 16 couleurs, avec la palette plus limitée du STF (choix de 512 couleurs).

Ninja Cat

Ninja Cat, 320×200 16 couleurs (palette STF)

L’invitation a été plus préparée à tête reposée puisque Mooz m’avait proposé de coopérer à la fin du mois d’avril, même si du fait d’un manque d’inspiration initial et de quelques fausses pistes, les graphismes définitifs n’ont été commencés que début juin et la décision de présenter l’intro à la Nova n’a été prise que quelques jours avant la party. Il n’aura pas échappé aux plus vieux d’entre que le personnage est inspiré du clip Sabotage des les Beasty Boys. Mes connaissances de la PC Engine / TurboGrafx-16 sont approximatives, mais niveau graphisme nous sommes en terrain connu : 16 couleurs à choisir parmi une palette de 512, comme sur l’Atari STF. Au niveau architecture, le fait d’avoir été présentée par NEC comme la première console 16 bit fit polémique à l’époque : le CPU est un bon vieux 8 bit et c’est seulement le coprocesseur graphique qui est 16 bit. Un petit arrangement avec la réalité qu’Atari réutilisera pour la Jaguar quelques années plus tard !

Datastorm Logo


10 Commentaires

Monstrombinoscope, image en collaboration avec Profil pour la VIP 2018

Petite expérimentation pour la VIP 2018 : une image en coopération avec Profil / Eclipse pour la compétition « oldschool graphics » ! J’avais fait la connaissance de Profil dans des demoparties alors que je débutais tout juste dans la demoscene (on parle quand même du dernier millénaire là !) et son talent et son attitude toujours très positive avaient été une inspiration importante pour moi.

Monstrombinoscope_x2

Monstrombinoscope, deuxième place dans la compétition oldschool graphics à la VIP 2018

Nous nous sommes un peu perdus de vue par la suite mais j’ai toujours souhaité avoir la possibilité de travailler ensemble sur un projet, chose qui a fini par se réaliser cette année. Nous nous y sommes évidemment pris trop tard pour espérer pouvoir présenter une image peaufinée comme il se doit, puisque que la machine s’est réellement mise en route une dizaine de jours avant la deadline. Ça aura néanmoins été une super expérience que j’espère avoir l’occasion de reproduire à l’avenir. Le contenu de l’image n’avait été discuté que dans ses grandes lignes au début du projet et donc les allez-retours du fichier ont généré leur lot de surprises quand un personnage inattendu surgissait sans crier gare. Le plus difficile a été de décider d’un thème en fait !

Il se trouve que le légendaire Ra a également présenté une image à la VIP. Ra, Profil, Exocet… on est en quelle année exactement ? 🙂

 


5 Commentaires

Archéologie infographique : le graphisme pour la NES

J’ai dernièrement eu l’opportunité de travailler avec Mara et Glafouk de Flush sur une petite production pour la NES, une invitation pour la VIP 2018 :

Le temps nous a fait défaut pour pouvoir inclure certaines des idées que nous avions en tête (en particulier, un peu d’animation sur les fantômes) mais le résultat est satisfaisant, surtout que pour nous tous il s’agissait peu ou prou de notre première expérience avec la NES. Ça m’aura ainsi permis de m’initier à la réalisation de graphismes adaptés aux contraintes de la console même si la réalisation de certaines images a été un peu précipitée.

Comme toujours, il a fallu tâtonner un petit peu avant de trouver exactement comment s’y prendre. Pour commencer il est très utile de comprendre comment la NES gère l’affichage à l’écran. L’article NES Graphics – Part 1 l’explique très clairement, mais on peut le résumer à ces cinq règles, les cinq commandements du graphisme NES :

  • La résolution de la NES est de 256×240
  • On dispose de 4 palettes de 4 couleurs (hors sprites), choisies parmi un total de 64.
  • La couleur 0 dans chacune de ces 4 palettes doit être identique, c’est la « couleur de fond ».
  • L’écran est composé de tiles de 8×8 pixels, avec un maximum de 256 (une tile peut être utilisée autant de fois que nécessaire).
  • Ces tiles sont à leur tour groupées en blocs de 2×2 (donc 16×16 pixels) qui doivent chacun utiliser uniquement les couleurs d’une seule palette.

NES graphics explained

Il faut donc gérer une double grille : 8×8 pour les tiles et 16×16 pour les palettes. La deuxième s’avère beaucoup plus contraignante en pratique et il vaut mieux commencer par la prendre en compte dès le début pour éviter d’avoir à se casser la tête plus tard à gérer les conflits de couleurs.

Les contraintes ci-dessus sont spécifiques aux écrans d’arrière-plan, auxquels on peut ensuite ajouter des sprites, qui sont eux aussi composés de tiles de 8×8 et disposent de leur propre palette de 4 couleurs, dont une transparente. La NES peut afficher jusqu’à 64 sprites simultanément mais gare aux problèmes de clignotement s’il y en a plus de 8 sur une même ligne d’affichage.

Revenons à la palette standard NES, la sélection de 64 couleurs parmi lesquels on choisit les teintes souhaitée. La première impression, c’est que le choix des couleurs est un peu navrant : pas de vrai jaune, des teintes qui font quasiment doublon, très peu de gris… Ensuite j’ai réalisé qu’il y avait une multitude de façons de représenter ces couleurs selon la version de la console (NTSC/PAL), le type d’écran et la connexion entre les deux et j’ai décidé de ne pas trop me monter le ciboulot avec l’exactitude des teintes.

NES palettes

How I learned to stop worrying about NES colours.
Source : http://emulation.gametechwiki.com/index.php/Famicom_Color_Palette

NES Screen Tool est un petit outil Windows utilisé pour convertir une image au format BMP en un format compréhensible par la NES. Attention par contre, il faut vraiment respecter les contraintes de palettes à 100% pour que la conversion se passe bien, NESst ne prétend pas faire une conversion intelligente en optimisant la palette et en réaffectant les couleurs. Le moindre pixel en dehors des clous (même si c’est la bonne teinte, mais avec le mauvais index de palette) donne des couleurs complètement incorrectes sur un bloc entier. Mieux vaut donc préparer ses palettes dès le départ, en copiant la couleur de fond à l’index 0 de chaque palette et bien s’assurer que chaque bloc de 16×16 utilise les couleurs d’une seule palette uniquement.

NES Screen Tool

NES Screen Tool

Niveau tiles, certains logiciels de pixel art les gèrent nativement, ce qui permet de s’assurer qu’on ne dépasse pas la limite de 256. Sinon on peut simplement afficher une grille de 8×8 et veiller à réutiliser les mêmes tiles autant que possible. En guise de référence, ma petite maison ci-dessus n’en utilise que la moitié sur les 256 disponibles.

Également disponible dans la série « archéologie infographique » :


5 Commentaires

Speed Painting pour la Gamebuino Meta

La Gamebuino Meta est une petite console portable fabriquée en France et conçue comme un outil pour s’initier à la programmation. Les programmes sont écrits en C/C++ avec l’environnement de développement Arduino qui est très accessible. J’avais bricolé un petit slideshow pour la Gamebuino originale il y a quelques mois et je commence à me familiariser avec sa petite soeur qui présente l’avantage d’être plus puissante et de disposer d’un écran couleur. Où s’arrêtera le progrès ?

Je me suis donné 30 minutes dans Pro Motion NG pour tester le mode basse résolution (80×64) et la palette par défaut de la Gamebuino Meta. Voilà le résultat (également sur Youtube) :

Et ça s’affiche même sur la console avec un petit bout de code ! L’image finale est disponible ici.

Birduino sur la Gamebuino


1 commentaire

Réaliser un time-lapse de captures d’écran avec des logiciels gratuits

Voilà un petit billet qui détaille la procédure que j’ai suivie pour la création de la vidéo timelapse de The Den sous Windows 10 et qui j’espère pourra s’avérer utile à certains d’entre vous qui lisez ceci. Bon je l’avoue, l’un des autres buts du billet est aussi que si l’envie me reprend de réaliser la même chose dans six mois ou deux ans, je n’aurai pas à tâtonner autant que j’ai eu à le faire cette fois-ci. Mais ça c’est plutôt du bonus.

Le budget de l’opération a été maîtrisé puisque je n’ai utilisé que des logiciels gratuits et même open source pour les deux derniers :

  • Auto Screen Capture pour les captures d’écran automatiques à intervalle régulier ;
  • FFmpeg pour convertir les séquences d’images en vidéo MP4 ;
  • Shotcut enfin pour le montage : enchaînement de différentes vidéos et ajout du titre et de la bande son.

La bande-son est quant à elle constituée de fichiers MOD (modules Amiga 4 canaux) convertis en WAV à l’aide d’XMPlay.

Le tout-gratuit s’est un peu fait par hasard puisqu’il s’est avéré qu’Adobe Premiere, que j’utilise généralement pour le montage, supportait mal les vidéos générées par FFmpeg, d’où le recours à Shotcut. Ce dernier utilisant les librairies de FFmpeg, des problèmes de compatibilité auraient été étonnants.

Première étape : automatiser la capture d’écran avec Auto Screen Capture (qui au passage ne pèse qu’un peu plus de 200 ko, c’est assez rare de nos jours pour le signaler !). J’ai utilisé une fréquence de deux secondes qui permet d’avoir un résultat final accéléré 50 fois pour une vidéo en 25 images par seconde. Auto Screen génère au moins deux formats de capture : plein écran (répertoire « 1 ») ou seulement la fenêtre active (répertoire « 5 »). C’est ce dernier que j’ai choisi, mais il vaudra veiller à faire un peu de nettoyage plus tard, Auto Screen capturant autre chose si on bricole avec d’autres fenêtres (forcément).

Auto Screen Capture screenshot

Auto Screen Capture

Deuxième étape : passer toutes les images à la moulinette FFmpeg. Il faut d’abord toutes les renommer comme il faut, ici une suite de 8 chiffres. J’utilise pour cela Total Commander (c’est bien, mangez en) mais il y a plein d’autres façons d’arriver au même résultat. Ensuite il suffit de taper une ligne de commande pleine de poésie pour invoquer FFmpeg :

ffmpeg -i %08d.png -framerate 25 -s 1920x1080 -vcodec libx264 output.mp4

Quelques minutes se passent ensuite où vous aurez le loisir d’apprécier le bruit des ventilateurs de votre PC, calcul intensif oblige.

Pour cette vidéo, les captures ayant été faites sur différents ordinateurs, j’avais des séquences d’images de différentes résolutions que FFmpeg a dû toutes convertir en 1920×1080. La procédure est probablement plus simple sans ce détail.

Troisième étape : importer les vidéos ainsi réalisées dans Shotcut, éventuellement assorties d’une bande son et d’images fixes. Je n’ai ni le temps ni la compétence pour réaliser un tutoriel sur l’utilisation de Shotcut, mais l’interface est relativement classique avec différentes pistes vidéo et audio sur lesquelles on place le contenu source. On peut ajouter quelques effets en positionnant le curseur en haut à droite d’un élément et en faisant un glisser-déposer quand un petit cercle palpitant apparaît. On peut par la suite exporter le tout grâce à l’icône Export en haut puis au bouton Export File en bas du menu suivant.

Shotcut screenshot

Shotcut

Enfin il n’y a plus qu’à uploader le tout sur YouTube ou équivalent. À vous les millions de vues et de followers et la vie de rêve d’un influenceur digital native qui fait du buzz.


Mise à jour du 7 mai 2019 : lors de la réalisation d’une vidéo similaire, il est apparu que la méthode ci-dessus peut causer des problèmes de proportions des images lors du redimensionnement de celles-ci par FFMPEG. Pour éviter ça, il suffit d’ajouter une étape supplémentaire entre la capture des images et leur conversion en vidéo, en les passant à la moulinette ImageMagick pour redimensionner toutes les images en 1920×1080 avec la ligne de commande suivante :

mogrify -background black -resize 1920x1080^ -extent 1920x1080 -gravity center *.png

FFMPEG peut alors être invoqué avec des instructions légèrement simplifiées :

ffmpeg -i %08d.png -framerate 25 -vcodec libx264 output.mp4