Pengembangan Peta Interaktif Tiga Dimensi Menggunakan...

6
Pengembangan Peta Interaktif Tiga Dimensi Menggunakan Unreal Engine Febriliyan Samopa 1) , Titus Irma D. 2) , Azlan Mufti 3) , Nur Safira A. 4) , Fitrah Meilia Purnama 5) , Yuli Aria W. 6) , Zinzia Shavira.P.H. 7) , Fitriannisa Umami 8) Abstrak ITS Surabaya memiliki banyak stakeholder yang membutuhkan pelayanan dalam pemeliharaan hubungan di antaranya. Dalam hal ini, peningkatan layanan kepada pihak-pihak tersebut dilakukan dengan pembangunan peta 3 dimensi (3D) interaktif yang memberikan kemudahan bagi pengguna (pihak-pihak yang memiliki kepentingan berkunjung ke ITS Surabaya) untuk menelusuri lokasi ITS Surabaya. Pembangunan peta 3D ini dilakukan dengan menggunakan framework teknologi Unreal Engine, yaitu dengan menggunakan tool Unreal Development Kit 3 (UDK) dan teknologi pendukung lain, seperti UML (Unified Model Language), Microsoft Visio, Adobe Photoshop CS3 Extended, Adobe Flash CS5 serta aplikasi-aplikasi lain yang mendukung dalam penyediaan resource peta 3D yang dibuat. Hasil dari pengerjaan Tugas Akhir ini adalah peta 3D yang interaktif dan informatif dengan 21 lokasi beserta objek di dalamnya dengan fitur-fitur tambahan, yaitu penunjuk arah, penunjuk lokasi aktor dalam peta, dan teleportasi. Tingkat informatif dan interaktif dari peta 3D diukur melalui uji coba fungsional dan non- fungsional serta evaluasi akurasi tampilan dan penggunaan aplikasi oleh pengguna. Kata kunci: Institut Teknologi Sepuluh Nopember (ITS) Surabaya, Peta 3D, Unreal Engine, UDK 1. Pendahuluan Institut Teknologi Sepuluh Nopember (ITS) Surabaya merupakan salah satu perguruan tinggi favorit yang diminati oleh banyak calon mahasiswa baru. Fakta tersebut dapat dilihat dari data Universitas Terbaik di Indonesia 2010 versi Webometrics, ITS Surabaya menduduki peringkat ke-7. Dengan peringkat yang berada di sepuluh besar, ITS Surabaya menjadi salah satu perguruan tinggi yang banyak menjadi incaran kerja sama oleh banyak industri. ITS Surabaya perlu melakukan peningkatan layanan terhadap pihak-pihak penting yang memberikan nilai tersendiri bagi ITS Surabaya. Yang dimaksud pihak-pihak penting di sini dapat meliputi calon mahasiswa baru, orang tua mahasiswa, alumni, atau pun perusahaan yang ingin bekerja sama dengan ITS Surabaya. Salah satu cara peningkatan yang dapat dilakukan adalah dengan membuat aplikasi peta interaktif 3D yang memberikan kemudahan-kemudahan kepada pihak-pihak penting tersebut saat berkunjung ke ITS Surabaya.Melihat dari tren saat ini di mana kemudahan dan kepraktisan lebih diutamakan. Peta 3D merupakan aplikasi yang memvisualisasikan peta dengan tampilan 3D yang sesuai dengan kenyataannya. Peta interaktif 3D dibuat dengan menggunakan software Unreal Engine. Unreal Engine versi 3 yang juga disebut sebagai Unreal Development Kit (UDK) merupakan engine yang mampu membuat gambaran virtual yang sesuai dengan dunia nyata. Pembangunan aplikasi ini menggunakan metode bottom up untuk proses secara keseluruhan, metode top down untuk proses pembangunan modul peta. Dalam proses pembangunannya, dilakukan tahap integrasi dan pengujian sistem di akhir untuk mengetahui performa dari aplikasi. 2. Tinjauan Pustaka Dalam pembangunan aplikasi, digunakan beberapa dasar dari beberapa sumber bacaan. 2.1. Unreal Engine Unreal Engine merupakan salah satu teknologi yang digunakan untuk membangun sebuah game. Unreal Engine menggunakan konsep aliran data seperti gambar 1. Gambar 1. Konsep aliran data dalam Unreal Engine Dari gambar di atas, dapat diketahui bahwa untuk membuat suatu peta 3D dibutuhkan sumber daya awal yang nantinya diolah dengan menggunakan aplikasi Unreal Engine. Editor yang terdapat dalam Unreal Engine meliputi, 1) Unreal Front End Editor, melakukan packaging, eksekusi program, pengaturan DATA Maps Textures Musics UNREAL ENGINE Graphics Sounds Physics

Transcript of Pengembangan Peta Interaktif Tiga Dimensi Menggunakan...

Page 1: Pengembangan Peta Interaktif Tiga Dimensi Menggunakan ...digilib.its.ac.id/public/ITS-Undergraduate-17607-Paper-1495107.pdfAdobe Flash CS5, untuk mengelolah informasi dan menu aplikasi,

Pengembangan Peta Interaktif Tiga Dimensi Menggunakan Unreal Engine

Febriliyan Samopa1), Titus Irma D. 2), Azlan Mufti3), Nur Safira A.4), Fitrah Meilia Purnama 5),

Yuli Aria W.6), Zinzia Shavira.P.H.7), Fitriannisa Umami8)

Abstrak ITS Surabaya memiliki banyak stakeholder yang membutuhkan pelayanan dalam pemeliharaan hubungan di antaranya. Dalam hal ini, peningkatan layanan kepada pihak-pihak tersebut dilakukan dengan pembangunan peta 3 dimensi (3D) interaktif yang memberikan kemudahan bagi pengguna (pihak-pihak yang memiliki kepentingan berkunjung ke ITS Surabaya) untuk menelusuri lokasi ITS Surabaya. Pembangunan peta 3D ini dilakukan dengan menggunakan framework teknologi Unreal Engine, yaitu dengan menggunakan tool Unreal Development Kit 3 (UDK) dan teknologi pendukung lain, seperti UML (Unified Model Language), Microsoft Visio, Adobe Photoshop CS3 Extended, Adobe Flash CS5 serta aplikasi-aplikasi lain yang mendukung dalam penyediaan resource peta 3D yang dibuat. Hasil dari pengerjaan Tugas Akhir ini adalah peta 3D yang interaktif dan informatif dengan 21 lokasi beserta objek di dalamnya dengan fitur-fitur tambahan, yaitu penunjuk arah, penunjuk lokasi aktor dalam peta, dan teleportasi. Tingkat informatif dan interaktif dari peta 3D diukur melalui uji coba fungsional dan non-fungsional serta evaluasi akurasi tampilan dan penggunaan aplikasi oleh pengguna. Kata kunci: Institut Teknologi Sepuluh Nopember (ITS) Surabaya, Peta 3D, Unreal Engine, UDK 1. Pendahuluan

Institut Teknologi Sepuluh Nopember (ITS)

Surabaya merupakan salah satu perguruan tinggi favorit yang diminati oleh banyak calon mahasiswa baru. Fakta tersebut dapat dilihat dari data Universitas Terbaik di Indonesia 2010 versi Webometrics, ITS Surabaya menduduki peringkat ke-7. Dengan peringkat yang berada di sepuluh besar, ITS Surabaya menjadi salah satu perguruan tinggi yang banyak menjadi incaran kerja sama oleh banyak industri. ITS Surabaya perlu melakukan peningkatan layanan terhadap pihak-pihak penting yang memberikan nilai tersendiri bagi ITS Surabaya. Yang dimaksud pihak-pihak penting di sini dapat meliputi calon mahasiswa baru, orang tua mahasiswa, alumni, atau pun perusahaan yang ingin bekerja sama dengan ITS Surabaya. Salah satu cara peningkatan yang dapat dilakukan adalah dengan membuat aplikasi peta interaktif 3D yang memberikan

kemudahan-kemudahan kepada pihak-pihak penting tersebut saat berkunjung ke ITS Surabaya.Melihat dari tren saat ini di mana kemudahan dan kepraktisan lebih diutamakan. Peta 3D merupakan aplikasi yang memvisualisasikan peta dengan tampilan 3D yang sesuai dengan kenyataannya.

Peta interaktif 3D dibuat dengan menggunakan software Unreal Engine. Unreal Engine versi 3 yang juga disebut sebagai Unreal Development Kit (UDK) merupakan engine yang mampu membuat gambaran virtual yang sesuai dengan dunia nyata. Pembangunan aplikasi ini menggunakan metode bottom up untuk proses secara keseluruhan, metode top down untuk proses pembangunan modul peta. Dalam proses pembangunannya, dilakukan tahap integrasi dan pengujian sistem di akhir untuk mengetahui performa dari aplikasi. 2. Tinjauan Pustaka

Dalam pembangunan aplikasi, digunakan beberapa

dasar dari beberapa sumber bacaan.

2.1. Unreal Engine Unreal Engine merupakan salah satu teknologi yang

digunakan untuk membangun sebuah game. Unreal Engine menggunakan konsep aliran data seperti gambar 1.

Gambar 1. Konsep aliran data dalam Unreal

Engine Dari gambar di atas, dapat diketahui bahwa untuk

membuat suatu peta 3D dibutuhkan sumber daya awal yang nantinya diolah dengan menggunakan aplikasi Unreal Engine. Editor yang terdapat dalam Unreal Engine meliputi, 1) Unreal Front End Editor, melakukan packaging, eksekusi program, pengaturan

DATA

Maps Textures

Musics

UNREAL ENGINE

Graphics Sounds Physics

Page 2: Pengembangan Peta Interaktif Tiga Dimensi Menggunakan ...digilib.its.ac.id/public/ITS-Undergraduate-17607-Paper-1495107.pdfAdobe Flash CS5, untuk mengelolah informasi dan menu aplikasi,

jaringan, 2) Unreal Kismet, membentuk logika penyajian interaksi dan informasi dalam peta 3D, 3) Unreal Matinee, membuat efek pergerakan, 4) Unreal StaticMesh Editor, mengatur pemberian material dan collision dari suatu mesh/objek, 5) Unreal AnimSet dan Unreal AnimTree, mengatur aktor dari aplikasi, 6) Unreal SoundCue, membuat efek suara untuk peta 3D.

2.2. Aplikasi Pendukung Unreal Engine

Dalam penggunaan aplikasi ini, penyediaan sumber

daya dalam pembuatan aplikasi dilakukan dengan menggunakan aplikasi pendukung di luar Unreal Engine, yaitu 1) Adobe Photoshop CS3 Extended dan plugin NVIDIA Normal, untuk mengelolah texture, 2) Adobe Flash CS5, untuk mengelolah informasi dan menu aplikasi, 3) Microsoft Visio, untuk desain peta 2D, 4) Adobe SoundBooth CS5, untuk mengolah suara, 5) Autodesk 3D Studio Max, untuk membuat objek-objek dalam bentuk 3D, 6) Adobe After Effect, untuk membuat animasi movie di awal aplikasi, 7) RAD Video Tools, untuk melakukan kompresi video.

2.3. Interaksi Manusia Komputer

IMK mempermudah hubungan antarmuka yang

tidak hanya meliputi perancangan layout layar monitor dengan penggunanya. Selain itu, IMK juga memerhatikan unsur useful, usable, dan used. Useful menunjukkan adanya fungsional di dalamnya serta dapat melakukan suatu pekerjaan. Usable menunjukkan kemudahan dan kebenaran dalam mengerjakan sesuatu. Used menunjukkan ketersediaannya untuk digunakan. Terdapat beberapa elemen utama dalam IMK, yaitu manusia, komputer, interaksi, aktivitas, dan lingkungan kerja. 3. Pembahasan

Pembangunan aplikasi 3D dilakukan dengan menggunakan tools Unreal Engine, khususnya Unreal Engine versi 3, Unreal Development Kit, yang selanjutnya disebut dengan UDK. Dalam pembangunan aplikasi 3D ini dilakukan beberapa tahapan, yaitu: Standardisasi pengerjaan, membuat standar

perbandingan ukuran antara ukuran nyata dengan ukuran yang akan dibuat dalam peta 3D.

Survey lokasi dan pengambilan data awal, memperoleh foto-foto dan data dari objek yang akan dibuat dalam aplikasi.

Desain sistem, membuat alur yang mungkin terjadi dalam aplikasi menggunakan tools Unified Modelling Language (UML), khususnya dengan menggunakan metode Use Case Driven Object.

Desain peta, membuat peta 2D dari objek penelitian yang dibuat dengan menggunakan Microsoft Visio.

Pembuatan aplikasi, memiliki beberapa tahapan di dalamnya, • Pembangunan peta 3D (geometri)

• Pembuatan dan peletakan objek • Penambahan interaksi • Pengaturan pencahayaan • Penambahan suara

Integrasi aplikasi Pengujian aplikasi

3.1. Standardisasi Pengerjaan

Peta interaktif 3D ITS Surabaya dibuat dengan

menggunakan metode bottom up, di mana objek penelitian yang berupa area dari beberapa jurusan dibangun terlebih dahulu satu per satu sebagai modul peta. Modul-modul ini akhirnya disatukan menjadi aplikasi peta interaktif 3D ITS.

Sedangkan untuk pengerjaan masing-masing modul dari peta interaktif 3D ITS Surabaya, metode yang digunakan adalah top down di mana setiap modul dilakukan dengan membangun keseluruhan gedung dan lokasi kemudian dibuat objek-objek dan detail-detail di dalamnya.

Terdapat beberapa standardisasi lain untuk masing-masing modul peta, diantaranya adalah :

- nama peta : diawali dengan INI3D - konversi ukuran - interaksi standar - bentuk animasi.

3.2. Survey Lokasi dan Pengambilan Data Awal

Tahapan ini mencakup survey primer dan sekunder dari desain master plan yang sudah ada sebelumnya. Tahap ini menghasilkan foto-foto dan informasi tentang ruangan dan objek yang akan dibuat dalam aplikasi peta 3D. Hasil dari tahapan ini menjadi standar dan acuan dalam pembuatan aplikasi peta 3D. 3.3. Desain Sistem

Tahapan ini menghasilkan 1) GUI Storyboard yang

digunakan sebagai acuan untuk jalannya aplikasi peta 3D dilihat dari desain tampilannya, 2) Domain model yang menunjukkan objek-objek yang digunakan dalam pembangunan aplikasi, 3) Diagram dan deskripsi use case yang menunjukkan alur yang mungkin terjadi ketika menggunakan aplikasi, 4) Diagram sequence yang menunjukkan jalannya aplikasi dilihat dari sisi aplikasi, 5) Test case merupakan rancangan yang digunakan dalam tahapan pengujian aplikasi dari sisi fungsional.

3.4. Desain Peta

Tahapan ini menghasilkan peta dari objek penelitian dalam bentuk 2D. Peta ini digunakan sebagai dasar dalam pembuatan aplikasi peta interaktif 3D. Desain yang pertama adalah desain peta 2D yang digunakan sebagai dasar pembuatan menu peta 2D aplikasi.

Page 3: Pengembangan Peta Interaktif Tiga Dimensi Menggunakan ...digilib.its.ac.id/public/ITS-Undergraduate-17607-Paper-1495107.pdfAdobe Flash CS5, untuk mengelolah informasi dan menu aplikasi,

Gambar 2. Desain Peta 2D lantai 2 Jurusan Teknik Sipil ITS Surabaya

Desain yang selanjutnya dilakukan adalah desain

informasi di mana dilakukan penentuan bentuk-bentuk informasi yang ditampilkan dalam aplikasi. Selain kedua desain di atas, dilakukan desain interaksi yang memberikan rancangan tentang interaksi-interaksi yang akan dibuat.

3.5. Pembuatan Aplikasi

Hasil dari tahapan sebelumnya digunakan dalam tahapan pembuatan aplikasi ini. 3.5.1. Pembangunan Peta 3D

Tahapan yang dapat dilakukan pertama ketika telah

melakukan desain adalah membuat geometri area dengan menggunakan brush melalui Back End Unreal Engine yang disebut sebagai Unreal Editor. Pembuatan geometri ini melibatkan 2 jenis brush, yaitu CSG_Add dan CSG_Substract (untuk memotong CSG_Add). Gambar 3 merupakan hasil pembuatan geometri dalam mode Brush Wireframe.

Gambar 3. Pembuatan Geometri

Setelah melakukan pembuatan geometri bangunan, dilakukan pembuatan dan pemasangan material. Material dibuat dengan menggunakan Unreal Material Editor di mana sumber daya dari pembuatan material adalah berupa texture, gambar 2D.

Material memberikan corak permukaan yang mendekati nyata untuk suatu objek.

Sumber daya yang juga dapat dibuat dalam UDK adalah FluidSurface dan terrain. Kedua komponen ini diletakkan sebagai objek permukaan air dan halaman. Penggunaan kedua komponen ini memberikan efisiensi besarnya kapasitas dari pembuatan objek yang sama untuk area yang luas.

3.5.2. Pembuatan dan Peletakan Objek

Selain pembuatan dinding-dinding bangunan

menggunakan brush, dilakukan pembuatan dan peletakan objek dari ruangan-ruangan tersebut. Pembuatan objek 3D atau mesh dilakukan menggunakan Autodesk 3D Studio Max kemudian diekspor dalam 3 pilihan ekstensi. Tabel 1 menunjukkan perbedaan dari masing-masing ekstensi.

Tabel 1. Ekstensi Ekspor Objek dari Autodesk 3D Studio Max

Format Keterangan .ASE Format ini mengekspor objek yang hanya

dapat diberi 1 material dalam Static Mesh Editor dalam UDK

.FBX Format ini mengekspor objek yang dapat diberi banyak material dalam Static Mesh Editor dalam UDK. Namun, terdapat hambatan yang dapat ditemui dalam format ini, yaitu tidak sempurnanya atau rusaknya beberapa sisi objek. Sebelum proses pengeksporan, tidak perlu dilakukan penggabungan bagian-bagian dari objek yang akan diekpor. Hal ini dikarenakan bagian-bagian terpisah tersebut dapat disatukan saat proses impor ke dalam UDK.

.DAE Format ini mengekspor objek yang dapat diberi banyak material dalam Static Mesh Editor dalam UDK. Sebelum mengekspor objek, dilakukan penggabungan bagian-bagian dari objek tersebut. Dalam format ini, UDK tidak memiliki fitur untuk menggabungkan bagian-bagian objek menjadi satu kesatuan.

Setelah dilakukan proses ekpor, objek-objek hasil

proses tersebut dimasukkan ke dalam aset UDK melalui Content Browser yang ada dalam Back End Editor. Dengan menggunakan Unreal StaticMesh Editor, objek-objek yang dimasukkan diatur material pembungkus objek tersebut serta collision (daya tabrak/kepadatan) dari objek tersebut.

3.5.3. Penambahan Interaksi

Bagian penting dari pembuatan aplikasi ini adalah

tahapan pemberian interaksi. Pemberian interaksi ini termasuk pemberian informasi dari setiap objek yang dapat diinteraksikan. Penandaan objek yang dapat diinteraksikan

penanda objek perlu dilakukan agar objek yang dapat diinteraksikan menarik perhatian pengguna.

Page 4: Pengembangan Peta Interaktif Tiga Dimensi Menggunakan ...digilib.its.ac.id/public/ITS-Undergraduate-17607-Paper-1495107.pdfAdobe Flash CS5, untuk mengelolah informasi dan menu aplikasi,

Penandaan objek ini dilakukan dengan memanfaatkan particle system yang disediakan UDK yang dapat dikostumisasi. Penandaan objek dibedakan menjadi penanda objek (Gambar 4) dan penanda lokasi penting (Gambar 3)

Gambar 3. Bentuk Partikel Berwarna Biru

Penanda Lokasi Penting

Gambar 4. Bentuk Partikel Berwarna Hijau Penanda Objek yang Dapat Diinteraksikan

Penambahan layar informasi Layar informasi dibentuk dalam tampilan animasi flash yang memuat informasi suatu tempat. Layar informasi ini akan muncul ketika aktor melewati tempat penting dalam peta. animasi ini dibuat seperti mini info agar tidak mengganggu fokus pengguna pada peta. Gambar 5 memunjukkan tampilan mini info tempat penting pada peta 3D.

Gambar 4. Animasi Informasi

Penambahan informasi objek Untuk objek-objek yang dapat diinteraksikan, diberikan tiga jenis informasi, yaitu informasi pemberitahuan yang berupa instruksi penggunaan objek, informasi singkat tentang objek tersebut, dan informasi yang berjalan selama interaksi dilakukan.

Penambahan menu peta 2D Salah satu fitur yang dibuat dalam aplikasi ini adalah menu peta 2D, di mana pengguna dapat menekan tombol M di keyboard ketika sedang menjalankan aplikasi kemudian sistem akan menampilkan fitur seperti dalam gambar x.

Gambar 5. Dialog pilihan Dari dialog tersebut, jika pengguna memilih “Masuk ke dalam ruangan”, aktor akan dikirimkan ke dalam ruangan tersebut. Sedangkan saat pengguna memilih “Tunjukkan arah menuju ruangan” akan keluar flash untuk menunjukan letak ruangan tersebut seperti terlihat pada Gambar 5.

Gambar 6. Petunjuk arah

Terdapat beberapa arti simbol dari gambar x tersebut. 1) tanda panah berwarna merah menunjukkan lokasi aktor dalam peta 3D yang sedang dijalankan, 2) tanda bintang berwarna kuning menunjukkan lokasi-lokasi penting yang memiliki informasi, 3) tiga pilihan fitur dalam setiap tanda bintang, yaitu teleportasi (“Masuk ke dalam ruangan”), penunjuk arah (“Tunjukkan arah menuju ruangan”), dan pilihan untuk menutup pilihan tersebut. Teleportasi dibuat dengan menggunakan struktur kismet Teleport di mana aktor langsung dapat menuju lokasi yang dituju tanpa harus menelusuri jalan. Sedangkan untuk fitur lokasi aktor, digunakan perhitungan di luar UDK, yaitu dalam flash menggunakan ActionScript. Untuk mendapatkan suatu lokasi aktor, perlu dilakukan pen-skalaan yang menunjukkan perbandingan antara gambar di peta 2D dan peta 3D. 𝑝𝑒𝑟𝑏𝑎𝑛𝑑𝑖𝑛𝑔𝑎𝑛 = 𝑥1𝑓−𝑥2𝑓

𝑥1𝑢−𝑥2𝑢 ................................ (1)

Keterangan: 𝑥1𝑓 = nilai x pertama dalam flash 𝑥2𝑓 = nilai x kedua dalam flash 𝑥1𝑢 = nilai x pertama dalam Unreal Engine 𝑥2𝑢 = nilai x kedua dalam Unreal Engine Hasil perbandingan yang diperoleh digunakan untuk perhitungan sebagai berikut. 𝑥𝑢𝑝 = 𝑥1𝑓−𝑥2𝑓

𝑥1𝑢−𝑥2𝑢× 𝑥1𝑢 ............................. (2)

𝑦𝑢𝑝 = 𝑥1𝑓−𝑥2𝑓𝑥1𝑢−𝑥2𝑢

× 𝑦1𝑢 ............................. (3) Keterangan: 𝑥𝑢𝑝 = nilai x baru dalam peta 2D yang akan ditampilkan dalam aplikasi 𝑦𝑢𝑝 = nilai y baru dalam peta 2D yang akan ditampilkan dalam aplikasi Nilai yang didapatkan terakhir merupakan nilai yang didapatkan untuk merepresentasikan letak aktor. Kemudian, untuk menentukan arah aktor sedang menghadap, digunakan konversi sudut dengan formula (4).

Page 5: Pengembangan Peta Interaktif Tiga Dimensi Menggunakan ...digilib.its.ac.id/public/ITS-Undergraduate-17607-Paper-1495107.pdfAdobe Flash CS5, untuk mengelolah informasi dan menu aplikasi,

𝑑𝑒𝑔 = 𝑎𝑟𝑐𝑐𝑜𝑠(𝑦𝑎𝑤) ∗ �180𝜋� ................... (4)

3.5.4. Pengaturan Pencahayaan Pencahayaan yang digunakan dibagi menjadi 2, yaitu

pengaturan pencahayaan alam (matahari) dan pengaturan pencahayaan ruangan. Untuk pencahayaan alam, digunakan aktor DominantDirectionalLight yang memberikan efek pencahayaan matahari untuk keseluruhan lokasi peta 3D. Sedangkan untuk pencahayaan ruangan, digunakan aktor PointLight Toggelable yang memberikan efek pencahayaan untuk ruangan serta dapat dihidupkan dan dimatikan. 3.5.5. Penambahan Suara

Pengaturan lain yang dilakukan adalah penambahan

suara untuk objek-objek yang dapat diinteraksikan. Misalnya, pintu atau mesin. Pembuatan efek suara ini dilakukan menggunakan Unreal SoundCue Editor kemudian digunakan dalam Unreal Kismet ataupun Unreal Matinee. 3.6. Integrasi Aplikasi

Tahapan integrasi aplikasi dari semua modul peta meliputi beberapa bagian, yaitu: Standardisasi nama peta.

Unreal memiliki beberapa pengaturan peta yang berbeda beda. Pengaturan yang dimaksud seperti navigasi dan actor yang digunakan. Agar semua modul peta dapat dipanggil sesuai pengaturan aplikasi peta 3D ITS Surabaya, maka dilakukan standardisasi nama peta, yaitu dengan awalan INI3D-<nama modul>.udk. Selain untuk pengaturan, standarisasi nama peta juga untuk mempermudah proses integrasi.

Pembuatan aktor UDK telah memberikan aktor default aplikasi, yaitu berupa robot. Untuk menyesuaikan dengan pembuatan peta 3D dari ITS Surabaya ini, dilakukan pengubahan aktor dengan cara membuat skeletal mesh serta gerakan aktor menggunakan Autodesk 3D Studio Max. Skeletal mesh dan gerakan-gerakan yang dibuat kemudian diimpor ke dalam UDK melalui content browser. Pengaturan material dan skeletal mesh dari aktor dilakukan dalam Unreal AnimSet Editor. Sedangkan untuk penyusunan pergerakan aktor tersebut, digunakan Unreal AnimTree.

Konfigurasi aplikasi Pengaturan-pengaturan aplikasi ada yang bersifat hardcode, di mana dilakukan pengeditan di bagian konfigurasi default UDK. Konfigurasi default udk berada pada folder _root/UDKGame/config. Konfigurasi yang diatur salah satunya adalah navigasi.

Konfigurasi lain yang dilakukan adalah penggunaan aktor default yang digunakan. Konfigurasi ini dilakukan dengan mengubah file UTFamilyInfo_Ini3D_Female.uc dan UTPawn.uc Selain mengganti aktor default, dilakukan juga pengaturan kecepatan gerak aktor.

Pengaturan World Properties Setelah pengubahan konfigurasi telah dilakukan, untuk menggunakan perubahan tersebut, dilakukan pengubahan WorldInfo di bagian World Properties. Di bagian ini, dipilih konfigurasi INI3D sehingga aplikasi berjalan sesuai dengan pengaturan yang dilakukan. Selain konfigurasi INI3D, juga dipilih opsi untuk menghilangkan inventory default berupa dari aktor game.

Pembuatan menu aplikasi Menu aplikasi ini digunakan sebagai penyatu semua modul peta. Jadi, modul-modul peta yang diintegrasikan dapat diakses melalui menu ini. Menu aplikasi dibuat dengan menggunakan Adobe Flash yang dihubungkan dengan aplikasi peta 3D ITS Surabaya. Gambar 4 merupakan tampilan antar-muka dari menu utama untuk aplikasi ini. Penamaan modul (INI3D-<nama modul>) yang bisa dipanggil ditentukan pada menu ini.

Gambar 7. Antarmuka menu utama

aplikasi peta 3D ITS Surabaya Penggantian splash screen dan movie

Sama halnya dengan produk-produk yang diproduksi oleh perusahaan, aplikasi ini membutuhkan splash screen dan movie yang digunakan dalam aplikasi ketika pertama kali membuka .exe ataupun saat memproses peta yang akan ditampilkan. Penggantian splash screen dilakukan dengan syarat tidak menghilangkan logo UDK dari splash screen.

Integrasi modul peta Modul-modul peta yang merupakan lokasi-lokasi yang berada di ITS, digabungkan dengan metode Loading. Metode ini baik digunakan untuk modul-modul peta yang berukuran besar sehingga performa (fps) dari aplikasi tidak memburuk. Pada dasarnya terdapat metode lain, yaitu Streaming. Metode ini memiliki kelebihan tampilan yang lebih terlihat nyata yang dapat melihat suatu lokasi peta (walaupun berbeda modul) dalam suatu sudut pandang.

3.7. Pengujian Aplikasi

Tahapan ini dilakukan untuk menguji kelengkapan

dan jalannya fungsi-fungsi aplikasi. Selain itu,

Page 6: Pengembangan Peta Interaktif Tiga Dimensi Menggunakan ...digilib.its.ac.id/public/ITS-Undergraduate-17607-Paper-1495107.pdfAdobe Flash CS5, untuk mengelolah informasi dan menu aplikasi,

dilakukan pengujian performa aplikasi di mana untuk aplikasi peta 3D, performa aplikasi dapat dilihat dari frame rate yang diproses setiap milidetiknya dan penggunaan memory. Selain itu, pengujian ini menghasilkan spesifikasi-spesifikasi dari komputer yang dapat menjalankan aplikasi ini. 6. Kesimpulan

Dari pembahasan di atas, dapat diambil beberapa kesimpulan sebagai berikut : a. a. Peta 3D ITS Surabaya dibangun dengan

menggunakan framework (kerangka kerja) dari teknologi Unreal Engine dengan menggunakan editor-editor Unreal Engine, yaitu UnrealMatinee, UnrealKismet, Unreal Static Mesh Editor, Unreal Material Editor, Unreal Animtree Editor, Unreal Animset, Unreal SoundCue, dan Unreal Front End Editor. Pembangunan ini mencakup pembuatan objek (barang-barang di dalam ruangan) sampai dengan penambahan informasi objek dan ruangan serta penambahan interaksi objek dalam aplikasi.

b. Unreal Engine mampu melakukan proses packaging dengan hasil sampai dengan 24% dari jumlah sumber daya aslinya yang meliputi file peta 3D beserta resource objek-objek (mesh), material, video, dan suara yang digunakan.

c. Metode integrasi modul peta yang digunakan dalam projek ini adalah metode Loading dengan mempertimbangkan kapasitas file setiap modul peta beserta resource-nya. Metode yang dipilih berpengaruh terhadap performa aplikasi ketika digunakan.

d. Tingkat interaktif dan informatif dari aplikasi INI3D telah dicapai melalui uji coba fungsional dan evaluasi penggunaan aplikasi yang dapat dilihat di bab V tentang uji coba fungsional sistem.

e. Hasil pengukuran performa dari aplikasi INI3D dengan menggunakan console yang disediakan dalam UDK menunjukkan bahwa aplikasi ini memiliki rata-rata nilai fps sebesar 13.9 dengan menggunakan spesifikasi komputer yang telah disebutkan dalam bab V tentang pengujian non-fungsional aplikasi. Semakin banyak objek, detail brush, dan detail lighting yang ditampilkan, maka mempengaruhi performa kecepatan aplikasi. Dengan kata lain, performa dari aplikasi (kecepatan) dipengaruhi oleh efektivitas dan efisiensi penggunaan sumber daya.

7. Daftar Pustaka [1] Busby J., Parrish, Z., dan Wilson, J. Mastering Unreal Technology Volume I: Introduction to Level Design with Unreal Engine 3 [Book]. - Indiana : Sams Publishing, 2009. [2] Epic Getting Started Programming on the Unreal Development Kit [Online] // epicgames. - 2010. -

http://udn.epicgames.com/Three/DevelopmentKitProgramming.html. [3] Lepouras G. dan Costas, V. Virtual Museums for all: Employing Game Technology for Edutainment [Article]. Luo L., Zou, X., Lu, J., Yang J., dan Chang, S. Research on Developing Client of Network Sport Fitness Game Based on 3D Game Engine [Journal]. - [s.l.] : International Journal of Sports Science and Engineering, 2007. - Vol. 1 (2007). - pp. 61-66. - 1750-9823. [4] NVIDIA Unreal Development Kit [Online]. - 2010. - URL:http://developer.nvidia.com/object/udk.html. O’Neill J. GameDaily Article: The Real Cost of Middleware [Online]. - 2008. - http://www.gamedaily.com/articles/features/my-turn-the-real-cost-of-middleware/71334/?biz=1. [5] Petridis P., Dunwell, I., de Freitas, S., Panzoli, D. An Engine Selection Methodology for High Fidelity Serious Games [Journal]. - [s.l.] : IEEE Computer Society, 2010. - Vols. 978-0-7695-3986-7/10. - 10.1109/VS-GAMES. [6] Shiratuddin M. F. dan Fletcher, D. Utilizing 3D Games Development Tool For Architectural Design In A Virtual Environment [Journal]. - [s.l.] : International Conference on Construction Applications of Virtual Reality, 2007. [7] Shiratuddin M.F dan Thabet, W. Virtual Office Walkthrough Using a 3D game Engine [Journal]. - [s.l.] : Special Issue on Designing Virtual Worlds, International Journal of Design Computing, 2002. - Vol. 4.