Home

Inhaltliches Briefing

Projektbeschreibung

In diesem Modul entwickelt ihr eine Webapplikation, die auf einer der 3 folgenden APIs zu je einem Themenfeld basiert:

• Themenfeld Musik: Spotify API
• Themenfeld Nahrung: Swiss food composition database API
• Themenfeld Künstliche Intelligenz: Google Gemini API

Anwendungsbeispiele:

1. Spotify: Eine Applikation, die die beliebtesten Songs und Alben aus verschiedenen Jahrzehnten präsentiert. Benutzer können durch die Musikhistorie reisen und erfahren, wie sich Musikstile im Laufe der Zeit entwickelt haben.
2. Food Composition: Eine Plattform, die personalisierte Ernährungspläne basierend auf den Nährwertdaten der Swiss Food Composition Database anbietet. Nutzer könnten ihre Gesundheitsziele (z.B. Gewichtsverlust, Muskelaufbau, spezielle Diäten) eingeben, und die Plattform erstellt darauf basierend maßgeschneiderte Ernährungspläne.
3. AI: Eine App, die die Google Gemini API dazu verwendet, den emotionalen Ton und die Stimmung in Texten zu analysieren. Dies kann in Bereichen wie Kundendienst, Social Media Monitoring und Marktanalysen eingesetzt werden, um die Stimmung von Kundenbewertungen, Tweets oder Support-Anfragen zu verstehen.

Euer Ziel ist es, eine kreative und funktionale Lösung zu entwickeln, die Daten aus der gewählten API konsumiert und einen erkennbaren Mehrwert für die Nutzer bietet. Ihr werdet Ideen entwickeln, daraus ein Konzept und Designs erarbeiten und in einer Webapplikation umsetzen.

Teil des Auftrags ist, dass ihr auf Basis einer der oben beschriebenen APIs eure eigene Fragestellung erarbeitet. In dieser Teiloffenheit liegt eine Vorbereitung auf die Bachelorarbeit, bei der ihr ein selbstdefiniertes Projekt verfolgt.

Folgende Systematisierung kann helfen, euer eigenes Konzept zu positionieren:

• Raum: Lokal – Global – Fiktiv
• Sichtweise: Subjektbezogen (vom Individuum her gedacht) – Gesellschaftsbezogen (von der Gesellschaft her gedacht)
• Daten: primär quantitativ – primär qualitativ – quantitativ und qualitativ
• Kontext/Sprache/Publikum: Wissenschaftlich – Journalistisch – Kulturell

(Die Systematisierung stammt aus vergangenen Durchführungen: https://github.com/digitalideation/studio_webmobile1_2022/wiki)

Projektziele

Ideenfindung

Entwicklung einer innovativen Idee, die auf den gegebenen APIs basiert und dabei eine selbstgestellte Frage oder Thematik bearbeitet.

Konzeption

Erstellung eines inhaltlichen und funktionalen Konzepts, das die inhaltliche Idee (Thema, Fragestellung, Zielgruppe, Story etc.), die Kernfunktionalitäten sowie die Benutzerführung der Webapplikation beschreibt (technisches Konzept, Architektur, Technologien etc.).

Bestandteile Dokumentation:

• Projekttitel (Arbeitstitel, Fragestellung, 250-300 Wörter zur Idee, Was wollt ihr machen? Was interessiert euch daran? Wo verortet ihr das Projekt?)
• Inhalte, Story, Datensätze
• visuelle Referenzen, Skizzen, Tests mit API,
• Projektarchitektur mit Diagramm
• Requirementsanalyse (User Stories, FR, NFR)

Design

Entwicklung von Designvorlagen, bestehend aus einem vollständigen Styleguide, einer Komponentenbibliothek und aller relevanten Views.

Technische Umsetzung

Implementierung der Webapplikation auf Basis des erstellten Konzepts und des Designs unter Einbindung einer der bereitgestellten APIs.

Präsentationen

Ihr präsentiert euren Prozess in drei Phasen:

• Konzeptpräsentation nach Abschluss der Konzeptphase
• Zwischenpräsentation während der Umsetzung
• Abschlusspräsentation nach Abschluss des Projekts

Die Termine sind der Agenda zu entnehmen.

Vorgehensweise

API-Auswahl und Analyse

• Wählt aus der Liste bereitgestellter APIs diejenigen aus, die ihr in eurer Webapplikation nutzen möchtet.
• Analysiert deren Funktionalität und Einsatzmöglichkeiten.

Ideenfindung und Konzeption

• Brainstormt mögliche Anwendungen, die auf den gewählten APIs basieren.
• Definiert die Zielgruppe, den Nutzen und die Hauptfunktionen eurer Anwendung (User-Stories)
• Erstellt ein Konzeptdokument, das die Idee, die API-Integration, die Benutzerführung und die technische Architektur beschreibt
• Entwickelt erste Prototypen oder Mockups der Benutzeroberfläche, um eure Ideen visuell zu testen und zu verfeinern.

Design

• Entwickelt zunächst Moodboards um den Look & Feel des UIs festzulegen.
• Legt eine Komponentenbibliothek in Figma/Sketch an, wo ihr die Styles eurer interaktiven Komponenten und deren verschiedenen States definiert.
• Entwickelt/gestaltet auf Basis der Bibliothek sämtliche relevanten Ansichten und Layouts (Views) eures User Interfaces (UI).

Entwicklung

• Setzt die Webapplikation mit aktuellen Webtechnologien gemäß Konzept & Design um.
• Testet die Applikation kontinuierlich, um sicherzustellen, dass alle Funktionen einwandfrei arbeiten.

Abschlusspräsentation

Präsentiert eure Applikation vor der Gruppe. Erläutert die Idee, das Konzept und den Prozess der Umsetzung. Geht dabei auch auf die Herausforderungen ein, die ihr während des Projekts gemeistert habt.

10 Tipps für eine gute Projektpräsentation von Andres