Redefining Payments with tilliX

Designing a seamless QuickPay portal and post-login experience to help customers manage bills with ease and clarity.

OVERVIEW

Keeping up with each and every invoice can be difficult

tilliX is a platform that provides companies with tools to help their customers manage and pay their bills efficiently. The QuickPay portal is a product tilliX is developing to offer companies a seamless way for their customers to handle payments. Additionally, tilliX required an improved post-login experience that offered seamless navigation to invoices, analytics, and payment options.

SKILLS

Design Thinking

Wireframing

Prototyping

TOOLS

Figma

Linear

FigJam

TIMELINE

Sep 2024 - Jan 2025

ROLE

UI/ UX Design

PROBLEM STATEMENT

Companies need a more efficient and secure way to manage and pay invoices.

To address this, tilliX is developing this product to provide a seamless and secure payment solution. The primary challenges included:

  • Users struggled with navigating existing payment flows.

  • The post-login dashboard needed a clearer hierarchy to guide users to key actions.

  • The QuickPay portal had to be optimized for both first-time and returning users.

  • Security was a key concern, ensuring that users could safely enter and process their payments without risks.

THE PROCESS

Companies need a more efficient and secure way to manage and pay invoices.

To address this, tilliX is developing this product to provide a seamless and secure payment solution. The primary challenges included:

  • Users struggled with navigating existing payment flows.

  • The post-login dashboard needed a clearer hierarchy to guide users to key actions.

  • The QuickPay portal had to be optimized for both first-time and returning users.

  • Security was a key concern, ensuring that users could safely enter and process their payments without risks.

RESEARCH

1. Wireframing & Iterations

  • I started with low-fidelity wireframes to map out the QuickPay portal’s flow, ensuring that users could enter their customer number, verify details, and pay seamlessly.

  • For the post-login dashboard, I tested layouts that emphasized invoices, analytics, and payment methods as primary actions.

2. UI/UX Considerations

  • I implemented a clean, modern UI inspired by Reclaim.ai and Slack’s onboarding.

  • Designed a responsive layout for mobile and desktop users.

  • Added a confirmation step to reduce accidental payments.

3. Collaboration with Engineers

  • Case Managers/Service Providers

  • Worked closely with software engineers to align UI components with development constraints.

  • Coordinated with backend developers to ensure that security best practices were followed in payment authentication and processing.

IDEATION

my final creations

QUICK PAY PORTAL

  • Users can easily enter their customer number, verify details, and pay invoices securely.

  • A progressive disclosure approach keeps the interface minimal yet informative.

  • Integrated multiple payment methods for flexibility.

  • Ensured secure payment transactions with data encryption and real-time fraud detection measures.

POST LOGIN PORTAL

  • A redesigned dashboard provides clear access to invoices, analytics, and payment settings.

  • Sidebar navigation improves user flow and reduces cognitive load.

  • The interface is scalable for future enhancements, such as Google Wallet integration.

  • Implemented session timeouts and authentication checkpoints for added security.

tAKEAWAYS

Companies need a more efficient and secure way to manage and pay invoices.

Simplified payment flows:
I reduced unnecessary steps to make transactions quick and frictionless, helping users complete payments with confidence.

Enhanced security:
I implemented encryption, two-factor authentication, and SSO to create a secure experience users can trust.

Better post-login navigation
The redesigned dashboard made it easier to find invoices, view analytics, and manage payment settings—cutting down time and confusion.

Close collaboration with engineers:
Working hand-in-hand with developers helped align the design with real functionality, ensuring a smooth handoff and polished final product.

Designed for growth:
The modular system allows tilliX to easily add new features and integrations without disrupting the user experience.

CONCLUSION

This project was an exciting challenge that allowed me to design a fast, user-friendly, and secure payment experience while ensuring a seamless post-login flow. It reinforced the importance of user research, iterative design, and cross-team collaboration in building successful digital products. ‧₊˚ ✩