GRAFIKA KOMPUTER

LAPORAN TUTORIAL PROJECT

Dosen Pembimbing :
Syamsi Dwi Cahya

Disusun Oleh :
Widi Sumantoko/NIM.4616040011
KELAS TMD-3

PROGRAM STUDI TEKNIK INFORMATIKA

JURUSAN TEKNIK INFORMATIKA DAN KOMPUTER
POLITEKNIK NEGERI JAKARTA
2018
 Pendahuluan

Three.js adalah library JavaScript untuk membuat game dan aplikasi 3D. Three.js
menggunakan WebGL yang mana merupakan API JavaScript untuk merender grafik 2D dan 3D
interaktif yang native browser tanpa memerlukan plugin browser tambahan. Pada dasarnya kita
dapat menggunakan API WebGL secara langsung untuk menampilkan model 3D. Akan tetapi
Three.js menyederhakan struktur program yang kita tulis terutama untuk pengembangan grafik 3D
yang kompleks.

Kemudian WebGL yang digunakan pada Three.js. WebGL adalah teknologi web yang
menyuguhkan akselerasi grafis 3D ke dalam browser tanpa memasang perangkat lunak tambahan.
WebGL merupakkan kependekan dari Web Graphics Library. Untuk API, WebGL biasanya
dipanggil melalui API Javascript dan penggunaannya selalu melibatkan elemen HTML5
<canvas>. WebGL biasanya digunakan untuk desain web dan game 3D yang berbasis web.

Pada laporan/dokumentasi ini akan membahas tentang tutorial pembuatan atau

dokumentasi aplikasi project pada Three.js dengan menggunakan WEBGL. Pembuatan laporan
ini, semata-mata dibuat sebagai laporan untuk kelulusan pada mata kuliah Grafika Komputer di
semester 4 (empat) ini, mahasiswa diberikan tugas untuk membuat sebuah Project THREE.js yang
menerapkan beberapa pengembangan materi seperti Geometry, Light and Colors, Shading and
Texture, dan Illumination and Reflection.

Hal lain yang diminta dalam pembuatan project ini adalah:

 Orisinalitas
 Alur program yang harus jelas dan sesuai
 Serta Dokumentasi inputan, proses dan outputan yang ada di Aplikasi ini
 Tutorial Pembuatan Project

1. Pertama yang harus dilakukan adalah membuka aplikasi berbasis Text Editor. Disini
penulis menggunakan aplikasi Adobe Dreamweaver CS 6. Penulis membuat satu html yang
diberi nama uaswidi.html, di dalam nya penulis bisa langsung menggunakan script
.js(javascript) dengan nama uaswidi2.js

2. Masukan script javascript untuk memanggil javascript yang dibutuhkan dan untuk
memanggil javascript kita.
3. Pada script javascipt masukan perintah Penulis pun mendeklarasikan variabel-variabel
yang akan digunakan dalam script html dan javascript ini. Disini penulis mengatur speed
ketika tampilan layar digerakan dengan keyboard sehingga dapat diatur agar tidak terlalu
cepat atau terlalu lambat. Penulis juga mengatur arah camera agar sesuai.

4. Untuk menampilkan sebuah tampilan pada WebGL yang dibuat, penulis menggunakan init
dan scene dan untuk memanggil init yang telah dibuat cantumkan init di bawah variable –
variable yang telah di panggil

5. Untuk menambahkan objek pada WebGL penulis menggunakan objek “Blender” dan
untuk memanggil objek dari blender, penulis menggunakan function tambah objek.
6.