# Thiết kế bàn phím 3D tương tác - Spline Academy (https://spline.design/vi/academy/tutorials/design-an-interactive-3d-keyboard)

> Trong hướng dẫn này, bạn sẽ học cách dựng một bàn phím 3D từ đầu bằng công cụ dựng hình, tài nguyên vật liệu và các sự kiện Key Down/Up.

1. [Academy](https://spline.design/vi/academy)
2. [Hướng dẫn](https://spline.design/vi/academy/tutorials)
3. Thiết kế bàn phím 3D tương tác

# Thiết kế bàn phím 3D tương tác

Spline 3DTrung cấp17 phút

Trong hướng dẫn này, bạn sẽ học cách dựng một bàn phím 3D từ đầu bằng công cụ dựng hình, tài nguyên vật liệu và các sự kiện Key Down/Up.

Xem Spline: <https://spline.design/> Spline trên Instagram: <https://instagram.com/splinetool/>

☀️Cập nhật: Spline đã cải tiến rất nhiều kể từ khi chúng tôi làm hướng dẫn này, và giờ một vài tính năng mới sẽ giúp bạn làm theo nhanh hơn nhiều.

1\. Sự kiện Key Press mới kết hợp Key Up và Key Down, nên bạn chỉ cần thiết lập một lần. 2\. Với tính năng Components mới, bạn có thể nhân bản một đối tượng mà vẫn giữ tương tác trên bản sao (nên bạn chỉ cần dựng một phím).

Hướng dẫn về component tại đây: <https://youtu.be/VSddFnDjPUA>

## Bạn sẽ học được gì

1. [0:00Giới thiệu](https://www.youtube.com/watch?v=cdru3Ibj8Eg&t=0s)
2. [1:05Dựng hình một phím 3D](https://www.youtube.com/watch?v=cdru3Ibj8Eg&t=65s)
3. [4:15Thêm tài nguyên vật liệu](https://www.youtube.com/watch?v=cdru3Ibj8Eg&t=255s)
4. [6:10Tạo chữ trên phím](https://www.youtube.com/watch?v=cdru3Ibj8Eg&t=370s)
5. [7:35Tạo phím màu cam](https://www.youtube.com/watch?v=cdru3Ibj8Eg&t=455s)
6. [10:30Tạo đế bàn phím](https://www.youtube.com/watch?v=cdru3Ibj8Eg&t=630s)
7. [13:50Thêm sự kiện tương tác](https://www.youtube.com/watch?v=cdru3Ibj8Eg&t=830s)

## Tài nguyên liên quan

- [3D KeyboardMẫu](https://app.spline.design/academy/tutorials/design-an-interactive-3d-keyboard?redirect-duplicate-template-uuid=d637461f-632f-46a7-b66f-988150e33af6&is-2d-file=false)
- [3D Modeling ToolsTài liệu](https://docs.spline.design/designing-in-3-d/3d-modeling-tools)
- [Materials & ShadingTài liệu](https://docs.spline.design/#%F0%9F%8C%88-materials-&-shading)
- [Key Down EventTài liệu](https://docs.spline.design/interaction-states-events-and-actions/events/key-down-event)
- [Transition ActionTài liệu](https://docs.spline.design/interaction-states-events-and-actions/actions/transition-action)
- [Events & InteractivityTài liệu](https://docs.spline.design/interaction-states-events-and-actions/events-interactivity)

## Tổng quan

- Spline 3D
- 17 phút
- Trung cấp

## Thuộc

- [Dựng hình cơ bản trong Spline](https://spline.design/vi/academy/collections/modeling-essentials-in-spline/design-an-interactive-3d-keyboard)

## Hướng dẫn liên quan

[Tất cả hướng dẫn](https://spline.design/vi/academy/tutorials)

[Dựng bàn phím 3D tương tác tông tốiSpline 3DTrung cấp16 phút](https://spline.design/vi/academy/tutorials/build-a-dark-interactive-keyboard-in-3d)[Tạo hoạt ảnh cho khối blob 3D hữu cơ bằng trạng tháiSpline 3DCơ bản5 phút](https://spline.design/vi/academy/tutorials/animate-organic-3d-blobs-with-states)[Dựng công tắc đèn 3D có tương tácSpline 3DTrung cấp13 phút](https://spline.design/vi/academy/tutorials/build-a-3d-light-switch-with-interaction)

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

Trình chỉnh sửa 3D và 2D cho các nhóm và tác nhân AI của họ. Xuất bản lên web, iOS và Android.

#### Hỏi AI về Spline

#### Sản phẩm

- [Thiết kế 3D](https://spline.design/vi/3d-design)
- [Hana](https://spline.design/vi/hana)
- [Omma](https://omma.build)
- [Tạo 3D bằng AI](https://spline.design/vi/ai-generate)
- [Spline MCP](https://spline.design/vi/mcp)
- [Spline Arena](https://spline.design/vi/arena)
- [Bảng giá](https://spline.design/vi/pricing)
- [Doanh nghiệp](https://spline.design/vi/enterprise)

#### Runtime

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

#### Ứng dụng

- [Tải xuống](https://spline.design/vi/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Tải Spline Mirror](https://spline.design/download-mirror)

#### Học

- [Docs](https://docs.spline.design/)
- [Academy](https://spline.design/vi/academy)
- [Spline API](https://www.npmjs.com/package/@splinetool/runtime)
- [Giải pháp](https://spline.design/solutions)

#### Cộng đồng

- [Cộng đồng Spline](https://community.spline.design)
- [Blog](https://spline.design/vi/blog)
- [Changelog](https://spline.design/vi/changelog)
- [Giáo dục](https://spline.design/vi/education)
- [Contra](https://spline.design/contra)
- [Tiếp thị liên kết](https://spline.design/vi/affiliate)

#### Công ty

- [Khách hàng](https://spline.design/vi/customers)
- [Tuyển dụng](https://www.ycombinator.com/companies/spline/jobs)
- [Bảo mật](https://spline.design/vi/security)

#### Pháp lý

- [Điều khoản & Điều kiện](https://spline.design/terms)
- [Quyền riêng tư](https://spline.design/privacy)

#### Liên hệ

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

© 2026 - Spline, Inc.
