VBCE

Introduction

VBCE has been in business since 1989 and handles over five billion dollars in transactions annually through their retail locations and their VBCE online platform.

Objectives

Based on the brief set by the client representative, the following objectives were proposed for the project.

• Refresh the UX and UI of the website.

• Update the Information Architecture of the VBCE website.

• Work with a graphic designer to update the branding so that it has a consistent feel across all platforms.

• Collaborate with the developer to ensure quality and consistency when implementing the design.

Target User

The site was to be designed to appeal to a mix of business and travel users. These included:

• Users looking for more information on VBCE business services.

• Cross-border clients that live between Canada and the US.

• Users looking to log in to VBCE business services online.

• Travellers looking for international exchange rates.

• Customers looking to browse and purchase physical coins and precious metal bullion.

• Users looking for the latest blog posts on foreign exchange news.

• Finally users looking to find a physical VBCE location.

Research and Analysis

After initial conversations with the client representative, and the content strategist, I had a much better understanding of the business and its users. I was able to create a userflow. I wanted to chunk information on the homepage so that the user was not overwhelmed with too much text.

I wanted the user to find the information they needed intuitively.

For competitor research, I looked at 10 different sites in the finance, banking and currency exchange industrues including:

Stripe

CIBC

TD

Scotiabank

BMO

Transfer Wise

Travelex

XE

ICE

Remitly

In the realm of Fintech websites, establishing trust is paramount due to the involvement of financial transactions. Trustworthiness is communicated through strategic use of copy, icons, and color schemes. Additionally, showcasing logos of previous clients and sharing testimonials and business accreditations serve as powerful tools to instill confidence in users

To get a better understanding of the business from a user perspective, I interviewed five users that bank online and use travel exchange sites. This enabled me to empathise with users, and helped me understand any pain points from their perspective.

UI Design

The client had asked me to look at a number of travel exchange sites for inspiration. After doing lots of competitor research in the online banking and finance sector.

I wanted to use the navy blue from the brand guidelines as this colour conveys trustworthiness. I then used a brighter blue to contrast with the darker colour, but made sure to still leave lots of white space so that the design did not feel cluttered.

I tried to integrate the angles in the logo as a dynamic element that would lead the users eye down the page in a pleasing way.

All colour selections underwent rigorous scrutiny to ensure compliance with accessibility standards, with each shade meeting at least AA rating according to the WCAG guidelines for colour contrast accessibility.

Challenges

As this was one of my first paid UI projects. I found it hard to say no to various client requests. There was no brief, and I was told to “come up with some screens”. With more experience, I now understand that this is a terrible way to go about designing a website.

In practice this meant I had to create 30 screens for each visual iteration that I presented which was extremely inefficient and time consuming.

There were also no updated brand guidelines and the ones provided showed a dated colour scheme and fonts. I made suggestions to update various aspects of the branding including the logo, fonts and colour scheme. The client finally agreed to hire a great graphic designer to update the brand.

I engaged in the design process by utilizing the updated brand guidelines to create a meticulous UI design. After crafting pixel-perfect designs, I sought feedback from two seasoned UI Designers, both of whom affirmed the high quality of my work.

Regrettably, the client opted for a deviation from the brand guideline colors, preferring a black and white theme for the live site, a decision that left me somewhat dissatisfied with the implementation of my original designs. However, this experience served as a valuable learning opportunity.

I have since incorporated more thorough initial discussions with potential freelance clients to ensure compatibility. Implementing a simple gut test allows me to gauge their preferred visual direction. This approach has not only enhanced my confidence but has also refined my communication skills, both verbally and in writing, contributing to my overall growth as a designer.

Impact

The client was happy with the final iteration of the designs and they now have a functional site that works well for their business.