# In-App Purchase Success Modal UI (Free, Done Right)

> By Lawrence Arya, Founder & CEO of VP0. Published 2026-05-30, updated 2026-06-02. 4 min read.
> Source: https://vp0.com/blogs/in-app-purchase-success-modal-ui-free

It is a confirmation, not a celebration that gets in the way: remove doubt, lead to the unlocked feature.

**TL;DR.** A clear in-app purchase success modal confirms the charge, names what was unlocked, and offers one next action. Build it from a free VP0 design and show it only after StoreKit confirms the transaction. Handle pending and failed states honestly, and keep it brief and non-blocking.

The moment right after a purchase is small but important: a clear success modal confirms the charge, tells the user what they just unlocked, and points them to the next step. Get it wrong and you get support tickets and refund requests; get it right and the purchase feels finished and trustworthy. The short answer is, design a simple success modal from a free VP0 design, show it only after StoreKit confirms the transaction, and make the next action obvious. It is a confirmation, not a celebration that gets in the way.

## Why the success modal matters

A purchase without clear confirmation creates doubt: "Did it go through? Am I charged twice?" That doubt drives support contacts and chargebacks, and it dents the trust that keeps users around, where day-1 retention is already only about [25%](https://getstream.io/blog/app-retention-guide/). A good modal removes the doubt instantly: what was purchased, that it succeeded, and what to do next (start using the feature). It should be brief and dismissible, and it must reflect the real transaction state from Apple's [StoreKit](https://developer.apple.com/documentation/storekit), never a guessed "success" before the transaction actually completes.

## How to build the success modal

VP0 is a free iOS design library for AI builders. Pick a modal, sheet, or confirmation design, copy the link, and have Cursor or Claude Code build it in [React Native](https://reactnative.dev/) or SwiftUI: a clear checkmark, a one-line "You unlocked [feature]," and a single primary button to start using it. Trigger it from the StoreKit transaction result (the verified, completed state), and handle the other states too, pending (for example, Ask to Buy) and failed, with their own honest messaging. Keep it light: a short animation is fine, a long one that blocks the next action is not, since the user's goal is to use what they bought, not to watch a screen. For the purchase screen before it, see [iOS paywall screen design inspiration](/blogs/ios-paywall-screen-design-inspiration/).

## Success modal building blocks

Here is what each part should do.

| Part | What to get right |
|---|---|
| Confirmation | Clear "success," from StoreKit |
| What unlocked | Name the feature or plan |
| Next action | One button to start using it |
| Receipt access | Where to find the receipt |
| Other states | Pending and failed handled |

## A worked example

Say a user upgrades to Pro. After StoreKit confirms the transaction, show a VP0-designed modal: a checkmark, "You are now Pro, all templates unlocked," and a "Start exploring" button that takes them straight to the newly unlocked content, not back to a generic home. If the purchase is pending approval, show "Waiting for approval" instead of success; if it fails, show a clear reason and a retry. Keep the copy specific too: "Pro unlocked, all templates available" tells the user more than a generic "Thank you for your purchase," and log the transaction id (never card data) so support can help if anything looks wrong later. To stop involuntary failures down the line, see [expiring credit card update UI mobile](/blogs/expiring-credit-card-update-ui-mobile/), and to offer a Wallet receipt, [Apple Wallet pass UI template free](/blogs/apple-wallet-pass-ui-template-free/).

## Common mistakes

The most common mistake is showing success before StoreKit confirms the transaction, which lies to the user and breaks restores. The second is a generic modal that does not say what was unlocked. The third is dumping the user back on the home screen instead of into the thing they just paid for. The fourth is a long, blocking celebration animation. The fifth is ignoring pending and failed states, leaving users confused when a purchase is not a clean success.

## Key takeaways

- The post-purchase modal confirms the charge, names what unlocked, and points to the next step.
- Show success only after StoreKit confirms the transaction, never a guessed success.
- Keep it brief with one clear next action that leads into the unlocked feature.
- Handle pending and failed states honestly, and make the receipt easy to find.

## Frequently asked questions

How do I design an in-app purchase success modal? Build a simple modal from a free VP0 design with a clear confirmation, the name of what was unlocked, and one button to start using it. Trigger it only from StoreKit's verified, completed transaction state.

When should the success modal appear? Only after StoreKit confirms the transaction completed. Showing success earlier misleads users and can break restore purchases.

What about pending or failed purchases? Handle them with their own messaging: a "waiting for approval" state for pending (such as Ask to Buy) and a clear reason plus retry for failed. Do not show success for either.

Should the modal celebrate the purchase? A short, light confirmation is fine, but keep it brief and non-blocking. The goal is to remove doubt and lead the user into what they unlocked, not to delay them.

## Frequently asked questions

### How do I design an in-app purchase success modal?

Build a simple modal from a free VP0 design with a clear confirmation, the name of what was unlocked, and one button to start using it. Trigger it only from StoreKit's verified, completed transaction state.

### When should the success modal appear?

Only after StoreKit confirms the transaction completed. Showing success earlier misleads users and can break restore purchases.

### What about pending or failed purchases?

Handle them with their own messaging: a 'waiting for approval' state for pending (such as Ask to Buy) and a clear reason plus retry for failed. Do not show success for either.

### Should the modal celebrate the purchase?

A short, light confirmation is fine, but keep it brief and non-blocking. The goal is to remove doubt and lead the user into what they unlocked, not to delay them.

---
*Published on the [VP0 Journal](https://vp0.com/blogs). Free to read, index and cite with attribution.*
