Kursbeschreibung

Im Kurs „Mashup! vol. 2“ bei Paul Thiele beschäftigten wir uns mit der Methode verschiedene Apps zu analysieren und ausgewählte Inhalte zu einer neuen, einzigartigen App zu synthetisieren. 

Die App Oink Bank ist unser Ergebnis und wird im Folgenden gemeinsam mit dem Designprozess vorgestellt.

Kontext und Problem

Vielen Menschen fällt Sparen schwer. Es fehlt die Motivation, es ist anstrengend und man braucht viel Disziplin. Direkte Belohnungen fehlen, wie etwa die Glücksgefühle nach einem Kauf. Außerdem verliert man schnell den Überblick, denn es gibt viele kleinere verschiedene Apps fürs Sparen, manche führen noch in einem Notizbuch über ihre Finanzen Buch und so ist alles an verschiedenen Orten.

How might we?

Von daher stellten wir uns die Frage:

Denn Spiele sind da um Spaß zu haben und unser Ziel ist, dass das Sparen zur Nebensache beim Spielen wird. So nimmt man den Druck weg und erschafft ein neues und unbekümmerteres Setting - Perfekt!

Mash up!

Unser Mashup ist eine mögliche Antwort auf diese Frage. Unsere App kombiniert die App N26 mit der Tamagotchi App bzw. die Kategorien Finanzen und Gamification.

Unsere Recherche

Wir orientierten uns an drei Apps: die Tamagotchi App, Duolingo und N26. Die ersten zwei Apps gaben uns viel Inspiration für die verschiedenen Gamification Methoden und N26 wählten wir, weil es eine mobile Bank ist, die sich auf die Kontoführung per Smartphone spezialisiert hat und über sogenannte „Spaces“ verfügt, die wir in ähnlicher Form auch bei Oink Bank miteingebracht haben.

App 1: My Tamagotchi Forever

Diese App ist ein virtueller Haustiersimulator und ist die moderne Smartphone-Version des klassischen Tamagotchis. In der App kümmert man sich um sein Tamagotchi, spielt Minispiele und Rätsel.

Wir haben diese App in unser Mashup miteinbezogen, da wir auf dem Spielprinzip eines virtuellen Haustiersimulators aufbauen möchten und weil in der App einige Gamification Methoden zu finden sind.

Übernommene Mechanismen (Gamification & Behavioral Design):

• Virtuelles Haustier mit Bedürfnissen, die erfüllt werden müssen. Bei den Bedürfnissen handelt es sich um Spaß, Hunger, Toilettengang und Schlaf. Für jedes Bedürfnis gibt es einen Raum (zum Beispiel wird das Bedürfnis Hunger in einer Küche an einem Esstisch erfüllt). Das Spielprinzip und die Bedürfnisse wurden übernommen, außerdem orientierten wir uns an das Game UI.
• Mechanismen für Motivation: Tägliche Belohnungen, Belohnungen beim Sparen, fiktive In-App Währung, Itemshop und virtuelle Güter.

App 2: Duolingo

Duolingo ist eine kostenlose Sprachlern-App, die auf spielerisches Lernen setzt. Im Fokus stehen hier unterhaltsame und spielerische Lerneinheiten.

Da die App dafür bekannt ist, dass sie aus einer sonst oftmals trockenen und anstrengenden Aktivität wie das Erlernen einer Fremdsprache eine spaßige und süchtig machende Aktivität gemacht hat, haben wir uns auch hier inspirieren lassen und einige Gamification Methoden übernommen. Denn auch wir haben das Ziel eine bisher anstrengende Sache zu einem Kinderspiel zu machen.

Übernommene Mechanismen (Gamification & Behavioral Design):

- Ziele setzen: In Doulingo kann man sich die Zeit, die man täglich für das Lernen aufwenden möchte, setzen. Zur Auswahl stehen vier Stufen zur Verfügung, die von „Entspannt“ mit 5 Minuten pro Tag zu „Verrückt“ mit 20 Minuten pro Tag reichen. Das Tagesziel lässt sich jederzeit ändern.

Bei Oink Bank hingegen, kann man sich das gewünschte tägliche Sparziel (zum Beispiel 5€ pro Tag) individuell setzen und jederzeit anpassen.

• App-Maskottchen: Duo ist das gefiederte Maskottchen der Sprachlern-App und trägt zum Charme der App bei.

Oink Banks Maskottchen ist „Piggy“: Ein süßes, kleines Schweinchen.

• Positive Feedback Messages: Wenn man eine Aufgabe richtig gemacht hat, erhält man ein positives Feedback (z.B. „Excellent!“) mit grünem Text und klickt anschließend auf Fortsetzen. 

Auch wir verwenden viel positives Feedback. Ausgeschmückt mit einem glücklichen Piggy mit Partyhut und Konfetti, holt man sich bei diesem Screen seine Belohnung ab und kann mit Belohnung im Inventar fortfahren.

App 3: N26

N26 ist eine deutsche Direktbank mit Sitz in Berlin und hat sich auf die Kontoführung per Smartphone spezialisiert. Die Zielgruppe ist eine etwas jüngere, denn knapp 60% der Kunden waren im Jahr 2017 unter 35 Jahre alt.[1] Im Gegensatz zu vielen anderen Bank Apps, hat N26 ein sehr modernes und schlichtes Design mit pastellfarbenen Akzenten.

Aus diesen Gründen wählten wir für unser Mashup die App N26 um einige Aspekte im Bereich Finanzen und Sparen zu übernehmen.

Übernommene Mechanismen (Finanzen):

• Total Balance: Für eine Banking App ist die Einsicht des Kontostandes unabdingbar. Diese ist bei N26 auf dem Homescreen und bei den Spaces im oberen Bereich mit fetter und großer Schrift zu sehen.

Bei Oink Bank ist nicht der Kontostand, sondern der Sparstand als große Zahl zu sehen. So behält man den Überblick und man kann sich an der wachsenden Zahl erfreuen.

• Spaces (Sparziele): Es gibt bei N26 die Möglichkeit „Spaces“ zu erstellen. Dabei handelt es sich um Sparziele, die man festlegen kann. Diese kann man benennen (z.B. „Holidays“, weil man für den Urlaub eine bestimmte Menge sparen möchte) und die zu erreichende Summe angeben mit optionalem Zieldatum. 

Sparziele sind in unserer App eines der grundlegendsten Features. Wie bei N26 können bei Oink Bank verschiedene, parallel laufende Sparziele erstellt werden und auf diese wird das Geld übertragen. 

• Pay-Funktion mit Aufrundung: Mit den Round-Ups kann man beim Bezahlen mit der Karte die Beträge automatisch aufrunden und diesen Betrag in ein Space übertragen lassen.

Diese Funktion haben wir als Zusatz-Feature bei Oink Bank übernommen. Die Beträge teilen sich standardmäßig auf alle Sparziele auf. Zusätzlich gibt es bei uns die Möglichkeit ein Sparziel zu priorisieren, dann fließen alle Restbeträge in das festgelegte Sparziel.

Weitere Features

• Social Influence: Wenn man bei Oink Bank ein Sparziel erreicht hat, kann man das mit seinen Freunden z.B. in Form eines Facebook Posts teilen.

User Story

Bei der Konzeption haben wir uns eine User Story ausgedacht, damit Logikfehler vermieden werden und die App mit einem Fallbeispiel getestet werden kann. Die User Story ist auch in dem Prototype Video eingebracht. 

Unsere Userin trägt den Namen Anne Bauer und ist 25 Jahre alt. Sie studiert und hat neben ihrem Studium auch einen Nebenjob. Auch wenn sie sich oft mehr Geld wünscht, kommt sie noch gut durch die Runden und hätte die Möglichkeit am Monatsende etwas Geld zurückzulegen. Jedoch kriegt sie sich nicht motiviert und lässt sich dann doch zu oft verleiten, lieber etwas zu kaufen, was sie eigentlich nicht braucht. Der Wille zu sparen ist da, nur die Umsetzung ist bisher gescheitert und deswegen wünscht sich Anne am liebsten jemanden, der ihr den Druck, den sie sich selbst macht abnimmt und der ihr bei ihren Sparzielen hilft. 

Anne spielt in ihrer Freizeit gerne Videospiele, dabei sind auch einige Mobile Games. Die Faszination für Spiele hatte sie schon seit frühen Jahren, so erinnert sie sich wie sie in ihrer Kindheit auch einen Tamagotchi hatte.

In den sozialen Medien ist Anne ziemlich aktiv und postet täglich Bilder, Gedanken oder teilt ihre Gaming Erfolge mit ihren Freunden.

Unsere Lösung: Oink Bank!

Unsere App richtet sich an Menschen wie Anne. Also die jenigen, die sparen möchten, aber sich bisher schwer damit getan haben. 

Sparen fühlt sich bei Oink Bank wie ein Spiel an und geschieht mühelos. Oink Bank ist mit dem eigenen Bankkonto verknüpft und die In-Game Käufe (wie z.B. das Essen für sein virtuelles Haustier) sind keine echten Käufe. Die angegebenen Geldbeträge werden bei einer Transaktion vom Hauptkonto in ein angelegtes Sparkonto übertragen. Man gibt also sein Geld nicht aus, sondern legt es für sich selbst zurück.

FUNKTIONEN

• Virtuelles Haustier: Lerne Piggy, dein süßes virtuelles Haustier, kennen und ziehe es groß. Kümmer dich um ihn, indem du ihn fütterst, mit ihm spielst, ihn wäscht, usw. 
• Item Shop: Im Itemshop kannst du viele verschiedene Items kaufen. Durchsuche die Kategorien Essen und Trinken, Tapeten und Böden, Möbel, Kleidung und Weiteres. Das Beste ist: anstatt Geld auszugeben, sparst du es!
• Personalisierung: Wenn du dir Items wie eine Tapete oder ein Kleidungsstück besorgst, veränderst du damit das Aussehen der Wohnung oder das Aussehen deines Piggys. Nur zu: tob dich aus und verleihe dem Spiel deinen persönlichen Look!
• Daily Rewards und eine Sparstreak: Wenn du täglich am Ball bleibst, wirst du nicht nur später von deinem Geldbeutel belohnt, sondern erhältst auch direkte Belohnungen von uns. Dein tägliches Login sichert dir eine tägliche Belohnung in Form von Piggy Coins (die In-App Währung von Oink Bank) oder zufälligen Items. Mit jedem Tag Sparen wird deine Sparstreak größer.
• Sparziele: Setze dir deine Sparziele, indem du ihnen einen Namen gibst (z.B. „Urlaubsgeld“), die gewünschte Summe angibst und dich für einen Zeitraum festlegst, in dem du diese Summe erreicht haben möchtest. So hast du alle deine Ziele im Überblick und kannst sofort einsehen, wie weit dein Sparfortschritt ist.
• Pay-Funktion mit Aufrundung & Priorisierung: Mit der Pay-Funktion kann man z.B. im Supermarkt mit der App zahlen und der Betrag wird automatisch aufgerundet und das Restgeld kommt aufgeteilt auf deine Sparziele an. Du hast aber auch die Möglichkeit ein bestimmtes Sparziel zu priorisieren, dann gelangen die Restbeträge auf das eine Sparziel. 
• Sharing auf Social Media: Teile deine Erfolge mit deinen Freunden auf Social Media. Wenn du ein Sparziel erreicht hast, hast du die Möglichkeit dein Ergebnis via eines vorgefertigten Posts auf den gängigen Social Media Plattformen zu teilen.

Prototype Video

Unser Prototyp-Video greift die User Story von Anne nochmals auf und zeigt wie die App in Benutzung aussieht. Im Video sieht man wie Anne die App zum ersten Mal öffnet, einrichtet und ausprobiert und wie sie schon wenige Monate später riesigen Erfolg hatte.

Passwort: oink

Das ist der User Flow für den ersten Gebrauch. Nach einer kurzen Registrierung, folgt die Anmeldung. Man wählt seine Bank aus und loggt sich mit seinen Online Banking Daten ein. Wenn das erfolgreich war, kommt man auf dem Home Screen und erhält eine In-App Notification, die bestätigt, dass das Konto erfolgreich hinzugefügt wurde.

Hier sieht man Screens aus dem Piggy Game, unserem Home Screen. Oben rechts ist stets der PiggyCoin-Stand zu sehen. Man kann mit den Pfeiltasten zwischen den verschiedenen Räumen navigieren, alternativ tippt man auf die verschiedenen Bedürfnisse, die dich zu den entsprechenden Räumen führen. Man sieht die Bedürfnisleiste von Piggy und der runde grüne Button führt einen zum Itemshop. Im Beispiel sieht man, wie der Kauf der lilafarbenen Tapete das Zimmer optisch verändert. Das gekaufte Essen, kann auf dem Esstisch serviert werden. Einige Objekte im Raum wie z.B. der Kühlschrank oder das Bett sind interagierbar.

Zu Beginn sieht der Screen „Plan“ noch etwas leer aus. Das lässt sich jedoch schnell ändern, indem man ein neues Sparziel setzt. In dem Beispiel ist es das Ziel 500 Euro innerhalb der nächsten vier Monate für Notfälle zu sparen. Daraufhin hat man gleich im Anschluss die Möglichkeit eine beliebige Summe auf das Sparkonto zu überweisen. Für jede Überweisung auf ein Sparziel erhält man für jeden Euro zwei PiggyCoins, also wenn man 50 Euro überwiesen hat, erhält man 100 PiggyCoins, die man sofort für das Spiel ausgeben kann. Außerdem gibt es einen Screen, auf dem die täglichen Belohnungen, die individuelle Spar-Streak und dem Fortschritt für das eigene Tagesziel einzusehen sind.

Links ist die Pay Funktion zu sehen. Hier sieht man die hinzugefügte Karte, mit der man per Smartphone zahlen kann. Darunter sieht man seine letzten Transaktionen und das jeweilige Ersparnis auf einem Blick. Falls ein Sparziel priorisiert wurde, sieht man unten eine Flamme und den Namen des priorisierten Sparziels. 

Im zweiten Screen ist der Plan Screen zu sehen, wie er bereits mit Inhalten gefüllt wurde. Klickt man auf „Meine Sparziele“ sieht man die verschiedenen Kärtchen im Überblick. Außerdem kann man seine erreichten Sparziele betrachten und diese mit Freunden auf Social Media teilen. 

Möchte man noch mehr Details zu einem Sparziel einsehen, klickt man auf die Karte. Jetzt kann man das Sparziel noch anpassen, und die Transaktionen einsehen. Außerdem kann man von diesem Screen aus Geld auf das Sparziel überweisen.

Hat man das Sparziel erreicht, gibt es noch mal eine saftige Belohnung und die Möglichkeit den Erfolg mit Freunden zu teilen. In diesem Fall ist es ein Facebook Post.

In-App Währung: PiggyCoins

Die In-App Währung heißt bei Oink Bank „PiggyCoins“. Das eingravierte Symbol in der Münze erinnert an einen Ringelschwanz eines Schweinchens. 

Ein Euro entspricht zwei PiggyCoins.

Wir haben uns für diese Relation entschieden, da sie…

…leicht zu merken ist und man beim Spielen nicht auch noch aufwändige Umrechnungen machen will.

…den Sparstand anonymer machen, denn die App könnte auch unterwegs in der Bahn genutzt werden und nicht jeder möchte, dass Andere ihre Finanzen einsehen können. Bei einer Währung wie PiggyCoins denkt man eher nicht daran, dass das eigentlich der Sparstand ist, sondern dass es nur irgendeine In-App Währung ist. 

…das Gefühl entstehen lässt, dass man etwas dazu gewonnen hat. Denn die Zahl der PiggyCoins ist immer doppelt so groß.

User Flow im Überblick

Prozess

Zu Beginn fertigten wir ganz klassisch Skizzen auf Papier an. Schon früh entwickelten wir die Gestalt unseres Maskottchen. Zu Beginn zeichneten wir verschiedene Screens und überlegten uns den groben Aufbau der App.

Zwischenstand: App Store

Um zu testen ob sich unsere Idee auch gut verkaufen lässt und ob das Konzept schnell verstanden werden kann, haben wir uns in einem noch sehr frühen und unfertigen Stand der App überlegt, wie Oink Bank im App Store aussehen könnte.

Branding

Farbwahl

Bei der Farbwahl haben wir uns für pastellige und sanfte Töne entschieden, die Leichtigkeit und eine ruhige Atmosphäre ausstrahlen. Die Hauptfarbe ist ein helles Rosa, die Akzentfarbe für Buttons ist ein pastelliges Grün.

Logo
Auf dem Logo ist der Schriftzug Oink zu sehen, wobei das O wie ein Ringelschwanz aussieht. Die Farbe des Untergrunds ist das schon erwähnte helle rosa mit einer flachen Schattierung.

Slogan
Im Verlauf des Projekts haben wir mehrere Slogans gefunden. 

„Feed your Piggy and get rich“ „Sparen macht Spaß“ 

und letztendlich haben wir uns für 
„Sparen war noch nie so einfach!“ entschieden.

Maskottchen
Unsere App hat ein Maskottchen, was gleichzeitig das virtuelle Haustier ist. So hat jeder einen ganz persönlichen Bezug und eigene Erfahrungen mit Piggy und das niedliche Aussehen von Piggy bleibt einem im Kopf.

Look und Feeling
Uns ist wichtig, dass sich die Benutzung der App wie ein Spiel anfühlt, obwohl die App auch in die Kategorie Finanzen eingeordnet werden kann. Denn viele Finanzapps sehen langweilig und tabellarisch aus und so entsteht weniger Motivation. Das wollen wir verhindern!

Reflexion und Fazit

Die Frage der Finanzierung

Mit unserem Mashup sind wir auf eine innovative Lösung gekommen, die das Prinzip von In-App Käufen grundlegend verändert bzw. ablehnt. Bei einer Umsetzung würde sich die Frage stellen wie man die App ansonsten finanziert, wenn nicht über die In-App Käufe. Bei entsprechender Bekanntheit könnte man theoretisch eine Kooperation mit N26 oder einer ähnlichen mobilen Bank eingehen, wenn man anbietet, dass die App ausschließlich mit einem Konto der kooperierenden Bank benutzbar ist. So könnte man der Bank neue Kunden einbringen, was oftmals ein Problem bei mobilen Direktbanken ist und diese könnte im Ausgleich dafür die App finanzieren.

Die Mashup-Methode

Die Idee der Oink Bank ist durch die unkonventionelle Methode entstanden mehrere Apps zu einer einzigartigen eigenen App neu zu kombinieren. Diese Methode hat sich als sehr nützlich erwiesen und wir können auch für zukünftige Arbeiten so einiges aus diesem Kurs mitnehmen. Wir sind mit unserem Ergebnis zufrieden und konnten beim Prozess vieles Lernen.