Building a unified AI credit system for Vyond
I led the design of a shared credit system across five Vyond AI features so users could allocate one balance across tools while Vyond tracked API spending through a consistent metric.
Fragmented AI quotas limited flexibility and complicated cost tracking.
As we expanded our suite of AI-powered tools at Vyond, we launched each new feature with its own isolated quota. This frustrated our users by limiting flexibility, and internally made our API cost management complex and inefficient to track.
A unified system connected AI tools, usage tracking, and pricing.
One credit balance works across AI features
I designed a credit component placed next to each AI feature's call-to-action button, using a coin icon to visually represent the credit system and maintain consistency across AI tools.
The design was lightweight and scalable, making it easy to reuse for future AI features.
Contextual states clarify balances, costs, and errors
The credit component integrates with the backend to sync data in real time across the platform. I designed multiple states to handle various features and API scenarios, including:
- Syncing and displaying current credit balance
- Calculating and showing dynamic credit costs
- Triggering error messages when issues occur
- Prompting upsell messages when credits are low
How the credit component decides what to show
I defined this display logic in close collaboration with engineers, mapping how the component handles access, costs, balances, errors, and upsell states.
A centralised ledger tracks monthly credit usage
I designed a ledger-style page that records every credit transaction in chronological order, providing transparency and building trust in the system.
This visibility helps reduce user anxiety around spending and empowers users to plan future usage.
Credit allowances clarify differences between plans
I redesigned the pricing table to spotlight credit allowances, using a side-by-side layout to highlight value differences across plans.
The Enterprise plan featured unlimited credits, creating a compelling upsell narrative and making plan differentiation more transparent to users.
Two-month results: $50K+ MRR growth and $1M+ qualified pipeline.
The AI credit system and restructured plans launched together in May 2025, so the commercial outcomes reflect both changes rather than the credit system in isolation. The new Enterprise plan, featuring unlimited credits, saw a 10% increase in adoption. Across all users, AI feature engagement rose, with most consuming less than 50% of their monthly credits, showing both increased use and sustainable limits.
From an animation tool to an all-in-one AI video creation platform.
In recent years, driven by the rapid development of Artificial Intelligence, Vyond evolved from a traditional animation platform into an all-in-one AI video creation suite.
While Vyond invested heavily in developing AI capabilities for the video creation workflow - including features like text-to-video, text-to-speech, text-to-image, video translation, and AI avatars, each feature was launched with its own quota system, causing problems in the long-term.
This project aimed to solve these problems.
Fragmented quotas complicated cost tracking and limited upsell opportunities.
As more and more quota-based AI features were added, maintaining the separate quota system across three to four plan tiers became increasingly difficult and inefficient. The fixed quota system also made it harder for us to understand the actual usage patterns.
Additionally, fragmented usage data complicated analysis and financial planning for third-party API costs.
Finally, the legacy pricing model lacked usage-based differentiation, limiting upsell opportunities for the Sales team.
Inflexible quotas made usage and plan comparison difficult.
Given the quota system, some AI feature usage were low, when compared to others. Users couldn’t transfer unused quota from one feature to another, causing inflexibility.
It was also not easy for users to keep track of the individual quota on each AI feature, causing inefficiency.
Moreover, we’ve also found out that prospective customers struggled to compare and evaluate plans when quotas were inconsistent.
In short, users need a way to use AI feature quotas flexibly and efficiently as well as a simpler way to know which plan best fit their needs.
Leading the credit system from shared vision to reusable implementation.
As lead designer, I co-defined the vision and requirements with a staff designer, the Director of Data, and a product manager.
I owned the design, logic, and behaviours of a scalable UI component spanning five AI features. I worked closely with engineers to resolve development details and define states for balances, dynamic costs, errors, and upsell prompts.
I delivered the full design handoff and technical walkthroughs to support development, then aligned the component with the design system for long-term reuse.
We rejected persistent credit displays and aggressive upsells to protect focus and trust.
I initially explored a persistent, global credit display, a pattern common in AI-native products. However, because Vyond’s core value isn’t solely AI generation, a persistent display commanded too much real estate and attention. We discarded this to avoid misrepresenting the tool’s primary purpose and distracting users from their main workflows.
I also tested a more aggressive upsell pattern, leaving the 'Generate' CTA active even when users lacked sufficient credits. We ultimately rejected this approach because it bordered on a dark pattern. It created a frustrating user experience and risked damaging trust, particularly with our enterprise users. We chose to prioritise transparency instead.
The AI credit system and subscription-plan restructure launched together in May 2025. Within two months, both changes contributed to $50K+ in MRR growth and a $1M+ qualified sales pipeline.
Interested in working together? Reach out at y3vu060312@gmail.com or connect on LinkedIn.