Stellen Sie sich eine Bankanwendung vor. Was siehst du Sicherlich sind dies ein paar Zeilen mit dem Geldbetrag auf Ihren Konten und eine Reihe von schlicht aussehenden Menüs, die Möglichkeiten auflisten, wie Sie dieses Geld irgendwie ausgeben können. Heimeliges Bild. Eine Bankanwendung als Zentrum der Zahlungsaktivität kann mehr. Warum nicht ein Zentrum kultureller Aktivität daraus machen? Transporttätigkeit? Was hindert uns daran, aus einer Bankanwendung einen vollwertigen Assistenten zu machen?
Die Antwort ist einfach: Der traditionelle Look stört uns. Wir von VTB haben zusammen mit dem visuellen Kommunikationsstudio Ampersand beschlossen, eine neue Art von Bankanwendung zu erstellen, die Sie nicht einmal als Bankanwendung bezeichnen können. Damit es das Licht genau in der Form sehen konnte, in der wir es uns vorgestellt hatten, mussten die traditionellen Entwicklungsprozesse geändert werden. Lesen Sie mehr darüber, wie wir das gemacht haben.
Der Ausgangspunkt für den gesamten Prozess wurde wie gewohnt von TK vom internen Kunden festgelegt. Genauer gesagt, die Tatsache, dass
TK im traditionellen Sinne überhaupt nicht existierte . Wir haben wichtige einleitende Anmerkungen erhalten, die dann ergänzt und verfeinert wurden, manchmal direkt während des Projekts: Sie müssen diese Dienste straffen, um dieses Publikum zu erreichen. "Nun, dann lass es uns selbst machen!"
Wir haben zunächst den Hauptwert der neuen Anwendung festgelegt - die Pflege des Benutzers. Unabhängig davon, ob er Kunde der VTB Bank ist. Und hier sind sie bereits mit Widersprüchen konfrontiert.
Tally Kelmi, CEO und Creative Director von Ampersand Visual Communications :
„Entwickler von Bankanwendungen legen großen Wert darauf, eine Zahlung zu tätigen und um sie herum zu tanzen: Damit Benachrichtigungen pünktlich eintreffen, Abschreibungen vorgenommen werden, antwortete der Hilfe-Chatbot. Wir wollten jedoch, dass sich unsere Anwendung um den Benutzer kümmert, da jeder über ihn Bescheid weiß: wann er bezahlt, wo und wie viel. Wir wurden von dem Film "She" inspiriert, in dem die Hauptfigur einen universellen Assistenten hatte, dem er sogar von Gefühlen durchdrungen war. "
Damit eine Anwendung eine solche Rolle im Leben des Benutzers beanspruchen kann, muss sie eine neue logische und visuelle Ebene erreichen. Mit dem Designstudio haben wir die allgemeine Einführung ausgearbeitet:
Um Pinterest und ein Bankprodukt zu
kombinieren , große, lebendige Formen zu erstellen und alles gemäß den natürlichen Szenarien des Lebens eines Menschen zu segmentieren. Es gab also große Segmente, die mit vielen verschiedenen Dienstleistungen gefüllt werden sollten: Kultur, Verkehr, Mein Viertel, Zahlungen und Überweisungen.
Zahlungen und Überweisungen - dies ist nur einer der Abschnitte in unserer Anwendung. Alles, was andere Bankanwendungen im Prinzip bieten, passt dazu. Darüber hinaus hat die VTB eine Vielzahl von Partnern - verschiedene städtische Dienstleistungen, die die Menschen ständig nutzen. Wir wollten es bequem machen, alle diese Dienste über eine einzige Anwendung zu nutzen. Sie finden die Veranstaltung im Bereich Kultur. Fügen Sie es dem Kalender hinzu. Erhalten Sie eine Benachrichtigung, um ein Ticket zu kaufen. Verschieben Sie den Kauf und erhalten Sie später eine weitere Benachrichtigung, um die Veranstaltung nicht zu verpassen. Sie kaufen ein Ticket und die Zahlung fällt in ein einziges bequemes System, zusammen mit Geldstrafen und Troika, die im nächsten Abschnitt bezahlt werden. Wenn Sie die Geldstrafe nicht bezahlt haben, sehen Sie im Abschnitt "Transport" ein rotes Signal. Usw.
Alles für die Benutzerpflege.Wir ziehen Partner an
Wir haben auf großen Konferenzen über unser Konzept und unsere Anwendung gesprochen und dabei die ersten großen Partner gewonnen - YouDo, Take Zaryad, FitMost, Restaurantreservierungsdienste und andere Unternehmen, die VTB-Kunden sind. Unsere Partner sind die Moskauer Regierung und der Active Citizen Service. Hinter ihnen standen weniger örtliche Dienste - zum Beispiel für Spaziergänge mit dem Hund. All dies haben wir im Abschnitt „Mein Quartal“ zusammengefasst.
Natürlich sind wir auf Integrationsprobleme gestoßen.
Tally Kelmi:
„Viele, besonders große Dienste werden von den Entwicklern der„ alten Schule “entwickelt, die die„ menschlichen “Fälle manchmal nicht verstehen. Und ohne dies ist es schwer zu erklären, warum Sie überhaupt eine normale API für die Integration benötigen. Oft haben wir WebView nur für die Arbeit bekommen, und erst dann haben sich die Partner eingeschaltet und eine normale API angeboten. Hier können Sie als Beispiel jeden nennen, der ein junges Team von YouDo-Programmierern ist, die trotz kurzer Erfahrung bereits enorme Erfahrungen gesammelt haben und einen flexiblen Ansatz predigen, der uns nahe steht. Je größer der Service, desto größer sind in der Regel die Integrationsprobleme. “
Zuerst entwerfen
Polina Mikhailova, VTB-Projektmanagerin für My Smart City:
„Schon vor Beginn der Entwicklung wurde klar: Designer verstehen unseren„ Mangel an TK “am besten , weshalb sie eine wichtige Rolle spielen sollten. Wir hatten nur eine Bedingung - um die maximalen Zahlungsverbindungen der Bank in der neuen Anwendung herauszustellen - von der Bezahlung der Schulmahlzeiten bis zu Tickets für Dynamo FC-Spiele. “
Zu diesem Zeitpunkt haben wir Entwickler von
Intervale angeschlossen . Es hat seine eigenen Designer, und Intervale-Entwickler sind es gewohnt, mit ihm zusammenzuarbeiten, aber das Agentur-Team von Ampersand hat uns als Geschäftskunden voll verstanden. Als Ergebnis haben wir ein geografisch verteiltes Team. Ampersand, als Ideologen von der Seite der Projektvisualisierung, gelangte durch viele Iterationen zu einer besseren Lösung. Infolgedessen musste der für VTB-Projekte übliche Wasserfall auf Agile übertragen werden, da das Projekt sonst unmöglich gewesen wäre.
Zu Beginn des Projekts hatte Ampersand einen eigenen technischen Spezialisten, der bei der Erstvalidierung von Designmaterialien half - er prüfte, ob diese überhaupt technisch implementiert werden konnten. Am Anfang gab es natürlich viele gegenseitige Fragen. Die Regelung lautete wie folgt: Die Geschäftsanforderungen wurden von unserer Geschäftseinheit in enger Zusammenarbeit mit Ampersand festgelegt. Dann folgte die technische Koordination, die Entwickler erhielten grafisches Material und die Implementierung wurde fortgesetzt. Und hier begann das Interessanteste: der
Kampf der Designer mit den Entwicklern, der zunächst von einer Trennung stereotyper Arbeitsansätze und einem völligen gegenseitigen Misstrauen begleitet war .
Lückenvorlage Nr. 1: Ein einziger Korb ... für alle Zahlungen
Es ist praktisch, wenn Sie all das in einen Korb legen können. Wie zum Beispiel Zahlungen. Die Designer entwickelten eine Logik, bei der alle geplanten und spontanen Zahlungen in einen einzigen Zahlungskorb fallen. Sofort Bildschirmskizzen erstellt und an die Entwickler übergeben.
Wir alle sind es gewohnt, in Online-Shops einen einzigen Korb zu sehen, der sich auf Dinge konzentriert. Dafür gibt es seit langem etablierte Implementierungspraktiken. Aber in der Bankanwendung? In einem Warenkorb müssen Sie sowohl UTP (Single Payment Documents) und Bußgelder als auch automatische Zahlungen und sogar Tickets für die Aufführung sammeln. Bauen Sie es so zusammen, dass Sie mit einem Knopf alles auf einmal bezahlen oder einfach etwas mit einem einfachen Wisch löschen können. Für Bankanwendungen ist dies ein neuer Ansatz.
Lückenvorlage Nummer 2: Konversations-Chat-Bot in ... "Bankanwendung"
Ein anderes Mal kam ein Bildschirm von Designern zu Entwicklern, auf dem Maxim - unser Chat-Bot - Fragen wie "Habe ich eine Strafe oder nicht?" Beantwortet. oder "Wie ist mein Zahlungsstatus?" Das heißt, Konversationsrepliken. Anschließend wird wie in solchen Szenarien üblich eine vorbereitete Liste von Fragen verwendet. Damit der Benutzer natürliche, bequemere Fragen stellen kann, muss in dieser Phase ein völlig anderer Entwicklungsansatz verwendet werden als in Bankanwendungen. Im Moment arbeiten wir noch an einem Chatbot-Training.
Lückenvorlage 3: Suchleiste ... zum Verwalten der Anwendung
Hier ist ein weiterer „zweifelhafter“ Bildschirm von Designern: Am oberen Rand des Anwendungsbildschirms befindet sich eine Suchleiste, mit der die Anwendung gesteuert werden kann. Genau wie der übliche "Burger" ist in der Nähe. Warum so? Von der Entwicklungsseite ist dies eine bedeutungslose Wiederholung der Funktionalität.
Tally Kelmi:
„Tatsächlich richten sich diese Verwaltungsschnittstellen an verschiedene Benutzertypen. Es gibt "Altgläubige", die bequemer auf das Menü klicken können. Und es gibt "Intuitionen", die bequemer sind, um in die Suche einzugeben, was sie benötigen, und es aus der Anwendung zu erhalten. Schnell und elegant. “
Lückenmuster Nummer 4: um eine Kachel
Der Hauptbildschirm der Anwendung besteht aus Kacheln mit Abschnitten. Unter ihnen befindet sich eine Kachel mit einem Herzen, "Favoriten". Der Benutzer klickt darauf und ... fällt in neue Kacheln. Warum zwei Schichten? Und die Sache ist, dass die erste Ebene der Kacheln immer unverändert bleibt und die gesamte Liste der Anwendungsfunktionen darstellt. Die zweite Ebene der Kacheln ist jedoch bereits dynamisch. Sie wird speziell für jeden Benutzer konfiguriert, je nachdem, was und wie oft er verwendet. Es mag den Anschein haben, als würden die beiden Bildschirme nur verwirren, aber tatsächlich ist dies nicht der Fall - am Ende wird alles ganz intuitiv.
Neue Arbeitsansätze
Alle oben beschriebenen Interaktionsschwierigkeiten wurden nicht umsonst gelöst. Wir und das Design einerseits, Entwickler und Analysten andererseits, kamen schließlich alle zu einem einzigen Algorithmus. Erstens haben wir Geschäftsideen und Anforderungen. Anschließend schauen sich die Designer an, wie diese Idee in das allgemeine Konzept integriert werden kann, und erstellen allgemeine Entwürfe. Wenn klar ist, dass eine Integration erforderlich ist, um die Idee umzusetzen - und dies ist häufig bei Diensten der Fall -, beginnen Analysten parallel zu Designern mit der Ausarbeitung einer API oder eines Protokolls.
Analysten ergänzen die Ideen von Designern basierend auf der tatsächlichen Situation. Zum Beispiel die Zahlung für das Parken. Designer wissen zunächst nicht, welches Format die Kontonummer hat, welche zusätzlichen Informationen benötigt werden - und daher, wie viele Felder dafür benötigt werden. Angesichts dieser neuen Informationen verfeinern Designer ihre Ideen und geben sie zur Implementierung an die Entwickler weiter. In einigen Fällen sind Entwickler der Kurve voraus - und Designer bewerten bereits ihre einleitenden Anmerkungen.
Natürlich zumindest selten, aber es gibt Widersprüche - in diesem Fall stehen wir auf der Seite der Designer, weil wir, wie bereits gesagt,
zuerst entwerfen . Darüber hinaus verfügen unsere Designer über umfangreiche Erfahrung, Vertrautheit und in umstrittenen Momenten erscheint Erfahrung häufig auf ihrer Seite - die von ihnen angebotenen Optionen gehören zu den Best Practices.
Was sind die Vorteile unseres Ansatzes? Gutes Design inspiriert sie laut den Entwicklern. Darüber hinaus gibt es aus Sicht der Funktionalität von Designern ein großes Feedback zu Dingen, an die Entwickler nicht einmal denken. Ja, dies kann zu einer Verlängerung der Entwicklungszeit führen, aber erfahrene Designer können begründen, warum Sie zwei Stunden lang eine benutzerdefinierte Schaltfläche erstellen müssen, anstatt die Standardschaltfläche in fünf Minuten beizubehalten.
Was sich herausstellt
Sie können das Ergebnis unserer Arbeit im
App Store auswerten. Während die Anwendung gerade erst mit Diensten gefüllt wird, gibt es bereits die Abschnitte "Kultur", "Transport", "Zahlungen und Überweisungen", "Mein Viertel" und "Aktiver Bürger". Im Laufe der Zeit wird es durch weitere Funktionen ergänzt - einen Transportplan, eine Staukarte, Parkplätze und Carsharing-Automaten. Der Abschnitt „Sport“ wird angezeigt, in dem die Dynamo FC-Nachrichten veröffentlicht werden, mit denen VTB zusammenarbeitet, und ein Augmented-Reality-Modul wird ebenfalls integriert. Darüber hinaus ergänzen wir die Bewerbung künftig um den Abschnitt „Für Mütter“ mit Informationen zu Restaurants mit Kinderzimmern und einem Menü für die ganze Familie, Veranstaltungsplakaten, Sonderangeboten aus Geschäften usw. Im Bereich „Gesundheit“ können Sie einen Termin mit einem Arzt vereinbaren, siehe Kontakte medizinische Einrichtungen. Jetzt arbeiten wir daran, die Anwendung nicht nur in Moskau, sondern auch in St. Petersburg und schließlich in anderen Städten mit über einer Million Einwohnern zu starten.
Wenn Sie an unserer designorientierten Anwendungsentwicklung oder etwas anderem im Zusammenhang mit My Smart City interessiert sind, freuen wir uns über Ihre Kommentare.