# Spline Hana - แคนวาสออกแบบที่ขับเคลื่อนด้วยเอเจนต์ AI (https://spline.design/th/hana)

> Hana คือแคนวาสออกแบบ 2D ของ Spline มาพร้อมการแก้ไขเวกเตอร์ที่เร่งความเร็วด้วย GPU สเตตและแอนิเมชัน และเอเจนต์ AI ทั้งของ Hana เองหรือของคุณผ่าน MCP ที่ออกแบบร่วมกับทีมของคุณ

# แคนวาสออกแบบ ที่ขับเคลื่อนด้วยเอเจนต์ AI

ออกแบบร่วมกับทีม โดยมีเอเจนต์ AI, MCP และ **เครื่องมือแก้ไขเวกเตอร์ที่เร่งความเร็วด้วย GPU**

[เริ่มสร้างเลย](https://app.spline.design/signin)[เชื่อมต่อเอเจนต์ของคุณ](https://spline.design/th/mcp)

คลังผลงาน

## ดีไซน์ที่เคลื่อนไหว ขับเคลื่อนโดย Hana

สำรวจตัวอย่างที่สร้างใน Hana รีมิกซ์ สร้างใหม่ และดูว่าไอเดียของคุณจะกลายเป็นประสบการณ์ที่พร้อมใช้งานจริงได้อย่างไร

[3D Circular](https://app.spline.design/ui/0c5cafee-bc08-47b1-aa31-41c30beae895)[Fire Character](https://app.spline.design/ui/b0d21f98-f238-4b2c-a6f0-b478719bcc3c)[3D Card](https://app.spline.design/ui/539d3930-61a4-47c9-8324-b81ecb4c93dc)[Cards](https://app.spline.design/ui/0f721512-9f57-455a-8ea9-4641e15a0ca4)[Path Icons](https://app.spline.design/ui/9389d529-f05b-4aa7-9360-11175d1b4e72)

[Noise](https://app.spline.design/ui/c0d70e64-db86-409e-90b5-d03e413eb554)[3D UI](https://app.spline.design/ui/ba70eea9-74e0-4b06-af5e-f622d88b719a)[Power](https://app.spline.design/ui/58ee653d-f29a-489d-83ba-6af3b2086a1a)[Glass Icons](https://app.spline.design/ui/c915f089-5725-47ac-a458-e2df51a45aa1)[Auto Layout](https://app.spline.design/ui/a3144449-bf5c-4189-a3f1-dda35c699bc4)

[Earth](https://app.spline.design/ui/8937cf42-317a-43cb-bbef-d3244437d8c6)[Japanese Text](https://app.spline.design/ui/248fa04b-dae6-4ef4-a457-0eef1e760fbc)[Masking](https://app.spline.design/ui/c7bd1796-a808-44be-8220-fffd02fafbdf)[Blend](https://app.spline.design/ui/98cec79c-bad6-4504-810b-f0a198625a99)[Hana Serif](https://app.spline.design/ui/da8a844d-cff7-403d-b544-d6a0dd8149bf)

เครื่องมือออกแบบ

## เครื่องมือที่คุ้นเคยและทรงพลังสำหรับงานออกแบบระดับมืออาชีพ

เครื่องมือออกแบบที่คุ้นเคย เอฟเฟกต์ขั้นสูง และโครงสร้างที่ช่วยให้โปรเจกต์ขนาดใหญ่เป็นระเบียบ

- แคนวาสไร้ขอบเขตแบบเฟรม
- เวกเตอร์เน็ตเวิร์กและบูลีน
- หน้าและเซกชัน
- ไล่เฉดสี แก้ว และรูปทรง 3D

การโต้ตอบและแอนิเมชัน

## ทำให้งานออกแบบของคุณมีชีวิต

เพิ่มการเคลื่อนไหวและการโต้ตอบด้วยสเตต อีเวนต์ และแอนิเมชัน ทำเองด้วยมือหรือสั่งเอเจนต์ก็ได้

- สเตตและอีเวนต์
- แอนิเมชันด้วยแอ็กชันทรานซิชัน
- การโต้ตอบแบบ Follow และ Look At

เอเจนต์ AI

## แคนวาสที่เอเจนต์ของคุณออกแบบได้

เอเจนต์ของ Hana เองออกแบบบนแคนวาสได้ และเอเจนต์ของคุณก็ทำได้เช่นกัน จาก Claude, ChatGPT, Cursor หรือไคลเอนต์ MCP ใดก็ได้

- สร้างเฟรม เอฟเฟกต์ และการโต้ตอบ
- สร้างหลายหน้าจอพร้อมกัน
- ใช้เอเจนต์ของคุณเองผ่าน MCP
- ทุกอย่างยังแก้ไขด้วยมือได้
[เชื่อมต่อเอเจนต์ของคุณ](https://spline.design/th/mcp)

สร้างมาเพื่อการโต้ตอบ

## เครื่องมือออกแบบที่สร้างมาเพื่อการโต้ตอบ

อินเทอร์เฟซที่รวดเร็วและคุ้นเคย พร้อมเครื่องมือที่จำเป็นสำหรับออกแบบ UI แบบอินเทอร์แอคทีฟ โมชัน และกราฟิกแบบเรียลไทม์

- ### เครื่องมือออกแบบที่คุ้นเคย  
ออกแบบบนแคนวาสไร้ขอบเขตด้วยเฟรม ปากกา บูลีน รูปทรง และอีกมากมาย
- ### การโต้ตอบที่ทรงพลัง  
สร้างประสบการณ์อินเทอร์แอคทีฟด้วยสเตต อีเวนต์ และแอ็กชัน
- ### ประสบการณ์ที่เคลื่อนไหว  
เพิ่มการเคลื่อนไหวให้งานออกแบบด้วยสเตตและทรานซิชัน
- ### เอฟเฟกต์ภาพ  
ใช้เงา เบลอ นอยส์ แก้ว และ 3D เพื่อสร้างเอฟเฟกต์ภาพแบบเรียลไทม์
- ### บูลีนแบบเรียลไทม์  
สร้างระบบบูลีนที่ซับซ้อนและทำแอนิเมชันได้แบบเรียลไทม์
- ### เวกเตอร์เน็ตเวิร์ก  
สร้างเวกเตอร์เน็ตเวิร์กและเพิ่มการโต้ตอบที่ไม่เหมือนใคร
- ### พรีวิวบนแคนวาส  
พรีวิวการโต้ตอบและแอนิเมชันได้โดยตรงบนแคนวาส
- ### ส่งออกพร้อมใช้งานจริง  
ผสานงานออกแบบอินเทอร์แอคทีฟเข้ากับเว็บไซต์ เว็บแอป และผลิตภัณฑ์ดิจิทัล

การทำงานร่วมกัน

## ออกแบบร่วมกันแบบเรียลไทม์

ออกแบบการโต้ตอบบนแคนวาสไร้ขอบเขตพร้อมการทำงานร่วมกันแบบเรียลไทม์ จัดระเบียบในพื้นที่ส่วนกลางสำหรับทั้งทีม

### มัลติเพลเยอร์แบบเรียลไทม์

ออกแบบร่วมกับทั้งทีมในไฟล์เดียวกัน

### บทบาทและสิทธิ์

ควบคุมบทบาทผู้แก้ไขและผู้ชมรายบุคคลได้เต็มที่

### การจัดการไฟล์

พื้นที่ทีมส่วนกลางสำหรับจัดเก็บและจัดการทุกไฟล์และโปรเจกต์

### โน้ตและฟีดแบ็ก

ฝากคอมเมนต์ถึงทีมหรือจดโน้ตได้โดยตรงในเอดิเตอร์

ส่งออก

## เผยแพร่งานอินเทอร์แอคทีฟสู่เว็บ

ผสานประสบการณ์อินเทอร์แอคทีฟเข้ากับเว็บไซต์ เว็บแอป และผลิตภัณฑ์ดิจิทัลได้อย่างง่ายดาย

ขยับเมาส์หรือนิ้วเพื่อโต้ตอบ[รีมิกซ์ฉากนี้](https://app.spline.design/ui/2e2daf97-d4bb-4861-9ef6-81348aa5a77d)

index.html

```
<!-- Import the Hana Viewer -->
<script type="module"
  src="https://cdn.spline.design/@splinetool/hana-viewer@1.0.97/hana-viewer.js">
</script>

<!-- Add your design anywhere on the page -->
<hana-viewer
  url="https://prod.spline.design/HfFj1WYWsj69dY8U-Eld/scene.hanacode">
</hana-viewer>

```

[Webflow](https://docs.spline.design/doc/exporting-in-hana/docqB6tzlb52)[Framer](https://docs.spline.design/doc/exporting-in-hana/docqB6tzlb52)[Wix Studio](https://docs.spline.design/doc/exporting-in-hana/docqB6tzlb52)[HTML / JS](https://docs.spline.design/doc/exporting-in-hana/docqB6tzlb52)[Notion](https://docs.spline.design/doc/exporting-in-hana/docqB6tzlb52)[Shopify](https://docs.spline.design/doc/exporting-in-hana/docqB6tzlb52)

## เริ่มออกแบบด้วย Hana

เชื่อมต่อเอเจนต์ ชวนทีมของคุณ แล้วเผยแพร่งานออกแบบชิ้นแรกได้ตั้งแต่วันนี้

[Spline](https://spline.design/th)

เอดิเตอร์ 3D และ 2D สำหรับทีมและเอเจนต์ของทีม เผยแพร่ได้ทั้งบนเว็บ iOS และ Android

#### ถาม AI เกี่ยวกับ Spline

#### ผลิตภัณฑ์

- [ออกแบบ 3D](https://spline.design/th/3d-design)
- [Hana](https://spline.design/th/hana)
- [Omma](https://omma.build)
- [สร้าง 3D ด้วย AI](https://spline.design/th/ai-generate)
- [Spline MCP](https://spline.design/th/mcp)
- [Spline Arena](https://spline.design/th/arena)
- [ราคา](https://spline.design/th/pricing)
- [องค์กร](https://spline.design/th/enterprise)

#### รันไทม์

- [Web](https://spline.design/th/web)
- [iOS](https://spline.design/th/ios)
- [Android](https://spline.design/th/android)

#### แอป

- [ดาวน์โหลด](https://spline.design/th/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [ดาวน์โหลด Spline Mirror](https://spline.design/download-mirror)

#### เรียนรู้

- [Docs](https://docs.spline.design/)
- [Academy](https://spline.design/th/academy)
- [Spline API](https://www.npmjs.com/package/@splinetool/runtime)
- [โซลูชัน](https://spline.design/solutions)

#### คอมมูนิตี้

- [คอมมูนิตี้ Spline](https://community.spline.design)
- [Blog](https://spline.design/th/blog)
- [มีอะไรใหม่](https://spline.design/th/changelog)
- [การศึกษา](https://spline.design/th/education)
- [Contra](https://spline.design/contra)
- [พันธมิตร](https://spline.design/th/affiliate)

#### บริษัท

- [ลูกค้า](https://spline.design/th/customers)
- [ร่วมงานกับเรา](https://www.ycombinator.com/companies/spline/jobs)
- [ความปลอดภัย](https://spline.design/th/security)

#### กฎหมาย

- [ข้อกำหนดและเงื่อนไข](https://spline.design/terms)
- [ความเป็นส่วนตัว](https://spline.design/privacy)

#### ติดต่อ

- [help@spline.design](mailto:help@spline.design)
- [jobs@spline.design](mailto:jobs@spline.design)

© 2026 - Spline, Inc.