Vectoriser du pixel art avec Inkscape

Human Geek Ressources SVG

Un tutoriel pour vectoriser très simplement du pixel art au format PNG tout en conservant les zones transparentes de notre image avec votre éditeur vectoriel préféré, j'ai nommé Inkscape.

Importer l'image PNG

Télécharger et installer Inkscape si ce n'est déjà fait.

Ouvrir Inkscape.

Fichier > Importer... (ou Ctrl + I)

Sélectionner votre fichier PNG.

Cocher les options suivantes :

Human Geek Options Upload Image

Vectoriser l'image PNG

Sélectionner votre image (Ctrl + A).

Fichier > Propriétés du document... (ou Maj + Ctrl + D)

Déplier l'option "Redimensionner la page au contenu...", cliquer sur le bouton "Ajuster la page au dessin ou à la sélection".

Sélectionner votre image (Ctrl + A).

Chemin > Vectoriser du pixel art...

Cocher les options suivantes :

Human Geek Options Upload Image

Supprimer l'image PNG.

Nettoyer l'image SVG

Sélectionner votre image (Ctrl + A).

Objet > Dégrouper (ou Maj + Ctrl + G)

Vous devez obtenir quelque chose comme cela :

Human Geek Image Dégroupée

Notez que notre image vectorisée est composée d'un ensemble de carrés et que dans mon cas les pixels transparents sont représentés par des carrés blancs. En effet la transparence n'est pas gérée correctement par le programme. Que cela ne tienne, je vais vous montrer comment restaurer la transparence très simplement :)

Édition > Éditeur XML (ou Maj + Ctrl + X)

Sélectionner un nœud de image qui contient la transparence :

Human Geek Editeur XML

Copier le style contenant "fill:#000000;fill-opacity:0".

Édition > Rechercher/remplacer... (Ctrl + F)

Cocher les options suivantes :

Human Geek Editeur XML

Cliquer sur "Rechercher", puis "F2".

Édition > Supprimer.

Sélectionner votre image (Ctrl + A).

Chemin > Union

Human Geek Editeur XML

Sauvegarder votre fichier SVG, enjoy ^^

Lester

Lire plus d'articles de cet auteur.

France

Subscribe to Human Geek

Get the latest posts delivered right to your inbox.

or subscribe via RSS with Feedly!