HSBC - Digital asset management

A unique, fast and responsive digital asset management platform.

HSBC_assets.jpg

Brief:

HSBC has global offices around the world, and they need to ex -

change campaigns, assets to reuse or to adapt for a new country.

Usually this process was a slow one due to the amount of restrictions

between different countries that would mean in a great was te

of time and money to just adapt a single campaign.

In order to achieve this I put in place a design process driven by

business goals, users needs and data.

Design process

Complex problems require complex solutions.
My whole approach was to understand the whole platform, and how it was designed in the first place, see the problems and solve them in an elegant but practical way.

The challenge was that the platform needed to be updated in the UI, with a short deadline, while I wanted/needed to tackle its UX troubles. 

This forced me to work on two phases simultaneously: 

1 - UI refresh

2 - UX rebuild

In order to achieve this, I designed a process where both phases could happen at the same time, and focusing on quick wins, I could advance into making the platform more driven by data and user testing.

Process.jpg

Business, users, data

Business goals, users' research, and metrics gave us the requirements that the PO needed to create stories in Jira to solve.

Then the process runs with the approach of designing solutions while testing in agile sprints.

I carefully worked with developers on-site (London) and off-site (Poland) on these 2 different phases, so I was delivering quick solutions to improve the aesthetics of the whole platform, while I was also proposing and testing more complex solutions to improve the life of the users by:

1 - Simplifying flows

2 - Aggregating similar tasks in groups

Prototyping

Once the requirements were met for both users and stakeholders I turned the testing wireframes into mockups and started working with the devs team.

Now my focus was on interaction, and Sketch has been a powerful ally, also applying Google fonts and creating custom icons

for each task.

Quick interactions, smooth transitions but most importantly I wanted to improve the speed of the whole platform.

The user needs to be able to search and use assets immediately, and I pushed the team to improve the whole back-end engine around that concept.

creating-design-for-smartphone-users-2021-09-24-01-19-14-utc.jpg
website-design-wireframe-examples-of-web-and-mobil-2022-08-01-01-27-26-utc.jpg

Testing

I tested the first rough wireframes with the users, from different parts of the organization, to see if the process was clear and if there was a chance to improve it or simplify their process/journey.

At this point, I noticed how previously many assumptions were made, and how the stakeholders created solutions.

Instead, I centered everything around the users, and it became clear that their flows were messy and unproductive.

I turned it around by validating each flow and proving to the stakeholders a new direction was needed, but also that it would drive better results by also improving the productivity of their users.

business-people-are-brainstorming-2022-09-16-08-28-10-utc.jpg
HSBC_icons3.jpg

Iconography

I like creating icons and adding visual help to the users.

The challenge here was that many users didn't have the same level of access, and their tasks in the flow needed to be addressed with custom iconography. All of this while still maintaining a consistent style that reflected the company's flavor and direction.

HSBC_icons2.jpg

Brand guidelines 

Having dealt with brand guidelines for big brands like Yahoo!, MySpace, and many more, I'm happy to have revised the brand guidelines for HSBC as well as for their global platform.
This also serves as an interaction guide for developers to see how forms, buttons, links and each component works to keep the platform consistent, fast and easy to use.

Hsbc_brand_UI.jpg
Hsbc_phone.jpg

Final product

The whole platform has been delivered in record time, created with different teams on and off-site and it solved all of HSBC marketing global needs, delivered for web, mobile, and all devices.

HSBC employees can immediately find assets from different parts of their global offices and request usage in their own country with just one simple click.