Core Access
Library and live sessions
$47/month
- On-demand session library
- One live session each month
- Email reminders
Membership Pricing Module
Shipped
UI Elements
The plan, the price, and the primary action in one view. The billing period switches without a new page. Shown here with a sample offer.
- Problem
- The plan, the price, and the action were split apart.
- Role
- UI and frontend
- Built
- A pricing module with an in-place billing switch
- Tracking
- Offer comparison
- Result
- Shipped behavior. This page uses a sample offer.
Pricing module (sample)
Core + Community
Library, live sessions, and community
$147/month
- Everything in Core Access
- Private member community
- Weekly office hours
Case study
Role: UI design + frontend implementation
Context: Simpler Trading — membership offers. This is that production behavior, rebuilt here with a sample offer.
The decision
A buyer comparing memberships has to see the plan difference, the price, and the primary action in one view, and pick a billing period without leaving the module.
What I owned
- The layout: period tabs, a card per plan, the price, the feature list, and one primary action. The popular plan is marked in the card, not in a paragraph beside it.
- The JavaScript that switches Monthly, Quarterly, and Annual and keeps the same cards in place.
- The release. The module shipped as a piece marketing can drop onto a campaign page.
On the offer page
How someone else reuses it
A new promo changes the plans, the prices, and the feature lines. The tabs, the card, and the action stay. That promo does not start as a new page layout.
Shipped
OfferCompare takes the billing periods and the plans. Each plan is a name, a price per period, the features, and which action is primary. The selected period is state. The cards wrap when the row runs out of room. The next offer passes new plan data into the same component. The preview on this page uses this site system: the type, the accent, the surfaces, and the shared button.
Skills demonstrated: Offer UI, component design, HTML/CSS/JS, marketing web systems.