• Site
• CMS
• Technique

Ces derniers temps, je me suis fait plaisir en explorant les possibilités de mon outil de CMS (qui s'appelle « Grav »), celui qui est utilisé pour le Blog que vous lisez actuellement. J'expliquerai plus en détails dans une entrée de blog à venir...

Un des problèmes auxquels j'ai été confronté est le classique souci de créer des textures qui se répètent (pour les fonds d'écran) sans qu'on voit d'interstices ou de défauts. On appelle ça des « seamless tiles ».

J'ai fait divers essais avec mes outils habituels. Ce n'est pas la première fois que je suis confronté au problème, mais là, j'ai plus creusé.

Après pas mal d'essais et de recherche sur internet, j'ai trouvé une méthode qui me convient pas mal et qui m'a permis de créer des textures pour de futurs usages.

Au début, j'utilisais Gimp (un outil de dessin), avec un filtre (menu « Filters ➜ Map ➜ Tile seamless ») qui permet de prendre un dessin et de le modifier automatiquement pour qu'il soit répétable sans défauts. L'ennui, c'est que je me suis bien vite aperçu des limites sérieuses de cet outil : ça marchait bien avec certains types de textures, pas avec d'autres. Bref, ça n'était pas réellement satisfaisant.

J'ai ensuite vu une option d'un autre outil de dessin (Krita) qui marchait pas mal, elle permet de dessiner sur l'écran avec une sorte de mosaïque : les dessins sont automatiquement répétés dans les autres parties, ça garantit que la texture est bien faite. L'ennui, c'est que j'ai trouvé qu'il y avait des problèmes avec cette option. Et je n'étais pas trop content des pinceaux que j'avais. En plus, je connais moins bien cet outil.

Finalement, après avoir bien fouillé, j'ai fini par découvrir que Gimp aussi avait une option de ce type ! Je ne la connaissais pas encore, elle est assez nouvelle et elle est bien cachée (menu « Windows ➜ Dockable dialogs ➜ Symmetry painting »).

Là, j'ai fait un GRAND bond en avant, parce que ça a d'un coup résolu mes soucis avec le filtre, et je sais bien manipuler les pinceaux de Gimp. Du coup, j'en ai créé plusieurs, notamment des croisements (« crosshatchs »), comme on en voit un exemple dans l'image illustrant cette entrée de Blog.

Je joue aussi BEAUCOUP sur la transparence : je donne une transparence de 20 à 45% à ma texture, ça permet de jouer sur la couleur de fond, et de facilement obtenir divers effet avec une seule texture (que je sauvegarde en noir & blanc). C'est super pratique : ça évite de faire plein de textures pour chaque couleur ou intensité, etc.

J'en suis déjà à des dizaines d'essais, dont pas mal sont satisfaisants. C'est dur de juger si une texture rend bien sur la page web : il faut d'abord la créer, puis l'appliquer et voir. Juste la voir, même simulée, dans l'outil de dessin ne suffit pas. C'est du boulot, mais je suis assez content des résultats obtenus, ils sont bien meilleurs que ce que je faisais avant !

Maintenant, je vais pouvoir varier les textures (et les couleurs) de mon site prototype, et d'autres à venir.

Dans ma prochaine entrée de Blog, j'expliquerai pourquoi j'ai été amené à tester tout ça.

À suivre !