라이브 데모: atlas.dodopayments.com를 방문하여 플랫폼을 탐색하고 모든 청구 흐름을 테스트해 보세요.
개요
아틀라스는 사용자가 텍스트 프롬프트에서 이미지를 생성하는 실제 AI 아트 생성 플랫폼을 시뮬레이션합니다. 이 데모는 각기 다른 청구 모델과 체크아웃 경험을 보여주는 세 가지 뚜렷한 구매 흐름을 강조합니다:- 사용 기반 청구: 생성된 이미지당 요금 지불 ($0.75 per image)
- 구독: 무제한 프로 플랜 ($20/월)
- 일회성 구매: 크레딧 팩 ($7에 10크레딧)
구매 흐름
아틀라스는 세 가지 개별 청구 흐름을 시연합니다. 각 흐름은 유사한 패턴을 따르지만 서로 다른 체크아웃 경험과 청구 모델을 보여줍니다.- 사용 기반 청구
- 구독
- 일회성 구매
1
이미지당 요금 선택
AI 아트 생성을 위한 이미지당 요금 옵션 ($0.75 per image)을 선택합니다. 이는 고객이 소비한 만큼만 지불하는 사용 기반 청구를 시연합니다.
2
작품 생성
텍스트 프롬프트를 입력하고 이미지를 생성합니다. 시스템은 청구 목적으로 사용량을 자동으로 추적합니다.
3
체크아웃 완료
체크아웃 과정에는 다음이 포함됩니다:
- 브랜딩된 체크아웃 페이지: Dodo Payments 체크아웃 페이지에 상인의 브랜드 이름과 로고가 표시됩니다.
- 고객 정보: 사용자 세부정보 및 청구 주소 입력
- 세금 계산: 주소 확인 후 세금이 자동으로 계산됩니다.
- 결제: 거래를 완료하기 위해 테스트 카드 세부정보 입력
4
확인 보기
결제 후, 아틀라스는 사용 세부정보와 남은 크레딧이 포함된 확인 화면을 표시합니다.
5
대시보드 접근
사용자는 아틀라스 스튜디오 대시보드로 다시 리디렉션되어 작품 생성과 사용량 모니터링을 계속할 수 있습니다.
구매 후 대시보드 경험
아틀라스 스튜디오 대시보드는 체크아웃 완료 후 청구 인식 기능 및 권한 추적을 구현하는 방법을 보여줍니다.대시보드 기능
- 즉시 접근: 사용자는 구매 후 즉시 작품 생성을 시작할 수 있습니다.
- 사용량 추적: 남은 크레딧, 활성 구독 및 생성 이력의 실시간 표시
- 청구 관리: 구매 이력, 구독 상태 및 다가오는 갱신 보기
- 원활한 통합: 적절한 권한 추적과 함께 사용자를 애플리케이션으로 다시 리디렉션하는 방법을 보여줍니다.
대시보드 경험은 권한 확인 및 사용량 모니터링을 포함한 구매 후 사용자 흐름에 대한 모범 사례를 보여줍니다.
기술 구현
아틀라스는 Dodo Payments TypeScript SDK를 사용하여 구축되었으며, 몇 줄의 코드로 청구 흐름을 통합하는 방법을 보여줍니다.통합 가이드
Dodo Payments 체크아웃 흐름을 애플리케이션에 통합하는 방법을 알아보세요.
TypeScript SDK
TypeScript SDK 문서 및 API 참조를 탐색하세요.
오픈 소스
아틀라스는 오픈 소스 프로젝트입니다. 실제 애플리케이션에서 청구 흐름이 어떻게 구현되는지 코드베이스를 탐색해 보세요.GitHub에서 보기
아틀라스 소스 코드를 탐색하고 구현에서 배워보세요.