เส้นทางที่เร็วที่สุด
SPREEAI สำหรับนักพัฒนา
สร้างห้องลองเสื้อ
ในทุกหน้าจอ
เชื่อมต่อแคตตาล็อกของคุณ สร้างประสบการณ์ลูกค้าให้ดียิ่งขึ้น นำ Always On เข้าสู่หน้าร้านค้าของคุณด้วยเส้นทางการผสานรวมที่เหมาะสมกับทีมของคุณ
เลือกเส้นทางของคุณ
เริ่มต้นจากจุดที่คุณ
ระบบอีคอมเมิร์ซยังคงใช้งานได้อยู่
ใช้ Shopify สำหรับการตั้งค่าแบบจัดการ หรือผสานรวมกับ SDK และ API ของเรา เลือกคุณสมบัติที่ธุรกิจของคุณต้องการ และรักษาประสบการณ์การช้อปปิ้งของแบรนด์คุณไว้
เว็บแบบกำหนดเอง
เว็บ SDK
ควบคุมการจัดวาง การจัดรูปแบบ เหตุการณ์ ขนาด และพฤติกรรมการเพิ่มสินค้าลงตะกร้าJavaScript + TypeScript เอกสารเนทีฟมือถือ
iOS SDK
นำประสบการณ์ SPREEAI มาสู่ขั้นตอนการช้อปปิ้งบน iOS ที่มีอยู่แล้วเปิดคู่มือ iOS เอกสารเนทีฟมือถือ
Android SDK
ผสานรวมฟังก์ชั่นลองสวมใส่เข้ากับประสบการณ์การใช้งานผลิตภัณฑ์ Android ด้วยการควบคุมแบบเนทีฟเปิดคู่มือ Android การเข้าถึงของพันธมิตรระบบที่กำหนดเอง
API สาธารณะ
ใช้เอกสารอ้างอิง API ที่ได้รับการอนุมัติสำหรับเวิร์กโฟลว์ฝั่งเซิร์ฟเวอร์และแคตตาล็อกเอกสารอ้างอิง Open APIตลาดซื้อขาย
เครือข่ายพันธมิตรของ Amazon
เร็วๆ นี้ จะพร้อมใช้งานบนเครือข่ายพันธมิตรของ Amazon และแพลตฟอร์มอื่นๆ พร้อมวิธีการผสานรวม SPREEAI เข้ากับระบบอีคอมเมิร์ซของคุณได้มากขึ้นข่าวสารอัปเดตจะปรากฏที่นี่เป็นที่แรกคู่มือเริ่มต้นใช้งาน Web SDK อย่างรวดเร็ว
การผสานรวมครั้งแรกของคุณ
ยืนยันตัวตนเพียงครั้งเดียว จากนั้นจึงแสดงตัวอย่างการลองสวมหรือการเลือกขนาดได้ทุกที่บนหน้าเว็บ ใช้ข้อมูลประจำตัวสำหรับการทดสอบที่ได้รับระหว่างขั้นตอนการเริ่มต้นใช้งาน และห้ามใส่รหัสลับไคลเอ็นต์ในโค้ดของเบราว์เซอร์เด็ดขาด
npm install @spreeai/web-sdk@3.0.0
# or
yarn add @spreeai/web-sdk@3.0.0import { init } from "@spreeai/web-sdk";
import "@spreeai/web-sdk/dist/web-sdk.css";
// Add <div id="spreeai-try-on"></div> to the product page first.
const sdk = await init({ clientId: "your-client-id" });
if (sdk) {
await sdk.renderTryOnButton({
elementId: "spreeai-try-on",
garments: [{ garmentId: "your-garment-id" }],
enableAddToCart: true,
});
}// Pass events inside renderTryOnButton's options.
await sdk?.renderTryOnButton({
elementId: "spreeai-try-on",
garments: [{ garmentId: "your-garment-id" }],
events: {
onTryOnButtonClick: (event) => {
console.info(event.name);
},
onAddToCartClicked: (event) => {
// Connect event.garments to your storefront's cart.
},
},
});แบบจำลองการบูรณาการ
สี่ระบบ
ช่วงเวลาหนึ่งของลูกค้า
รหัสสินค้า รูปแบบสินค้า รูปภาพ และบริบททางการตลาด
เสื้อผ้าจะผ่านขั้นตอนการผลิต การตรวจสอบ และการเตรียมความพร้อม
ร้านค้าออนไลน์ของคุณขอประสบการณ์การใช้งานสำหรับผลิตภัณฑ์ที่เข้าเกณฑ์
ลองสวมใส่ หาขนาดที่พอดี แต่งตัวให้ครบชุด แล้วกลับไปที่หน้าชำระเงิน
เส้นทางที่มุ่งเน้นสู่การเปิดตัว
เตรียมพร้อม. เชื่อมต่อ.
ใช้ชีวิตอย่างมั่นใจ
สามเป้าหมายสำคัญ พร้อมด้วยรายการตรวจสอบที่ใช้งานได้จริงสำหรับแต่ละเป้าหมาย
- 01 · เตรียมความพร้อม
จุดเริ่มต้นที่ชัดเจน
ปรับเส้นทางการใช้งาน การเข้าถึง และแคตตาล็อกให้สอดคล้องกัน
รายการตรวจสอบการเตรียมความพร้อม
- เลือกช่องทางการขาย กลุ่มแคตตาล็อก และตัวชี้วัดความสำเร็จอย่างใดอย่างหนึ่ง
- ยืนยันการเข้าถึงของพาร์ทเนอร์ ข้อมูลประจำตัว และสิทธิ์ในการจัดเตรียมระบบ
- จัดเตรียมภาพสินค้าที่สะอาดตาและตรงกับรหัสสินค้า (SKU)
- 02 · เชื่อมต่อ
ทำให้รู้สึกเหมือนเป็นส่วนหนึ่งของท้องถิ่น
สร้างในสภาพแวดล้อมทดสอบ ทดสอบกระบวนการทั้งหมด
รายการตรวจสอบการบูรณาการ
- แสดงผลสำหรับสินค้าที่เข้าเกณฑ์ และเชื่อมโยงตัวเลือกสินค้ากับพฤติกรรมของตะกร้าสินค้า
- สร้างประสบการณ์ที่สอดคล้องกับแบรนด์
- ตรวจสอบสถานะการใช้งานบนมือถือ เดสก์ท็อป การเข้าถึง ประสิทธิภาพ และข้อผิดพลาด
- 03 · เปิดตัว
เรียนรู้จากประสบการณ์จริง
เปิดใช้งานผลิตภัณฑ์ที่พร้อมใช้งานและทำการวัด
รายการตรวจสอบการเปิดตัว
- ตรวจสอบความพร้อมของผลิตภัณฑ์และเผยแพร่ประสบการณ์การใช้งานจริง
- ติดตามการนำไปใช้ การดำเนินการให้เสร็จสมบูรณ์ และการเปลี่ยนแปลงไปสู่รูปแบบใหม่
- ใช้ผลลัพธ์เพื่อเป็นแนวทางสำหรับหมวดหมู่หรือเส้นทางถัดไป
ฐานสินทรัพย์
การป้อนข้อมูลที่ดีจะนำไปสู่ผลลัพธ์ที่ดีกว่า
- JPEG หรือ PNG
- ขนาดขั้นต่ำ 2,000 × 2,000 พิกเซล
- ต้องแสดงภาพด้านหน้า
- แนะนำให้ดูจากด้านหลัง
- แสงสว่างที่เป็นกลางและสม่ำเสมอ
- รหัสสินค้า (SKU หรือ Style ID) ในชื่อไฟล์
เอกสารอ้างอิงสำหรับนักพัฒนา
ค้นหาสิ่งต่อไป
คำตอบที่มีประโยชน์
เริ่มต้นที่นี่
เริ่มต้นใช้งาน
ทำความเข้าใจเกี่ยวกับการเข้าถึง แพลตฟอร์มที่รองรับ และการตัดสินใจเบื้องต้นที่ทีมของคุณต้องทำ
เอกสารอ้างอิงอย่างเป็นทางการ การผสานรวมแบบจัดการการเริ่มต้นใช้งาน Shopify
ติดตั้งแอป ยอมรับข้อตกลง ซิงค์ข้อมูลเสื้อผ้า ปรับแต่งปุ่ม และเริ่มใช้งานได้เลย
เอกสารอ้างอิงอย่างเป็นทางการ เว็บ SDKพื้นผิว API
ตรวจสอบการเริ่มต้นใช้งาน ตัวเลือกการแสดงผล ขนาด การปรับแต่ง และอินเทอร์เฟซแบบกำหนดประเภท
เอกสารอ้างอิงอย่างเป็นทางการ API พันธมิตรเอกสารอ้างอิง API สาธารณะ
สำรวจอินเทอร์เฟซฝั่งเซิร์ฟเวอร์ที่ได้รับการอนุมัติ ซึ่งพร้อมใช้งานสำหรับพันธมิตรที่ได้รับการตรวจสอบสิทธิ์แล้ว
อ้างอิงถึงความเท่ คุณภาพสินทรัพย์เสื้อผ้า
เตรียมภาพผลิตภัณฑ์และข้อมูลเมตาให้พร้อมสำหรับการนำเข้าและตรวจสอบอย่างราบรื่น
คู่มือ SPREEAI การผลิตการทดสอบคุณภาพและการเปิดตัว
ใช้เบราว์เซอร์ที่ใช้ร่วมกัน ประสิทธิภาพ การเข้าถึง และรายการตรวจสอบการเปิดใช้งานจริง
คู่มือ SPREEAI สนับสนุนการแก้ไขปัญหา
แก้ไขปัญหาการตรวจสอบสิทธิ์ คุณสมบัติ การแสดงผล และประสิทธิภาพการทำงานที่พบบ่อยที่สุด
คู่มือ SPREEAI เอกสารประกอบคู่มือการใช้งาน
เรียกดูคู่มือเริ่มต้นใช้งานฉบับย่อ มาตรฐานสินทรัพย์ รายการตรวจสอบการเปิดใช้งาน และคำแนะนำในการแก้ไขปัญหาสำหรับสาธารณะ
เอกสารเปิดไม่พบทรัพยากรสำหรับนักพัฒนาที่ตรงกัน ลองใช้ “Shopify,” “SDK,” “assets” หรือ “QA” แทน
สร้างเพื่อการผลิต
รายละเอียดที่ปกป้อง
ประสบการณ์ของลูกค้า
ความปลอดภัย
เก็บความลับไว้ในฝั่งเซิร์ฟเวอร์ ใช้เฉพาะสภาพแวดล้อมที่ได้รับอนุญาต และหมุนเวียนข้อมูลประจำตัวผ่านขั้นตอนการทำงานของพันธมิตร
ความเป็นส่วนตัว
ขอภาพจากลูกค้าโดยได้รับความยินยอมอย่างชัดเจน และจัดการข้อมูลให้สอดคล้องกับแผนการบูรณาการที่ได้รับการอนุมัติแล้ว
ผลงาน
โหลดประสบการณ์การใช้งานในจุดที่จำเป็น ทดสอบบนอุปกรณ์จริง และตรวจสอบการเปลี่ยนแปลงที่เกิดขึ้นกับหน้าผลิตภัณฑ์
การเข้าถึง
รักษาการเข้าถึงแป้นพิมพ์ ลำดับการโฟกัส ชื่อที่เข้าถึงได้ และเส้นทางที่ใช้งานได้เมื่อไม่สามารถเข้าถึงประสบการณ์การใช้งานได้
คำถามที่พบบ่อยสำหรับนักพัฒนา
คำถามก่อน
การคอมมิตครั้งแรก
เราควรเลือกการผสานรวมแบบใด?
ใช้แอป Shopify สำหรับเส้นทางการจัดการที่รวดเร็วที่สุด ใช้ Web SDK สำหรับการวางเว็บแบบกำหนดเองหรือแบบ Headless ใช้ Native SDK สำหรับประสบการณ์การใช้งานแอป และใช้เอกสารอ้างอิง API ที่ได้รับการอนุมัติสำหรับเวิร์กโฟลว์ฝั่งเซิร์ฟเวอร์ที่ตกลงกันไว้ระหว่างการเริ่มต้นใช้งาน
ข้อมูลประจำตัวมาจากไหน?
SPREEAI จะออกรหัสพาร์ทเนอร์และข้อมูลประจำตัวที่ได้รับอนุมัติระหว่างขั้นตอนการเริ่มต้นใช้งาน SDK ของเบราว์เซอร์ใช้รหัสไคลเอ็นต์และรหัสพาร์ทเนอร์ ห้ามฝังรหัสลับไคลเอ็นต์ไว้ในโค้ดฝั่งฟรอนต์เอนด์เด็ดขาด
แอป Shopify จำเป็นต้องใช้คีย์ API หรือไม่?
ขั้นตอนการเริ่มต้นใช้งานแอป Shopify ในปัจจุบันจะเชื่อมต่อร้านค้าหลังจากขั้นตอนข้อตกลงและการสมัครสมาชิกที่จำเป็นเสร็จสิ้นแล้ว แอปที่ได้รับการจัดการไม่จำเป็นต้องคัดลอกคีย์ลงในหน้าจอการตั้งค่า
ทำไมปุ่ม "ลองสวม" ถึงไม่ปรากฏขึ้น?
ตรวจสอบให้แน่ใจว่ากระบวนการของเสื้อผ้าเสร็จสมบูรณ์แล้ว เปิดใช้งานสำหรับการลองสวมใส่ ตรงกับสินค้าหรือตัวเลือกที่ใช้งานอยู่ และมีบล็อกแอปหรือคอนเทนเนอร์ SDK อยู่ในเทมเพลตสินค้า
มีกิจกรรมสำหรับลูกค้าอะไรบ้าง?
เอกสารประกอบ SDK ระบุฟังก์ชันเรียกกลับ (callback) ที่ครอบคลุมการคลิกปุ่ม "ลองสวม" และการเพิ่มสินค้าลงในตะกร้า เชื่อมต่อฟังก์ชันเหล่านี้เข้ากับเลเยอร์การวิเคราะห์ของคุณโดยไม่ต้องรวมภาพลูกค้าหรือข้อมูลส่วนบุคคลที่ไม่จำเป็น
มีเว็บฮุคสำหรับเซิร์ฟเวอร์ให้ใช้งานหรือไม่?
เว็บฮุคแบบพุชจากเซิร์ฟเวอร์ไม่ได้เป็นส่วนหนึ่งของเอกสาร SDK ที่เผยแพร่ในปัจจุบัน โปรดปรึกษาหารือกับทีมวิศวกรรมของพันธมิตรเกี่ยวกับข้อกำหนดของเหตุการณ์ฝั่งเซิร์ฟเวอร์ก่อนที่จะนำไปใช้งาน
นักพัฒนาซอฟต์แวร์จะได้รับความช่วยเหลือจากที่ไหน?
ใช้ช่องทางการสนับสนุนทางเทคนิคที่แจ้งไว้ระหว่างขั้นตอนการเริ่มต้นใช้งาน หรือส่งอีเมลมาก็ได้ support@spreeai.comโปรดระบุสภาพแวดล้อม รหัสผลิตภัณฑ์ เบราว์เซอร์หรืออุปกรณ์ เวลา และวิธีการจำลองปัญหาโดยย่อ—ห้ามส่งข้อมูลลับเด็ดขาด
การสนับสนุนจาก Amazon Partner Network จะพร้อมใช้งานเมื่อใด?
การเชื่อมต่อกับเครือข่ายพันธมิตรของ Amazon ยังอยู่ในระหว่างการพัฒนา จึงมีการทำเครื่องหมายว่า "กำลังจะมาในเร็วๆ นี้" โดยเจตนา จนกว่าส่วนติดต่อผู้ใช้สำหรับการเริ่มต้นใช้งานและการใช้งานจริงจะพร้อมสำหรับนักพัฒนาภายนอก
พร้อมสร้างแล้วหรือยัง?