## IMPLEMENTASI TEKNOLOGI VIRTUAL DALAM VISUALISASI PENGENALAN KAMPUS MENGGUNAKAN WEBVR
Yuliana 1) , Helena Anggraeni (Reni) Tjondro Sugianto 2)
1 Teknologi Informasi, Institut Shanti Bhuana email: yuliana@shantibhuana.ac.id
2 Manajemen, Institut Shanti Bhuana email: helena@shantibhuana.ac.id

## Abstract
One  of  the  developments  from  this  information  is  Virtual  Reality  (VR),  a  Virtual  Web  Technology  that allows users to interact through an environment on the internet that has been simulated by a computer so that  users  feel  they  are  in  a  virtual  world.  VR  technology  is  becoming  the  top  choice  because  of how  it conveys messages to the environment to attract users.The purpose of this research is to be able to produce virtual web technology-based campus introduction visualizations with website results/output for campus buildings as well as immersive spatial displays and dynamic information. The research began by carrying out the 3D modeling stage using the help of Photoshop, marzipano, 3DVista tools (photos, sketches and 3D objects  on  one  of  the  campus  buildings.  The  campus  building  used  is  the  Rectorate  Building.  Lecture building, Auditorium building. Then the system development is carried out by building data and the room is  stored  in  a  database  and  coded  using  the  PHP  programming  language.  The  results  of  process observations during design, analysis and implementation produce a visualization WebVR Application by displaying information in the form of object, image and video formats. Virtual web technology can provide information related to the environment, campus buildings.

## Keywords: Virtual Reality, Visualization, Campus Introduction, Web Technology

## 1. PENDAHULUAN
Perkembangan  teknologi  sangat  cepat, membawa  kemudahan  bagi  pengguna  dalam menyampaikan  informasi  secara  tepat  dan bermanfaat dengan hadirnya Teknologi Informasi.  Dalam  meningkatkan  keinginan masyarakat yang sedang mencari ilmu pengetahuan  di  perguruan  tinggi  pilihan, diperlukan upaya strategi khusus dalam memperkenalkan  kelebihan  dan  tujuan  masing- masing setiap perguruan tinggi.
Teknologi VR ini menjadi pilihan utama karena  cara  penyajian  pesan  yang  ingin disampaikan  kepada  lingkungannya  menjadi daya  tarik  pengguna.  Pengenalan  Lingkungan Kampus  Shanti  Bhuana  menjadi  pilihan  yang akan  dibahas  pada  penelitian  ini.  Permasalahan utama adalah bagaimana menampilkan visualisasi  lingkungan  kampus  agar  dikenal secara virtual kepada pengunjung atau
pengguna/user  dengan  rancangan  teknologi berbasis  web  menggunakan  WebVR  dapat tersampaikan  dengan  mudah  dipahami  dan  juga interaktif.  Penelitian  ini  mengambil  studi  kasus gedung  yang  terdapat  dilingkungan  kampus Shanti  Bhuana  Bengkayang.  Tujuan  penelitian adalah  agar  dapat  menghasilkan  visualisasi pengenalan  kampus  berbasis  teknologi  web virtual dengan hasil/output website untuk gedung kampus  serta  tampilan  tata  ruang  secara  imersif dan informasi yang dinamis.
Beberapa perguruan tinggi sudah menerapkan  inovasi  teknologi,  untuk  mengajak calon  mahasiswa  bisa  bergabung  dengan perguruan tinggi pilihan, misalnya yang dilakukan  oleh  Universitas  Islam  Majapahit daerah  Mojokerto  mempromosikan  kampusnya secara  konvensional  atau  virtual  menerapkan teknologi  WebVR  sehingga  calon  mahasiswa atau  masyarakat  umum  dapat  mengetahui  dan
berkunjung melalui virtual [1], [2], [3].
Persiapan yang tepat dengan
memanfaatkan peran Teknologi Website menggunakan  WebVR.  WebVR  adalah  Website Virtual  Reality  yang  membuat  pengguna  dapat berinteraksi melalui lingkungan yang ada dalam internet  (dunia  maya)  yang  telah  di  simulasikan oleh  komputer,  sehingga  pengguna  sedang merasakan  berada  dalam  dunia  virtual  [4],  [5], [6], [7], [8].
Perguruan  tinggi  adalah  tempat  yang disediakan sebagai penelitian dan perkembangan dalam  membentuk  manusia  yang  berwawasan untuk  menghasilkan  generasi  penerus  yang memiliki  kepribadian  dan  kompetensi  keilmuan yang sesuai dengan bidangnya. Sekarang ini, jika seseorang  memilih  untuk  melanjutkan  jenjang pendidikan  pada  Perguruan  Tinggi  maka  orang tersebut  meraih  pendidikan  tinggi  atau  investasi di bidang pendidikan [9], [10].
Pengenalan  atau  promosi  kampus  untuk mahasiswa  baru  merupakan  hal  yang  menarik karena  mampu  menumbuhkan  inovasi  dan kreatifitas  dalam  menyampaikan  informasi tentang keunggulan dan potensi setiap Perguruan Tinggi. Pengertian promosi sendiri menurut para ahli  adalah  suatu  upaya  atau  kegiatan  suatu perusahaan dalam mempengaruhi konsumen agar mereka  mau  melakukan  pembelian  terhadap produk yang ditawarkan, bisa sekarang dan bisa dimasa  yang  akan  datang.  Kemauan  mahasiswa baru  terhadap  perguruan  tinggi  tergantung  pada kualitas  perguruan  tinggi  itu  sendiri  yang  harus menjaga  dan  meningkatkan  kualitas  pendidikan dan mampu menciptakan daya tarik [10], [11].
Virtual Reality adalah visualisasi gambar tiga dimensi yang dibuat komputer hingga terlihat nyata  dengan  bantuan  sejumlah  peralatan tertentu,  yang  membuat  pengguna  seolah-olah terlibat  langsung  virtual  secara  fisik.  Virtual reality  membutuhkan  perangkat  yang  dirancang untuk  tujuan  tertentu  dalam  teknologi  ini, sehingga  pengguna merasakan  sedang  berada  di dunia maya [12], [13], [14], [15].
Hasil  penelitian  terdahulu  menyimpul- kan  Aplikasi  VR  pada  mobile  dapat  membantu dalam memberikan informasi gambaran gedung,
ruangan dan fasilitas berdasarkan aspek rekayasa perangkat  lunak  dan  komunikasi  visual  masing- masing  sebesar  51%  dan  48  %.  Dalam penanganan konten informasi yang dibuat secara dinamis dengan bantuan alat sensor ( gyroscope ) untuk  pergerakan  VR  yang  hasil  outputnya adalah teks dan gambar [4].
Pada masa pandemi ini untuk melakukan promosi  kampus  secara  konvensional  sangatlah sulit,  maka  atas  bantuan  promosi  secara  virtual dibangun sebuah aplikasi WebVR sebagai sarana dalam  mendukung  untuk  membantu  pada kegiatan  pengenalan  kampus  Universitas  Islam Majapahit dengan menerapkan teknologi WebVR. Ditinjau dari hasil kuesioner pengujian hasil aspek interface mendapatkan nilai tertinggi yaitu  85.00%  dan  uji  aspek  visualisasi mendapatkan  hasil  80.00  &  lalu  aspek  umum sebesar 80.00% [1].
Penelitian  berikutnya  juga  menerapkan Pengembangan tour virtual berbasis 3D menggunakan  3Dvista  yang  hasilnya  diterapkan di  3  gedung.  Penampilan  hasil  analisis menggunakan  tools  Jmeter,  dengan  parameter 1000  jumlah  user.  Penelitian  ini  dilakukan dengan  tujuan  untuk  menarik  calon  mahasiswa [16] .
Visualisasi  Teknologi  AR  berbasis  web dalam mengenal kerajinan tangan tradisional dan cara  pembuatannya  juga  di  implementasikan dalam  penelitian  ini  dengan  menggunakan Teknologi  Augemented  Reality  (AR)  yang merupakan bagian dari Teknologi WebVR. Hasil yang  didapatkan  dalam  pengujian  menunjukan aplikasi  berjalan  dengan  baik  dengan  metode pemindaian vertikal maupun horisontal, dan hasil pengujian menggunakan usability test melibatkan 27  responden,  menunjukkan  sebanyak  91,53% responden setuju bahwa aplikasi mudah digunakan [17].
Tujuan  penelitian  ini  adalah  agar  dapat menghasilkan  visualisasi  pengenalan  kampus berbasis teknologi web virtual dengan hasil/output website untuk gedung kampus serta tampilan tata ruang secara imersif dan informasi yang  dinamis.  Penelitian  diawali  dengan melakukan  tahap  Pemodelan  3D  menggunakan
bantuan  tools  photoshop,  marzipano,  3DVista (foto,  sketsa  dan  Objek  3D  terhadap  salah  satu gedung kampus. Gedung kampus yang digunakan terdapat  Gedung  Rektorat.  Gedung  perkuliahan, gedung  Auditorium.  Kemudian  pengembangan sistem  di  lakukan  data  gedung  dan  ruangan disimpan  kedalam  database  dan  pengkodingan menggunakan bahasa pemrograman PHP, evaluasi  sistem  yang  belum  layak  digunakan kemudian dilanjutkan ke hasil.

## 2. METODE PENELITIAN
Berikut adalah tahapan metode penelitian
1. Mendeskripsi ruang lingkup masalah dengan menentukan  ruang  lingkup  yang  akan diteliti;  dengan  mencari  data  untuk  di analisis menentukan tahapan proses
penelitian melalui pencarian data penelitian seperti  data  gedung  dan  data  ruangan  yang terdapat  pada  Kampus.  sehingga  data gedung  dan  ruangan  digunakan  sebagai objek penelitian untuk menghasilkan
informasi.
Tabel 1. Data Objek (tata letak kampus)
No Nama Gedung Nama Ruangan 1 Gedung Rektorat Ruang Perpustakaan 2 Gedung Auditorium Microteaching 3 Gedung Perkuliahan Lab Komputer 4 Gedung Kapel Lab Bahasa 5 Gedung Asrama Wisma Maria Ruang Dosen 6 Gedung Asrama Wisma Yosef Ruang kelas 7 Gedung Asrama Wisma Maria Ruang Alat Peraga PGSD 8 Gedung Refter
9 Lapangan Futsal
Galeri Investasi
10 Lapangan Badminton Kantin
2. Mempelajari  studi  literatur  dengan  mencari literatur yag berkaitan dengan permasalahan yang  diangkat  sebagai  bahan  penelitian. Membaca  jurnal,  mengumpulkan  bahan referensi
3. Observasi melakukan penelitian langsung di Kampus Institut Shanti Bhuana yang terletak
pada  Kabupaten  Bengkayang,  Kalimantan Barat.
4. Analisis  dan  Perancangan  digambarkan dengan diagram Usecase dan membuat alur pengembangan  sistem.  Dapat  di  lihat  pada gambar 1 dan gambar 2 sebagai berikut:
a. Diagram Usecase
Gambar 1. Use Case Sistem
Terdapat  dua  aktor  atau  user  yaitu  pengunjung dan  pengembang,  pengunjung  dapat  melakukan kunjungan atau menjalankan sistem, memvisualisasikan sistem dengan melihat gedung,  ruang/fasilitas  kampus,  setelah  itu pengunjung  dapat  melihat  info  sistem  dan keluar/logout.

## b. Diagram Alur pengembangan sistem
Model  alur  Penelitian  dirancang  untuk menjelaskan mengenai tahapan penelitian.
Gambar 2. Diagram Alur Pengembangan Sistem
Alur penelitian diawali dengan melakukan  tahap  Pemodelan  3D  terhadap  salah satu  gedung  kampus.  Gedung  kampus  yang digunakan  terdapat  Gedung  Rektorat.  Gedung perkuliahan,  gedung  Auditorium.  Kemudian pengembangan  sistem,  evaluasi  sistem  yang belum layak digunakan kemudian dilanjutkan ke hasil.  Diagram  yang  berisi  alur  penelitian  dapat dilihat pada gambar 2.

## 3. HASIL DAN PEMBAHASAN
Melalui  tahapan  alur  pengembangan sistem  maka  di  jelaskan  tahapannya  sebagai berikut:
3.1 Pembuatan Produk (Pemodelan 3D) 1. Konsep Menganalisis perancangan visualisasi
pengenalan  kampus  berbasis  teknologi  web virtual  dengan  hasil  output  website  untuk menampilkan  gedung  kampus  dan  lingkungan kampus  secara  imersif  dan  informasi  yang dinamis.

## 2. Design
Dalam  tahapan design dirancang storyboard untuk  digunakan  dalam  menggambar  alur perancangan desain tampilan dan deskripsi setiap gambar.  Design storyboard ini  untuk  dijadikan acuan  dalam  proses  pembuatan  project  terdapat pada tabel 1 berikut:
Tabel 2. Storyboard Gambar Ket Area depan depan kapel dan gedung auditorium Lingkungan kampus tampak depan gedung Auditorium depan gedung rektorat dan samping auditorium
tampak depan Gedung Auditorim Ruang Refter Lingkungan kampus tampak depan Gedung Refter 3. Material Collecting Tahap material  collecting merupakan tahap pengumpulan bahan atau elemen kebutuhan yang akan dikerjakan. Bahan yang di kumpulkan  adalah  teks,  gambar  dan  gambar- gambar  pendukung  lain  yang  di  jelaskan  dalam tabel berikut:
Tabel 3. Material Collecting
Gambar Keterangan Depan I Sebelum masuk
lingkungan kampus
Lingkungan Kampus Lingkungan Kampus Gedung Auditorium Depan sebelum masuk gedung rektorat Depan Rektortat Ruang Refter Gedung Refter

## 3.2 Pembuatan compositing dan final Render (Pemodelan 3D)
Tahapan  ini  untuk  menggabungkan semua  hasil  objek/gambar  menjadi  gambar panaroma menggunakan software Adobe photoshop CS. Berikut adalah tahapannya:
1. Tahap Penggabungan frame Gambar 3. Tahapan penggabungan gambar 2. Assembly
Tahap assembly merupakan  pembuatan seluruh  objek  atau  bahan  multimedia  dibuat, menggunakan  secara  animasi  didasarkan  pada tahap design .  Pada  tahap  ini  dilakukan  dengan pembuatan  gambar  dan  video.  Berikut  adalah tahapan pembuatannya:
Gambar 4. Tahap Assembly
3. Hasil Final Render
Hasil  final  render  berupa  visualisasi video  virtual  reality  yang  dapat  dijalankan melalui smartphone dan laptop.
Gambar 5. Hasil Final Render

## 3.3 Tahap pengembangan
Hasil  final  render  pada  gambar  3. Merupakan  Tahapan  penggabungan  gambar diatas  selanjutnya  digunakan  untuk  diinput kedalam software Marzipano, dibawah ini:
Gambar 6. Software Marzipano [19]
Software Marzipano berfungsi sebagai penghubung/memanggil ke dalam pengcodingan yang  kodenya  dapat  digunakan  untuk  bisa diekspor  ke  dalam  bahasa  pemrograman  php sehingga bisa terimplementasi berbasis website.[19][20] Kemudian data hasil 3D di input kedalam database

## 3.4 Implementasi Sistem
Berikut  adalalah  tampilan  interface pengunjung tampilan halaman utama yang dilihat user  pertama  kali  ketika  mengakses  halaman web, halaman ini merupakan hasil tampilan dari sistem  marzipano  dan  database  yang  berisi storyboard atau pemodelan 3D
Gambar 7. Halaman utama sistem
Dengan  menekan  tombol  play  yang  ada  di halaman.  Halaman  ini  menampilkan  visualisasi lingkungan  gedung  kampus.berikut  adalah tampilannya,  user  dapat  menggunakan  kursur yang  tersedia  pada  layar/halaman  sistem  untuk menjalankan visualisasi. Tahapan ini menggunakan bantual tools 3D Vista
Gambar 8. Tampilan Virtual Reality sistem

## 4. KESIMPULAN
Kesimpulan  berikut  dibuat  berdasarkan pengamatan proses selama perancangan, analisis dan implementasi sehingga menghasilkan: 1. Aplikasi WebVR pengenalan Kampus menggunakan berbagai bantuan tools sebagai alat  pembantu  dalam  membangun  teknologi Web Virtual.
2. Teknologi  Web  Virtual  tersebut  dapat menampilkan informasi berupa format object, gambar dan video.
3. Teknologi  web  virtual  dapat  memberikan informasi terkait lingkungan, gedung kampus.
4. Masih  banyak  kekurangan  dalam  penelitian ini,  terutama  pada  kebutuhan  sistem  sangat memerlukan  software  dan  hadware  tingkat tinggi  dan  juga  dalam  persiapan  keuntuk penelitian  selanjutnya  dapat  dikembangkan agar dalam pendistribusian visualisasi pengenalan  kampus  berbasis  WebVR  dapat digunakan dan dikembangkan dalam kegiatan promosi  sehingga  selanjutnya  dapat  di  jadi bahan evaluasi kedepan.

## 5. REFERENSI
[1] A.  Y.  Santoso,  1,  R.  M.  Akbar,  2,  and Yanuarini Nur Sukmaningtyas, “PENERAPAN  TEKNOLOGI  WEBVR
UNTUK  PENGENALAN  KAMPUS,”
(Jurnal  Ilm.  Teknol.  Inf.  dan  Sains) ,  vol.
2, 2022.
[2] T. F. Prasetyo, A. Bastian, and H. Sujadi, “Optimalisasi Penerapan Teknologi Virtual Reality Tour Kampus Universitas Majalengka Menggunakan Metode
Multimedia  Development  Life  Cycle,”
INFOTECH  J. ,  vol.  7,  pp.  15–28,  2021, doi: 10.31949/infotech.v7i2.1313.
[3] I.  C.  Wulandari,  D.T.,  &  Sayekti,
“Pengembangan  Virtual  reality  dalam Upaya Meningkatkan Kesiapan Mahasiswa untuk Menghadapi Pengenalan  Lapangan  Persekolahan,” J.
basicedu ,  vol.  6,  no.  4,  pp.  5877–5889, 2022.
[4] H. T. T. Saurik, D. D. Purwanto, and J. I.
Hadikusuma,  “Teknologi  Virtual  Reality untuk  Media  Informasi  Kampus,” J. Teknol. Inf. dan Ilmu Komput. , vol. 6, no. 1, p. 71, 2019, doi: 10.25126/jtiik.2019611238. [5] I.  Rizaldy,  I.  Agustina,  and  F.  Fauziah, “Implementasi  Virtual  Reality  Pada  Tur Virtual Monumen Nasional
Menggunakan  Unity  3D  Algoritma Greedy  Berbasis  Android,” JOINTECS
(Journal  Inf.  Technol.  Comput.  Sci. ,  vol. 3, no. 2, 2018, doi: 10.31328/jointecs.v3i2.786.
[6] J.  Hui,  Y.  Zhou,  M.  Oubibi,  W.  Di,  L. Zhang,  and  S.  Zhang,  “Research  on  Art Teaching  Practice  Supported  by  Virtual Reality  (VR)  Technology  in  the  Primary Schools,” Sustain. ,  vol.  14,  no.  3,  2022, doi: 10.3390/su14031246.
[7] M.  A.  Rojas-Sánchez,  P.  R.  Palos-
Sánchez,  and  J.  A.  Folgado-Fernández, Systematic literature review and bibliometric  analysis  on  virtual  reality and education , no. 0123456789. Springer US, 2022.
[8] K.  S.  C.  Xiong,  Chuyi,  “The  effect  of virtual  reality  on  the  marketing  of residential property,” 2022, doi:
https://doi.org/10.1080/02673037.2022.2
074971. [9] S. Dharmawansyah, H. Cangara, and M. I. Sultan, “MAHASISWA PADA POLITEKNIK NEGERI MEDIA KREATIF,” vol. 3, no. 4, 2014.
[10] W.  Feriyan,  S.  Selatan,  and  S.  Selatan, “Promosi  dan  pengaruhnya  terhadap terhadap  animo  calon  mahasiswa  baru dalam memilih perguruan tinggi swasta,” vol. 16, no. 1, pp. 21–27, 2018.
[11] H. Yenni, “Pengenalan Model Perumahan
Menggunakan Metode Polygonal
Modeling  Dengan  Teknik  Extrude  Face Berbasis Virtual Reality,” JATISI (Jurnal Tek.  Inform.  dan  Sist.  Informasi) ,  vol.  9, no. 2, pp. 864–875, 2022, doi:
10.35957/jatisi.v9i2.1518.
[12] E. Rodríguez et al. , “We are IntechOpen , the  world  ’  s  leading  publisher  of  Open
Access  books  Built  by  scientists  ,  for scientists TOP 1 %,” Intech ,  vol. 32,  no. tourism, pp. 137–144.
[13] Š.  Korečko,  M.  Va’a,  and  M.  Fekete, “VISUALIZATION
of
EXPERIMENTAL  DATA  in  WEB-
BASED  VIRTUAL  REALITY,” CEUR
Workshop Proc. , vol. 3041, pp. 149–152, 2021, doi: 10.54546/mlit.2021.42.97.001.
[14] A.  S.  Yudhanto,  Yudho, Panduan Aplikasi VIRTUAL  REALITY (VR) .
Jakarta:  PT  Elex  Media  Komputindo, 2022.
[15] T.  Morimoto et  al. ,  “XR  (Extended Reality:  Virtual  Reality,  Augmented
Reality,  Mixed  Reality)  Technology  in Spine  Medicine:  Status  Quo  and  Quo Vadis,” J. Clin. Med. , vol. 11, no. 2, 2022, doi: 10.3390/jcm11020470.
[16] D.  Perdana,  A.  Irawan,  and  R.  Munadi, “Implementation of a Web Based Campus Virtual  Tour  for  Introducing  Telkom
University  Building,” Int.  J.  Simul.  Syst. Sci.  Technol. ,  pp.  6–11,  2020,  doi: 10.5013/ijssst.a.20.01.06.
[17] A.  Wibisono  and  T.  Indriari  Wardhani,
“Desain Virtual Tour Bangunan Bersejarah  Lawang  Sewu  Semarang Menggunakan Aplikasi Augmented Reality  Berbasis  Web  (Webar),” Jurnal Ilmiah Teknosains , vol. 6, no. 2/Nov. pp. 39–50, 2020, doi: 10.26877/jitek.v6i2/nov.7100.
[18] C.  O.  Alfa,  “Optimalisasi  Peranan Teknologi  Informasi  untuk  Sosialisasi Kampus  sebagai  media Promosi di  Masa Pandemi,” 2022.
[19] “MARZIPANO TOOL.” [Online].
Available:
https://www.marzipano.net/tool/.
[20] L. Siddiqui, “What is Marzipano? | Here is a Complete Guide,” tiiny.host , 2021.