Archive for the ‘textures’ Category

Generation of high quality bitmap fonts

here is how to quickly and automatically generate bitmap fonts with an alpha channel, providing a perfect anti-aliasing on any background. Any vector font can be used and combined with an infinity of graphic effects.

The software that does 99% of the job is ImageMagick, a free, open-source image processing tool that I consider as a « GUI-less Photoshop » : as powerful as Adobe’s product, ImageMagick is used only from another program, or even from the shell. Install it urgently.

Below is the small batch file that creates a few files containing words including the font.png with the « font » text used in the image above :

@echo off
rem Function: Create transparent background, aliased texts from a list of words
rem Author: Philippe Guglielmetti
rem Requires: ImageMagick v.6 or later (www.imagemagick.org)
set texts=OK Abort Cancel font "This is Great !"
set params=-background none -font Bauhaus-93 -pointsize 72 -density 300 -fill blue -blur 0x5
for %%a in (%texts%) do convert.exe %params% label:%%a %%a.png
set texts=
set params=

« params » define the font to create:

  • -background none is mandatory to draw the font on a transparent background (alpha channel)
  • -font Bauhaus-93 defines the vector font to use (its name is sometimes not the same as the one displayed in Windows « Fonts » folder…)
  • -pointsize 72 -density 300 specifies the font should be 72pt high on a 300dpi device. The bitmap size will therefore be larger on screen, but it can be printed or used as a texture in a 3D game or a Demoniak3D demo with a perfect quality.
  • -fill blue -blur 0x5 are two basic effects : the symbol is filled with blue, and its contour (1 pixel of black by default) is slightly blured on 5 pixels. This creates semi-transparent pixels at the symbols borders, which enables a perfect superimposition whatever the background color, as shown on the zoom right:

To superimpose the text on a background texture for a quality check, another ImageMagick is called:

composite.exe -tile back.png -compose Dst_Over font.png test.jpg

Once the test passed, we can generate all the chars of the font. When only a few symbols are required, we could re-use the batch file above, definining for exemple

set texts=0 1 2 3 4 5 6 7 8 9

This can be cumbersome for a complete font, and for application programming reasons it might be useful to name the files by the ASCII code of each char. As this is not possible to code in Windows batch language, we have to code it in a real language such as LUA:

params="-background none -font Bauhaus-93 -pointsize 72 -density 300 -fill white -blur 0x5 "
for i=32,167 do
os.execute("convert.exe "..params.."label:"..string.char(i).." "..i..".png")
end

These 4 lines automatically generate 130 files of nice symbols ready to be loaded as textures in your game. Note that these files total about 10 Mb au total, more than ImageMagick. It might therefore be worth to consider including ImageMagick in your product and use it at insall time to generate the required fonts instead of creating a heavy distribution

Now, if the fonts above are a bit rough for you, have a look at  this page which will give you some idea of the possible effects, and explore this one for the full picture.

Génération de polices bitmap de haute qualité

Voici comment générer rapidement et automatiquement des polices de caractères bitmap avec canal alpha, donnant un anti-aliasing parfait quel que soit la texture de fond utilisée. Toutes les polices vectorielles peuvent être utilisées et combinées avec une infinité d’effets graphiques.

Le logiciel réalisant 99% du travail est ImageMagick, un programme de traitement d’images open-source gratuit que je considère comme un « Photoshop sans GUI » : aussi puissant que l’outil d’Adobe, ImageMagick s’utilise uniquement depuis un autre programme, voire simplement la ligne de commande du shell. A installer d’urgence.

Voici par exemple le petit fichier batch qui crée quelques fichiers contenant des mots, dont le fichier font.png contenant le mot « font » de l’image ci-dessus :

@echo off
rem Function: Create transparent background, aliased texts from a list of words
rem Author: Philippe Guglielmetti
rem Requires: ImageMagick v.6 or later (www.imagemagick.org)
set texts=OK Abort Cancel font "This is Great !"
set params=-background none -font Bauhaus-93 -pointsize 72 -density 300 -fill blue -blur 0x5
for %%a in (%texts%) do convert.exe %params% label:%%a %%a.png
set texts=
set params=

Les « params » définissent la police à réaliser:

  • -background none est essentiel pour dessiner la police sur un fond transparent (canal alpha)
  • -font Bauhaus-93 définit la police vectorielle à utiliser (dont le nom n’est parfois pas identique à celui apparaissant dans le dossier « Fonts » de Windows…)
  • -pointsize 72 -density 300 spécifient que la police doit faire 72pt de haut à 300dpi. La taille du bitmap sera donc supérieure à l’écran, mais il pourra être imprimé ou utilisé comme texture dans un jeu 3D ou une démo Demoniak3D avec un résultat d’excellente qualité
  • -fill blue -blur 0x5 sont deux petits effets de base : on remplit le caractère en bleu, et on adoucit le tracé de la lettre, qui est d’un pixel de noir par défaut. Ceci crée des pixels semi-transparents au bord des caractères, ce qui permet une découpe parfaite des caractères quel que soit le fond, comme on le voit sur le zoom ci-contre:

Pour placer la police sur la texture de fond afin de vérifier sa qualité, on utilise un autre module d’ImageMagick;

composite.exe -tile back.png -compose Dst_Over font.png test.jpg

Une fois ce test réalisé, on peut s’attaquer à la génération de tous les caractères de la police. Si seuls quelques caractères sont nécessaires, on peut utiliser le batch ci-dessus en définissant par exemple

set texts=0 1 2 3 4 5 6 7 8 9

Mais ceci est fastidieux pour une police complète, et pour des raisons de programmation de l’application finale, il peut être utile de nommer les fichiers d’après le code ASCII de chaque caractère. Comme cette fonctionnalité n’est pas disponible dans le langage de commande Windows, il faut programmer ceci dans un langage évolué. Par exemple en LUA:

params="-background none -font Bauhaus-93 -pointsize 72 -density 300 -fill white -blur 0x5 "
for i=32,167 do
os.execute("convert.exe "..params.."label:"..string.char(i).." "..i..".png")
end

Ces 2 lignes génèrent automatiquement 130 fichiers de belles lettres prêtes à être utilisées comme textures dans votre jeu. A noter que ces fichiers pèsent déjà 10 Mb au total, soit plus que l’exécutable d’ImageMagick : il peut donc être intéressant d’inclure ImageMagick à votre produit et de l’utiliser pour créer les polices nécessaires lors de l’installation plutôt que d’alourdir votre distribution…

Enfin, si vous trouvez les polices ci-dessus un peu trop carrées, visitez cette page qui vous donnera une petite idée des effets possibles, et explorez celle-ci pour une vision plus complète.

VideoTrace : modelisation 3D à partir d’une video

l’ Australian Centre for Visual Technologies a développé VideoTrace, une technologie assez extraordinaire permettant de modéliser un objet réel en 3D à partir d’un bout de film. Démonstration:

C’est encore au niveau du proto, mais il fait peu de doute qu’on verra cette technologie très prochainement intégrée à nos outils de modélisation préférés. Et peut-être que dans quelques années il n’y aura même plus besoin de dessiner sur les images pour aider…

référence : Anton van den Hengel, Anthony Dick, Thorsten Thormählen, Ben Ward, Philip H. S. Torr « VideoTrace: Rapid interactive scene modelling from video« , 2007, SIGGRAPH 2007 Conference Proceedings