BMW Financial Services

Route naar de mobiliteit van de toekomst

  • Design system
  • Java
  • Front-end

Martijn is front-end developer bij Divotion. Samen met Mylene werkt hij voor Alphabet, een merk van de BMW Groep.

Route naar de mobiliteit van de toekomst

Zorgeloos onderweg. Dat is de belofte van leasemaatschappij Alphabet, een merk van de BMW Groep. Een grootse belofte, want in onze moderne maatschappij wordt mobiliteit steeds breder dan zakelijke leaseauto’s en openbaar vervoer. De veranderende mobiliteitsbehoefte past bij de moderne en steeds kritischer wordende (zakelijke) consument. Het is dus van groot belang dat de softwareoplossingen van Alphabet aan hoge eisen voldoen. Divotion is sinds 2015 betrokken bij de front-end development van Alphabet en draagt bij aan een optimale gebruikerservaring en een consistente look en feel van de software.

Om aan de veranderende mobiliteitseisen te voldoen voerde Alphabet eind 2021 een rebranding door. Een nieuw logo, nieuwe huisstijl en merkbelofte: "Your Mobility. Made Easy". Een stap die voor een betere gebruikerservaring moet zorgen, maar ook één die invloed heeft op alle systemen binnen Alphabet. Van de lease-configurator tot Alphabet’s AlphaGuide app. De consultants van Divotion zijn bij Alphabet betrokken bij de ontwikkeling en implementatie van een Design System, waarmee de implementatie van de nieuwe merkidentiteit een stuk sneller gaat.

Efficiëntie en overzicht met een Design System

Uniformiteit bereiken zit voor een groot deel in één waarheid creëren. Een design system is een platform waarop alle ontworpen User Experience componenten centraal verzameld zijn. Huisstijlkleuren, fonts, logo’s en designelementen worden op dit platform verzameld en door developers binnen een organisatie gebruikt om zo uniformiteit te verzekeren. Tegelijkertijd zien de Product Owners ook een toename van productiviteit door hergebruik.

Martijn van der Wijst, front-end developer bij Divotion: “Het design systeem bestaat uit componenten, opgebouwd in drie lagen: atomen, moleculen en organismen. In Figma staat beschreven hoe deze eruit zien. Dit gaat van klein tot groot, van details over kleuren, fonts en afstanden tot hoe volledige componenten zoals tabs, accordeons en menu’s eruit zien binnen een applicatie. Samen vormen deze het design system, wat met behulp van Storybook een visuele weergave is van de code. Door iedereen zoveel mogelijk applicaties te laten opbouwen op basis van het design system ontstaat er uniformiteit. Als er componenten ontbreken dienen developers een aanvraag in en voegen we deze toe. Maar dat gebeurt niet vaak, want het is al vrij compleet.”

Rens Voogt, Head of Department Mobility Solutions and Services Management bij BMW IT: “We hebben al twee keer een poging gedaan een design system te implementeren. Driemaal is scheepsrecht. We hebben nu een kritische massa bereikt en nu zien steeds meer mensen binnen de organisatie het nut én de noodzaak ervan in. De business case is duidelijker. En met een design system wordt het uitvoeren van de rebranding een stuk makkelijker. Een nieuwe button hoef je dan niet 30 keer te maken en implementeren, maar valt gewoon te implementeren vanuit het design system.”

Outstanding mobility service

De implementatie van het design system is work in progress, maar werpt nu al zijn vruchten af. Rens: “De rebranding verloopt met behulp van het design system een stuk makkelijker. We zijn er nog niet, het is een transitie. Maar de use case is duidelijk. Als we nieuwe wijzigingen door willen voeren is het een kwestie van een druk op de knop.”

Martijn: “Het is een flinke klus om een twintigtal applicaties te voorzien van nieuwe branding en styling, maar met behulp van het design system gaat het een stuk sneller. Developers beschikken over één plek waar alles staat, waar zaken vroeger meer verspreid stonden over verschillende apps en libraries. Dat zorgt ervoor dat we beter met elkaar samenwerken, componenten niet dubbel worden gebouwd en we dus sneller ontwikkelen. Maar belangrijker nog is de uniformiteit die in de applicaties ontstaat, waarmee de klanten van Alphabet een consistentere ervaring hebben. De navigatie en look en feel van applicaties wordt logischer en daarmee verbetert de UX. Een groot voordeel voor de klant van Alphabet.”

Rens: “Ik richt mijn teams in met zoveel mogelijk diversiteit. De consultants bij Divotion hebben ieder hun eigen expertise. De één is sterk in UX, de ander neemt het team op sleeptouw. De mix maakt het een krachtig geheel. En uiteindelijk gaat het er ook over dat ze goed samenwerken met alle anderen, er samen iets van maken. Techniek is belangrijk, maar uiteindelijk moet het bijdragen aan de business goals. Een design system gebruiken we uiteindelijk om een outstanding mobility service te leveren. Ook daar denken de front-enders van Divotion over mee. Ze zijn hier niet om even vluchtig iets te bouwen, maar zitten er in voor de long-run. Zo gaan we met zijn allen voor één doel: zorgeloos gebruik van mobiliteit.”

Neem contact op

meerdivotion

Cases

Blogs

Event