Modul Matakuliah

Rekayasa Interface

Oleh:

Dosen : Hadi Asnal, S.Kom., M.Kom

NIDN : 1027078902
Program Studi : Teknik Informatika

Sekolah Tinggi Manajemen Informatika dan Komputer Amik Riau

STMIK Amik Riau
Rekayasa Interface
 Pengertian Rekayasa Interface

• Rekayasa adalah penerapan ilmu dan teknologi untuk

menyelesaikan permasalahan manusia. Hal ini
diselesaikan lewat pengetahuan, matematika dan
pengalaman praktis yang diterapkan untuk mendesain
objek atau proses yang berguna.
• Interface : merupakan bentuk tampilan grafis yang
berhubungan langsung dengan pengguna (user).
Interface juga berfungsi untuk
menghubungkan antara pengguna dengan sistem
operasi, sehingga komputer tersebut bisa digunakan.
Rekayasa Interface adalah Ilmu
yang diterapakan untuk mendesain
tampilan grafis (antarmuka).
FAKTOR DASAR REKAYASA
INTERFACE
USER
• Pengguna secara individu, suatu group
dari pengguna yang bekerja sama, atau
sekelompok pengguna dalam organisasi;
• dimana masing-masing berhubungan
dengan bagian sama dari suatu pekerjaan
atau proses.
• Pengguna berusaha menyelesaikan
pekerjaannya dengan menggunakan
bantuan teknologi (komputer)
Istilah User Interface??
 Faktor Dasar Rekayasa Interface
1. (User Interface)/ Antarmuka pemakai
merupakan mekanisme komunikasi antara
pengguna (user) dengan sistem. Antarmuka
pemakai (User Interface) dapat menerima
informasi dari pengguna (user) dan memberikan
informasi kepada pengguna (user) untuk
membantu mengarahkan alur penelusuran
masalah sampai ditemukan suatu solusi.
 Macam-macam User
Interface
User Interface ada dua jenis, yaitu :
a. Graphical User Interface (GUI) : Menggunakan
unsur-unsur multimedia (seperti gambar,
suara, video) untuk berinteraksi dengan
pengguna. Adalah “bentuk dialog atau
komunikasi antara manusia dan komputer
yang berbentuk grafis dan sangat atraktif”.
Contoh antarmuka manusia dengan komputer
yang berbentuk grafis menggunakan
pemrograman visual (Visual Basic, Visual
Foxpro, Delphi dan lain-lain).

b. Text-Based : Menggunakan syntax/rumus yang

sudah ditentukan untuk memberikan perintah.
bentuk sederhana dialog atau komunikasi
antara manusia dan komputer yang hanya
berisi teks dan kurang menarik “.
Contoh: perintah “readln” dan “writeln” dalam
Pascal.
 Keunggulan GUI
Saat ini interface yang banyak digunakan dalam
software adalah GUI (Graphical User Interface). GUI
memberikan keuntungan seperti:
1. Mudah dipelajari oleh pengguna yang
pengalaman dalam menggunakan komputer
cukup minim.
2. Berpindah dari satu layar ke layar yang lain
tanpa kehilangan informasi.
3. Akses penuh pada layar dengan segera untuk
beberapa macam tugas/keperluan.
Karakteristik GUI
 Tipe-tipe Interaksi Dengan User
Ada beberapa tipe utama interaksi untuk user interaction:
1. Direct manipulation – pengoperasian secara langsung : interaksi
langsung dengan objek pada layar. Misalnya delete file dengan
memasukkannya ke trash/sampah.
Kelebihan : Waktu pembelajaran user sangat singkat, feedback
langsung diberikan pada tiap aksi sehingga jika ada kesalahan
terdeteksi dan diperbaiki dengan cepat.
2. Menu selection – pilihan berbentuk
menu : Memilih perintah dari
daftar yang disediakan. Misalnya
saat click kanan dan memilih aksi
yang dikehendaki.
Kelebihan : User tidak perlu ingat
nama perintah, Pengetikan minimal.
• 3. Form fill-in / pengisian form : Mengisi area-
area pada form. Contoh : Stock control.
Kelebihan : Masukan data yang sederhana.
Mudah dipelajari
4. Command language – perintah tertulis :
Menuliskan perintah yang sudah ditentukan
pada program.
Kelebihan : Perintah diketikan langsung
pada system. Misal UNIX, DOS command.
Kombinasi perintah bisa dilakukan.
Misal copy file dan rename nama file.
5. Natural language – 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.
Ada kebebasan menggunakan kata-kata.
 Bahasa dalam User Interface
Tujuan sebuah user interface adalah mengkomunikasikan
fitur-fitur sistem yang tersedia agar user mengerti dan dapat
menggunakan sistem tersebut. Dalam hal ini penggunaan
bahasa amat efektif untuk membantu pengertian, karena
bahasa merupakan alat komunikasi tertua, yang dipakai orang
untuk berkomunikasi sehari-harinya.

Tanpa bahasa pun kadang ikon bisa tidak jelas maknanya,

sebab tidak semua lambang ikon bisa bersifat universal
.
Meski penting, namun sayangnya kadang penggunaan bahasa,
seperti pemilihan istilah, sering dianggap kurang begitu
penting. Bahasa sering menjadi sesuatu yang nomor dua
ketimbang elemen-elemen interface lainnya.
 Bahasa dalam User Interface

Search atau Find? Remove atau Delete? Kantong

belanja atau keranjang belanja?
• User friendly (ramah dengan pengguna) yaitu :
– antarmuka yg bagus.
– mudah dioperasikan
– mudah dipelajari
– pengguna merasa senang menggunakan software tsb.
 Software Interaktif
• Mampu memenuhi kebutuhan berbagai
macam user
• Mudah dioperasikan
• Penampilan Menarik
• Terlindung dari kerusakan
• Aman dari akses luar yang tidak diinginkan
• Tersedia ketika hendak digunakan
• Keseragaman sifat antarmuka pada aplikasi
yang berbeda
• Hasil data dapat dikonversi ke berbagai
hardware dan software
Faktor-Faktor Rek_In ( Bidang Imu Terkait )

Psikologi Linguistics
RPL
Kecerdasan Buatan

Matematika Ergonomik
Rek_In
Bisnis Antropologi

Teknik Penulisan Sosiologi

Design Grafis Multimedia

Faktor Rekayasa Perangkat Lunak (RPL)

• Instruksi yang bila dieksekusi akan memberi fungsi dan kerja yang
diinginkan.
• RPL ini merupakan suatu faktor yang bisa menciptakan suatu program
yang efektif, efisien serta user friendly sehingga darinya dapat
menghasilkan suatu mesin yang betul- betul diinginkan oleh user.
Faktor Psikologi
• Setiap user memiliki sifat dan kelakuan yang berbeda.
• Siapa target pengguna program.
• Bagaimana lingkungan dari user.
• Perilaku user secara umum.
• Pengetahuan dan keahlian pengguna.
Faktor Linguistics (Bahasa)
• Peran bahasa sebagai antarmuka.
• Memudahkan dalam penggunaan sistem.
• Menghindari kesalahpahaman dalam penggunaan sistem.
Faktor Kecerdasan Buatan
• Suatu bagian ilmu komputer yang bertujuan agar komputer dapat
melakukan pekerjaan seperti yang dilakukan manusia, dimana
merupakan penggabungan cara berpikir manusia dan mesin, untuk
mengambil keputusan, memecahkan masalah, dan pembelajaran.
Faktor Ergonomik
• Ilmu yang mempelajari perancangan dan pengaturan barang-barang
yang digunakan manusia.
• Berhubungan dengan aspek fisik untuk mendapatkan lingkungan kerja
yang nyaman.
Faktor Antropologi
• Memberikan gambaran tentang cara kerja kelompok yang masing-
masing anggotanya diharapkan dapat memberikan kontribusi sesuai
bidang masing-masing.
• Dapat memberikan pandangan yang mendalam tentang cara kerja dari
setiap kelompok karyawan yang ada dalam satu perusahaan, dimana
terjadi komunikasi antara manusia dan peralatan yang digunakan.
Faktor Sosiologi
• Berhubungan dengan pengaruh sistem komputer dalam struktur sosial.
Faktor Multimedia
• Tampilan menjadi lebih menarik.
• Lebih mudah dimengerti oleh user.
• Adanya gambar, suara, teks, grafik, dsb.
Faktor Design Grafis
• Penggunaan design grafis dalam ilmu komputer sudah menjadi
kebutuhan dimasa sekarang.
• Banyak aplikasi yang tidak hanya berbentuk teks, tetapi sudah
dalam bentuk multidimensi.
Faktor Teknik Penulisan
• Teknis menulis adalah penyajian informasi yang membantu pembaca
memecahkan masalah tertentu.
• Merupakan bentuk panduan secara manual dari suatu produk.
• User diharapkan akan mudah berinteraksi dengan sistem jika sudah
mempelajari panduan manual tersebut.
Faktor Bisnis
• Semakin banyak permintaan pasar yang datang dari pengguna gadget
(komputer, ponsel, komputer tablet, dsb).
• Semua mengacu dari perkembangan teknologi informasi yang
merupakan peluang bisnis.
Faktor Matematika
• Pembuatan sistem berdasarkan perhitungan matematika agar bisa
efisien.
INPUT DEVICE PADA MANUSIA
• Visual channel - eye/mata
• Visual perception - penglihatan
• Perceiving brightness - pencahayaan
• Perceiving colour - warna
 Istilah dalam Penglihatan/Visual
• Medan penglihatan adalah sudut yang dibentuk ketika
mata bergerak kekiri terjauh dan kekanan terjauh, yang
dapat dibagi menjadi empat wilayah:
1.Wilayah tempat kedua bola mata mampu melihat sebuah
orbyek dalam keadaan sama, disebut juga penglihatan
binokuler

2.Wilayah terjauh yang dapat dilihat oleh mata kiri ketika

mata kiri digerakkan ke sudut paling kiri, disebut juga
penglihatan monokuler kiri.
3. Wilayah terjauh yang dapat dilihat
oleh mata kanan ketika mata kanan
digerakkan ke sudut paling kanan,
disebut juga penglihatan monokuler
kanan.

4. Wilayah buta, yakni wilayah yang

sama sekali tidak dapat dilihat oleh
kedua mata kita.
 PERSEPSI VISUAL
• Dalam dunia nyata mata selalu digunakan
untuk melihat semua bentuk obyek 3-
dimensi

• Dalam sistem komputer yang menggunakan

layar 2-dimensi, mata “dipaksa” untuk dapat
“mengerti” bahwa obyek pada layar
tampilan yang susungguhnya berupa obyek
2-dimensi, harus dipahami sebagai obyek 3-
dimensi dengan menggunakan teknik-teknik
tertentu.
 WARNA
Warna diketahui bisa memberikan pengaruh terhadap
psikologi, emosi serta cara bertindak manusia. Warna
juga menjadi bentuk komunikasi non verbal yang bisa
mengungkapkan pesan secara instan dan lebih
bermakna. Artikel ini membahas tentang Pengaruh
Warna bagi Psikologi Manusia. Setiap warna
memancarkan panjang gelombang energi yang berbeda
dan memiliki efek yang berbeda pula.
Carl Gustav Jung, seorang psikolog ternama dari Swiss,
menjadikan warna sebagai alat penting dalam
psikoterapinya. Beliau meyakini setiap warna punya
makna, potensi, dan kekuatan untuk memengaruhi.
Bahkan menghasilkan efek tertentu pada produktivitas,
emosi, hingga perubahan mood (suasana hati)
seseorang. Beliau juga membuktikan Pengaruh Warna
bagi Psikologi Manusia.
Menurut Kaina dalam buku “Colour Therapy”, Pengaruh Warna bagi Psikologi
Manusia, emosi serta cara bertindak manusia.
• Antara lain sebagai berikut:
• Pengaruh Warna bagi Psikologi Manusia dapat menciptakan daya tarik
manusia untuk semakin bergairah terhadap suatu hal.
• Permainan warna dapat mempengaruhi emosi seseorang.
• Penggunaan warna yang tepat dapat memberikan ketenangan, konsentrasi,
kesan gembira.
• Penggunaan warna dapat membangkitkan energi yang membuat seorang
menjadi aktif dalam melakukan kegiatannya.
• Warna sebagai salah satu alat bantu komunikasi non verbal yang bisa
mengungkapkan pesan secara instan yang mudah diserap maknanya.
• Merah merupakan warna yang memberikan inspirasi power, energy, kehangatan, cinta, nafsu, dan
agresi. Warna merah biasanya dapat memicu tingkat emosional seseorang sekaligus warna yang
paling sering menarik perhatian.
Warna merah memiliki efek untuk menstimulasi sebuah perhatian atau ketercapaian, serta
merangsang kelenjar adrenal, hingga meningkatkan detak jantung. Sehingga merah biasa digunakan
untuk menarik perhatian.
• Sifat positif warna merah:
• – bersemangat,
– enerjik,
– dinamis,
– komunikatif,
– aktif,
– kegembiraan,
– mewah,
– cinta,
– kekuatan,
– percaya diri,
– dramatis,
– panas,
– perjuangan,
– Khusus merah terang menggambarkan kerasnya cita-cita atau keinginan.
Warna magenta merupakan perpaduan antara warna merah dan ungu.
• Sifat warna magenta:
– semangat,
– kekuatan dan energy,
– keseimbangan fisik, mental, spiritual ataupun emosional,
– perubahan atau transformasi negatif kearah yang lebih baik.
Pink
Merah muda atau Pink dianggap melambangkan cinta dan romantisme
merupakan warna yang feminim. Dalam kondisi normal warna ini hampir selalu
berkaitan dengan sesuatu yang bersifat kewanitaan cinta, berhubungan dengan
perempuan, dan kesan feminim.
Sifat warna Pink:
– cinta atau kasih sayang,
– romantisme,
– ketenangan fisik,
– memelihara,
– kehangatan,
– kewanitaan,
– simbol kelangsungan hidup manusia.
Warna orange yang merupakan gabungan antara merah dan kuning. Warna Orange ialah warna
yang kuat dan hangat, membuat penggunaan warna ini memberi rasa nyaman. Warna orange
kerap digunakan pada tempat-tempat makan atau di lingkungan kerja yang membutuhkan
produktivitas.
Sifat warna Orange:
– kecerian,
– ambisi,
– energik,
– keamanan sensualitas,
– sikap yang menyenangkan,
– pemicu selera makan seseorang,
– keakraban,
– keramahan,
– rasa nyaman,
– interaksi yang bersahabat,
– penuh percaya diri,
– keramahan,
– penuh harapan,
– kreativitas,
– merangsang emosi.
Kuning
Kuning merupakan warna cerah atau ceria yang dapat merangsang otak serta membuat manusia lebih waspada dan tegas.
Warna kuning dapat menarik perhatian dikarenakan jumlah cahaya yang terpantul darinya lebih banyak dibandingkan warna-
warna lain. Namun tak semenarik perhatian warna merah.
Sifat warna kuning:
– optimis,
– percaya diri,
– harapan,
– kegembiraan,
– penuh suka cita,
– berenergi,
– antusiasme,
– makna kekeluargaan dan persahabatan,
– keleluasaan,
– santai,
– spontanitas,
– sosial,
– mendominasi,
– toleran,
– rasa ingin tahu,
– cita-cita,
– harga diri,
– ekstraversi,
– kekuatan emosional,
– keramahan,
– kreativitas,
– imajinatif,
– masa muda,
– kedermawanan,
– dan semangat yang tinggi.
Hijau merupakan warna yang berkaitan dengan alam. Dalam psikologi warna, hijau kerap digunakan untuk membantu
seseorang yang berada dalam situasi tertekan. Agar lebih mampu menyeimbangkan dan menenangkan emosinya.
Sifat warna Hijau:
– kehidupan,
– ketenangan,
– rileksasi,
– kemudahan,
– penyeimbang emosi,
– menurunkan stres,
– penyembuhan,
– empati,
– kesegaran,
– kesejukan,
– keberuntungan,
– keuangan,
– harmoni,
– cinta universal,
– istirahat,
– pemulihan,
– jaminan,
– kesadaran,
– keamanan,
– kedamaian,
– keinginan,
– ketabahan,
Biru
Penggunaan warna biru yang lebih muda akan memberikan efek kepercayaan yang lebih
dominan. Sedangkan warna biru gelap lebih cenderung meningkatkan kesan cerdas pada
penggunaannya. Warna biru menjadi salah satu warna yang sering kali dikaitkan dengan
dunia bisnis. Khususnya bisnis-bisnis yang mengedepankan keseriusan dalam
pekerjaannya.
Dalam ranah desain interior, warna biru sering kali digunakan untuk menciptakan kesan
luas, stabil, sejuk, dingin, dan relaksasi pada ruangan.
Sifat warna biru:
– kepercayaan,
– konsistensi,
– konsentrasi,
– ketenangan,
– keyakinan,
– keseriusan,
– professional.
Ungu adalah warna yang unik, salah satunya karena jarang ditemukan di alam. Penggunaan warna ini
menggambarkan pengharapan yang besar dan kepekaan.
Sifat warna ungu:
– magis,
– aura spiritualitas,
– misterius,
– menarik perhatian,
– kekuatan,
– imajinasi,
– sensitivitas,
– obsesif,
– ambisius,
– martabat,
– kebenaran,
– kualitas,
– independen,
– kebijaksanaan,
– kesadaran,
– visioner,
– orisinalitas,
– kekayaan dan kemewahan.
Warna yang menjadi simbol warna Bumi atau biasa juga bersanding dengan warna hijau sebagai warna alam. Warna coklat
identik dengan sesuatu yang bersifat natural. warna coklat hampir disamakan dengan warna hitam namun coklat lebih
menunjukan kelembutan.
Sifat positif warna coklat:
– keseriusan,
– kehangatan,
– dapat dipercaya,
– kehangatan,
– dukungan,
– rasa nyaman dan aman,
– kesederhanaan,
– matang atau tua,
– dapat diandalkan,
– elegan,
– akrab.
Putih
Bentuk-bentuk minimalis dan simpel biasa dilahirkan dengan penggunaan warna ini. Penggunaan
warna putih yang digunakan dengan tepat juga mampu memberikan efek keyakinan akan kualitas
yang tidak akan mengecewakan.
Sifat positif warna putih:
– keyakinan,
– kesucian/kemurnian,
– lemah lembut,
– ketepatan,
– kebersihan,
– luas,
– eksotik,
– steril,
– keaslian,
– kemurnian,
– kesucian,
– ringan,
– kepolosan,
– efek meredakan rasa nyeri,
– kebebasan,
 Hitam
Walaupun para ahli mengatakan bahwa hitam adalah bukan warna, namun kita harus sepakat
terlebih dahulu kita membahas Hitam adalah warna.
Sifat positif warna hitam:
– kekuatan,
– percaya diri,
– glamor,
– keamanan,
– emosional,
– efisiensi,
– substansi,
– maskulin,
– keabadian,
– sifat dramatis,
– melindungi,
– kemisteriusan,
– klasik,
– elit,
– keanggunan,
– mempesona,
– keteguhan.
User Interface Design ( UID )
 PRINSIP UMUM DESAIN USER
INTERFACE

Menurut Deborah J. Mayhew, dengan General Principles Of UI

Design, atau Prinsip Umum Desain User Interface. Ada 17 prinsip
yang harus dipahami para perancang sistem, terutama untuk
mendapatkan hasil maksimal dari tampilan yang dibuat.
1. User Compatibility, yang bisa berarti kesesuaian tampilan
dengan tipikal dari user. karena berbeda user bisa jadi
kebutuhan tampilannya berbeda. misalnya, jika aplikasi
diperuntukkan bagi anak-anak, maka jangan menggunakan
istilah atau tampilan orang dewasa.
2. Product Compatibility, istilah ini mengartikan bahwa
produk aplikasi yang dihasilkan juga harus sesuai. memiliki
tampilan yang sama/serupa. baik untuk user yang awam
maupun yang ahli.
3. Task Compatibility, berarti fungsional dari task/tugas yang
ada harus sesuai dengan tampilannya. misal untuk pilihan
report, orang akan langsung mengartikan akan ditampilkan
laporan. sehingga tampilan yang ada bukanlah tipe data (dari
sisi pemrogram).
4. Work Flow Compatibility, aplikasi bisa dalam satu tampilan
untuk berbagai pekerjaan. jika tampilan yang ada hanya
untuk satu pekerjaan saja. misal untuk kirim mail, maka
kita harus membuka tampilan tersendiri untuk daftar
alamat.
5. Consistency. Contohnya jika anda
menggunakan istilah save yang berarti
simpan, maka gunakan terus istilah tersebut.

6. Familiarity, Icon disket akan lebih familiar

jika digunakan untuk perintah menyimpan.

7. Simplicity, aplikasi harus menyediakan

pilihan default untuk suatu pekerjaan.

8. Direct Manipulation, manipulasi secara

langsung. Misalny untuk mempertebal
huruf, cukup dengan ctrl+B.

9. Control, berikan kontrol penuh pada

user, tipikal user biasanya tidak mau
terlalu banyak aturan.
10. WYSIWYG, What You See Is What You Get, buatlah
tampilan mirip seperti kehidupan nyata user. dan
pastikan fungsionalitas yang ada berjalan sesuai
tujuan.
11. Flexibility, tool/alat yang bisa digunakan user. jangan
hanya terpaku pada keyboard atau mouse saja.
12. Responsiveness, tampilan yang dibuat harus ada
responnya. misal, yang sering kita lihat ketika ada
tampilan please wait... 68%...
13. Invisible Technology. user tidak penting mengetahui
algoritma apa yang digunakan. Contohnya untuk
mengurutkan pengguna tidak perlu mengetahui
algoritma yang digunakan programmer (max sort, bubble
sort, quick sort, dst)
14. Robustness, handal. Dapat mengakomodir kesalahan
user. jangan malah error, apalagi sampai crash.
15. Protection, melindungi user dari kesalahan yang
umum dilakukan. misalnya dengan memberikan fitur
back atau undo.
16. Ease of Learning. aplikasi. mudah dipelajari.
17. Ease of use, aplikasi harus mudah digunakan
 Cara Pendekatan

Jenis program aplikasi:

• Special purpose software
• General purpose software
Special Purpose Software

• Yaitu program aplikasi untuk keperluan khusus dengan user

yang khusus pula (special purpose software)
• Kelompok user dapat dengan mudah diperkirakan, baik dari
segi keahlian maupun ragam antarmuka yang akan digunakan
• Mis: program inventori gudang, pengelolaan data akademis
mahasiswa, pelayanan reservasi hotel
• Pendekatan yang digunakan:
• User-centered design approach: perancang dan user bersama-sama
membuat tampilan antarmuka
• User design approach: hanya user yang membuat tampilan antarmuka
General Purpose Software

• Yaitu program aplikasi yang akan digunakan oleh berbagai

macam kalangan user

• Perancang dapat melakukan ‘pemaksaan’ kepada user untuk

menerima tampilan antarmukanya, walaupun dapat
memberikan dampak program tersebut tidak laku

• Salah satu cara yang dapat dilakukan adalah user dapat

melakukan perubahan tampilan sesuai dengan keinginannya
sendiri (customization), mis: merubah warna dasar,
pengaturan desktop, wallpaper, screensaver, dll
 Yang Terakhir.. Jangan lupa
Perlu Ada Penanganan
Kesalahan ....
• Validasi pemasukan data, mis: jika user harus memasukkan
bilangan positif, namun dia memasukkan data negatif atau nol,
maka harus ada mekanisme untuk mengulang pemasukan data
tersebut
• Proteksi user; program memberi peringatan ketika user melakukan
suatu tindakan secara tidak sengaja, mis: penghapusan berkas
• Pemulihan dari kesalahan: tersedianya mekanisme untuk
membatalkan tindakan yang baru saja dilakukan
Pertemuan 7
User Interface Design ( UID ) Tools
• Tugas untuk pertemuan 7 adalah :
- Buatlah 5 Kelompok
- Setiap kelompok membuat sebuah interface berupa
Pertama : Membuat“ logo “ dengan tema bebas, berikan
keterangan/penjelasan maksud dari logo tersebut ), logo
silahkan didesain dengan aplikasi yang dipahami seperti
photoshop dll ..
Kedua : Membuat sebuah interface bebas, wajib dibuat dengan
tool user Interface design seperti; Balsamic Mockups,
Mockplus, Mockplus idoc, Wireframe.cc dan lain sebagainya.

- Tugas dipresentasikan pada pertemuan 7.

Design dan Notasi Dialog-
Strategi Banyak Window
 Topik Bahasan
• Pengantar
• Perancangan window tunggal
• Perancangan banyak window
• Koordinasi dengan tightly-coupled windows
• Penjelajahan gambar dengan tightly-coupled
windows
• Window dan Web
 Pengantar
• Persoalan yang dihadapi banyak pemakai komputer:
– Perlu melihat lebih dari satu sumber dengan cepat dengan
cara yang tidak banyak mengganggu tugas.
– Pada tampilan besar, timbul masalah pergerakan mata dan
kepala serta visibility.
– Pada tampilan kecil, window terlalu kecil untuk dapat
efektif.
– Perlu memberikan informasi yang cukup dan keluwesan
untuk menyelesaikan tugas, sementara mengurangi aksi
window housekeeping, clutter yang mengalihkan
perhatian, pergerakan mata dan kepala.

3/25
 Pengantar (Lanj.)
• Jika tugas pemakai dimengerti dengan baik
dan umum, sangat mungkin strategi tampilan
banyak window dapat dikembangkan.
• Window housekeeping adalah aktivitas
mengurusi window yang berhubungan dengan
dunia komputer, tidak langsung berhubungan
dengan tugas pemakai.

4/25
 Perancangan Window Tunggal
• Window adalah bidang yang berisi program aplikasi
atau file dokumen, yang dapat dibuka dan ditutup,
diubah ukurannya, dan dipindah-pindahkan.
• Objek-objek antarmuka window:
– Judul (title) untuk identifikasi window.
– Bingkai (borders or frames) untuk menandai batas-batas
window.
– Scroll bars untuk menggulung (menggerakkan isi di bawah
window).

5/25
Perancangan Window Tunggal (Lanj.)

Judul
Scroll
bar

Bingkai

6/25
 Perancangan Window Tunggal (Lanj.)
• Aksi antarmuka window:
– Membuka (open action).
– Membuka, menempatkan dan menentukan ukuran (open,
place and size action).
– Menutup (close action).
– Mengubah ukuran (resize action).
– Memindahkan (move action).
– Membawa ke depan atau mengaktifkan (bring forward or
activation action).

7/25
Perancangan Window Tunggal (Lanj.)

8/25
 Perancangan Banyak Window
• Multiple monitors: Beberapa monitor digunakan untuk
menampilkan informasi.
• Rapid display flipping: Perpindahan di antara tampilan pada
satu monitor secara automatis atau dikendalikan pemakai.
• Split displays: Tampilan dibelah untuk menampilkan dua
bagian dokumen atau lebih, atau dua dokumen atau lebih.
• Space-filling tiling with fixed number, size, and place:
Pembelahan tampilan sederhana dengan jumlah, ukuran, dan
posisi tile selalu sama.

9/25
 Perancangan Banyak Window (Lanj.)
• Cascades: aplikasi
metafora
“tumpukan kartu”
dengan
mengurutkan
window secara
berundak.

10/25
 Koordinasi dengan Tightly-Coupled Windows

• Koordinasi adalah konsep tugas yang

menggambarkan bagaimana objek informasi
berubah berdasarkan pada aksi pemakai.
• Tight coupling di antara window adalah
konsep antarmuka yang mendukung
koordinasi.

11/25
 Koordinasi dengan Tightly-Coupled Windows
(Lanj.)
• Koordinasi generik yang dapat didukung oleh
pengembang antarmuka:
– Synchronized scrolling
– Hierarchical browsing
– Direct selection
– Two-dimensional browsing
– Dependent-windows opening
– Dependent-windows closing
– Save or open window state

12/25
 Synchronized Scrolling
• Scroll bar dari window yang satu dapat
dikaitkan dengan scroll bar lainnya. Gerakan
dari scroll bar yang satu menyebabkan yang
lainnya ikut menggulung isi window.
• Contoh: UltraEdit.

13/25
 Hierarchical Browsing
• Window yang satu berisi daftar isi atau daftar
pilihan yang jika dipilih akan menampilkan
isinya di window lainnya.
• Contoh: Windows Explorer.

14/25
 Direct Selection
• Mengklik ikon, kata pada tulisan, atau nama variabel
pada program memunculkan window yang
memperinci penjelasannya.
• Contoh: Windows Help.

15/25
 Two-Dimensional Browsing
• Menunjukkan
pandangan high-level
dari peta, grafik, foto,
atau gambar di sudut
yang satu, dan
rinciannya di window
yang lebih besar.
• Contoh: Peta dan
tampilan permainan
pada StarCraft.

16/25
 Dependent-Windows Opening &
Closing
• Dengan membuka
window, window-
window lainnya yang
tergantung dengannya
(dependent windows)
terbuka juga pada lokasi
yang dekat dan
memudahkan.
• Contoh: Toolbars pada
Adobe Photoshop.
• Menutup window dapat
menutup semua
dependent windows.
17/25
 Save or Open Window State
• Keadaan terakhir sistem meliputi window dan
isinya dapat disimpan.
• Contoh: Hibernation pada Windows 2000 dan
XP.

18/25
 Penjelajahan Gambar dengan Tightly-Coupled
Windows
• Perancangan image browsers harus dikendalikan oleh tugas
pemakai, yang dapat diklasifikasikan sebagai berikut:
– Pembuatan gambar. Membangun gambar besar atau
diagram.
– Eksplorasi open-ended. Penjelajahan untuk memperoleh
pemahaman atas peta atau gambar.
– Diagnostik. Pemindaian untuk cacat pada diagram
rangkaian, citra medis atau tataletak suratkabar.
– Navigasi. Memiliki pengetahuan atas overview, tetapi
perlu mengejar rincian di sepanjang jalan tol.
– Monitor: Lihat overview, dan jika terjadi masalah, zoom ke
rincian.

19/25
 Window dan Web
• Halaman Web dapat menampilkan informasi
dalam banyak window dengan cara:
– Menggunakan frames
– Menggunakan inline frame
– Membuka window baru.
– Menggunakan pop-up window
• Namun kenyataannya sering disalahgunakan.

20/25
 Window dan Web (Lanj.)
• Kelemahan frames (Jakob Nielsen 1996):
– Frame merusak model terpadu dari Web.
– Bookmark sulit.
– URL hanya menunjukkan alamat frameset sehingga tidak
berfungsi sebagai mekanisme pengalamatan lagi.
– Pencetakan sulit.
– Pembuatan sulit bagi pengembang Web.
– Search engine akan mengalami kesulitan.
– Situs Web jadi tidak dapat diterka: informasi muncul di
frame yang mana.
– Email dan transportasi sulit.

21/25
 Window dan Web (Lanj.)
• Kebutuhan pemakai untuk membuat bagian
halaman yang tidak bergulung dapat dilakukan
dengan HTML division dan CSS.
• Inline frame (iframe) tidak berbahaya karena
merupakan “bawahan” dari halaman utama.

22/25
 Window dan Web (Lanj.)
• Membuka window baru jika pemakai memilih
suatu link tidak disarankan (Nielsen 1999)
karena:
– Mengotori layar sementara OS mempunyai
manajemen window yang buruk.
– Tombol Back tidak bekerja.

23/25
 Window dan Web (Lanj.)
• Pop-up window
– Baik digunakan untuk:
• Context-sensitive help.
• Picker window (tambahan pada formulir isian dengan
fungsi pencarian dan pemilihan yang tidak dapat
dilakukan dengan komponen formulir biasa).
– Tidak baik digunakan untuk iklan atau promosi karena
pemakai telah mengembangkan kebiasaan pop-up
purges, yaitu menutup pop-up window sebelum selesai
dirender (Nielsen 1999).
– Karena itu sebaiknya tidak digunakan untuk
menampilkan informasi esensial.

24/25
Daya guna
Daya guna
adalah :
• Tingkat produk dapat digunakan yang ditetapkan
oleh user untuk mencapai tujuan secara efektif dan
tingkat kepuasan dalam menggunakannya (ISO,
1998).
• Daya guna merupakan salah satu faktor yang
digunakan untuk mengukur sejauh mana penerimaan
pengguna terhadap sistem

• Ukuran daya guna suatu sistem adalah sesuatu yang

subyektif/tergantung pandangan masing-masing.
Atribut daya guna (ISO 1998) terdiri
dari:
•Efektivitas
•Efisiensi
•Kepuasan
Faktor daya guna
Beberapa faktor yang menentukan bahwa suatu sistem itu “usable”
(boleh digunakan) :
• Efektifitas :
ketelitian dan kelengkapan yang mampu memenuhi apa yang
diinginkan.
• Learnabilitas :
mudah untuk dipelajari oleh user baru
• Efisiensi :
Seberapa baik sistem dalam membantu penghematan
• Memorabilitas :
• mudah di dalam menggunakan sistem dan perintah-perintahnya
mudah diingat.
• Kesalahan :
• tingkat kesalahan yang kecil.
• Kepuasan subjektif :
• bagaimana sistem nyaman digunakan.
Mengukur daya guna
• Pembelajaran (learnability)
• Keefisienan (efficiency)
• Kemampuan mengingat
(memorability)
• Kadar kesalahan (errors)
• Kepuasan (satisfaction)
• Presentasi (presentation)
• Susunan layar (screen layout)
• Istilah yang digunakan dan
perintah yang disediakan oleh
sistem
• Kemampuan sistem (system
capabilities).
 Metode Pengukuran Rekayasa Daya Guna

• Pembangunan sistem komputer biasanya melibatkan

dua proses pengumpulan data :
• Pembahasan :
• Untuk membantu dalam membuat keputusan awal
atas rekayasa bentuk antarmuka pengguna yang
dilakukan pada awal fase.
• Pengujian :
• Untuk menilai keputusan rekayasa bentuk yang
telah dibuat sebagai prototipe sistem, serta
meningkatkan daya guna sistem dengan
mengurangi masalah pada daya guna.
 Metode Pengukuran Rekayasa Daya Guna

• Pembahasan dan pengujian daya guna yang dilakukan

dengan benar akan memberi manfaat penghematan biaya
pembangunan sistem.

• Sistem yang mempunyai daya guna tinggi dapat

mengurangi biaya pelatihan, support consume dan
meningkatkan kepuasan pengguna.
 Daya guna HEURISTIK
merupakan prinsip atau panduan yang digunakan untuk
merekayasa bentuk user interface dengan 10 prinsip :

• Dialog yang sederhana dan alami
(simple and natural dialogue)
• Berbicara dengan bahasa user
(speak the user language)
• Mengurangi beban ingatan user
(minimize user memory load)
• Konsisten (consistency)
• Sistem timbal balik (system
feedback)
• Jalan keluar yang jelas (clearly
mark exit)
• Jalan pintas (shortcut)
• Pesan-pesan kesalahan yang
baik (good error message)
• Mencegah kesalahan (prevent
errors)
• Bantuan dan dokumentasi (help
and documentation)
1. Dialog yang Sederhana dan Alami
• User interface harus seringkas mungkin dan bersifat
natural.
• Setiap dialog seharusnya menghindari perintah-
perintah yang tidak perlu dan tidak ada hubungannya
dengan interface.
• Setiap ciri atau elemen baru yang ditambahkan berarti
satu masalah baru yang harus dipelajari oleh pengguna.
• Hanya menampilkan perintah yang diperlukan
• Memperhatikan bentuk elemen grafik (user
interface modern)
• Penggunaan warna yang baik dan tidak
berlebihan (sbg kategori, pembeda, penonjolan
objek tertentu)
• Desain layar dalam bentuk yang lebih ringkas
• Dialog yang natural
 2. Berbicara dengan Bahasa Pengguna
• Penggunaan singkatan dan
• Dialog seharusnya bahasa yang tidak jelas juga
menggunakan bahasa yang harus dihindari karena dapat
dipahami oleh user. disalah tafsirkan sehingga
• Perintah-perintah yang membuat user keliru
berorientasi mesin • Penggunaan metafora merupakan
mestinya tidak digunakan salah satu pendekatan yang boleh
sama sekali. digunakan.
• Selain itu frasa-frasa yang • Objek yang tampil di layar, jenis
digunakan harus mudah perintah, jenis interaksi
dipahami kebanyakan user, pengguna, cara sistem
bukan hanya segelintir memberikan feedback dan
saja. sebagainya adalah berdasarkan
frasa yang biasa digunakan,
misalnya desktop, icon, menu,
cut, copy and paste.
3. Mengurangi Beban Ingatan Pengguna

• User seharusnya tidak dibebani untuk mengingat

atau menghapal pada saat berinteraksi dengan
sistem.
• Sebagai contoh penggunaan menu dapat mengurangi
beban user dibandingkan penggunaan baris perintah.
• Aplikasi yang menggunakan menu lebih memuaskan
dan fleksibel.
• Dalam kasus-kasus tertentu format perintah perlu
disampaikan dengan jelas, misalnya perintah DOS
untuk menghapus dengan del dan membuat
duplikasi dengan perintah copy
4. Konsisten
•?
5. Sistem Timbal Balik
• Sistem seharusnya memberitahu pengguna segala
aktifitas yang sedang berlaku atau status dari sistem
(menunggu input dari pengguna, memproses input,
menampilkan output, dan sebagainya).
• Jangka waktu suatu umpan balik bergantung pada
kondisi dan fungsi yang memerlukannya.
• Dalam fungsi dan operasi, user interface juga akan
memberitahu status suatu sistem jika terjadi suatu
kerusakan, misalnya status bar pada Microsoft word.
6. Jalan Keluar yang Jelas
• Sistem seharusnya dapat memberikan penjelasan
tentang kondisi dan solusi untuk menghindari user
terperangkap dalam aktivitas/situasi, dan tampilan-
tampilan yang tidak diinginkan, pada saat berinteraksi
dengan sistem.
• Apabila user melakukan kesalahan dalam memilih
perintah maka ia dapat keluar dari kesalahan tanpa ada
masalah, misalnya perintah Undo.
7. Jalan Pintas
• Demi kemudahan dan kecepatan interaksi di dalam
menggunakan suatu sistem maka sudah seharusnya
bila tersedia shortcut.
• Berguna untuk membantu user agar dapat
menggunakan berbagai fungsi dengan mudah.
• Jalan pintas yang sering digunakan adalah seperti
aplikasi yang tersedia di desktop yang dengan
double click mouse maka aplikasi bisa dijalankan.
8. Pesan Kesalahan yang Baik (error message)
•Menyediakan mekanisme pemberitahuan
kesalahan dan menunjukkan situasi bahwa user
berada dalam kondisi bermasalah serta membantu
user untuk lebih memahami sistem.
•Terdapat empat peraturan yang harus diikuti
dalam penggunaan pesan kesalahan, yaitu :
•Pesan kesalahan yang digunakan harus jelas dan
mudah dipahami, disampaikan dalam bentuk
teks, frasa atau konsep yang mudah dipahami
•Pesan yang disampaikan bersifat khusus
•Pesan kesalahan yang disampaikan sebaiknya
menyediakan cadangan penyelesaian atas
kesalahan
•Penyampaian kesalahan dilakukan secara
sopan.
contoh Error Message
9. Mencegah Kesalahan
• Rekayasa interface
yang baik seharusnya
mampu membuat
user menghindari
kesalahan.
• Misalnya interaksi
dengan
menggunakan menu.
10. Bantuan dan Dokumentasi
• Merupakan kemudahan yang
diberikan dalam kebanyakan
sistem, menjelaskan cara
menggunakan sistem, ciri-
ciri khusus sistem, dan
membolehkan user untuk
mengendalikan sistem
dengan lebih baik.
TEKNIK DAYA GUNA SIKLUS HIDUP
• Siklus hidup suatu daya guna memiliki tujuh elemen, antara lain :
• Kenali Pengguna (Know the user)
• Daya guna Benchmarking
• Desain Interaksi Berorientasi Tujuan (Goal-Oriented Interaction Design)
• Interactive Design
• Prototyping
• Daya guna evaluasi (Inspection and Testing)
• Studi Lanjutan (Follow-Up Studies)
TEKNIK DAYA GUNA SIKLUS HIDUP
1. Kenali Pengguna (Know the User)

• Mengenal siapa user adalah langkah pertama dalam pembahasan daya

guna.
• Bertujuan untuk :
• Mempelajari, mengenali dan memahami pengguna yang akan menggunakan
sistem
• Merangkum keperluan user
• Kepuasan
• Kemahiran komputer dari pengguna
TEKNIK DAYA GUNA SIKLUS HIDUP
1. Kenali Pengguna (Know the User)
• Pengetahuan tentang tingkat pendidikan, umur,
pengalaman kerja dan pengetahuan umum komputer
adalah penting untuk memahami user.
• Oleh karena itu perlu dilakukan hal-hal sebagai
berikut:
• Riset, seperti pengamatan dan wawancara
• Mengklasifikasikan user berdasarkan perilaku dan variabel
demografis (lingkungan)
• Identifikasi tujuan user dan attitude
• Menganalisa aliran kerja dan konteks kerja
• Menyusun tipikal skenario user
TEKNIK DAYA GUNA SIKLUS HIDUP
1. Kenali Pengguna (Know the User)

• Kurva pembelajaran :
• Mendesain sistem difokuskan kepada user yang
sudah berpengalaman
• Menekankan pada pengguna yang berpengalaman
• Dalam beberapa kasus perlu dipelajari tentang
pengguna baru dengan memberikan menu, dialog
dan perintah (scripting language) yang banyak
untuk mengarahkan user baru ke user
berpengalaman.
TEKNIK DAYA GUNA SIKLUS HIDUP
1. Kenali Pengguna (Know the User)

• Riset merupakan kerangka acuan untuk mendesain suatu perangkat

lunak, oleh karena itu perlu dilakukan wawancara terhadap :
• Staf proyek (manajer, bagian pemasaran), siapa yang bertanggung jawab
terhadap pengembangan perangkat lunak.
• Pelanggan.
TEKNIK DAYA GUNA SIKLUS HIDUP
1. Kenali Pengguna (Know the User)
•Tujuan wawancara dengan staf proyek:
•Visi produk
•Anggaran belanja dan jadwal
•Persepsi tentang siapa penggunanya
TEKNIK DAYA GUNA SIKLUS HIDUP
1. Kenali Pengguna (Know the User)

• Tujuan wawancara dengan pelanggan karena:

• Pelanggan adalah orang yang membuat keputusan untuk
membeli.
• Tujuan membeli produk.
• Proses mengambil keputusan untuk membeli.
TEKNIK DAYA GUNA SIKLUS HIDUP
1. Kenali Pengguna (Know the User) :
Riset terhadap pengguna akhir
• Untuk mengetahui keinginan end user, maka perlu
dilakukan riset dengan cara :
• Tools observasi apa yang sering mereka gunakan dalam
lingkungan kerja
• Wawancara dengan asumsi untuk belajar dari mereka
• Alternatif antara observasi kerja dan diskusi detail dari suatu
produk
TEKNIK DAYA GUNA SIKLUS HIDUP
1. Kenali Pengguna (Know the User) :
Riset terhadap pengguna akhir

• Setelah wawancara dan observasi terhadap user secara umum, maka akan
didapat gambaran terhadap calon pengguna dari suatu sistem.
• Perlu diperhatikan siapa yang akan menggunakan produk yang sedang
dibuat:
• Siapa tipe user yang menggunakan produk?
• Apa-apa yang mereka butuhkan dari suatu produk?
• Di lingkungan mana produk digunakan?
• Apa yang perlu difokuskan dari suatu produk?
TEKNIK DAYA GUNA SIKLUS HIDUP
2. Daya guna Benchmarking / Aktifitas yang
digunakan manajemen dimana suatu unit kerja
membandingkan, mengukur hasil kerjanya
dengan unit kerja lain baik dalam maupun luar.

 Produk-produk kompetitif atau produk yang telah ada perlu dipelajari

untuk memperbaiki sistem yang sedang dibangun.
 Analisis perbandingan di antara beberapa produk bisa menghasilkan
keputusan yang lebih baik, bahkan bisa menghasilkan panduan baru dan
memberi cadangan ide yang lebih baik terhadap rekayasa bentuk.
TEKNIK DAYA GUNA SIKLUS HIDUP
2. Daya guna Benchmarking

• Untuk menetapkan sasaran daya guna dan menentukan metrik daya guna
serta tingkat ukur daya guna dengan contoh :
• Sistem mempunyai kesalahan 4,5 % setiap satu jam ketika digunakan
oleh user ahli. Untuk versi berikutnya mempunyai tingkat kesalahan 3%
setiap satu jam
TEKNIK DAYA GUNA SIKLUS HIDUP
3. Desain Interaksi Berorientasi Tujuan

• Cara kerja komputer tidak sama dengan manusia.

• Bentuk interface harus bisa menyesuaikan dengan permintaan manusia.
 TEKNIK DAYA GUNA SIKLUS HIDUP
3. Desain Interaksi Berorientasi Tujuan (Komputer vs Manusia)
Komputer Manusia
Incredibly fast/ Sangat Cepat Incredibly slow / Lambat

Error free/ Bebas Kesalahan Error prone / Rawan Salah

Deterministic / pasti terjadi Irasional

Alfabethic / Tersusun Emosional

Sequential / Output Bergantung Random
pada Input
Predictable / Sesuai prediksi Unpredictable
Amoral / Tanpa Moral Ethical
Stupid / Tidak Cerdas Intelligent
 TEKNIK DAYA GUNA SIKLUS HIDUP
3. Desain Interaksi Berorientasi Tujuan (Programmer vs User)

Setiap interface selalu memiliki ciri khas masing-masing

karena programmer yang berbeda.
Programmer (homo logicus) beripikir dan bertindak dengan
cara yang berbeda dari manusia normal (homo sapiens) dan
kebanyakan user.
Programmer User
Ingin mengontrol dan Ingin sesuatu yang simpel dan
mendapatkan akses yang lengkap menginginkan sedikit kontrol

Ingin mengerti jika terdapat Ingin berhasil dan ingin sedikit

beberapa kesalahan paham atas kesalahan

Berkaitan dengan berbagai kasus Berkaitan dengan permasalahan

dan ingin melakukan dan mengalami stres
pengembangan
TEKNIK DAYA GUNA SIKLUS HIDUP
3. Desain Interaksi Berorientasi Tujuan
• Desain interface mengacu ke fungsi, perilaku dan presentasi
yang telah final.
• Tujuan dari desain interaksi adalah tujuan akhir dari penelitian.
• Task (tugas) bukanlah tujuan. Contoh :
• Tujuan : mendapatkan sesuatu untuk dimakan
• Task (tugas) : pergi ke restoran, memesan makanan delivery
atau berbelanja bahan makanan untuk dimasak
• Software hanya untuk melakukan tugas, bukan untuk
melakukan tujuan.
• Tugas berubah seiring dengan perkembangan teknologi.
TEKNIK DAYA GUNA SIKLUS HIDUP
4. Interactive Design
• Bertujuan untuk desain, tes dan re-desain, kemudian membangun
prototipe interface dengan cara :
•Menemukan masalah daya guna
•Menetapkan masalah untuk interface baru :
•Mengikuti dasar pemikiran desain, mengapa
perubahan dibuat
•Mengevaluasi interface
TEKNIK DAYA GUNA SIKLUS HIDUP
5. Prototyping

 Membangun suatu prototipe, seperti :

 Penjelasan verbal
 Prototipe di atas kertas
 Kerja dari prototipe
 Implementasi dari final desain
TEKNIK DAYA GUNA SIKLUS HIDUP
6. Daya guna evaluasi (usability evaluation)

 Daya guna inspeksi (pemeriksaan kinerja)

 Memeriksa interface dengan menggunakan metode heuristik
dan memberikan nilai terhadap interface tersebut (tidak
berhubungan dengan user)
 Daya guna pengujian (pengujian kinerja)
 Uji coba secara empiris atas desain interface dengan user
TEKNIK DAYA GUNA SIKLUS HIDUP
7. Studi Lanjutan(Follow-Up Studies)

 Dilakukan dengan :
 Studi dengan cara wawancara, daftar pertanyaan, pengamatan
 Studi pasar berkaitan dengan apa kata orang tentang sistem
yang dibangun
 Instrumentasi software
 Menganalisis keluhan user, permintaan, dan laporan tentang
adanya bug
 TEKNIK DAYA GUNA SIKLUS HIDUP
B.Tujuan Personal dan Tujuan Perusahaan
Personal Goal Corporate
• Tujuan personal dan tujuan
Goal
perusahaan memiliki perbedaan
yang sangat mendasar. Agar tidak Meningkatkan
keliatan bodoh profit
• Keduanya memiliki ekspresi
yang tinggi untuk mencapai Agar tidak Meningkatkan
tujuan. membuat pemasaran
kesalahan
• Tujuan personal berorientasi ke
profit pribadi sedangkan tujuan Mendapatkan Bertahan dalam
perusahaan lebih kepada pekerjaan yang kompetisi
layak
pemasaran dan profit.
Mendapatkan Menyewa banyak
kesenangan orang

Go public
TEKNIK DAYA GUNA SIKLUS HIDUP
C. Proses Desain Interaksi

• Agar proses desain interaksi dapat mencapai tujuan maka harus

dilakukan hal-hal berikut :
a. Wawancara user
b. Membuat persona
c. Menjelaskan tujuan
d. Membuat skenario yang jelas
e. Solusi desain
TEKNIK DAYA GUNA SIKLUS HIDUP
b. Proses Desain Interaksi : Membuat Persona

 Persona adalah suatu karakteristik yang diamati oleh orang lain

atau disebut juga dengan prototypical user, seperti :
 Imajinasi khusus, contohnya adalah user dengan tipe tertentu
 Tidak real tetapi hipotesis
 Digunakan sebagai rule play melalui desain interface
 Contoh persona adalah perusahaan mobil yang mendesain
produknya.
TEKNIK DAYA GUNA SIKLUS HIDUP
b.Proses Desain Interaksi : Membuat Persona

 Kriteria pemrogram yang memiliki persona yang baik adalah :

 Membuat program untuk rata-rata user, tidak hanya end user
dengan tujuan agar user baru selalu mempelajarinya.
 Sifat user selalu elastis yang didefinisikan sebagai
penampung ide-ide si pemrogram
 Pemrogram juga harus memperhatikan semua latar belakang
user yang akan menggunakan program yang akan dibuat
karena setiap individu memiliki persona yang berbeda.
TEKNIK DAYA GUNA SIKLUS HIDUP
b. Proses Desain Interaksi : Membuat Persona

 Untuk mencari primary persona dan secondary persona

dilakukan dengan mengumpulkan persona dalam jumlah banyak
yang kemudian dikombinasikan, sementara persona duplikat
dibuang.
 Primary persona tidak akan membuat yang lain puas karena
hanya memuaskan sebagian.
 Secondary persona lebih memuaskan karena menggunakan
interface khusus dan memerlukan tambahan desain.
TEKNIK DAYA GUNA SIKLUS HIDUP
b. Proses Desain Interaksi : Membuat Persona
• Studi kasus :
• adalah inflight entertainment system disebut juga inflight
untuk penerbangan. Setiap tempat duduk di pesawat memiliki
video layar sentuh didukung oleh komputer dan harddisk
berkapasitas besar.
• inflight console pada perusahaan pesawat terbang yang
didesain sesuai untuk banyak persona sehingga diharapkan
dapat memuaskan setiap penumpang. Mereka dapat mengisi
waktu dengan menonton film, bermain game, belanja online,
melihat berita dan mendengarkan musik.
TEKNIK DAYA GUNA SIKLUS HIDUP
Proses Desain Interaksi : Kekuatan Persona Sebagai Suatu Alat Desain

• Persona membantu para perancang untuk :

• Menentukan apakah suatu produk diperlukan dan
bagaimana cara kerjanya
• Menyediakan bahasa suatu umum untuk mendiskusikan
keputusan desain dan membantu proses desain
• Mengurangi kebutuhan akan model diagramatik yang rumit
• Efektifitas desain dapat diuji
• Dapat melihat target yang diinginkan karena telah diuji
coba terlebih dahulu
TEKNIK DAYA GUNA SIKLUS HIDUP
Proses Desain Interaksi : Kekuatan Persona Sebagai Suatu Alat Desain

• Masalah yang dapat timbul selama pengembangan suatu produk

:
• User bersifat elastis, meski hari ini user telah puas dengan
produk yang digunakan belum tentu esok hari juga merasa
puas. Oleh sebab itu masih ada tahap selanjutnya yaitu
pengembangan produk yang telah jadi
• Percaya diri, karena jika ragu-ragu untuk meluncurkan
produknya maka produk tersebut tidak akan pernah ada di
pasaran
TEKNIK DAYA GUNA SIKLUS HIDUP
Proses Desain Interaksi : Kekuatan Persona Sebagai Suatu Alat
Desain
Solusi yang baik untuk suatu rekayasa interface :
• Parallel design :
• Melibatkan banyak rekayasa bentuk paralel.
• Memberi peluang untuk memilih rekayasa bentuk awal dari berbagai
alternatif pengembangan
• Brainstorming :
• Brainstorming dengan suatu tim, misal ahli mesin, desainer grafik, penulis
dan sebagainya
• Menggunakan kertas hasil desain yang banyak dan menempelkannya di
dinding
• Menggambar, coret-coret dengan pulpen berwarna
• Bersifat masa bodoh
• Berkhayal untuk membangun suatu yang sulit dan berpikir jauh ke depan
• Semua ide yang berhasil dikumpulkan kemudian diorganisasikan dan dipilih
salah satu yang terbaik dan diimplementasikan
TEKNIK DAYA GUNA SIKLUS HIDUP
Proses Desain Interaksi : Kekuatan Persona Sebagai Suatu Alat Desain
TEKNIK DAYA GUNA SIKLUS HIDUP
Proses Desain Interaksi : Kekuatan Persona Sebagai Suatu Alat Desain

• Aturan waktu melakukan brainstorming :

• Semua ide dikumpulkan dari semua orang dalam tim dan tidak
boleh dikritik oleh orang lain
• Semua ide yang masuk, baik yang masuk akal maupun tidak
harus diterima. Semakin banyak ide yang masuk semakin baik
• Tidak boleh ada diskusi selama brainstorming berjalan karena
diskusi akan dilakukan setelah brainstorming selesai
• Jangan mengkritik, menghakimi atau mentertawakan ide yang
dikemukakan peserta
• Tulis semua ide pada papan tulis sehingga tim bisa melihat
• Atur waktu untuk aktivitas brainstorming misalnya 30 menit
atau lebih
TEKNIK DAYA GUNA SIKLUS HIDUP
Proses Desain Interaksi : Kekuatan Persona Sebagai Suatu Alat Desain

• Urutan dalam brainstorming :

• Salah satu tim harus me-review topik yang digunakan dengan
pertanyaan Why, How atau What
• Setiap anggota tim harus memikirkan jawaban atas pertanyaan untuk
beberapa saat dan mencatatnya di kertas
• Setiap orang membacakan idenya atau semua ide ditulis di papan tulis

• Membuat pilihan akhir :

• Bila semua ide telah dicatat dan dikombinasikan dengan ide-ide yang
mungkin, kategori awal harus tetap disepakati
• Jumlah ide yang ada
• Voting anggota digunakan untuk membuat sejumlah ide yang akan
didiskusikan. Isi daftar tidak boleh lebih dari sepertiga jumlah ide
•Pertemuan 12 QUIS Terakhir ....
Pertemuan 13 dan 14

- Buatlah kelompok yang dibagi kedalam 4 kelompok.

- Setiap kelompok membuat sebuah program ( web / aplikasi ) sederhana
dengan tema bebas namun dengan tetap memperhatikan Faktor Rek-in,
Faktor bidang ilmu, Komponen Rek-in (warna), Daya guna maupun
Teknik Daya Guna Siklus Hidup.
- Program yang dibuat akan dipresentasikan pada pertemuan 13 dan 14,
namun pada pertemuan 13 semua kelompok telah menyelesaikan
tugasnya karna kelompok yang terlebih dahulu presentasi akan saya
tentukan pada hari “H”.
Pertemuan 13 dan 14

- Buatlah kelompok yang dibagi kedalam 4 kelompok.

- Setiap kelompok membuat sebuah program ( web /
aplikasi ) sederhana dengan tema bebas namun
dengan tetap memperhatikan Faktor Rek-in, Faktor
bidang ilmu, Komponen Rek-in (warna), Daya guna
maupun Teknik Daya Guna Siklus Hidup.
- Program yang dibuat akan dipresentasikan pada
pertemuan 13 dan 14, namun pada pertemuan 13 semua
kelompok telah menyelesaikan tugasnya karna
kelompok yang terlebih dahulu presentasi akan saya
tentukan pada hari “H”.
Evaluasi
Evaluasi merupakan tes atas tingkat
penggunaan dan fungsionalitas sistem.
Evaluasi dilakukan untuk memastikan
kecocokan dengan permintaan
pengguna/tujuan pengguna dan untuk
melihat apakah hasil rancangan dengan
proses uji coba system yang telah dibuat
sesuai dengan user. Proses evaluasi ini
dikerjakan dalam satu fase proses
perancangan tetapi melalui perancangan
dengan prinsip life cycle dengan hasil
dikembalikan untuk memodifikasi
perancangan.
• Tujuan adanya evaluasi yaitu :
a.Melihat seberapa jauh sistem berfungsi.
Desain sistem memungkinkan user melakukan
tugas dengan lebih mudah. Desain tidak hanya
membuat fungsionalitas yang sesuai dengan
yang ada dalam sistem, tetapi juga
memberikan kemudahan pada user untuk
dapat melakukan aksi. Evaluasi pada tahap ini
meliputi pengukuran unjuk kerja dari user
untuk melihat keefektifan sistem dalam
mendukung tugas.
b.Melihat efek interface bagi pengguna.
Usability atau Kemudahan untuk mempelajari
sistem dan perilaku user.
c. Mengidentifikasi problem khusus yang terjadi
pada sistem, misal: ketika menggunakan
konteks yang diinginkan tapi hasilnya tidak
sesuai atau terjadi kekacauan diantara user. Ini
tentunya berhubungan dengan usability dan
fungsionalitas dari sistem (bergantung dari
sebab masalah).
• Jenis evaluasi dibedakan menjadi 2 yaitu :
a. Summative evaluation. Evaluasi yang
dilakukan untuk menguji kesuksesan suatu
produk yang sudah selesai yaitu mencapai
standar yang ditentukan sebelumnya
b. Formative evaluation. Evaluasi yang dilakukan
selama desain untuk memastikan produk
sesuai dengan yang diinginkan pengguna.
 Tempat untuk melakukan evaluasi dapat
dilakukan di laboratorium dan di lapangan/
lokasi kerja pengguna sistem. Waktu evaluasi
dilakukan ketika muncul produk baru atau
perbaikan dari produk sebelumnya.
1. Mengevaluasi Perancangan
Evaluasi ini terjadi setelah proses
perancangan. Secara ideal, evaluasi pertama
dilakukan sebelum implementasi dimulai. Jika
perancangan dievaluasi, kesalahan dapat
dihindari karena perancangan dapat diperbaiki
sebelumnya.
• Dimisalkan kita akan membuat paket pengolahan kata baru yang menggunakan
icon untuk presentasinya. Ada 2 jenis perancangan icon akan digunakan yang
paling mudah bagi user. Jenis pertama menggunakan gambar natural (berdasarkan
metapora dari dokumen kertas), jenis yang lain menggunakan gambar abstrak
seperti terlihat pada gambar di atas. Yang pertama harus dilakukan adalah
membentuk hipotesis : tampilan yang seperti apa yang diinginkan? Pada kasus ini
kebanyakan user akan mengambil gambar natural sebagai icon yang lebih mudah
dalam pemanggilan, karena lebih familiar bagi user. Hipotesis ini
mengidentifikasikan variabel independent untuk eksperimen, natural dan
abstrak. Pada pertimbangan variabel dependent, pengukuran ”lebih mudah”
dilihat dari jumlah kesalahan dalam memilih dan waktu yang digunakan untuk
memilih sebuah icon. Kontrol ekperimen dilakukan dengan membuat
interface yang identik dengan perancangan icon dan tugas pemilihan dibuat yang
dapat diulang untuk setiap kondisi. Kemudian metode eksperimen dilakukan
dengan menggunakan kelompok user yang dimaksud. Mengingat pembelajaran
terlibat dalam eksperimen ini, maka perancangan within-groups digunakan dimana
setiap user menggunakan kedua set icon tersebut. Kemudian hasil eksperimen
secara detail dianalisis.
2.Mengevaluasi Implementasi/Evaluasi
Eksperimen
.............................................................................
..........................................................................
...............................................................