PROJEKT ÜBERSICHT: Eine Anwendung, die bei Jugendlichen und jungen Erwachsenen, Politikinteresse, -verständnis und Engagement fördert.


Problem Statement

Jungen Leuten sind politische Themen zu komplex. Sie haben zu wenig Zeit, um sich damit zu beschäftigen. Außerdem fehlt Vertrauen in Politik und auch in eigene Macht diese mitzugestalten.


Mögliche Lösung

Eine Anwendung, die spielerisch und leicht politische Inhalte vermittelt. Angelehnt an die allgemeinen Interessen und den Alltag der jungen Leute. Die Macht Politik einfach mitzugestalten und so das Interesse zu wecken.


Problem Statement

Jungen Leuten sind politische Themen zu komplex. Sie haben zu wenig Zeit, um sich damit zu beschäftigen. Außerdem fehlt Vertrauen in Politik und auch in eigene Macht diese mitzugestalten.


Mögliche Lösung

Eine Anwendung, die spielerisch und leicht politische Inhalte vermittelt. Angelehnt an die allgemeinen Interessen und den Alltag der jungen Leute. Die Macht Politik einfach mitzugestalten und so das Interesse zu wecken.

Design Prozess

Design Thinking - UCD (User Centered Design) Ansatz

Empathize Define Ideate Design Test Eingrenzung der Zielgruppe 15-25 Jahre Nutzerinteressen (neu) ausarbeiten Anpassung der Navigation & Steuerelemente Umfrage mit 30 Teilnehmenden Kai Kira und Tim als drei verschiedene Personas User-Flow der Anwendung Onboarding für Interessendefinition Stil & Prototyping Usability Test mit der Zielgruppe
Empathize Eingrenzung der Zielgruppe 15-25 Jahre Umfrage mit 30 Teilnehmenden Define Kai, Kira und Tim als drei verschiedene Personas Ideate Nutzerinteressen (neu) ausarbeiten Onboarding für Interessendefinition Design Anpassung der Navigation & Steuerelemente User-Flow der Anwendung Stil & Prototyping Test Usability Test mit der Zielgruppe

Timeline

Woche 1 Woche 2 Woche 3 Woche 4 Desk Research Survey Auswertung Umfrage User Personas User Story User Journey Map Userflow Mid-Fi Wireframes Inhalte vorbereiten UI Foundation UI Components Hi-Fi Wireframes Prototyp Usability Testing Iteration
Woche 1 Desk Research Survey Woche 2 Auswertung Umfrage User Personas User Story User Journey Map Userflow Woche 3 Mid-Fi Wireframes Inhalte vorbereiten UI Foundation UI Components Hi-Fi Wireframes Prototyp Woche 4 Usability Testing Iteration

Empathize

Desk Research

Bei der Desk Research wurde bereits bestehende Studien und Trendanalysen ausgewertet. Dabei wurde der Fokus auf Entwicklungen der letzten Jahre gelegt, um ein allgemeines Bild des Status Quo zu erhalten. Zudem wurde der Fokus auf das Nutzverhalten von beliebten Anwendungen analysiert.

Umfrage

Eine quantitative Umfrage mit 
32 Teilnehmenden sollte die Einstellung der Zielgruppe noch klarer aufzeigen. Dabei konnten Erkenntnisse aus der Desk Research expliziter untersucht werden. 


Insights

Wirkungslosigkeit von Protesten sorgt für 
Vertrauensverlust in die Politik

__________________________________

Zu viele Themen im Vordergrund und 
schnelle Prioritätswechsel

__________________________________

Kein allgemeines politisches Interesse, 
nur zu ausgewählten Themen

__________________________________

Priorisierung von eigenen Interessen


Insights

Wirkungslosigkeit von Protesten sorgt für 
Vertrauensverlust in die Politik

__________________________________

Zu viele Themen im Vordergrund und 
schnelle Prioritätswechsel

__________________________________

Kein allgemeines politisches Interesse, 
nur zu ausgewählten Themen

__________________________________

Priorisierung von eigenen Interessen

Define

User Personas

Die Erkenntnisse der Umfrage und der Desk Research führten zu unterschiedlichen Ansichten der Zielgruppe in Bezug auf politische Themen. Aus diesem Grund wurden mit Kai und Kira zwei Personas entwickelt, die jeweils ein Bild des politischen Interesses von Jugendlichen und jungen Erwachsenen aufzeigt.

User Story: Kira

Als junge und beschäftigte Person möchte ich meine Freizeit nutzen, um unterhalten zu werden. Wenn ich mich dabei noch über politische Themen informieren kann, ist es gut.

 

User journey Map

Szenario:

Kira sucht die leichte Unterhaltung, um sich berieseln zu lassen. Eine Abwechslung zu ihren anderen Entertainment-Anwendungen mit dem Nebeneffekt, nebenbei sich eine Meinung über aktuelle Themen bilden zu können.

Erwartungen:

  • Aktuelle & interessante Themen
  • Einfach zu bedienen
  • Kurze und knappe Stories für zwischendurch

Phasen:

Entdecken


Auf einer personalisierten Startseite sind unterschiedliche Themenvorschläge.


Sie kann sich durch die verschiedenen Themen scrollen.

Auswahl


Sie findet ein für sich interessantes Thema, mit einem Problem, welches sie

 
Sie ist neugierig geworden und geht auf die Kachel. 

Navigation

 

Kira tippt sich durch die Kachel.


Wird mit unterschiedlichen Infos, Grafiken und Videos unterhalten.

Dive-In


Am Ende hat sie die Möglichkeit, weitere Informationen zu erhalten.

 
In einem Podcast kann sie sich noch mehr über das Thema anhören.
 

Emotionen:


Welche Themen 
interessieren mich?

🤔

 
Ich bin gespannt, 
was dieses Thema mit 
Politik zu tun haben soll.

😮

Es ist Abwechslungsreich Informationen mit verschiedenen Videos und Bildern zu erhalten.

🤩


Ich hoffe der Podcast wird spannend erzählt.

🙂

Szenario:

Kira sucht die leichte Unterhaltung, um sich berieseln zu lassen. Eine Abwechslung zu ihren anderen Entertainment-Anwendungen mit dem Nebeneffekt, nebenbei sich eine Meinung über aktuelle Themen bilden zu können.

Erwartungen:

  • Aktuelle & interessante Themen
  • Einfach zu bedienen
  • Kurze und knappe Stories für zwischendurch

Phasen:

Entdecken


Auf einer personalisierten Startseite sind unterschiedliche Themenvorschläge.


Sie kann sich durch die verschiedenen Themen scrollen.

Auswahl


Sie findet ein für sich interessantes Thema, mit einem Problem, welches sie

 
Sie ist neugierig geworden und geht auf die Kachel. 

Navigation

 

Kira tippt sich durch die Kachel.


Wird mit unterschiedlichen Infos, Grafiken und Videos unterhalten.

Dive-In


Am Ende hat sie die Möglichkeit, weitere Informationen zu erhalten.

 
In einem Podcast kann sie sich noch mehr über das Thema anhören.
 

Emotionen:


Welche Themen 
interessieren mich?

🤔

 
Ich bin gespannt, 
was dieses Thema mit 
Politik zu tun haben soll.

😮

Es ist Abwechslungsreich Informationen mit verschiedenen Videos und Bildern zu erhalten.

🤩


Ich hoffe der Podcast wird spannend erzählt.

🙂

Userflow

Startbildschirm der App Kachelübersicht Scrollt durch Kacheln Wählt eine Kachel aus Geht Kachel durch Möglichkeit weiter ins Thema einzusteigen Geht zurück zur Kachelübersicht Zurück
Startbildschirm der App Kachelübersicht Scrollt durch Kacheln Wählt eine Kachel aus Geht Kachel durch Möglichkeit weiter in das Thema einzusteigen Geht zurück zur Kachelübersicht

Ideate

In kurzen Brainstorm-Sessions wurden Merkmale wie Steuerung, Gestaltung, Aufbau und Interesse genannt, die die Anwendung berücksichtigen sollte. So sollte sich diese an bekannten Social Media Apps orientieren und kurzweilige Unterhaltung beinhalten. Seriosität und das Eintauchen erweitert politisch aktiv werden sollten dabei den Nutzern aufzeigen wie einfach und wichtig es ist in jeglicher Form aktiv zu werden.

Mid Fidelity Wireframes

Alter 18 19 20 21 22 überspringen Geschlecht weiblich männlich non-binär keine Angabe überspringen Interessen Cluster Filter Filter Filter Cluster Filter Filter Filter Cluster Filter Filter Filter überspringen Ich hab Politik-... interesse expertenwissen desinteresse überspringen For you Aktuelles Filter Headline Headline Filter For you Aktuelles Name XY Name XY Name XY Name Filter Headline Headline Filter Alter 18 19 20 21 22 überspringen Geschlecht weiblich männlich divers Keine Angabe Cluster Interessen Filter Filter Filter Filter Cluster Interessen Filter Filter Filter Filter Filter Cluster Interessen Filter Filter Filter Filter Filter For you Aktuelles Filter Headline Headline Filter For you Aktuelles Europawahl 2024 Name XY Name XY Filter Headline Headline Filter
Alter 18 19 20 21 22 überspringen Geschlecht weiblich männlich non-binär keine Angabe überspringen Interessen Cluster Filter Filter Filter Cluster Filter Filter Filter Cluster Filter Filter Filter überspringen Ich hab Politik-... interesse expertenwissen desinteresse überspringen For you Aktuelles Filter Headline Headline Filter For you Aktuelles Name XY Name XY Name XY Name Filter Headline Headline Filter Alter 18 19 20 21 22 überspringen Geschlecht weiblich männlich divers Keine Angabe Cluster Interessen Filter Filter Filter Filter Cluster Interessen Filter Filter Filter Filter Filter Cluster Interessen Filter Filter Filter Filter Filter For you Aktuelles Filter Headline Headline Filter For you Aktuelles Europawahl 2024 Name XY Name XY Filter Headline Headline Filter

Kurz zurück in die 
Define Phase


Iteration

Durch den Fokusverlust während der Ideenentwicklung musste noch einmal zwei Schritte zurückgegangen werden, um die Personas und damit die Zielgruppe wieder greifbar zu machen. Diese sollten im Mittelpunkt der Ideenentwicklung stehen und damit auch deren Interessen. Darauf aufbauend sollte eine Idee entwickelt werden, die zielgruppenrelevante Themen mit politischen Themen vereint.


Iteration

Durch den Fokusverlust während der Ideenentwicklung musste noch einmal zwei Schritte zurückgegangen werden, um die Personas und damit die Zielgruppe wieder greifbar zu machen. Diese sollten im Mittelpunkt der Ideenentwicklung stehen und damit auch deren Interessen. Darauf aufbauend sollte eine Idee entwickelt werden, die zielgruppenrelevante Themen mit politischen Themen vereint.

Design System

Die Farben sollen jung sein und auffallen. Außerdem wurde darauf geachtet, dass diese nicht mit Parteifarben übereinstimmen, sodass Seriosität und Unabhängigkeit der App sichtbar gemacht wird.

Die Schrift wurde aufgrund ihrer guten Lesbarkeit gewählt.

Color

SECONDARY Button / CTA AA (6.8:1) #22B788 AAA #77DEBD AAA #A2F2D8 PRIMARY (Highlight)Text / Button / CTA / Icons AAA #002493 AA (4.53:1) #4D79FF AAA #A4BAFF NEUTRAL Text / (Kachel)hintergrund AAA #111931 AAA #E3E3E3 AAA #A4BAFF ACCENT Backgrounds AAA AAA AAA
SECONDARY Button / CTA AA (6.8:1) #22B788 AAA #77DEBD AAA #A2F2D8 PRIMARY (Highlight)Text / Button / CTA / Icons AAA #002493 AA (4.53:1) #4D79FF AAA #A4BAFF NEUTRAL Text / (Kachel)hintergrund AAA #111931 AAA #E3E3E3 AAA #A4BAFF ACCENT Backgrounds AAA AAA AAA

Iconography

24px & 36px

Typography

H1 / bold
I am a headline
H1 / medium
I am a headline
H2 / bold
I am a headline
H2 / medium
I am a headline
H3 / bold
I am a subheadline
H3 / medium
I am a subheadline

Body 1 / bold
I am a bold bodytext
Body 1 / medium
I am a bodytext
BODY 2 / BOLD / UPPERCASE
I AM A BOLD BODYTEXT
BODY 2 / MEDIUM / UPPERCASE
I AM A BODYTEXT

Button 1 / bold / lowercase
I am a cta button
Button 1 / medium
I am a cta button
BUTTON 2 / BOLD / UPPERCASE
I AM A CTA BUTTON
BUTTON 2 / MEDIUM / UPPERCASE
I AM A CTA BUTTON

Design & Funktion

Die Gestaltung der einzelnen Kacheln bedient sich unterschiedlichen Elementen und reichen von einfachen Bildern bis hin zu Illustrationen oder einem Collagen-Stil. Das sorgt für Abwechslung und Differenzierung der unterschiedlichen Themen.

Eine Kachel beinhaltet ein Thema und verbindet alltäglich zielgruppenrelevante Themen mit einer politischen Bedeutung.

Die navigieren sich circa eine Minute durch eine Kachel, die mit Umfragen, kurzen Videoclips und flüssigen Animationen zum Entdecken einlädt. Bilder und Illustrationen schaffen einen eigenen Stil, der sich an Trends und modernen Visualisierungsformen richtet, dabei aber immer noch seriös wirkt.

Hat der Nutzer bis zum Ende einer Kachel navigiert, stehen ihm weitere Interaktionsmöglichkeiten zur Verfügung. Auf diese Weise dient eine Kachel als Türöffner für relevante Themen, die anschließend in Petitionen, Online Artikeln, Podcasts etc. intensiviert werden können.

Usability Testing

Im Rahmen eines Usability-Tests wurde die Anwendung von zwei Personen der Zielgruppe auf ihre intuitive Nutzbarkeit hin überprüft. Zudem wurde untersucht, ob die Jugendlichen mit ihren Vorkenntnissen die Applikation adäquat nutzen können und diese optisch ansprechend finden.

Navigation durch die Kacheln sollte durch eine Wischgeste erfolgen
Integration von mehr Videos einer weiteren Page
Klares Verständnis von Inhalten der Kachel
Navigation durch die Kacheln sollte durch eine Wischgeste erfolgen
Integration von mehr Videos einer weiteren Page

Klares Verständnis von Inhalten der Kachel

Prototyp

Fazit & Ausblick

Das Projekt bietet in seiner Breite eine gute Grundlage, um mit den Bedürfnissen der Jugendlichen einen leichten Einstieg in das Thema Politik zu bereiten und insbesondere eigene Interessen mit politischen Gegebenheiten zu verknüpfen.

In weiteren Untersuchungen müsste in persönlichen Interviews und User-Tests das Verhalten und die Akzeptanz der Zielgruppe untersucht werden, wenn sich Kacheln den tatsächlichen eigenen Interessen anpassen. Mit einer höheren Zahl an den zu untersuchenden Personen kann dabei ein genaueres Bild entstehen, ob und wie die Anwendung den Effekt in der Masse ausbauen kann.

UX / UI Capstone Projekt
Anna Spinnen-Riemath / Vedast Beese