HSBC Expat Hints & Tips Tool

Background

HSBC Expat offer banking services to people moving from one country to another. Part of their offering is sharing information between expats about life in different countries using data gathered through their annual HSBC Expat Explorer survey, compiling data from thousands of expats in countries around the world and sharing it with their community.

Part of the survey asks participants to add their own insights in the form of hints or tips about living in another country and experiencing another culture. Having lived in various countries myself, I was all too aware of how valuable real-world ‘on the ground’ advice was for someone starting out in a new country; everything from how to rent an apartment to restaurant etiquette & culture quirks.

HSBC were keen to turn this information into an online resource by creating a standalone tool to showcase them, one that would encourage & enable more users to contribute.

Branding

I was given a relatively free rein with the branding, as HSBC understood that their banking brand might not be the most engaging. I chose a simple, muted colour palette that used HSBC greys and reds but would let the content take centre stage.

Knowing that the tool would be text-heavy, I chose Univers UltraCondensed as the main interface font. Given that Univers was HSBC’s corporate font, this felt ‘HSBC-enough’ to pull off whilst being space-efficient enough to show as many tips as possible within any given viewport. (Fun fact: this was the first HSBC site to use Univers as a custom font. All others used Arial up until this point.)

Understanding the structure of a typical tip

Alongside the actual tip, each piece of data had a bunch of other information that would need to be displayed:

• Who added it
• Their age
• Their occupation
• Their expat status
• Countries involved/relevant
• When the tip was added
• How many views the content received/shares sent
• Related themes

This metadata would give the reader more context as to the information they were reading, making it more or less relatable to their own situation. We wanted to treat this information as ‘tags’, so that users could navigate using them to find similar information.

Helping users find relevant information

Whilst the idea of a ‘sea of tips’ worked well visually, we needed a way for users to filter the list by country or theme so that they might find content more suited to their own situation.

Linking to other HSBC content

The meta-data associated with the tip content offered HSBC an opportunity to layer in their expertise and insight through related content, country guides and other tools. This started to show how the tool could be expanded in future to be more of a lead generator.

Submitting new content

Users were encouraged to add their own content to share with the community, so I designed an end-to-end submission process. Alongside the actual tip, users were asked to tag their content with relevant themes, countries and demographic data.

Submissions from the tool went into a moderation queue, where HSBC staff would manually approve or deny the content. Anticipating a massive increase in submissions following the release of this tool, HSBC invested in automated software to moderate tips for profanity, suitability and duplication.

Creating a thriving online community

The original goal of the project was to create a front-end for a swathe of data already held by HSBC, but what we ended up with was an interactive tool that helped create & grow an online community of HSBC expats.