Page MenuHomePhabricator

Pick source for icons
Closed, ResolvedPublic

Description

We need to pick a source for icons for brighmed. We can design our own icons, but I want to leverage others work for most of the icons.

The current OSM Bright fork relies on Maki1 icons, which are no longer being maintained or added to, so there are good reasons to switch. The technical requirements of the icons are

  • Available in SVG
  • Only use SVG features that Mapnik supports
  • Pixel-aligned
  • Simplified for the small scale

A point that may not be obvious is that icons can't simply be re-scaled because they need to be pixel aligned for clarity.

pasted_file (225×228 px, 5 KB)

This is on a 15x15px grid, and if you scaled the icon to a 16x16 grid the edges wouldn't line up with pixel edges and it would become blurry. https://github.com/gravitystorm/openstreetmap-carto/issues/632 contains more details, including more advanced techniques which I don't suggest (custom fonts, externally doing the svg->png conversion at higher quality).

Maki handles this well, with different versions of each icon at 11px and 15px sizes.

In addition to the technical requirements, the cartographic requirements are

  • Avoid excessive detail
  • Avoid perspective
  • No halos
  • Different versions whenever icons of multiple sizes are needed

Some guidelines which have similar requirements:

The major icon collections are

If we were to use Maki1 we should take of maintenance of it and backport the technical and script improvements from Maki2. Maki2 suffers the disadvantage of a risk of making the map look like a Mapbox clone.

I'm not sure what I'm going to use in the short-term since I've started needing icons already.

Event Timeline

Pnorman renamed this task from Pick sourced for icons to Pick source for icons.Jan 17 2017, 4:36 AM
Pnorman created this task.
debt raised the priority of this task from Medium to High.Jan 17 2017, 5:25 PM

Moving this to high - it looks like we should make a decision on which icon set to use soon.

I'm going to try font awesome. It looks like it has the coverage needed.

Another icon set with transport-related icons is Material Design by Google. https://material.io/icons/ (18px, 24px, 36px, and 48px) The smallest icon size is too large

Why can't we upgrade to latest maki?

Pnorman claimed this task.

I ended up going for maki2 because font awesome doesn't do multiple sizes. Icons missing from maki2 are from other sources.

Thanks for the investigation, @Pnorman :)