Gas South’s Online Account Service (OAS) is the primary digital portal customers use to manage their accounts, view usage, and pay bills. While functional, the existing experience was inconsistent with the Gas South brand and created friction for common customer tasks. This project focused on redesigning OAS to align visually with the rest of the Gas South digital ecosystem while improving usability, accessibility, and overall clarity. The result is a more intuitive, customer-centered portal that simplifies account management, reduces friction, and delivers a more cohesive and modern user experience.
Client
Gas South
Services
Visual Design
UI/UX Design
UX Research
UX Testing
Industries
Natural Gas Utilities
PROBLEM STATEMENT
Gas South’s Online Account Service (OAS) portal was a critical customer-facing tool, but it no longer met user expectations. The interface was visually outdated, inconsistent with the Gas South brand, and difficult to navigate for common tasks like viewing bills and making payments. Accessibility gaps and fragmented workflows created friction, increased support calls, and reduced customer confidence in self-service tools. The challenge was to redesign OAS into a modern, accessible, and intuitive experience that aligned with the Gas South digital ecosystem while making account management faster, clearer, and easier for customers.
RESEARCH & DISCOVERY
During the research and discovery phase, we used a card sorting exercise to better understand how users expected information to be grouped and labeled within the portal. This helped us define the main pages and determine what content belonged on each one in a way that felt intuitive to users. We also created a user flow diagram to map how customers would move through key tasks, such as viewing bills and making payments. Together, these activities gave us a clear picture of user mental models and navigation patterns, which informed the overall information architecture and reduced friction in the final design.
DESIGN DECISIONS
Because Gas South already had a mature design system, we moved directly into high fidelity design instead of creating low fidelity wireframes. This allowed us to focus on consistency, efficiency, and refinement while aligning with the existing brand. A mobile first approach guided decisions early, allowing us to prioritize clarity, performance, and usability on smaller screens before scaling up to desktop.
Key focus areas included:
• Reusing established components and patterns
• Ensuring new elements matched the Gas South look and feel
• Improving accessibility through better color contrast, typography, focus states, and readability
We started with the login experience and the Account Summary page, as these were the most frequently used entry points. The Account Summary page was designed to clearly highlight account status messages, billing and plan details, and relevant content like blogs, with a strong visual hierarchy and easy navigation.
Next, we focused on redesigning the bill payment flow, one of the most critical and frequently used features of the portal. The goal was to make the process simple, clear, and easy to complete with minimal friction. We streamlined the steps required to make a payment, reduced unnecessary cognitive load, and clarified labels, messaging, and calls to action so users always knew what to do next. By prioritizing clarity and usability, the updated payment flow helped users complete payments more confidently and efficiently.
COLLABORATION PROCESS
Throughout the redesign, we worked closely with product managers, engineers, marketing partners, and customer support to ensure the experience met both user needs and business goals. Designs were reviewed regularly, incorporating stakeholder feedback and technical constraints through multiple iterations.
Key activities included:
• Iterative design reviews with cross functional stakeholders
• Collaboration with engineering to validate feasibility and handoff details
• Usability testing to identify friction points and validate improvements
Final designs were refined based on testing insights and feedback, resulting in a cohesive, scalable portal experience across devices.
