4 ms·

Genuine question: Why are there so many free/OSS icon sets around? There are these Clarity icons, a short way down on HN on the same day there's a 'Feather' ic

Genuine question: Why are there so many free/OSS icon sets around? There are these Clarity icons, a short way down on HN on the same day there's a 'Feather' icon set, there's Font Awesome, and there are the Glyphicons that come with Bootstrap. This seems like a lot, and I'm wondering what the dynamics are that cause icon-set-designers to say "Hey, we just finished our own set - let's release this!" Is there good publicity? Are they hard to monetize so they may as well give it away and hope for publicity? Are they easy to make so lots of people make them and some fraction decide to give them away? I'd love to get insights from someone who understands this better than I do :)

jaffoneh 9y ago
I can't generalize to everyone's motivation but I can tell you ours when it comes to Clarity. Iconography is an important piece of a design system. Designing iconography that fits within the general look and feel of a design system ends up defining a big part of it especially if that design system is used across many application (within and outside of VMware) as Clarity is being used. With that in mind, we ended up designing our own. Since Clarity itself is fully open source under the MIT license, it only made sense to open source the iconography system itself and the icon set. If you take a look at the link posted, there is also an interesting iconography system behind this (You can read more here: https://medium.com/claritydesignsystem/the-road-to-svg-and-custom-elements-in-clarity-icons-1d691c6cc91 https://medium.com/claritydesignsystem/the-road-to-svg-and-c...). Does not answer your question in general but thought I'll offer our own point of view.
- polymeris 9y ago
  Loving the design, but they look blurry in some cases, like this from your docs: http://i.imgur.com/CBKsCGB.png http://i.imgur.com/CBKsCGB.png Why not use an icon font as most similar projects do?
  - jaffoneh 9y ago
    Thanks for the feedback, polymeris. I'll into why they're looking blurry, I haven't seen that before. As for why not use an icon font, we've actually outlined the research in details here: https://medium.com/claritydesignsystem/the-road-to-svg-and-custom-elements-in-clarity-icons-1d691c6cc91 https://medium.com/claritydesignsystem/the-road-to-svg-and-c...
    - polymeris 9y ago
      That screenshot was taken from Firefox 53.0.3 on Linux/Cinnamon, if it helps. Maybe SVG should support hinting...
      - kapep 9y ago
        Same for Firefox 54.0.1 on Windows 10. The icons look blurry on most zoom levels. On zoom 90% the effect is reversed and the left icon looks ok but the others don't: https://imgur.com/a/AeREO https://imgur.com/a/AeREO
  - zimpenfish 9y ago
    Icon fonts don't degrade gracefully when someone (ie me) disables "let websites use their own fonts". Either you get meaningless letters or those little unicode squares - neither of which are actually useful, of course.
    - smathis 9y ago
      Additionally, icon fonts rely on the PUA to render their glyphs. Given the emoji explosion over the past several years, that PUA is getting harder and harder to assign glyphs to. I can't be the only one that's visited a site on my phone and found emojis where an icon font glyph was meant to be. See probably the most famous example: https://www.etsy.com/teams/7720/bugs/discuss/14559563/ https://www.etsy.com/teams/7720/bugs/discuss/14559563/

jaffoneh 9y ago

I can't generalize to everyone's motivation but I can tell you ours when it comes to Clarity. Iconography is an important piece of a design system. Designing iconography that fits within the general look and feel of a design system ends up defining a big part of it especially if that design system is used across many application (within and outside of VMware) as Clarity is being used. With that in mind, we ended up designing our own. Since Clarity itself is fully open source under the MIT license, it only made sense to open source the iconography system itself and the icon set. If you take a look at the link posted, there is also an interesting iconography system behind this (You can read more here: https://medium.com/claritydesignsystem/the-road-to-svg-and-custom-elements-in-clarity-icons-1d691c6cc91 https://medium.com/claritydesignsystem/the-road-to-svg-and-c...). Does not answer your question in general but thought I'll offer our own point of view.

polymeris 9y ago
Loving the design, but they look blurry in some cases, like this from your docs: http://i.imgur.com/CBKsCGB.png http://i.imgur.com/CBKsCGB.png Why not use an icon font as most similar projects do?
- jaffoneh 9y ago
  Thanks for the feedback, polymeris. I'll into why they're looking blurry, I haven't seen that before. As for why not use an icon font, we've actually outlined the research in details here: https://medium.com/claritydesignsystem/the-road-to-svg-and-custom-elements-in-clarity-icons-1d691c6cc91 https://medium.com/claritydesignsystem/the-road-to-svg-and-c...
  - polymeris 9y ago
    That screenshot was taken from Firefox 53.0.3 on Linux/Cinnamon, if it helps. Maybe SVG should support hinting...
    - kapep 9y ago
      Same for Firefox 54.0.1 on Windows 10. The icons look blurry on most zoom levels. On zoom 90% the effect is reversed and the left icon looks ok but the others don't: https://imgur.com/a/AeREO https://imgur.com/a/AeREO
- zimpenfish 9y ago
  Icon fonts don't degrade gracefully when someone (ie me) disables "let websites use their own fonts". Either you get meaningless letters or those little unicode squares - neither of which are actually useful, of course.
  - smathis 9y ago
    Additionally, icon fonts rely on the PUA to render their glyphs. Given the emoji explosion over the past several years, that PUA is getting harder and harder to assign glyphs to. I can't be the only one that's visited a site on my phone and found emojis where an icon font glyph was meant to be. See probably the most famous example: https://www.etsy.com/teams/7720/bugs/discuss/14559563/ https://www.etsy.com/teams/7720/bugs/discuss/14559563/