issue170:inkscape
Différences
Ci-dessous, les différences entre deux révisions de la page.
Prochaine révision | Révision précédente | ||
issue170:inkscape [2021/06/26 10:06] – créée auntiee | issue170:inkscape [2021/06/30 15:43] (Version actuelle) – andre_domenech | ||
---|---|---|---|
Ligne 1: | Ligne 1: | ||
- | I’m starting to think that the Inkscape developers have deliberately synchronised their calendar with the Full Circle Magazine article deadlines to ensure that they announce new releases just a few days after I’ve submitted this column, leaving the News pages to break the story. As you may have noticed in last month’s issue, Inkscape 1.1 has been released, and is now available for download from the Inkscape website. For Linux users there are versions in AppImage and snap format, as well as an official PPA repository, which may be preferable to Ubuntu users in particular. | + | **I’m starting to think that the Inkscape developers have deliberately synchronised their calendar with the Full Circle Magazine article deadlines to ensure that they announce new releases just a few days after I’ve submitted this column, leaving the News pages to break the story. As you may have noticed in last month’s issue, Inkscape 1.1 has been released, and is now available for download from the Inkscape website. For Linux users there are versions in AppImage and snap format, as well as an official PPA repository, which may be preferable to Ubuntu users in particular. |
- | The 1.1 release does bring a few welcome additions; however, I’m still working my way through the changes introduced with 1.0.x in this column, so the very latest changes will have to wait. This month will be all about the improved UI in the Trace Bitmap dialog. | + | The 1.1 release does bring a few welcome additions; however, I’m still working my way through the changes introduced with 1.0.x in this column, so the very latest changes will have to wait. This month will be all about the improved UI in the Trace Bitmap dialog.** |
- | Trace Bitmap Dialog | + | Je commence à penser que les développeurs d' |
+ | |||
+ | La version 1.1 apporte quelques ajouts bienvenus ; cependant, je suis toujours en train de travailler sur les changements introduits avec la 1.0.x dans cet article ; donc, les tout derniers changements devront attendre. Ce mois-ci, nous parlerons de l' | ||
+ | |||
+ | |||
+ | **Trace Bitmap Dialog | ||
This dialog has seen some substantial changes in the layout of its options, partly to avoid some confusion that could easily happen with the previous UI, and partly to integrate some tracing modes, one of which I’ll describe later in this article, with the others being held over until next month. Let’s deal with the placement of the long-standing features first of all, by taking a look at how the dialog appeared when I first introduced this feature, back in part 19 of this series: | This dialog has seen some substantial changes in the layout of its options, partly to avoid some confusion that could easily happen with the previous UI, and partly to integrate some tracing modes, one of which I’ll describe later in this article, with the others being held over until next month. Let’s deal with the placement of the long-standing features first of all, by taking a look at how the dialog appeared when I first introduced this feature, back in part 19 of this series: | ||
- | Here we can see the mis-titled “Move” tab (later versions corrected this to “Mode”), | + | Here we can see the mis-titled “Move” tab (later versions corrected this to “Mode”), |
- | Within each mode area there are also various other parameters that affect the tracing algorithm. The layout makes it somewhat unclear whether these parameters all apply to every tracing method, or whether some are tied to particular algorithms (answer: it’s the latter). Finally there are options that affect all methods and modes, in the “Options” tab, plus a lone “SIOX foreground selection” option that I described in part 20 of this series, but which I summarised with “you would be better off separating out the foreground using The GIMP (which has its own, more interactive, | + | Boîte de dialogue Vectoriser un objet matriciel |
- | I will start with a small complaint. It’s a general Inkscape issue, but is particularly obvious in this dialog. As I prefer floating dialogs in windows over docked dialogs at the side of the canvas, I often have several windows, each of which contains only a single dialog inside it – as in this image. In that situation, I think it would be nicer for Inkscape to collapse the tab bar down to a smaller “grab handle” that could be used to re-dock the dialog, rather than showing a lone tab in a bar that stretches across the whole dialog, wasting quite a bit of space. The window title already tells me this is the Trace Bitmap dialog; I don’t think I need that information on a tab as well. And with this particular dialog, the first tab within the dialog also bears the same name, making the dialog tab seem doubly redundant, and potentially confusing. | + | Cette boîte de dialogue |
- | Moving on to the real content of the dialog, you can see that the tabs along the top have been completely replaced. The old “Mode” tab is now “Trace bitmap”, and within that section are two large buttons for switching between the Single scan and Multiple scans modes. Gone are the radio buttons for selecting the tracing method, replaced instead with a single pop-up which greatly reduces the visual clutter. The parameters below change according to the selection in this pop-up, avoiding any confusion about which fields apply to which methods. | + | Ici, nous pouvons voir l' |
+ | |||
+ | |||
+ | **Within each mode area there are also various other parameters that affect the tracing algorithm. The layout makes it somewhat unclear whether these parameters all apply to every tracing method, or whether some are tied to particular algorithms (answer: it’s the latter). Finally there are options that affect all methods and modes, in the “Options” tab, plus a lone “SIOX foreground selection” option that I described in part 20 of this series, but which I summarised with “you would be better off separating out the foreground using The GIMP (which has its own, more interactive, | ||
+ | |||
+ | I will start with a small complaint. It’s a general Inkscape issue, but is particularly obvious in this dialog. As I prefer floating dialogs in windows over docked dialogs at the side of the canvas, I often have several windows, each of which contains only a single dialog inside it – as in this image. In that situation, I think it would be nicer for Inkscape to collapse the tab bar down to a smaller “grab handle” that could be used to re-dock the dialog, rather than showing a lone tab in a bar that stretches across the whole dialog, wasting quite a bit of space. The window title already tells me this is the Trace Bitmap dialog; I don’t think I need that information on a tab as well. And with this particular dialog, the first tab within the dialog also bears the same name, making the dialog tab seem doubly redundant, and potentially confusing.** | ||
+ | |||
+ | Dans chaque zone de mode, on trouve également divers autres paramètres qui affectent l' | ||
+ | |||
+ | Je vais commencer par une petite plainte. C'est un problème général d' | ||
+ | |||
+ | |||
+ | **Moving on to the real content of the dialog, you can see that the tabs along the top have been completely replaced. The old “Mode” tab is now “Trace bitmap”, and within that section are two large buttons for switching between the Single scan and Multiple scans modes. Gone are the radio buttons for selecting the tracing method, replaced instead with a single pop-up which greatly reduces the visual clutter. The parameters below change according to the selection in this pop-up, avoiding any confusion about which fields apply to which methods. | ||
Finally, the global parameters that formerly lived in the “Options” tab have been moved to a common section at the bottom of this dialog, making them far more obvious. This move also makes it clear that these options apply to the “Trace bitmap” modes, but not to the “Pixel art” mode, which has its own tab entirely. | Finally, the global parameters that formerly lived in the “Options” tab have been moved to a common section at the bottom of this dialog, making them far more obvious. This move also makes it clear that these options apply to the “Trace bitmap” modes, but not to the “Pixel art” mode, which has its own tab entirely. | ||
- | Aside from the UI changes, the operation of this part of the dialog remains unchanged from previous versions – apart from the addition of some new tracing modes that I will look at next month. For details on how to use the older modes, therefore, parts 19 and 20 of this series still apply. | + | Aside from the UI changes, the operation of this part of the dialog remains unchanged from previous versions – apart from the addition of some new tracing modes that I will look at next month. For details on how to use the older modes, therefore, parts 19 and 20 of this series still apply.** |
- | Trace Pixel Art | + | En ce qui concerne le contenu réel de la boîte de dialogue, vous pouvez constater que les onglets situés en haut de la page ont été complètement remplacés. L' |
+ | |||
+ | Enfin, les paramètres globaux qui se trouvaient auparavant dans l' | ||
+ | |||
+ | En dehors des modifications apportées à l' | ||
+ | |||
+ | |||
+ | **Trace Pixel Art | ||
The “Pixel art” mode isn’t actually a new thing – it first appeared in version 0.91 – but I haven’t covered it in this series before. Back in the 0.9x days, it had its own dialog, opened via an entry in the Path menu. | The “Pixel art” mode isn’t actually a new thing – it first appeared in version 0.91 – but I haven’t covered it in this series before. Back in the 0.9x days, it had its own dialog, opened via an entry in the Path menu. | ||
Ligne 25: | Ligne 49: | ||
In 1.0, the UI is essentially unchanged, save for an additional checkbox labelled “Optimise”. But it’s now accessed via the “Pixel art” tab of the Trace Bitmap dialog, rather than being a wholly separate dialog of its own. This means it also shares the image preview pane of the Trace Bitmap dialog, although it’s largely useless here, showing only a black-and-white picture which bears little resemblance to the traced image you’ll probably end up with. | In 1.0, the UI is essentially unchanged, save for an additional checkbox labelled “Optimise”. But it’s now accessed via the “Pixel art” tab of the Trace Bitmap dialog, rather than being a wholly separate dialog of its own. This means it also shares the image preview pane of the Trace Bitmap dialog, although it’s largely useless here, showing only a black-and-white picture which bears little resemblance to the traced image you’ll probably end up with. | ||
- | As the name suggests, this mode is intended for tracing pixel-based graphics, such as icons, emojis, or other small bitmap images. When scaling up a small image, you will often find that the interpolation algorithms that are commonly used can result in a blurry appearance, as intermediate colors are used for the new pixels that need to be created, losing any crisp transitions that are an essential part of the design. The Pixel Art tracer attempts to produce vector elements that will reproduce the original image, but which can be scaled without introducing a blurred or softened result. How effective it is at this will depend largely on the source image, and the result you’re looking for. | + | As the name suggests, this mode is intended for tracing pixel-based graphics, such as icons, emojis, or other small bitmap images. When scaling up a small image, you will often find that the interpolation algorithms that are commonly used can result in a blurry appearance, as intermediate colors are used for the new pixels that need to be created, losing any crisp transitions that are an essential part of the design. The Pixel Art tracer attempts to produce vector elements that will reproduce the original image, but which can be scaled without introducing a blurred or softened result. How effective it is at this will depend largely on the source image, and the result you’re looking for.** |
- | As an example, I decided to trace the 16px × 16px image used as a “favicon” on the Full Circle Magazine website. It’s a tiny representation of the orange circle with white swirls that forms the logo of this magazine. Let’s see what the preview pane in the dialog makes of it. | + | Pixel Art |
+ | |||
+ | Le mode « Pixel art » n'est pas vraiment nouveau - il est apparu pour la première fois dans la version 0.91, mais je ne l'ai pas encore abordé dans cette série. À l' | ||
+ | |||
+ | Dans la version 1.0, l' | ||
+ | |||
+ | Comme son nom l' | ||
+ | |||
+ | |||
+ | **As an example, I decided to trace the 16px × 16px image used as a “favicon” on the Full Circle Magazine website. It’s a tiny representation of the orange circle with white swirls that forms the logo of this magazine. Let’s see what the preview pane in the dialog makes of it. | ||
The various spinboxes in the Heuristics section are a mystery to me. They each have tooltips… which do nothing to clarify their purpose. They refer to parameters in the tracing algorithm, but the original research paper that is linked from the Inkscape 0.91 release notes is no longer available, nor have I been able to find it elsewhere. When faced with this situation, I resort to a tried-and-trusted technique to try to work out what effect they have: I first traced images using the defaults, then I cranked the values up to their maximum levels (10, 20, 8 and 10), and traced the same images. The results, in every case that I tried, were so close as to be irrelevant. | The various spinboxes in the Heuristics section are a mystery to me. They each have tooltips… which do nothing to clarify their purpose. They refer to parameters in the tracing algorithm, but the original research paper that is linked from the Inkscape 0.91 release notes is no longer available, nor have I been able to find it elsewhere. When faced with this situation, I resort to a tried-and-trusted technique to try to work out what effect they have: I first traced images using the defaults, then I cranked the values up to their maximum levels (10, 20, 8 and 10), and traced the same images. The results, in every case that I tried, were so close as to be irrelevant. | ||
- | The “optimize” checkbox at least has an understandable tooltip. It claims that enabling it will try to optimize paths by joining adjacent Bézier curve segments. With my test images, however, it served to only cut off the corners of some paths, resulting in holes within the design. | + | The “optimize” checkbox at least has an understandable tooltip. It claims that enabling it will try to optimize paths by joining adjacent Bézier curve segments. With my test images, however, it served to only cut off the corners of some paths, resulting in holes within the design.** |
- | In the Output section, you can decide between producing shapes that have entirely straight edges (Voronoi), or which may include curves (B-splines). When tracing very small images, this is a matter of personal taste. With larger images – even those of only a few hundred pixels – the Voronoi output can take a lot longer, and may not produce the result you expect. | + | À titre d' |
+ | |||
+ | Les différents champs à compteur de la section Heuristique sont un mystère pour moi. Ils ont tous des infobulles... qui ne font rien pour clarifier leur but. Elles font référence à des paramètres de l' | ||
+ | |||
+ | La case à cocher « optimisé » a au moins une info-bulle compréhensible. Il y est affirmé que si elle est activée, elle essaiera d' | ||
+ | |||
+ | |||
+ | **In the Output section, you can decide between producing shapes that have entirely straight edges (Voronoi), or which may include curves (B-splines). When tracing very small images, this is a matter of personal taste. With larger images – even those of only a few hundred pixels – the Voronoi output can take a lot longer, and may not produce the result you expect. | ||
Let’s look at the result of playing with some of these options. In this screenshot, the original 16px square favicon is at the top-left. To the right of it you can see how it looks when scaled directly in Inkscape – first using the “optimize for quality” mode, and secondly with the “optimize for speed” mode (remember, the selected mode can be changed in the Object Properties dialog). In both cases, however, the end result is still a bitmap image, so its individual parts can’t be manipulated as vectors. | Let’s look at the result of playing with some of these options. In this screenshot, the original 16px square favicon is at the top-left. To the right of it you can see how it looks when scaled directly in Inkscape – first using the “optimize for quality” mode, and secondly with the “optimize for speed” mode (remember, the selected mode can be changed in the Object Properties dialog). In both cases, however, the end result is still a bitmap image, so its individual parts can’t be manipulated as vectors. | ||
- | The lower part of the image shows the result of the tracing algorithm, with the B-spline versions on the left, and the Voronoi versions on the right. In each case, there’s a column showing the results when the parameters are left at their defaults, and one showing the results when all the parameters are set to their maximum values. The bottom row shows the result of enabling the Optimize checkbox. In most cases I suspect that creating an un-optimized B-spline using the default values will be good enough. | + | The lower part of the image shows the result of the tracing algorithm, with the B-spline versions on the left, and the Voronoi versions on the right. In each case, there’s a column showing the results when the parameters are left at their defaults, and one showing the results when all the parameters are set to their maximum values. The bottom row shows the result of enabling the Optimize checkbox. In most cases I suspect that creating an un-optimized B-spline using the default values will be good enough.** |
- | The close similarity between all the results may simply be because my choice of test images doesn’t really do justice to the algorithm, but it was actually rather difficult to find genuinely small pixel images. Many examples of “pixel art” that you might find online have the appearance of being pixellated, while actually being made up of a much larger collection of pixels. For example, here’s one I tried from Wikimedia Commons: | + | Dans la section Résultat, vous pouvez choisir de produire des formes dont les bords sont entièrement droits (Voronoï) ou qui peuvent inclure des courbes (B-splines). Pour la vectorisation de très petites images, c'est une question de goût personnel. Avec des images plus grandes, même celles de quelques centaines de pixels seulement, la sortie Motif de Voronoï peut prendre beaucoup plus de temps et ne pas donner le résultat escompté. |
+ | |||
+ | Voyons le résultat de l' | ||
+ | |||
+ | La partie basse de l' | ||
+ | |||
+ | |||
+ | **The close similarity between all the results may simply be because my choice of test images doesn’t really do justice to the algorithm, but it was actually rather difficult to find genuinely small pixel images. Many examples of “pixel art” that you might find online have the appearance of being pixellated, while actually being made up of a much larger collection of pixels. For example, here’s one I tried from Wikimedia Commons: | ||
A count of the obvious “pixels” in the computer image on the left suggests that part is only 31px wide. Except that it’s actually 248 pixels, with each apparent pixel in the image actually consisting of an 8×8 square of pixels. Nevertheless, | A count of the obvious “pixels” in the computer image on the left suggests that part is only 31px wide. Except that it’s actually 248 pixels, with each apparent pixel in the image actually consisting of an 8×8 square of pixels. Nevertheless, | ||
Ligne 45: | Ligne 92: | ||
In both cases, the tracing took a lot longer than with the favicon, with the Voronoi version taking the longest by a clear margin. And why does it look so faint? A close-up view of the result, with some paths selected, shows us a bit more of what’s happening. | In both cases, the tracing took a lot longer than with the favicon, with the Voronoi version taking the longest by a clear margin. And why does it look so faint? A close-up view of the result, with some paths selected, shows us a bit more of what’s happening. | ||
- | The top-left shows shapes from the B-spline tracing. The black pixels that form a diagonal edge in the original image have been turned into a single path, with far more nodes than necessary, as a result of the 8×8 pixel blocks. The resultant trace consists of a group of 69 individual objects, each of them an overly defined path. | + | The top-left shows shapes from the B-spline tracing. The black pixels that form a diagonal edge in the original image have been turned into a single path, with far more nodes than necessary, as a result of the 8×8 pixel blocks. The resultant trace consists of a group of 69 individual objects, each of them an overly defined path.** |
- | The Voronoi mode fares even worse. Here the individual pixels of the 8×8 blocks have been converted into separate paths, resulting in a group of 63,000 objects! That’s quite a result from what was clearly designed as a 32px × 32px icon (1,024 pixels in total). It also explains why it looks faint: the large number of closely spaced objects plays havoc with Inkscape’s anti-aliasing algorithm, as it tries to resolve the individual edges of the shapes. | + | La grande similitude entre tous ces résultats est peut-être simplement due au fait que mon choix d' |
+ | |||
+ | Un comptage des « pixels » évidents dans l' | ||
+ | |||
+ | Dans les deux cas, le traçage a pris beaucoup plus de temps qu' | ||
+ | |||
+ | En haut à gauche, on voit les formes de la vectorisation avec B-spline. Les pixels noirs qui forment un bord diagonal dans l' | ||
+ | |||
+ | |||
+ | **The Voronoi mode fares even worse. Here the individual pixels of the 8×8 blocks have been converted into separate paths, resulting in a group of 63,000 objects! That’s quite a result from what was clearly designed as a 32px × 32px icon (1,024 pixels in total). It also explains why it looks faint: the large number of closely spaced objects plays havoc with Inkscape’s anti-aliasing algorithm, as it tries to resolve the individual edges of the shapes. | ||
Trying to convert something as small as an icon into a vector graphic will always be a trade-off that will work better for some images than others. The lesson from this is that the pixel art mode is not really designed for “pixel-style art”, but specifically for very low resolution pixel images. If your source material is more than about 48px in either dimension, you probably need to consider scaling it down in a bitmap editor before throwing it at this algorithm. | Trying to convert something as small as an icon into a vector graphic will always be a trade-off that will work better for some images than others. The lesson from this is that the pixel art mode is not really designed for “pixel-style art”, but specifically for very low resolution pixel images. If your source material is more than about 48px in either dimension, you probably need to consider scaling it down in a bitmap editor before throwing it at this algorithm. | ||
- | As great as it is to have advanced algorithms in Inkscape, what I would really like to see in terms of tracing pixel art is a mode that simply takes each individual pixel and converts it to an Inkscape square, with an option to merge adjacent squares of the same color into a path. You can kind-of achieve this with the Tiled Clones dialog, if you know what you’re doing, but adding that as an option to the Trace Bitmap dialog would likely cover most people’s pixel tracing requirements, | + | As great as it is to have advanced algorithms in Inkscape, what I would really like to see in terms of tracing pixel art is a mode that simply takes each individual pixel and converts it to an Inkscape square, with an option to merge adjacent squares of the same color into a path. You can kind-of achieve this with the Tiled Clones dialog, if you know what you’re doing, but adding that as an option to the Trace Bitmap dialog would likely cover most people’s pixel tracing requirements, |
+ | |||
+ | Le mode Voronoï est encore pire. Ici, les pixels individuels des blocs 8 × 8 ont été convertis en chemins séparés, ce qui donne un groupe de 63 000 objets ! C'est un sacré résultat pour une icône clairement conçue comme une icône de 32 px × 32 px (1 024 pixels au total). Cela explique également pourquoi l' | ||
+ | |||
+ | Essayer de convertir quelque chose d' | ||
+ | |||
+ | Même si c'est génial d' | ||
issue170/inkscape.1624694793.txt.gz · Dernière modification : 2021/06/26 10:06 de auntiee