Comment transformer une image pixel en logo vectoriel dans Inkscape?

17

Je ne sais pas si je suis au bon endroit, mais j'aimerais savoir comment transformer une image pixel que j'ai créée en logo vectoriel?

J'utilise cette image pour ma favicon de mon site Web personnel. Et si vous avez des recommandations de logiciels , je travaille sur mac. Je préfère utiliser un logiciel open source.

Image pixel

Guillaume Vincent
la source
3
Essayez-vous de conserver l'aspect pixélisé, ou essayez-vous de le lisser?
Brendan
Également pertinent: ** Dessins de taille pixel en vecteur
JohnB
Le léger problème est que l'image n'est pas bien formée, ce ne sont pas des carrés parfaits lors d'un zoom avant.
Adam Schuld
@brendan Je veux garder le look pixélisé
Guillaume Vincent

Réponses:

16

Inkscape

Cette puissante application de graphiques vectoriels est gratuite, multiplateforme et Open Source. Il est livré avec une fonction intégrée pour tracer des graphiques vectoriels à partir de bitmaps.

Ce sont les étapes impliquées:

  1. Fichier - Importer ... : choisissez "d'incorporer" le bitmap.
  2. Sélectionnez le bitmap incorporé.
  3. Choisissez le chemin -Trace Bitmap ... . Cela ouvrira la boîte de dialogue suivante:

    entrez la description de l'image ici

  4. Définissez les paramètres suivants pour conserver l'apparence de la boîte carrée pixellisée dans le mode et dans les onglets Options :

    entrez la description de l'image ici

    • Cochez les couleurs .
    • Choisissez 11 Scans pour les 11 couleurs de votre image source.
    • Cochez Stack scanne pour avoir un objet par couleur empilé les uns sur les autres.
    • Décochez les coins lisses et optimisez les chemins pour les boîtes carrées résultantes.
    • Cliquez sur Mettre à jour pour un aperçu, OK pour tracer le bitmap.
    • Déplacez le graphique vectoriel à côté du bitmap pour comparer le résultat (ici la trace vectorielle sélectionnée est sur le côté droit):

    entrez la description de l'image ici

    • Copiez l'objet vectoriel dans un nouveau dessin et enregistrez-le dans un format de fichier de votre choix.

Remarque:

Ce guide ne conduira pas au résultat souhaité d'un graphique vectoriel pixélisé lorsque vous travaillez sur une très petite source d'icône. Pour obtenir toujours l'effet pixelisé sur le traçage, nous devons d'abord mettre à l'échelle l'icône avant d' importer dans Inkscape.

Takkat
la source
une chose que je suis curieux de savoir @Takkat est si la même anomalie se trouve dans votre trace que dans Illustrator. Si vous regardez ma réponse, vous verrez que l'œil n'est pas exactement une ligne droite - est-ce la même chose dans Inkscape ou Inkscape fonctionne-t-il mieux?
Adam Schuld
@AdamSchuld: dans Inkscape, c'est l' option "Optimiser le chemin" que nous devons désactiver pour obtenir des lignes droites plutôt que Béziers. Cependant, il peut ne pas y avoir 100% d'angles droits (difficile à tester). Je crois qu'il existe une option similaire dans Illustrator (mais je ne peux pas la tester sur mon système Open Source ici).
Takkat
3

Je ne suis pas compétent dans le programme, mais cela peut être fait dans Inkscape. Je suis sûr que quelqu'un interviendra et l'expliquera dans Inkscape. Une chose que j'ai remarquée en zoomant sur l'image, c'est qu'il y a une imprécision avec ces carrés dans votre image. Celui qui a créé cette image a utilisé une largeur de ligne alternée de 7 pixels et 8 pixels, ce qui le rend légèrement plus impliqué dans un processus lors de la création d'une grille pour l'effet pixellisé.

Le moyen le plus rapide et le plus bas consiste à utiliser le traçage d'image dans Adobe Illustrator, cela prend littéralement moins d'une minute par rapport au processus plus complexe de recréation des pixels à l'aide d'une grille. Je ne suis pas sûr à 100% si le traçage bitmap dans Inkscape donnera le même résultat.

Dans tous les cas, le processus dans Illustrator consiste à importer l'image, puis à utiliser la trace d'image avec à peu près les mêmes paramètres que l'image ci-dessous. Il produira un effet rigide de type pixel. entrez la description de l'image ici

L'effet a zoomé. Pour la plupart des effets, il n'y aura aucune anomalie. Zoomé

Cependant, certaines zones dont vous aurez besoin pour corriger les chemins manuellement car ils sont légèrement éteints. Légères anomalies

Adam Schuld
la source
merci @AdamSchuld, j'ai choisi la solution open source Takkat. Mais vous répondez peut aider les utilisateurs d'illustrateurs.
Guillaume Vincent
Sa réponse était meilleure! Heureux d'avoir pu aider
Adam Schuld
0

Il n'est pas nécessaire d'utiliser des graphiques vectoriels lorsque vous souhaitez un look pixel-y. Vous pouvez simplement utiliser GIMPpour mettre à l'échelle votre PNGfichier. Voici comment:

  1. Ouvrez votre fichier dans GIMP
  2. Sélectionnez Image>Scale Image
  3. Modifiez les paramètres pour augmenter la taille de votre fichier
  4. Exportez votre fichier mis à l'échelle comme un autre PNG(appuyez sur Ctrl+ Shift+ Eou sélectionnez File> Export)

Cependant, si vous extrudez l'icône de pixel Blender, vous devrez utiliser la Inkscapeméthode.

RétroAsgardien
la source