Five tips on paywall design best practices from color to layout. Learn industry secrets on how to design a mobile app paywall that converts.
Table of Contents:
Your mobile app paywall is a key driver of revenue. Designing for usability can help optimize your revenue streams. Here are our 5 tips for paywall design best practices, from color to length.
This blog post is part of our Paywall Best Practices series. Check out Part 2: Best Practices for Paywall Products and Part 3: Best Practices for Paywall Placement.
Color is a powerful design element. Too little color can be boring. Too much color can mean your user doesn’t know where to look.
Use your brand color or primary app color sparingly on the paywall to draw attention to the purchase action.
Pro tip: squint at your paywall or use an image editor to apply a thick blur effect to it. What elements still stand out? Where is your eye drawn? If there are multiple elements competing for attention even when squinting or blurred, you don’t have a clear call to action. Reduce design elements or use of color until it is more clear.
Looking for design inspiration? The Nami Paywall Gallery has hundreds of examples of mobile app paywalls from top industry apps.
Users are skimming over your paywall on their phone. They don’t want to read through paragraphs of copy, even if the copy is really well written! Stick to a few lines of carefully written copy like an ad, and use short bullets to spell out the benefits of your product.
If you are using a checklist on your paywall, limit the bullets to no more than 7 and experiment with the items and order of the bullets to improve optimization rather than adding more copy.
Also known as a gallery or a slideshow, a carousel is a component composed of multiple “slides. Slides are made up of text, photos, and even video. Users can use their finger to swipe through the slides, or carousels can automatically advance through slides.
To create a carousel, first add catchy imagery and short, clear copy for each slide. Then optimize your carousel by testing the order of the slides and the number of slides shown.
Pro tip: if the user clicks to unlock feature A, make sure that feature A is explained on the first slide in the carousel. That way the value prop is clear and they don’t have to swipe to search for it.
Looking for more examples of mobile app paywalls with carousels? Check out the Nami paywall gallery.
Users typically need to see the paywall multiple times before they want to purchase. Don’t force your user to make a purchasing decision right away, otherwise they may just close your app and never return.
Paywall design best practices include an ‘X’ or ‘<’ icon in the top menu bar or a link that says ‘Close’, ‘Later’, or ‘Not Now’.
Scrolling can be a distraction to the user. Only use this pattern if you have lots of quality content to display.
If you don’t need your paywall to scroll, test and optimize your paywall for devices of all sizes so that there isn’t a scrollbar when there doesn’t need to be. Try reducing whitespace and text size in order to get everything to fit.
Looking for more tips on paywalls? Submit your paywall for personalized advice from our team.