Shopware App Contest 2021 – diese App hat den 1. Platz gemacht

To the English article

Im letzten Jahr fand der Shopware App Contest zum ersten Mal statt. Und auch in diesem Jahr können Entwickler noch ihre Apps einreichen und galaktische Preise gewinnen. Doch was braucht es, um aus dem Contest als Sieger hervorzugehen? In diesem Blogbeitrag erfährst du das aus erster Hand. Unser Sieger Sven Mittreiter stellt seine Gewinner-App vor, bietet Einblicke in sein Vorgehen beim vergangenem Contest und gibt Tipps zur App-Entwicklung generell. Vielleicht kannst du dir den ein oder anderen Tipp abschauen?

Die App „One Page Checkout“ steht ganz oben auf dem Siegertreppchen

Was kann die App?

Zu den wichtigsten KPIs im Online-Business zählt nach wie vor die Conversion Rate, anhand welcher gemessen wird, wie viele Nutzer im Shop auch tatsächlich konvertieren. Die durchschnittlich hohen Bestellabbrüche im gesamten Checkout-Prozess zeigen deutlich auf, dass der Standard-Checkout ein hohes Maß an Optimierungspotenzial bietet. Der User möchte sich nicht länger als nötig mit der Eingabe seiner Daten beschäftigen und möglichst einfach, bequem und schnell die Bestellung aufgeben. 

Mit dem__ „One Page Checkout“__ werden alle bestellrelevanten Schritte wie Kundendaten, Zahlart, Versandart und Bestellzusammenfassung auf einer Seite zusammengefasst dargestellt. Im Vergleich zum Standard-Shopware Bestellprozess, der auf 3 Schritte aufgeteilt ist und jedes Mal das Nachladen der gesamten Seite erfordert, sind Kunden mit „One Step Checkout“ schnell am gewünschten Ziel – dem Bestellabschluss. 

Mit der Lösung von Premsoft haben Onlineshopkunden 

• alle wichtigen Informationen auf einmal im Blick, 
• sind nicht auf schnelle Ladezeiten angewiesen, was gerade unterwegs vom Mobilgerät oft ein entscheidender Faktor ist, 
• und können den Bestellprozess sehr schnell abschließen. Dies kann nachweislich die durchschnittliche Abbruchrate verringern.

Der „One Page Checkout“ ist natürlich responsive und für alle Endgeräte optimiert. Mit über 1.000 Downloads wird das Produkt bereits in sehr vielen Shops genutzt und darf jetzt auch als Shopware App überzeugen. Hier gehts zur One Page Checkout App.

Werfen wir das Licht auf den Programmierer hinter dieser Lösung. 

Der Entwickler hinter der App

Hinter der App steckt das 2015 von Sven Mittreiter gegründete Unternehmen „PremSoft“, dessen Name bereits verrät, worauf es dem Gründer bei der Entwicklung seiner App ankommt. Premium Software. Schon als er mit bereits 16 Jahren das erste Mal programmiert hat, war Sven immer darauf bedacht, alles tausend-prozentig und bis ins letzte Detail durchdacht zu entwickeln. Bugs oder Kompatibilitätsprobleme gehören einfach nicht in ein laufendes System.

Du erkennst beim Lesen Parallelen zu dir selbst? Das ist eine gute Grundlage für die App-Entwicklung für Shopware 6 und deren Erfolg im Shopware Store.

Denn genau mit diesem Anspruch hat es der Entwickler geschafft, zu einem der beliebtesten Verkäufer im Shopware-Store zu werden. Auf die Qualität seines Codes kann man sich genauso verlassen, wie auf seine Serviceorientiertheit. Aber wie fing damals alles an? Sven ist heute 39 Jahre alt und blickt auf eine Laufbahn zurück, die schon früh gezeigt hat, wo seine Schwerpunkte liegen. Mit der Ausbildung zum Fachinformatiker für Anwendungsentwicklung und dem Studium der Wirtschaftswissenschaften B.Sc. hat er sowohl die wirtschaftliche sowie die technische Sichtweise auf den E-Commerce.

Wir sind uns einig, dass es zum Entwickeln einer App nicht unbedingt eines Wirtschaftsstudiums bedarf. Dennoch kann es hilfreich und notwendig sein, sich mit wirtschaftlichen Aspekten auseinander zu setzen.

2009 als Freiberufler für Typo 3 und Magento gestartet, wurde Sven dann 2014 durch eine Kundenanfrage auf Shopware aufmerksam und erkannte das große Entwicklungspotenzial.

Mit der Gründung von PremSoft in 2015 fand auch das erste Plugin von Sven den Weg in den Shopware Store. Seit dieser Zeit ist viel passiert. Das Unternehmen hat sich zwischenzeitlich ein Netzwerk aus Spezialisten aufgebaut und bietet vollumfänglichen Support für die Planung, Entwicklung und Betreuung von Plugins und Apps. Durch die Spezialisierung auf Shopware bieten Sven und sein Team alles rund ums Thema Shopaufbau, Theme-Entwicklung, Relaunch, Betreuung und Optimierung im Bereich Front- und Backend.

Lassen wir an dieser Stelle Sven selber zu Wort kommen und uns einen Einblick in den Entwicklungsprozess und die Struktur seiner Gewinnerapp geben.

Apps und ihr Entwicklungsprozess

Wie vermutlich jedem Entwickler, war es mir besonders wichtig, beim Thema App direkt von Beginn an mit an Bord zu sein. Ich habe mich somit schnell in das Thema eingearbeitet und kann aus meiner eigenen Erfahrung berichten, welche Schritte für die Entwicklung einer App notwendig sind und schnell zum gewünschten Ergebnis führen.

Als Erstes habe ich die Shopware Doku gesichtet, um mich mit dem Prinzip von Apps und den verschiedenen Möglichkeiten vertraut zu machen. Im zweiten Schritt habe ich die Demo App von Shopware angeschaut und zum Laufen gebracht. Um möglichst schnell starten zu können, habe ich hierfür PHP für den "App Backend Server" ausgewählt sowie für einen ersten Test das App Template von Shopware verwendet. Dieses kann man bequem über plattform.sh nutzen. Da aber ein eigener Webserver vorhanden ist, wurde das Template für den eigenen Webserver angepasst und dort hochgeladen. Hierdurch war es möglich, die Shopware Demo App in Betrieb zu nehmen, und ein gutes Bild davon zu bekommen, wie eine App funktioniert und welche Möglichkeiten sie bietet.

Die vorhandene Dokumentation und ein App Template wird von Shopware also bereitgestellt. Die ersten Schritte sind gemacht.

Als Nächstes geht es daran, eine Idee zu finden. Was soll die App können? Was möchte man dem Endkunden für einen Mehrwert bieten? Welche Anforderungen existieren bereits auf dem Markt, in Foren, Gruppen etc.? Der Ideenfindungsprozess kann hierbei genauso ablaufen wie für ein Plugin auch. Ideen findet man z. B. hier: Einträge im Shopware Issue Tracker, Forum, durch coole Funktionalitäten, die man in anderen Shops sieht, durch Kundenanfragen oder auch durch bestehende Funktionalitäten, bei denen man Optimierungsbedarf sieht. Am besten ist es, sich alle Ideen aufzuschreiben und sich dann die Favoriten herauszusuchen. Hat man diese Liste, dann gilt es zu prüfen, welche technischen Anforderungen sich für die Umsetzung ergeben und ob ein herkömmliches Plugin oder eine App besser geeignet wäre.*

Hier steht Sven nun also vor der Entscheidung: App oder Plugin? Wie hat er abgewogen und warum hat er sich für die App entschieden? Wir erfahren es jetzt.

Die Frage lässt sich schnell beantworten: werden lediglich Templates, JavaScript und Sass-Dateien zur Umsetzung benötigt, dann ist eine App besser geeignet, da Apps im Gegensatz zu Plugins nicht nur für Kunden mit self-hosted Plan zur Verfügung stehen, sondern auch von SaaS-Kunden genutzt werden können. Geht es um tiefergehende Funktionen, dann ist zu prüfen, ob sich diese mittels Webhooks und der Rest-API lösen lassen. Ist dies möglich, dann ist ebenfalls eine Umsetzung per App möglich und sinnvoll. Hierdurch lässt sich schnell die Liste der Ideen priorisieren.

Aha. Die Entscheidung liegt also im Umfang sowie der Funktionalität der Anwendung, welche wiederum den zu erreichenden Kundenkreis beeinflusst.

Sehr gut, Sven hat eine Entscheidung getroffen – eine App soll es werden. Doch wie sieht so eine App aus technologischer Sicht aus? Sven verrät es uns.

Technologische Struktur einer App

Apps dürfen grundsätzlich nur aus Templates, JavaScript- und Sass-Dateien bestehen. Wenn hierdurch die gewünschten Funktionalitäten nicht abgebildet werden können, wird ein App-Backend-Server benötigt, auf dem die Logik ausgelagert ausgeführt wird. Hierzu wird sie per API aus der App angesprochen. Ob diese Logik dann mit PHP oder einer anderen Programmiersprache realisiert wird, bleibt dem Entwickler überlassen. Wichtig ist letztendlich nur, dass die Kommunikation mit der App implementiert wird. 

Für das Hosting des App-Backend-Servers ist der Anbieter der App verantwortlich. Das hat den großen Vorteil, dass der Anbieter die technologische Freiheit besitzt, welche Software auf dem Server läuft und mit welcher Programmiersprache gearbeitet wird.

An dieser Stelle kommen die wirtschaftlichen Aspekte zum Tragen. Das Hosten eines Servers und die damit verbundene Verfügbarkeit der App selbst liegen also beim Betreiber der App – bei dir. Somit hast du auch die Freiheit, wie du deine App zur Verfügung stellst.

Wie mit dieser Information aus bestehenden Plugins Apps erstellt werden können, erzählt uns Sven.

Da das bestehende One Page Checkout Plugin Logik mittels PHP-Code enthält, war es für den Transfer auf die One Page Checkout App notwendig, diese zu entfernen bzw. auszulagern. Darüber hinaus ist die Entwicklung einer App vergleichbar mit der Entwicklung von Plugins, bspw. was Informationen betrifft, die darin verarbeitet werden müssen. Der sonstige Aufbau der App, was Templates, Snippets, Sass- und JavaScript-Dateien angeht, ist identisch. Lediglich die Verzeichnisstruktur ist etwas verändert. Wer sich bereits mit dem Plugin-System auskennt, kann also sehr schnell in das App-System hineinfinden.

Das sind ein paar sehr interessante Einblicke gewesen. Lesen wir nun, was Sven für ein Fazit zieht und welche Ausblicke er für sich mitnimmt.

Durch Apps besteht eine gute Möglichkeit, Funktionalitäten für Kunden von self-hosted und cloud-hosted Versionen bereitzustellen. Zum Zeitpunkt der Erstellung des One Page Checkout war es leider noch nicht möglich, bestimmte Daten in der Storefront aus der Shopware Datenbank auszulesen. In unserem Fall waren das Versandarten und Zahlungsarten zur Darstellung auf der Login-Seite. Umso erfreulicher ist die Ankündigung von Shopware, dass es ab Shopware 6.4.8.0 so genannte „App Scripts“ gibt. Hierdurch ist es möglich, Datenbankqueries in Twig-Dateien zu erstellen, Datenbankinhalte auszulesen und in den Twig-Templates zu nutzen. So entstehen viele neue Möglichkeiten. Ab Shopware 6.4.9.0 ist es dann sogar möglich, per „App Scripts“ eigene URL Endpunkte zu definieren und somit Daten sinnvoll auf der Seite nachzuladen. Das praktische an „App Scripts“ ist, dass viele Funktionalitäten auch ohne eigenen App-Backend Server realisiert werden können und somit ein Umweg der Datenspeicherung auf dem eigenen Server entfallen kann.
Inspiriert von diesen neuen Features ist direkt die nächste App von PremSoft entstanden: Eine Gutscheinliste im Checkout, welche bereits im Store verfügbar ist. Auch weitere Apps, die „App Scripting“ nutzen, sind bereits in Planung.

* App oder Plugin – sind das die korrekten Ausdrücke? Eigentlich sprechen wir bei Shopware nur noch von Apps: Apps, die auf dem Plugin-System basieren, oder Apps, die auf dem App-System basieren. Zugunsten der Leserlichkeit, verwenden wir in diesem Blogbeitrag die vereinfachten Termini Apps und Plugins.