Website in EN

Development | Design

Viva la No-Code

22.3.22

Komplex. Schnell. Agil. Digitale Produktentwicklung hat sich in den vergangenen Jahren verändert. Neue Tools, Trends und Arbeitsmethoden bestimmen den Markt und damit unsere Denk- und Handlungsweise. Wir tauchen ein in eine Welt in der Innovationen schneller denn je das Licht der Welt erblicken.

No-Code-Wunder Bubble.io

Software-Entwicklung bedeutet sorgfältige Handarbeit resultierend in unzähligen Zeilen Code. Gerade im Company-Building, wenn es darum geht schnell erste Prototypen mit Kunden zu testen, birgt ein klassisches Software-Entwicklungsprojekt daher das Risiko, bis zur Veröffentlichung eines MVPs bereits relativ viele Ressourcen zu investieren. Entgegenwirken sollen dieser Problematik sogenannte No-Code-Plattformen. No-Code (“Kein Code”) bezieht sich dabei auf Tools, die es ermöglichen Anwendungen zu entwickeln, ohne eine einzelne Zeile Code zu schreiben. Der Trend zum programmierfreien Erstellen von Apps und Webanwendungen ist in vollem Gange, wobei besonders ein Tool aus der Masse sticht: die Plattform „Bubble.io“ zeigt mit ihrem breiten Portfolio an Möglichkeiten und der starken Community einen beeindruckenden Entwicklungsstand im Bereich No-Code. Für uns mehr als Grund genug, das Tool genau unter die Lupe zu nehmen.
Lesezeit: ca. 5 Minuten
Triple Diamond

Wenig Code - viele Möglichkeiten

Auf dem Weg zum finalen Produkt durchläuft ein Projekt verschiedene Stufen. Grob umrissen beginnt nach einer Recherche die Explorations- und Ideationsphase. In der anschließenden Konzeptionsphase werden die grundlegende Architektur, Interaktionsabläufe (“Flows”) und grundsätzliche Gestaltungsrichtlinien erarbeitet. Spätestens an diesem Punkt beginnen erste Usertests und damit die Suche nach der Antwort auf die wichtige Frage: Funktioniert die Idee? Interaktive klickbare Prototypen, ausgearbeitet in Design-Tools wie “Figma” sind ein gut geeignetes Mittel, um Aufbau und Logik zu simulieren und einen ersten Eindruck der Grundidee zu vermitteln. Wie viel Potenzial hinter Konzept und Ausarbeitung tatsächlich steckt, lässt sich jedoch erst messen, wenn die Software tatsächlich entwickelt und am Markt getestet werden kann. 

 

War die Übersetzung von Interaktionsabläufen und Designs in funktionale Anwendungen bisher reine Entwicklerarbeit, bieten No-Code-Tools mittlerweile die Möglichkeit, auch ohne Kenntnisse über Programmiersprachen oder Frameworks Apps zu entwickeln. Grundlegend bedienen sich die Plattformen dabei einem grafischen Interface mit einer Reihe an Elementen oder “Bausteinen”, die nach Belieben kombiniert werden können. Während im Vordergrund durch diese Kombination eine funktionale App entsteht, generiert die Plattform im Hintergrund den dazugehörigen Code. Dargestellt werden können dabei Prozesse mit einem einzelnen Flow, aber auch komplexe Anwendungen wie AirBnb, Tinder oder Wikipedia können mit dem Funktionsumfang von No-Code-Plattformen nachgebaut werden. 

Mit Fokus auf die Entwicklung von Apps und Webanwendungen erweckt besonders die 2012 gegründete Plattform „Bubble.io“ unsere Aufmerksamkeit. Für ein vergleichsweise junges Unternehmen legt Bubble.io einen beeindruckenden Entwicklungsstand vor. Sowohl die Plattform selbst, als auch das rundherum gewachsene Ökosystem aus Plugins und Templates leben von der kontinuierlichen Weiterentwicklung, sowohl durch eine stark involvierte Community, als auch durch die Betreibenden selbst.

Bubble.io hat es geschafft, mithilfe von drei Kernfunktionen eine Entwicklungsumgebung mit enormer Flexibilität zu erstellen. Dazu gehören folgende Bereiche: 

  • Design
  • Data
  • Workflow

Im "Design" Bereich lassen sich durch Drag- und Drop Platzierung in kurzer Zeit pixelgenaue, adaptive Interfaces erstellen. Features, wie das Verwenden von eigenen Schriftarten, ein eigener Stylebibliothek und Zugriff auf verschiedene Icon Bibliotheken schaffen hier im Vergleich zu anderen No-Code-Plattformen keinerlei Einschränkungen in der Umsetzung des angedachten Designs. 

Der Bereich „Data“ beinhaltet alle Datenbanken auf die die App Zugriff hat. Bubble.io bietet dabei die Möglichkeit, in der App selbst Datenbanken anzulegen und über deren Cloud zu speichern. Existieren bei einem Projekt bereits Datenbanken, die über Drittanbieter verwaltet werden, können diese dank der vielfältigen Programmierschnittstellen in den meisten Fällen problemlos verwendet werden.

Der Dritte Bereich wird „Workflow“ genannt und stellt die Verbindung zwischen Daten und Design her. Durch vorgegebene Befehls-Bausteine können Funktionen erstellt und somit der App Leben eingehaucht werden. Die Vielfalt an Workflows reicht dabei vom Ändern einer Farbe bis hin zur Registrierung eines neuen Nutzers.

Ergänzt wird die Entwicklungsumgebung von einem Ökosystem aus Plugins und Templates. Diese sind mit wenigen Handgriffen integriert und erweitern die Möglichkeiten von Bubble.io nochmals ein Vielfaches.

Neue Tools, neue Rekorde

Um zu sehen, was die Plattform wirklich kann, haben wir sie dem Belastungstest unserer eigenen Konzepte unterzogen. Auf die Probe stellten wir Bubble.io mit der Entwicklung einer Anwendung, die einen geführten Prozess bei der Identifizierung von Maschinenfehlern und deren effektiver Lösung vermitteln soll. Ein wichtiges Merkmal der App ist die Abgrenzung in zwei verschiedene Benutzer-Bereiche, die auf der Systemebene dennoch miteinander verbunden sind. Auf der einen Seite können registrierte Nutzer eine Bibliothek an Inhalten strukturiert durchsuchen und haben die Möglichkeit, fehlende Inhalte einzumelden. Diese werden im zweiten Bereich durch einen Administrator editiert und schließlich freigegeben. Das Projekt bot die perfekte Gelegenheit, um Interaktionen zwischen Nutzern und den Einsatz ineinander vernetzter Datenbanken zu testen. Wir wollten sehen, ob wir Bubble.io an seine Grenzen bringen können. 

 

Was wir dabei schafften überraschte uns selbst. Innerhalb eines Tages erstellten wir den gesamten Login-Bereich, ermöglichten die Registrierung neuer Nutzer und das Senden einer E-Mail-Verifizierung. Nach einer Woche war die grundlegende Struktur der Benutzeroberfläche in Bubble.io aufgebaut. Nach einer weiteren Woche Arbeit war es bereits möglich Inhalte zu filtern und zu durchsuchen. In Woche drei setzten wir die Administratoren-Umgebung auf und ermöglichten das Einmelden und Editieren von Inhalten.

Die Lernkurve war steil und das Resultat sprach für sich: Anhand grober Designrichtlinien und visualisierter Interaktionsabläufe konnten wir innerhalb von 3 Wochen erreichen, was 2 Entwickler 2 Monate arbeit gekostet hätte. 

Begeistert von den Ergebnissen nutzten wir das Bubble.io Projekt kurzerhand, um unsere Projektidee vor potenziellen Kunden zu präsentieren. Durch den weiten Entwicklungsstand hatten wir nicht nur die Möglichkeit, entwickelte Konzepte und Theorien zu überprüfen, sondern auch die Idee des Projektes überzeugend zu vermitteln. 

To Code or not to Code?

Es hat sich gezeigt, dass Bubble.io perfekt geeignet ist, um bereits im frühen Projektstadium Potenziale zu erkunden. Wir sind unter anderem in der Lage, Fragen nach der Marktakzeptanz mit einer funktionalen App zu beantworten oder UX Probleme frühzeitig zu definieren. So verschiebt der Einsatz von Bubble.io die Aufgaben und Anforderungen, die zukünftig für den Designprozess von Relevanz sein werden. Klickbare High-Fidelity Prototypen (auch: “Clickdummy”) sowie sorgfältig ausgearbeitete Screendesigns für jeden spezifischen Zustand einer App werden in den Hintergrund treten. Bubble.io-Anwendungen können von Designern erstellt werden, was diesen die komplette Design-Kontrolle während der Umsetzung einräumt. Daraus resultiert nicht nur eine erhebliche Zeitersparnis, da die Übergabe des Designs an die Entwickler zu Großteilen wegfällt, auch können Adaptionen blitzschnell umgesetzt werden.

Durch das flexible Arbeiten und den reduzierten Zeitfaktor bietet sich Bubble.io besonders für komplexere Prototypen im Zuge einer ersten Validierung mit echten Kunden sowie für zeit-und/oder budget-sensible Projekte an. An seine Grenzen stößt die Plattform bei sehr komplexen Projekten mit hoher Nutzerzahl und bei Projekten, die besonders hohe Anforderungen an das Backend haben. Da wir Innovationen keine Grenzen setzen wollen, können wir uns daher vorstellen, ein Projekt über die gesamte MVP- und Beta-Phase hinweg mit Bubble.io zu begleiten. Während wir mit einer bereits veröffentlichten App den Market-Solution-Fit optimieren und möglicherweise sogar schon Einnahmen generiert werden, arbeiten wir parallel im Hintergrund an der Entwicklung einer unabhängigen App basierend auf dem Flutter-Framework. Bei steigenden Anforderungen ist es dann möglich, nahtlos zwischen den zwei Anwendungen zu wechseln und so das Optimum aus beiden Entwicklungsmethoden zu gewinnen.  

Unser Resümee lautet: Bubble.io bietet eine wertvolle Ergänzung, um den Innovationsprozess unserer Projekte zu beschleunigen. Wir sehen in der Plattform ein weiteres Werkzeug im V_labs Company-Building Toolkit, das uns vor allem dabei hilft, den zeitlichen Projektablauf zu verkürzen. Durch das Wegfallen der Entwicklungsleistung wird der gesamte Design- und Innovationsprozess erheblich beschleunigt und (zeitliche) Ressourcen geschont. Iterative Schleifen erfordern wesentlich weniger Aufwand und können ebenso flexibel wie schnell umgesetzt werden.

Dimensionen im Vergleich

Praxistipp

Um zu entscheiden mit welcher Technologie Projekt bzw. die aktuelle Phase eines Projektes umgesetzt werden soll, hilft es Antworten auf folgende Fragen zu finden:

  • Interaktivität: Wie interaktiv soll die Lösung sein? Dient sie nur zu Demonstrationszwecken oder soll bereits eine eigenständige Nutzung durch User möglich sein?
  • Klarheit des Konzepts: Wie klar muss das Konzept der Lösung vor Verwendung der Technologie sein? Existiert eine grobe Idee, die erstmalig mit Usern getestet werden soll? Besteht eine genauere Vorstellung der Lösung oder wurden schon Erfahrungen mit bspw. Click-Dummies gesammelt? Oder gibt es bereits ein klares Konzept, welches (mehrfach) validiert wurde?
  • Technische Tiefe & Funktionsumfang: Welche technische Tiefe der Lösung ist erforderlich? Wie viele Funktionen muss die Lösung beinhalten und wie komplex sind diese? Welche Anforderungen bestehen bei der Anbindung von Datenbanken? Wie sensibel sind die verwendeten Daten? Wie ist das Backend aufgebaut?
  • Zeit & Budget: Wie lange hat man für die Umsetzung des Projektes Zeit und wie viel Budget steht zur Verfügung?
  • Nutzer: Welche Nutzer sollen mit der Lösung konfrontiert werden? Soll die Lösung erstmal nur einem Kunden gezeigt werden um Designansätze bzw. ein Konzept zu verdeutlichen? Dient die Lösung zu Testzwecken mit Nutzern? Oder soll die Lösung für Endnutzer sein, welche vollumfängliche Funktionen und finales Design erwarten?
  • Nutzungsdauer: Auf welche Nutzungsdauer ist die Lösung ausgerichtet? Auf kurze Dauer, um einzelne Flows umzusetzen und zu präsentieren oder zu testen? Oder doch auf längere Dauer?

Die Tabelle in Kombination mit den Antworten auf die Fragen soll dabei helfen, die richtige Wahl für ein geplantes Projekt zu treffen.

whitepaper download
Für den Versand unserer Newsletter nutzen wir rapidmail. Mit deiner Anmeldung stimmst du zu, dass die eingegebenen Daten an rapidmail übermittelt werden. Beachten bitte deren AGB und Datenschutzbestimmungen.
Hier ist auch schon dein Whitepaper zum Download...
whitepaper download
Hmm... irgendetwas scheint da schiefgelaufen zu sein.

INTERESSE? FRAGEN?

Danke! Wir haben deine Mitteilung erhalten.
Hmm... irgendetwas scheint da schiefgelaufen zu sein.

über v_labs

Wir begleiten unsere Kunden bei Innovationsprojekten - als Company Builder oder mit verschiedenen Innovation Services (Consulting, Coaching, Rapid Prototyping, IT-Entwicklung). Die 17 Mitarbeiter verfügen über langjährige Erfahrung in Strategie, Online Marketing, Service Design, agilem Projektmanagement und UX-Design.