Back to Homepage

Automated Credit Card Payments

Overview
Removing operational dependencies with automated billing system
In 2024, Tatari partnered with Kevin O'Leary to introduce Wonder Ads, a self-serve TV advertising platform that transforms TV advertising for small businesses.

While traditional TV advertising can require minimum media spends of $250,000+, Tatari enables businesses to start with budgets as low as $2,500. The platform simplifies a traditionally complex process that involves multiple stakeholders, lengthy approval cycles, and complicated processes across hundreds of TV partners.
Project Type
Professional
Project Timeline
Aug - Sept 2024
Team
1 Product Manager,
4 Engineers,
Legal, Finance
My Contribution
Product Design
UX Copywriting
Customer Challenge
Clients have to submit funds before ordering commercial spots, creating a high-friction payment experience.
Business Challenge
The current invoicing model creates operational bottlenecks that affect our ability to efficiently handle thousands of weekly orders
After being burned by previous clients years ago, Tatari made the decision to require payment for commercial spots before submitting orders. However, this manual process involves multiple teams and systems creating unnecessary friction and trust barriers between our account team and their clients.
Current State
Pay before you order
The current process requires manual involvement by three internal teams: Client Services, Finance, and Media Buying.
Frustrating for everyone involved and all budget sizes
An internal slogan, “no money, no buy”, spawned from this manual process. There are dedicated slack channels for our client services and finance teams to validate and confirm that funds were received for 200+ clients.
“We have to pay a lot of money up front and that gets into a tricky situation where you're a company like ours...”
— Small Business Owner
““...my old CFO...she got really hung up on the prepaid aspect of it...””
— Marketing Specialist
“...we can't follow up 10 times and when you’re delayed in paying that invoice, it delays us from sending out orders.”
— Tatari Team Member
How might we...
Provide a seamless payment process that reduces friction through automated transactions
Future State
Here’s my credit card, keep my tab open
The new payment model will introduce credit cards as the main form of payment. It also ensure payments will be received either by threshold or time-based.
Competitive Analysis
Aligning with industry standards for a clean and automated payment experience
After reviewing AdTech Platforms such as Google Ads, Facebook, and Youtube common design patterns surfaced such as progressive disclosure and payment visualizations.
Progressive Disclosure to introduce billing terms gradually
Progress Visualization to show payment status
User Paths
Integrating credit card setup into the existing onboarding flow
We had to consider merging a new credit card workflow into an existing billing onboarding process that already handled critical business documentation (W9), contact information, and receipt preferences. I diagrammed user flows to analyze user paths for complexity and effort.
Linear flow, tacking credit card setup onto existing flow
Alternative flow, parallel tracks let users start with comfortable tasks
Technical Constraints
A linear path to simplify validation and development
Feature:
A setup flow that validates payment methods and documentation collection
Reasoning:
Due to technical constraints, we decided on a linear task flow to prevent partial account setup. Optimizing for both user confidence and business requirements.
Design Influence
Introducing status visualization to make billing cycles intuitive
Our payment dashboard combined real-time spend tracking with historical activity, helping users understand when payments would trigger. Visual indicators and progress bars transformed complex billing terms into clear, actionable information.
Progress visualization to show spend towards payment
Feature:
A progress bar to show spend against the threshold limit, including the next payment date
Reasoning:
Visual representation for faster comprehension of billing terms. Real-time progress toward payment threshold clarifies the relationship between ad spend and payment cycles.
Accompanying dashboard with past payment activity
Feature:
A dynamic payments dashboard for real-time payment visibility
Reasoning:
Understanding billing cycles is critical for Marketers to track multiple campaigns and plan media budgets effectively
Technical Architecture
Addressing state management and error prevention
After understanding the validation logic, I workshopped with Engineering to map complex credit card states and validation rules. We identified edge cases and designed clear error prevention.
Validation rules for card dependencies
State management for card transitions
Final Deliverable
Automating away a 5-day manual process for payments
This self-service payment process isn't just making TV advertising more accessible to small businesses—it's setting us up to scale efficiently as we grow.
Impact
Reduced payment processing time: 
5 days → 3 minutes
Our automated payment system didn't just speed things up—it completely transformed our operational efficiency. Beyond the immediate 99% reduction in processing time, this automation eliminated dependencies across departments, while establishing a new standard for self-service experiences.

I’m very proud to say this project made waves throughout the company and now serves as a blueprint for future self-service features across our platform.
The beta launched in September 2024. Testing and iterations are in progress.
Back to Homepage
Next project
Streamlined food rescue sign up