SwiftPay
We optimized the merchant dashboard with data insights, streamlined transaction management, and simplified role assignment.
Timeline
3 months
Team
Client:
Indian Bank
(NDA)
Agency:
Priyanka Verma
Role
Product Designer -Interaction Design, Visual Design, User Flows, Protoyping
Type
SaaS
Merchant Dashboard
What is SwiftPay?
SwiftPay is part of India's largest banking ecosystem, valued at $390 billion.
One of the bank's offerings is its POS service for merchants, enabling 4,70,000 merchants across India to securely accept payments online.
​
Part of the system is SwiftPay, a UPI (Unified Payment Interface) transaction analysis platform where merchants can track their businesses through a consolidated dashboard.​​
How might we
Turn complex payment
data into actionable insights that improve business operations?
Swiftpay users engage with a web app with the intention of resolving customer payment issues. However, Swiftpay also holds the potential to streamline their business operations as well as provide them with useful insights.
SwiftPay helps merchants manage transactions, track revenue, and identify trends - all in one place
Simplified tables for easy scanning
Action-based Dashboard
Mobile-first design
The Opportunity
The data presented to
merchants through SwiftPay made the working of a shop more efficient
From
Interface that buried data in complex tables
To
Simple, focused and action-based interface
The Audience
What valuable information can SwiftPay provide?
And to whom?
Secondary research objective: Understand how current POS related workflows take place, and related pains or opportunities.
​
Before we dived into the type of information, we wanted to understand exactly who is going to use this tool.
Four audience archetypes:​
Small and Medium Enterprises
E-commerce
Large Retailers
Hospitality Services
The Challenge
Business owners struggle to incorporate SwiftPay into their workflow
Mapping a Merchant's Journey
Journey mapping revealed the functions of the platforms that had to be prioritized in the given timeline and resources.
Key Usability Issues
What could we improve? What changes were needed?
01 Unrelated metrics
Transaction analysis did not provide any useful insights or flexibility in selecting a transaction, restricting users to raw data.
02 Complicated navigation
Certain functions were located under unrelated tabs whereas certain tasks could have been combined with others, creating confusion in categorization.
03 Complex access
The team members are showcased as a list even though there is a structure based on access.
Final Designs
A dashboard for all merchant needs
The dashboard homepage is a one-stop page for managers and business owners to get a quick overview of how all their businesses are performing. The dashboard is designed to be flexible based on user permissions.
TASK 1
Enhancing the dashboard with more comprehensive metrics
The problem
The current dashboard displays only a limited set of metrics, which lack depth in providing users with actionable insights in the way it is visualised. This limitation impedes users' ability to efficiently make well-informed decisions.
What did we do?
The dashboard homepage provides a quick overview of business performance, with separate sections for transactions and refunds, offering a comprehensive view of the financial activity. ​Furthermore, to facilitate ease of use, we integrated commonly utilized filters, enabling users to efficiently narrow down data.
Designing Tables
Data tables were the primary component that was being used across the platform. There were more than 13 data points and based on user research, we identified 7 of the the most common data points used my merchants to identify a transaction.
TASK 2
Simplifying transaction and refund summary for faster issue detection
The problem
A significant challenge for merchants is quickly resolving customer payment queries. The original transaction and refund summary showed a long list of transactions with too much detail, making it hard to find specific ones.
What did we do?
To streamline the process of identifying transactions, I condensed transaction data into a table format, facilitating easy scanning and identification. Additionally, implementing a search feature allowed efficient filtering based on user parameters, simplifying identification and resolution.
Identifying transactions became easier, we further simplified refunding transactions.
I kept information that was critical upfront, clicking on a particular transaction revealed more information about the transaction in a pop-up. The user can simply file for a refund in this flow.
The video further illustrates how users can refund transactions
TASK 3
Streamlining the process of managing accounts
The problem
The current design of the portal lacks clarity in reflecting the assignment of roles for users and sub-merchants by admins. While the functionality exists to add or remove users and modify their access details, the design fails to effectively convey this information.
What did we do?
The focus was on prioritizing ease of navigation and enhancing clarity within the user interface, recognizing the challenges inherent in overseeing numerous users, by segregating sections based on users.
The video illustrates the flow for changing account access
TASK 4
Redesigning chargeback management to facilitate timely resolution
The problem
The current interface for managing chargebacks presents challenges in meeting the stringent 48-hour time frame for resolution, essential for avoiding fines. Users face difficulty in efficiently sorting through and addressing each chargeback within the required timeframe.
What did we do?
To reduce cognitive load and enhance efficiency, we showed selective information upfront in a table. Quick actions were incorporated alongside each entry, allowing users to swiftly take necessary actions.
Uncovering Issues
Insights that shaped our design
To provide comprehensive information to our target audience, we needed to simplify the learning curve and ensure easy task execution by carefully assessing data filtration and categorization.
Originally designed to give an overview of transactions, SwiftPay had the potential to give business insights and combine it on one platform. The tech team had a proof of concept ready with the technology working. Idealoft was brought onto make the merchant's experience better.
While benchmarking competitor solutions helped us guide implementation, we aimed to create a simple, lightweight solution with modularity for potential future expansion.
Transitioning from raw data to valuable insights remains challenging as individuals often struggle to uncover useful information about their business.
MOBILE DESIGN
While 77% of merchants used the platform on desktop, we optimized it for mobile as well
Due to technical and time limitations, instead of redesigning elements for mobile, we made the design responsive.
Log in screen
Payment Dashboard
Account Management
Transaction Summary
Refund Transaction Flow
Chargeback Management
Bulk Refund
Download Reports
Reflections
3 crucial project learnings through the cycle
01
Understanding
development constraints
One important lesson was recognizing that not all design solutions could be implemented as initially envisioned due to development constraints. This highlighted the importance of close collaboration between design and development teams from the outset to ensure alignment and feasibility.
02
Validation
through collaboration
With demanding deadlines and client expectations, I stayed on track by validating my design decisions with both clients and the Idealoft team. This collaborative approach helped me refine my solutions and gain confidence in my decisions, ensuring alignment with project goals and stakeholder expectations
03
Leveraging existing design systems
This allowed me to dive into problem-solving rather than starting from scratch. This approach enabled me to focus on addressing the project's challenges while still having the flexibility to adapt and iterate the design system as needed to meet project requirements.