Better icons to help differenciate products

[raphodn]

Story

We currently have 4 different "levels" of products

Description	Image (currently)	Idea
Barcode product (in OxF) with image
Barcode product (in OxF) without image
Barcode product unknown
Category product (taxonomy)		find a more fruit-vegetable image ?

In #2161 we started differentiating known & unknown barcode products (changing the icon color to red).
But I feel there is still improvements...

Todo

• differentiate known & unknown barcode products: refactor(Price Card): when product is missing, turn default image to red #2161
• find another image for category products ?

[raphodn]

the current "default" logo is taken from Open Food Facts's product page
https://world.openfoodfacts.org/product/5000159560061/snickers

there are other logos on that page that we could use for the "category product"

	screenshot
The one used for nutrients
The one used for ingredients

[julia-gx]

So it’s not about image we want to show, but how fast can a user understand the state and what to do next. 


When it comes to this one:

barcode product missing: show the current default in red? Or a question mark? Or something else?



No red 🙏 (because red=error). What about our warning color? “?” alone can be ambiguous. So maybe some dashed product outline and small “?” badge?

Some design inspiration:

The currently filled products with ? would also be okay, but the ? should stand out visually. And no red.

[julia-gx]

Barcode product (in OxF) without image

An image icon (light gray)

Category product (taxonomy)

Simple apple + carrot combo icon (filled shapes, light gray)

[teolemon]

I like the proposition made by @julia-gx