# Spline Hana - Isang design canvas na pinapagana ng mga AI agent (https://spline.design/fil/hana)

> Ang Hana ay ang 2D design canvas ng Spline: GPU-accelerated na vector editing, states at animations, at mga AI agent — sarili nito o ang sa iyo sa MCP — na nagdidisenyo kasama ang team mo.

# Isang design canvas na pinapagana ng mga AI agent

Magdisenyo kasama ang team mo, sa tulong ng mga AI agent, MCP at **GPU-accelerated na vector editing tools**.

[Magsimulang gumawa](https://app.spline.design/signin)[Ikonekta ang agent mo](https://spline.design/fil/mcp)

Library

## Design na gumagalaw, pinapagana ng Hana

Tuklasin ang mga halimbawang gawa sa Hana. Mag-remix, buuin ulit, at alamin kung paano nagiging production-ready na experience ang mga ideya mo.

[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)

Design tools

## Pamilyar at advanced na tools para sa propesyonal na design

Mga pamilyar na design tool, advanced na effects, at istrukturang nagpapanatiling organisado sa malalaking project.

- Frame-based na infinite canvas
- Vector networks at booleans
- Pages at sections
- Gradients, glass at 3D shapes

Interactivity at animation

## Buhayin ang mga design mo

Magdagdag ng motion at interactivity gamit ang states, events at animations, nang mano-mano o sa pag-utos sa agent.

- States at events
- Mag-animate gamit ang transition actions
- Follow at Look At na interactivity

Mga AI agent

## Isang canvas na puwedeng pagdisenyuhan ng mga agent mo

Nagdidisenyo sa canvas ang sariling agent ng Hana, at kaya rin ng sa iyo, mula sa Claude, ChatGPT, Cursor o anumang MCP client.

- Gumagawa ng frames, effects at interactions
- Maraming screen na sabay-sabay ginagawa
- Sarili mong agent sa MCP
- Lahat ay nananatiling editable nang mano-mano
[Ikonekta ang agent mo](https://spline.design/fil/mcp)

Gawa para sa interactivity

## Isang design tool na gawa para sa interactivity

Mabilis at pamilyar na interface na may mga tool na kailangan mo para magdisenyo ng real-time na interactive interfaces, motion at graphics.

- ### Pamilyar na design tools  
Magdisenyo sa infinite canvas gamit ang frames, pen tool, booleans, shapes at iba pa.
- ### Makapangyarihang interactivity  
Gumawa ng interactive experiences gamit ang states, events at actions.
- ### Animated experiences  
Lagyan ng motion ang mga design mo gamit ang states at transitions.
- ### Visual effects  
Gumamit ng shadows, blurs, noise, glass at 3D para gumawa ng real-time na visual effects.
- ### Real-time booleans  
Gumawa ng sopistikadong boolean systems at i-animate ang mga ito nang real time.
- ### Vector networks  
Gumawa ng vector networks at lagyan ang mga ito ng natatanging interactivity.
- ### On-canvas preview  
I-preview ang interactivity at animations mo mismo sa canvas.
- ### Production-ready exports  
Isama ang mga interactive design mo sa mga website, web app at digital product.

Collaboration

## Magdisenyo nang magkakasama, nang real time

Magdisenyo ng interactivity sa infinite canvas na may real-time collaboration, nakaayos sa iisang shared workspace para sa buong team mo.

### Real-time multiplayer

Magdisenyo kasama ang buong team mo sa iisang file.

### Roles at permissions

Buong kontrol sa individual na Editor at Viewer roles.

### File management

Isang shared team space para mag-imbak at mamahala ng bawat file at project.

### Notes at feedback

Mag-iwan ng comments para sa team mo o magtala ng notes mismo sa editor.

Export

## Mag-ship ng interactivity para sa web

Walang hirap na isama ang mga interactive experience sa mga website, web app at digital product mo.

Igalaw ang mouse o daliri mo para makipag-interact[I-remix ang scene](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)

## Magsimulang magdisenyo gamit ang Hana

Ikonekta ang agent mo, imbitahan ang team mo at i-ship ang una mong design ngayon.

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

Ang 3D at 2D editor para sa mga team at kanilang mga agent. I-publish sa web, iOS at Android.

#### Magtanong sa AI tungkol sa Spline

#### Mga Produkto

- [3D Design](https://spline.design/fil/3d-design)
- [Hana](https://spline.design/fil/hana)
- [Omma](https://omma.build)
- [AI 3D Generation](https://spline.design/fil/ai-generate)
- [Spline MCP](https://spline.design/fil/mcp)
- [Spline Arena](https://spline.design/fil/arena)
- [Presyo](https://spline.design/fil/pricing)
- [Enterprise](https://spline.design/fil/enterprise)

#### Runtimes

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

#### Apps

- [I-download](https://spline.design/fil/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [I-download ang Spline Mirror](https://spline.design/download-mirror)

#### Matuto

- [Docs](https://docs.spline.design/)
- [Academy](https://spline.design/fil/academy)
- [Spline API](https://www.npmjs.com/package/@splinetool/runtime)
- [Mga Solusyon](https://spline.design/solutions)

#### Community

- [Spline Community](https://community.spline.design)
- [Blog](https://spline.design/fil/blog)
- [Changelog](https://spline.design/fil/changelog)
- [Edukasyon](https://spline.design/fil/education)
- [Contra](https://spline.design/contra)
- [Affiliate](https://spline.design/fil/affiliate)

#### Kumpanya

- [Mga Customer](https://spline.design/fil/customers)
- [Careers](https://www.ycombinator.com/companies/spline/jobs)
- [Security](https://spline.design/fil/security)

#### Legal

- [Mga Tuntunin at Kundisyon](https://spline.design/terms)
- [Privacy](https://spline.design/privacy)

#### Contact

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

© 2026 - Spline, Inc.