Introduction
Ce design system documente l'ensemble des composants, styles et patterns développés pour InsectScan, application mobile de scan alimentaire pour détecter les insectes.
Couleurs
Palette naturelle verte évoquant le bio et la santé, avec alertes rouges/oranges pour la détection
Typographie
Typographie système Roboto (Android) et SF Pro (iOS) pour une expérience native optimale
Composants
Bibliothèque des composants UI développés pour l'application mobile
Scanner Camera avec Overlay
Interface de scan avec caméra native Capacitor, overlay de visée pour cadrage du code-barres, feedback visuel et sonore à la détection. Reconnaissance automatique des codes EAN-13/UPC.
Card Produit avec Badge Détection
Card affichant l'image produit, nom, marque et badge de détection coloré (vert=sain, orange=traces, rouge=présence). Tap pour accéder au détail complet des ingrédients.
Liste Historique avec Swipe Actions
Liste des produits scannés avec swipe-to-delete, filtres par statut (tous/sains/insectes) et tri par date. Virtual scroll pour performances optimales sur longues listes.
Modal Détail Ingrédients
Modal on-screen avec liste complète des ingrédients, highlight des insectes détectés en jaune. Fermeture par swipe down/bouton.
Fonctionnalités
Fonctionnalités clés développées pour une expérience mobile native optimale
Scan Instantané de Code-Barres
Intégration native de la caméra via Capacitor pour scanner les codes-barres EAN-13/UPC. Reconnaissance automatique avec feedback visuel et sonore. Requête API instantanée vers la base de données produits avec affichage des résultats en moins de 2 secondes.
Base de Données Produits Synchronisée
Base de données locale SQLite synchronisée avec API backend contenant des milliers de produits. Mise à jour automatique en arrière-plan pour garantir les données les plus récentes. Détection intelligente des insectes alimentaires dans la liste des ingrédients avec algorithme de parsing.
Historique et Favoris Persistants
Sauvegarde locale de l'historique complet des scans avec stockage Ionic Storage. Système de favoris pour marquer les produits fréquemment consommés. Filtres avancés (par statut, date, marque) et fonction de recherche textuelle dans l'historique.
Écrans
Aperçus des interfaces mobile iOS et Android
Performance
Métriques de performance et optimisations techniques mobile