conversations – your website for deeptalks

Das Projekt Conversations entstand im Rahmen des Moduls Interaktive Medien II an der Hochschule. Ziel war es, eine interaktive Web-Anwendung zu entwickeln, welche über APIs Fragen von externen Plattformen lädt und diese in einem klar strukturierten und ansprechenden Interface anzeigt.

Die erste Version setzte dabei auf ein klassisches Client-Server-Modell, wobei die Fragen aus öffentlichen APIs geladen wurden. Die Designgrundlage wurde in Figma entwickelt, wobei das Hauptaugenmerk auf einer intuitiven Benutzeroberfläche und responsivem Design lag.

Link zur Website: conversations.melinagast.ch

Weiterentwicklung im Rahmen von Digezz
Nach Abschluss des Moduls entschieden wir uns, das Projekt weiterzuführen – unabhängig vom ursprünglichen Auftrag. Inhaltlich und technisch wurde das Projekt grundlegend überarbeitet.
Im Fokus der neuen Version standen folgende Erweiterungen:

• Eigenständige, inhaltlich kuratierte Fragenkataloge
• Eigenentwickelte APIs ohne externe Abhängigkeiten
• Mehrsprachige Inhalte in Deutsch, Englisch und Französisch
• Verbesserte Performance durch statische Datennutzung

Unsere Technologie-Stack

• Frontend: HTML, CSS, JavaScript
• Design-Prototyping: Figma
• Backend: PHP
• Datenhaltung: JSON-Dateien (keine Datenbank)
• Hosting: Infomaniak (Shared Hosting)

API-Design
Die selbst entwickelte API erlaubt es, über URL-Parameter die Sprache (de, en, fr) sowie den Fragetyp (deeptalk, mostlikelyto) zu definieren. Die Antwort wird als JSON geliefert und enthält jeweils eine zufällig ausgewählte Frage. Bei jedem Request wird ein zufälliger Eintrag aus der jeweiligen Fragenkategorie geladen. Dabei merkt sich der Sever, welche Fragen schon vorkamen, damit nicht zweimal die gleiche Frage gestellt wird.

Entscheid gegen eine Datenbank
Auf eine Datenbanklösung wurde bewusst verzichtet, da die Datenmenge mit etwa 200 Fragen pro Kategorie überschaubar ist, nur selten Änderungen an den Inhalten vorgenommen werden und keine Benutzerinteraktionen oder Authentifizierungsprozesse erforderlich sind.

Inhaltliche Entwicklung
Im Rahmen des Projekts wurden zwei unterschiedliche Fragetypen entwickelt:
Zum einen tiefgründige, reflektierende Fragen im Stil von „Deep Talk“, die persönliche Gespräche anregen sollen, und zum anderen humorvolle «Who’s most likely»-Fragen, die vor allem in Gruppensituationen für Unterhaltung sorgen. Insgesamt umfasst der Fragenkatalog rund 400 Fragen in drei Sprachen (Deutsch, Englisch und Französisch).

Der redaktionelle Prozess war vielschichtig und anspruchsvoll. Bei der Erstellung der Fragen wurde grosser Wert auf Tonalität, inhaltliche Tiefe und die jeweilige Zielgruppe gelegt. In mehreren Korrekturschleifen wurden Verständlichkeit und sprachlicher Stil optimiert.

UI/UX und Design
Das Interface wurde mithilfe von Figma gestaltet. Der Fokus lag dabei auf einer klaren Benutzerführung, einem responsiven Layout sowie einem minimalistischen Design, das die Inhalte in den Mittelpunkt stellt. Wichtige Interface-Elemente sind ein Dropdown-Menü zur Sprachauswahl, ein Button zur Generierung neuer Fragen sowie ein Link-Button zur einfachen Weiterverbreitung der Fragen über Social Media.

Marketing & Verbreitung
Um Conversations bekannter zu machen wurde eine einfache Low-Budget-Marketingstrategie umgesetzt. In Figma gestalteten wir einen Flyer mit QR-Code der direkt auf unsere Website führt. Der Flyer wurde farbig, plakativ und gut verständlich gestaltet, damit er auf dem Campus und bei Veranstaltungen Aufmerksamkeit erregt. Zusätzlich verschicken wir die Flyer digital über Kanäle wie Instagram und WhatsApp-Gruppen, um auch online Menschen zu erreichen. Ziel war es, die studentische Zielgruppe direkt visuell anzusprechen, schnell erfassbar und mit direktem Zugang zur Plattform.

(vha)