Year
  • 2021
Role
  • Contract UI/UX
  • Contract Photographer
Project Responsibilities
  • Brand Design
  • UI/UX
  • Director of Photography
Hard Skills
  • Wireframing
  • Prototyping
  • High Fidelity UI
  • Design Systems
  • Graphic Design
  • Photography

Payline Data

Payline Data, a leading merchant payment provider, required a complete website refresh to differentiate itself from competitors relying on generic tech-inspired aesthetics and stock imagery. The goal was to create a visually compelling and functionally intuitive user experience that streamlined the process of searching for payment solutions and calculating pricing for both small business and enterprise companies. This case study explores the UI/UX and brand design strategies implemented to elevate Payline Data’s online presence.

Challenges & Objectives

Challenges:

  • Many payment processing websites followed a generic, uninspired design.
  • Navigation was often cluttered, making it difficult for users to find relevant solutions.
  • Existing calculators on competitor sites were either hidden or overly complex.
  • A lack of real, unique imagery that aligned with the brand identity.

Objectives:

  • Develop a distinct, engaging, and easy-to-navigate website that stood apart from competitors.
  • Implement an interactive pricing calculator that increased user engagement and conversions.
  • Introduce a dynamic four-way split in the website structure to personalize the user experience.
  • Design a mobile-first layout that ensured seamless access across devices.
  • Create a unique visual identity with a custom photoshoot and a library of graphic assets.

Design & Development Approach

1. Creating an Eye-Catching and Intuitive User Experience

Rather than following the typical “techy” look, Payline’s website was designed with a modern, approachable aesthetic. A clean, soft, and subtle layout was developed, using strategic whitespace, engaging typography, and a structured content hierarchy. Every page was built to guide users efficiently toward the information they needed.

2. Interactive Pricing Calculator for Conversion Optimization

One of the primary conversion tools integrated into the site was an interactive pricing calculator. This tool allowed users to input essential business details—such as whether they operated online or in-person, their average monthly processing volume, and other transaction-related factors. The calculator provided real-time estimates of monthly charges, interchange rates, and transaction costs, making the decision-making process easier and more transparent.

Key Features of the Calculator:

  • Simple step-by-step interface for user ease.
  • Instant cost breakdown for informed decision-making.
  • Visibility across key areas of the website to maximize engagement.

3. Dynamic Four-Way Split for Personalization

A unique aspect of the website redesign was the four-way split user experience, which allowed visitors to tailor their journey by selecting:

  • In-Person vs. Online Payments
  • Small Business vs. Enterprise Solutions

As users made their selections, the website dynamically adjusted both its content and styling in real time, ensuring a more relevant and personalized browsing experience. This feature enhanced usability while reinforcing Payline’s ability to cater to a broad range of business needs.

4. Custom Imagery and Graphic Assets for Brand Identity

To ensure Payline’s website had a unique and authentic look, a dedicated photoshoot was conducted. The images were edited into a distinctive cut-out style that blended seamlessly with the overall design layout, reinforcing brand consistency.

Additionally, a custom library of graphic assets was created to maintain a cohesive visual language throughout the website, from icons to illustrations.

5. Mobile-First Design Approach

Given the growing importance of mobile accessibility, the entire site was designed with a mobile-first mindset. This ensured:

  • Seamless adaptation across different screen sizes.
  • Optimized navigation for touch interfaces.
  • Quick load times and responsiveness.

Results & Impact

  • Increased Engagement: The intuitive design and interactive calculator led to a 11%+ rise in leads and collected emails.
  • Enhanced Personalization: The four-way split created a dynamic, tailored browsing experience.
  • Stronger Brand Identity: Custom imagery and design assets gave Payline a distinctive online presence.
  • Improved Mobile Usability: A mobile-first approach ensured accessibility across all devices.

Conclusion

The Payline Data website refresh successfully redefined the brand’s online presence, creating an engaging, conversion-driven platform. By combining an intuitive UI/UX approach with strong brand visuals and dynamic functionality, Payline now offers a compelling and efficient experience for businesses exploring payment processing solutions.

Software Used