15 Screens, vollständiger Scan-Flow, Edge-Cases. Vom Onboarding bis zum ESG-Score-Detail — jeder Screen ist im Forest-Green-Designsystem gestaltet.
15 screens, full scan flow, edge cases. From onboarding to ESG score detail — every screen designed in the Forest-Green design system.
Drei kurze Karten erklären, was ScanFair tut und welche Datenpunkte einfließen. Kein Account, kein Login — direkt los.
Three short cards explain what ScanFair does and what data flows in. No account, no login — start scanning right away.
ScanFair zeigt dir in Sekunden, wie fair und nachhaltig ein Produkt wirklich ist.
ScanFair shows you in seconds how fair and sustainable a product really is.
Erster Eindruck. Brand-Statement und drei Wörter Mission.
First impression. Brand statement plus three-word mission.
Umwelt, Arbeitsbedingungen, Tierwohl, Herkunft — gewichtet und transparent.
Environment, labour, animal welfare, origin — weighted and transparent.
Wie der Score zustande kommt — in einem Satz.
How the score works — in one sentence.
ScanFair ist ein unabhängiges Projekt. Daten bleiben bei dir — keine Profile, keine Verkäufe.
ScanFair is an independent project. Your data stays with you — no profiles, no sales.
Versprechen, das die App auch im Detail einlöst.
Promise that the app delivers on in detail.
Zentraler Scan-Button, Schnellzugriffe, zuletzt gescannte Produkte. Reduziert auf das, was du brauchst.
Central scan button, quick access, recently scanned products. Reduced to what you actually need.
Barcode oder Etikett — ESG-Score in Sekunden
Barcode or label — ESG score in seconds
32 Produkteproducts
14 Markenbrands
Scan-Tile als primärer CTA, Verlauf für schnellen Vergleich.
Scan tile as primary CTA, history for quick comparison.
Vollbild-Kamera mit visuellem Rahmen, klarer Hinweis-Text.
Full-screen camera with visual frame, clear hint text.
Großer Buchstabe für den Gesamteindruck, 8 Dimensionen darunter für die Begründung. Wer mehr wissen will, tippt rein.
Big letter for the overall impression, 8 dimensions below for the rationale. Tap any dimension for the deep dive.
Score-Hero, Top-Dimensionen direkt sichtbar.
Score hero, top dimensions visible immediately.
Andere Dimensionen-Gewichtung, gleicher Visual-Code.
Different dimension weights, same visual code.
Mittlerer Score — differenzierte Darstellung.
Medium score — differentiated display.
Jede Dimension lässt sich aufklappen — mit Datenquelle, Berechnung und kurzer Erklärung. Nichts versteckt sich.
Every dimension can be expanded — with data source, calculation and short explanation. Nothing hidden.
Wie wir den Wert berechnen
How we calculate the value
Wert · Berechnung · Zertifikate · Quellen. Vollständig nachvollziehbar.
Value · calculation · certificates · sources. Fully traceable.
Dieser Barcode ist (noch) nicht in der Datenbank. Hilf mit, ScanFair besser zu machen.
This barcode is not yet in the database. Help make ScanFair better.
Keine Sackgasse — User wird Teil der Datenbank.
No dead end — user becomes part of the database.
Der interaktive Klick-Prototyp läuft im Browser — alle 15 Screens, vollständiger Flow, Edge-Cases inklusive.
The interactive click-prototype runs in your browser — all 15 screens, full flow, edge cases included.
↗ GitHub-Repository ↗ GitHub repository