Guide to Building a Paywall from Scratch

Don't know where to start with the Paywall Creator? Here is a helpful guide

1. Decide How Many Products this Paywall Will Sell

The products on this paywall may be different based on the placement of the paywall. For example, a common practice is to show just 1 product on the first paywall shown (ie an Onboarding screen) and then show other products at other paywalls.

Nami Pro Tip

Most paywalls feature 3 or less products.

Conduct A/B tests to find out how many products is optimal for your users at each point in the purchase flow! Too many products can lead to overwhelm while just one option can result in low conversion if the product value isn't understood.

2. Determine how to display Different Tiers of Products

If your paywall has only 1 product, skip this step.

*Product Groups Capability available on Business Tier and up † See Product Groups Modes

3. Determine how Products should be Purchased and Displayed

If your paywall has just 1 product, skip this step.

Purchase Mode

Mobile paywalls (phone and tablet) support 2 purchase modes: One-Tap Purchase and Select to Purchase.

One-Tap Purchase mode means each product button is its own CTA. When the user taps the button, the purchase flow starts immediately. This mode is selected by default.

With Select to Purchase, the paywall has a separate purchase CTA that buys the product the user has selected. Exactly 1 product is selected at a time. To enable, turn on Selected Styling.

Not sure which purchase mode to use? Try both in an AB test!

Do you want to highlight 1 or more products on the paywall? This is a common pattern that helps draw users' eyes to a particular product with different colors or a badge.

Decide which products should be highlighted and how.

Turn on Featured Styling and setup styles.

If you want a Badge on the featured product, add a Product Badge and wrap it in a Condition.

Nami Pro Tip

A good practice if you have 2 products on the paywall such as Monthly/Annual is to mark the Annual Product as Featured and highlight the cost savings.

If you have 3 products on the paywall, choose 1 product to Feature

4. Understand the Product Offers

Trials

Do any of the subscription products on your paywall feature a free trial offer for new users?

If so, do you want to enable custom paywall display based on whether a user viewing the paywall will get a free trial?

Enable Trial Eligibility to customize paywall and product copy based on Trial Eligibility

Nami Pro Tip

The paywall should always reflect exactly what the user is going to purchase. If the paywall says 'Start your 7-day Free Trial' but the user isn't eligible for this free trial because they have already redeemed it, this leads to user confusion and support issues.

Promotional Offers

Are you currently running a promotional offer on any of the subscription products on your paywall?

Promotional offers vary by platform but typically are aimed at current or former subscribers and feature offers such as 40% off first month or 30 day free trial.

Each platform handles promotional offers differently. Pricing Eligibility by Platform

Promotional Offer buying currently available on Paywalls Only plans.

If you are using Nami for subscription management and paywalls, contact us to learn how to setup purchase of Promotional Offers from your Nami paywall

Steps

  1. Specify for each product which promo to buy, using the Promo Key field.

  2. Customize paywall and product copy based on the user's offer.

Nami Pro Tip

Show the current un-discounted product price on the paywall crossed out. This helps the user visualize the special offer they are receiving.

Example: $39.99/yr $59.99/yr

5. Design the Paywall Layout

The paywall is split into 4 sections. Paywall Layout. You will need to decide where content goes and how to organize into each section.

Background

The Background sits behind all of the paywall content. By default, its a solid color but you can also insert Images or Video. The background does not scroll.

If you want an image, decide if its a fullscreen background image or just a hero image that takes up the top.

The header is a container stuck to the top of the paywall. It is full width and has a customizable height. The header will never scroll.

By default, it is transparent but you can apply a fill color.

Typically, a Close or Back Button will sit in the header. You can also put a logo or text.

If you want an edge-to-edge Carousel component at the top of your paywall, you should put it in the Header.

Content

This is the main body of the paywall. It starts directly below the header and can scroll.

The height of the Content will differ depending on the user's device. When designing, you should decide if any content is required above the fold, ie is there any content that you want to ensure is always on screen? If so, design according for short devices or utilize the Footer.

By default, Content is arranged vertically but you can add Groups to organize content in multiple different ways.

The Footer is an optional component.

It is a container that is stuck to the bottom of the paywall. It is full width and has customizable height.

The footer is perfect for use on a long paywall to make sure the purchase button or legal is always in view.

Nami Pro Tip

Restrict the footer content to make sure it doesn't take up more than 1/4 of the screen. A really tall footer will make it difficult to see the paywall content.

Last updated