← All work

UX + web design case study

Registration flow redesign

Client
CallingPost
Role
UX and UI designer
Team
Solo
Format
Responsive web design and web app
Stage
Production
Dates
2023–present
CallingPost pages shown on a desktop monitor, laptop, tablet, and phone: the pricing page headed Simple. Transparent. Easy. with Free, Premium, and Essentials plans and a monthly or annual toggle; a checkout page to confirm plan details and pay; and a full feature comparison table on tablet and phone.
The challenge

Clear pricing, more sign-ups

Reduce confusion about CallingPost’s plans and pricing, and increase registration completion.

The process

Plans, contacts, and pricing

To start, I needed a clear understanding of CallingPost’s plans and pricing. CallingPost does one-to-many messaging by voice, text, and email, so it has multiple plans, and prices increase with the number of contacts a customer needs to reach. I learned that people were confused by too many plans, so they would visit the pricing page and then leave.

Audit board for the CallingPost registration flow. Two recommended flows run left to right, one for the free trial and one for users who select a plan, from create account, verify, and organization info through a walkthrough, dashboard, new group, contacts, and a first communication. Sticky notes flag issues: confusing free trial CTAs on paid plans, a sign-up screen that promised 30 days free to people being billed right away, a confusing PIN field, design inconsistencies in logos, fonts, and colors, and first-time user comments on the trial emails and phone number screen.
Scroll to see the full board, or open it full size

Pricing plans:

  • Free
  • Premium
  • Essentials
  • Pay-as-you-go

Contacts pricing:

  • From up to 15 contacts to more than 2,500

Pricing discounts:

  • Pay monthly or annually
Pricing

Simple. Transparent. Easy.

I started at the beginning of the flow, with the pricing page. Key changes:

  1. Dropped the Standard plan, leaving Free, Premium, Essentials, and Pay-as-you-go.
  2. Turned the 15% advance-pay discount, previously a line below the plan table, into a monthly or annual toggle at the top of the page.

See their previous pricing page below.

CallingPost’s previous pricing page, headed Simple and Easy per Number Pricing: a table of five plans, Free, Premium, Standard, Essentials, and Pay-as-you-go, each with a contacts or credits dropdown, a starting price, and a green Sign Up button, with Trustpilot and Capterra ratings and a note to save up to an additional 15% with advanced pay.
Before: the previous pricing page
CallingPost pricing page on desktop: the headline Simple. Transparent. Easy. No contracts or pushy sales team. A monthly or annual toggle with 15% off annually, Free, Premium, and Essentials plan cards with a contacts selector, a Pay-as-You-Go card, a full feature comparison table grouped by top, messaging, phone, text, email, and support features, pricing FAQs, and a Create your account call to action.
After: the redesigned page on desktop. Scroll to see the full page.
CallingPost pricing page on mobile: the plan cards in a swipeable carousel, the Pay-as-You-Go card, and a feature comparison that lets users pick two plans to compare side by side, followed by FAQs and a sign-up call to action.
After, on mobile. Scroll to see the two-plan comparison.

The primary change I thought would reduce confusion was putting cards at the top of the page for the three plans CallingPost wanted to promote most: Free, Premium, and Essentials.

I also separated the Pay-as-you-go plan for three reasons: (1) its features and pricing work differently, so setting it apart properly differentiates it for users, (2) it’s a much less popular plan, and (3) it’s less profitable for CallingPost.

Another major decision was adding a switch for monthly versus annual payment, so potential customers could see the cost savings more tangibly.

Design decision

Selling the sign-up screen

The next screen was also critical because users hit major friction when they needed to create an account. On desktop, where there was more space, CallingPost and I wanted to add branding and extra incentives to get more people to create an account.

CallingPost and I explored several options.

Sign-up option 1: a black-and-white photo of a community leader with the headline Be the Calm, Confident Leader Your Community Trusts, three steps to get started, and Trustpilot and trust badges on a blue panel, beside the Create Your Free Account form.
Option 1: Emphasized simplicity and benefits for leaders sending messages
Sign-up option 2: a light panel with the CallingPost logo, the headline Reclaim your time, because your message matters, three numbered steps, and Trustpilot and trust badges, beside the Create Your Free Account form.
Option 2: Showed the process and instant access
Sign-up option 3: the Create Your Free Account form centered between two blue panels of selling points, including 99.99% uptime, no tech skills required, 1 billion+ messages delivered, start in 5 minutes, trusted by 60,000+ leaders, and data protected.
Option 3: Showcased benefits and social proof as a background pattern
Sign-up option 4: an illustrated panel of product UI cards, Pastor John and a 385-member volunteers group with phone, text, and email buttons, a 90% response rate, 60,000 happy leaders, and a Trustpilot rating, under the headline The Fastest Way to Reach Your Entire Group, beside the Create Your Free Account form.
Option 4: Reinforced CallingPost as a leader in its field

The final design

Choosing it was a judgment call, based on two qualities: (1) the group image best represented the benefit of CallingPost’s one-to-many messaging, getting your group together in person, and (2) new copy, designed for quick reading, delivered compelling differentiators.

Final sign-up screen on desktop: a blue-tinted photo of a large group posing together outdoors, the headline The Fastest Way to Reach Your Entire Group, Phone, Text, and Email, stats for 99.99% uptime, 1 billion+ messages delivered, and 90% of leaders sending their first message within 10 minutes, and Trustpilot and trust badges, beside the Create Your Free Account form.
Final design, desktop
Final sign-up screen on mobile: Get Started Today, Send real messages to your real list, no charge today, with phone number and password fields, password requirements, terms checkbox, a Create My Account button, and a Trustpilot rating with Trusted by 60,000+ leaders and 1 billion+ messages delivered.
Final design, mobile
The rest of the flow

Completing the account

The remaining screens covered standard requirements: phone number verification, organization and account details, and checkout.

Verification screen: Enter Your Verification Code to Create Your Account, with a five-digit code entered, a Great! confirmation, a Continue button, and a Resend Code link.
Phone number verification
Account Created! screen asking users to tell CallingPost about their organization: first and last name, organization name and type, email address, and where they heard about CallingPost, with a Complete Account Setup button.
Organization and account details
Checkout on desktop: Confirm Plan Details and Purchase, with a monthly or annual toggle offering one month free annually, the Standard plan for 200 contacts at $100 a month, a 12-month total with one month free for $1,100 today, a promo code link, and a payment form for credit card or bank account with a Purchase button.
Checkout
Outcome

70% increase in registration completion

The new designs launched in September 2024. In the two years since, CallingPost’s analytics show a 70% increase in registration completion. CallingPost and I have continued to collaborate to improve its website and web app.

Next steps

With more people completing registration, the next questions were how to help new users get started, how to improve the product’s core feature, and how to let visitors try CallingPost before signing up. That led to three more projects:

CallingPost Messaging Guide dashboard: Level 1, Send Your First Message, with a points progress bar and steps from Create Your First Group to Send Your Message(s); the open Create a Voice Message step shows four ways to record a voicemail, each with a Read Article button; Level 2, Message Like a Pro, lists caller ID, local and toll-free numbers, SMS keywords, and auto reminders.

Messaging guide

A learning section where new users earn rewards while building product and messaging outreach knowledge.

CallingPost Create your first group modal over the Send/Schedule a New Communication flow: a group named Sunday choir, tabs to add members manually or upload contacts from a file, five rows for first name, last name, phone number, and email, an Add more members link, a count of 500 of 500 unique contacts remaining this month, and a Create Group button.

Create message flow

A rework of CallingPost’s primary feature, sending a one-to-many message.

CallingPost marketing page headed Hear It and See It Before You Commit, with a No Signup Required tag and a Send Me a Free Sample Message form: phone number, industry, a choice of text message, voice message, or both, an opt-in for a sales follow-up, and a Send My Sample Message button, followed by trust badges for no credit card required, a 4.9 out of 5 Google rating, and over 1 billion messages delivered.

Send a demo message

A marketing page that lets visitors try sending their own sample message.

Have a project, a role, or a class in mind?

Let’s talk ← Back to all work