PROJECT OVERVIEW
To improve our customers' digital experience and increase digital engagement, while also aiming to cut down on the bank's expenses on SMS and email messaging, we developed an In-App Message Centre along with a staff console for sending out messages. This system ensured that our customers received personalized, timely, and relevant communications, contributing to a more seamless digital banking journey.
The project was successfully rolled out to our entire customer base in early 2022, signifying a key advancement in our approach to digital banking.
Duration:
2021 - Ongoing
Role:
Design Lead (Standard Bank)
Location:
Johannesburg | Remote from India
Team Composition:
Product Manager, Design Head, Design Lead, Backend Developers, Frontend Developers, Feature Analyst, Testers
Other team collaboration:
Voice branch, AI team, Marketing team, Design system team, Copywriters
Deliverables:
Finished designs for dev, visual language for message creatives, support for AI chatbot integration
CHALLANGE
How do we develop a UI that seamlessly integrates inbox and chat messages, supports multiple media formats, and incorporates an AI chatbot?
BUSINESS GOALS
The project was driven by the need to foster deeper digital engagement and provide synergistic value to the bank and its customers through effective, personalized communication. The main goals were
Reduce
Messaging Costs
Increase
Customer engagement
Generate
More Revenue
ROADMAP
Initial Launch:
Deploying message centre and staff console for foundational communication infrastructure.
Digital Transition:
Move the entire user base from SMS and emails to the Message Centre.
Integrate AI chatbot assistant for customer support
Engagement Enhancement:
Send personalised offers and promotions
Continuous improvement of chatbot responses
MY ROLE
Strategising & developing UI for message centre and staff console.
Integrating AI chatbot with live chat, defining message categories.
Collaborating with voice branch, AI teams, and marketing for design optimisation and targeted offers.
MAPPING THE FINDINGS
We organised and combined comms sent out to customers and could clearly see common themes emerging
To cater to both one-way bank-to-customer and two-way chat communications, we split the screen into two distinct sections.
INBOX vs CHAT
EXECUTION
Designing for Versatility: Crafting Components for the Message Centre
Designing for Versatility: Crafting Components for the Message Centre
I designed various necessary components for the message centre, considering the inclusion of diverse media types like images, GIFs, videos, and text. I aimed for component reusability, ensuring that they were versatile enough for both Inbox and chat usage and could be integrated into a carousel.
STAKEHOLDER INTERVIEWS
To identify communication
types and top customer queries
Voice branch & marketing team
To understand business goals
Product owners
To recognise technical constraints
Tech leads, FE devs, BE devs, Feature analysts
To align with
broader design system
Design system team, other design teams
Many workshops with Voice Branch team & feature analysts helped us identify chatbot intents and journeys, starting with chatbot welcome message, till end of the chat
Workshops & EVEN MORE WORKSHOPS
Don't let that bubble burst!
Don't let that bubble burst!
The challenge while creating chat bubble was how to ensure a comfortable viewing experience in both chat and inbox modes without cluttering with content or creating too much white space. My solution for an optimal chat interface involved setting the chat bubble's width at 77% of the screen.
PUTTING IT ALL TOGETHER
I developed over 50+ templates tailored to various scenarios, encompassing Inbox communications, error screens, interactions with bots and agents, and diverse applications of components in these conversational flows, such as account carousels, lists, quick replies, and chat attachments.
Intuitive Staff Console for Diverse Bank Teams to Reach Customers
I also designed a staff console for dispatching inbox messages to customers, tailored for use by various teams across the bank, including internal feature teams, marketing, fraud prevention, and personalisation groups. The design brief emphasised a simple and intuitive interface, with a development goal set to be achieved within a span of one to two months.
IMPACT
The data we collected provided clear evidence of the Message Centre's success, with a substantial number of customers visiting it
Reduced
Messaging Costs by
20%
Number
of Unique Vistors
3.6 M
Redemption
rate for campaigns
50%
8+ million page views
30k+ daily visitors
& a successful campaign with a food chain that boosted their new customers by 62% in just 3 months
~ The project is ongoing, my non-disclosure agreement obliges me not to share any additional information.
MY LEARNINGS
My major learning from the project was enhancing my collaboration skills across diverse teams, involving routine check-ins with stakeholders for early feedback, desk-checks with developers for technical alignment, assisting feature analysts, copywriters and the Voice branch in improving chatbot responses, coordinating with the marketing team for external communications, and regular reviews with the design system team.
Contact me at
Message Centre
Integrating Inbox and AI Chat functionalities for seamless and secure communication experience
COMING SOON