of customers enrolled in the portal for bill payment within the first six months
Blue Casa Communications
Online Payment Portal
Designing a secure, user-friendly web portal to modernize bill payment for an underserved customer base in California's telecommunications market.
The Challenge
Blue Casa is a landline phone service provider that has served low-income Hispanic communities in California for over five years. While their phone service was reliable, the customer experience around billing had not kept pace with digital expectations.
Customers could only pay bills through mail, phone, or in person at a limited number of locations — leading to delays, missed payments, and mounting dissatisfaction. Blue Casa needed a convenient, secure web portal that would allow customers to view and pay bills online while reducing operational overhead.
Project Goals
-
Increase Customer Convenience Simplify the billing and payment process so customers can access billing history, make payments, and manage account details online.
-
Reduce Operational Costs Decrease expenses related to call center inquiries, paper billing, and manual payment processing.
-
Create a Consistent Brand Experience Adhere to Blue Casa's existing visual language and brand guidelines to ensure users experience low friction when making their first online payment.
-
Ensure Security and Compliance Implement secure payment processing and data protection measures in compliance with financial and telecommunications regulations.
User Research
To inform the portal's design, I conducted customer surveys and usability research to understand preferences, pain points, and comfort levels with digital tools. The core user demographic emerged clearly:
Key Demographic Profile
Hispanic, 35+ years old, full-time employed, high school educated, household income under $30,000, married with children. Many qualified for California's Lifeline discount program. A notable finding was that children often facilitated digital communications on behalf of their parents.
A critical insight from research was a deep-seated distrust of electronic payments among the primary user base. This finding shaped nearly every design decision that followed — from the language used in the interface, to how we surfaced security indicators, to the onboarding flow that walked users through their first payment step by step.
Design & Planning
Based on research insights, I defined the core feature set and began sketching wireframes that prioritized clarity and trust-building.
Login & Authentication
An easy, secure account creation and login flow using email credentials. The registration process was designed to mirror the familiar format of the paper bill — users verified their identity by entering their account number and last bill amount, information they could locate on a physical bill they already had in hand.
Billing Dashboard
A clear, accessible dashboard displaying current bill amount, due date, and full payment history. I kept the layout deliberately simple, avoiding information overload while ensuring all critical account details were visible at a glance.
Payment Options
Integration with credit and debit cards as well as ACH bank transfers, giving users flexibility while keeping the payment flow to as few steps as possible.
Reminders & Notifications
Automatic bill reminders via email to help users stay on top of due dates — a feature directly requested during user research.
Login form fields were placed in the right sidebar of the existing Blue Casa website, maintaining consistency with the established site architecture and ensuring returning visitors could find the payment portal without navigating away from the homepage.
Development
I collaborated closely with a development team to bring the designs to production. The team used a responsive design approach to ensure functionality across desktops, tablets, and smartphones.
Technology Stack
The frontend was built with HTML and CSS, the backend ran on Ruby on Rails, and payment processing was handled through Authorize.net — a PCI-compliant gateway that aligned with our security requirements.
Bilingual Support
Given the predominantly Spanish-speaking user base, the portal and all billing statements were designed to function fully in both English and Spanish, with a language toggle prominently placed in the navigation.
Deployment & Optimization
After development, the portal was deployed on a cloud platform for scalability. We conducted a phased rollout, initially targeting a small subset of customers to gather feedback and resolve issues before the full launch.
Post-deployment, the team monitored performance and gathered feedback to make targeted adjustments, focusing on reducing page load times, improving error handling during payment processing, and enhancing the UI for better readability and ease of use.
Results
increase in customer satisfaction scores
reduction in billing-related support calls, lowering operational costs
improvement in on-time bill payments, enhancing cash flow
Reflection
Blue Casa's web portal was a successful digital transformation initiative that enhanced the billing experience, reduced operational costs, and improved customer satisfaction. The project reinforced a key lesson: when designing for users who are unfamiliar with — or actively distrustful of — digital payment systems, building trust through transparency, familiar visual cues, and a frictionless onboarding experience is just as important as the functionality itself.
This project highlights how traditional service providers can leverage thoughtful, user-centered digital solutions to meet modern customer expectations while streamlining internal operations.