# Mendesain Keyboard 3D Interaktif - Spline Academy (https://spline.design/id/academy/tutorials/design-an-interactive-3d-keyboard)

> Dalam tutorial ini, Anda akan belajar membangun keyboard 3D dari nol dengan alat modeling, material asset, dan event Key Down/Up.

1. [Academy](https://spline.design/id/academy)
2. [Tutorial](https://spline.design/id/academy/tutorials)
3. Mendesain Keyboard 3D Interaktif

# Mendesain Keyboard 3D Interaktif

Spline 3DMenengah17 mnt

Dalam tutorial ini, Anda akan belajar membangun keyboard 3D dari nol dengan alat modeling, material asset, dan event Key Down/Up.

Coba Spline: <https://spline.design/> Spline di Instagram: <https://instagram.com/splinetool/>

☀️Pembaruan: Spline sudah jauh berkembang sejak kami membuat tutorial ini, dan kini ada beberapa fitur baru yang memungkinkan Anda mengikuti tutorial ini jauh lebih cepat.

1\. Event Key Press yang baru menggabungkan Key Up dan Key Down, jadi Anda cukup mendefinisikannya sekali. 2\. Dengan fitur Components yang baru, Anda bisa menduplikasi objek dan tetap mempertahankan interaksinya pada duplikat (jadi Anda cukup membuat satu tombol).

Tutorial tentang komponen di sini: <https://youtu.be/VSddFnDjPUA>

## Yang akan Anda pelajari

1. [0:00Pengantar](https://www.youtube.com/watch?v=cdru3Ibj8Eg&t=0s)
2. [1:05Membuat model tombol 3D](https://www.youtube.com/watch?v=cdru3Ibj8Eg&t=65s)
3. [4:15Menambahkan material asset](https://www.youtube.com/watch?v=cdru3Ibj8Eg&t=255s)
4. [6:10Membuat teks pada tombol](https://www.youtube.com/watch?v=cdru3Ibj8Eg&t=370s)
5. [7:35Membuat tombol oranye](https://www.youtube.com/watch?v=cdru3Ibj8Eg&t=455s)
6. [10:30Membuat dasar keyboard](https://www.youtube.com/watch?v=cdru3Ibj8Eg&t=630s)
7. [13:50Menambahkan event interaksi](https://www.youtube.com/watch?v=cdru3Ibj8Eg&t=830s)

## Sumber terkait

- [3D KeyboardTemplate](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 ToolsDokumen](https://docs.spline.design/designing-in-3-d/3d-modeling-tools)
- [Materials & ShadingDokumen](https://docs.spline.design/#%F0%9F%8C%88-materials-&-shading)
- [Key Down EventDokumen](https://docs.spline.design/interaction-states-events-and-actions/events/key-down-event)
- [Transition ActionDokumen](https://docs.spline.design/interaction-states-events-and-actions/actions/transition-action)
- [Events & InteractivityDokumen](https://docs.spline.design/interaction-states-events-and-actions/events-interactivity)

## Ikhtisar

- Spline 3D
- 17 mnt
- Menengah

## Bagian dari

- [Dasar-Dasar Modeling di Spline](https://spline.design/id/academy/collections/modeling-essentials-in-spline/design-an-interactive-3d-keyboard)

## Tutorial terkait

[Semua tutorial](https://spline.design/id/academy/tutorials)

[Membuat Keyboard Interaktif Gelap dalam 3DSpline 3DMenengah16 mnt](https://spline.design/id/academy/tutorials/build-a-dark-interactive-keyboard-in-3d)[Menganimasikan Blob 3D Organik dengan StateSpline 3DPemula5 mnt](https://spline.design/id/academy/tutorials/animate-organic-3d-blobs-with-states)[Membuat Sakelar Lampu 3D dengan InteraksiSpline 3DMenengah13 mnt](https://spline.design/id/academy/tutorials/build-a-3d-light-switch-with-interaction)

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

Editor 3D dan 2D untuk tim dan agen mereka. Rilis ke web, iOS, dan Android.

#### Tanya AI tentang Spline

#### Produk

- [Desain 3D](https://spline.design/id/3d-design)
- [Hana](https://spline.design/id/hana)
- [Omma](https://omma.build)
- [Pembuatan 3D dengan AI](https://spline.design/id/ai-generate)
- [Spline MCP](https://spline.design/id/mcp)
- [Spline Arena](https://spline.design/id/arena)
- [Harga](https://spline.design/id/pricing)
- [Enterprise](https://spline.design/id/enterprise)

#### Runtime

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

#### Aplikasi

- [Unduh](https://spline.design/id/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Unduh Spline Mirror](https://spline.design/download-mirror)

#### Belajar

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

#### Komunitas

- [Komunitas Spline](https://community.spline.design)
- [Blog](https://spline.design/id/blog)
- [Changelog](https://spline.design/id/changelog)
- [Pendidikan](https://spline.design/id/education)
- [Contra](https://spline.design/contra)
- [Afiliasi](https://spline.design/id/affiliate)

#### Perusahaan

- [Pelanggan](https://spline.design/id/customers)
- [Karier](https://www.ycombinator.com/companies/spline/jobs)
- [Keamanan](https://spline.design/id/security)

#### Legal

- [Syarat & Ketentuan](https://spline.design/terms)
- [Privasi](https://spline.design/privacy)

#### Kontak

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

© 2026 - Spline, Inc.