Wie wir die Kosten für Mitel Networks optimiert und das Branding vereinheitlicht haben

Upgrade des Frontend-Stacks auf Angular 2 und Implementierung der Design-Richtlinien von Mitel zur Erstellung eines einheitlichen Angular-UI-Kits, einer Dokumentations-Website und einer Demo-Anwendung für interne Teams.

[ Kunde ]

Über den Kunden

Die Mitel Networks Corporation ist ein kanadisches Telekommunikationsunternehmen, das sich fast ausschließlich auf Voice-over-IP-Produkte (VoIP) konzentriert.

2 Mo.
Umgesetzt in 2 Monaten: 30+
Komponenten mit einheitlichem Styling und unterschiedlichen Einstellungen: 100%
Konsistentes Marken-Design

[ Herausforderung ]

Fragmentierte Benutzeroberflächen als Kostentreiber

Bevor Mitel Networks Kontakt zu Akveo aufnahm, wurden bei der Entwicklung von UI-Anwendungen unterschiedliche Ansätze und Frameworks verwendet. Infolgedessen unterschieden sich einige Produkte optisch deutlich voneinander. Der Kunde wollte einen einheitlichen Unternehmensstil etablieren und entschied sich für Angular 2 als primären Frontend-Stack.

Das Ziel war die Schaffung eines Basis-Frameworks, das von den meisten Teams genutzt werden kann, um Kosten zu optimieren und einen einheitlichen Styleguide für alle Produkte einzuführen.

[ Lösung ]

Entwicklung der Lösung

Leistungsumfang

Mitel stellte AKVEO seinen Styleguide zur Verfügung. Die Aufgabe bestand darin, diese Styleguides in das Angular-2-Template ng2-admin von AKVEO zu übertragen und dabei die bereits in ng2-admin vorhandenen Animationen beizubehalten.

Geplant war daher die Lieferung folgender Ergebnisse:

Ein Angular UI Kit auf Basis des Mitel-Styleguides.
Eine Dokumentations-Website mit Komponentenbeschreibungen und Anwendungsbeispielen.
Eine Demo-Anwendung, die Mitel-Teams als Ausgangspunkt für die Entwicklung neuer Anwendungen nutzen können.

Lösung

Akveo setzte mehrere Projekte um, um die Anforderungen des Kunden zu erfüllen.

Ein auf Angular 2 basierendes Komponenten-Kit nach den Styleguide-Vorgaben von Mitel Networks. Es umfasste: Layout-, Sidebar-, Header- und Footer-Komponenten; verschiedene Formulareingaben; Diagramme; Komponenten für Login/Registrierung; Tabellen; Modale Dialoge; eine eigene Icon-Bibliothek
Eine Dokumentations-Website mit Komponentenbeschreibungen und Anwendungsbeispielen
Eine Demo-Anwendung auf Basis von ng2-admin

[ Ergebnisse ]

Wirkung, die zählt

Mitel Networks erhielt ein einheitliches Angular-UI-Framework, eine Dokumentations-Website und eine Demo-Anwendung, wodurch Teams konsistente und markenkonforme Produkte schneller entwickeln können.

Einheitliche Marke über alle Produkte hinweg

Alle Produktteams von Mitel nutzen nun ein gemeinsames Angular-UI-Framework, das auf konsistenten Stilrichtlinien basiert und visuelle Inkonsistenzen in der gesamten Produktpalette beseitigt.

Höhere Entwicklereffizienz

Eine Dokumentations-Website mit Komponentenbeschreibungen und Anwendungsbeispielen bietet internen Teams eine klare Grundlage für die Entwicklung neuer Anwendungen.

Angular-UI-Kit bereitgestellt

Akveo lieferte innerhalb von nur 2 Monaten ein vollständiges Angular-Komponenten-Kit, eine Dokumentationsseite und eine Demo-Anwendung und schuf damit für Mitel eine wiederverwendbare Basis für alle zukünftigen Entwicklungen.

[ Tech-Stack ]