If there is a small, fixed total number of an item to be collected rather than text totals, an effective UI approach is to display placeholder icons (empty or grayed out pictures) to show the user how many of the same item are left to be collected. Each time an item is picked up, a placeholder icon is replaced with a full-color collected icon.
In this recipe, we will use gray-filled star icons as the placeholders and yellow-filled star icons to indicate each collected star, as shown in the following screenshot:
Figure 3.14 – UI showing multiple status iconsÂ
