PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI...

32
PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI LAPANGAN BASKET, LAPANGAN FUTSAL OUTDOOR, GEDUNG FASILITAS OLAHRAGA DAN GEDUNG OLAHRAGA INSTITUT TEKNOLOGI SEPULUH NOPEMBER MENGGUNAKAN UNREAL ENGINE Riza Hanum Listya 5209100010

Transcript of PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI...

Page 1: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI LAPANGAN BASKET, LAPANGAN FUTSAL OUTDOOR, GEDUNG FASILITAS OLAHRAGA DAN GEDUNG OLAHRAGA

INSTITUT TEKNOLOGI SEPULUH NOPEMBER MENGGUNAKAN UNREAL ENGINE

Riza Hanum Listya

5209100010

Page 2: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Latar Belakang

• Perkembangan teknologi grafik komputer 2D menuju 3D

• Peran Teknologi 3D untuk promosi berupa rumah maupun gedungdengan tingkat kedetilan yang cukup tinggi.

• Teknologi 3D juga digunakan sebagai sarana promosi bisnis untukmenarik pasar dengan tampilan yang lebih atraktif dan menarik.

• Sudah pernah ada pembuatan peta 3D Jurusan Sistem Informasidan gedung – gedung ITS lainnya dengan menggunakan UnrealEngine.

• Telah terbentuknya peta tiga dimensi Institut Teknologi SepuluhNopember yang telah terintegrasi

Sidang Akhir | E-Business

Page 3: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Perumusan MasalahPermasalahan yang diselesaikan dalam tugas akhir ini

adalah :1. Bagaimana membangun peta tiga dimensi lapangan basket,

lapangan futsal outdoor, gedung fasilitas olahraga dangedung olahraga Institut Teknologi Sepuluh Nopember yanginformatif dengan menggunakan Unreal Engine

2. Bagaimana mengembangkan peta tiga dimensi lapanganbasket, lapangan futsal outdoor, gedung fasilitas olahragadan gedung olahraga Institut Teknologi Sepuluh Nopembersehingga pengguna dapat berinteraksi dengan objek dalampeta.

3. Bagaimana membuat peta tiga dimensi lapangan basket,lapangan futsal outdoor, gedung fasilitas olahraga dangedung olahraga Institut Teknologi Sepuluh Nopember yangterstandardisasi sehingga dapat diintegrasikan dengan yangsudah ada.

Sidang Akhir | E-Business

Page 4: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Batasan Masalah

Dari perumusan masalah di atas, tugas akhir ini memilikibatasan sebagai berikut :

1.Aplikasi yang dibangun tidak mencakup interaksi antar pengguna.

2.Aplikasi yang dikembangkan hanya mencakup peta wilayah lapanganbasket, lapangan futsal outdoor, gedung fasilitas olahraga dan gedungolahraga Institut Teknologi Sepuluh Nopember, dengan cakupan yangdijelaskan lebih lanjut dalam metodologi penelitian.

3.Aplikasi yang dikembangkan tidak dapat diedit oleh pengguna.

4.Aplikasi ini tidak menerapkan Artificial Intelligence.

Sidang Akhir | E-Business

Page 5: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Tujuan Tugas Akhir

Tujuan dari tugas akhir ini adalah memahami karakteristikteknologi pengembangan visual tiga dimensi dan kemudianmemanfaatkannya dalam pengembangan peta tiga dimensilapangan basket, lapangan futsal outdoor, gedung UPT fasilitasolahraga dan gedung olahraga badminton Institut TeknologiSepuluh Nopember yang interaktif dan informatif menurutpengguna dengan menggunakan unreal engine.

Sidang Akhir | E-Business

Page 6: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Manfaat Tugas Akhir

Manfaat tugas akhir ini adalah sebagai berikut :1. Membantu pihak UPT FASOR untuk memfasilitasi

pengunjungnya agar mengetahui bentuk gedung dan wilayahdi ITS dalam bentuk peta tiga dimensi sehingga pengunjungtidak perlu berjalan jauh untuk mengetahui daerah-dareah diITS.

2. Membantu pengguna untuk mengenal wilayah-wilayah di ITSsesuai dengan bentuk aslinya berupa peta 3D yang informatifdan interaktif.

Sidang Akhir | E-Business

Page 7: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Objek Penelitian

1. Gedung UPT FASOR2. Lapangan Basket3. Gedung GOR Badminton4. Lapangan Futsal Outdoor

Sidang Akhir | E-Business

Page 8: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Metodologi

Penelitian

Sidang Akhir | E-Business

Page 9: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Daftar Interaksi

Sidang Akhir | E-Business

Page 10: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Diagram Use Case uc Use Case Model

Pengguna

Memilih Menu

Mengubah

ResolusiMelihat Bantuan

Memilih Peta

Menjelajahi Peta

Melihat Peta 2D

Melakukan

Teleportasi

Gedung UPT

FASORLapangan Basket

GORLapangan

Futsal

Navigasi

Mengaktifkan

Layar Informasi

Interkasi dengan

Objek

Melihat Jadwal

Peminjaman

Melihat Video

Permainan

Proses

Peminjaman

Lapangan

Melakukan

Permainan

Melihat Video

Tour

«precedes» «precedes»

«precedes»

«precedes»«invokes»

«precedes»

«precedes»

«invokes»«invokes»

«invokes»«invokes»

«precedes»

«precedes»

«invokes»

«invokes» «invokes»

«invokes»

«precedes»

«precedes»

Sidang Akhir | E-Business

Page 11: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

GUI Story Board

Sidang Akhir | E-Business

Page 12: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Lingkungan Implementasi

• Hardware

• Software

Spesifikasi

Prosesor: Intel Core i3 M350 @2,27 GhzMemori: 4.00 GB RAMVGA: NVIDIA GeForce GTS 450 1024 MBSistem Operasi: Windows 7 Professional 32-bit

Teknologi Versi

Editor Unreal Development Kit 64bit (Februari’12)

3D Editor Autodesk 3ds Max 2013Animation

Editor

Adobe Flash CS5

Sound Editor AudacityTexture Editor Adobe Photoshop CS5, PaintVideo Editor Freemake Video Converter

Sidang Akhir | E-Business

Page 13: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Peta 2 Dimensi

Sidang Akhir | E-Business

Page 14: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Uji Coba Fungsional

• Dilakukan melalui unit test darirancangan test case yang telahdirancang. Setiap skenario pada testcase dijalankan dan hasil yang adapada test case dibandingkan denganhasil aplikasi.

No. Test Case ID Hasil

1. TC 13-01 Berhasil2. TC 13-02 Berhasil3. TC 14-01 Berhasil4. TC 14-02 Berhasil5. TC 14-03 Berhasil6. TC 15-01 Berhasil7. TC 15-02 Berhasil8. TC 15-03 Berhasil9. TC 16-01 Berhasil10. TC 16-02 Berhasil11. TC 16-03 Berhasil12. TC 17-01 Berhasil13. TC 17-02 Berhasil14. TC 17-03 Berhasil15. TC 18-01 Berhasil16. TC 18-02 Berhasil17. TC 19-01 Berhasil18. TC 19-02 Berhasil

Sidang Akhir | E-Business

Page 15: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Uji Coba Non Fungsional

• Uji coba non-fungsional adalah uji coba aplikasi berdasarkan performa FPS (Frame Per Second) rate dari map 3D saat dijalankan dengan cara membandingkan performa dari beberapa komputer berbeda dengan spesifikasinya masing-masing.

Sidang Akhir | E-Business

Page 16: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Penanda Interaksi

Penanda Interaksi Ruangan Penanda Interaksi Objek

Sidang Akhir | E-Business

Page 17: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Pergantian Siang dan Malam

Sidang Akhir | E-Business

Page 18: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Video Opening / Melihat Peta

Keseluruhan

Sidang Akhir | E-Business

Page 19: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Prosedur Peminjaman Lapangan

Sidang Akhir | E-Business

Page 20: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Lihat Jadwal Pemakaian

Sidang Akhir | E-Business

Page 21: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Mengunjungi Lokasi

Sidang Akhir | E-Business

Page 22: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Lihat Video

Sidang Akhir | E-Business

Page 23: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Sidang Akhir | E-Business

Page 24: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Permainan

Sidang Akhir | E-Business

Page 25: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Sidang Akhir | E-Business

Page 26: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Sidang Akhir | E-Business

Page 27: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Uji Coba Non Fungsional

• Dari hasil pengujian diketahui bahwa perbedaan spesifikasi komputerberpengaruh pada hasil FPS. Komputer dengan VGA tipe bagus danmemori yang lebih besar, memiliki hasil FPS yang besar pula.

• Hasil FPS indoor dan outdoor juga berbeda-beda. Hal ini disebabkan olehsedikit banyaknya objek yang ditampilkan. Pada peta FASOR ini sebagianbesar objek terletak di luar bangunan. Sehingga objek-objek outdoor lebihbanyak dibandingkan objek-objek indoor. Hal ini meyebabkan hasil FPSoutdoor lebih kecil daripada FPS indoor.

• Hasil FPS juga dipengaruhi oleh banyaknya interaksi dan juga tipe objek.Pada peta FASOR, banyak interaksi yang terjadi di luar ruangan karenasebagian besar merupakan lapangan outdoor. Selain itu pada wilayahoutdoor juga terdapat banyak sekali objek-objek dalam bentuk meshseperti pohon dan rumput. Sedangkan pada wilayah indoor sebagian besarmenggunakan brush yang meringankan kinerja komputer.

Sidang Akhir | E-Business

Page 28: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Evaluasi Implementasi

Sidang Akhir | E-Business

Page 29: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Kesimpulan• Standardisasi yang jelas memberikan kemudahan dalam mengembangkan Peta 3D lapangan

basket, lapangan futsal outdoor, gedung UPT fasilitas olahraga dan gedung olahragabadminton Institut Teknologi Sepuluh Nopember Surabaya menggunakan UnrealDevelopment Kit. Dengan mengikuti standar yang telah ditetapkan diharapkan Peta 3D inidapat diintegrasikan dengan peta-peta lainnya.

• Masih terdapat beberapa bug dalam pembuatan Peta 3D menggunakan UDK seperti padasaat penggunaan CSG_substract dan Split pada brush yang menyebabkan brush menjadirusak seperti terlihat bolong atau retak serta perubahan trigger setelah melakukan prosesbuilding.

• Penggunaan trigger yang sama bisa menyebabkan interaksi tidak dapat dijalankan bahkandapat membuat UDK mati dengan sendirinya.

• Pembuatan interaksi di dalam peta memerlukan kreativitas sendiri dan disesuaikan dengankebutuhan serta karakteristik dari peta yang akan dibangun sehingga dapat menggambarkanproses bisnis yang ada.

• Ukuran sebuah peta dan sumber daya yang melebihi kapasitas yaitu 300Mb, dapat dilakukanpembagian peta menjadi dua yang kemudian dapat digabungkan menjadi satu kesatuan peta.

• Pemilihan metode penggabungan antar peta yang terdapat pada Unreal engine dilakukandengan mempertimbangkan ukuran masing-masing peta yang dapat mempengaruhi tingkatkecepatan/kemudahan pengguna dalam menjalankan aplikasi.

Sidang Akhir | E-Business

Page 30: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Saran

• Melakukan back up secara berkala untuk mengantisipasi jika sewaktu-waktu terjadi kesalahanatau bug dan manajemen resource yang baik karena UDK menghabiskan resource storageyang sangat besar terutama jika fitur auto.

• Untuk kinerja komputer yang lebih baik, dalam pembuatan aplikasi sebaiknya lebihmengutamakan penggunaan brush dibanding mesh.

• Pengembangan aplikasi sebaiknya dilakukan pada komputer yang memiliki spesifikasi tinggiatau yang memang mendukung untuk pembuatan game.

• Lakukan kompresi pada file video dan sound yang akan dimasukkan agar FPS video dalamaplikasi tidak turun terlalu drastis.

• Teliti dalam penggunaan trigger karena trigger yang sama dapat menyebabkan UDK menjadinot responding dan harus ditutup secara paksa.

• Menggunakan UDK versi terbaru untuk menghindari terjadinya bug seperti penggunaantrigger atau brush yang bolong atau retak saat penggunaan CSG_substract dan Split.Untukbug pada triger yang menyebabkan sistem not responding dapat diatasi dengan menghapustriger lama dan memasang triger baru dan selanjutnya memasukkan kembali triger baru kedalam sequence interaksi. Sedangkan bug pada penggunaan CSG_substract dan Split dapatdiatasi dengan memasang CSG_substract baru dan melakukan build geomatry ulang.

Sidang Akhir | E-Business

Page 31: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

Daftar Pustaka• Bullen, T., Katchabaw, M. J. & Dyer-Witheford, N. (2006). Instrumentation of Video Game Software to Support Automated

Content Analyses. Makalah disajikan dalam 2006 GameOn North America Conference, Monterey, California, September2006, 34-38. Diambil tanggal 25 Oktober 2010, tersedia di http://www.csd.uwo.ca/~katchab/pubs/index.html

• Busby, J., et al. (2004). Mastering Unreal Technology. Volume I: Introduction to Level Design with Unreal engine 3.Indianapolis: Sams Publishing.

• Busby, J., et al. (2010). Mastering Unreal Technology. Volume II: Advanced Level Design Concepts with Unreal engine 3.Indianapolis: Sams Publishing.

• Fritsch, D., & Kada, M. (2004). Visualisation Using Game Engines. Makalah disajikan dalam ISPRS commission V.

• Game Engines. Diambil tanggal 22 Oktober 2010, tersedia di http://gpwiki.org/index.php/Game_Engines

• Game Engines – Popular Engines. Diambil tanggal 22 Oktober 2010, tersedia di http://www.moddb.com/engines

• Lepouras, G., & Vassilakis, C. (2004). Virtual Museums for all: Employing Game Technology for Edutainment., Virtual reality.,96-106.

• Petridis, P., Dunwell, I., de Freitas, S. & Panzoli, D. (2009). An Engine Selection Methodology for High Fidelity Serious Games.Makalah disajikan dalam 2010 Second International Conference on Games and Virtual Worlds for Serious Applications,Maret 2010, 27-34.

• Shiratuddin, M. F. & Fletcher, D. (2007). Utilizing 3D Games Development Tool For Architectural Design in a Virtual 184Environment. Makalah disajikan dalam 7th International Conference on Construction Applications of Virtual Reality, Oktober2007.

• Shiratuddin, M. F. & Thabet, W. (2002). Virtual Office Walkthrough Using a 3D Game Engine. Makalah disajikan dalamInternational Journal of Design Computing.

• Showcase – Epic UDK. Diambil tanggal 21 September 2010, tersedia di http://www.udk.com/showcase

• Smith, Shamus P. & Trenholme, David. (2008). Computer Game Engines for Developing First-Person Virtual Environments.,Virtual reality., 12 (3), 181-187.

• Unreal Editor User Guide. Diambil tanggal 21 September 2010, tersedia dihttp://udn.epicgames.com/Three/UnrealEdUserGuide.

• Apa itu FPS dan fps –. Diambil tanggal 17 Juli 2014, tersedia di http://stendo.wordpress.com/2008/12/09/apa-itu-fpsdan-fps/

Sidang Akhir | E-Business

Page 32: PENGEMBANGAN PETA INTERAKTIF TIGA DIMENSI …digilib.its.ac.id/public/ITS-paper-38021-5209100010-presentation.pdf · • Ukuran sebuah peta dan sumber daya yang melebihi kapasitas

TERIMA KASIH

Sekian