Flock.ing @ bol.com - The Multilingual App
The multilingual bol.com app. Photo by Elisabeth Van Lent Photography

Flock.ing @ bol.com - The Multilingual App

This post is part 3 of a mini-series about Flock.’s involvement with the mobile app development at bol.com. Be sure to read part 1 to learn more about the mini-series itself.

Around the time I started at bol.com, in early 2019, the stakeholders decided that bol.com was going to expand to the French speaking part of Belgium: Wallonia and Brussels. This required a lot of effort on multiple fronts: retailer liaisons, logistics, warehousing, legal, marketing, etc.. Needless to say, the webshop, the mobile app, the customer service, e-mails, and all other communications, so far available only in Dutch, had to be offered in (Wallonian) French. 

The choice was made to not ‘simply’ introduce all user interfaces in the new language, by adding more if-else statements and rücksichtslos translating all product content. Instead, a translation company was hired to aid the transition to multilingual product content, and each of the 100+ microservices was required to adjust their application to the new bol.com multilingual standards, which in turn made it relatively simple to add extra languages when needed. To reduce the initial scope of this project, dubbed project Multilingual, only the services serving content that would end up in the mobile app or be sent directly to customers (e.g via email) were requested to make their service multilingual. The rest, including the webshop, would follow suit later. My team was tasked with ensuring that all content that would show in the mobile app could be viewed in Dutch, Flemish or Wallonian French, and that all of the services that we owned as a team would be compliant with the multilingual requirements.

In order to visualise the status of this complex project, we set off by creating a version of the app which supported multilingual settings, included a language selection screen and made sure all API calls contained an `Accept-Language` header to indicate the users’ language choice. The project management team, now armed with a live progress bar, got a great grip on which parts of the landscape still needed to become multilingual, and which ones were already done.

On the left there's a screenshot of bol.com's mobile app, highlighting several pieces of text. On the right, a microservice landscape is shown, with the color of the services matching the colors of the highlights in the screenshot.

Now, I’m not a cook but here’s a recipe for making a microservice multilingual, not dealing with optimisation of persisting any dynamic content (e.g. product info, seller descriptions, customer service content):

  1. Extract all hardcoded strings to resource bundles, ensuring localized texts are external to the source code. Allow for over-the-air updates of the bundles by connecting the service to a resource bundle API. This allows business analysts, UX’ers and writers to update strings of text without any changes to the application itself.
  2. Ensure all static texts within the app and our microservices are translated to the appropriate languages.
  3. Implement multilingual guidelines in services: serve content based on the Accept-Language header, with proper fallback and error handling. Localize static texts and dynamic content accordingly. Propagate the requested language to upstream services to request specific content (e.g. search queries, product specifications, shopping basket contents)
  4. Uncouple language from location in line with the multilingual mindset: the language in which you want to view a product should not predetermine the location from which you are shopping. The language is merely a representation factor while the legal aspects of the transaction are governed by the shopping location (e.g. you cannot buy medicine from webshops in Belgium)

Bon appetit!

the language in which you want to view a product should not predetermine the location from which you are shopping.

The results are something to be proud of. When you open the app for the first time, you are asked to provide your preferred language and country of residence. All contents shown thereafter are in the selected language. Changing the language is just 2 taps away and possible at any time. The users’ most recent language settings are stored at bol.com and applied in all communication.

The multilingual app was launched in August 2020, kicking off bol.com’s venture into the French speaking part of Belgium. The first Wallonian orders came dripping in, French speaking customer services started receiving questions, marketing campaigns were set out… The code I’d been kneading, changing and expanding for about 18 months was reaching a whole new audience and I had a great feeling of satisfaction. 

No alt text provided for this image

This concludes the third part of the mini-series on my role at bol.com for the past 2 years. Curious for more? Keep an eye out for part 4: Project highlight #3: Refactoring the mobile App API.

To view or add a comment, sign in

More articles by Julius van Dis

Others also viewed

Explore content categories