Saya baru dan mulai belajar tentang grafik komputer 3D di browser web. Saya tertarik membuat game 3D di browser. Bagi siapa saja yang telah mempelajari WebGL dan three.js ...
Apakah pengetahuan tentang WebGL diperlukan untuk menggunakan three.js?
Apa keuntungan menggunakan three.js vs WebGL?
Jawaban:
Karena Anda memiliki ambisi besar, Anda harus menginvestasikan waktu untuk mempelajari dasar-dasarnya. Ini bukan masalah apa yang Anda pelajari pertama - Anda dapat mempelajarinya secara bersamaan jika Anda mau. (Itu yang saya lakukan.)
Ini berarti Anda perlu memahami:
Three.js. Three.js melakukan pekerjaan yang sangat baik untuk mengabstraksi banyak detail WebGL, jadi secara pribadi, saya sarankan menggunakan Three.js untuk proyek Anda. Tapi ingat, Three.js ada dalam alpha , dan itu sering berubah, jadi Anda harus siap untuk itu. Kebanyakan orang mempelajari Three.js dengan mempelajari contoh-contohnya. Hindari buku dan tutorial yang ketinggalan zaman, dan hindari contoh-contoh dari internet yang tertaut ke versi lama perpustakaan.
WebGL. Jika Anda menggunakan Three.js, Anda tidak perlu tahu cara memprogram di WebGL, Anda hanya perlu memahami konsep-konsep WebGL. Itu artinya, Anda hanya perlu bisa membaca kode WebGL orang lain dan memahami apa yang Anda baca. Itu jauh lebih mudah daripada yang diharapkan untuk menulis program WebGL sendiri dari awal. Anda dapat mempelajari konsep-konsep WebGL dengan cukup baik menggunakan salah satu tutorial di internet, seperti tutorial pemula di WebGLFundamentals.org dan Learning WebGL .
Matematika Sekali lagi, Anda setidaknya perlu memahami konsepnya. Tiga buku bagus adalah:
Primer Matematika 3D untuk Pengembangan Grafis dan Game oleh Fletcher Dunn dan Ian Parberry
Matematika Penting untuk Permainan dan Aplikasi Interaktif: Panduan Programmer oleh James M. Van Verth dan Lars M. Bishop
Matematika untuk Pemrograman Game 3D dan Grafik Komputer oleh Eric Lengyel
Saya harap ini dapat membantu anda. Semoga berhasil.
sumber
Ada kursus online yang sangat bagus - Grafis 3D Interaktif di https://www.udacity.com/course/cs291 di THREE.js. Kursus ini termasuk tugas juga untuk mendapatkan pengalaman langsung. Ini mencakup semua konsep dasar Three.js dan Komputer Grafik
sumber
Pikiran pribadi saya adalah sebagai berikut:
sumber
Ke mana pun Anda memilih untuk pergi, saya sarankan Anda mempelajari / memoles keterampilan aljabar linier Anda . Lalu, lanjutkan dan pelajari atau poles pemahaman Anda tentang dimensi MVP (Model View Projection) . Three.JS dapat mengabstraksi banyak dari itu, tapi saya pikir itu kuncinya adalah bahwa seseorang memahami konsep-konsep itu dengan baik sebelum menjadi serius tentang perkembangan 3D.
Saya menulis artikel pengantar tentang MVP ketika saya pertama kali belajar pemrograman 3D dengan OpenGL. Saya menyadari bahwa sampai saya dapat menjelaskan apa itu matriks transformasi, dan bagaimana mereka berhubungan dengan berbagai dimensi / ruang, saya benar-benar tidak tahu pemrograman 3D sama sekali, meskipun saya bisa membuat objek ke layar.
Karena tujuan Anda adalah membuat game, saya pikir Anda akan mendapat banyak manfaat dari mempelajari beberapa WebGL mentah terlebih dahulu, bahkan jika Anda akhirnya menggunakan kerangka kerja seperti Three.js untuk membantu Anda menulis kode Anda nanti.
sumber
http://webglfundamentals.org/webgl/lessons/webgl-2d-vs-3d-library.html
Artikel ini menjelaskan perbedaan mendasar antara perpustakaan WebGL & 3d seperti three.js.
Yang membuat pilihan saya antara WebGL atau Three.js no-brainer.
sumber
Saya berasal dari latar belakang Unity3D dan juga Papervision3D pada hari itu, jadi saya memiliki pemahaman yang baik tentang bagaimana menangani ruang 3D. Three.js adalah cara untuk memulai lompatan awal Anda dalam mempelajari cara menangani proyek-proyek WebGL. Api sangat bagus, sangat kuat dan jika Anda datang dari teknologi 3D lain, Anda akan siap dan berjalan dengan sedikit waktu.
Saya menghabiskan banyak waktu dengan contoh-contoh Threejs.org - ada banyak dari mereka dan mereka sangat baik membuat Anda pergi dan berlari ke arah yang benar. Docs cukup layak, terutama jika Anda membandingkannya dengan api webGL 3D lain di luar sana.
Anda mungkin juga mempertimbangkan untuk mendapatkan versi gratis dari Unity3D dan pengekspor collada gratis (gratis ketika saya mendapatkannya) dari app store mereka (Window> App store). Saya merasa cukup mudah untuk mengatur adegan saya di Unity dan mengekspornya ke Collada untuk digunakan dengan Three.js.
Juga, saya memposting kelas ini yang saya gunakan dengan Three.js disebut neo ( http://rockonflash.com/webGL/three/neo.js ). Cukup tambahkan ke proyek Anda, lalu panggil Neo.JackIntoThree () dan itu akan menambahkan metode / properti ke Object3D untuk digunakan dalam proyek Anda. Hal-hal seperti DrawAllAxis () sangat berharga ketika men-debug adegan Anda dll.
Meskipun begitu, Three.js adalah cara yang hebat untuk digunakan - cukup fleksibel untuk memungkinkan Anda menulis shaders / objek Anda sendiri, dll, dan cukup kuat di luar kotak untuk membantu Anda mencapai tujuan Anda.
sumber
Saya mengambil three.js, tetapi juga melompat ke GLSL dan bereksperimen banyak dengan shaderMaterial three.js. Salah satu cara melakukannya - three.js masih mengabstraksi banyak hal untuk Anda, tetapi juga memberi Anda akses yang sangat bersih, tingkat rendah ke semua kemampuan rendering (proyeksi, animasi).
Dengan cara ini, Anda dapat mengikuti bahkan sesuatu seperti tutorial open-gl yang mengagumkan ini . Anda tidak perlu mengatur matriks, mengetik array, karena tiga sudah mengaturnya untuk Anda, memperbaruinya ketika diperlukan. Namun shader, Anda dapat menulis dari awal - rendering warna sederhana adalah dua baris GLSL. Ada juga plug-in pemrosesan pos untuk three.js yang mengatur semua buffer, paha depan layar penuh dan hal-hal yang perlu Anda lakukan efeknya, tetapi shader dapat menjadi sangat sederhana untuk memulai.
Karena shader yang dapat diprogram adalah inti dari grafik 3d modern, saya harap jawaban saya tidak ketinggalan intinya :) Cepat atau lambat, siapa pun yang melakukan ini perlu setidaknya memahami apa yang terjadi di bawah tenda, itu adalah sifat binatang itu. Juga, memahami dimensi ke-4 dalam ruang homogen mungkin juga penting.
Buku ini bagus untuk WebGL.
sumber
Saya baru belajar sedikit dari keduanya dan saya merasa bahwa memahami dasar-dasar webgl, saya pikir pengantar di webgl sudah cukup dan kemudian melompat menjadi tiga js. Ini akan sangat mudah setelah Anda memahami konsep yang mendasari WebGL. Tautan yang bermanfaat:
sumber