LWL

FreD –
Frühintervention digital und interaktiv erlebbar

Fallen junge Menschen wegen Drogen- oder Alkoholkonsums beispielsweise polizeilich, in der Schule, am Arbeitsplatz oder im Verein auf, folgt eine "gesundheitsbezogene Intervention". Das ist der FreD-Kurs. Der Kurs besteht aus Gesprächen, Übungen, Wissensspielen und Reflexionen, die von geschulten Trainer:innen geleitet werden. Die Jugendlichen erhalten damit die Chance, frühzeitig über ihren Drogenkonsum und ihren Weg dorthin nachzudenken.

Yellow Tree wurde damit beauftragt die erprobten FreD-Kurse zu digitalisieren und in einer interaktiven App anzubieten.

Development
Frontend
Backend
App

Das Ziel

Das Ziel von FreD ist es, eine unterstützende App für Jugendliche zu bieten, die ihnen Zugang zu Informationen über Suchtthemen bietet und ihnen hilft, ein gesundes Verständnis über Alkohol, Drogen und Spielsucht zu entwickeln. Die App zielt darauf ab, Jugendlichen praktische Werkzeuge zur Verfügung zu stellen, um Suchtprobleme zu bewältigen, den Dialog zu fördern und Fragen zu beantworten.

Die Marke FreD

Der gesamte visuelle Auftritt der Marke FreD benötigte eine komplett neue Ausrichtung. In mehreren Workshops wurden der Charakter und die Werte von FreD neu erarbeitet und die Grundlage für die Markenpositionierung gelegt. Das neue Branding ist motivierend, fröhlich und verzichtet auf düstere Farben und ermahnenden Zeigefinger. Das neue Design soll durch Farb- und Formsprache motivieren und die Jugendlichen zum Mitmachen animieren.

Die App

Die Jugendlichen können nun einfach und ortsunabhängig die Kursinhalte allein oder in einer Gruppe erleben. Die App wird sowohl für Android- als auch iOS-Endgeräte angeboten, um niemanden auszuschließen. Das Einbeziehen von Feedbackmechanismen fördert die Motivation und das Engagement der Jugendlichen.

Das UI-Design

Das UI-Design enthält viele interaktive Elemente, die die Nutzer:innen aktiv einbinden und zum Mitmachen anregen, sei es durch Quizze, interaktive Fragen oder andere spielerische Elemente. Das UI-Design für Jugendliche sollte dynamisch, intuitiv und visuell ansprechend sein, um ihre Aufmerksamkeit zu fesseln und ihre Interaktion zu fördern. Kurze und prägnante Texte, die auf die Zielgruppe zugeschnitten sind, erleichtern das Verständnis und sorgen dafür, dass die Informationen schnell erfassbar sind.

Inhalte flexibel zusammenstellen

Die App bietet den Trainer:innen die Möglichkeit die unterschiedlichen Seminare vorher in einem Backend zusammenzustellen und individuelle Kurse aufzubauen. Die komplette Systemarchitektur wurde von Yellow Tree Headless entworfen, um möglichst flexibel Inhalte und Module zu ergänzen. Das Dashboard unterstützt dabei die richtigen Module anhand von Zeit und einer Vorschau zu wählen. Coaches haben außerdem die Möglichkeit, ausgewählte Szenen oder Inhalte über eine Extraansicht, wie z. B. für einen Beamer zu präsentieren wodurch das Engagement der Teilnehmer steigt.

Systemarchitektur

Das Backend läuft über einen Node Server. Wir nutzen GraphQL in Kombination mit Apollo und Express, um eine effiziente Datenabfrage und -manipulation zu ermöglichen. Diese ermöglicht uns, komplexe Abfragen und Datenoperationen mit hoher Flexibilität und Skalierbarkeit durchzuführen. Im Frontend verwenden wir React.js. Für die mobile Interaktion verwenden wir React Native und haben das FreD online Portal in der bestehenden blu:app integriert.