P3 Workshop – „App-Wireframing – Wie erschafft man ein App-Konzept“
„Ich habe eine tolle Idee für eine neue App.” So oder so ähnlich wirst du das auch schon einmal in einem Gespräch gehört haben oder hast selbst schon einmal mit dem Gedanken gespielt, eine eigene App zu entwickeln.
Passend dazu durften unsere Vereinsmitglieder am 15.10.2020 einen Online-Workshop zu dem Thema “App-Wireframing – Wie erschafft man ein App-Konzept” besuchen und einige interessante Einblicke gewinnen. Dieser Workshop wurde von unserem Kooperationspartner P3 durchgeführt.
Bei Wireframes handelt es sich um einen stark vereinfachten konzeptionellen Entwurf der verschiedenen Screens einer App (Software, Website). Das Konzept beschränkt sich auf die Grundelemente (Button, Eingabefeld, Suchzeile), um ein besseres Verständnis für den Auftrag und die Funktionalität zu bekommen.
Der vierstündige Workshop war in einen theoretischen und einen praktischen Teil aufgegliedert. Nach einer kurzen Vorstellungsrunde der Teilnehmer*Innen berichtete Arne Maqua – IT-Consultant Digital Services – von seinem Arbeitsalltag bei P3 und stellte das Unternehmen, speziell die Digital Service Expertise, genauer vor.
Anschließend wurde in einem Impulsvortrag anhand von Beispielen aus abgeschlossenen Kundenprojekten vorgestellt, wie der Prozess der App-Entwicklung funktioniert. Durch die Mischung aus theoretischen Inhalten und den Erfahrungsberichten aus dem realen Arbeitsalltag konnten die Mitglieder viele interessante Einblicke gewinnen.
Danach ging es an den praktischen Teil des Workshops, in dem das Tool balsamiq.cloud verwendet wurde, um Wireframes zu erstellen. Die Aufgabe bestand darin durch Wireframes ein Konzept für eine unternehmensinterne App eines Konzerns zu entwerfen, um die emotionale Bindung der Mitarbeiter*Innen zu stärken.
Was sind Wireframes?
Bei Wireframes handelt es sich um einen ersten konzeptionellen Entwurf, welcher in der Software- und App-Entwicklung verwendet wird. Der Hauptfokus liegt auf der Konzeption und Struktur des Frontend. Vereinfacht gesagt: Die verschiedenen Screens einer App werden rudimentär skizziert.
Durch Wireframes können Widersprüche und unklare Funktionalitäten früh sichtbar gemacht werden. Außerdem fördern sie das Verständnis für die Problemstellung und erzeugen somit einen Konsens zwischen Auftraggeber und Auftragnehmer.
Mittels verschiedener Wireframes und einer Verlinkung einzelner Elemente kann die Benutzerführung dargestellt werden. Die visuelle Gestaltung und die speziellen Funktionen werden erst in einem späteren Schritt entwickelt.
Created with Balsamiq.
Außerdem unterscheidet man zwischen drei verschiedenen Detaillierungsgraden: “Basic”, “Medium” und “High”. In der Praxis werden die ersten Wireframe-Entwürfe mit dem Detailierungsgrad “Basic” häufig zunächst von Hand auf einem Whiteboard skizziert.
Da es sich bei der Erstellung der Wireframes um einen sehr kosten- und zeitgünstigen Vorgang handelt, kann dieser sehr einfach in einen iterativen Prozess eingebunden werden. Änderungen und neue Anforderungen können sehr dynamisch in den Erstellungsprozess der App eingebunden werden. Dies ermöglicht eine deutlich bessere Zusammenarbeit zwischen Auftragnehmer und Auftraggeber.
Nach einer kurzen Einführung in das Tool balsamiq.cloud hatten die Mitglieder in Kleingruppen 45 Minuten Zeit ihre Ideen zu sammeln und diese in dem cloudbasierten Tool auszuarbeiten. Darauf folgte in gemeinsamer Runde eine Präsentation und Diskussion der Ergebnisse.
Zum Abschluss konnten die Mitglieder weitere Einblicke in die Praxis erhalten, indem Arne Maqua verschiedene Projekte vorstellte und zeigte, wie aus einer ersten Konzeption via Wireframes am Ende eine fertige vollfunktionsfähige App entstehen kann.
Wir bedanken uns herzlich bei Marei Assig und Arne Maqua für die tolle Durchführung des Workshops und die vielen spannenden Eindrücke. Wir freuen uns schon auf die nächste Veranstaltung mit P3!