Introduction

Paytm, one of India's leading digital payment platforms, sought to improve its transaction history page to provide users with a seamless and intuitive experience. With over 100 million monthly active users generating millions of transactions daily, the account balance and history page (aka Passbook) holds significant importance. As a Product Designer at Paytm, I led the redesign project with a strong emphasis on improving usability, refining visual aesthetics, and implementing new features such as search functionality and improved filtering options.

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

 

​

​

​

 

 

​

​

​

 

My Role 

The entire passbook experience was owned by me and Anish Abraham, one of the main design leaders at Paytm. I was in charge of creating all the designs under his guidance. I was responsible for understanding user and business requirements and delivering the final designs.

 

 

Objective

The primary objective of the project was to revamp Paytm's transaction history page to implement search, improve user engagement, simplify transaction tracking, and enable users to easily retrieve vital information such as transaction details, dates, and payment statuses. Additionally, given that the transaction history page experiences high traffic, it presented an opportunity to introduce new products to users.

​

Research and Analysis

To gather insights and understand user pain points, I conducted user research through interviews, surveys, and usability testing. The research revealed several areas for improvement, including:

Complex Information Hierarchy: Users found it difficult to locate specific transactions and comprehend the transaction details due to inconsistent information grouping. Paytm has lot of financial instrument like wallet, upi linked bank accounts, postpaid, credit/debit card. User has to look inside the transaction detail page to find the payment source.

No Search: Without search it is very difficult to find specific transactions.

Limited Filtering and Sorting Options: Users desired more flexible filtering and sorting options to search and organize transactions based on their preferences.

Visual Overload: The existing design lacked visual hierarchy, making it challenging for users to focus on critical information.

Finding account balances: Users like to find all their balances at one place.

 

Copy issues: Some users couldn’t relate to Passbook to account balance and transaction page.

 

​

​

Design Process

Information Architecture: To address the complexity of the information hierarchy, we restructured the transaction history page by categorizing it into active accounts, new services and transactions.  This approach simplified the navigation and improved the overall organization of transaction details.

​

​

​

​

​

​

 

 

 

 

 

​

​

​

​

​

​

 

 

 

 

​

 

Introduced search: I have designed the entire experience for search, from the initial state with no input to suggestions and contextual results. Since this was our first implementation of search on passbook, we focused on creating a basic search experience.
 

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

 

 

 

 

 

 

 

Search itself presents a larger UX challenge, and I am passionate about solving search-related problems. I believe that the experience of search depends not only on the front-end implementation but also on the synergy between the front-end and backend. Having a strong background in development, I am well-versed in understanding how these components work together.

​

I plan to write a separate and detailed case study specifically addressing the complexities and nuances of creating a remarkable search experience. 
 

​

​

 

 

Streamlined Filtering and Sorting: We introduced a comprehensive set of filters, allowing users to narrow down transactions by date, transaction type, payment method, and more. 

​

​

​

​

 

 

 

 

​

​

​

​

​

​

​

​

​

 

 

 

 

 

 

 

 

 

 

 

 

Visual Enhancements: To enhance visual clarity, I employed a clean and minimalist design approach. By using clear typography, appropriate spacing, and consistent iconography, I ensured that users could easily scan and comprehend transaction information. We also added a payment source identifier for each transaction so that user can quickly identify the source from the list itself.

 

 

 

​

 

​

​

​

​

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Responsive Design: Recognizing the importance of mobile accessibility, I implemented a responsive design approach, ensuring a seamless experience across various devices. 

 

 

 

Impact:

The redesigned transaction history page at Paytm yielded significant improvements in user experience and engagement:

Increased User Satisfaction: User feedback and post-implementation surveys indicated a notable increase in user satisfaction, with 70% of users expressing their preference for the redesigned transaction history page.

Enhanced Transaction Tracking: Users reported improved ease in locating and tracking their transactions, with 40% reduction in transaction search time.

Higher User Engagement: With intuitive search, filtering and sorting options, user engagement with the transaction history page increased by 26%, resulting in longer user sessions.