INTERAKSI MANUSIA DAN KOMPUTER

INTERAKSI  MANUSIA DAN KOMPUTER

Pengampu  : Idhawati Hestiningsih

PENDAHULUAN / DEFINISI

• Bidang ilmu interaksi manusia dan komputer adalah ilmu yang mempelajari tentang bagaimana

mendesain, mengevaluasi, dan mengimplementasikan sistem komputer yang interaktif sehingga

dapat digunakan oleh manusia dengan mudah. 

• Pengertian Interaksi 

=  komunikasi 2 arah antara manusia (user) dan sistem komputer.

Interaksi menjadi maksimal apabila kedua belah pihak mampu memberikan stimulan dan respon

(aksi & reaksi) yang saling mendukung, jika salah satu tidak bisa, maka interaksi akan mengalami

hambatan atau bahkan menuju pembiasan tujuan.

• Definisi interaksi manusia dan komputer

=  sebuah hubungan antara manusia dan komputer  yang mempunyai karakteristik tertentu untuk

mencapai suatu tujuan tertentu dengan menjalankan sebuah sistem yang bertopengkan sebuah

antarmuka (interface).

• Prinsip kerja komputer = input Æ   proses Æ  output 

Kepada komputer diberikan data yang umumnya berupa deretan angka dan huruf. Kemudian diolah

didalam komputer yang menjadi keluaran sesuai dengan kebutuhan dan keinginan manusia.

Tanpa disadari kita (manusia/user) telah berinteraksi atau berdialog dengan sebuah benda (layar

monitor), yaitu dalam bentuk menekan tombol berupa tombol angka dan huruf yang ada pada

keyboard atau melakukan satu sentuhan kecil pada mouse. 

Yang kemudian hasil inputan ini akan berubah bentuk menjadi informasi atau data yang seperti

diharapkan manusia dengan tertampilnya informasi  baru tersebut pada layar monitor atau bahkan

mesin pencetak (printer)

• Manusia pada umumnya tidak pernah tahu apa yang terjadi pada saat data dimasukkan ke dalam

kotak cpu melalui keyboard. Manusia (user) selalu terfokus pada monitor/printer sebagai keluaran.

• Manusia jarang sekali menyadari proses interaksi dengan komputer. Manusia baru menyadari

proses interaksi tersebut saat menemukan masalah dan tidak menemukan solusi pemecahannya. 

Biasanya manusia menyalahkan antarmuka  yang kurang inovatif, kurang menarik, kurang

komunikatif.

• Interaksi bisa dikatakan dialog antara user dengan komputer. 

Model atau jenis interaksi, antara lain :

1. Command line interface (perintah baris tunggal)

contoh : unix, linux, dos

2. Menu  (menu datar dan menu tarik)

contoh : hampir semua software menggunakan menu

3. Natural language (bahasa alami)

contoh : bahasa pemrograman terstruktur (belum objek)

4. Question/answer and query dialogue 

contoh : mysql, dbase interaktif, dll

5. Form-fills and spreadsheets 

contoh : excel, lotus, dll

6. WIMP 

-  Windows Icon Menu Pointer

-  Windows Icon Mouse Pulldown Menu

yang termasuk komponen WIMP : button, dialogue boxes, pallettes, dll  2

BIDANG STUDI/ILMU YANG BERPERAN

• Tujuan utama disusunnya berbagai cara interaksi manusia & komputer : 

untuk mempermudah manusia dalam mengoperasikan komputer dan mendapatkan berbagai umpan

balik yang ia perlukan selama ia bekerja pada sebuah sistem komputer.

• Para perancang antarmuka manusia dan komputer berharap agar sistem komputer yang

dirancangnya dapat bersifat akrab dan ramah dengan penggunanya (user friendly).

• Untuk membuat antarmuka yang baik dibutuhkan pemahaman beberapa bidang ilmu, antara lain :

1. Teknik  elektronika & ilmu  komputer  

=memberikan  kerangka  kerja  untuk  dapat  merancang  sistem  HCI

2. Psikologi  

memahami  sifat & kebiasaan, persepsi & pengolahan kognitif, ketrampilan motorik  pengguna

3. Perancangan  grafis  dan  tipografi  

= sebuah  gambar  dapat  bermakna  sama  dengan  seribu  kata. Gambar  dapat digunakan

sebagai  sarana  dialog  cukup  efektif  antara  manusia & komputer

4. Ergonomik

= berhubungan dengan aspek fisik untuk mendapatkan lingkungan kerja yang nyaman, misal :

bentuk meja & kursi kerja, layar tampilan, bentuk keyboard, posisi duduk, pengaturan lampu,

kebersihan tempat kerja

5. Antropologi

= ilmu pengetahuan tentang manusia, memberi  suatu  pandangan   tentang cara kerja

berkelompok yang masing – masing anggotanya dapat memberikan konstribusi sesuai dengan

bidangnya

6. Linguistik

= merupakan cabang ilmu yang mempelajari  tentang bahasa. Untuk melakukan dialog

diperlukan sarana komunikasi yang memadai berupa suatu bahasa khusus, misal bahasa grafis,

bahasa alami, bahasa menu, bahasa perintah

7. Sosiologi 

= studi tentang pengaruh sistem manusia-komputer dalam struktur sosial, misal adanya PHK

karena adanya otomasi kantor.

PRINSIP UTAMA MENDESAIN ANTARMUKA (INTERFACE)

Berikut ini beberapa hal yang menjadi prinsip utama mendesain antarmuka yang baik dengan

memperhatikan karakteristik manusia & komputer :

1. User compatibility

• Antarmuka merupakan topeng dari sebuah sistem atau sebuah pintu gerbang masuk ke sistem

dengan diwujudkan ke dalam sebuah aplikasi software.

• Oleh karena itu sebuah software seolah-olah mengenal usernya, mengenal karakteristik usernya,

dari sifat sampai kebiasaan manusia secara umum.

• Desainer harus mencari dan mengumpulkan berbagai karakteristik serta sifat dari user karena

antarmuka harus disesuaikan dengan user yang jumlahnya bisa jadi lebih dari 1 dan mempunyai

karakter yang berbeda.

• Hal tersebut harus terpikirkan oleh desainer dan tidak dianjurkan merancang antarmuka dengan

didasarkan pada dirinya sendiri 

• Survey adalah hal yang paling tepat

2.  Product compatibility

• Sebuah aplikasi yang bertopengkan antarmuka harus sesuai dengan sistem aslinya.

• Seringkali sebuah aplikasi menghasilkan hasil yang berbeda dengan sistem manual atau sistem

yang ada. 

• Hal tersebut sangat tidak diharapkan dari perusahaan karena dengan adanya aplikasi software

diharapkan dapat menjaga produk yang dihasilkan dan dihasilkan produk yang jauh lebih baik.

• Contoh : aplikasi sistem melalui antarmuka diharapkan menghasilkan  report/laporan serta

informasi yang detail dan akurat dibandingkan dengan sistem manual.

3.  Task compatibility 

• Sebuah aplikasi yang bertopengkan antarmuka  harus mampu membantu para user dalam

menyelesaikan tugasnya. Semua pekerjaan serta tugas-tugas user harus diadopsi di dalam

aplikasi tersebut melalui antarmuka.  3

• Sebisa mungkin user tidak dihadapkan dengan kondisi memilih dan berpikir, tapi user

dihadapkan dengan pilihan yang mudah dan proses berpikir dari tugas-tugas user dipindahkan

dalam aplikasi melalui antarmuka.

• Contoh : User hanya klik setup, tekan tombol  next, next, next, finish, ok  untuk menginstal

suatu sotfware.

4.  Work flow compatibility 

• Sebuah aplikasi sistem sudah pasti mengapdopsi  sistem manualnya dan didalamnya tentunya

terdapat urutan kerja dalam menyelesaikan pekerjaan.

• Dalam sebuah aplikasi, software engineer  harus memikirkan berbagai runutan-rununtan

pekerjaan yang ada pada sebuah sistem. 

• Jangan sampai user mengalami kesulitan dalam menyelesaikan pekerjaannya karena user

mengalami kebingungan ketika urutan pekerjaan yang ada pada sistem manual tidak ditemukan

pada software yang dihadapinya.

• Selain itu user jangan dibingungkan dengan pilihan-pilihan menu yang terlalu banyak dan 

semestinya menu-menu merupakan urutan dari runutan pekerjaan.

• Sehingga dengan workflow compatibility dapat  membantu seorang user dalam mempercepat

pekerjaannya. 

5.  Consistency 

• Sebuah sistem harus sesuai dengan sistem nyata serta sesuai dengan produk yang dihasilkan.

• Banyak perusahaan dalam menjalankan sistemnya menggunakan aplikasi sistem yang berbeda

di setiap divisi dalam perusahaan tersebut. Ada pula yang menggunakan aplikasi yang sama di

divisi yang berbeda Æ  seringkali keseragaman dalam menjalankan sistem tidak diperhatikan

• Oleh karena itu software engineer harus memperhatikan hal-hal yang bersifat konsisten pada

saat merancang aplikasi khususnya antarmuka, contoh : penerapan warna, struktur menu, font,

format desain yang seragam pada antarmuka di berbagai bagian, sehingga user tidak mengalami

kesulitan pada saat berpindah posisi pekerjaan atau berpindah lokasi dalam menyelesaikan

pekerjaan.

• Hal itu didasarkan pada karakteristik manusia yang mempunyai pemikiran yang menggunakan

analogi serta kemampuan manusia dalam hal memprediksi. 

• Contoh : keseragaman tampilan toolbar pada Word, Excell, PowerPoint, Access hampir sama.

6.  Familiarity 

• Sifat manusia mudah mengingat dengan hal-hal  yang sudah sering dilihatnya/didapatkannya.

Secara singkat disebut dengan familiar.

• Antarmuka sebisa mungkin didesain sesuai dengan antarmuka pada umumnya, dari segi tata

letak, model, dsb.

• Hal ini dapat membantu user cepat berinteraksi dengan sisem melalui antarmuka yang familiar

bagi user. 

7.  Simplicity 

• Kesederhanaan perlu diperhatikan pada saat membangun antarmuka.

• Tidak selamanya antarmuka yang memiliki menu banyak adalah antarmuka yang baik.

• Kesederhanaan disini lebih berarti sebagai hal yang ringkas dan tidak terlalu berbelit.

• User akan merasa jengah dan bosan jika pernyataan, pertanyaan dan menu bahkan informasi

yang dihasilkan terlalu panjang dan berbelit.

• User lebih menyukai hal-hal yang bersifat sederhana tetapi mempunyai kekuatan/bobot. 

8.  Direct manipulation 

• User berharap aplikasi yang dihadapinya mempunyai media atau tools yang dapat digunakan

untuk melakukan perubahan pada antarmuka tersebut. 

• User ingin sekali aplikasi yang dihadapannya bisa disesuaikan dengan kebutuhan, sifat dan

karakteristik user tersebut. Selain itu, sifat dari user yang suka merubah atau mempunyai rasa

bosan. 

• Contoh : tampilan warna sesuai keinginan (misal pink) pada window bisa dirubah melalui

desktop properties, tampilan skin winamp bisa dirubah, dll. 4

9.  Control 

• Prinsip control ini berkenaan dengan sifat user yang mempunyai tingkat konsentrasi yang

berubah-ubah. Hal itu akan sangat mengganggu proses berjalannya sistem.

• Kejadian salah ketik atau salah entry merupakan hal yang biasa bagi seorang user. Akan tetapi

hal itu akan dapat mengganggu sistem dan akan berakibat sangat fatal karena salah

memasukkan data 1 digit/1 karakter saja informasi yang dihasilkan sangat dimungkinkan salah.

• Oleh karena itu software engineer haruslan merancang suatu kondisi yang mampu mengatasi

dan menanggulangi hal-hal seperti itu. 

• Contoh : “illegal command”, “can’t recognize input” sebagai portal jika terjadi kesalahan. 

10.  WYSIWYG 

• WYSIWYG = what you see is what you get = apa yang didapat adalah apa yang dilihatnya.

• Contoh : apa yang tercetak di printer merupakan informasi yang terkumpul dari data-data yang

terlihat di layar monitor pada saat mencari data.

• Hal ini juga perlu menjadi perhatian software engineer pada saat membangun antarmuka.

• Informasi yang dicari/diinginkan harus sesuai dengan usaha dari user pada saat mencari data

dan juga harus sesuai dengan data yang ada pada aplikasi sistem (software). 

• Jika sistem mempunyai informasi yang lebih dari yang diinginkan user, hendaknya dibuat

pilihan (optional) sesuai dengan keinginan user. Bisa jadi yang berlebihan itu justru tidak

diinginkan user.

• Yang mendasar disini adalah harus sesuai dengan kemauan dan pilihan dari user.

11.  Flexibility 

• Fleksibel merupakan bentuk dari dari solusi pada saat menyelesaikan masalah.

• Software engineer dapat membuat berbagai solusi penyelesaian untuk satu masalah.

• Sebagai contoh adanya menu, hotkey, atau model dialog yang lainnya. 

12.  Responsiveness   

• Setelah memberikan inputan atau memasukkan  data ke aplikasi system melalui antarmuka,

sebaiknya sistem langsung memberi tanggapan/respon dari hasil data yang diinputkan.

• Selain teknologi komputer semakin maju sesuai dengan tuntutan kebutuhan manusia, software

yang dibangun pun harus mempunyai  reaksi tanggap yang cepat. Hal ini didasari pada sifat

manusia yang semakin dinamis / tidak mau menunggu. 

13.  Invisible Technology

• Secara umum, user mempunyai keingintahuan  sebuah kecanggihan dari aplikasi yang

digunakannya. Untuk itu aplikasi yang dibuat hendaknya mempunyai kelebihan yang

tersembunyi. Bisa saja kelebihan itu berhubungan dengan sistem yang melingkupinya atau bisa

saja kecanggihan atau kelebihan itu tidak ada hubungannya.

• Contoh : sebuah aplikasi mempunyai voice recognize sebagai media inputan, pengolah kata

yang dilengkapi dengan language translator. 

14.  Robustness 

• Interaksi manusia dan komputer (pembangunan antarmuka) yang baik dapat berupa frase-frase

menu atau error handling yang sopan.

• Kata yang digunakan harus dalam kondisi bersahabat sehingga nuansa user friendly akan dapat

dirasakan oleh user selama menggunakan sistem .

• Contoh yang kurang baik : YOU FALSE !!!, BAD FILES !!!, FLOPPY ERROR, dsb. Akan

lebih baik jika BAD COMMAND OR FILES NAMES, DISK DRIVE NOT READY,dll. 

15.  Protection  

• Suasana nyaman perlu diciptakan oleh software engineer di antarmuka yang dibangunnya.

• Nyaman disini adalah suasana dimana user akan betah dan tidak menemui suasana kacau ketika

user salah memasukkan data atau salah eksekusi.

• Seorang user akan tetap merasa nyaman ketika dia melakukan kesalahan, misal ketika user

melakukan deleting atau menghapus files tanpa sengaja tidaklah menjadi kekacauan yang

berarti karena misal ada recovery tools seperti undo, recycle bin, dll  atau “are you sure....”

• Proteksi disini lebih menjaga kenyamanan user ketika menggunakan aplikasi sistem khususnya

data-data berupa file.  5

16.  Ease Of Learning And Ease Of Use   

• Kemudahan dalam mengoperasikan software hanya dengan memandangi atau belajar beberapa

jam saja.

• Kemudahan dalam memahami icon, menu-menu, alur data software, dsb.

• Sesudah mempelajari, user dengan mudah dan  cepat menggunakan software tersebut. Jika

sudah memahami tentunya akan membantu proses menjalankan sistem dengan cepat dan baik.

Secara garis besar, pengembangan antarmuka perlu memperhatikan beberapa hal sebagai berikut :

1. Pengetahuan tentang mekanisme fungsi manusia sebagai pengguna komputer. Tentunya yang

ada hubungannya dengan psikologi kognitif, tingkat perseptual, serta kemampuan motorik

pengguna.

2. Berbagai informasi yang berhubungan berbagai  informasi  yang  berhubungan dengan

karakteristik  dialog  yang  cukup  lebar,  seperti  ragam  dialog,  struktur,  isi  tekstual  dan 

grafis,  waktu tanggap,  dan  kecepatan tampilan.

3. Penggunaan  prototipe  yang  didasarkan  pada  spesifikasi  dialog  formal  yang  disusun  secara 

bersama antara  calon  pengguna (user) dan  perancang  sistem,  serta  peranti  bantu  yang dapat 

digunakan  untuk  mempercepat  proses  pembuatan  prototipe.

4. Teknik  evaluasi  yang  digunakan  untuk mengevaluasi  hasil  proses  prototipe  yang telah 

dilakukan,  yaitu  secara  analitis  berdasarkan  pada  analisis  atas  transaksi  dialog,  secara 

empiris  menggunakan  uji  coba  pada  sejumlah  kasus, umpan balik  pengguna yang  dapat  

dikerjakan  dengan  tanya  jawab  maupun  kuesioner  dan  beberapa  analisis  yang  dikerjakan 

oleh  ahli  antarmuka.

Kesulitan yang timbul dalam pengembangan fasilitas antarmuka dari sebuah perangkat lunak antara

lain adalah : 

• Antarmuka harus menangani beberapa piranti kontrol seperti adanya keyboard dan mouse maupun

periperal lainnya, yang semuanya mempunyai aliran data yang berbeda-beda dan mempunyai

karakteristik yang berbeda pula. 

• Waktu yang dibutuhkan pada saat pengiriman data. Bagaimana  meyakinkan bahwa tidak terjadi

keterlambatan antara tindakan dari pengguna dan respon/tanggapan dari sistem.

Untuk mempercepat proses perancangan dan pengembangan antarmuka, beberapa piranti bantu

pengembang sistem antarmuka sering dimanfaatkan, seperti adanya perkembangan teknologi komputer

Apple yang berfokus pada desain grafis, perkembangan teknologi pemrograman seperti Visual C/C++,

Visual Basic, Delphi, Visual Foxpro, dll. 

Dengan perkembangan itu kita dapat mendesain  antarmuka yang luwes dan enak dipandang, bahkan

cukup nyaman untuk digunakan dalam membuat topeng sebuah sistem. 6

PROFIL PEMAKAI (MANUSIA)

 Mata kuliah          :  Interaksi Manusia & Komputer

 Dosen Pengampu :  Idhawati H

• Sistem komputer mempunyai 3 aspek yaitu perangkat keras (hardware), perangkat lunak (software),

manusia (brainware), yang saling terkait dan berhubungan.

• Ketika hendak membangun sebuah IMK, aspek manusia harus terpikirkan dengan matang, tidak

hanya memikirkan aspek teknis dari sistem komputer saja.

• Bagaimana manusia menangkap data/informasi, bagaimana memproses dan mengelola informasi

yang telah ditangkapnya.

• Manusia dapat dipandang sebagai sistem pemroses informasi :

- informasi diterima dan ditanggapi melalui saluran input-output (indera)

- informasi disimpan dalam ingatan (memori)

- informasi diproses dan diaplikasikan dalam berbagai cara

• Kapasitas manusia satu dengan yang lain dalam menerima rangsang dan memberi reaksi berbeda

satu dengan yang lain dan hal ini menjadi faktor yang harus diperhatikan dalam merancang

interface. 

SALURAN INPUT-OUTPUT

Indera yang berhubungan & berkaitan pada IMK : penglihatan, pendengaran, sentuhan

PENGLIHATAN (mata)

• Mata  manusia  digunakan  untuk  menghasilkan  persepsi  yang  terorganisir  akan  gerakan, 

ukuran,  bentuk,  jarak,  posisi relatif,  tekstur  dan  warna.  

• Dalam  dunia nyata,  mata selalu  digunakan  untuk  melihat  semua  bentuk  3  dimensi.  

• Dalam  sistem  komputer  yang menggunakan  layar  2  dimensi,  mata  kita  dipaksa  untuk  dapat 

mengerti  bahwa  obyek  pada  layar tampilan,  yang sesungguhnya  berupa  obyek  2  dimensi, 

harus dipahami  sebagai  obyek  3  dimensi  dengan  teknik – teknik  tertentu.

• Beberapa hal yang mempengaruhi mata dalam menangkap sebuah informasi dengan melihat :

1. Luminans (Luminance)

ƒ Adalah banyaknya  cahaya  yang  dipantulkan  oleh permukaan  objek.  

ƒ Semakin  besar  luminans  dari  sebuah objek,  rincian  objek  yang  dapat  dilihat  oleh  mata

juga akan  semakin bertambah.  

ƒ Diameter  bola  mata  akan  mengecil  sehingga  akan meningkatkan  kedalaman  fokusnya. Hal

ini ditiru oleh lensa pada kamera ketika apertur-nya diatur.    

ƒ Bertambahnya luminans  sebuah  obyek  atau  layar  tampilan  akan  menyebabkan  mata

bertambah  sensitif  terhadap  kerdipan  (flicker)

2. Kontras

ƒ Adalah  hubungan  antara  cahaya  yang  dikeluarkan  oleh  suatu  objek  dan  cahaya  dari  latar 

belakang  objek  tersebut.  

ƒ Kontras merupakan  selisih  antara  luminans  objek  dengan  latar  belakangnya  dibagi  dengan 

luminans  latar  belakang.  

ƒ Nilai  kontras  positif  akan diperoleh jika cahaya  yang  dipancarkan  oleh  sebuah  objek  lebih 

besar  dibanding  yang  dipancarkan  oleh  latar  belakangnya.  

ƒ Nilai  kontras  negatif  dapat  menyebabkan  objek  yang  sesungguhnya  “terserap”  oleh  latar 

belakang,  sehingga  menjadi  tidak  nampak.  

ƒ Dengan  demikian,  obyek  dapat  mempunyai  kontras  negatif  atau  positif  tergantung  dari 

luminans  obyek  itu  terhadap  luminans  latar  belakangnya.

3.   Kecerahan 

ƒ Adalah  tanggapan  subjektif  pada  cahaya.  

ƒ Luminans  yang  tinggi  berimplikasi  pada  kecerahan  yang  tinggi  pula.  

ƒ Kita akan melihat suatu kenyataan  yang  ganjil  ketika  kita  melihat  pada  batas kecerahan 

tinggi  ke  kecerahan rendah. 7

ƒ Pada  gambar  kisi – kisi  Hermann  diatas,  pada  kisi  kiri  Anda melihat seakan-akan ada titik

putih  pada  perpotongan  antara  garis  vertikal  dan horisontal

ƒ Pada  kisi-kisi  kanan  Anda melihat seakan-akan  ada titik  hitam  pada  perpotongan  antara

garis vertikal  dan  horisontal.  

ƒ Tetapi jika mata Anda tepat pada titik perpotongan itu, titik putih / titik hitam akan lenyap.

ƒ Dengan  adanya  kenyataan  ini,  perancang  harus  benar – benar  memperhatikan  efek  yang

muncul  pada  layar tampilan.

4.  Sudut  dan  Ketajaman  Penglihatan

ƒ Sudut  penglihatan  (visual  angle)  adalah  sudut  yang  berhadapan  oleh objek  pada  mata. 

ƒ Ketajaman  mata  (visual  acuity)  adalah  sudut  penglihatan  minimum  ketika  mata  masih

dapat  melihat  sebuah  objek  dengan  jelas.  

ƒ Gambar  diatas  menunjukkan  sebuah  objek  yang  mempunyai  tinggi  L  dan  jarak  dari

mata pengamat  adalah  D.  Sudut  penglihatan  yang  dibentuk  :

φ =  120  tan

-1

   L

                     2D

ƒ Nilai  persamaan  diatas biasanya  sangat  kecil, sehingga  biasanya  dinyatakan  dalam  satuan

menit  atau  detik  busur.  

ƒ Sudut penglihatan  yang  nyaman  bagi mata  adalah  15 menit  

ƒ Dalam  penglihatan yang  buruk  dapat dinaikkan  sampai 21  menit. Hal  ini  dapat

diekuivalenkan  dengan  ketika  kita  melihat  obyek  setinggi  4.3  mm  dan  6.1  mm  pada

jarak  1  meter.

5.  Medan  Penglihatan

ƒ Adalah  sudut  yang  dibentuk  ketika  mata  bergerak  ke  kiri terjauh dan ke  kanan  terjauh,

yang  dapat dibagi menjadi  4  daerah  :

- daerah  pertama  (penglihatan  binokuler)

=  tempat  kedua mata mampu  melihat  sebuah  obyek  dalam  keadaan  yang  sama

- daerah  kedua  (penglihatan  monokuler  kiri)

= tempat  terjauh  yang  dapat  dilihat  oleh  mata  kiri  ketika  mata  kiri  kita gerakkan  ke

sudut  paling  kiri

- daerah  ketiga  (penglihatan  monokuler  kanan)

= tempat  terjauh  yang  dapat  dilihat  oleh  mata kanan  ketika  mata  kiri  kita gerakkan  ke 

sudut  paling  kanan

- daerah  keempat  

= daerah  buta,  yakni  daerah  yang  sama  sekali  tidak  dapat  dilihat  oleh  kedua mata

ƒ Besarnya  daerah  atau  medan  penglihatan   dinyatakan  dalam  derajad,  dapat  bervariasi

tergantung  gerakan  mata  dan  kepala yaitu  :  kepala  dan  mata  keduanya  diam,  kepala 8

diam  mata  bergerak,  dan  keduanya  bergerak.  Gambar  dibawah  ini  menunjukkan

perbedaan  medan penglihatan  disesuaikan  dengan  keadaan  kepala  dan  mata.

ƒ Gambar  (a)  menunjukkan  medan  penglihatan  ketika  kepala  dan  mata  keduanya  diam.

Daerah  penglihatan  binokuler  akan  berada  kira –  kira  sebesar  62

0

    sampai    70

0

 Daerah .

penglihatan  monokuler  berkisar  antara  94

0

  sampai  104

0

   .Sisanya  daerah  buta  .

ƒ Gambar  (b)  menunjukkan  medan  penglihatan  ketika  kepala  diam  dan  mata diperbolehkan

untuk  bergerak bebas. Daerah  penglihatan  binokuler  tetap  berada  kira – kira  sebesar  62

0

 

sampai  70

0 

dengan  daerah  sebesar   30

0 

merupakan  daerah  yang  paling  efektif.  Daerah

penglihatan  monokuler  berada  sampai  dengan  166

0

   .Sisanya  daerah  buta  .

ƒ Gambar  (c)  menunjukkan  daerah  penglihatan  ketika  kepala  dan mata  diperbolehkan  untuk

bergerak.  Pada  keadaan  ini  medan  penglihatan  maksimum  adalah   ± 95

0

tetapi  untuk

pekerjaan  yang  bersifat  interaktif besarnya  medan  penglihatan  optimum  adalah  ± 15

0

 .

ƒ Medan  penglihatan  merupakan  faktor  yang  sangat  penting  dalam  menentukan  ukuran

layar tampilan  atau  tata  letak  tampilan  dan peranti  pengontrol  yang  akan  digunakan.  

6.  Warna

ƒ Warna merupakan hasil dari cahaya dimana  cahaya merupakan perwujudan dari spektrum

elektromagnetik. 

ƒ Jika  panjang  gelombang  berada  pada  kisaran  400 – 700   nm,  luminans  konstan  dan

saturasinya  (jumlah  cahaya putih  yang  ditambahkan)  dijaga  tetap,  seseorang  yang

mempunyai  penglihatan  warna  normal  mampu  membedakan  kira- kira  128  warna  yang

berbeda.

ƒ Banyaknya  warna  yang  dapat  dibedakan  satu dengan  yang  lain  bergantung  pada  tingkat

sensitifitas  mata seseorang.  

ƒ Sensitifitas  ini  tidak  merata  pada  seluruh medan  penglihatan  seseorang.  Mata  dapat

membedakan  warna  secara  akurat  ketika  posisi  obyek  membentuk  sudut  sebesar   ± 15

0 

terhadap  mata  (dengan posisi  kepala  dan  mata diam).

ƒ Dengan warna manusia mampu membedakan satu objek dengan objek yang lain. Dengan warna

manusia terbantukan dalam mengolah data menjadi informasi.

ƒ Penggunaan  warna  yang  sesuai  dengan pengguna akan mempertinggi  efektifitas  tampilan

grafis. 

ƒ Jika warna yang digunakan tidak mengindahkan aspek kesesuaian dengan pengguna, maka

pengguna justru bisa menerima informasi yang salah.9

ƒ Tetapi  tidak  adanya  standar  yang  dapat  digunakan  sebagai  acuan  resmi  tentang 

penggunaan  warna  yang bagus,  karena  karakteristik  orang  per  orang  berbeda  dalam  hal 

persepsi  tentang  warna.

ƒ Beberapa aspek yang perlu diperhatikan dalam menggunakan warna :

a.  Aspek Psikologi

- Hindari  penggunaan  tampilan  yang  secara  simultan  menampilkan  sejumlah  warna 

tajam.Warna merah,  jingga,  kuning,  dan  hijau  dapat  dilihat  bersama – sama  tanpa 

perlu  pemfokusan  kembali,  tetapi  cyan, biru,  dan  merah  tidak  dapat  dilihat  secara 

serempak  dengan  mudah.  Pemfokusan  kembali  mata  yang berulang – ulang  akan 

menyebabkan  kelelahan  penglihatan.

- Hindari  warna  biru  murni  untuk  teks,  garis  tipis  dan  bentuk  yang  kecil.  Mata 

kita  tidak  diset  untuk  rangsangan  yang terinci/kecil,  tajam,  bergelombang pendek.

- Hindari  warna  berdekatan  yang  hanya  berbeda  dalam  warna biru.  Sudut – sudut 

yang  beda  hanya  pada  prosentase  warna  biru  akan  terlihat  sama.

- Pengamat  yang  lebih  tua  memerlukan  aras  ketajaman  yang  lebih  tinggi  untuk 

membedakan  warna

- Besarnya  perubahan  warna   yang  dapat  dideteksi  bervariasi  untuk  warna  yang 

berbeda.  Perubahan kecil  dalam  warna  merah  dan  ungu  sukar  dideteksi

dibandingkan  dengan  warna  lain  seperti  kuning  dan  biru – hijau.  Selain  itu  sistem 

penglihatan  kita  tidak  siap  untuk  merasakan  perubahan  warna  hijau.

- Hindari  warna  merah  dan   hijau  yang  ditempatkan  secara  berseberangan  pada 

tampilan  berskala  besar.  Warna  yang  lebih  cocok  adalah  biru  dan  kuning.

- Warna yang  berlawanan  dapat  digunakan  bersama – sama. Merah dengan  hijau  atau 

kuning  dengan  biru  merupakan  kombinasi  yang  baik  untuk  tampilan  sederhana.

Kombinasi  merah  dengan  kuning  atau  hijau  dengan  biru  akan  menghasilkan  citra 

yang  lebih  jelek.

- Untuk pengamat yang mengalami kekurangan dalam melihat warna hindari perubahan

warna tunggal.

- Warna akan berubah kenampakannya  ketika  aras cahaya sekeliling berubah sehingga

tampilan akan berubah ketika cahaya sekeliling berbeda sangat tajam

Kombinasi  warna  terjelek

Latar  Belakang  Garis  Tipis  dan  Teks  Garis  Tebal  dan  Teks

Putih

Hitam

Merah

Hijau

Biru

Cyan

Magenta

Kuning

Kuning Cyan 

Biru Merah Magenta 

Magenta Biru Hijau  Cyan

Cyan Magenta Kuning

Hijau  Merah Hitam

Hitam Kuning Putih

Hijau Merah Cyan

Putih Cyan

Kuning  Cyan 

Biru  Magenta

Magenta Biru Hijau Cyan

Cyan Magenta Kuning

Hijau Merah Hitam

Kuning Hijau Putih

Cyan Hijau Merah

Putih Cyan Hijau

Kombinasi  warna  terbaik

Latar  Belakang  Garis  Tipis  dan  Teks  Garis  Tebal  dan  Teks

Putih

Hitam

Merah

Hijau

Biru

Cyan

Magenta

Kuning

Biru  Hitam Merah 

Putih  Kuning 

Kuning Putih Hitam 

Hitam Biru Merah 

Putih Kuning Cyan

Biru  Hitam Merah

Hitam Putih Biru 

Merah  Biru  Hitam 

Hitam  Biru Merah 

Kuning Putih  Hijau 

Hitam Kuning Putih Cyan 

Hitam Merah Biru 

Kuning Magenta Hitam Cyan  Putih 

Merah Biru Hitam Magenta 

Biru Hitam Kuning 

Merah  Biru Hitam  10

b. Aspek Perceptual (persepsi)

-   Persepsi  adalah proses  pengalaman  seseorang  dalam   menggunakan  sensor 

warnanya.  

-   Diterima  tidaknya  layar  tampilan  warna  oleh  para  pengguna,  sangat  bergantung 

pada  bagaimana  warna  digunakan.  Warna  dapat   meningkatkan  interaksi  hanya 

jika  implementasinya  mengikuti  prinsip  dasar  dari  penglihatan  warna  oleh 

manusia.

-   Tidak semua  warna  mudah dibaca.  Secara  umum  latar  belakang  dengan warna

gelap  akan  memberikan  kenampakan  yang  lebih  baik (informasi lebih jelas)

dibanding  warna  yang  lebih  cerah

-   Hindari diskriminasi warna pada daerah yang kecil

c. Aspek Kognitif

- Jangan  menggunakan  warna  yang  berlebihan  karena  penggunaan  warna  bertujuan 

menarik  perhatian  atau  pengelompokan  informasi.  Sebaiknya menggunakan warna

secara berpasangan.

- Kelompokkan  elemen – elemen  yang  saling  berkaitan  dengan  latar  belakang  yang 

sama

- Warna  yang  sama  membawa  pesan  yang  serupa

- Urutkan warna sesuai dengan urutan spektralnya

- Kecerahan dan saturasi akan menarik perhatian

- Warna  hangat  dan  dingin sering  digunakan  untuk  menunjukkan  arah  tindakan. 

Biasanya  warna hangat  untuk  menunjukkan  adanya tindakan  atau  tanggapan  yang 

diperlukan.  Warna  yang  dingin  biasanya  digunakan  untuk  menunjukkan  status  atau 

informasi  latar  belakang.

PENDENGARAN (telinga)

ƒ Dengan pendengaran informasi yang diterima melalui mata dapat lebih lengkap dan akurat.

ƒ Pendengaran ini menggunakan suara sebagai bahan dasar penyebaran informasinya.

ƒ Manusia dapat  mendeteksi  suara  dalam  kisaran  frekuensi 20 Hertz  sampai  20 Khertz  tetapi 

batas  bawah  dan  batas  atas biasanya  dipengaruhi  oleh umur  dan  kesehatan  seseorang.  Suara 

yang berkisar  pada  frekuensi  1000 – 4000  Hertz  menyebabkan  pendengaran  menjadi  lebih 

sensitif.

ƒ Selain  frekuensi,  suara  juga  dapat  bervariasi  dalam  hal  kebisingan  (loudness).  Jika  batas 

kebisingan  dinyatakan  sebagai  0 dB  (decible)  maka  suara  bisikan  mempunyai  tingkat 

kebisingan  20 dB,  percakapan  biasa  mempunyai  tingkat  kebisingan  50 dB  sampai  70 dB.

Kerusakan  telinga  terjadi  jika  mendengar  suara  dengan  kebisingan  lebih  dari 140 dB.

ƒ Suara dapat dijadikan sebagai salah satu penyampaian informasi akan tetapi hal itu dapat

menjadikan manusia cepat bosan sehingga penggunaan suara dalam antarmuka perlu pemikiran

khusus dan seksama. 

SENTUHAN (kulit)

ƒ Kulit adalah indera manusia yang berfungsi untuk mengenali lingkungan dari rabaan atau sentuhan

benda terhadap tubuh manusia.

ƒ Sentuhan ini dikaitkan dengan aspek sentuhan dalam bentuk media inputan maupun keluaran .

ƒ Sensitifitas  sentuhan  lebih  dikaitkan  dengan  aspek  ergonomis  dalam  sebuah  sistem.  

ƒ Feedback dari sentuhan disini tidak dijadikan sebagai penyaji atau penerimaan informasi, tetapi

lebih ke piranti pendukung seperti model keypad handphone, keyboard, mouse, tempat duduk user,

dsb.

ƒ Contoh  dalam  penggunaan  papan  ketik  atau  tombol,  kita  akan merasa  nyaman bila  tangan 

kita merasakan  adanya  sensasi  sentuhan.  Ketidaknyamanan  biasanya  disebabkan  karena  posisi

dan  bentuk  tombol  serta  pengoperasian  tombol – tombol  tersebut  kadang – kadang  harus 

dilakukan  penekanan  yang cukup  berat  atau  malah  terlalu  ringan. 11

MEMORI MANUSIA

• Sebagian besar kegiatan manusia berhubungan dengan memori (ingatan) manusia, seperti saat

manusia selalu mengingat semua yang terjadi, memori manusia berisi semua pengetahuan dari

urutan perilaku.

• Memungkinkan seseorang melakukan tindakan yang berulang, menggunakan bahasa, menggunakan

informasi yang baru diterima melalui inderanya, mengidentifikasi dengan menggunakan informasi

yang pernah diterima dari pengalaman masa lalu.

• Bagaimana memori manusia bekerja ? Bagaimana kita mengingat daftar aturan dalam memainkan

sesuatu permainan ? Mengapa seseorang mempunyai kemampuan mengingat lebih cepat daripada

yang lain ? Apa yang terjadi saat seorang lupa ?

• Memori adalah bagian kedua dari model manusia sebagai sebuah sistem pengolah informasi.

• Secara umum ada 3 jenis/fungsi memori  :

- tempat penyaringan (sensor)

- tempat memproses ingatan (memori jangka pendek)

perhatian

- memori jangka panjang

pengulangan

Memori jangka pendek / Memori jangka panjang

sementara

Sensor memori :

iconic

echoic

haptic

MEMORI PENYARING

• Bekerja sebagai tempat penyimpan sementara (buffer) untuk menerima rangsang dari indera.

• Terdiri dari 3 saluran penyaring :

- iconic : menerima rangsang penglihatan (visual)

- echoic : menerima rangsang suara

- haptic : menerima rangsang sentuhan

• Isi memori selalu diperbaharui setiap kali ada rangsang yang masuk, contoh : kita dapat mengetahui

perubahan letak jari tangan kita yang digerakkan di depan mata kita.

• Informasi akan dilanjutkan ke memori jangka pendek dengan catatan hanya rangsang yang

dibutuhkan saat itu, berupa perhatian pikiran pada salah satu dari sekian banyak rangsang yang

masuk.

MEMORI JANGKA PENDEK

• Memori jangka pendek/memori kerja bertindak  sebagai tempat menyimpan data sementara,

digunakan untuk menyimpan informasi yang hanya dibutuhkan sesaat.

• Misal : saat seseorang menghitung 35 x 6, mungkin orang itu akan mengalikan 5 dengan 6 dulu

dulu baru kemudian 30 x 6.

• Untuk membentuk perhitungan seperti diatas diperlukan penyimpanan sementara untuk digunakan

kembali kemudian.

• Memori dapat diakses dengan cepat ± 70 ms, penghilangan cepat  ± 200 ms

• Kapasitas memori kecil / terbatas

• Ada 2 metode dasar untuk mengukur kapasitas :

- mengenali panjang dari suatu urutan yang dapat diingat

berdasar penelitian, manusia mempunyai kemampuan mengingat 7 – 9 digit 

- kemampuan untuk mengingat kembali ingatan yang baru dipanggil

misal : manusia akan mudah mengingat kata-kata ”spongebob and patrick”daripada katakata ”bee atr anu pith etr eet”

MEMORI JANGKA PANJANG

• Memori ini diperlukan untuk menyimpan informasi dalam jangka waktu lama

• Merupakan tempat menyimpan seluruh pengetahuan, fakta informasi, pengalaman, urutan perilaku,

dan segala sesuatu yang diketahui.

• Kapasitas besar / tidak terbatas, kecepatan akses lebih lambat ± 1/10 second, proses penghilangan

pelan 12

• Ada 2 cara menggali ingatan kembali dalam memori jangka panjang :

- episodic  : urutan ingatan tentang kejadian 

- semantic : memori yang tersusun berdasar fakta, konsep dan ketrampilan 

     Informasi semantic terbentuk dari episodic

• Model jaringan semantic :

- turunan : simpul akan membawa sifat induknya

- ada hubungan yang jelas antar bit informasi

- membuat kesimpulan berdasarkan sifat turunan

adalah

adalah

adalah

adalah

contoh

contoh

Contoh : informasi mengenai anjing dalam memori jangka panjang disimpan dalam bentuk/model

model jaringan semantic 

menggonggong

4 kaki

HEWAN  ANJING  PELIHARAAN

ANJING

PEMBURU

ANJING

BERBULU

BEAGLE

SNOPPY

SHADOW LASSIE

CHARLIE

BROWN

adalah

bergerak bernafas  punya ekor

mencari jejak

ukuran kecil

coklat,hitam,putih contoh

tokoh buku

ukuran sedang

coklat,hitam,putih

coklat,hitam,putih tokoh film

tokoh kartun

• Model lain memori jangka panjang :

- frames (kerangka/bingkai) :  informasi diorganisasikan dalam struktur data. 

Slot dalam struktur diberi nilai dengan nilai-nilai tertentu untuk data yang diperlukan.

Contoh : pengetahuan mengenai anjing disimpan dengan model frame

  

   

ANJING

Fixed :

      Kaki : 4

Default : 

  makanan : carnivoara

  suara : menggonggong

Variabel :

     ukuran :

 warna  :

ANJING BERBULU

Fixed :

      Jenis :  Anjing

  Tipe  :  anjing peliharaan

Default : 

  ukuran : 65 cm

Variabel :

 ukuran :

 warna  :

- scripts (baris perintah) : model informasi stereotipe dibutuhkan untuk menterjemahkan

suasana / bahasa, juga mempunyai elemen yang dapat diberi nilai dengan nilai-nilai

tertentu.

Contoh : script kunjungan ke dokter hewan 13

 Entry condition    :  anjing sakit   Roles  : dokter memeriksa

    dokter buka                diagnosa

    pemilik punya uang    merawat

          pemilik bawa masuk anjing

 Result       :   anjing lebih baik    bayar          

               pemilik kehabisan uang   anjing dibawa keluar

            dokter kaya     

 Props      :   meja periksa   Scenes   :    datangi resepsionis

    obat      tunggu

    peralatan lain     pemeriksaan

                    bayar

        Tracks :   anjing butuh obat

          anjing harus dioperasi

Kondisi – aturan tindakan – jika alasan cocok , maka  aturan dijalankan

• Proses dalam memori jangka panjang

- Penyimpanan informasi  

ƒ informasi berpindah dari memori jangka pendek ke memori jangka panjang dengan adanya

latihan / ulangan / repetisi

ƒ jumlah yang bertahan bersifat proposional menurut waktu latihannya

ƒ optimalisasikan dengan mengembangkan pengetahuan

ƒ susunan, arti, dan pembiasaan (familiaritas) membuat informasi lebih mudah diingat

- Penghapusan / proses melupakan

ƒ penghilangan (decay) : informasi hilang secara bertahap tetapi proses sangat lambat 

ƒ interferensi/gangguan/campur aduk (interference) : informasi baru menggantikan informasi

lama

ƒ informasi yang lama mungkin bercampur dengan informasi baru

ƒ memori melakukan seleksi dengan dipengaruhi emosi,mana yang akan dihilangkan dan

mana yang tetap diingat

- Penggalian informasi  

ƒ pemanggilan informasi (recall) : pengingatan kembali, informasi diproduksi dari memori,

dapat dibantu dengan bantuan petunjuk, misal : kategori, perumpamaan, perbandingan

ƒ pengenalan kembali (recognition) : informasi memberikan pengetahuan yang pernah dilihat

sebelumnya, lebih kompleks dibandingkan dengan recall.

ƒ informasi berpindah dari memori jangka pendek ke memori jangka panjang dengan adanya

latihan / ulangan / repetisi

BERPIKIR : PERTIMBANGAN DAN PENYELESAIAN MASALAH

• Pertimbangan (reasoning)

- Deduktif : mendapatkan kesimpulan logis dari pemberian premis (umum ke khusus),

misal :

Jika sekarang hari jumat maka dia akan bekerja

Hari ini hari jumat

Oleh karena itu dia akan pergi bekerja

  Pengambilan kesimpulan (konklusi) secara logika tidak selalu benar :

   Jika saat ini hujan maka tanah kering

Saat ini hujan

Oleh karena itu tanah kering

  Deduksi oleh manusia buruk ketika kenyataan dan kebenaran tidak sesuai

- Induktif : menggeneralisir dari suatu kasus  ke kasus lain yang sama (dari khusus ke

umum), contoh :

semua gajah yang pernah ditemui mempunyai gading berarti gajah mempunyai

gading

Tidak dapat diandalkan (unreliable), hanya dapat dibuktikan kesalahannya, bukan

kebenarannya. Namun manusia tidak mampu menggunakan bukti-bukti negatif.  14

- Abduktif : alasan dari sebab akibat suatu kejadian, contoh :

Sam mengemudi dengan kencang disaat mabuk. Jika melihat Sam mengemudi

dengan kencang, diasumsikan ia mabuk

  Tidak dapat diandalkan, dapat mengarah  ke penjelasan yang salah

    

• Penyelesaian Masalah

Proses menemukan solusi terhadap suatu masalah menggunakan pengetahuan

Beberapa teori :

- Gestalt

ƒ Penyelesaian masalah baik kegiatan produktif dan reproduktif

ƒ Pemecahan masalah produktif bergantung pada kedalaman dan penyusunan

kembali masalah

ƒ Menarik namun tidak cukup bukti untuk menjelaskan

ƒ berpindah dari behavioralism (paham perilaku) dan mengarah pada teori-teori

pemrosesan informasi

- Teori Ruang Permasalahan (problem space)

ƒ Ruang permasalahan terdiri dari bagian/keadaan (states) permasalahan

ƒ Penyelesaian masalah dihasilkan dari pernyataan yang menggunakan operator

resmi

ƒ Heuristic dapat digunakan untuk memilih operator, sebagai contoh : means-ends

analysis

ƒ Beroperasi dalam sistem pemrosesan informasi manusia, contoh : batasan

memori jangka pendek, dll

ƒ banyak diaplikasikan untuk menyelesaikan masalah dalam area yang sudah

dikenal/dalam batas-batas yang jelas, contoh : puzzle

- Analogi

ƒ Menyelesaikan masalah menggunakan pengalaman terhadap suatu masalah yang

diterapkan ke dalam masalah baru yang mirip Æ pemetaan analogi

ƒ Pemetaan analogi mungkin sulit jika sumber masalahnya jauh berbeda

AKUISISI KETRAMPILAN

• Aktifitas berketrampilan dicirikan oleh :

- Penggumpalan (chunking) : banyak informasi digumpalkan untuk mengoptimasi

memori jangka pendek

- Pengelompokan masalah secara konseptual daripada secara dangkal/luaran (superficial)

dan  informasi disusun secara lebih efektif

• 3 tingkat ketrampilan

- menggunakan rule-rule untuk tujuan umum (general purpose rules) untuk

menginterpretasikan fakta- fakta suatu masalah Æ pengetahuan intensif

- rule-rule dengan tugas khusus (spesific task rules) juga  dipelajari,bergantung pada

prosedur-prosedur yang telah diketahui

- rule-rule yang disetel dengan baik (fine-tuned) Æ skilled behavior (perilaku terampil)

• Mekanisme untuk berpindah 

-  Prosedural : level 1 ke level 2

-  Generalisasi : level 2 ke level 3

Proseduralisasi

ƒ Level 1 

IF memasak [jenis masakan, bahan, waktu]

THEN

 lama memasak : waktu

memasak[gorengan, [ayam, wortel, kentang] 2 jam]

memasak[gorengan,[daging,wortel]  2 jam]

memasak[kue,[tepung,gula,mentega,telur] 45 menit] 15

ƒ Level 2

IF jenis masakan adalah gorengan

AND bahan[ayam,wortel,kentang]

THEN

 lama memasak : 2 jam

IF jenis masakan adalah kue

AND bahannya adalah [tepung,gula,mentega,telur]

THEN

lama memasak : 45 menit

Generalisasi

ƒ Level 2

IF jenis masakan gorengan

AND bahannya [ayam,wortel,kentang]

THEN

 lama memasak : 2 jam 

IF jenis masakan gorengan AND bahannya [daging, wortel]

THEN 

lama memasak : 2 jam 

ƒ Level 3

IF jenis masakan gorengan

AND bahannya APASAJA

THEN

 lama memasak : 2 jam 

MODEL KESALAHAN DAN CARA BERPIKIR

• Macam-macam kesalahan

- Kekeliruan 

Perubahan dari aspek ketrampilan dapat menyebabkan kekeliruan

- Salah pengertian/ pemahaman tidak benar

Manusia punya pola tertentu dalam berperilaku, jika perilaku ini tidak seperti orang

kebanyakan dapat menyebabkan kesalahan

• Perbedaan antar individu

- Jangka panjang : jenis kelamin, fisik, dan kecerdasan

- Jangka pendek : akibat dari tekanan atau kelelahan

- Perubahan usia

• Pertanyaan : Mungkinkah membuat keputusan tanpa mempertimbangkan pendapat kebanyakan ?

PSIKOLOGI COGNITIVE (BERPIKIR) DAN DESAIN SISTEM INTERAKTIF 

• Beberapa dapat diterapkan pada aplikasi langsung, contoh : ketajaman/kejelasan warna biru adalah

tidak bagus sehingga warna biru tidak seharusnya digunakan untuk detil yang penting.

• Namun demikian, suatu aplikasi secara umum membutuhkan : 

- pemahaman mengenai konteks dalam psikologi

- pemahaman berdasarkan pengalaman 

• Banyak pengetahuan telah melalui proses penyaringan :

- guidelines (garis pedoman/tuntunan)

- kerangka berpikir

- teknik-teknik evaluasi analitis dan eksperimental  16

PROFIL KOMPUTER

• Komputer terdiri atas beberapa perangkat yang saling berinteraksi untuk berbagai keperluan :

- alat masukan : penulisan dan menunjuk

- alat keluaran : layar, suara

- memori : RAM, hardisk

- prosessor : kecepatan proses, jaringan

• Komputer berperan dalam menjalankan sebuah program. Ada 2 perbedaan mendasar dari interaksi :

- batch : sekumpulan data dibaca/diproses oleh mesin,peran manusia dalam hal ini kecil,

hanya sedikit intervensi / camput tangan pengguna

- interaktif : saat pengguna mengontrol sesuatu di sepanjang waktu/setiap saat

SISTEM KOMPUTER SECARA UMUM

• Seperti terlihat pada gambar diatas, sistem komputer memiliki beberapa peralatan seperti :

- Layar (screen) / monitor : terdapat beberapa windows, yaitu area-area berbeda/terpisah

yang berjalan secara mandiri satu dengan lainnya.

- Keyboard (papan ketik)

- Mouse (pointer)

• Alat-alat tersebut mendukung interaksi untuk menjalankan sistem.

• Alat-alat tersebut menentukan gaya interaksi yang didukung oleh sistem

• Jika menggunakan peralatan yang berbeda, maka antarmuka (interface) akan mendukung gaya

interaksi yang berbeda.

PERALATAN MASUKAN TEKS

1. KEYBOARD (papan ketik)

• alat input / masukan umum

• menggunakan layout yang terstandarisasi (QWERTY)

• pola QWERTY dianggap tidak optimal oleh beberapa pengguna

• jari lebih cepat lelah, misal : jika mengetik  kata yang banyak mengandung huruf a maka jari

kelingking yang paling lemah harus menanggung beban yang lebih berat.

• lebih cocok digunakan bagi mereka yang kidal

• desain keyboard yang lain dinilai lebih memudahkan / mengetik lebih cepat, namun masyarakat

sudah terlanjur terbiasa dengan pola QWERTY sehingga menyebabkan keengganan untuk

berubah menggunakan desain keyboard lain.

• tekanan pada tombol menyebabkan sebuah karakter terkirim

• biasanya dihubungkan dengan kabel ke komputer (CPU)

• kecepatan pengetikan tergantung pada pengalaman pemakai 17

• Alternatif keyboard yang lain :

a. Alfabetik

ƒ Tombol-tombol diatur berdasarkan urutan abjad

ƒ Tidak mempercepat bagi yang sudah mahir mengetik dengan 10 jari

ƒ Tidak mempercepat juga untuk pemula

ƒ Kalah populer dengan QWERTY

ƒ Banyak ditemui pada mainan anak-anak untuk belajar mengenal alfabet

b. Dvorak 

ƒ Huruf yang sering dipakai ditempatkan pada jari-jari yang dominan (lebih kuat)

ƒ Huruf yang lain diletakkan diantaranya

ƒ Condong pada pemakai tangan kanan (bukan kidal)

ƒ Menambah kecepatan mengetik sekitar 10 – 15 % dan mengurangi rasa lelah

ƒ Karena dominasi konsep QWERTY, membuat desain ini tidak berkembang 

c. Chord Keyboard

ƒ jika menggunakan keyboard umum, untuk mengetik kata yang terdiri dari 10

huruf berarti menekan tombol sebanyak 10 kali ketukan

ƒ chord keyboard untuk penyingkatan kata, misal untuk mengetik kata terdiri dari

10 huruf cukup dengan menekan tombol kurang dari 10 kali.

ƒ efektif untuk mencatat ucapan seseorang karena kecepatan seseorang

menulis/mengetik biasa tidak akan mampu melebihi kecepatan orang berbicara.

ƒ hanya sedikit tombol yang digunakan (empat / lima)

ƒ huruf diketikkan sebagai kombinasi dari penekanan tombol

ƒ berukuran kompak, ideal untuk aplikasi yang dibawa-bawa (portable)

ƒ waktu belajar yang singkat, penekanan tombol merefleksikan bentuk dari huruf

yang diinginkan

ƒ cepat pengetikannya

ƒ tetapi ada penolakan dari masyarakat karena terbiasa dengan QWERTY, dan

adanya kelelahan yang terjadi setelah pemakaian dalam waktu lama. 

ƒ contoh chord keyboard  (gambar diatas) : keyboard palantype untuk transkripsi

kata demi kata, digunakan di Inggris untuk mencatat kejadian-kejadian yang

terjadi selama pengadilan berlangsung. Menggunakan paduan tombol yang

ditekan bersamaan untuk menghasilkan suatu kata / suku kata, dan operator yang

telah dilatih dengan baik dapat mencapai 200 kata permenit / lebih

ƒ contoh lain adalah keyboard stenotype, digunakan oleh para wartawan untuk

mencatat ucapan seseorang. 

d. Numeric keypad 

ƒ untuk memasukkan bilangan/data numerik dengan cepat, orang lebih suka

menggunakan tombol numerik yang tata letak tombol-tombolnya dapat

dijangkau dengan sebuah tangan.  18

ƒ contoh : tombol numerik pada keyboard bagian kanan, tombol angka pada

kalkulator, tombol angka pada telpon

e. Function keys

ƒ Pada keyboard biasanya dilengkapi sejumlah tombol khusus (function keys)

ƒ Pada masing-masing tombol fungsi telah ditanam suatu perintah yang apabila

tombol fungsi ditekan, perintah tersebut dikerjakan oleh komputer

ƒ Contoh : F1 untuk menampilkan help, tombol dengan logo Windows untuk

mengaktifkan Start Menu

ƒ Keuntungan :

- mengurangi beban ingatan

- mudah dipelajari

- kecepatan yang lebih tinggi (karena berkurangnya penekanan tombol)

- mengurangi kesalahan

ƒ Kelemahan :

- semakin besar kemampuan yang dimiliki sistem komputer, semakin banyak

tombol fungsi yang diperlukan, semakin besar ukuran keyboard 

2. PERALATAN MASUKAN TEKS YANG LAIN 

• Pengenal tulisan tangan 

Teks yang ditulis dengan tangan dapat  dimasukkan ke dalam komputer, menggunakan

sebuah pena komputer dan tablet digital.

Namun memiliki permasalahan dalam memasukkan data, yaitu :

- penangkapan semua informasi yang diperlukan secara alami

- memisahkan suatu tulisan ke dalam tulisan-tulisan dengan karakter yang berbeda

- penterjemahan yang khas dari setiap individu

- penguasaan atas gaya penulisan tangan yang berbeda

Contoh : Sudah ada di pasaran alat pengorganisasi pribadi genggam (organizer), yang dapat

menangani teknologi pengenalan tulisan tangan dan menyingkirkan penggunaan keyboard

besar yang memakan tempat.

• Pengenal suara 

Alat tersebut menjanjikan, namun hanya sukses dalam situasi terbatas, yaitu pengguna

tunggal, sistem kosakata terbatas.

Masalah yang dihadapi :

- kebisingan

- ketidaktepatan pengucapan

- aksen, dll

PERALATAN PENEMPATAN POSISI & PENUNJUK

1.   MOUSE

• Alat penunjuk yang dipegang

• Bentuk sudah dikenal

• Mudah digunakan

• Karakteristik :

- Bergerak di bidang datar

- Mempunyai 1 – 3 tombol yang berfungsi sebagai pemilih, penanda, menggambar, dll

- Diletakkan di atas meja : perlu tempat khusus, tidak melelahkan

- Mendeteksi gerakan

- Gerakan mouse sesuai dengan gerak kursor di layar

- Kursor bergerak dalam sumbu (x,y) dalam layar monitor, sedangkan mouse bergerak

dalam sumbu (x,z)

- Merupakan peralatan manipulasi secara tidak langsung

- Tidak mengaburkan/mengganggu layar

- Mampu menunjuk secara akurat dan cepat sebab alat dan kursornya terlihat

- Dapat mengarah pada masalah koordinasi tangan-mata berkaitan dengan

ketidaklangsungan manipulasi padanya.

• Cara kerja : ada 2 metode untuk mendeteksi gerakan

- mekanik   19

ƒ bola dibagian bawah mouse bergerak seiring gerakan mouse

ƒ bola menggerakan potensiometer orthogonal

ƒ dapat digunakan pada hampir semua permukaan datar

- optical (cahaya)

ƒ menggunakan LED (Light Emiting Diode) di bagian bawah mouse

ƒ ditempatkan pada tempat seperti alas mouse di meja, sedikit rentan terhadap

debu dan kotoran

ƒ mendeteksi perubahan berdasarkan perbedaan intensitas sinar pantul saat mouse

digerakkan 

• Ada mouse kaki, digerakkan dengan kaki, tapi jarang digunakan

                

           Pergerakan Mouse

2.  JOYSTICK

• Hanya membutuhkan tempat sedikit

• Dikontrol oleh :

- Gerakan (joystick sesungguhnya) : posisi dari joystick  berhubungan dengan posisi

kursor

- Tekanan (joystick isometrik atau joystick yang dikontrol oleh kecepatan) : tekanan pada

stik/batangnya berhubungan dengan kecepatan kursor.

• Biasanya dilengkapi dengan tombol-tombol (pada bagian atas / depan seperti sebuah

trigger/pemicu) untuk memilih.

• Tidak mengaburkan / mengganggu layar

• Murah

• Sering digunakan untuk permainan komputer, peralatan ini sudah familiar dengan pengguna

3. TRACKBALL

• Bekerja seperti mouse dalam posisi terbalik, bola bergerak dalam tempat yang tidak bergerak

• Merupakan peralatan penunjuk tidak langsung 

• Cukup akurat

• Ukuran dan ”perasaan” dalam menggerakkan bola menjadi penting 

• Membutuhkan ruang sedikit

• Cocok untuk komputer notebook 

4.  LAYAR SENTUH

• Layar yang sensitif terhadap sentuhan (touchscreen) 

• Mendeteksi adanya jari di layar 

• Bekerja dengan cara mendeteksi perubahan intensitas cahaya yang memantul, yaitu interupsi

matriks dari semburan cahaya 

• Termasuk peralatan penunjuk langsung

• Keuntungan :

- cepat dan tidak membutuhkan pointer khusus

- baik untuk pemilihan khusus

- cocok digunakan di lingkungan yang sempit bersih dan aman dari kerusakan

• Kerugian :

- jari-jari dapat mengotori layar 

- tidak presisi (jari-jari adalah instrumen  yang tumpul), sulit untuk memilih area yang

kecil  dengan tepat / menggambar yang akurat 

- keharusan untuk mengangkat tangan mengakibatkan kelelahan dan tertutupnya

pandangan ke layar 

• Belum sepopuler mouse  20

5.  LIGHT PEN (pen cahaya) 

• Kabel spiral dihubungkan antara pena dengan layar

• Cara kerja : pena disentuhkan ke layar dan menera pendaran layar

• Merupakan alat penunjuk langsung 

• Akurat (dapat menandai piksel secara individu) sehingga dapat digunakan untuk menggambar

dan memilih dengan baik

• Masalah : 

- kepekaan pena sering berubah 

- mudah rusak, patah, pecah, 

- mudah hilang di meja kerja yang penuh aneka barang

- lelah di lengan

• Belum sepopuler mouse 

6.  TABLET DIGITAL (Digitizing tablet)

• Tablet tahanan (resistive tablet) 

- mendeteksi titik temu diantara 2 lapisan yang terpisah 

- keuntungan : dapat beroperasi tanpa pena spesial, hanya dengan pena biasa / jari

pengguna sudah bisa

• Tablet magnetik (magnetic tablet) 

- mendeteksi pulsa saat itu dalam medan  magnetik menggunakan kumparan kecil yang

berada dalam pena khusus

• Tablet sonik (sonic tablet) 

- mirip dengan tablet-tablet diatas tapi tidak membutuhkan permukaan khusus 

- pulsa elektronik dipancarkan oleh pena dideteksi oleh dua atau  lebih mikrofon yang

kemudian mencatat posisi pena secara triangular 

• Resolusi tinggi, tersedia jangkauan ukuran A5 sampai 60 x 60 inchi 

• Ukuran penarikan contoh (sampling rate) antara 50 dan 200 Hz

• Dapat digunakan untuk mendeteksi gerak relatif / gerak absolut

• Dapat digunakan untuk masukan teks (jika didukung oleh perangkat lunak pengenal karakter)

• Membutuhkan ruang kerja yang besar 

7.   TOMBOL-TOMBOL KURSOR (CURSOR KEYS)

• empat tombol anak panah (kanan kiri atas bawah) pada keyboard)

• Sangat murah tapi lambat

• Berguna untuk pekerjaan yang tak lebih dari sekedar pergerakan pada pengolahan teks

• Tak ada layout yang standar seperti : T atau T terbalik,bujursangkar, L tidur, garis, dll

  21

8. RODA JEMPOL (THUMB WHEELS)

• Dua lempeng pengatur ortogonal untuk mengatur posisi kursor

• Murah tetapi lambat

9.   MOUSE TOMBOL (KEYMOUSE)

• Tombol tunggal, bekerja seperti joystick isometric

• Kecil, kompak, tetapi mempunyai umpan balik sangat kecil dan kehandalannya tidak diketahui

10.  SARUNG TANGAN (DATAGLOVE)

• Sarung tangan khusus dengan sensor serat optik

• Mendeteksi sudut temu dan posisi tangan secara 3D

• Keuntungan :

- Mudah digunakan

- Secara potensi amat kuat dan ekspresif (10 sudut temu dan informasi meruang 3D pada

50 Hz)

• Kerugian :  

- Sulit digunakan dengan keyboard 

- Mahal (kurang lebih 10 ribu poundsterling) 

• Potensi  :

- Pengenal gerak tubuh (gesture) yang bisa bermacam-macam gerakannya

- Interpretasi bahasa simbol / isyarat

11.  PENANGKAP PANDANGAN MATA (EYEGAZE)

• Headset mendeteksi gerakan mata pengguna untuk mengontrol kursor

• Sangat cepat dan akurat

• Mahal

PERALATAN OUTPUT

1.   LAYAR KOMPUTER

• Biasanya menggunakan tabung sinar katoda / CRT (Cathode Ray Tube)

• CRT

- Aliran elektron yang dipancarkan dari pemancar alektron (electon gun), difokuskan dan

diarahkan oleh medan magnet, megenai layar yang dilapisi fosfor yang membuatnya

bersinar.

- 3 jenis : raster scan, random scan, direct view

• Raster scan

- paling sering ditemui, seperti yang ada pada televisi

- semburan cahaya discan dari kiri ke kanan, dikibas balik untuk rescan, dari atas ke

bawah, dan terus diulang-ulang seterusnya

- diulang terus pada frekuensi 30 Hz per frame, terkadang lebih tinggi untuk mengurangi

flicker (kedipan)

- interlacing, yaitu menscan baris ganjil pada keseluruhan layar lalu baru menscan baris

genap, digunakan untuk mengurangi flicker.

- dapat juga menggunakan fosfor tingkat tinggi (high – persistent) tetapi hal ini

menyebabkan gambar seperti ada corengannya khususnya pada animasi yang signifikan

- resolusi biasanya pada ukuran 512 x 512, namun layar dengan kualitas lebih baik sudah

ada (menjadi kecenderungan umum sekarang) sampai kira-kira 1600 x 1200 piksel

- layar hitam dan putih dapat menampilkan berbagai tingkatan grayscale (derajat keabuan)

dengan memainkan intensitas dari semburan elektron 22

- warna didapatkan dengan menggunakan tiga pemancar elektron yang ditembakkan ke

fosfor merah, hijau, biru. Kombinasi intensitas dari ketiga warna tersebut akan

menghasilkan berbagai warna berbeda termasuk warna putih.

- pendekatan yang lain : menggunakan sinar laser yang ditembakkan pada fosfor khusus

dimana warna yang dihasilkan tergantung pada intensitas sinar laser yang mengenainya.

- warna ataupun intensitas pada piksel ditangani oleh kartu video komputer. 

- 1bit/ piksel dapat menyimpan informasi on/off, karena itu hanya dapat menyimpan

warna hitam dan putih. 

- lebih banyak bit/piksel yang ditambahkan maka akan menambahi kemungkinan warna

yang bisa didapat, contoh : 8 bit/piksel memberikan kemungkinan 2

8

= 256 warna pada

satu saat

• Random scan (refresh semburan terarah, tampilan vektor)

- daripada menscan keseluruhan tampilan secara sekuensial ataupun secara horisontal,

pemindaian (scan) menuliskan baris-baris yang akan ditampilkan secara langsung.

- layar diupdate pada kecepatan > 30 hz untuk mengurangi flicker

- efek citra bergerigi (jaggies) tak akan ditemukan, dan resolusi yang lebih tinggi

dimungkinkan (sampai 4096 x 4096 piksel)

- warna dicapai menggunakan penetrasi semburan, secara umum dengan kualitas yang

lebih rendah

- ketegangan dan kelelahan mata masih menjadi masalah

- harga layar vektor mahal

• Direct View Storage Tube (DVST)

- banyak digunakan dalam oscilloscope analog 

- serupa dengan random scan CRT tetapi gambar diciptakan dari cairan yang ditembakkan

sehingga tidak ada flicker. 

- gambar baru terbentuk setelah gambar lama dihapus semua.

- resolusi tinggi (biasanya 4096 x 3120) tetapi kontrasnya rendah, kecemerlangan rendah

dan sulit dalam menampilkan warna.

• Keuntungan dari CRT

- murah 

- cukup cepat untuk animasi yang butuh kecepatan

- kemampuan menampilkan warna yang banyak

- penambahan resolusi menambah juga harganya 

• Kelemahan dari CRT

- memakan banyak tempat karena bentuknya besar sekali, karena adanya pemancar

elektron dan komponen pemusat di belakang layar

- masalah dengan ”jaggies”, garis diagonal yang harus terpotong dalam rangka proses

pemindaian (scan) horizontal raster, seperti gambar di bawah ini :

- masalah “jaggies” dapat dikurangi dengan menggunakan layar beresolusi tinggi atau

dengan teknik anti – aliasing, yaitu membuat tepi yang lebih lembut dari segmen garis

- adanya kedipan, pembacaan yang susah, kontras yang rendah dapat menyebabkan

ketegangan dan kelelahan mata  23

• Hal-hal yang harus diperhatikan berkaitan dengan emisi/pancaran radiasi 

- X-rays (sinar X) : sebagian besar telah diserap oleh layar (tapi bukan di bagian

belakang)

- radiasi UV (ultra violet) dan IR (infra red) dari fosfor padalevel yang tidak signifikan

- emisi frekuensi radio ditambah dengan ultrasound (~ 16 kHz) 

- medan elektrostatik merembes melalui tabung ke pengguna, intensitasnya tergantung

pada jarak dan kelembaban, dapat menyebabkan ruam (luka) di kulit

- medan elektromagnetik (50Hz – 0.5MHz), menyebabkan arus induksi dalam material

penghantar (konduktor), termasuk tubuh manusia, menyebabkan kemungkinan

munculnya katarak pada operator VDU (Video Display Unit) dan masalah gangguan

reproduksi (mandul, keguguran, cacat lahir pada bayi)

- perlu kewaspadaan bagi orang hamil

- saran :

ƒ jaga jarak mata dengan layar

ƒ jangan gunakan font yang terlalu kecil ukurannya

ƒ jangan memandangi layar dalam waktu lama tanpa istirahat

ƒ jangan tempatkan layar secara langsung di depan jendela yang terang cahayanya

ƒ kerjalah dalam lingkungan dengan suasana cahaya yang memadai dan nyaman

- memakan banyak tempat karena bentuknya besar sekali, karena adanya pemancar

elektron dan komponen pemusat di belakang layar

• Selain CRT adalah Liquid Crystal Display (LCD)

- lebih kecil, lebih ringan, tanpa masalah radiasi

- pengalamatan matriks

- biasa digunakan pada notebook, mulai populer pada desktop

- memiliki prinsip serupa dengan arloji digital

- lapisan tipis kristal cair diapit oleh 2 lempengan kaca, lempengan diatas transparan dan

terpolarisasi, lempengan yang bawah melakukan refleksi

- cahaya dari luar melalui lempengan atas dan kristal, dan merefleksi (memantulkan) balik

ke mata

- polarisasi akan berubah seiring dengan perubahan tegangan listrik yang masuk

- dalam LCD juga terjadi kedipan namun lambat sehingga mata tidak terasa

- LCD memungkinkan munculnya warna

- tingkat kelelahan yang ditimbulkan lebih sedikit dibandingkan kalau menggunakan layar

CRT

- mengurangi tegangan di mata karena sifat refleksi alamiah cahaya dibandingkan dengan

pancaran cahaya pada CRT

2.  PERALATAN OUTPUT ALTERNATIF

• Visual 

- reprentasi analog : dial (tombol untuk mendial), gauges, lampu, dll

- head-up display (kamera kecil yang dipakai di kepala) seperti di kokpit pesawat

• Auditory (bunyi) 

- beep, ting, tet, cling, dll

- menandakan adanya kesalahan

- konfirmasi dari suatu aksi, contoh : adanya penekanan tombol 

- pembicaraan : area yang belum sepenuhnya dieksploitasi

3.  PENCETAKAN

• Teknologi pencetakan popular adalah yang mampu mencetak karakter sesuai yang terlihat

dalam layar

PRINTER

• Mengijinkan sembarang karakter atau grafik untuk dicetak, tergantung pada resolusi dot-nya,

diukur dalam dot per inchi (dpi)

• Printer dot-matrix (matriks titik)

- menggunakan pita bertinta, dengan serangkaian pin yang memukul pita, mencetakkan

titik – titik di kertas

- resolusi umumnya adalah 80 – 120 dpi 24

• Printer ink-jet dan bubble-jet

- segumpal kecil tinta dikirimkan dari head printer ke kertas, ink-jet menyemprotkannya,

bubble-jet menggunakan panas untuk membuat gelembung

- tidak berisik (tenang)

- biasanya resolusi mencapai 300 dpi

• Printer suhu (thermal printer)

- menggunakan kertas yang sensitif terhadap panas yang mengubah warna jika

dipanaskan

- kertas dipanaskan oleh pin dimana sebuah titik diperlukan

- biasanya hanya 1 baris titik- titik yang dibuat setiap langkah

- kualitas jelek, sederhana

- contoh : mesin fax 

• Printer laser (laser printer) 

- seperti mesin fotokopi

- titik-titik bermuatan disimpan dalam drum, yang diambil dalam toner (berbentuk bubuk

tinta), digulungkan pada kertas dan ditempatkan dengan panas.

- biasanya resolusi 300 dpi, tersedia juga sampai lebih dari 1200 dpi

FONT (HURUF)

• Font mengacu pada gaya teks tertentu

• Font mempunyai beberapa model misal : Verdana, Arial, Courier New,Allegro BT

• Ukuran font ditentukan dalam point (pt), sekitar 1/72”, dan relatif terhadap tingginya

ini berukuran 8 point Courier New

ini berukuran 12 point Courier New

ini berukuran 14 point Courier New

• Karakteristik lain dalam hal ukuran :

- Pitch 

ƒ Fixed-pitch : setiap karakter mempunyai lebar yang sama, contoh : Courier 

ƒ Variable-pitched : beberapa karakter lebih lebar dibandingkan yang lain ,     

contoh : Times New Roman (bandingkan ’i’ dengan ’m’) 

- Serif atau Sans-serif

ƒ Sans-serif : dengan akhiran goresan berbentuk kotak, garis huruf yang tegas dan

sama, misal : Arial

ƒ Serif : dengan akhiran miring / renggang keluar, garis huruf tidak sama, misal :

Times New Roman, Book Antiqua

BAHASA PENDESKRIPSIAN HALAMAN

• Suatu halaman bisa sangat kompleks, dengan teks yang berbeda font, gambar, ilustrasi garis,

foto, warna, dll

• Pengolah kata dilengkapi dengan fasilitas untuk menggambar kurva, garis, model dan ukuran

huruf, dll

• Dapat dihasilkan dengan mengkonversi semua informasi ke dalam bitmap dan mengirimkannya

ke printer, tetapi seringkali ini merupakan file yang besar sekali

• Alternatifnya, deskripsi lengkap mengenai suatu halaman dapat dikirimkan, menjelaskan

bagaimana menggambarkan grafik dan menuliskan teks dengan font yang diinginkan

• Pendekatan ini menggunakan bahasa pendeskripsian halaman : suatu bahasa pemrograman

untuk pencetakan

• Mengandung instruksi-instruksi untuk menggambar kurva, garis, teks dengan gaya yang

berbeda-beda, menskalakan informasi, dst

• Yang paling umum adalah PostScript

4.SCANNER

• Merubah teks tertulis ke dalam bentuk file (bitmap)

• Ada 2 jenis scanner :

- Flat – bed (scanner besar, tak mudah dibawa-bawa) :

kertas diletakkan diatas  lempengan kaca, keseluruhan halaman dikonversikan ke dalam

bitmap 25

- Hand – held (scanner genggam) 

scanner dijalankan/dilewatkan di atas kertas, mengkonversi baris per baris, sebentuk alat

digital yang biasanya memiliki lebar 3 – 4 inchi.

• Dapat menscan warna yaitu kilauan cahaya pada kertas dan mencatat intensitas refleksinya.

• Resolusi mulai dari 100, 300 sampai 1500 dpi

• Digunakan pada :

- dekstop publishing (pencetakan / penerbitan) untuk mengolah fotografi dan citra-citra

yang lain

- digunakan dalam penyimpanan dokumen dan sistem temu kembali, tak berhubungan

dengan penyimpanan kertas

3. OPTICAL CHARACTER RECOGNITION (OCR – pengenal karakter optik)

• Mengkonversi bitmap kembali ke dalam bentuk teks

• Font-font yang berbeda menjadikan permasalahan untuk algoritma pencocokan kerangka

(template matching) sederhana

• Sistem yang lebih kompleks akan mensegmentasi teks, memilahnya ke dalam garis dan sudut,

menguraikan karakter-karakternya

MEMORY

• Random Access Memory (RAM) – memory yang diakses secara acak

- waktu akses 100 nanosecond,mudah berubah isinya (informasi hilang jika listrik

padam), kecepatan transfer data 10 MB/sec

- beberapa RAM yang tak mudah berubah isinya digunakan untuk menyimpan informasi

data setup

- komputer dekstop umumnya memiliki 128 Mbytes sampai 1 Gbytes RAM

• Memory jangka panjang (long term memory) : bermacam-macam disk

- Magnetik

Floppy disk, menyimpan 300kbytes sampai 1.4Mbytes, Hardisk antara 20 Gbytes

sampai 120 Gbytes, waktu akses time kurang lebih 10ms, angka transfer 1 Mbytes/detik

- Optical disc

ƒ Menggunakan laser untuk membaca dan menulis

ƒ Lebih handal daripada media magnetik

ƒ contoh : CD-ROM (Compact Disc – Read Only Memory), WORM (Write Once

Read Many), full rewrite disc

• Program yang ada sekarang relatif besar ukurannya, sering melebihi kapasitas RAM, juga

sistem Windows menjalankan banyak aplikasi secara simultan, hal ini mempengaruhi interaksi

sebab data harus ditukar masuk dan keluar dari RAM ke hard disk, menyebabkan waktu tunggu

yang tidak bisa diabaikan.

FORMAT PENYIMPANAN DATA

• ASCII

Kode biner 7 bit yang secara unik menandai setiap huruf dan karakter

• RTF (Rich Text Format)

Mengandung teks ditambah dengan pemformatan dan informasi layout

• SML (Standardized Markup Language)

Dokumen diperlakukan sebagai objek terstruktur (ada paragraf, kalimat, spasi, dll)

• Bermacam-macam format penyimpanan untuk file teks dan gambar (PostScript, GIFF, TIFF,

PICT, JPG, dll), mempunyai teknik dan ukuran yang berbeda-beda dalam proses

penyimpanannya

• QuickTime

Standar penyimpanan file dalam bentuk video dan citra dari Apple Macintosh

KECEPATAN PROSESOR

• Desainer cenderung untuk mengamsusikan prosessor kecepatannya tak terbatas sehingga

membuat antarmuka menjadi lebih rumit

• Terjadi masalah karena pemroses tidak dapat memenuhi semua tugas-tugas yang diperlukan 

- overshooting (terlalu banyak tombol ditekan)

karena sistem menyimpan sementara (buffer) tombol keyboard yang ditekan pengguna 26

- icon wars (perang ikon)

user mengklik ikon, tetapi tidak terjadi apa – apa (sistem tidak cepat menanggapi),

mengklik yang lain, lalu sistem merespon dan window bermunculan dimana-mana

• Menjadi masalah jika sistem terlalu cepat

contoh : scrolling teks atau halaman terlalu cepat untuk bisa dibaca oleh user

• Masalah lain : 

- batasan komputasi : 

ƒ komputasi memakan waktu, menyebabkan frustasi untuk pengguna

ƒ kemacetan dalam transfer data dari disk ke memory

- batasan grafik :

ƒ mengupdate layar membutuhkan banyak usaha, kadang terbantukan dengan

menambahkan prosesor grafik pembantu untuk mengatasi masalah tersebut.

- kapasitas jaringan : banyak komputer yang terhubung dengan jaringan saling membagi

sumber daya dan file, akses ke printer, dll, tetapi kinerja interaktif terkurangi dengan

adanya kecepatan jaringan yang rendah.  27

INTERAKSI

KERANGKA KERJA INTERAKSI

• Interaksi : komunikasi antar user dengan sistem

• Mengapa perlu kerangka kerja ?

Untuk menjaga kesinambungan dan pandangan secara umum

• Kerangka kerja Donald Norman

- User menetapkan tujuan

- Rumuskan tujuan/keinginan

- Spesifikasi perintah/aksi pada antarmuka

- Jalankan perintah/aksi

- Pahami perintah-perintah sistem

- Terjemahkan perintah-perintah sistem

- Uji perintah-perintah dalam sistem apakah sesuai dengan tujuan

• Beberapa sistem lebih sulit penggunaannya dibanding sistem yang lain

- Pada saat eksekusi, hasil atau tindakan sistem tidak sesuai dengan perintah yang

diberikan user

- Pada pengujian sistem, perubahan yang diharapkan user berbeda dengan hasilnya.

• Model dari Norman terpusat pada interface menurut cara pandang user, sehingga dikembangkan

model Abowd dan Beale

MODEL ABOWD dan BEALE

• Sebuah interaksi melibatkan 4 bagian : 

- user (pengguna)

- input (data)

- sistem (proses)

- output (hasil)

• Setiap bagian mempunyai bahasa sendiri yang unik 

• Interaksi memerlukan penterjemah, masalah terjadi jika antar interface tidak saling mengenal

bahasa tersebut

• Seorang user menterjemahkan keingingannya melalui interface, dimana hasilnya kemudian

ditampilkan dalam layar dan ditangkap oleh pengguna tersebut.

• Kerangka kerja umum untuk memahami interaksi 

- tidak harus sistem terkomputerisasi 

- mengidentifikasi semua komponen yang terlibat

- mempunyai penaksiran yang sama dari sistem-sistem

- tidak berbentuk

ERGONOMIK

• Ilmu yang mempelajari karakteristik fisik dalam interaksi

• Diantaranya :

- pengaturan alat pengendali dan tampilan, seperti : pengelompokan alat kendali

berdasarkan fungsi atau frekuensi penggunaan atau urutannya

- Lingkungan kerja, misal : penetapan aturan sesuai tingkat pengguna

- kesehatan, misal : posisi fisik, kondisi lingkungan (suhu, kelembaban), cahaya,

kebisingan.

- penggunaan warna, misal : warna merah untuk peringatan, hijau tanda OK,

pertimbangkan juga adanya buta warna

• Ergonomik baik untuk pendefinisian standar dan pedoman pembatasan bagaimana kita mendesain

aspek tertentu dari sistem 

MACAM INTERAKSI

• Interaksi bisa dikatakan dialog antara user dengan komputer. 

• Berbagai sistem aplikasi mempunyai bentuk interaksi yang berbeda-beda

• Model atau jenis interaksi, antara lain :

- Antarmuka dengan baris perintah tunggal

- Antarmuka dengan baris perintah terstuktur

- Menu 28

- Bahasa sehari-hari/alami

- Dialog dengan tanya jawab terstruktur

- Formulir isian dan kertas kerja

- WIMP (Window Icon Menu Pointer) 

1.  BARIS PERINTAH TUNGGAL

• Cara memberi instruksi kepada komputer secara langsung, dapat berupa tombol fungsi, karakter

kata, atau kombinasi

• Cocok untuk perintah berulang

• Lebih tepat untuk pengguna yang ahli

• Menyediakan akses langsung pada fungsi sistem

• Baris perintah harus mempunyai makna/arti

• Contoh : sistem Unix/Linux, DOS

C:\>DIR  digunakan  untuk menampilkan  nama-nama  berkas  yang  terdapat  pada  harddisk  yang  

diberi  identitas  sebagai  harddisk  C

  

Keuntungan  Kerugian

ƒ Cepat

ƒ Efisien

ƒ Akurat

ƒ Ringkas

ƒ Luwes

ƒ Inisiatif  oleh  pengguna

ƒ Memerlukan  latihan  yang  lama

ƒ Membutuhkan  penggunaan  yang  teratur

ƒ Beban  ingatan  yang  tinggi

ƒ Jelek  dalam menangani  kesalahan

• Untuk  meminimalkan  beban  ingatan  dan  kesalahan  pengetikan   :

- pilihlah  kata  kunci  yang  mudah  diingat (pendek/singkatan)

- gunakan  format  perintah  yang  konsisten

- tambahkan  fasilitas  bantuan  (help)

- gunakan  nilai – nilai  default  untuk  mengurangi  kesalahan  ketik

sediakan  pesan – pesan  yang  jelas

2.  BARIS PERINTAH TERSTUKTUR

• Dialog ini memungkinkan perintah lebih dari satu baris yang dikemas dalam satu berkas biasanya

disebut batch file, contoh :

dalam    DOS    hampir    selalu      ada    sebuah    berkas    bernama    AUTOEXEC.BAT.    Berkas    ini 

sebenarnya  merupakan  bentuk  kemasan  dari  sejumlah  perintah – perintah  DOS. 

@ECHO OFF

 PROMPT $p$g

 PATH C:\WINDOWS;C:\DOS

 SET TEMP-C:\DOS

 C:\WINDOWS\DXPMODE 60

C:\WINDOWS\MSCDEX.EXE /S /D:MSCD001 /M:8 /V

C:\DOS\SMARTDRV.EXE  /X

Jika  diperhatikan  isi  file  diatas  maka  masing – masing  perintah  sebenarnya  perintah  yang 

berdiri  sendiri.  Jika  ada   pengguna  yang  kurang  kerjaan  maka  segera  setelah  ia

menghidupkan  komputernya  ia  akan  selalu  mengetikkan  perintah – perintah  di  atas  satu  demi 

satu.  Tetapi  bagi  pengguna    yang  ’smart’,   dapat  dipastikan  ia  tidak  akan  mengetikkan 

perintah – perintah  di  atas  satu  per  satu.  Karena  dengan  memberikan  perintah

    C:\>AUTOEXEC  ↵

maka  keseluruhan  perintah  diatas  akan  dikerjakan  komputer

• Keuntungan : lebih cepat dan ringkas

• Kerugian : penelusuran kesalahan

3.  MENU

• Sekumpulan pilihan tampil di layar

• Pilihan tampil sesuai permintaan

• Dipilih dengan menggunakan mouse,kode bilangan/huruf

• Pilihan dikelompokkan secara urut : sangat penting membuat pengelompokan yang baik

• Sistem menu dapat berupa : 29

- Menu Datar

Cara akses pilihan dapat menggunakan selektor pilihan yaitu bullet yang dapat berupa

angka/huruf, dapat juga dengan kursor ←↑→ ↓ (highlight marker) dan tombol enter

SISTEM INFORMASI AKADEMIK

<1>  Identitas Mahasiswa

<2>  Mata  Kuliah

<3>  Nilai  

<4>  Pengumuman Akademik

<4>   KRS

<5>   KHS

<6>   Dosen 

<7>   Jadwal Kuliah

<8>   Keluar

Pilihan :  _

-  Menu Tarik (pulldown menu/ pop-up menu)

• Disebut  menu  tarik,  karena  seolah – olah  kita  “memegang”  sebuah 

menu/pilihan  dan  kemudian  “menarik”  ke  bawah  (atau  ke  samping,  ke atas) 

untuk  melihat  submenu  dari  menu/pilihan  tersebut.  

• Setelah  pilihan  dikonfirmasikan,  maka  daftar  subpilihan  menjadi  tidak  terlihat 

lagi  

• Memanfaatkan sistem WIMP 

Keuntungan Kerugian

ƒ Memerlukan  sedikit  pengetikan

ƒ Beban  memori manusia  rendah

ƒ Struktur  terdefinisi  dengan  baik

ƒ Perancangan  mudah

ƒ Tersedia  banyak tool 

ƒ Seringkali  lambat

ƒ Memakan  ruang  layar  

ƒ Memakan banyak memori (simpan/aktif layar)

ƒ Tidak  cocok   untuk   dialog inisiatif pengguna

(pengguna dipaksa)

4.  BAHASA ALAMI

• Pengguna  memberikan  instruksi – instruksi  dalam  bahasa  alami  yang  lebih  umum  sifatnya.  

• Jika  dialog  berbasis  perintah  tunggal  instruksinya  sangat  dibatasi  oleh  sintaksis  yang 

digunakan

• Dengan bahasa  alami,  pengguna  dapat memberikan  instruksinya  dengan  kalimat – kalimat 

yang  lebih  manusiawi.  

• Kata-kata/ bahasa sehari-hari bisa digunakan, seperti DISPLAY ALL dalam dBase

• Contoh : dalam bahasa Pascal

       While not eof(T) do

     Begin

                Readln(T,S);

                If  IpSem > 3.0  then

           Writeln(namamahasiswa);

     End;

• Masalah : ketidakjelasan (vague) dan bermakna ganda/rancu (ambigu)

• Solusi : dicoba untuk mengerti komunitas pemakai

5.  DIALOG DENGAN TANYA JAWAB TERSTRUKTUR (QUERY)

• Bila pengguna melakukan interaksi dengan menggunakan serangkaian pertanyaan

• Cocok untuk pengguna pemula

• Selalu digunakan dalam sebuah sistem informasi

• Bahasa query digunakan untuk menyusun informasi yang akan ditampilkan dari database

berdasarkan jawaban dari proses tanya jawab tersebut 30

• Efektifitas penggunaannya tergantung pada pemahaman struktur database, bahasa pemrograman

dan pembuatnya. 

• Contoh :   SQL 

select nim,nama from mahasiswa where ipk>=3.0 

6.  FORMULIR ISIAN (BORANG) DAN LEMBAR KERJA (SPREADSHEET)

FORMULIR ISIAN

• Sebagai dasar untuk pendataan

• Layar berbentuk formulir

• Data diinputkan pada kolom-kolom yang telah tersedia

• Perlu rancangan yang baik dan ada fasilitas perbaikan (koreksi)

• Contoh : 

SPREADSHEET

• Formulir isian dengan beragam variasi

• Ada sel-sel yang dapat diisi data atau formula(rumus)

• Rumus dapat berisi nilai yang melibatkan isi sel-sel yang lain, misal penjumlahan dalam 1 kolom

• Pengguna dapat mengisi dan mengganti data namun lembar kerja tetap akan konsisten dengan

perubahan tersebut, sehingga hasilnya tetap benar sesuai rumus yang telah ditentukan.

• Contoh : Visicalc, Q-Pro, Lotus 123, Excel

7.  WIMP

• Window Icon Menu Pointer atau Window Icon Mouse Pull-down Menu

• Merupakan model baku untuk sistem komputer interaktif saat ini, khususnya untuk PC

• Window

- Area pada layar komputer yang dimiliki oleh terminal yang mandiri

- Dapat berisi teks atau gambar

- Dapat bertumpukan, disembunyikan, atau ditampilkan semua

- Tersedia scrollbars untuk menggulung layar naik turun atau menggeser layar kanan kiri

- Tittle bar berisi judul / nama dari window

- Dalam aplikasi dapat terdiri dari 1 atau lebih jendela yang bekerja dan tidak saling

mempengaruhi

• Icon 

- Gambar atau simbol kecil digunakan sebagai representasi dari objek

- Window dapat diperkecil menjadi ikon-ikon untuk mempermudah akses

- Bentuk ikon bermacam-macam variasi bentuk, gambar, warna namun harus tetap

representasi dari objek yang diwakili

- Kelebihan :

ƒ icon merupakan variasi dari menu, karena satu ikon menunjukkan suatu aktifitas,

yang dalam sistem menu dinyatakan dalam bentuk teks

ƒ merupakan terobosan besar karena mempunyai sifat yang alamiah, ringkas,

mudah diingat, mudah dipelajari & dikenal

ƒ gambar lebih bersifat umum daripada tekstual

ƒ menyingkat waktu dan memperkecil usaha untuk mempelajari software 31

ƒ kinerja user lebih tinggi dan adanya penurunan tingkat kesalahan

ƒ bagi pemrogram dapat dengan mudah mengelompokkan ikon berdasarkan

atributnya

- kekurangan :

ƒ penggunaan ikon menyembunyikan penurunan produktifitas dibalik penampilan

yang ramah

ƒ penggunaan ikon bisa membingungkan dan boros tempat

ƒ tidak efektif bila berurusan dengan perintah-perintah yang banyak tetapi serupa

ƒ user tertentu lebih suka membaca suatu teks karena lebih jelas

ƒ membutuhkan waktu lama dan sulit untuk menemukan ikon yang cocok dengan

aktifitas yang akan dijalankan, solusi : dapat diperjelas dengan menambahkan

pesan (2 atau 3 kata) dapat permanen atau sementara (hanya muncul pada saat

mouse/kursor berada pada ikon tersebut)

ƒ tidak adanya standarisasi

    Contoh Window

                      Contoh Icon

• Pointer 

- Merupakan bagian yang terpenting sejak munculnya model WIMP, berguna untuk

menunjuk dan memilih seperti ikon atau menu

- Biasanya digerakkan oleh mouse,tetapi bisa juga dengan joystick, trackball, tombol

kursor

- Bentuk bermacam-macam

• Menu 

- Pilihan operasi atau perintah yang ditawarkan pada layar

- Pilihan dipilih dengan pointer 

- Keyboard terbaru terkadang dilengkapi dengan fasilitas untuk pemilihan menu

- Menu dapat mengambil sebagian besar dari ruangan layar

Solusi : Gunakan menu pull-down (tarik ulur) atau pop-up 

• menu pull-down adalah menu yang menyeret turun dari judul tunggal

pada bagian atas layar

• menu pop-up nampak jika daerah tertentu di layar (mungkin ditandai oleh

suatu ikon) diklik

- Menu lain : 

ƒ menu pin-up, yaitu akan tinggal sampai secara eksplisit diminta user untuk

hilang/selesai 32

ƒ menu fall-down, mirip dengan menu pull-down, namun bar (batang)nya tidak

harus untuk secara eksplisit dipilih

ƒ menu cascading (bersusunan), satu pilihan menu membuka menu lain yang

berhubungan padanya, dst

ƒ menu pie, opsi menu diatur dalam lingkaran, lebih mudah untuk memilih item

(daerah target lebih besar) dan lebih cepat (jarak yang sama untuk sembarang

opsi)

• Beberapa komponen tambahan dalam model WIMP, diantaranya

- Button (tombol) : 

ƒ radio button : kumpulan pilihan yang harus memilih salah satu, tak boleh lebih

dari 1

ƒ check box : kumpulan dari pilihan-pilihan yang boleh memilih 1/lebih dari 1

- Pallettes (palet) : kumpulan kemungkinan mode yang tersedia, ditambah mode yang

aktif saat itu, biasanya adalah sekumpulan icon yang ditata secara berdampingan (tiled

icons)

contoh : paket untuk menggambar memiliki palet yang mengindikasikan apakah kotak,

lingkaran, garis atau teks yang akan digambar, dan yang lain lagi mengindikasikan

warna-warna yang tersedia pada paket tersebut. 

- Combo box, list box

- Kotak dialog : jendela yang berisi informasi penting, seperti pada saat user akan

menyimpan file, maka muncul kotak dialog untuk memberi nama file tersebut. Setelah

file disimpan, kotak dialog selesai tugasnya dan menghilang dari layar. 

- Kotak peringatan, muncul untuk memberitahu kesalahan atau tuntunan

DAMPAK SOSIAL DALAM ORGANISASI

• Untuk orang lain : keinginan untuk menjadikan berkesan, menimbulkan keingintahuan,

persaingan, takut gagal

• Motivasi : takut, ambisi, kepuasan diri, kesenangan

• Sistem yang tidak cukup mewadahi interaksi ini dapat menyebabkan frustasi dan berkurangnya

motivasi 33

PROSES PERANCANGAN INTERAKSI

(MODEL SIKLUS HIDUP DAN PROSES)

• Mengapa perancangan interaksi menghasilkan interface yang buruk?

- Perancang terlalu memperhatikan ke fungsi dibanding penggunaan

- Perancang tidak mempunyai pemahaman yang cukup dalam merancang interface

- Rancangan yang baik tidak mudah – tidak sekedar masalah warna, layout maupun

penggunaan ikon

- Perancang merancang untuk dirinya sendiri dan menggenalisir yang lain

- Perancang merencanakan untuk ”menambah interface yang baik ” di akhir proses

perancangan namun kemudian kehabisan waktu

- User selalu ”toleran” terhadap interface yang buruk.

• Perancangan berpusat pada pengguna memerlukan :

1.   Berfokus pada ketrampilan user

Mendukung pencapaian tujuan dan sasaran yang diinginkan

2. Mengembangkan kriteria penggunaan secara spesifik

Identifikasi dokumen dan penggunaannya secara khusus dan harapan pengguna yang

berpengalaman, dan lakukan ”uji regresi penggunaan”

3. Gunakan aturan yang terukur

Reaksi user dan skenario penggunaan petunjuk, simulasi, dan prototipe diawasi, dicatat dan

dianalisa terhadap pengguna lain

4. Berulang

Nothing is perfect first time. Rancang, bangun, evaluasi dan kemudian rancang ulang, bangun

kembali, re-evaluasi.

• Mengapa mementingkan user ?

- Apakah sistem membantu pencapaian tujuan?

- Apakah mudah dalam berinteraksi dengan sistem?

• Mengelola harapan / keinginan

- Apakah keinginannya cukup realistis dibanding  kemampuannya

- Tidak ada kejutan, tidak mengecewakan

- Pelatihan yang cukup waktu

- Komunikasi yang intens

• Kembangkan ”kepemilikan”

- Anggap pengguna sebagai pemilik

- Lebih menerima dan memaklumi segala masalah

- Dapat memberi perbedaan yang cukup untuk produk baru

• Siapakah pengguna (user)?

Mereka yang  :

- Bekerja  menggunakan sistem untuk mencapai tujuan :

ƒ Secara terus-menerus dan terampil

ƒ Tidak rutin dan tidak terampil

- Mengelola user langsung 

- Memerlukan pengembangan diri berulang 34

Maintenance

Test

Code

Design

Requirements analysis

• Siklus Hidup Untuk Pengembangan (RAD : Linier Sequential)

- Versi cepat dari waterfall, dengan pengembangan modular

- Menggunakan Joint Application Development

- Yang paling dibutuhkan user adalah workshop JAD

Project set-up

JAD workshops

Iterative design and build

Engineer and test final

Implementation review

•   V-Model 

-     Dikembangkan di Jerman untuk aplikasi pertahanan

-    Perlu tuntunan untuk pengujian jika terjadi perbedaan (Newman & Lamming, 1995)

Verifikasi : apakah sudah bekerja seperti yang diharapkan ? (uji dengan rancangan semula)

Validasi  :  apakah rancangan seperti yang diinginkan ? (uji dengan daftar kebutuhan)

-    Secara umum tes diperlukan untuk mendeteksi perbedaan

• Model siklus hidup yang berpusat pada user 

- Pengulangan selalu dibutuhkan jika kebutuhan untuk user belum terpenuhi ”ketidaktahuannya”

tanpa harus memberikan software dengan lingkungan yang baru.

- Resiko pada setiap tahap dalam pengembangan dapat dikurangi dengan memahami kebutuhan

user.

• Penggunaan Model Siklus Hidup Rekayasa (Mayhew,1999) 

Termasuk teknik yang berpusat pada pemakai pada setiap tahap.

Kebutuhan yang penting :

- Pandangan umum tentang penciptaan kegunaan

- Mempunyai hubungan dengan pendekatan perekayasaan software 35

- Tahap pengidentifikasian kebutuhan, perancangan, evaluasi, prototyping

- Dapat dipecah menjadi proyek-proyek yang lebih kecil

- Menggunakan suatu tuntunan untuk menangkap tujuan yang diharapkan

• Model Rancangan Interaksi Sederhana

- Satu titikan masukan

- Rancangan menghasilkan prototipe yang interaktif yang dapat dievaluasi

- Evaluasi dapat dilakukan dimana saja

- Evaluasi harus dikaitkan dengan hasil akhir

Identify needs/

establish requirements

(Re)Design

Build an 

interactive version

Evaluation

Final

• Model Siklus Hidup Star (Hartson & Hix, 1989)

Fasilitas yang penting :

1. Tidak kegiatan kecil yang harus selalu urut. Pengembangan dapat dilakukan di satu bagian saja

2. Pengujian dilakukan terus-menerus, tidak harus diakhir

3. Pengembangan dari pengamatan perancangan interface 

evaluation

task analysis/

functional analysis

Conceptual design/

formal design representation

Requirements/

specification

prototyping

implementation

• Efek domino dari IBM

- Mendefinisikan pasar

Tentukan sasaran yang akan dibidik, identifikasi pesaing, dan temukan kebutuhan umum

dari user dan pastikan bahwa produk akan sukses.

Metode : ajukan proposal pada sasaran untuk mengetahui sejauh mana keinginan untuk

mendapatkan produk yang baru, identifikasi prioritas dan solusi yang dilakukan saat ini.

- Analisa

Identifikasi kemampuan user, strategi yang digunakan untuk meningkatkan

ketrampilannya, alat yang saat ini dipakai, masalah-masalah yang dialami, perubahan

yang diinginkan baik dalam ketrampilan maupun peralatan.

Metode : tanya kemampuan user dan buat daftar dengan skala prioritas, observasi

ketrampilan di lapangan.

- Evaluasi kompetisi

Tentukan kekuatan dan kelemahan rancangan

Metode : pengguna diminta untuk mencoba menggunakan berbagi produk dan minta

untuk menyebutkan kelebihan dan kelemahan dari masing-masing produk. 36

- Rancang sambil jalan

Gunakan hasil analisa untuk membuat alternatif solusi, minta masukan sampai dengan

penentuan pilihan yang terbaik.

Metode : tanyai user sehubungan dengan pengalaman menggunakan prototipe

- Evaluasi dan validasi

Secara periodik user memberikan masukan selama pengembangan dan perancangan

akan diulang berdasarkan masukan tadi.

Metode : amati kebutuhan pokok user dalam menggunakan sistem.

- Benchmark 

Memadukan hal-hal terbaik yang dimiliki pesaing untuk diterapkan dalam sistem yang

dibangun

Metode : menggali informasi dari user hal-hal yang sebaiknya ada dibandingkan dengan

kompetitor, contoh : situs IBM.

• Paradigma dan prinsip dalam IMK

Bagaimana merancang sistem supaya dapat berdaya guna besar? Sejarah pengembangan sistem

interaktif masa lalu menjadi paradigma dalam pengembangan sistem baru. Prinsip

keberdayaagunanya sistem lebih penting dari penggunaan sistem itu.

Pemahaman

- Bagaimana sebuah sistem yang interaktif dapat dikembangkan untuk lebih berdayaguna

- Bagaimana kegunaan dari sebuah sistem yang interaktif dapat didemonstrasikan atau

diyakinkan.

Pendekatan

- Paradigma kegunaan, contoh tentang keberhasilan teknik interaktif

- Prinsip kegunaan, teori ditentukan oleh pengetahuan psikologi, perhitungan dan

sosiologi.

1. Paradigma kegunaan

Perspektif sejarah dalam merancang sistem yang interaktif

- Berdasar waktu

ƒ Tahun 40-50 an terjadi ledakan pertumbuhan teknologi

ƒ Tahun 60-an kebutuhan akan kekuatan jaringan

ƒ ARPA menerapkan teknik jaringan yang memungkinkan sebuah komputer dapat diakses

banyak orang/pengguna

- Unit peraga gambar

ƒ Media yang lebih baik daripada kertas

ƒ 1962 – komputer digunakan untuk menampilkan dan mengolah data

ƒ Berkat jasa seseorang dapat mengubah sejarah perkomputeran secara drastis

- Peralatan pemrograman

ƒ Engelbart dari Lembaga Riset Stanford

ƒ 1963 – bertambahnya kecerdasan manusia

ƒ 1968 – NLS/bertambahnya nilai sistem

ƒ Peralatan pemrograman semakin lengkap untuk membangun sistem interaktif yang

semakin kompleks

- Komputer Pribadi (PC)

ƒ 70 – an bahasa pemrograman LOGO yang mudah digunakan anak untuk membuat

gambar

ƒ Sistem semakin baik namun semakin mudah dioperasikan

ƒ Selanjutnya komputer makin kecil, namun semakin canggih

ƒ Munculnya notebook sebagai alternatif dari PC

- Sistem Window dan antarmuka WIMP

ƒ Manusia dapat melakukan lebih dari satu pekerjaan pada waktu yang sama

ƒ Window dipakai sebagai alat dialog untuk berganti topik

ƒ 1981 XeroxStar mempelopori sistem window untuk tujuan komersil

ƒ Wimp saat ini sudah menjadi mekanisme interaksi yang biasa. 37

- Proses perubahan

ƒ Menghubungkan komputer dengan aktivitas dunia nyata adalah teknik pengajaran yang

baik.

ƒ Permainan LOGO

ƒ Pengelolaan file pada komputer kantor

ƒ Penggunaan pengolah kata untuk mengetik

ƒ Analisa keuangan dengan spreadsheet

- Masalah

Beberapa fungsi tidak berjalan seperti seharusnya karena memerlukan perubahan budaya.

- Manipulasi langsung

ƒ 1982 – Schneiderman memperkenalkan interaksi berbasis grafis

¾ Objek yang terlihat

¾ Menambahkan kemampuan dan tanggapan yang cepat

¾ Memungkinkan pembetulan dalam semua kegiatan

¾ Menggantikan bahasa dengan aksi

ƒ 1984 – Apple Macintosh

ƒ What you see is what you get (WYSIWIG)

- Bahasa dan aksi

ƒ Aksi tidak selalu berupa kata-kata

ƒ DM – antar muka menggantikan paradigma bahasa sistem

¾ Antarmuka sebagai mediator

¾ Antarmuka berlaku sepert agen yang pintar

ƒ Pemrograman adalah contoh penyatuan aksi dengan bahasa

- Hypertext

ƒ 1945 – Vannevar Bush dan Memex sebagai kunci sukses dalam menangani ledakan

informasi

ƒ Pertengahan 60an Nelson menjelaskan hypertext sebagai struktur penelusuran nonlinear

ƒ Hypermedia dan multimedia

ƒ Proyek Xanadu Nelson masih merupakan mimpi

- Multi modal

ƒ Modelnya adalah saluran komunikasi manusia

ƒ Pada waktu yang bersamaan harus mampu menjadi saluran input/output

- Komputer yang dapat mendukung pekerjaan

ƒ Menghilangkan istilah single user/single computer 

ƒ Tidak mempunyai dampak sosial yang panjang

ƒ Email adalah salah satu bukti sukses

2. Prinsip mendukung kegunaan

Sebuah presentasi terstruktur tentang prinsip-prinsip umum yang diterapkan selama proses

perancangan sistem interaktif

- Dapat dipelajari

Seorang pengguna baru dapat segera mulai efektif berinteraksi dengan baik.

- Fleksibilitas

Memungkinkan pengubahan sistem informasi dengan berbagai cara

- Kekuatan

Menjamin tercapainya tujuan pengguna sesuai yang diharapkan

 a.   Prinsip Pembelajaran

- Kemungkinan peramalan

ƒ Memperkirakan kejadian masa depan berdasarkan sejarah masa lalu

ƒ Kelayakan operasional

- Kemungkinan melakukan sintesa

ƒ Menangani dampak dari kegiatan masa lalu

ƒ Segera vs kejadian yang sebenarnya

- Berlaku umum

Menyediakan pengetahuan interaksi secara khusus dalam suasana baru

- Konsisten / tetap

Dalam proses input/output dalam segala suasana 38

b. Prinsip Fleksibilitas

- Inisiatif dialog

ƒ Kebebasan sistem dalam dialog untuk input data

ƒ Sistem vs pengguna lama.

- Multithreading 

ƒ Mampu mendukung sistem untuk melakukan beberapa pekerjaan secara bersamaan

ƒ Concurrent vs interleaving 

- Proses bisa dipindahtempatkan 

ƒ Selalu tanggap terhadap perintah yang diberikan user kepada sistem 

- Penggantian

ƒ Memungkinkan nilai yang sama dari input dan output untuk dipertukarkan satu

dengan yang lain

- Mudah disesuaikan 

ƒ Dapat dimodifikasi sesuai lingkungan atau sistem

c. Prinsip ketegasan

- Kemampuan mengamati

ƒ User dapat melakukan evaluasi internal sistem dari gambaran yang dia peroleh

ƒ Memungkinkan melakukan penelusuran, standarisasi, kedayatahanan, mudah

dioperasikan

- Perlindungan 

ƒ Memungkinkan user untuk melakukan perbaikan apabila ditemukan kesalahan 

ƒ Dapat dilakukan sendiri, perlindungan kedepan dan kebelakang, seimbang

- Tanggap

Bagaimana user mampu menerima komunikasi dengan sistem

- Kemampuan menyesuaikan diri

ƒ Mampu memberi pelayanan kepada berbagai tingkatan user

ƒ Tugas lengkap dan sesuai 39

MACAM-MACAM PRESENTASI : 

KESEIMBANGAN ANTARA FUNGSI DENGAN FASHION

PESAN KESALAHAN

• Ketentuan

- Pesan yang terlalu umum mempersulit pemula untuk mengetahui apa yang salah

- Pesan yang tampak memarahi membuat frustasi  karena tidak menyediakan informasi tentang

apa yang keliru atau bagaimana cara memperbaikinya.

Contoh :

Buruk  Baik

SYNTAX ERROR  Tidak sesuai dengan aturan penulisan

ILLEGAL ENTRY  Ketikan huruf pertama : Send, Read or Drop

INVALID DATA  Beri range data misal hari dari 1 – 31

BAD FILE NAME  Nama file harus mulai dari huruf

• Panduan konstruktif dan nada positif

- Daripada memarahi pemakai, jika mungkin pesan harus menunjukkan apa yang harus dilakukan

pemakai untuk memperbaiki keadaan

- Pesan yang bermusuhan menggunakan istilah yang kejam dapat mengganggu pemakai

nonteknis, misal FATAL ERROR

- Hindari kata-kata negatif seperti : ILLEGAL, ERROR, INVALID, BAD

Contoh : 

ƒ Buruk  :   DISASTROUS STRING OVERFLOW, JOB ABONDONED

Baik   :   String space consummed. Revise program to use shorter strings or expand 

    string space

ƒ Buruk  :   UNDEFINED LABELS

Baik   :   Define statement labels before use

ƒ Buruk  :   ILLEGAL STA. WRN.

Baik   :   RETURN statement cannot be used in a FUNCTION subprogram

• Pemilihan kata berpusat pemakai

- Menunjukkan bahwa pemakai mengendalikan sistem

- Hindari bentuk perintah ENTER DATA, fokuskan pada kendali pemakai (READY)

- Pemakai harus mempunyai kendali atas sejumlah informasi yang ditampilkan

• Format fisik yang sesuai

- Gunakan kombinasi huruf besar dan kecil. Pesan dengan huruf besar semua hanya

digunakan untuk peringatan gawat

- Hindari pesan hanya dengan nomor kode.  Jika perlu tampilkan kode di akhir pesan

- Penempatan pesan : dekat sumber masalah, dibaris pada bagian bawah layar, sebagai

pop-up window di tengah layar.

- Peringatan dengan suara berguna tetapi dapat memalukan pemakai, pemakai harus dapat

mengendalikannya.

• Rancangan pesan yang efektif

- Produk

ƒ Sespesifik dan sepresisi mungkin

ƒ Konstruktif : tunjukkan apa yang harus dilakukan

ƒ Gunakan nada positif, jangan memarahi

ƒ Gunakan kata yang berpusat ke pemakai

ƒ Gunakan tatabahasa, istilah dan singkatan yang konsisten

ƒ Pertimbangkan pesan yang bertingkat

ƒ Gunakan format visual dan penempatan yang konsisten

- Proses

ƒ Bentuk gugus kendali kualitas pesan

ƒ Sertakan pesan dalam tahap perancangan

ƒ Simpan semua pesan dalam sebuah file 40

ƒ Bahas pesan dalam pengembangan

ƒ Usahakan untuk menghapus beberapa kebutuhan pesan

ƒ Laksanakan uji penerimaan (acceptance test)

ƒ Kumpulkan data frekuensi setiap pesan

ƒ Kaji ulang dan perbaiki pesan dari waktu ke waktu.

RANCANGAN NONANTROPOMORFIK

• Antropomorfik

=  sifat suatu barang yang memiliki sifat atau pribadi manusia

• Masalah yang muncul dengan instruksi antropomorfik, sekaligus alasan untuk menggunakan

instruksi nonantropomorfik :

- Pemberian sifat cerdas, bebas, berkehendak  bebas dan berpengetahuan kepada komputer dapat

menipu, membingungkan, dan menyesatkan pemakai

- Penting untuk membedakan manusia dengan komputer

- Meskipun antarmuka antropomorfik bisa menarik beberapa orang, namun dapat mengganggu

orang lain

- Penelitian menunjukkan bahwa instruksi nonantropomorfik lebih baik

• Alternatif bagi perancang software adalah memfokuskan pemakai dan menggunakan kata ganti

orang ketiga tunggal atau tidak menggunakan kata ganti sama sekali, contoh :

Buruk : I will begin the lesson when you press RETURN

Lebih baik : You can begin the lesson by pressing RETURN atau

   To begin the lesson, press RETURN

• Pedoman Perancangan Nonantropomorfik

- Hindari menampilkan komputer sebagai orang pribadi (manusia)

- Gunakan tokoh yang sesuai (manusia ataukarakter animasi) dalam pengenalan atau sebagai

pemandu

- Hati – hati dalam merancang wajah manusia atau tokoh kartun dengan komputer

- Gunakan karakter kartun di games atau software anak-anak jika diperlukan

- Rancang antarmuka yang dapat dimengerti, dapat diramalkan, dan dapat dikendalikan

- Gunakan sudut pandang pemakai dalam orientasi dan keadaan selesai

- Jangan gunakan ”I” ketika komputer menanggap aksi pemakai

- Gunakan ”You” hanya untuk memandu pemakai dan menyebutkan fakta-fakta

• Rancangan tampilan (display)

- Pada setiap tahap dalam sekuen transaksi, pastikan bahwa data apapun yang dibutuhkan

pemakai tersedia pada tampilan

- Tayangkan data kepada pemakai dalam bentuk yang langsung dapat digunakan, jangan

mengharuskan pemakai mengkonversikan data yang ditampilkan

- Untuk setiap jenis tampilan data, pertahankan format yang konsisten dari satu tampilan ke

tampilan lainnya.

- Gunakan kalimat yang pendek dan sederhana

- Gunakan pernyataan yang positif, bukan negatif

- Gunakan prinsip logis dalam pengurutan list, jika tidak ada aturan khusus, urutkan secara

alfabetis

- Pastikan label cukup dekat dengan data field yang berhubungan tetapi harus dipisahkan dengan

paling sedikit satu spasi

- Buat kolom data alfabetis rata kiri agar mudah ditelusuri

- Pada tampilan banyak halaman,berikan label pada setiap halaman untuk menunjukkan

hubungan dengan halaman lainnya.

- Awali setiap tampilan  dengan judul atau header yang menggambarkan secara singkat isi atau

tujuan tampilan, sisakan paling sedikit satu baris kosong antara judul dan isi tampilan.

- Untuk kode ukuran, simbol yang lebih besar tingginya paling sedikit 1,5 kali tinggi simbol

berikut yang lebih kecil

- Gunakan kode warna untuk aplikasi sehingga pemakai dapat membedakan dengan cepat

berbagai kategori data, khususnya ketika item data terpencar pada tampilan

- Jika menggunakan blink, kecepatan kedip harus antara 2 – 5 herts dengan minimum duty cycle

50 persen

- Untuk tabel dasar yang melebihi kapasitas display pastikan pemakai dapat melihat kepala

kolom dan label baris di semua bagian

- Jika kebutuhan tampilan data berubah, sediakan cara bagi pemakai (administrator sistem) untuk

melakukan perubahan yang diinginkan. 41

• Warna

- Warna dapat menarik bagi pemakai dan dapat meningkatkan kinerja tetapi dapat

disalahgunakan

- Warna dapat :

ƒ Menyejukkan atau menyakiti mata

ƒ Menambah aksen pada tampilan yang tidak menarik

ƒ Memungkinkan pembedaan yang halus pada tampilan yang kompleks

ƒ Menekankan organisasi logis informasi

ƒ Menarik perhatian kepada peringatan

ƒ Menimbulkan reaksi emosional yang kuat berupa sukacita, kegembiraan, ketakutan atau

kemarahan

- Untuk tampilan komputer digunakan adaptasi prinsip-prinsip pemberian warna dalam  buku,

majalah, rambu-rambu dan TV

• Pedoman penggunaan warna

- Gunakan warna secara konservatif

- Batasi jumlah warna 

- Kenali kekuatan warna sebagai teknik pengkodean

- Pastikan bahwa warna simbol mendukung tugas

- Tampilkan warna simbol dengan usaha pemakai yang minimal

- Tempatkan warna simbol dibawah kendali pemakai

- Rancang untuk monokrom dulu

- Gunakan warna untuk membantu pemformatan

- Gunakan warna simbol yang konsisten

- Perhatikan ekspektasi umum tentang warna simbol

- Perhatikan masalah perpaduan warna

- Gunakan perubahan warna untuk menunjukkan perubahan status

- Gunakan warna pada tampilan grafis untuk kerapatan informasi yang lebih tinggi

- Waspada atas kehilangan resolusi pada tampilan warna

Catatan : Baca kembali kombinasi warna terburuk & warna terbaik pada materi sebelumnya 42

PEMILIHAN MENU DAN PENGISIAN FORMULIR

• Jenis-jenis menu

- Single menu (menu tunggal)

ƒ Menu biner  (binary menus)

¾ Anda butuh bantuan informasi (Y/N)?

¾ Selama Anda bermain, Anda dapat ketikkan ? untuk mendapat panduan singkat untuk

bermain atau ?? untuk mendapat petunjuk lebih lengkap. Pastikan menekan tombol

ENTER setelah mengetikkan perintah.

ƒ Mnemonic letters

¾ Photo akan ditampilkan berdasarkan 

H Æ Hitam dan Putih

WÆ Warna

Pilih huruf pilihan Anda 

ƒ Button choices

- Multiple-item menus 

ƒ Siapakah penemu pesawat telepon ?

a) Thomas Edison

b) Alexander Graham Bell

c) Lee De Forest

d) George Westinghouse

Tekan / sentuh pilihan Anda.

ƒ Drive A tidak terbaca ?

Abort, Retry, Ignore, Fail ?

- Radio buttons

- Extended menus 43

- Pull – down and pop – up menus

- Menu tetap (permanent menus) : iconics menus, toolbars or pallets

- Multiple – selection menus (check boxes)

 

- Linear sequences and multiple menus (urutan linear dan menu ganda)

ƒ Memandu pemakai melalui serangkaian pilihan dengan urutan yang sama

ƒ Menstrukturisasi proses pengambilan keputusan

Contoh : 

¾ Linear menu : wizard

¾ Multiple menu : kotak dialog yang mengandung seperangkat menu – menu yang tidak

tergantung satu sama lain 44

- Menu pohon (menu tree) 

Depth    : jumlah level

Breadth : jumlah pilihan per level

- Pengelompokan semantik

ƒ Kelompokkan item yang serupa secara logis

ƒ Kelompokkan item yang melingkupi segala kemungkinan

ƒ Pastikan item tidak saling menindih

ƒ Gunakan peristilahan yang dikenal

- Acyclic dan cyclic menu networks (jaringan menu asiklik dan siklik)

Berguna untuk : 

ƒ Hubungan sosial

ƒ Rute transportasi

ƒ Referensi jurnal ilmiah

• Bergerak pada menu dengan cepat

- Menu dengan typeahead

ƒ Pemakai tidak perlu menunggu menu ditampilkan sebelum memilih menu, tetapi dapat

langsung mengetikkan serangkaian karakter dari menu utama

ƒ Penting jika menu sudah dikenal dan waktu respon atau kecepatan tampil lambat

ƒ Pendekatan BLT (bacon, lettuce, and tomato sandwich)

Menu yang terdiri dari pilihan-pilihan yang dipilih dengan satu karakter dengan typeahead

yang memungkinkan karakter-karakter tersebut digabung menjadi mnemonik

- Nama menu untuk akses langsung

ƒ Skema penamaan yang memungkinkan pemakai mengakses halaman secara langsung

Contoh : JUMP pada Prodigy

ƒ Berguna hanya jika ada sedikit kemungkinan tujuan yang perlu diingat pemakai.

ƒ Diperbaiki dengan Bookmark atau Favourites pada web browser

- Menu macros

Merekam jalur menu yang sering digunakan sebagai perintah buatan sendiri 45

• Pedoman perancangan menu

- Gunakan tasc semantic dalam organisasi menu

- Lebih baik luas dan dangkal daripada sempit dan dalam

- Tunjukkan posisi dengan gambar, angka, atau judul

- Gunakan nama item sebagai judul pada tree

- Gunakan pengelompokkan item yang berarti

- Tampilkan item dengan singkat, mulai dengan keyword

- Gunakan tatabahasa, layout, dan peristilahan yang konsisten

- Sediakan typeahead, jumpahead, dan shortcut lainnya

- Sediakan lompatan ke menu sebelumnya dan menu utama

- Perhatikan petunjuk online, mekanisme pilihan ”baru”, waktu respons, kecepatan tampil, dan

ukuran layar.

• Pedoman perancangan formulir

- Gunakan judul yang berarti

Identifikasi topik dan jauhi istilah komputer

- Gunakan petunjuk yang dapat dipahami

ƒ Jelaskan task dengan singkat dan jika perlu sediakan layar petunjuk

ƒ Gambarkan aksi yang harus dilakukan 

ƒ Hindari kata ganti atau referensi ke pemakai

ƒ ”Type the address” bukan ”Enter the address”

- Kelompokkan dan urutkan field secara logis

ƒ Field yang berhubungan harus berdekatan

ƒ Pemisah antara kelompok harus jelas

ƒ Urutan wajar (kota, propinsi, kode pos)

- Layout formulir harus menarik secara visual

ƒ Field jangan dikumpulkan di satu tempat

ƒ Perhatikan alignment

ƒ Formulir di layar harus menyerupai di kertas

- Gunakan label field yang dikenal pemakai

Gunakan istilah umum, contoh : alamat lebih umum daripada domisili

- Gunakan peristilahan dan singkatan yang konsisten

ƒ Daftarkan istilah dan singkatan yang dapat diterima 

ƒ Pergunakan daftar tersebut dan tambahkan isinya jika sudah dipertimbangkan baik-baik

- Ruang kosong dan batas field yang perlu diisi data harus jelas terlihat

Berikan tanda jumlah karakter yang dapat diisi

- Kursor harus dapat digerakkan dengan leluasa

Perhatikan penggunaan tombol Tab dan anak panah

- Memungkinkan koreksi kesalahan untuk karakter atau field 

Backspace, delete, overtyping

- Tampilkan pesan kesalahan untuk nilai yang tak dapat diterima

Tampilkan nilai-nilai yang boleh diisikan

- Tandai field optional dengan jelas

Tandai dengan ”optional” atau lainnya

- Jika memungkinkan, tampilkan pesan yang menjelaskan

Berikan informasi mengenai field atau isinya

- Sediakan tanda selesai

ƒ Pemakai harus diberitahu bahwa pengisian selesai

ƒ Hindari penyelesaian otomatis 46

STRATEGI MULTIPLE WINDOW

• 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 house keeping, clutter yang mengalihkan perhatian,

pergerakan mata dan kepala.

• Window housekeeping adalah aktivitas mengurusi window yang berhubungan dengan dunia

komputer dan tidak langsung berhubungan dengan tugas pemakai

• Perancangan window tunggal

- Komponen-komponen window

ƒ Judul

¾ Untuk identifikasi window

¾ Beberapa window tidak mempunyai judul

¾ Tempat judul dapat berubah warna untuk menunjukkan window yang sedang aktif

ƒ Bingkai (border atau frame)

Untuk menandai batas window

ƒ Scroll bars

Untuk menggulung (memindahkan tampilan ke isi window)

Judul

Scroll Bar

Bingkai

- Aksi-aksi window meliputi :

ƒ Aksi membuka (open action)

¾ Window dibuka dari ikon atau menu dengan suatu perintah yang diketik, pilihan menu,

perintah suara, klik atau klik ganda

¾ Umpan balik sangat bermanfaat

ƒ Aksi membuka, menempatkan, dan menentukan ukuran

¾ Window tampil ditempat yang dirancang dengan ukuran yang sama, sehingga dapat

diramalkan tetapi sering harus dipindahkan dan diubah ukurannya

¾ Window ditampilkan pada tempat dan ukuran terakhir

¾ Window ditampilkan menggunakan pendekatan perhitungan yang menentukan tempat

dan ukuran berdasarkan window-window yang sudah ada tampilan 

¾ Window ditampilkan dekat fokus

¾ Window pesan ditampilkan secara otomatis

ƒ Aksi menutup (close action)

¾ Window mempunyai ikon kecil untuk menutup dirinya

¾ Window dapat juga ditutup dengan tombol Close, Cancel atau OK

ƒ Aksi mengubah ukuran (resize action)

¾ MS Windows, OS/2 dll memungkinkan  resize dari seluruh pojok dan keempat sisi

¾ Beberapa sistem memungkinkan window diminimisasi atau maksimasi

ƒ Aksi memindahkan (move action)

¾ Pada Mac OS, MS Windows, dll title bar dapat diseret untuk memindahkan window

¾ Beberapa sistem mengharuskan seluruh window terlihat di layar, sementara yang lain

membolehkan hanya sebagian saja. 47

ƒ Aksi membawa ke depan atau mengaktifkan

¾ Ketika digunakan window bertumpuk perlu dibuat mekanisme untuk membawa window

ke depan dan mengaktifkannya

¾ Cara – cara :

o Mengetikkan perintah dengan keyboard

o Mengklik pada menu daftar window yang terbuka

o Mengklik bagian apapun dari window

o Memindahkan kursor ke atas window

• Perancangan multiple window 

- Tantangan untuk memberi akses kepada banyak sumber informasi telah membangkitkan banyak

solusi

ƒ Multiple monitors

¾ Beberapa monitor digunakan untuk menampilkan informasi

¾ Jarak antar monitor memperlambat pekerjaan

ƒ Rapid display flipping

Perpindahan diantara tampilan pada satu monitor secara otomatis atau dikendalikan pemakai

ƒ Splits displays

ƒ Tampilan dibelah untuk menampilkan dua bagian dokumen atau lebih atau dua dokumen

atau lebih

Contoh : wordstar, wordperfect, lotus 123

ƒ Fixed number, size, and place, and space-filling tiling

¾ Tiling pembelahan tampilan sederhana

¾ Jumlah, ukuran, dan posisi tile selalu sama

ƒ Variable size, place, and number, and space – filling tiling

¾ Mulai dengan sebuah window besar

¾ Ketika window kedua dibuka, potong window pertama secara horisontal atau vertikal

untuk menyediakan ruang bagi window kedua

ƒ Non – space – filling tiling

¾ Tidak seluruh tampilan perlu ditutupi

¾ Celah diantara tile diperbolehkan tetapi penumpukan tidak

ƒ Piles – of – tiles

¾ Variasi dari strategi dasar tiling

¾ Window dapat ditumpuk penuh seperti menumpuk ubin

¾ Biasanya fixed size dan fixed position

ƒ Window zooming

Pemakai dapat memperluas ukuran window hingga selayar penuh dan kemudian

memperkecilnya kembali ke ukuran semula, contoh : 48

ƒ Arbitary overlaps

¾ Window dapat digerakkan ke titik manapun dari tampilan dan sebagian dapat berada di

luar tampilan, terpotong oleh batas layar

¾ Disebut juga sistem window dua setengah dimensi karena window seakan-akan

mengapung diatas window lainnya

¾ Kekurangannya mengaburkan bahan yang relevan dan meningkatkan beban

housekeeping

ƒ Cascades

Aplikasi metafora ”tumpukan kartu” dengan mengurutkan window secara berundak dari

atas ke kanan bawah atau dari kiri bawah ke kanan atas

• Koordinasi dengan window yang rapat

- Kelas koordinasi yang dapat dikembangkan oleh developer :

ƒ 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

¾ Berguna untuk membandingkan dua versi dokumen

Contoh :  Tampilan pada Adobe Reader, Microsoft Power Point, dll

ƒ Hierarchical browsing

Window yang satu berisi daftar isi atau daftar pilihan yang jika dipilih akan menampilkan

isinya di window lainnya

Contoh : tampilan Windows Explorer 49

ƒ Direct selection

Mengklik ikon, kata pada tulisan atau nama variabel pada program memunculkan window

yang memperinci penjelasannya.

Contoh : tampilan Help

ƒ Two dimensional browsing

Menunjukkan pandangan high level dari peta, grafik, foto atau gambar lainnya di sudut

yang satu dan rincian di window yang lebih besar

ƒ Dependent windows opening

Dengan membuka window, window-window lainnya yang tergantung dengannya terbuka

juga pada lokasi yang berdekatan dan memudahkan, contoh : tampilan Winamp

   50

ƒ Dependent windows closing

Menutup window dapat menutup semua dependent windows

ƒ Save or open window state

Keadaan terakhir sistem meliputi window dan isinya dapat disimpan

• Melihat citra dengan multiple windows

Ketika seseorang melihat sebuah site geografi atau kesehatan, sepasang scroll bar tampak ketika

ukuran gambar yang lebih kecil dari ukuran layar. Untuk memperjelas maka dapat dilakukan

dengan zooming terhadap gambar dimaksud.

Ada berbagai cara membuat image browser yang sesuai dengan kebutuhan pengguna :

- Image generation 

Membuat gambar atau diagram dalam ukuran besar

- Open – ended exploration

Melihat supaya lebih jelas bagian dari sebuah peta atau gambar

- Diagnostic

Penelusuran suatu diagram sirkuit, biasanya pada bidang kedokteran atau layout surat kabar

- Navigation

- Monitoring 51

ALAT BANTU EKSPLORASI INFORMASI

• Dokumen adalah organisasi informasi yang dapat berisi teks, gambar, dan sebagainya.

• Alat – alat bantu pencarian informasi dalam dokumen antara lain :

- indeks  : daftar penulis, daftar judul, daftar tabel, daftar gambar, daftar kata-kata kunci, dll

- konkordansi : daftar kata – kata dengan penunjuk ke baris tertentu yang memunculkannya

- thesaurus : daftar sinonim dan istilah – istilah yang lebih luas maupun lebih sempit

- daftar isi : isi dokumen secara garis besar

PENCARIAN STRING, DATABASE QUERY DAN INDEKS

• Filter adalah pola yang dipakai untuk menyaring data sedemikian sehingga hanya data yang cocok

dengan pola diperbolehkan lewat

• Alat bantu pada pencarian berbasis komputer

- Full – test string search

ƒ Pemakai mengetikkan kata dan sistem mencari kemunculan berikut kata tersebut dalam

dokumen atau memberikan daftar lengkap dokumen yang mengandung kata tersebut

ƒ Word stemming : mengikutsertakan bentuk jamak dan bentuk varian lainnya

ƒ Word proximity : mencari lebih dari satu kata yang bersebelahan dalam kalimat atau

paragraf yang sama.  Contoh : human-computer interaction

ƒ Boolean combination : AND, OR, NOT dan pengelompokkan dengan tanda kurung,       

contoh :  (javanese OR sundanese) AND cooking

ƒ Online thesaurus : menambahkan sinonim atau istilah – istilah yang lebih luas dan lebih

sempit

ƒ Word – list input : pemakai dapat memasukkan banyak kata dengan umpanbalik yang

relevan menunjukkan kekuatan hubungan antara istilah – istilah yang dicari dan dokumen,

contoh : pencarian dalam web search engine

ƒ Document retrieval : pemakai menunjukkan dokumen mana yang relevan, kemudian sistem

menyediakan lebih banyak dokumen – dokumen yang seperti itu, contoh : pencarian dalam

web search engine

- Formatted field search

Pemakai menuliskan permintaan dengan menuliskannya dalam bahasa query, contoh :

pernyataan dalam SQL.

- Controlled – vocabulary index search

ƒ Pemakai menjelajahi indeks hirarkis istilah-istilah yang dibahas di koleksi dokumen, yang

telah dibuat oleh pemilik koleksi

ƒ Indeks dapat disusun secara alfabetis, geografis, kronologis,dll

ƒ Keuntungan :

¾ Istilah-istilah dipilih dengan hati-hati

¾ Sinonim diacu silang (cross – referenced)

¾ Struktur hirarkis mengelompokkan dokumen-dokumen sejenis

- Back of the book index and table of contents search

ƒ Indeks dibelakang buku sering dibuat oleh penulis dan mendaftarkan topik-topik penting

dengan kumpulan topik-topik yang berhubungan dan acuan silang

ƒ Daftar isi biasanya juga dibuat oleh penulis dan biasanya lebih pendek daripada indeks,

tetapi sekuensial berdasarkan topik

ƒ Keuntungan : dapat ditelusuri dengan mudah untuk memperoleh kesan ruang lingkup

pembahasan

- Concordance and key – word in context

ƒ Konkordansi merupakan indeks yang dihasilkan secara otomatis mengenai seluruh kata

(kecuali yang sudah didaftarkan sebagai kata-kata yang terlalu umum digunakan) 

ƒ Terlalu besar untuk digunakan dalam penjelajahan atau untuk memperoleh gambaran

keseluruhan  52

PENCARIAN FLEKSIBEL

• Rainbow search

- Pencarian tidak hanya dapat dilakukan pada teks polos, tetapi mendukung pencarian dengan

jenis teks (font), ukuran, style (tebal, miring, garis bawah) dan atribut serta style paragraf.

- Contoh : pencarian di MS – Word, MS – Excel, dll

• Search Expansion

- Untuk pencarian antar dokumen, pencarian dapat dilakukan hanya pada komponen tertentu,

seperti judul, abstrak, kesimpulan

- Thesaurus dapat membantu menyediakan istilah-istilah yang lebih spesifik atau lebih luas,

sinonim atau istilah-istilah lain yang berhubungan.

• Sound search

- Pencarian pada database suara

- Pencarian dilakukan dengan cara :

ƒ Pemakai bersenandung

ƒ Pemakai memasukkan not-not dari lagu yang dicari

• Picture search

- Pencarian database gambar

- Menggunakan program analisis citra komputer sehingga hasilnya dapat digunakan dalam

algoritma pencarian

• Photograph libraries

- Biasanya disusun berdasarkan tanggal, jurufoto, lokasi geografis atau topik

- Indeks sering tidak tepat dan acuan silangnya tidak lengkap

- Dapat diperbaiki dengan :

ƒ Informasi tanggal, juru foto, tempat (lokasi) dan topik yang disertakan langsung dalam

gambar

ƒ Pencarian profil gambar dengan menggambar menggunakan alat gambar sederhana

HYPERTEXT DAN HYPERMEDIA

• Pertama kali diperkenalkan oleh Vannenar Bush, Juli 1945 pada artikel yang berjudul ”As We May

Think”

• Beberapa hal yang dikemukakan Bush :

- Akan adanya masalah luapan informasi

- Perlu dibuat piranti yang memungkinkan acuan silang (cross check) dalam dokumen dan antar

dokumen dengan mudah

- Usulan piranti eksplorasi informasi  yang diberi nama Memex dan berbasis teknologi mikrofilm.

• Hypertext dan Hypermedia adalah :

- Dokumen non sekuensial dan non linear

- Jaringan simpul (artikel, dokumen, file, kartu halaman, frame, layar) yang dihubungkan dengan

link 

- Hypertext biasanya digunakan untuk menyebut aplikasi berisi hanya teks

- Hypermedia digunakan untuk menyampaikan keterlibatan media lain, khususnya gambar,

animasi, suara, dan video

- Sistem – sistem hypertext :

ƒ Memex (1945) oleh Vannenar Bush, tidak pernah diimplementasikan.

ƒ Augment / NLS (1962 – 1976) oleh Engelbart

ƒ Xanadu (1965) oleh Ted Nelson :

Pertama kali istilah hypertext diperkenalkan

Visi : hypertext universal yang mencakup semua yang pernah ditulis manusia

ƒ Hypertext editing system (1976) dan FRESS (1968) proyek riset Brown University

ƒ Aspen Movie Map (1978) oleh Andrew Lippman dan MIT merupakan sistem hypermedia

pertama

ƒ KMS (1983) dari Knowledge System Inc.

ƒ Hyperties (1983) oleh Ben Scheneiderman, kemudian dipasarkan dan diperluas oleh

Cognetics Group.

ƒ NoteCards (1985) dari XEROC PARC

ƒ Symbolics Document Examiner (1985) 53

ƒ Sistem hypertext pertama yang dibuat untuk penggunaan di dunia nyata

¾ Intermedia (1985) dari Brown University

¾ Guide (1986) dari OWL International

Sistem hiperteks komersial populer yang pertama

¾ Hypercard (1987) oleh Bill Atkinson

Produk hyperteks paling terkenal pada akhir 1980-an

Diberikan gratis dari komputer Apple (1987 – 1992)

¾ World Wide Web (1993) oleh Tim Berners – Lee dan kawan-kawan di CERN, Geneva,

Switzerland 

o Perkembangan pesat hyperteks di internet

o Aplikasi yang digunakan untuk menggunakan WWW disebut Web Browser

o Contoh  web browser : NCSA Mosaic, Microsoft Internet Explorer, Netscape

Navigator

- Aturan emas hypertext

ƒ Ada badan informasi besar yang diorganisasikan menjadi beberapa fragmen

ƒ Fragmen-fragmen tersebut saling berhubungan

ƒ Pemakai hanya memerlukan sebagian kecil dari fragmen pada suatu waktu

- Aplikasi hypertext 

ƒ Bisnis

¾ Katalog produk dan iklan

¾ Bagan organisasi, panduan kebijakan

¾ Laporan tahunan dan pedoman orientasi

¾ Resume dan biografi

¾ Perjanjian, kontrak, dan surat perintah

¾ Newsletters  dan majalah berita

¾ Dokumentasi software dan kode

ƒ Sumber daya informasi

¾ Ensiklopedia, penjelasan istilah, dan kamus

¾ Buku referensi medis, hukum, dll

¾ Tafsiran religius dan sastra

¾ Katalog buku ilmiah dan pedoman departemen

¾ Petunjuk wisata dan restoran

¾ Jurnal ilmiah, abstrak, indeks

ƒ Pelajaran pribadi

¾ Pengajaran dan eksplorasi

¾ Jadwal dan peta geografis

¾ Petunjuk perbaikan dan pemeliharaan

¾ Online Help dan petunjuk perbaikan rumah

¾ Cerita misteri, fantasi, dan lelucon

¾ Hypernovels dan hyperpoems

KELENGKAPAN ANTARMUKA PEMAKAI HYPERTEXT

• Isi

- Simpul atau node (teks,gambar,video, suara)

Satuan dasar hypertext

- Link

Hubungan yang berasal dari titik tertentu untuk memungkinkan pemakai mengaktifkan objek

tertentu untuk mengikutinya.

- Format, margin, font, spacing

- Resolusi layar, ukuran, warna

- Ukuran dan manajemen window

• Interaksi 

- Mekanisme pemilihan (sentuh, layar, keyboard) 

- Waktu respon dan kecepatan tampil

- Control panel untuk video dan animasi

- Pemanggilan program dan database eksternal

• Navigasi 

- Struktur berbentuk graph

- Daftar isi ganda

- Ringkasan grafik atau tabular 54

- Penggunaan indeks atau pencarian kata kunci

- Posisi dan indikator ukuran

• Pencatatan

- History jalur dan bookmark

- Anotasi

- Kemampuan ekspor

- Penyimpanan status dan hasil pencarian

MENYUSUN DAN MENYUNTING HYPERTEXT

• Hal-hal yang perlu menjadi pertimbangan :

- Kenali pemakai dalam pengembangan 

- Studi terhadap populasi target

- Buat demo dan prototipe 

• Pastikan struktur yang berarti terpenting 

Proyek dibangun atas dasar struktur dan presentasi informasi bukan teknologi

• Terapkan ketrampilan yang beraneka ragam

Tim proyek perlu meliputi spesialis informasi (pelatih, psikolog), spesialis isi (pemakai, pemasar)

dan teknologi (analis sistem, programmer)

KELENGKAPAN ANTARMUKA PEMAKAI HYPERTEXT

• Hargai pemilahan

Informasi perlu dipilah-pilah berdasarkan topik, tema, atau ide

• Tunjukkan hubungan yang ada

Setiap dokumen harus berhubungan dengan dokumen lainnya

• Konsisten dalam penamaan dokumen

Daftar nama dokumen perlu dibuat

• Bekerja dari daftar referensi utama

- Buat daftar referensi utama agar memastikan link yang benar

- Hindari link yang redundant atau hilang

• Pastikan penjelajahan sederhana

Navigasi harus sederhana, intuitif dan konsisten di seluruh sistem 

• Rancang setiap layar dengan hati-hati

- Layar harus dapat dipahami dengan mudah

- Layout visual sangat penting

• Gunakan beban kognitif yang rendah

- Kurangi beban ingatan jangka pendek pemakai

- Jangan haruskan pemakai mengingat sesuatu dari layar yang satu ke layar yang lain.

MULTIMEDIA

• Multimedia : penggunaan lebih dari sekedar teks pada aplikasi, muliputi : citra, suara, video,

animasi

• Macam-macam media penyimpanan pada multimedia :

- Videodisc (12  inch) : 54.000 gambar diam per sisi

- Compact Disc : 600 MB data, 74 menit musik

- Digital Video : 4.7 GB data, cukup untuk satu film

• Algoritma kompresi video

- DVI (Digital Video Interactive)

1 detik full-motion video dikompresi menjadi 150 Kb (5 KB per frame)

-    MPEG (Motion Picture Expert Group)

ƒ MPEG – 1 (untuk VCD) : 352 x 240 pixel, 30 fps

ƒ MPEG – 2 (untuk DVD) : 720 x 480 atau 1280 x 720 pixel, 60 fps

ƒ MPEG – 3 (HDTV)

ƒ MPEG – 21, multimedia framework 55

REFERENSI

1. A.J. Dix, J.E. Finlay, G.D. Abowd and R. Beale, “Human-Computer Interaction”, Third Edition,

Prentice Hall, USA, 2003

2. Deborah J. Mayhew, “Principles and Guidelines in Software User Interface Design”, Prentice

Hall, USA, 1992

3. Schneiderman, Ben, “Designing The User Interface : Strategic for Effective Human – Computer

Interaction”, 2nd edition, Addison-Wesley, 1992

4. P. Insap Santosa, “Interaksi Manusia dan Komputer; Teori dan Praktek”, Andi Yogyakarta, 1997

5. Heribertus Himawan, Solichul Huda, “Catatan Kuliah Interaksi Manusia dan Komputer”, Sistem

Informasi Udinus, 2007