CREALOGIX: PayEye Setup Wizard
Über das Projekt
Produkt: PayEye - Swiss QR Code Reader: Setup Wizard & Settings
Kunde: CREALOGIX AG
Projektleiter: Riccardo Gubser
Verwendete Technologien: Angular CLI | Angular 5 | RxJS | WebSockets
Partner: in Zusammenarbeit mit unserem Nearshoring Partner im Ausland
Das Kundenstatement
"Das Team von M&F Engineering war in der Lage das PayEye Frontend in der geforderten Qualität und zu den definierten Meilensteinen umzusetzen. Mit M&F haben wir einen Partner gefunden, der im Projekt mitdenkt und auch mal die nötige Extrameile geht, um die notwendigen Resultate zu erhalten.“
Thomas Fischler, Project Manager bei CREALOGIX AG
Der Kundennutzen
- Intuitiver Wizard durch Outsourcing des Web-Designs, der Umsetzung und des Tests des PayEye Frontends.
- Schnelle, parallele Umsetzung des PayEye Backends durch CREALOGIX und des PayEye Frontends durch M&F Engineering dank guter Kommunikation.
- Kurzfristige Kundenwünsche dank agiler Vorgehensweise seitens M&F Engineering AG.
- Klare Aussagen zur Web-Usability vor der eigentlichen Web-Programmierung mit Hilfe von klickbaren Prototypen
Das Projekt
Die Firma CREALOGIX AG bringt mit «PayEye» das Nachfolgeprodukt des beliebten PayPen auf den Markt. PayEye erlaubt dem Kunden sicher und fehlerfrei mit nur einer Handbewegung die Codierzeile des orangen Einzahlungsscheines zu erfassen und ist schon bereit für die blitzschnelle Erfassung des neuen Swiss QR Codes, welcher ab Juli 2020 die ESR-Einzahlungsscheine ablösen wird.
Die Aufgabe von M&F Engineering war die Umsetzung eines Setup-Wizards und des Einstellungsdialogs (Settings) für PayEye. Das Setup muss sowohl auf Windows, als auch auf Mac basierten Betriebssystemen lauffähig und im Design absolut identisch sein. Ebenfalls soll die Erstinstallation einen Standard-Workflow ausweisen, welcher für 80% der Benutzer selbsterklärend funktioniert. Hilfe und Support Inhalte sollen auf der Cloud gehostet und einfach aktualisiert werden können. Benutzeroberflächen sind gemäss dem CI/CD von PayEye zu designen und die gesamte Applikation muss mehrsprachig sein.
Die Lösung
Aufgrund der geforderten Kriterien hat M&F sich dazu entschieden das Frontend mit Webtechnologien umzusetzen. Das Backend wurde von Crealogix in QT entwickelt. Die anzuzeigenden Parameter werden mittels QWebChannel und Websockets an das Frontend - welches in einer QtWebEngine läuft – übergeben und dargestellt. Als Programmiersprache für das Frontend wurde Angular 5 eingesetzt.
Die Software muss von jedem PayEye Kunden von der Produkteseite heruntergeladen werden und läuft nach der Installation als SystemTray Applikation im Hintergrund.
Für das Design wurden die CI/CD Richtlinien des PayEye Produktes verwendet. Dazu wurde ein Top Down Approach gewählt, bei welchem wir in einem ersten Schritt Screendesigns in verschiedenen Varianten entworfen haben. Nach der Selektion des Designs wurde ein klickbarer Prototyp in Invision erstellt und danach ausprogrammiert.
Die komplette Umsetzung des Projektes wurde agil gemacht.
Weitere Projektbilder
