Nuxie/Docs
Cookbook

Your First Paywall

End-to-end guide: design a paywall, publish it, and trigger a purchase

Your First Paywall

Build a paywall from scratch, connect it to a subscription product, publish it as a campaign, and handle the purchase in your iOS app. By the end, a user taps "Subscribe" in your paywall and receives the entitlement immediately.

Prerequisites:

  • A Nuxie account with an app created in the dashboard
  • At least one product with pricing configured (see Products & Prices)
  • Xcode 15+ with a Swift project targeting iOS 16+
  • Your Nuxie API key (find it in Settings > API Keys)
  • StoreKit products configured in App Store Connect

Step 1: Create a product

Navigate to Products in your app's dashboard. Click Create Product and fill in:

  • Name -- a display name like "Pro Monthly"
  • External ID -- the SDK-facing identifier, e.g. pro_monthly
  • Processor -- select App Store and enter the StoreKit product ID that matches your App Store Connect configuration

Add a price to the product:

  • Billing type -- Fixed cycle
  • Amount -- e.g. 999 (in cents) for $9.99
  • Currency -- usd
  • Interval -- Month

Step 2: Add an entitlement

Open your product and go to the Entitlements tab. Click Add Entitlement and select a boolean feature (create one first if you have not yet -- see Features & Entitlements).

For example, create a feature called "Pro Access" with external ID pro_access and type Boolean. Then add it as an entitlement on your product. Boolean entitlements require no additional configuration -- owning the product grants the feature.

Step 3: Design the paywall in the Studio

Go back to your app dashboard and click New Project to open the Studio. In the chat panel, describe the paywall you want:

Create a paywall for a productivity app with a monthly plan at $9.99. Include a feature comparison list, a free trial callout, and a subscribe button.

Nuxie generates a complete screen with styled components, product placements, and interactive buttons. The screen appears on the canvas as it streams in.

Refine the design by sending follow-up messages: "Add an annual option at $59.99" or "Make the CTA button larger." Each message updates the screen in place.

Step 4: Bind the purchase button

Select the subscribe button on your screen. In the inspector panel, set the button's action to Purchase and select the product you created in Step 1. When a user taps this button in the live paywall, the SDK initiates a StoreKit purchase for that product.

If you have multiple pricing options, bind each button to the corresponding product.

Step 5: Set the starting screen

Right-click your paywall screen on the canvas and choose Set as starting point. Every project needs a starting screen -- this is the first screen users see when the campaign triggers.

Step 6: Publish to a campaign

Click the Publish button in the top-right corner of the Studio. Select the target app, then click Launch Campaign.

Publishing does three things:

  1. Creates a version from your project -- a versioned, optimized bundle ready for delivery
  2. Creates a campaign that points at the version with delivery settings
  3. Builds the bundle and syncs it to the edge for fast delivery to devices

When the build completes, your campaign is live.

Step 7: Configure the campaign trigger

Click the link in the publish panel to open the campaign in the dashboard. On the campaign detail page, configure a trigger so the SDK knows when to show the paywall.

For an event trigger, choose an event name like paywall_requested. The SDK presents the published version whenever your app fires this event.

Set the re-entry policy to Every time so the paywall reappears whenever the user hits the trigger. See Triggers & Goals for all options.

Step 8: Install and configure the SDK

Add the Nuxie SDK to your Xcode project using Swift Package Manager.

  1. In Xcode, go to File > Add Package Dependencies
  2. Enter the repository URL: https://github.com/nuxieio/nuxie-ios
  3. Select the Nuxie library product and add it to your target

Initialize Nuxie when your app launches:

swift
import Nuxie
 
@main
struct MyApp: App {
    init() {
        let config = NuxieConfiguration(apiKey: "your_api_key")
        try? NuxieSDK.shared.setup(with: config)
    }
 
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}

On setup, the SDK fetches the user's profile from the server. The profile contains your published campaigns, segment definitions, and feature access.

Step 9: Set up the purchase delegate

The SDK uses a delegate to process StoreKit purchases. Implement NuxiePurchaseDelegate and assign it during configuration:

swift
class MyPurchaseDelegate: NuxiePurchaseDelegate {
    func purchase(_ product: StoreProductProtocol) async -> PurchaseResult {
        do {
            let result = try await product.purchase()
            return .success
        } catch {
            return .failed(error)
        }
    }
 
    func restore() async -> RestoreResult {
        do {
            try await AppStore.sync()
            return .success
        } catch {
            return .failed(error)
        }
    }
}
 
let config = NuxieConfiguration(apiKey: "your_api_key")
config.purchaseDelegate = MyPurchaseDelegate()
try NuxieSDK.shared.setup(with: config)

Warning: If your flows contain purchase buttons and no purchaseDelegate is configured, those actions fail at runtime.

Step 10: Trigger the paywall

Fire the event you configured as the campaign trigger:

swift
NuxieSDK.shared.trigger("paywall_requested")

The SDK evaluates the trigger locally, matches your campaign, and presents the paywall as a full-screen overlay. The user sees the paywall you designed in Step 3.

Step 11: Verify the entitlement

After the user completes the purchase, the SDK syncs the transaction with the server. Entitlements update immediately. Check the feature in your app:

swift
let result = Nuxie.shared.entitled(feature: "pro_access")
if result.allowed {
    // Unlock pro features
}

The SDK evaluates entitlements using the user's cached profile, so checks are fast and work offline.

What just happened

Here is the full path your paywall took:

  1. You created a product with pricing and attached a feature entitlement
  2. You designed a paywall in the Studio and bound the purchase button to the product
  3. You published the project as a campaign with an event trigger
  4. Your app called setup(with:), which fetched the profile containing the campaign
  5. Your app called trigger("paywall_requested"), which matched the campaign and presented the flow
  6. The user tapped subscribe, StoreKit processed the purchase, and the SDK synced the transaction
  7. The entitlement was granted and your app unlocked pro features

All of this happens without an app update. Change the design, republish, and users see the new paywall on their next session.

Next steps