AI Generated Icons?

@vincent gave a great talk in 2020 regarding pros and cons of SVG vs bitmap icons : ADUG Canberra October 2020 - TSVGIconImageList plus Interfaced Forms and Frames - YouTube

There was a link at some stage about how the same icons ideally need different details at different resolution scales . . which is a point against SVG sets.

I remember joking at the time that maybe AI would be able to come up with multi- resolution sets.

And now we’re in 2023 … :thinking:

I haven’t tried searching on the multi-res sets yet … but here’s one step that’s possible :

Since that presentation I have actually switched back to using multiple resolution pngs. I ended up having too many issues with poor scaling to small sizes(and issue with svg not the library). I still haven’t finished updating all the images… it’s a task I wish I had never started, even though it’s long overdue.

I’m not sure how I feel about all this AI stuff…

Yes, I remember you linking to a web article or an academic paper (?) that explained how an icon might need to change in the detail displayed as it changed in display size.

I was thinking that, given the AI environment now, it may well be possible to have those multi-res sets generated cooperatively - maybe needing some back and forth, like people are doing with ChatGPT … or indeed would with a real, human, designer.

Getting them consistent across an application’s worth of icons might be a whole other level 'tho.

Yes I remember that, tried to find it today but failed.

I’m pretty sure you might have shown it on screen, during question or break time, when Ray had given his talk at the 2022 Symposium. (22 June 2022)

From Lex to Everyone 01:35 AM

Why not use SVG images rather than bitmaps?

From Vincent Parrett to Everyone 01:36 AM

Lex I’ll chime in about svg’s shortly

From Mark Patterson to Everyone 01:44 AM

Yes, the first thing I was thinking of was SVG, vector graphics.

From Vincent Parrett to Everyone 01:45 AM

they have similar issues to when you scale down large bitmaps… lines become too thin - so you need different svg’s for different sizes - they have to be drawn specifically for the small sizes
I wasted a huge amount of time on svgs before switching back to bitmaps

I’ve just coded a very simple raster to svg utility - ToSVG - that seems to handle smallish icons pretty well. It reduces the color palette of the raster images to a max of 16 colors. Then for each of those colors it converts them into vectors (assuming they make a signficant contribution). Then paths are simplified and bezier smoothed (both controlled manually). Nevertheless, in its current state it’s still mostly just proof of concept.

I’ll post a link here once I’ve tidied the code up a bit more (might take 24hrs) but it’s a modification of my Vectorize sample app from my Image32 graphics library.

Edit: Here’s the video.
Edit2: And here’s the source code and binary (updated Mar. 13).

3 Likes

The issue with small icons is really to do with tioolbar icons at 16x16px - very hard to convey meaning with so few pixels available - so the smaller icons really do need to be drawn differently (often dropping some details).

I use Vector magic - https://vectormagic.com/ - but they haven’t updated it in a very long time and it could still use some improving.

Indeed. Fortunately however, with the steady increase in display ppi ratios, 16x16 icons will soon go where 16 and 256 color images went. And that (the much higher ppi’s) will largely resolve the current problem of drawing very narrow lines that’s especially relevant to fonts, but also to very small images.

When I updated one of my applications recently, I moved to 24px toolbar button images.

I don’t know if this was it … but it looks a lot like I remember. Key phrase might be “detail reduction”.