The George Institute for Global Health is a health and medical research institute whose mission is to improve the health of millions of people worldwide. One of it’s flagship products, Foodswitch, lets people scan food products to better understand their nutritional content, and make more informed choices in their diet.

Available in 8 countries, the service relies on the companies independent and comprehensive data set of every food product in the country, which also has a stream for crowdsourcing new data. After successful a grant bid, The George Institute for Global Health had to design a new data collection app to expand into India.

The starting point

The team had already created a data collector app, as a companion of their core Foodswitch app. Some usability and flow issues aside, the biggest issue was it couldn’t be sued to collect anything without a barcode, and relied on lots of heavy text English cues to understand how to use it.

Tutorials in the previous app were very text heavy, with no visual cues for how to progress to the next step

Designing for context in India

Potential language barriers aside, the physical context of data collection in India introduced lots of new design considerations. The normal process is to scan the product, take a picture, and confirm it’s details. However products in Indian markets could be stacked out of reach (requiring assistance to capture them), grouped in high volume containers (like rice or spices), or with lighting conditions too low to take good enough photos. Grouping these concerns allowed us to design for common paths, and start thinking about what defaults we could include to save them time, and remove the decision making process (and by association errors) from them into the app.

Balancing data quality & speed

At the core of the project was trying to balancing the constraints of the highest quality data, collected in the shortest time possible. Skew too much towards fast collection, and what was collected would take longer to verify with more gaps to fill in. Skew too much towards data quality, and the data collectors in the field would take too long to collect all the food products, and they could miss a grant deadline.

Internally they also wanted this to be quick to build, and easily maintainable across each country that used it. We decided early on, that as much native UI should be used as possible, only using custom if we felt it would significantly further our goal.

Project user flow. Full details obfuscated whilst project is under NDA
Project user flow. Full details obfuscated whilst project is under NDA

End results

The result was an app that could be used with minimal on site training, clear markers for “completed” captured products, and easy paths to fill in the gaps after with the store owner if needed. We designed options to be remembered, so if you’re scanning in an aisle of barcoded products, you don’t need to keep switching it back to “scan”. We also included modes the user could define upfront, like “photos not possible” (say if lighting conditions were really poor), which would then bypass steps they knew wouldn’t be possible.

Note

This product is current being used for data collection in India, and more details will be added to this project after the first grant deadline.

Visual cues were added to key steps, the UI was brought out to be more prominent, with contextual modes to expedite collection
Checklist selection determined the next screen, using large, faster to use inputs, and custom photo capture flow
Summary taught data collectors about completeness of their collections, and made it fast to find missing pieces when consulting shop keepers