Technology

Animasi 3D dengan Menggunakan JavaScript

 

   

Apakah dari Anda ada yang suka bermain game Flash di website? Sekarang JavaScript dapat digunakan sebagai alternatif untuk membuat animasi 3D ataupun game yang berbasis pada website. Siapa bilang JavaScript tidak bisa digunakan untuk membuat animasi 3D?

Sejak adanya WebGL, animasi website yang menggunakan JavaScript semakin berkembang. Banyak juga library pilihan yang dapat kita gunakan. Mulai animasi yang sederhana hingga animasi untuk game. Mungkin belum banyak yang mengerti tentang info adanya WebGL ini. Nah, ini saya coba share sedikit dari wiki.

“WebGL (Web Graphics Library) adalah API JavaScript untuk rendering grafis 3D interaktif dan grafis 2D dalam setiap web browser yang kompatibel, tanpa menggunakan plug-ins. Elemen WebGL dapat dicampur dengan elemen HTML lain. Program WebGL terdiri dari kontrol kode yang ditulis dalam JavaScript dan kode shader yang dieksekusi pada Graphics Processing Unit komputer (GPU). WebGL dirancang dan dikelola oleh non-profit Khronos Group.”

Dan bahasa sederhananya WebGL adalah library grafis tingkat rendah yang memungkinkan halaman web untuk menggunakan akselerasi perangkat keras grafis dalam pengaturan halaman web. Bila Anda suka berkreasi, maka tidak ada salahnya untuk mencoba bermain – main dengan berbagai library 3D JavaScript.

Dan berikut ini list libraryJavaScript yang bisa Anda coba:

1. Threejs

1

Sumber

Di dalam web resminya sudah adap anduan penggunaan dan banyak contoh – contoh yang dapat Anda lihat. Dan banyak fiture yang disediakan, selain itu dokumentasi APInya sangat lengkap.

2. C3DL

2

Sumber

c3DL adalah library yang dirancang untuk menyederhanakan penggunaan WebGL. Hal ini dinamakan Canvas 3D (plugin Firefox yang akhirnya menjadi bagian dari browser dalam bentuk WebGL).  Saat ini tersedia dalam versi rilis kedua Firefox dan Chrome. Safari dan IE juga akan menerapkannya dalam rilis yang akan datang.

Bagi mereka yang ingin menggunakan perpustakaan ini, jangan ragu untuk melakukannya. Mereka memgang tidak bisa memberikan dukungan tetapi kode yang diberikan adalah free. Jadi tidak ada salahnya bila sebuah perusahaan yang ingin mengembakan ini tanpa terganggu oleh lisensi yang ada. Disana juga disediakan 12 step tutorial yang memudahkan.

3. Copper Licht

3

Sumber

Adalah salah satu apps komersial editor WebGL 3D. Bila Anda ingin lebih produktif, tidak ada salahnya untuk mencoba editor ini. Dalam situsnya dijelaskan bahwa dengan editor ini Anda dapat membuat game yang berbasis JavaScript tanpa plugin yang lain pada browser.

Dan bila Anda membutuhkan 3D yang tidak menggunakan WebGL, Anda dapat menggunakan library ini:

4. Phoriajs

4

Sumber

Phoria.js adalah library JavaScript untuk grafis 3D sederhana pada penyajikan vas 2D. Tidak menggunakan WebGL – jadi bekerja pada perangkat apapun yang dapat menampilkan HTML5 Canvas. Sehingga semua browser modern dan termasuk iOS dan ponsel Android! Ia menggunakan vektor yang sangat baik dan matriks perpustakaan matematika gl-matrix.js.

Namun, mungkin ada alternatif yang lebih baik untuk grafis 3D di web untuk Anda tergantung pada apa yang Anda ingin lakukan. Berikut adalah beberapa di antaranya:

CubicVR.js – mesin grafis 3D lain.

Processing.js – memberikan sketsa Processing tanpa plugin. Fungsionalitas 3D diimplementasikan dengan WebGL. Pengolahan adalah bahasa yang dirancang untuk membuat konten visual yang ditujukan untuk non-programmer. Alat coding terkait tercantum di sini, yang satu ini mungkin yang paling mudah untuk belajar.

Clara.io – satu ini benar – benar berbeda dari yang lain. Bahwa itu sama sekali tidak terkait kode. Ini adalah alat pembuatan konten 3D. Cukup mendaftar dan Anda dapat menggunakannya untuk membuat konten 3D seperti yang Anda lakukan dengan alat penciptaan konten 3D lainnya (seperti blender, maya, 3DSMax dll). Benar – benar keren bagian tentang clara.io adalah bahwa memamerkan model 3D setelah selesai adalah yang sederhana seperti menekan tombol share.

Dan ini bonus yang saya berikan untuk Anda.

Selamat mencoba :)

Baca juga:

14 Trik Pemrograman Baru ala HTML5

10 Framework PHP untuk Para Developer Website

10 Content Management System yang Akan Tetap Bertahan di Tahun 2014


Artikel Terkait

Berikan Komentar

Your email address will not be published. Required fields are marked *