Swift Charge payment app
Redesigning a payment experience to reduce customer calls by up to 46%
Product Designer 
research / ui / ux 2025
Overview
Simplifying the electric vehicle charging experience
Swift Charge partners with hotels and other businesses to provide convenient electric vehicle (EV) charging across 100+ locations. The payment app allows drivers to pay for charging sessions. Unlike other payment apps, the mobile-first web app is hassle-free, as no app downloads or sign-ups are required.
Leading a major redesign
Being the sole Product Designer, I collaborated closely with the app’s Lead Engineer and the Chief Technology Officer to lead a complete redesign of the EV charging payment app.
Impact: 46% drop in daily support tickets in 1 month
In the first month after launching the new design, the average number of daily support tickets fell by 46% compared to the 19 weeks prior, marking the redesign as a measured success.
In the three months post launch, payment-related support requests fell by 14%, all while seeing a massive 98% increase in average daily transactions in the same time frame.
Business problem
3 in 8 support requests were about payment
The biggest theme in the customer support tickets was confusion around payment. Specifically, 3 in 8 support requests were about the charging fees or temporary hold.
Problems with the existing design
When I reviewed the current design, it was clear why users were missing key information and calling for support.
1. Cognitive overload with the modal
Immediately after the charger selection page, a modal pops up packed with details and disclaimers. There’s no clear visual hierarchy, so the pricing rate is easy to miss. Users likely dismiss the modal without reading it at all—and it’s not obvious how to reopen the modal once closed.
2. Dissatisfying confirmation screen
After completing the payment form, users encounter another wall of text. There’s an initial success message followed by a list of instructions and a disclaimer. Overall, the app experience doesn’t end on a very reassuring note.
The existing payment experience Creating a more guided payment experience
My goal for the redesign was to transform the single, cluttered payment form into a guided payment experience that walks the user through the charging process. The complete payment experience can be split into three key sections:
- Pre-payment flow
- Payment flow
- Post-payment flow
Part 1: Pre-payment flow
Highlighting pricing upfront
To first solve the problem of unclear pricing information, I added a page at the very start of the flow to make the charging fees more transparent.
Preventing user error during charging setup
Another key problem is that users don’t always set up the charger properly. For instance, users might select the wrong charger or connector due to a simple mistake, a typo, or ambiguous charger orientation. If the charger is set up incorrectly, the charging session won’t start, which leads to frustrated customers.
To solve this problem, I added a separate page that explicitly prompts the user to plug the connector into their car—a step that is often missed. The CTO and I also discussed the idea of implementing a backend check to verify whether the correct connector has been detected. Overall, the goal was to guide users through each step and maximize the chances of a successful charging session.
Wireframes of the pre-payment flow
Prioritizing payment
Another trend that the CEO highlighted is that a notable number (i.e. 7%) of customer support calls are related to users asking how to get an access code. The problem is that the access code option is typically reserved for employees and shouldn’t be a distraction to regular, paying customers.
The new design addresses these challenges by de-prioritizing the access code option and making the button copy more specific. When I tested early designs with the Customer Support Representative, we also discussed the idea of only showing the access code option for locations that have active access codes.
Simplyfing the pre-payment flow
Through multiple collaborative design reviews with the CTO, the Lead Engineer, and the Customer Support Representative, I established the key elements of my design solution. From there, I restructured the flow so that each page focuses on only one action (e.g. understand pricing, plug in connector), removing unnecessary screens to reduce complexity.
Final design
Final screens for the pre-payment flow
Result
I led usability tests with an interactive prototype of the full payment experience, which helped validate my improvements to the pre-payment flow:
100% of users found the pricing information on the first page clear and understood that the employee access code was not for them.
The final shipped design also completely eliminated refund requests caused by connector issues, since users can no longer reach the payment page without plugging in the connector successfully.
Part 2: Payment flow
The challenge with pricing
The main challenge is that pricing is usage-based, which is much more complex than fixed-price, upfront payment. As a result, the payment experience requires placing a temporary hold (i.e. pre-authorization charge) on the user’s card.
As an additional layer of complexity, there are industry-specific constraints that enforce that customers pay for time instead of energy—but if the charger doesn’t run at maximum power, the time-based rate is reduced.
As mentioned previously, a significant percentage of support requests (37.5%) were about the pricing structure or temporary hold.
Exploring solutions
The new design makes the temporary hold super clear by highlighting it upfront instead of hiding it in fine print at the bottom of the page. I also made the copy easier to understand by renaming “preauthorization amount” to “temporary hold”—a small but impactful change that I validated via usability tests.
Wireframes of the payment flow
Result
During usability testing, 100% of participants successfully understood the temporary hold—a 64% improvement over the current levels of understanding seen in customer support requests.
Part 3: Post-payment flow
Problems
One problem in the post-payment experience is that users unplug their connector while the charging session is trying to start, which cancels their session entirely. Because unplugging and replugging is often recommended for troubleshooting home chargers, it’s a familiar user behaviour that I needed to actively prevent.
Another challenge of the post-payment experience was that the charging session monitoring page was getting nearly zero adoption. A link to the session monitoring page is emailed to the customer, but users aren’t reading them or clicking the link. However, it’s critical that users use the session monitoring page, because DC fast charging requires that charging is stopped (either from the car’s dashboard or from the app’s session monitoring page) before unlocking the connector.
Exploring solutions
To drive genuine usage of the charging status page, the new design places in directly in the post-payment flow—it’s no longer hidden in an email link.
Payment confirmation is still communicated, but in a modal. In the existing design, users were closing the app immediately after landing on the confirmation page. Therefore, the intention of the new design is to communicate that there is more beyond payment success—the charging session now needs to start successfully.
To encourage the desired behaviour of users not unplugging the connector, I designed a custom loading animation and showed a specific waiting time (i.e. up to 1 minute).
Wireframes of the post-payment flow
Result
With the shipped redesign, more users accessed the charging status page, though there were still some cases of users closing the page right away. Regardless, the drop in cases of users unplugging and more users accessing transparency on the status of their charging session led to fewer issued refunds.
The full EV charging payment experience
Impact
In the first month after launching the new design, the average number of daily support tickets fell by 46% compared to the 19 weeks prior, marking the redesign as a measured success.
In the three months post launch, payment-related support requests fell by 14%, all while seeing a massive 98% increase in average daily transactions in the same time frame.
Final design
