ABSTRAK
Steven Christiansen Megaprawira:
Skripsi
Perancangan dan Pembuatan Perangkat Lunak Pewarnaan Obyek secara 3 Dimensi
Perkembangan dunia teknologi di bidang komputer grafis tiga dimensi yang sangat pesat, menyebabkan komputer dapat menampilkan obyek-obyek tiga dimensi dengan kecepatan tinggi. Obyek tiga dimensi ini disebut sebagai mesh yang tersusun atas beberapa face yang berbentuk segitiga. Namun masih terdapat kesulitan dalam pemodelan obyek tiga dimensi ini, yaitu saat memberikan warna, karena satu face hanya memiliki satu warna saja. Perangkat lunak yang dibuat pada tugas akhir ini berusaha untuk bisa mewarnai obyek tiga dimensi tanpa dibatasi kesulitan tersebut.
Konsep pewarnaan dari perangkat lunak ini seperti menyemprotkan cat pada patung. Metode yang dipakai dibuat sendiri, dimana langkah-langkah yang dipakai adalah, pertama-tama dibuat sebuah texture yang dapat mewakili pewarnaan pada face dari obyek tersebut. Kemudian mendeteksi titik yang ingin diwarnai lalu menyimpan pewarnaan itu ke dalam texture. Setelah selesai, perangkat lunak menyimpan data itu dalam bentuk file obyek tiga dimensi dan file bitmap untuk texture-nya.
Pengujian terhadap perangkat lunak ini menunjukkan bahwa perangkat lunak bisa mewarnai pada koordinat titik yang ingin diwarnai dengan tepat.
Kesimpulan dari pengujian adalah perangkat lunak ini hanya dapat membaca file obyek tiga dimensi dengan jumlah face kurang dari 5000 face.
Kata kunci :
Komputer grafis tiga dimensi, Mesh, Face, Texture, Pewarnaan, Obyek tiga dimensi, Bitmap.
vi
ABSTRACT
Steven Christiansen Megaprawira:
Thesis
Designing and Implementation Software to Apply a Color on Three- Dimensional Object
Lately, the world of technology has been developing rapidly, especially in three-dimensional computer graphics development. This make computer able to render three-dimensional object in high frame per second. A three-dimensional object is called mesh, that was formed by many triangle faces. But there’s a problem in applying a color on a three-dimensional object, because a face can only have one color. The software developed for this thesis is trying to solve that problem.
The concept of this coloring is like coloring a statue with an airbrush. The method used to detecting and coloring is own creation. First, the software will create a texture that can represent all face from the object, and then detecting the coloring coordinate and saved that coloring onto a texture. After finished, the result will be saved in three-dimensional object file and in a bitmap file for the texture.
The result from this software testing proved that the software can apply a color in the coloring coordinates precisely. And the conclusions are, this software only can open three-dimensional object file that only have less than 5000 faces.
Key words:
Three-dimensional computer graphics, Mesh, Face, Texture, Coloring, Three-dimensional object, Bitmap.
DAFTAR ISI
HALAMAN JUDUL ... i
LEMBAR PENGESAHAN ... ii
LEMBAR PERSETUJUAN PUBLIKASI KARYA ILMIAH ... iii
KATA PENGANTAR ... iv
ABSTRAK ... vi
ABSTRACT ... vii
DAFTAR ISI ... viii
DAFTAR GAMBAR ... x
DAFTAR RUMUS ... xiii
DAFTAR SEGMEN PROGRAM ... xiv
DAFTAR TABEL ... xviii
1. PENDAHULUAN ... 1
1.1. Latar Belakang Masalah ... 1
1.2. Perumusan Masalah dan Ruang Lingkup... 2
1.3. Tujuan Tugas Akhir ... 3
1.4. Metodologi ... 3
1.5. Sistematika Penulisan ... 3
2. TEORI PENUNJANG ... 5
2.1. Grafis 3 Dimensi ... 5
2.1.1. Proyeksi ... 6
2.1.1.1. Proses Perhitungan Camera ... 6
2.1.1.2. Proses Perhitungan Perspective ... 8
2.1.1.3. Proses Perhitungan Viewport ... 9
2.1.2. Transformasi ... 10
2.1.3. Obyek 3 Dimensi ... 11
2.1.3.1. Vertex ... 11
2.1.3.2. Edge ... 11
2.1.3.3. Face... 12
2.1.3.4. Texture ... 12
2.2. Format File ASE, Obj, dan 3DS ... 14
2.2.1. Format ASE ... 14
2.2.2. Format Obj ... 17
2.2.3. Format 3DS ... 20
viii
2.3. Mendeteksi Koordinat Mouse ... 22
2.3.1. Mencari Face yang Ditunjuk ... 23
2.3.2. Mencari Koordinat yang Ditunjuk pada Face ... 23
2.4. Pemberian Warna ... 25
2.4.1. Pencil ... 25
2.4.2. Spray ... 25
2.4.3. Burn ... 25
2.4.4. Dodge ... 25
2.5. Flowchart ... 26
2.6. Hubungan antar Class ... 29
3. DESAIN SISTEM ... 33
3.1. Struktur Class dari Aplikasi ... 33
3.2. Desain Aplikasi ... 44
3.2.1. Proses Input File ... 45
3.2.2. Proses Pembuatan Texture ... 45
3.2.3. Proses Proyeksi ... 48
3.2.4. Proses Pewarnaan ... 49
3.2.5. Proses Penyimpanan File ... 50
3.3. Ilustrasi Cara Kerja Program ... 50
3.4. Desain User Interface ... 52
3.4.1. Menu ... 53
3.4.2. Toolbar ... 55
3.4.3. Layar ... 55
4. IMPLEMENTASI SISTEM... 59
4.1. Implementasi dari Flowchart dan Source Code Program ... 59
4.1.1. Inisialisasi Layar OpenGL pada Delphi 7... 62
4.1.2. Aplikasi pada saat Idle ... 63
4.1.3. Membuka File Obyek ... 64
4.1.4. Membuat Texture pada Obyek yang Sudah Dibaca ... 83
4.1.5. Mendeteksi Koordinat Mouse pada Obyek ... 94
4.1.6. Proses Pewarnaan... 97
4.2. Implementasi Variabel Global ... 102
5. PENGUJIAN SISTEM ... 103
5.1. Pengujian Terhadap Pembacaan File dengan Format ASE, 3DS, Obj ... 103
5.2. Pengujian Terhadap Semua Brush yang Ada ... 107
5.3. Pengujian Menggunakan Texture dengan Ukuran 256 x 256... 114
5.4. Pengujian Menggunakan Texture dengan Ukuran 512 x 512... 116
5.5. Pengujian Menggunakan Texture dengan Ukuran 1024 x 1024... 117
5.6. Pengujian Terhadap Obyek 3 Dimensi yang Memiliki Banyak Face ... 118
6. KESIMPULAN DAN SARAN... 121
6.1. Kesimpulan ... 121
6.2. Saran ... 121
DAFTAR REFERENSI ... 123
LAMPIRAN
x
DAFTAR GAMBAR
2.1. Sistem Koordinat 3 Dimensi ... 5
2.2. Koordinat u, v pada Texture ... 12
2.3. Penggambaran Texture pada suatu Bidang ... 13
2.4. Titik yang dicari Koordinat 3 Dimensinya ... 24
2.5. Contoh Flowchart ... 26
2.6. Simbol Terminator ... 27
2.7. Simbol Preparation... 27
2.8. Simbol Proses... 27
2.9. Simbol Input/Output ... 28
2.10. Simbol Decision ... 28
2.11. Simbol One Page Connector ... 29
2.12. Simbol Other Page Connector ... 29
2.13. Simbol Subroutine ... 29
2.14. Simbol Object Class ... 30
2.15. Simbol Relationship Set ... 30
2.16. Simbol Aggregation ... 31
2.17. Simbol Composition ... 32
2.18. Simbol Inheritance ... 32
3.1. Class yang Digunakan Dalam Aplikasi ... 34
3.2. Diagram Cara Kerja Aplikasi ... 44
3.3. Diagram Proses Input File ... 45
3.4. Diagram Proses Pembuatan Texture ... 46
3.5. Diagram Proses Pembagian Obyek Berdasarkan Face ... 47
3.6. Diagram Proses Pembuatan Koordinat Texture Baru ... 48
3.7. Diagram Proses Pewarnaan ... 49
3.8. Obyek yang Dibaca ... 50
3.9. Membuat Texture dari Obyek yang Dibaca ... 50
3.10. Mewarnai Salah Satu Face dari Obyek ... 51
3.11. Mencari Face yang Diwarnai ... 51
3.12. Mencari Koordinat Mouse pada Face ... 51
3.13. Mewarnai Texture ... 52
3.14. Implementasi Interface Program ... 53
3.15. Menu File ... 53
3.16. Menu Model View ... 53
3.17. Menu Camera ... 54
3.18. Menu Brush... 54
3.19. Toolbar ... 55
3.20. Layar ... 56
3.21. Layar Brush Viewport ... 56
3.22. Combobox Nama Brush ... 57
3.23. Form untuk Menyimpan Brush Baru ... 58
5.1. Contoh Pembuatan Obyek Menggunakan 3D Studio Max 7 ... 103
5.2. Membuka File Obyek ... 104
5.3. Form Texture Size ... 104
5.4. Tampilan Texture dari Obyek ... 105
5.5. Tampilan dari Obyek “Kubus.ASE” ... 105
5.6. Tampilan dari Obyek “Kubus.3DS” ... 106
xii
5.7. Tampilan dari Obyek “Kubus.Obj” ... 107
5.8. Pewarnaan dengan Menggunakan Pencil ... 108
5.9. Pewarnaan Menggunakan Spray dengan Opacity Sebesar 5 ... 109
5.10. Pewarnaan Menggunakan Spray dengan Opacity Sebesar 25 ... 109
5.11. Pewarnaan Menggunakan Burn dengan Opacity Sebesar 5 ... 110
5.12. Pewarnaan Menggunakan Burn dengan Opacity Sebesar 25 ... 110
5.13. Pewarnaan Menggunakan Dodge dengan Opacity Sebesar 5 ... 111
5.14. Pewarnaan Menggunakan Dodge dengan Opacity Sebesar 25 ... 112
5.15. Obyek yang sudah diberi Pewarnaan ... 113
5.16. Menghapus Menggunakan Eraser dengan Opacity Sebesar 5 ... 113
5.17. Menghapus Menggunakan Eraser dengan Opacity Sebesar 25... 114
5.18. Obyek I yang digunakan dalam Pengujian, (a) “Limas”, (b) “Kotak” (c) “Bola”, (d) “Teapot” ... 115
5.19. Pengujian pada Obyek I yang Mempunyai Jumlah Face Sedikit dengan Texture Berukuran 256, (a) “Limas”, (b) “Kotak” ... 115
5.20. Pengujian pada Obyek I yang Mempunyai Jumlah Face Banyak dengan Texture Berukuran 256, (a) “Bola”, (b) “Teapot” ... 116
5.21. Pengujian pada Obyek I yang Mempunyai Jumlah Face Sedikit dengan Texture Berukuran 512, (a) “Limas”, (b) “Kotak” ... 117
5.22. Pengujian pada Obyek I yang Mempunyai Jumlah Face Banyak dengan Texture Berukuran 512, (a) “Bola”, (b) “Teapot” ... 117
5.23. Pengujian pada Obyek I yang Mempunyai Jumlah Face Sedikit dengan Texture Berukuran 1024, (a) “Limas”, (b) “Kotak” ... 118
5.24. Pengujian pada Obyek I yang Mempunyai Jumlah Face Banyak dengan Texture Berukuran 1024, (a) “Bola”, (b) “Teapot” ... 118
5.25. Obyek II yang Digunakan dalam Pengujian, (a) “Pot”, (b) “Gear” (c) “Chair1”, (d) “Chair2” ... 119
5.26. Hasil Pembacaan Terhadap Obyek Pot (980 face) ... 119
5.27. Hasil Pembacaan Terhadap Obyek Gear (1226 face) ... 119
5.28. Hasil Pembacaan Terhadap Obyek Chair1 (3904 face) ... 120
xiv
DAFTAR RUMUS
2.1. Rumus mencari n pada perhitungan camera ... 7
2.2. Rumus mencari u pada perhitungan camera ... 7
2.3. Rumus mencari v pada perhitungan camera ... 7
2.4. Rumus mencari d pada perhitungan camera... 7
2.5. Bentuk matrix model view pada perhitungan camera ... 7
2.6. Rumus mencari vertex setelah dipengaruhi matrix model view ... 8
2.7. Penjabaran rumus untuk mencari matrix perspective ... 8
2.8. Bentuk matrix perspective pada perhitungan perspective ... 9
2.9. Rumus mencari vertex setelah dipengaruhi matrix perspective ... 9
2.10. Rumus mencari vertex setelah dipengaruhi viewport ... 9
2.11. Matrix Scaling ... 10
2.12. Matrix Translation ... 10
2.13. Matrix Rotasi terhadap sumbu x ... 11
2.14. Matrix Rotasi terhadap sumbu y ... 11
2.15. Matrix Rotasi terhadap sumbu z ... 11
2.16. Rumus persamaan bidang ... 24
2.17. Persamaan untuk mencari koordinat perpotongan vector dengan bidang ... 24
DAFTAR SEGMEN PROGRAM
4.1. Inisialisasi Layar OpenGL ... 62
4.2. Isi dari function Init pada class OpenGL ... 62
4.3. Hal-hal yang dilakukan aplikasi pada saat Idle ... 63
4.4. Membaca file berdasarkan format ... 64
4.5. Membaca file dengan format ASE ... 65
4.6. Membaca koordinat texture pada file ASE ... 67
4.7. Membaca informasi texture pada file ASE ... 69
4.8. Membaca file dengan format Obj ... 71
4.9. Membaca informasi texture pada file Obj ... 72
4.10. Membaca informasi vertex, koordinat texture, dan face pada file Obj ... 73
4.11. Membaca informasi hubungan antara vertex, koordinat texture, dan face pada file Obj ... 75
4.12. Membaca Obyek ber-texture pada file 3DS ... 77
4.13. Membaca Obyek tanpa texture pada file 3DS ... 81
4.14. Pembagian Obyek berdasarkan face dan proyeksi ... 83
4.15. Proses pergeseran vertex ... 85
4.16. Lanjutan Procedure FlattenVertex ... 88
4.17. Proyeksi pada Procedure DrawFaceFlatened ... 90
4.18. Pembuatan koordinat texture yang baru ... 91
4.19. Pembuatan texture yang baru ... 93
4.20. Mencari face yang ditunjuk mouse ... 94
4.21. Isi function PointInTriangle ... 95
4.22. Mencari koordinat mouse dalam koordinat 3 dimensi ... 96
xvi
4.23. Mencari koordinat mouse pada Texture ... 98
4.24. Mewarnai texture ... 101
DAFTAR TABEL
4.1. Daftar Procedure ... 59
4.2. Daftar Variabel Global ... 102
5.1. Daftar Vertex dan Face Obyek I ... 114
5.2. Daftar Vertex dan Face Obyek II ... 119
xviii
