Icons

What is an icon?

Each of the categories you include in your configuration needs to be assigned an icon, or a small graphic to display to users when selecting a category. You can assign the same icon to various cateogries, or each category can have it's own icon.

How icons are viewed in Mapeo

Categories list with icons in Mapeo Mobile (using the default configuration):

Examples of the icon files from our default configuration can be found here.

Considerations when designing icons

Though creating the .svg icon files requires some knowledge of image editing tools, sketching and brainstorming ideas for icons can be a great way to involve community members and project participants who may not have technical skills. With paper and pencils, groups can come up with ideas for icons to represent each category in your project.

If you're not up for designing your own icon images, there are libraries of images online with Creative Commons licenses that you can draw from.

When designing icons, keep in mind the following:

• Icons are displayed as very small images in Mapeo Mobile (24x24px) and Mapeo Desktop (100x100px). Very simple designs with minimal detail will render more clearly to users.

  • When thinking about size and scale, imagine drawing your icons with a marker on a dime.

• Bold and solid-color lines and shapes will be most clearly visible.

Generating icon files

Once you've settled on the design or concept for your icons, you'll need to generate .svg files required to include as part of the Coding configuration process.

To do so, you can use our online Mapeo Icons Generator, here.

Or, jump to Creating and exporting SVG files using Adobe Illustrator or Creating and exporting SVG files using Inkscape for technical guidelines in generating your own suitable SVG files.

If you do not have skills to prepare the digital icon files, paper sketches can be passed off to someone with technical skills to complete the steps of generating icon files, outlined in Coding configuration.