penerapan teknologi augmented reality untuk katalog...

27
Penerapan Teknologi Augmented Reality untuk Katalog Pakaian Berbasis Web Artikel Ilmiah Peneliti: Lucia Santoso (672008007) T. Arie Setiawan Prasida, S.T., M.Cs. Ramos Somya, S.Kom., M.Cs. Program Studi Teknik Informatika Fakultas Teknologi Informasi Universitas Kristen Satya Wacana Salatiga 2015

Upload: lelien

Post on 08-Mar-2019

219 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak

Penerapan Teknologi Augmented Reality untuk Katalog

Pakaian Berbasis Web

Artikel Ilmiah

Peneliti:

Lucia Santoso (672008007)

T. Arie Setiawan Prasida, S.T., M.Cs.

Ramos Somya, S.Kom., M.Cs.

Program Studi Teknik Informatika

Fakultas Teknologi Informasi

Universitas Kristen Satya Wacana

Salatiga

2015

Page 2: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak

Penerapan Teknologi Augmented Reality untuk Katalog

Pakaian Berbasis Web

Artikel Ilmiah

Peneliti:

Lucia Santoso (672008007)

T. Arie Setiawan Prasida, S.T., M.Cs.

Ramos Somya, S.Kom., M.Cs.

Program Studi Teknik Informatika

Fakultas Teknologi Informasi

Universitas Kristen Satya Wacana

Salatiga

2015

Page 3: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak
Page 4: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak
Page 5: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak
Page 6: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak
Page 7: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak
Page 8: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak

Penerapan Teknologi Augmented Reality untuk Katalog

Pakaian Berbasis Web

1Lucia Santoso, 2T. Arie Setiawan Prasida, 3Ramos Somya

Fakultas Teknologi Informasi Program Studi Teknik Informatika

Universitas Kristen Satya Wacana

Jl. Diponegoro 52-60, Salatiga 50711, Indonesia

[email protected], [email protected], [email protected]

Abstract In the business world, the competition among companies is getting tighterand tighter.

It causes each company has to creates many more innovative marketing strategies.

Companies have to elevate their facilities and service qualities in order to meet the

customers’ hospitality because of the competition. In order to achive that,customer trust must

increased. The complicated of determining item that match with customer’s colour skin and

body shape, so could give extra confident. With augmented reality technology, customers can

feel a new, unique and interesting experience in shopping. Online shopping with augmented

reality makes the customers can wear clothes they want to buy so they can see if it fits for

them or not. The experience with augmented reality can push customers to buy more things in

online shopping. The result of augmented reality technology on online shop website could be

used as promotion tool and availability of augmented reality technology on online shop,

customers buying rate could be increased. Keywords : Online shopping, 3D, augmented reality, User experience.

Abstrak

Persaingan dalam dunia bisnis yang semakin ketat menyebabkan perusahaan harus

berlomba-lomba menciptakan strategi penjualan yang inovatif. Para pebisnis online (online

shopping) harus selalu meningkatkan fasilitas dan kualitas pelayanan agar dapat memuaskan

para konsumen karena ketatnya persaingan antar sesama pebisnis online. Dengan teknologi

augmented reality konsumen dapat merasakan pengalaman yang baru, unik dan menarik

dalam kegiatan belanja. Online shopping dengan augmented reality membuat konsumen

dapat mencoba apakah pakaian yang dibeli cocok atau tidak. Pengalaman yang dirasakan

konsumen ketika terlibat dalam suatu interaksi seperti augmented reality dapat mendorong

keinginan membeli yang lebih besar.

Kata kunci : Online Shop, augmented reality, pengalaman pengguna.

1 Mahasiswa Fakultas Teknologi Informasi Program Studi Teknik Informatika, Universitas Kristen

Satya Wacana 2 Staff Pengajar Fakultas Teknologi Informasi, Universitas Kristen Satya Wacana 3 Staff Pengajar Fakultas Teknologi Informasi, Universitas Kristen Satya Wacana

Page 9: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak

1

1. Pendahuluan

Persaingan dalam dunia bisnis yang semakin ketat menyebabkan

perusahaan harus berlomba-lomba menciptakan strategi penjualan yang

inovatif. Pengadaptasian teknologi dalam dunia bisnis menjadi salah satu

solusi menarik bagi para pelaku bisnis. Dengan perkembangan teknologi

informasi dan teknologi komunikasi yang pesat menyebabkan pergeseran

aktifitas dunia perdagangan (commerce). Melalui internet, para pelaku dunia

bisnis dapat menawarkan produknya secara online kepada konsumen tanpa

perlu bertatap muka.

E-commerce (perdagangan melalui internet) mengizinkan pedagang

untuk menjual produk-produk dan jasa secara online. Konsumen dapat

menemukan website pedagang, membaca, melihat produk, dan memesannya

secara online [1]. Para pebisnis online (online shopping) harus selalu

meningkatkan fasilitas dan kualitas pelayanan agar dapat memuaskan para

konsumen karena ketatnya persaingan antar sesama pebisnis online. Dalam

mencapai tujuan tersebut tentu akan menghadapi permasalahan karena harus

mendapatkan kepercayaan konsumen terlebih dahulu. Sulitnya menentukan

pilihan seperti apakah barang yang dipilih cocok secara warna kulit dan

perpaduan antar pakaian membuat konsumen tidak dapat memberikan

kepercayaan penuh [2]. Berawal dari hal tersebut, timbul pemikiran-pemikiran

baru untuk menarik kepercayaan dan minat konsumen, yaitu dengan cara

menampilkan gambaran dari katalog-katalog online shop agar tampak lebih

nyata.

Augmented Reality merupakan teknologi yang menggabungkan benda

maya dua dimensi dan atau tiga dimensi ke dalam sebuah lingkungan nyata

tiga dimensi kemudian memproyeksikan benda-benda maya tersebut secara

real time [3]. Benda-benda maya menampilkan informasi yang tidak dapat

diterima oleh konsumen dengan inderanya. Hal ini membuat AR sesuai

sebagai alat untuk membantu persepsi konsumen. Informasi tentang objek

dapat ditambahkan ke dalam sistem AR yang kemudian informasi tersebut

ditampilkan di atas layar dunia nyata secara real-time seolah-olah informasi

tersebut adalah nyata. Sehingga konsumen mendapatkan gambaran visual

barang yang ditawarkan seperti melihat pada cermin. Berdasarkan latar

belakang masalah tersebut maka dilakukan penelitian untuk

mengimplementasikan teknologi augmented reality kedalam sebuah online

shopping. Dengan adanya aplikasi ini diharapkan pembeli mendapatkan

gambaran visual yang ditawarkan oleh online shopping sehingga

meningkatkan minat pembeli untuk membeli produk yang ditawarkan.

Page 10: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak

2

2. Tinjauan Pustaka

Penelitian terdahulu berjudul Perancangan Sistem Informasi Penjualan

Baju Batik Berbasis Web (Online Shop) pada CV. Selaras Batik.

Permasalahan yang ada pada penelitian tersebut adalah industri pakaian batik

yang masih melakukan promosi dan penjualan secara konvensional dalam

bentuk promosi dari mulut ke mulut dan menggunakan media brosur,

sehingga jangkauan promosi dan penjualan masih terbatas dan belum bisa

meluas ke beberapa daerah yang menyebabkan produk kurang dikenal oleh

masyarakat luas. Kendala lain yang di alami oleh industri pakaian batik adalah

ketatnya persaingan antar sesama industri pakaian batik mulai dari industri

kecil sampai industri besar, hal itu membuat pengelola industri pakaian batik

harus memiliki strategi pemasaran yang berbeda [4].

Penelitian selanjutnya berjudul Aplikasi Augmented Reality untuk

Katalog Penjualan Rumah. Dengan memanfaatkan teknologi augmented

reality, maket atau miniatur rumah yang biasanya digunakan untuk memberi

contoh rumah sebenarnya dapat digantikan dengan model rumah 3D yang

ditampilkan secara virtual. Pembeli tidak hanya dapat melihat bagian dalam

rumah dengan detail, tetapi lingkungan disekitar rumah juga akan terasa lebih

hidup dengan adanya animasi pendukung seperti mobil yang melintas,

burung-burung terbang dan lain sebagainya sehingga dapat membantu para

pembeli untuk mengetahui dengan baik rumah yang akan dibeli [5].

Penelitian yang dilakukan adalah menggabungkan kedua penelitian

tersebut. Dengan memanfaatkan teknologi augmented reality untuk membuat

katalog pakaian online shop, akan menambah pengalaman baru dan membuat

konsumen lebih tertarik dengan barang yang dijual. Teknologi augmented

reality dapat memberikan model pakaian 3D secara virtual. Website online

shop yang dibangun menggunakan teknologi augmented reality dengan

library NyARToolkit yang berfungsi untuk memberi pengalaman baru dalam

berbelanja online.

Online shopping atau lebih dikenal dengan e-commerce adalah

kegiatan-kegiatan bisnis yang menyangkut konsumen (consumen),

manufaktur (manufactures), service provider dan perdagangan perantara

(intermediaries), dengan menggunakan jaringan komputer (computer

network) yaitu internet. Dengan kata lain e-commerce adalah tipe industri

dimana penjual dan pembeli melakukan interaksi melalui sistem internet atau

jaringan komputer lainnya [6]. Salah satu keuntungan dari e-commerce adalah

jangkauan pemasaran menjadi luas dan tidak terbatas oleh area geografis.

Selain itu, konsumen tetap bisa memenuhi kebutuhannya walaupun tidak

punya waktu untuk datang langsung ke toko. Ketika seorang konsumen

berbelanja online, terdapat beberapa hal yang dapat menjadi pertimbangan,

Page 11: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak

3

yaitu faktor kepercayaan, faktor kemudahan, faktor tampilan dan faktor

kualitas informasi [7]. Oleh karena itu online shop yang dibangun harus

memiliki faktor-faktor tersebut.

Augmentasi Reality merupakan teknologi yang menggabungkan benda

maya kedalam sebuah lingkungan nyata. Teknologi augmented reality

membantu menyampaikan informasi yang biasanya tidak bisa diterima oleh

pengguna dengan inderanya. Informasi yang disampaikan akan

direpresentasikan menjadi objek tiga dimensi (3D) atau dua dimensi (2D).

Untuk menampilkan objek, dibutuhkan marker yaitu sebuah penanda yang di

dalamnya terdiri dari kumpulan titik acuan untuk memudahkan komputasi

dari pengukuran parameter-parameter [5].

Sistem dari teknologi augmented reality ini memerlukan video

streaming yang diambil dari kamera sebagai sumber masukan, kemudian

sistem akan melacak dan mendeteksi marker dengan menggunakan sistem

tracking. Setelah marker terdeteksi, maka model 3D akan digambarkan di atas

marker seolah-olah nyata. Alur proses kerja augmented reality dapat dilihat

pada Gambar 1.

Gambar 1 Alur Kerja Augmented Reality [8]

3. Metode Penelitian

Penelitian yang dilakukan, diselesaikan melalui tahapan penelitian

yang terbagi dalam empat tahapan, yaitu: (1) Analisis permasalahan dan

pengumpulan data, (2) Perancangan sistem, (3) Implementasi dan pengujian

sistem, serta analisis hasil pengujian, (4) Penulisan laporan hasil penelitian.

Page 12: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak

4

Gambar 2 Tahapan Penelitian [9]

Tahapan penelitian pada Gambar 2, dapat dijelaskan sebagai berikut.

Tahap pertama: analisis permasalahan dan pengumpulan data, yaitu

melakukan penetapan permasalahan yaitu pernyataan yang bersifat umum

terhadap permasalahan yang akan diamati. Misalnya bagaimana mengatasi

kekecewaan konsumen saat membeli pakaian online. Langkah selanjutnya

mengumpulkan informasi yang berkaitan dengan permasalahan baik berupa

artikel, majalah jurnal dan situs internet. Data yang didapat dimanfaatkan

untuk mengembangkan penelitian untuk mengatasi permasalahan yang terkait.

Tahap kedua, perancangan sistem yang meliputi metode perancangan

sistem menggunakan metode prototype dapat dilihat pada Gambar 3.

Pendekatan prototype melewati tiga proses, yaitu pengumpulan kebutuhan,

perancangan, dan evaluasi prototype. Tahap awal dari metode ini adalah

pengumpulan kebutuhan yang dilakukan dengan berinteraksi dengan

konsumen untuk menentukan tujuan umum dan gambaran bagian-bagian yang

akan dibutuhkan berikutnya. Perancangan dilakukan dengan cepat dan

mewakili semua aspek sistem yang diketahui dan rancangan ini menjadi dasar

pembuatan prototype. Evaluasi prototype merupakan tahap pengujian aplikasi

yang telah selesai dibuat. Pengujian ini berfungsi untuk memperjelas

kebutuhan software. Perulangan ketiga proses ini terus berlangsung hingga

semua kebutuhan terpenuhi.

Perancangan Sistem meliputi Metode Perancangan

Sistem (Metode Prototype), Perancangan Proses (UML),

Perancangan Antarmuka, Perancangan Marker

Perancangan Antarmuka

Analisis Permasalahan dan Pengumpulan Data

Implementasi dan Pengujian Sistem,

serta Analisis Hasil Pengujian

Penulisan Laporan Hasil Penelitian

Page 13: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak

5

Gambar 3 Metode Prototype [10]

Pada prototype pertama, aplikasi online shop memiliki empat menu

utama yaitu home, produk, cara pesan dan login. Halaman home berisi kata

sambutan dan pengenalan online shop kepada konsumen. Halaman produk

berisi gambar-gambar pakaian yang ditawarkan, konsumen dapat melihat

keterangan barang dengan menekan link detail. Pada halaman keterangan

terdapat marker yang digunakan untuk pada aplikasi AR. Halaman cara pesan

berisi penjelasan tentang tata cara untuk melakukan pemesanan. Dan yang

terakhir halaman login, pada halaman ini konsumen dapat memasukan

username dan password bila sudah terdaftar menjadi member, jika belum

terdaftar konsumen baru dapat memdaftarkan diri melalui link daftar. Setelah

diamati dan dilakukan pengujian hasil yang diperoleh dari pembuatan

prototype pertama adalah: (1) Tampilan dan informasi barang yang diberikan

sudah cukup lengkap; (2) Objek 3D sudah dapat ditampilkan dengan baik

pada saat marker tersorot kamera. Kekurangan yang ditemukan pada saat

pengujian aplikasi adalah: (1) Marker yang digunakan terlalu banyak,

sehingga menyusahkan konsumen jika ingin mencoba aplikasi AR untuk

beberapa pakaian; (2) Diperlukan fungsi ambil gambar, agar konsumen dapat

memilih dan membandingkan pakaian-pakaian yang telah dicoba melalui

aplikasi AR.

Pada prototype kedua, dilakukan perbaikan sesuai dengan kekurangan

yang didapat dari pengujian prototype pertama. Perbaikan yang dilakukan

adalah: (1) Menggunakan satu marker untuk semua objek 3D, marker

diletakan pada halaman panduan; (2) Penambahan fungsi ambil gambar pada

aplikasi AR. Kekurangan yang ditemukan pada pengujian prototype kedua ini

adalah sulitnya melakukan proses ambil gambar karena aplikasi AR

membutuhkan jarak yang cukup jauh.

Prototype ketiga, dilakukan perbaikan sesuai dengan kekurangan yang

didapat dari pengujian prototype kedua. Pada prototype ketiga ini, aplikasi

online shop sudah memenuhi kebutuhan dari pengguna. Hasil dari prototype

ketiga adalah penambahan waktu pada fungsi ambil gambar, sehingga

konsumen dapat menyesuaikan letak marker sebelum terfoto.

Page 14: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak

6

Model perancangan sistem menggunakan diagram Unified Modelling

Language (UML). Use case merepresentasikan sebuah interaksi antara aktor

dengan sistem. Use case diagram menjelaskan dan menerangkan kebutuhan

yang diinginkan aktor, serta sangat berguna dalam menentukan struktur

organisasi dan model dari sebuah sistem. Use case diagram untuk penerapan

augmented reality katalog pakaian online shop dapat dilihat pada Gambar 4.

Gambar 4 Use Case Diagram Sistem

Pada aplikasi ini yang berperan sebagai aktor adalah konsumen dan

admin. Konsumen akan memulai dengan memilih model pakaian pada katalog

produk pada, bila dirasa kurang puas konsumen dapat menekan tombol

“Fitting” pada halaman keterangan, maka sistem akan langsung mengaktifkan

kamera webcam untuk fitting 3D. Pemesanan dapat dilakukan setelah

melakukan proses login, bila belum terdaftar konsumen dapat mendaftarkan

diri dengan mengisi form daftar. Sedangkan aktor admin dapat melakukan

pengaturan produk seperti melihat, menambah, edit dan menghapus produk.

Activity diagram merupakan gambaran aliran proses kerja yang

terdapat dalam sebuah sistem, mulai dari aktifitas start sampai aktifitas

berakhir (end). Activity diagram antara aktor konsumen dengan sistem saat

melakukan pemesanan dapat dilihat pada Gambar 5.

Page 15: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak

7

Gambar 5 Activity Diagram Konsumen saat Melakukan Pemesanan

Pada Gambar 5 menjelaskan aktifitas-aktifitas yang terjadi antara aktor

konsumen dengan sistem pada saat proses pemesanan barang. Setelah

memasukkan username dan password untuk proses login, konsumen dapat

memilih barang yang ada pada halaman produk. Setelah memilih barang maka

sistem akan memasukkan data pesanan ke keranjang dan konsumen dapat

menambah atau mengurangi jumlah pesanan pada halaman keranjang. Untuk

mengakhiri proses pemesanan konsumen dapat menekan button Selesai

Belanja, sehingga data pesanan pada keranjang berubah menjadi data

pembelian dan masuk ke daftar transaksi yang nantinya akan diproses oleh

admin.

Activity diagram antara aktor admin dengan sistem pada proses

pengoperasian web augmented reality online shop dapat dilihat pada Gambar

6.

Page 16: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak

8

Gambar 6 Activity Diagram Admin

Pada Gambar 6 menjelaskan aktifitas-aktifitas yang terjadi antara

aktor admin dengan sistem pada saat proses login. Setelah melakukan

login, terdapat tiga menu yaitu menu data barang, data konsumen dan

daftar transaksi. Menu data barang berisi data-data barang yang

ditampilkan pada halaman produk, admin dapat menambah, mengubah,

dan menghapus data barang. Menu data konsumen berisi data-data pribadi

konsumen, admin dapat melihat atau menghapus data konsumen. Pada

menu daftar transaksi, admin hanya dapat melihat data-data pembelian

yang telah dilakukan konsumen dan melanjutkannya ke proses

pengiriman barang dengan data yang ada pada daftar transaksi.

Activity diagram antara aktor konsumen dengan sistem ketika

proses penggunaan augmented reality online shop berlangsung dapat

dilihat pada Gambar 7.

Page 17: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak

9

Gambar 7 Activity Diagram Antara Aktor atau Konsumen dengan Sistem

ketika Proses Augmented Reality Berlangsung

Pada Gambar 7 menjelaskan aktifitas-aktifitas yang terjadi antara aktor

dengan sistem online shop ketika menjalankan augmented reality. Setelah

tombol fitting ditekan maka sistem akan mengaktifkan webcam. Ketika

webcam aktif dan konsumen mengarahkan webcam kearah marker, maka

sistem akan mendeteksi marker tersebut. Jika marker berstatus aktif maka

sistem akan menampilkan objek 3D pada layar. Proses aktifitas antara aktor

atau konsumen dengan sistem akan berhenti apabila konsumen berhasil

melihat objek 3D pada halaman web.

Class diagram merupakan diagram yang digunakan untuk

menampilkan beberapa kelas yang ada dalam sistem/perangkat lunak yang

sedang dikembangkan. Class diagram memberikan pandangan secara luas

dari suatu sistem dengan menunjukan struktur objek, deskripsi objek, class,

package, dan relasi satu sama lain. Hubungan tersebut tergambar pada

Gambar 8 sebagai berikut:

Page 18: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak

10

Gambar 8 Class Diagram Sistem

Perancangan antarmuka yaitu merancang tampilan antarmuka dari

sistem yang berfungsi sebagai penghubung interaksi antara pengguna dengan

sistem. Sistem yang akan dibangun diharapkan menyediakan interface yang

mudah dipahami dan digunakan oleh user. Rancangan antarmuka form login

pada Gambar 9 untuk user interface login pada konsumen dan admin. Pada

form login ini user akan diminta memasukan username dan password yang

dimiliki untuk mendapatkan hak akses kedalam sistem. Untuk konsumen yang

belum memiliki username dan password dapat mendaftarkan diri melalui link

daftar yang ada dihalaman login.

Gambar 9 Rancangan Antarmuka Halaman Form Login

Halaman data merupakan tampilan utama setelah konsumen

melakukan proses login, pada halaman ini terdapat informasi pribadi

konsumen. Bila ada kesalahan dalam penginputan data, konsumen dapat

Page 19: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak

11

melakukan perubahan melalui link edit data yang membawa konsumen ke

halaman edit data seperti pada Gambar 10.

Gambar 10 Rancangan Antarmuka Halaman Edit Data

Sebelum melakukan transaksi pemesanan, konsumen dapat melihat

gambar-gambar barang di katalog pakaian pada halaman produk. Setelah

memilih pada halaman produk, konsumen akan dibawa ke halaman

keterangan. Pada halaman ini terdapat data-data produk seperti harga, bahan,

dan ukuran. Rancangan antarmuka halaman keterangan dapat dilihat pada

Gambar 11.

Gambar 11 Rancangan Antarmuka Halaman Keterangan

Halaman Fitting merupakan halaman yang ditampilkan ketika

pengguna menekan link fitting pada halaman keterangan. Pada halaman inilah

teknologi augmented reality berlangsung. Kamera webcam akan diaktifkan

dan membaca marker sehingga objek tiga dimensi (3D) dapat ditampilkan.

Rancangan antarmuka halaman fitting pada website online shop ini dapat

dilihat pada Gambar 12.

Page 20: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak

12

Gambar 12 Rancangan Antarmuka halaman fitting

Perancangan desain marker berfungsi sebagai media pelengkap yang

dibutuhkan oleh sistem dalam penggunaan teknologi augmented reality.

Dalam pembuatan marker diperlukan sebuah file gambar dengan format .JPG.

Untuk memenuhi faktor kemudahan pada sebuah online shop maka pada

penelitian ini hanya menggunakan sebuah marker. Dengan marker ini maka

sistem akan mengetahui letak model 3D pakaian akan diletakan. Gambar

marker dapat dilihat pada Gambar 13.

Gambar 13 Desain Gambar Marker

Tahap ketiga, implementasi dan pengujian sistem, serta analisis hasil

pengujian, yaitu mengimplementasikan aplikasi yang sudah dibuat kemudian

dilakukan pengujian, selanjutnya melakukan analisis untuk melihat apakah

aplikasi yang telah dibuat sudah sesuai dengan yang diharapkan atau tidak ada

error, jika belum sesuai maka akan dilakukan perbaikan.

Tahap keempat, penulisan laporan hasil penelitian, yaitu

mendokumentasikan proses penelitian yang sudah dilakukan dari tahap awal

hingga akhir ke dalam tulisan, yang nantinya akan menjadi laporan hasil

penelitian.

Page 21: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak

13

4. Hasil dan Pembahasan

Tahap implementasi menghasilkan sistem online shop yang dilengkapi

dengan teknologi augmented reality yang dapat meningkatkan minat

konsumen untuk membeli produk. Konsumen dapat melihat dan

menggunakan teknologi augmented reality untuk menentukan pilihan sebelum

membeli.

Gambar 14 Antarmuka Halaman Login

Gambar 14 merupakan hasil dari implementasi halaman login.

Halaman login adalah halaman yang berfungsi untuk membatasi akses

terhadap layanan tertentu. Hanya konsumen yang telah terdaftar saja yang

diijinkan mengakses layanan-layanan khusus tersebut.

Halaman data adalah halaman yang berisi data pribadi konsumen, data

inilah yang nantinya digunakan untuk pengiriman barang. Pada halaman ini

terdapat link Edit Data yang menghubungkan ke halaman edit data, halaman

dimana konsumen dapat merubah data pribadinya. Lebih jelasnya dapat dilihat

pada Gambar 15 dan Gambar 16.

Gambar 15 Antarmuka Halaman Data

Page 22: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak

14

Gambar 16 Antarmuka Halaman Edit Data

Hasil dari implementasi halaman keterangan dapat dilihat pada gambar

17. Pada halaman ini terdapat gambar-gambar produk, keterangan produk, link

fitting dan button pesan untuk melakukan transaksi.

Gambar 17 Antarmuka Halaman Keterangan

Ketika konsumen menekan link fitting pada halaman keterangan, maka

sistem akan mengaktifkan kamera webcam dan gambar sorot dari kamera

akan ditampilkan pada halaman website secara real time. Gambar 18

merupakan antarmuka dari halaman fitting.

Page 23: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak

15

Gambar 18 Antarmuka Halaman Fitting dengan objek 3D

Kamera webcam akan memberikan masukan untuk sistem yang dapat

mengenali marker yang telah terdaftar pada sistem. Setelah marker ditemukan

maka sistem akan menggambarkan objek 3D dan menampilkannya pada layar,

sehingga akan terlihat perpaduan antara dunia maya dan dunia nyata pada

layar. Pada halaman fitting terdapat fungsi ambil gambar, penggalan kode

program untuk ambil gambar dapat dilihat pada Kode Program 1.

Kode Program 1 Penggalan Kode Program Ambil Gambar

Halaman barang adalah halaman yang hanya bisa di akses oleh admin.

Melalui halaman ini admin dapat melihat daftar barang, tambah data barang,

edit data barang dan hapus data barang. Hasil dari implementasi halaman

barang dapat dilihat pada Gambar 19 dan halaman tambah barang dapat

dilihat pada Gambar 20.

Gambar 19 Antarmuka Halaman Barang

Page 24: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak

16

Gambar 20 Antarmuka Halaman Tambah Barang

Pengujian sistem dilakukan untuk mengetahui apakah sistem dapat

berjalan dengan baik atau tidak. Selain hal tersebut dapat diketahui pula

tingkat kepuasan pengguna terhadap kinerja sistem, apakah sistem sudah

memenuhi kebutuhan atau tidak. Metode yang digunakan untuk pengujian

sistem augmented reality pada katalog pakaian online shop ini adalah metode

black box testing. Black box testing adalah sebuah metode pengujian

perangkat lunak yang menguji fungsionalitas sebuah aplikasi tanpa melihat

alur eksekusi program, namun cukup dengan memperhatikan apakah setiap

fungsi menghasilkan output yang diinginkan. Hal-hal yang diuji dan hasil

pengujian dapat dilihat pada Tabel 1.

Tabel 1 Hasil Pengujian Blackbox Testing

No Poin Pengujian Data Input /

Kondisi

Hasil Uji Status

1 Halaman Login Username

Password

Sistem akan login sesuai

dengan hak akses tiap

user

Valid

2 Halaman Daftar Username

Password

Nama

Alamat

Kota

Telp

Email

Menambahkan data

konsumen baru kedalam

database

Valid

3 Halaman Data Edit data Data konsumen berubah Valid

4 Halaman

keterangan

Button pesan Menambahkan data

pesanan kedalam

keranjang belanja

Valid

Link fitting Mengaktifkan kamera /

webcam, membaca Valid

Page 25: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak

17

marker dan menampilkan

objek 3D

5 Halaman Fitting Button ambil gambar Foto konsumen dengan

objek 3D disimpan Valid

6 Halaman Keranjang Edit jumlah barang Menambah / mengurangi

jumlah barang yang akan

dipesanan

Valid

Berdasarkan hasil pengujian blackbox pada Tabel 1, maka dapat

disimpulkan bahwa aplikasi sudah berjalan sesuai dengan yang dirancang dan

dapat dilanjutkan ke beta testing untuk mengetahui tingkat kepuasan

pengguna terhadap aplikasi yang dibangun.

Pengujian yang dilakukan berikutnya adalah pengujian beta testing,

pengujian ini dilakukan untuk memperoleh data kualitatif maupun kuantitatif

mengenai tingkat keberhasilan perancangan. Cara yang dapat dilakukan yaitu

dengan menyebar kuesioner ke orang-orang yang sudah pernah melakukan

transaksi online shop. Pengujian dalam bentuk kuesioner ini terdiri dari

sembilan pertanyaan yang disebarkan pada 30 responden. Terdapat lima

kategori untuk jawaban sangat setuju hingga sangat tidak setuju dari setiap

pertanyaan kuesioner. Pilihan kategori jawaban “Sangat Setuju” dari

responden diwakili oleh huruf abjad “A”, kategori jawaban “Setuju” diwakili

huruf abjad “B”, kategori jawaban “Cukup” diwakili oleh huruf abjad “C”,

kategori jawaban “Tidak Setuju” diwakili oleh huruf abjad “D”, dan kategori

jawaban “Sangat Tidak Setuju” diwakili huruf abjad “E”. Tabel 2 merupakan

tabel yang berisi daftar pertanyaan diberikan kepada responden.

Tabel 2 Daftar Pernyataan yang Diajukan Pada Responden pada Saat Melakukan

Beta Testing

No Pernyataan

1 Anda sering belanja secara online.

2 Transaksi pembelian secara online dapat dilakukan dengan mudah.

3 Informasi produk yang di tampilkan dalam online shop ini lengkap.

4 Panduan penggunaan teknologi AR (fitting virtual) pada online shop ini dapat membantu.

5 Online shop dengan teknologi AR (fitting virtual) ini menarik.

6 Teknologi AR (fitting virtual) pada online shop ini membantu anda dalam memilih pakaian

yang cocok.

7 Anda berminat untuk membeli pakaian setelah mencoba teknologi AR (fitting virtual) pada

online shop ini.

8 Online shop dengan teknologi AR ini mudah untuk digunakan.

Hasil jawaban kuesioner dari para konsumen dapat dilihat pada Tabel

3.

Page 26: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak

18

Tabel 3 Hasil Jawaban Kuesioner

Jawaban A B C D E Nilai

Responden

Nilai

Max

Persentase

per Soal Nilai 5 4 3 2 1

Per

ny

ata

an

1 0 4 8 12 6 70 150 46.67%

2 3 12 12 3 0 105 150 70.00%

3 7 18 5 0 0 122 150 81.33%

4 5 16 9 0 0 116 150 77.33%

5 8 18 4 0 0 124 150 82.67%

6 2 15 13 0 0 109 150 72.67%

7 5 9 13 3 0 106 150 70.67%

8 10 17 3 0 0 127 150 84.67%

Jumlah 40 109 67 18 6 Persentase

Keseluruhan

73.25%

Berdasarkan data pada Tabel 3 dapat dilihat bahwa online shop dengan

teknologi augmented reality dapat meningkatkan minat beli konsumen dari

46.67% menjadi 70.67%. Pengalaman yang dirasakan konsumen ketika

terlibat dalam suatu interaksi seperti augmented reality dapat mendorong

keinginan membeli yang lebih besar. Selain itu online shop dengan teknologi

augmented reality memiliki daya tarik sebesar 82.67%, sehingga teknologi

augmented reality dapat menjadi media promosi yang baik. Aplikasi ini juga

mudah digunakan dan dapat membantu konsumen dalam memilih barang.

5. Simpulan

Berdasarkan penelitian yang telah dilakukan, maka kesimpulan yang

diperoleh adalah: 1) Aplikasi ini diciptakan sebagai alat bantu yang dapat

dimanfaatkan oleh para pemilik situs jual beli pakaian online dalam menjual

produknya. 2) Penerapan teknologi augmented reality pada website online

shop dapat dimanfaatkan sebagai media promosi. 3) Dengan adanya teknologi

augmented reality pada online shop, minat beli konsumen dapat ditingkatkan.

Page 27: Penerapan Teknologi Augmented Reality untuk Katalog ...repository.uksw.edu/bitstream/123456789/14975/2/T1_672008007_Full... · membantu menyampaikan informasi yang biasanya tidak

19

6. Pustaka

[1] Winoto, Ragil S. A. 2013. Pembangunan Aplikasi Penjualan Online

pada Toko Jam Tangan AMPM Watch. Seminar Riset Unggulan

Nasional Informatika dan Komputer FTI UNSA.

[2] Irawan, Doddy. 2013. Loooh…. Yang dipesan sama yang Dikirim Kok

Beda Ya?. http://www.teen.co.id/teen-magazine/hits/2952-loooh-yang-

dipesan-sama-yang-dikirim-kok-beda-yaaa.html.

[3] Siswanto, Andhi. 2013. Perancangan Alat Peraga 3D Belajar

Mengenal Macam-Macam Binatang Berbasis Augmented Reality (AR)

di TK ABA 33 Semarang. Universitas Dian Nuswantoro. Semarang.

[4] Ningsih, Yulia. 2014. Perancangan Sistem Informasi Penjualan Baju

Batik Berbasis Web (Online Shopping) pada CV. Selaras Batik.

Skripsi. Program S1 Sistem Informasi Manajemen Sekolah Tinggi

Manajemen dan Ilmu Komputer (STMIK) Raharja. Tangerang.

[5] Gorbala, Bregga Tedy dan Mochamad Hariadi. 2010. Aplikasi

Augmented Reality untuk Katalog Penjualan Rumah. Institut

Teknologi Sepuluh November. Surabaya.

[6] Berkatullah, abdul Halim dan Teguh Prasetyo. 2005. Bisnis E-

Commerce Studi Sistem Keamanan dan Hukum di Indonesia.

Yogyakarta: Pustaka Pelajar.

[7] Hardiawan, Anandya Cahya. 2013. Pengaruh Kepercayaan,

Kemudahan, dan Kualitas Informasi Terhadap Keputusan Pembelian

Secara Online. Skripsi. Program S1 Ekonomi Bisnis Universitas

Diponegoro. Semarang.

[8] Fatih, Muhammad Al. 2012. Membuat Kartu Ucapan Dengan Menggunakan

Teknologi Augmented Reality. Sekolah Tinggi Manajemen Informatika dan

Komputer AMIKOM. Yogyakarta. [9] Hasibuan, Zainal A. 2007. Metodologi Penelitian Pada Bidang Ilmu

Komputer dan Teknologi Informasi : Konsep, Teknik, dan Aplikasi.

Jakarta : Ilmu Komputer Universitas Indonesia.

[10] Pressman, Roger. 1992. Software Engineering A practitioner’s

Approach. Mc-Graw-Hill Inc.