Zum Hauptinhalt springen
Atlas Demo Product - AI art generation platform with integrated billing
Atlas ist eine voll funktionsfähige Demo-Anwendung von Dodo Payments, die eine KI-Kunstgenerierungsplattform präsentiert. Sie demonstriert alle drei Abrechnungsmodelle—nutzungsbasierte Abrechnung, Einmalzahlungen und Abonnements—mit integrierten Checkout-Prozessen.
Live-Demo: Besuche atlas.dodopayments.com, um die Plattform zu erkunden und alle Abrechnungsabläufe zu testen.

​
Übersicht

Atlas simuliert eine reale KI-Kunstgenerierungsplattform, auf der Benutzer Bilder aus Textaufforderungen erstellen. Die Demo hebt drei verschiedene Kaufabläufe hervor, die jeweils unterschiedliche Abrechnungsmodelle und Checkout-Erfahrungen demonstrieren:
  • Nutzungsbasierte Abrechnung: Zahlung pro generiertem Bild (0,75 $ pro Bild)
  • Abonnement: Unbegrenzter Pro-Plan (20 $/Monat)
  • Einmaliger Kauf: Kreditpakete (7 $ für 10 Credits)
Nach Abschluss eines Kaufs werden die Benutzer zum Atlas Studio Dashboard weitergeleitet, wo sie Kunstwerke generieren und ihre Nutzung in Echtzeit verfolgen können.

​
Kaufabläufe

Atlas demonstriert drei separate Abrechnungsflüsse. Jeder Fluss folgt einem ähnlichen Muster, zeigt jedoch unterschiedliche Checkout-Erfahrungen und Abrechnungsmodelle.
1

Select pay-per-image pricing

Wähle die Pay-per-Image-Option (0,75 $ pro Bild) für die KI-Kunstgenerierung. Dies demonstriert nutzungsbasierte Abrechnung, bei der Kund:innen nur für das bezahlen, was sie verbrauchen.
2

Generate artwork

Gib einen Texteingabeaufforderung ein und generiere ein Bild. Das System verfolgt automatisch die Nutzung für Abrechnungszwecke.
3

Complete checkout

Der Bezahlvorgang umfasst:
  • Marken-Checkout-Seite: Die Dodo Payments-Checkout-Seite zeigt den Markennamen und das Logo Ihres Unternehmens an
  • Kundeninformationen: Geben Sie Benutzerdaten und Rechnungsadresse ein
  • Steuerberechnung: Steuern werden automatisch nach Bestätigung der Adresse berechnet
  • Zahlung: Geben Sie Testkartendaten ein, um die Transaktion abzuschließen
Verwende die Testkarte 4242 4242 4242 4242 mit einem beliebigen zukünftigen Ablaufdatum und CVC, um erfolgreiche Transaktionen zu simulieren.
4

View confirmation

Nach der Zahlung zeigt Atlas einen Bestätigungsbildschirm mit Nutzungsdetails und verbleibenden Guthaben an.
5

Access dashboard

Nutzer:innen werden zurück zum Atlas Studio Dashboard geleitet, wo sie weiterhin Kunstwerke generieren und ihre Nutzungsverfolgung überwachen können.

​
Dashboard-Erlebnis nach dem Kauf

Das Atlas Studio Dashboard demonstriert, wie man abrechnungsbewusste Funktionen und Berechtigungsverfolgung nach Abschluss des Checkouts implementiert.

​
Dashboard-Funktionen

  • Sofortiger Zugang: Benutzer können sofort nach dem Kauf mit der Generierung von Kunstwerken beginnen
  • Nutzungsverfolgung: Echtzeit-Anzeige der verbleibenden Credits, aktiven Abonnements und Generierungshistorie
  • Abrechnungsmanagement: Kaufhistorie, Abonnementstatus und bevorstehende Erneuerungen einsehen
  • Nahtlose Integration: Zeigt, wie Benutzer mit ordnungsgemäßer Berechtigungsverfolgung zurück zu Ihrer Anwendung umgeleitet werden können
Die Dashboard-Erfahrung zeigt Best Practices für Post-Purchase-User-Flows, einschließlich Berechtigungsüberprüfung und Nutzungsüberwachung.

​
Technische Implementierung

Atlas ist mit dem Dodo Payments TypeScript SDK erstellt, das zeigt, wie man Abrechnungsflüsse mit nur wenigen Codezeilen integriert.

Integration Guide

Erfahre, wie du Dodo Payments Checkout-Flows in deine Anwendung integrierst.

TypeScript SDK

Erkunde die TypeScript-SDK-Dokumentation und die API-Referenz.

​
Open Source

Atlas ist ein Open-Source-Projekt. Erkunden Sie den Code, um zu sehen, wie Abrechnungsflüsse in einer realen Anwendung implementiert sind.

View on GitHub

Durchstöbere den Atlas-Quellcode und lerne aus der Implementierung.