Icons in CommCare

Why Use Icons?

Icons can be included in menu and form lists. In addition to make an application look much nicer, they also can help with navigation. Here is what menu and form lists look like with icons included:

Icons Best Practices

• Keep it simple - pick a very clear message for each icon and keep it simple. Minimal is best, most people should understand it in a fraction of a second, because that’s how fast they are navigating through the application.

• Make them match - matching colors and images that are all the same style and/or format are key to keeping the User Interface clean and easy to understand.

• Use different colors for each menu - i.e. if you have a “mother menu” the menu icons and all forms might be purple, whereas a “child menu” in the same application would have blue icons for the menu name and all forms.

• Design transparent icons - this will make your icons blend with the standard CommCare background.

• Always review the Multimedia Reference Checker - Before you deploy an app, confirm that all of the multimedia links are complete and have the right file type. You can also find the pixel size of your image next to the link.

Keep in mind, some users are color blind, others might not read at all. Visual clues are a big help, here are some tips!

How to Find Existing Icons