BAB III PERANCANGAN INTERAKSI -...

12
23 BAB III PERANCANGAN INTERAKSI 3.1 Interaksi Pengguna Perancang sistem menghadapi dua masalah penting sebagai berikut. 1. Cara informasi dari pengguna dapat disediakan untuk sistem komputer, misalnya pada saat masukan data. 2. Cara informasi dari sistem komputer ditampilkan untuk pengguna, misalnya hasil dari pemrosesan data . Antarmuka pengguna yang baik harus menyatukan interaksi pengguna dan penyajian informasi. Ada lima tipe utama interaksi untuk interaksi. 1. Direct manipulation atau pengoperasian secara langsung artinya interaksi langsung dengan obyek pada layar. Misalnya delete file dengan memasukkannya ke trash. Contoh: video games. Kelebihan: waktu pembelajaran pengguna sangat singkat, feedback langsung diberikan pada tiap aksi sehingga kesalahan terdeteksi dan diperbaiki dengan cepat. Kekurangan: interface tipe ini rumit dan memerlukan banyak fasilitas pada sistem komputer, cocok untuk penggambaran secara visual untuk satu operasi atau obyek. 2. Menu selection atau pilihan berbentuk menu artinya memilih perintah dari daftar yang disediakan. Misalnya saat klik kanan dan memilih aksi yang dikehendaki. Kelebihan: pengguna tidak perlu ingat nama perintah dan pengetikan minimal.serta kesalahan rendah. Kekurangan: tidak ada logika AND atau OR. Perlu ada struktur menu jika banyak pilihan. Menu dianggap lambat oleh pengguna para pakar dibanding command language.

Transcript of BAB III PERANCANGAN INTERAKSI -...

Page 1: BAB III PERANCANGAN INTERAKSI - digilib.itb.ac.iddigilib.itb.ac.id/files/disk1/667/jbptitbpp-gdl-iwankustia-33308-4... · 24 3. Form fill-in. atau pengisian form artinya mengisi area-area

23

BAB III

PERANCANGAN INTERAKSI

3.1 Interaksi Pengguna Perancang sistem menghadapi dua masalah penting sebagai berikut.

1. Cara informasi dari pengguna dapat disediakan untuk sistem komputer,

misalnya pada saat masukan data.

2. Cara informasi dari sistem komputer ditampilkan untuk pengguna, misalnya

hasil dari pemrosesan data .

Antarmuka pengguna yang baik harus menyatukan interaksi pengguna dan

penyajian informasi.

Ada lima tipe utama interaksi untuk interaksi.

1. Direct manipulation atau pengoperasian secara langsung artinya interaksi

langsung dengan obyek pada layar. Misalnya delete file dengan

memasukkannya ke trash. Contoh: video games.

Kelebihan: waktu pembelajaran pengguna sangat singkat, feedback langsung

diberikan pada tiap aksi sehingga kesalahan terdeteksi dan diperbaiki dengan

cepat.

Kekurangan: interface tipe ini rumit dan memerlukan banyak fasilitas pada

sistem komputer, cocok untuk penggambaran secara visual untuk satu operasi

atau obyek.

2. Menu selection atau pilihan berbentuk menu artinya memilih perintah dari

daftar yang disediakan. Misalnya saat klik kanan dan memilih aksi yang

dikehendaki.

Kelebihan: pengguna tidak perlu ingat nama perintah dan pengetikan

minimal.serta kesalahan rendah.

Kekurangan: tidak ada logika AND atau OR. Perlu ada struktur menu jika

banyak pilihan. Menu dianggap lambat oleh pengguna para pakar dibanding

command language.

Page 2: BAB III PERANCANGAN INTERAKSI - digilib.itb.ac.iddigilib.itb.ac.id/files/disk1/667/jbptitbpp-gdl-iwankustia-33308-4... · 24 3. Form fill-in. atau pengisian form artinya mengisi area-area

24

3. Form fill-in atau pengisian form artinya mengisi area-area pada form.,

Contohnya adalah Stock control.

Kelebihan: masukan data yang sederhana. Mudah dipelajari

Kekurangan: Memerlukan banyak tempat di layar. Harus menyesuaikan

dengan form manual dan kebiasaan pengguna.

4. Command language atau perintah tertulis yaitu menuliskan perintah yang

sudah ditentukan pada program. Contohnya adalah operating system.

Kelebihan: perintah diketikan langsung pada system. Misal UNIX, DOS

command. Dapat diterapkan pada terminal yang murah. Kombinasi perintah

dapat dilakukan misalnya copy file dan rename nama file.

Kekurangan: Perintah harus dipelajari dan diingat cara penggunaannya

umumnya tidak cocok untuk pengguna biasa.

Kekurangan: kesalahan pakai perintah sering terjadi. Perlu ada sistem

pemulihan kesalahan. Diperlukan keterampilan untuk mengetik.

5. Natural language atau perintah dengan bahasa alami: menggunakan bahasa

alami untuk mendapatkan hasil. Contoh: search engine di Internet.

Kelebihan: Perintah dalam bentuk bahasa alami, dengan kosa kata yang

terbatas (singkat), misalnya kata kunci yang kita tentukan untuk dicari oleh

search engine serta kebebasan menggunakan kata-kata.

Kekurangan: tidak semua sistem cocok gunakan ini. Jika digunakan maka

akan memerlukan banyak pengetikan serta pemilihan kata-kata kunci

(keywords) yang tepat untuk mendapat hasil yang diinginkan.

3.2 Penyajian Informasi Sistem yang interaktif pasti menyediakan cara untuk menyajikan informasi untuk

pengguna. Penyajian informasi dapat berupa penyajian langsung dari masukan yang

diberikan (seperti teks pada pengolah kata) atau disajikan dengan grafik. Beberapa

faktor berikut adalah hal yang perlu diperhatikan sebelum menentukan bentuk

penyajian informasi.

− Apakah pengguna perlu informasi dengan ketepatan tinggi atau data yang saling

berhubungan?

Page 3: BAB III PERANCANGAN INTERAKSI - digilib.itb.ac.iddigilib.itb.ac.id/files/disk1/667/jbptitbpp-gdl-iwankustia-33308-4... · 24 3. Form fill-in. atau pengisian form artinya mengisi area-area

25

− Seberapa cepat nilai informasi berubah? Harus ada indikasi perubahan seketika?

− Apakah pengguna harus memberi respon pada perubahan?

− Apakah pengguna perlu melakukan perubahan pada informasi yang disajikan?

− Apakah informasi berupa teks atau numerik?

− Nilai relatif perlu atau tidak?

3.3 Teknik Interaksi

Alat yang dipertimbangkan untuk berinteraksi dengan obyek virtual dalam AR

tsunami adalah marker sebagai pointer. Alat ini menggunakan marker tunggal.

Dengan alat ini, pengguna dapat berinteraksi dengan melakukan hal-hal seperti

berikut.

- Tekan pada tombol virtual

Tekan ini dilakukan marker untuk memainkan tombol play, stop, pilih

parameter, dan game tsunami. Teknik ini merupakan proses switching atribut

obyek virtual on dan off.

- Manipulasi yaitu menangkap, memindahkan, dan membebaskan obyek

Manipulasi obyek dilakukan pada saat menangkap obyek (barang-barang)

yang akan diselamatkan sebelum tsunami datang, memindahkan dan

membebaskannya ke tempat yang tidak dikenai tsunami. Berikut contoh

gambar aplikasi marker sebagai pointer.

Gmb 3.1 Contoh marker sebagai pointer.

Page 4: BAB III PERANCANGAN INTERAKSI - digilib.itb.ac.iddigilib.itb.ac.id/files/disk1/667/jbptitbpp-gdl-iwankustia-33308-4... · 24 3. Form fill-in. atau pengisian form artinya mengisi area-area

26

Alasan-alasan dalam pemilihan teknik interaksi ini adalah seperti berikut.

• Alat ini tidak memerlukan daya untuk menjalankannya, seperti halnya

interaksi AR dengan mengunakan magic pen (mengunakan baterai dan

LED).

• Alat ini memberikan kemudahan bagi pengguna terutama bagi anak-anak

(pelajar) karena alat ini berbentuk tongkat yang mudah dikenali dalam

persepsi anak.

• Alat ini efektif dan cocok untuk sistem yang dirancang. Dengan alat ini

pengguna dapat melakukan: tekan menu, grab obyek, move obyek, dan

drop obyek tanpa perlu dukungan alat lain.

. Gmb 3.2 Alat interaksi marker sebagai pointer.

3.4 Skenario Interaksi Skenario interaksi AR tsunami ini memposisikan pengguna sebagai orang yang dapat

terhindar dari bahaya tsunami, tetapi mempunyai tugas untuk menyelamatkan harta

bendanya dari bahaya tsunami yang akan mengancamnya. Karena itu, pengguna ini

dengan marker interaksinya memiliki kemampuan dan kekuatan untuk

menyelamatkan barang-barang yang dimilikinya seperti kursi, meja, mobil, dan lain-

lain dengan cara melakukan evakuasi barang-barang tersebut ke tempat yang tidak

akan tersentuh tsunami. Di marker utama, tempat yang tidak tersentuh tsunami

dinamakan zona aman.

Page 5: BAB III PERANCANGAN INTERAKSI - digilib.itb.ac.iddigilib.itb.ac.id/files/disk1/667/jbptitbpp-gdl-iwankustia-33308-4... · 24 3. Form fill-in. atau pengisian form artinya mengisi area-area

27

Gmb 3.3 Rancangan tampilan menu. Penjelasan menu Play Intro

Pengguna melihat intro tsunami dalam bentuk video dengan format avi. Intro ini berisi penjelasan tsunami, efeknya, kejadian tsunami yang pernah ada, tsunami Aceh serta memberi gambaran tentang teknologi AR.

Play Pengguna menjalankan animasi tsunami.

Game Tsunami

Pengguna menjalankan aplikasi game tsunami. 3.5 Metoda Perancangan Dari aspek metoda perancangan, game AR tsunami termasuk kategori metoda

perancangan baru. Hal demikian terlihat dari adanya kesamaan yang merupakan ciri

dari semua metoda baru, yaitu adanya upaya membuat jelas kepada publik atas isi

pikiran perancang dengan mengeksternalkan proses pemikiran dalam merancang

suatu produk. Metoda-metoda ini dipergunakan untuk menelaah segala hal yang

Page 6: BAB III PERANCANGAN INTERAKSI - digilib.itb.ac.iddigilib.itb.ac.id/files/disk1/667/jbptitbpp-gdl-iwankustia-33308-4... · 24 3. Form fill-in. atau pengisian form artinya mengisi area-area

28

mendasari keputusan perancangan. Demikian juga untuk menilai kembali atau

menguji suatu keputusan perancangan yang telah diambil.

Sarwono[15]

1. Berusaha membuat jelas kepada publik (stakeholder) isi pikiran perancang.

Dengan kata lain mengeksternalkan proses pemikiran perancangan dapat

melalui kata-kata (deskripsi), simbol matematis atau diagram. Publik yang

dimaksud adalah owner, producer, operator, dan pengguna.

merinci ciri-ciri utama metoda perancangan baru sebagai berikut.

2. Terjadi pemisahan yang jelas antara proses pemikiran konsep dari benda

yang akan dibuat dengan proses pelaksanaan pembuatan perancangan

menjadi produk yang diinginkan.

3. Proses perancangan diurai menjadi komponen-komponen perancangan

yang kemudian ditelaah satu per satu secara terpisah. Demikian juga

dengan proses pelaksanaan pembuatan barang, yang diurai menjadi

komponen-komponen pekerjaan pelaksanaan yan dikerjakan secara

terpisah.

4. Perancang tidak lagi selalu individual melainkan juga kelompok. Dalam

hal ini dikenal beberapa istilah antara lain Kelompok Perancang, Design

Team, Design Board. Dengan demikian kelahiran profesi mandiri, yang

diawali melalui metoda merancang dengan gambar, semakin dipertegas.

5. Dibandingkan metoda perancangan konvensional, pihak yang

berkepentingan dengan hasil perancangan pada metoda perancangan baru

ini lebih luas, meliputi owner, producer, operator, dan pengguna, serta

otoritas pembuat dan pelaksana peraturan (legislator).

3.6 Strategi Perancangan Strategi adalah kerangka atau rencana yang mengintegrasikan tujuan, kebijaksanaan,

dan program. Sedangkan tujuan merupakan pernyatan tentang apa yang diinginkan

dan kapan harus dicapai. Kebijaksanaan adalah batas-batas untuk melaksanakan

berbagai aktifitas. Program adalah urutan langkah demi langkah dari serangkain

aktifitas. Dengan demikian strategi perancangan didefinisikan sebagai penetapan

Page 7: BAB III PERANCANGAN INTERAKSI - digilib.itb.ac.iddigilib.itb.ac.id/files/disk1/667/jbptitbpp-gdl-iwankustia-33308-4... · 24 3. Form fill-in. atau pengisian form artinya mengisi area-area

29

urutan tindakan yang akan dilaksanakan oleh perancang atai tim perancang untuk

merealisasikan suatu tujuan yang diinginkan menjadi keputusan akhir perancangan

yang siap dilaksanakan.

Klasifikasi strategi perancangan mengacu pada dua kriteria utama, yakni kadar

kejelasan pemilahan proses perancangan serta pola pencarian gagasan. Berdasarkan

kriteria tersebut Jones menetapkan enam strategi perancangan, yaitu Cyclic Strategy,

Branching Strategy, Adaptive Strategy, Incremental Strategy, dan Random Search.

Linear strategy menetapkan urutan logis pada tahapan perancangan yang sederhana

dan relatif sudah dipahami komponennya. Cyclic strategy pada dasarnya sama

dengan linear strategy hanya saja ada kalanya suatu tahap perlu diulang kembali

untuk menampung umpan balik sebelum tahap berikutnya dilanjutkan. Branching

strategy diterapkan apabila seluruh tahap perencanaan dan perancangan diputuskan

secara terpisah dan mandiri, tidak selalu tergantung satu sama lain. Adaptive strategy

awalnya hanya sasaran perancangan tahap pertama yang ditetapkan. Kemudian

sasaran perancangan tahap berikutnya dan keputusan perancangan akhir ditetapkan

berdasarkan tahap sebelumya. Incremental strategy memiliki prinsip dasar sama

dengan adaptive strategy hanya saja dalam skala yang lebih sederhana. Random

search tanpa ada rambu-rambu yang ketat baik yang menyangkut pemilahan

komponen-komponen perancangan maupun urutan tahap eksplorasi.

Ditinjau dari segi strategi perancangan terutama segi skenario interaksi pengguna,

maka perancangan game ini menerapkan pola adaptive strategy sehingga pengguna

bebas menentukan kriteria permainan sesuai dengan yang diinginkan.

3.7 Skenario Game Skenario game meliputi game flow dan screen flow dari game. Game flow adalah

urutan proses yang akan dilalui oleh pengguna pada saat memainkan game,

sementara screen flow adalah urutan kemunculan screen yang akan dilihat oleh

pengguna pada saat memainkan game.

Page 8: BAB III PERANCANGAN INTERAKSI - digilib.itb.ac.iddigilib.itb.ac.id/files/disk1/667/jbptitbpp-gdl-iwankustia-33308-4... · 24 3. Form fill-in. atau pengisian form artinya mengisi area-area

30

1. Game Flow Pada awal game, pengguna diminta untuk memilih menu pada main menu screen dan

kemudian memilih skenario yang akan dimainkan. Setelah memilih, pengguna dapat

masuk ke dalam skenario. Apabila telah selesai pengguna dapat melanjutkan ke

menu lainnya.

Gmb 3.4 Skema game flow. 2. Screen Flow Pada saat memainkan game AR tsunami, pengguna akan melihat main menu screen

yang menampilkan menu-menu 3D untuk keperluan interaksi dengan pengguna.

Menu-menu tersebut adalah intro, animasi tsunami dan menu play game.

Menu Utama

Animasi Intro Video Play Game

End Game

Page 9: BAB III PERANCANGAN INTERAKSI - digilib.itb.ac.iddigilib.itb.ac.id/files/disk1/667/jbptitbpp-gdl-iwankustia-33308-4... · 24 3. Form fill-in. atau pengisian form artinya mengisi area-area

31

Gmb 3.5 Screen flow.

Gmb 3.6 Main menu screen.

Game Tsunami

AR

intro Animasi Play game

Menu Utama

Intro video

animasi

Play game

ya Intro Screen

Animasi Screen

end Game Screen

ya

ya

tidak

tidak

tidak

Play Game Screen

Start

End

Page 10: BAB III PERANCANGAN INTERAKSI - digilib.itb.ac.iddigilib.itb.ac.id/files/disk1/667/jbptitbpp-gdl-iwankustia-33308-4... · 24 3. Form fill-in. atau pengisian form artinya mengisi area-area

32

Ketika pengguna berinteraksi dengan cara memilih salah satu menu, maka screen

akan berpindah ke screen baru sesuai dengan menu pilihan tersebut. Screen itu dapat

digambarkan sebagai berikut.

- Intro Video screen

Gmb 3.7 Rancangan intro video screen. - Animation screen

Gmb 3.8 Rancangan animation screen. - Game screen

Gmb 3.9 Rancangan game screen. 3. Game play Pegunjung museum yang memainkan Game Tsunami AR akan melihat menu-menu

sebagai berikut.

− Intro

Pengguna melihat intro video dalam bentuk video dengan format advanced video

interface (AVI) file. Intro ini berisi penjelasan mengenai gempa dan tsunami,

Video

Animasi

Game

Page 11: BAB III PERANCANGAN INTERAKSI - digilib.itb.ac.iddigilib.itb.ac.id/files/disk1/667/jbptitbpp-gdl-iwankustia-33308-4... · 24 3. Form fill-in. atau pengisian form artinya mengisi area-area

33

efeknya, kejadian tsunami yang pernah ada di dunia dan Indonesia, tsunami Aceh

serta memberi gambaran tentang teknologi AR.

− Animasi

Animasi ini menampilkan proses tsunami yang disebabkan oleh gempa tektonik

di dasar lautan yang diasumsikan mengakibatkan terjadinya tsunami. Pemilihan

gempa tektonik sebagai sumber pembangkit tsunami karena akibat gempa

tektonik lebih sering terjadi tsunami daripada disebabkan oleh letusan gunung

berapi di dasar laut, longsoran besar di tepi pantai, dan akibat meteor. Dalam

animasi ini pengguna melihat proses-proses terjadinya tsunami tersebut dapat 6

proses seperti berikut..

a. gempa bumi di bawah permukaan laut,

b. subduksi yakni lempeng samudera slip di bawah lempeng kontinen,

c. subduksi yang menghasilkan gelombang tsunami,

d. gelombang tsunami bergerak di samudera dari titik episentrum,

e. gelombang tsunami dapat mencapai garis pantai dan memampatkannya,

f. kerusakan yang terjadi di pantai (daratan) akibat gelombang tsunami.

− Game

Urutan game flow pada dapat dijelaskan sebagai berikut.

1. Pengguna awalnya melihat obyek-obyek virtual rumah, gedung, mobil,

temapt tidur, dan lain-lain disusun sedemikian teratur.

2. Pengguna mendengar ada sirine atau peringatan dari menara pengawas pantai

bahwa tsunami akan terjadi.

3. Pengguna diberi waktu 60 detik. Waktu akan berjalan ketika sirine

dibunyikan. Ketika sirine berbunyi akan muncul pesan di layar memberi

perintah kepada pengguna agar mulai memainkan game dengan cara

memindahkan obyek-obyek yang ada di pantai seperti manusia, mobil, motor,

sepeda, meja, kursi ke zona aman.

4. Zona aman merupakan daerah ketinggian (perbukitan) yang tidak dapat

dicapai gelombang tsunami. Zona aman akan diberi petunjuk berupa tulisan

dan tanda panah sehingga pengguna dapat melihat dengan jelas.

Page 12: BAB III PERANCANGAN INTERAKSI - digilib.itb.ac.iddigilib.itb.ac.id/files/disk1/667/jbptitbpp-gdl-iwankustia-33308-4... · 24 3. Form fill-in. atau pengisian form artinya mengisi area-area

34

5. Setelah waktu 60 detik pengguna melihat gelombang tsunami akan mencapai

pantai. Pengguna tidak dapat lagi melakukan interaksi dengan game.

Pengguna melihat gelombang tsunami akan merendam daratan.

Gedung Gedung

N

Gedung

Lautan

pohon

Gedung

rumah rumah rumah rumahrumah

pohon pohonpohon pohon

Gedung

rumah rumah rumah

rumah rumah rumah

rumah rumah rumah

rumah rumah rumah

rumah rumah rumah

rumah rumah rumah

rumah rumah rumah

rumah rumah rumah

Tsunami sirine

rumah rumah rumah

rumah rumah rumah

rumah rumah rumah

rumah rumah rumah

rumah rumah rumah

rumah rumah rumah

rumah rumah rumah

rumah rumah rumah

pohon

pohonpohon

pohon pohon

pohon

Zona Aman(Tempat untuk meletakkan objek yang akan

diselamatkan)

Jam untuk time counter

Tanda panah sebagai penunjuk ke zona aman

Gmb 3.7 Rancangan visualiasasi 2D lansekap pantai.