MIP Screen Icons

7399462 8 days ago

Hello,

I'm a coding novice, but I'm nearing the end of a watch face for my Instinct 3 Solar Tactical (MIP screen).

I'm desperately looking for good open-source weather icons that I could use in 24x24 or 20x20 pixels (important : the same height as the "xtiny" font).

I've tried some icons, but they lose too much quality on the MIP screen. Do you have any icon suggestions, please?

Sorry for my english.

Thank you, best regards.

the-ninth 8 days ago

Here are two open source icons, one showing a sun and the other a sun with a cloud. They are vector graphics, so it’s easy to adjust their color and generate PNGs in any required resolution.

https://github.com/METIQ-Solutions/evcc-garmin/blob/main/resources/drawables/src/svg/sun.svg

https://github.com/METIQ-Solutions/evcc-garmin/blob/main/resources/drawables/src/svg/forecast.svg

7399462 8 days ago in reply to the-ninth

Hello, thank you for your reply.

I tried converting SVGs to PNGs, specifically those from erikflowers, but for the sun icon, for example, it loses its rays in the simulator.

However, I managed perfectly with the Bluetooth and alarm icons.

Perhaps "pixel-perfect" would be necessary, but I can't find many icons online.

the-ninth 8 days ago in reply to 7399462

I use Inkscape for the conversion. It has a command-line interface, so I can run the conversion from a script, for example to generate different sizes for different devices.

As far as I know, CIQ also supports defining SVG resources, and the compiler will convert them for you.

Here are some samples of how those icons look in my UI:

7399462 8 days ago in reply to the-ninth

Hello,

So I would need a script in Inkscape?

Because I can export PNGs with that software, but the quality is too poor in the simulator, especially on a monochrome MIP screen.

And you're saying I can directly import SVGs into Visual Studio?

Sorry for all these questions, I'm still learning.

the-ninth 8 days ago in reply to 7399462

7399462 said:
And you're saying I can directly import SVGs into Visual Studio?

You can use SVG files in the resource definitions and specify the desired resolution via scaleX and scaleY. The compiler will then convert them to bitmaps automatically. If you only target a single device, this is probably the most efficient approach.

In my case, I need to support many different devices. Generating the assets via my own scripts is more efficient and also gives me more control, for example over the anti-aliasing applied during bitmap conversion.

Could you maybe share a screenshot of what you mean by poor quality?