TransBank: Rethinking Mongolia’s First Private Banking Experience

Desktop-3-1

Project Overview

As digital banking rapidly reshapes financial experiences, TransBank sought to elevate its online presence to meet international standards.


Our challenge was to redesign both the public and private banking portals, creating a unified yet distinctive user experience that embodied trust, sophistication, and ease of access.

CLIENT

Transbank

DURATION

10 weeks

MY ROLE

UX Designer

UI Designer 

CONTRIBUTORS

Procraft Angecy

Transbank (Development Team) 

THE ASK

TransBank partnered with our team to design a modern and intuitive website that appeals to HNWIs (High-Net-Worth Individuals) while streamlining navigation for everyday users.

The Challenge

The previous TransBank website lacked structure and brand clarity.

There was:

  1. No clear distinction between public, corporate, and private banking sections.
  2. A disconnect between TransBank’s evolving identity and its digital tone.
  3. Limited emotional appeal and an outdated interface that failed to inspire confidence among high-value clients.

 The new design needed to bridge strategy and storytelling that visually communicates exclusivity without alienating accessibility.

289416837_1826080577723766_7474492260818514707_n

THE GOAL

How might we design a banking website that builds trust, enhances clarity, and invites users to explore premium services with confidence?

STEP 1

Discover

Visual benchmarks for Private Banking

Before design began, we conducted an extensive visual and competitive analysis of global private-banking platforms to define the desired tone and visual direction.

DISCOVERY INSIGHTS

  1. By experiencing the concierge service first-hand, we identified the sensory cues like the tone, pace, and mood that resonate with private clients.
  2. Research allowed us to clearly differentiate user journeys between public and private banking.
  3. We mapped how global banks leverage color psychology, imagery, and space to convey exclusivity and trust.

These findings informed a design direction that feels both premium and personable.

Desktop-8-1

Citi Bank Private Bank, Bank of Singapore Premium, JP Morgan Private Bank, HSBC Private Bank

IMG_3634
IMG_3609
IMG_4988-1

Design Sprint brainstorming and sketching with clients

STEP 2

Ideate

Information Architecture and Flow Map

We developed a clear site map and user-journey framework to align the bank’s new structure with its business goals. The strategy work emphasized intuitive flows between corporate and private banking, ensuring seamless transitions while maintaining brand integrity.

A challenge during this stage was the client’s evolving service catalog, so we designed modular page templates that could scale as new offerings were defined.

Screen-Shot-2023-04-07-at-2.09.06-PM

Final flow map for Hi-fi UI Design

STEP 3

Design

UI Design and Visual System

After wireframe validation, we refined the UI to reflect TransBank’s heritage and modern ambitions.

DESIGN HIGHLIGHTS

  1. Introduced a gold-and-jade palette inspired by Mongolian craftsmanship to evoke luxury and stability.
  2. Integrated custom tiger illustrations as subtle brand motifs representing power and prosperity.
  3. Ensured each banking sector had a distinct visual tone while maintaining cohesion across the ecosystem.
Colors
272916367_1719634975034994_7196633585310579475_n-1
Private Bank Design

Dark, deep color schemes and smooth animations created a luxurious, members-only feel, mirroring the exclusivity of private banking.

Kapture-2023-04-07-at-23.47.31-1
Frame-73-2 v-13
Public Bank Design
Lighter tones and open spacing projected friendliness and approachability, appealing to everyday users and community clients.
Desktop-3
Kapture-2023-04-08-at-00.12.58

OUTCOME

After launch, we collaborated with the development team to fine-tune animated micro-interactions and post-release refinements. The new website achieved a visually cohesive, multi-segment experience connecting public, corporate, and private clients.

đź‘‹

Thanks for stopping by,

Let's chat!

View