開発者向けSPREEAI

試着室を作って
すべての画面に。.

Shopify、Web SDK、または承認されたAPI連携から始めましょう。このハブは、チームを最初の決定からテスト済みのローンチへと導きます。.

構築を開始完全なドキュメントを開く ↗

04: 統合パス
v2.1: 現在のWeb SDK
01: ローンチチェックリスト

開発者の視点ムリナル・シュクラ開発責任者

自分の道を選べ

あなたが
コマーススタックは生きている。.

ストアフロントに最適な、最も迅速な方法を選択してください。体験が成長するにつれて、マネージドアプリからカスタムSDKまたはAPIインテグレーションへ移行することができます。.

ライブ

最速の経路

Shopifyアプリ

インストールし、ガーメントを同期し、カスタマイズして、カスタムバックエンドなしで起動します。.Shopifyストアに最適 ↗ v2.1.0

カスタムウェブ

Web SDK

配置、スタイル、イベント、サイズ、および「カートに追加」の動作を制御します。.JavaScript + TypeScript ↗ ドキュメント

ネイティブモバイル

iOS SDK

SPREEAIの体験を既存のiOSショッピングジャーニーに導入します。.iOSガイドを開く ↗ ドキュメント

ネイティブモバイル

Android SDK

ネイティブコントロールを使用して、試着機能をAndroidの製品体験に統合する。.Androidガイドを開く ↗ パートナーアクセス

カスタムシステム

パブリックAPI

サーバーサイドおよびカタログのワークフローには、承認済みのAPIリファレンスを使用してください。.API リファレンスを開く ↗

近日公開

マーケットプレイス

Amazonパートナーネットワーク

Amazonとのマーケットプレイス対応の統合パスが開発中です。.更新情報がここに最初に表示されます

Web SDK クイックスタート

インストールから
動作するボタン.

一度認証すれば、ページのどこでも試着やサイズ測定を表示できます。オンボーディング時に発行されたテスト認証情報を使用し、クライアントシークレットをブラウザコードに記述しないでください。.

npm install @spreeai/web-sdk

# または
yarn add @spreeai/web-sdk

import { init } from "@spreeai/web-sdk";

const sdk = await init({
  clientId: "your-client-id",
  partnerId: "your-partner-id",
});

if (sdk) {
  await sdk.renderTryOnButton({
    elementId: "spreeai-try-on",
    garments: [{ garmentId: "your-garment-id" }],
    enableAddToCart: true,
  });
}

events: {
  onTryOnButtonClick: (event) => {
    analytics.track("try_on_started", event);
  },
  onAddToCartClicked: async (event) => {
    // 既存のカートのワークフローに接続します。
  },
}

統合モデル

4つのシステム。.
1つの顧客体験.

01カタログ

製品ID、バリエーション、画像、およびマーチャンダイジングのコンテキスト.

02SPREEAI インジェクション

衣類は、処理、レビュー、および準備の状態を経て移動します。.

03SDK または API

お客様のストアフロントは、対象商品のエクスペリエンスをリクエストします。.

04顧客のアクション

試着して、サイズを探し、コーディネートを完成させて、レジに戻りましょう。.

本番パス

統合する
ゴールラインを越えて.

クリーンなローンチとは、単にボタンが機能する以上のものです。アクセスの整合、アセット、挙動、品質、測定を揃えるために、この手順を活用してください。.

01
最初のジャーニーのスコープを設定する
1つのチャネル、カタロググループ、カスタマーモーメント、および成功指標を選択してください。.
オーナー · プロダクト＋コマース
02
アクセスを準備する
パートナーID、承認済みクライアント資格情報、ストアフロントの権限、およびステージング環境を確認してください。.
オーナー · エンジニアリング
03
不要なアセットを削除する
画像1枚につき衣類1点、正面からのビューが必須、高解像度、クリーンなライティング、SKUに合わせたファイル名。.
オーナー · カタログチーム
04
ステージング環境に統合する
対象商品のみに表示し、バリエーションとカートの挙動を連動させ、エントリーポイントをブランドに一致させます。.
オーナー · フロントエンド
05
ローンチQAを実行
モバイルとデスクトップのテスト、ブラウザの網羅性、アクセシビリティ、パフォーマンス、視覚的忠実度、および障害状態のテスト。.
オーナー · QA + ブランド
06
有効化と計測
Ready製品を有効にし、ステージングされたエクスペリエンスを公開して、採用、完了、コンバージョンを監視します。.
オーナー · コマース + アナリティクス