HomeHomeCasesCases

Gamma & Karwei apps: de beste mobiele experience voor iedere klusser.

Voor doe-het-zelf ketens Gamma en Karwei ontwikkelden we de volledig nieuwe mobiele apps in React Native.

Services
Digitale Strategie, Consultancy, App development, Maintenance, React Native development
Release date
2022

Intergamma is het moederbedrijf van GAMMA Nederland, GAMMA België en Karwei. Met bijna 400 winkels en meer dan 10.000 medewerkers is het zowel online als offline marktleider in de doe-het-zelf branche in de Benelux. Vooral de combinatie van hun websites en fysieke winkels heeft ervoor gezorgd dat er een goede marktpositie is bemachtigt. Op de mobiele touchpoints was er winst te behalen: bestaande apps hadden een lage rating en er was behoefte aan een aangescherpte mobiele strategie waarbij de klant centraal staat.

Download de Karwei of de GAMMA-app in de App Store of via Google Play.

Result

Vernieuwde code

De mobiele apps zijn herschreven in React Native en er is een mobiele ontwikkelomgeving inclusief CI/CD straat ingericht.

1 code base 6 apps

Om beheer en doorontwikkeling optimaal te faciliteren delen GAMMA NL & BE en Karwei hun e-commerce platform èn code base voor de mobiele app

Samen met Elements hebben we een groot aantal technische uitdagingen weten op te lossen en in hoog tempo naar een eerste release toegewerkt.
Frank van Polanen, Head of Product, Intergamma
Our approach

Mobiele strategie op basis van klus journey

Tijdens het strategieproces is er een mobiele strategie ontwikkeld voor GAMMA en Karwei. Op basis van interviews, locatiebezoeken en het in kaart brengen van verschillende klus en doe-het-zelf activiteiten door Soda Studio is een klus journey ontwikkeld. Dit is een user journey in de app van zes stappen die van toepassing is op ieder type klus. Van het inspelen op de behoefte om iets in huis aan te pakken tot de voorbereiding en aankoop van producten. De app helpt de doe-het-zelver door het hele klus proces inclusief inspiratie voor een volgend project.

Doe het zelf of inspiratie

GAMMA en Karwei hebben verschillende proposities. Om dit te ondersteunen hebben beide merken hun eigen app met specifieke features die dit uitdragen.

GAMMA

De nadruk voor GAMMA ligt bij het personaliseren vanuit een klus- en klusprofiel context. Vanuit die personalisatie laag kunnen we op alle touchpoints relevantere ondersteuning bieden met als doel om obstakels weg te halen door de hele klus journey.

Karwei

Karwei is de bouwmarkt met smaak. Binnen de mobiele app ligt de nadruk op inspiratie en visualisatie van het eindresultaat.

No items found.
No items found.
Technology

Volledige hernieuwing codebase

Naast het herschrijven van de mobiele applicaties in React Native is er ook gewerkt aan het inrichten van de mobiele ontwikkelomgeving inclusief CI/CD straat binnen Intergamma. Hier hebben we onder andere gebruik gemaakt van GitHub & CircleCI en Fastlane. Fastlane is een combinatie van open source tools waarmee apps gebouwd, getest en released kunnen worden.

Release en doorontwikkeling

Binnen enkele maanden hebben we een MVP-versie in de app store gereleased. Deze nieuwe applicatie beschikt over de meeste functies van de oude apps. We analyseren nu gebruik van de apps, reviews, praten met gebruikers en besluiten op basis daarvan welke problemen we nog kunnen oplossen. Voor iedere update wordt er een gebruikerstest afgenomen en worden er nieuwe inzichten opgedaan door de researchers van Milkshake waarmee kwalitatieve doorontwikkeling van de mobiele apps gegarandeerd kan worden.

6 mobiele apps, 1 e-commerce engine

Om structuur aan te brengen in het beheer en de doorontwikkeling efficiënter te kunnen faciliteren delen GAMMA NL, GAMMA BE en Karwei naast hun propositie versterkende features hun e-commerce platform èn code base voor de mobiele app. Door middel van React Native kunnen we voor zowel Android als iOS de mobiele apps voor alle 3 de formules bouwen. Zo ontstaan er 6 verschillende mobiele apps vanuit 1 codebase:

1 Android app voor GAMMA NL

1 Android app voor GAMMA BE

1 Android app voor Karwei

1 iOS app voor GAMMA NL

1 iOS app voor GAMMA BE

1 iOS app voor Karwei

Design System

Soda heeft in samenwerking met Elements een uitgebreid Design System met Figma neergezet voor zowel GAMMA als Karwei. Het Design System bevat de waarheid qua ontwerp beslissingen en de huisstijl (denk aan kleuren en fonts) van elke formule. Door middel van design tokens kunnen we voor elke formule de juiste kleuren en waardes gebruiken.

Door middel van het Design System houdt ieder merk zijn eigen unieke uitstraling en kunnen designers, developers, redacteuren en marketeers sneller te werk gaan om de content in de apps te stylen en beheren.

Core + Features + Formule = 1 App 

De React Native architectuur bestaat uit een solide basis die door alle formules wordt gedeeld. Hierin zitten onder andere de basis interface componenten, navigatie, specifieke formule configuraties, lokale opslag, data handelingen, statistieken met Firebase en foutafhandeling met Crashlytics.

Daarnaast werken we feature gericht met feature flags, waarbij features onafhankelijk van elkaar worden ontworpen en geïmplementeerd. Zo kunnen features apart worden aan en uitgezet per formule wanneer dat nodig is.

Per formule hebben we de verschillende benodigdheden bij elkaar geplaatst: waaronder de huisstijl met fonts, icoontjes, kleuren en waardes, maar ook de talen en vertalingen (bijv. Frans voor GAMMA BE).

Webpagina’s

Voor sommige functionaliteiten gebruiken we webpagina’s die we binnen de mobiele app tonen. Om de communicatie tussen de mobiele app en de webpagina te verbeteren hebben we een strikt protocol opgezet.

Verbeteringen

Belangrijke elementen die we hebben aangebracht is het tonen van aanvullende producten die je mogelijk ook voor de klus nodig hebt en is de check-out geoptimaliseerd.

No items found.
No items found.
Conclusion

Verschillende proposities, gelijk technisch fundament

Hoewel de proposities en de doelgroepen van de merken GAMMA en Karwei verschillen, was de eis dat de technische core van de verschillende mobiele apps gelijk is. Hiermee worden schaalvoordelen als korte time to market, kostenefficiëntie  en onderhoudbaarheid behaald.  

Samenwerking

Soda Studio - Resoluut - Milkshake Research - Mr. Koreander