Codia
กลับสู่บทความทั้งหมด

Open API และระบบนิเวศนักพัฒนาของ Codia

Developer Platform2026-04-22

ทำไม Codia ถึงเปิด API

ผลิตภัณฑ์ Codia แปลงคอนเทนต์เชิงภาพให้เป็น assets ที่มีโครงสร้างและแก้ไขได้ API มีไว้สำหรับทีมที่ต้องการความสามารถเดียวกันนี้อยู่ในผลิตภัณฑ์ของตนเอง สคริปต์ย้ายข้อมูล เวิร์กโฟลว์เอเจนต์ ระบบ QA หรือ pipeline ทำงานอัตโนมัติด้านการออกแบบ

แพลตฟอร์มนักพัฒนานี้ตั้งอยู่บนแนวคิดง่ายๆ: อินพุตเชิงภาพควรกลายเป็นข้อมูลมีโครงสร้างที่ซอฟต์แวร์ใช้เหตุผลต่อได้

Visual Struct สำหรับรูปภาพ

endpoint สำหรับรูปภาพของ Visual Struct แปลงภาพหน้าจอ UI หรือ mockup ให้เป็น tree JSON แบบลำดับชั้น

http
POST https://api.codia.ai/v1/open/image_to_design

ผลลัพธ์มีองค์ประกอบแบบมีชนิดข้อมูล เช่น headers, buttons, cards, tables, charts, icons, text และ panels โหนดจะมี bounding box การตั้งค่าเลย์เอาต์ เมตาดาต้าความมั่นใจ และองค์ประกอบลูก

เอกสารอธิบายรูปแบบเอาต์พุตไว้สามแบบ:

  • json สำหรับ pipeline downstream แบบกำหนดเอง
  • svg สำหรับการเรนเดอร์ใหม่เป็นเวกเตอร์แบบไม่ผูกกับเครื่องมือออกแบบ
  • figma สำหรับการใส่เข้าไปในไฟล์ Figma ผ่านปลั๊กอินหรือ flow การนำเข้า

นี่คือ API ที่ใช้เมื่อภาพหน้าจอ UI mockup หรือ reference เชิงภาพจำเป็นต้องกลายเป็นสิ่งที่เครื่องอ่านได้

PDF to Visual Struct

PDF ใช้ endpoint ที่เกี่ยวข้องกัน:

http
POST https://api.codia.ai/v1/open/pdf_to_design

endpoint นี้แปลงหน้า PDF ให้เป็น Visual Element Schema ของ Codia: ลำดับชั้นแบบมีชนิดข้อมูลพร้อม bounding box การตั้งค่าเลย์เอาต์ สเปกของสไตล์ และองค์ประกอบลูก schema เดียวกันนี้ใช้ร่วมกับ Visual Struct สำหรับรูปภาพ ดังนั้นผู้บริโภคปลายทางจึงรองรับอินพุตทั้งรูปภาพและ PDF ได้ด้วยโมเดลการประมวลผลเดียว

เอกสารระบุการใช้งานทั่วไป เช่น ตัวนำเข้า Figma เครื่องมือสร้างโค้ด pipeline QA เชิงภาพ และเวิร์กโฟลว์การเรนเดอร์

อัปโหลดและเวิร์กโฟลว์งาน

สำหรับเวิร์กโฟลว์ที่ต้องการจัดการไฟล์แบบส่วนตัวหรือ job ที่ทำงานยาวนาน เนื้อหา Open API ที่มีอยู่ได้อธิบายรูปแบบอัปโหลดและงานไว้:

  • อัปโหลดไฟล์ส่วนตัวไปที่ /v1/open/uploads
  • รับ upload_id ที่เป็น opaque
  • สร้าง task ผ่าน /v1/open/tasks
  • รับ webhook events หรือ poll สถานะ task
  • ดาวน์โหลด output ที่สร้างเสร็จเมื่อ task จบ

บทความ PDF to editable PPTX สไตล์ NotebookLM ใช้รูปแบบนี้สำหรับการทำงานอัตโนมัติ PDF-to-PowerPoint ฝั่งเซิร์ฟเวอร์ กฎการใช้งานสำคัญคือ Codia API key ต้องอยู่บนเซิร์ฟเวอร์ของคุณ ไม่ใช่ในเบราว์เซอร์

นักพัฒนาสร้างอะไรกับมัน

API นี้มีประโยชน์เมื่อทีมต้องการความเข้าใจเชิงภาพแบบมีโครงสร้างในระบบอื่น:

  • การจัดเก็บและวิเคราะห์ UI ของคู่แข่ง
  • การตรวจ audit design system
  • การตรวจ QA เชิงภาพและ regression แบบอัตโนมัติ
  • flow นำเข้าภาพหน้าจอไปยัง Figma
  • การดึงโครงสร้างจาก PDF
  • การเตรียมข้อมูลก่อนสร้างโค้ด
  • เวิร์กโฟลว์เอเจนต์ที่ต้องการโครงสร้าง UI ที่เครื่องอ่านได้
  • เครื่องมือย้ายข้อมูลเป็นชุดสำหรับคลังดีไซน์ขนาดใหญ่

ผลลัพธ์ไม่ใช่แค่ภาพหน้าจอที่มีป้ายกำกับ แต่มันคือ tree ที่กรอง แปลง เรนเดอร์ นำเข้า หรือส่งต่อให้โมเดลอื่นได้

ขอบเขตการเชื่อมต่อ

เอกสารสาธารณะระบุข้อจำกัดเชิงปฏิบัติไว้ชัดเจนบางส่วน:

  • การเรียก API ต้องยืนยันตัวตนด้วย bearer token
  • ก่อนอ่านบางการอัปโหลด ระบบจะตรวจเครดิต
  • คุณภาพเอาต์พุตขึ้นอยู่กับความชัดเจนของ source และความซับซ้อนของเลย์เอาต์
  • ภาพหน้าจอที่สูงมากอาจเหมาะกับการ chunk ตามขอบ section
  • โหนดที่มี confidence ต่ำควรถูกกรองก่อนใช้ downstream
  • การติดตั้งระดับองค์กรสามารถตรวจทบทวนการเก็บข้อมูล การใช้งาน production rate limits ที่สูงขึ้น และความต้องการการติดตั้งแบบส่วนตัวได้

ขอบเขตเหล่านี้เป็นส่วนหนึ่งของประสบการณ์นักพัฒนา API ที่เชื่อถือได้ควรทำให้ tradeoff ของตัวเองมองเห็นได้

เริ่มต้นที่ไหน

เริ่มจาก Visual Struct สำหรับภาพหน้าจอและ mockup ใช้ PDF to Visual Struct สำหรับ PDF เปิด API Reference สำหรับ schema ของ endpoint และ fields ของ request/response

แหล่งข้อมูลที่เกี่ยวข้อง

#open-api#visual-struct#developer-api#json#automation