How I shipped a churn-prevention page autonomously—from design to production—without using any frontend engineering capacity.
ablefy is a platform for creating, selling, and managing digital products and courses online. The Trial Expired screen is the critical moment where a user decides to upgrade or churn.
The frontend team was fully allocated to high-priority OKR projects. A valuable churn-prevention fix was deprioritized to "Next Quarter." I had already completed design deliverables for major projects, unblocking engineering entirely.
Instead of waiting, I chose to execute horizontally.
Pricing plans were hidden behind a modal—two clicks away from a user ready to convert.
"Book a Demo" links via Chili Piper were non-functional, eroding user confidence.
Visually stark with no motivation or social proof. High-intent users were hitting a wall.
Embedded pricing plans directly on the page, eliminating friction entirely.
Integrated a micro-survey asking "What's holding you back?" to capture objection data from non-converting users.
Added rotating customer testimonials that auto-switch every 10 seconds.
Embedded the "Growth Academy" video to remind users of the platform's core value.
I used LLMs to orchestrate the layout while strictly importing our internal Design System components for visual consistency. Extracted existing Pricing Modal logic to ensure zero new technical debt.
Opened a standard Pull Request in the main repository. Passed strict linting and code review by frontend engineers before merging.
Partnered with the Data Team to verify that existing tracking infrastructure could support the new flow. Manually tested dataLayer events to ensure upgrade_plan_flow and plan_selection_click events fired correctly before deployment.
We needed to attribute revenue to this specific intervention—not just general organic growth. Confirmed that current_plan_id and seller_id pass correctly, allowing us to calculate the exact euro value of every saved user.
dataLayer.push({
event: 'ga-event',
domain: 'seller',
event_type: 'click',
object: 'upgrade_plan_flow',
element: 'plan_selection',
event_name: 'plan_selection_click',
current_plan_id: <user's current plan>,
upgrade_plan_id: <selected plan ID>,
seller_id: <seller ID>
})
Unblocked a key revenue path immediately without pulling a single hour of frontend time away from the main OKRs.
Demonstrated that designers can extend their impact beyond traditional boundaries when equipped with the right tools and autonomy.
Integrated a Typeform survey to capture qualitative data on why users don't upgrade—creating a direct line to customer objections.
"Marks an important milestone to leverage AI to build a production-ready page inside a legacy product."
Guannan Li, Director of Product Growth
This approach could be replicated by other designers in the organization. I should have created a playbook documenting the tools, workflow, and guardrails for AI-assisted implementation.
While the page shipped successfully, I would have benefited from running a controlled experiment to quantify the exact conversion lift versus the old page.
Some stakeholders were initially skeptical of the AI-assisted approach. Earlier communication about the methodology would have smoothed the approval process.