Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

...

...

...

...

...

...

...

...

...

Table of Contents

 

 

 

Image Best Practices

In terms of what kinds of images to use to communicate ideas to low-literate users, past research indicates a preference for life-like line drawings over pictures or super cartoonish things (though trade-offs include that photos, for example, may be easier to update.).

Images may have too much detail and be distracting, while cartoon-ish subjects may be baffling to audiences not familiar with the particular style of caricature. The The use of colors and other illustrative effects to highlight the particular area of interest is also helpful (e.g. red on the dress of a black-and-white person to indicate bleeding).

When using illustrations, it is also important to maintain context (e.g. it is better to show a womb with torso, arms, and legs, rather than just a womb by itself.)

Image Sources

You can find some open-source images that you can use in your applications in these places:

  • OCHA Humanitarian Icons - some background on this image set is available here

  • ORB - library of resources developed for Frontline Workers

  • Noun Project - free library of stock images that can be downloaded in many colors

Image Format

Images in CommCare should be formatted as 32 bit PNG files. Transparency is supported on most phones.

...

If you do not see your device in this table yet, or just want to a reliable way to test out different image sizes, a new process to help you do so can be found here. If you determine image sizes that work well for a new phone model, feel free add information to the table.

...

Below are some free tools we have used in processing images.  No guarantee that they will work as they are third-party programs, but we have had good experiences with them.

Paint.net: Free software for editing images. Compatible on PC. 

IrfanView: Free software for re-sizing images and converting among file types.  Can also do re-sizing and conversion in bulk if you have lots of images to process at once. 

Greenshot: Free software for taking and editing screenshots.  Very useful if you want to capture images from documents, websites, or a phone emulator.

Some PDF to Word Converter: Can extract images from a PDF file.

Resize Your Image: can upload individual photos and resize them.