desain user interface.pdf

Politeknik Telkom Desain User Interface

i

INTERAKSI MANUSIA & KOMPUTER

POLITEKNIK TELKOM

BANDUNG

2009


ii

PENULIS:

AGUS PRATONDO

Dilarang menerbitkan kembali, menyebarluaskan, atau menyimpan baik

sebagian maupun seluruh isi buku dalam bentuk dan dengan cara apapun

tanpa izin tertulis dari Politeknik Telkom

Hak cipta dilindungi undang-undang @ Politeknik Telkom 2009

No part of this document may be copied, reproduced, printed, distributed, modified,

removed and amended in any form by any means without prior written

authorization of Telkom Polytechnic.

Copyright @ 2009 Telkom Polytechnic. All rights reserved


iii

KATA PENGANTAR

Assalamu‟alaikum Wr. Wb.

Segala puji bagi Allah SWT karena dengan karunia-Nya courseware ini dapat

diselesaikan.

Atas nama Politeknik Telkom, kami sangat menghargai dan ingin

menyampaikan terima kasih kepada penulis, penerjemah dan penyunting atas

kontribusi yang telah diberikan sehingga courseware ini dapat tersusun.

Kami mendorong para pengajar & mahasiswa untuk memberikan masukan

yang positif. Saran mereka akan menjadi bahan pertimbangan yang serius dan

banyak yang akan dimasukkan sebagai bahan perbaikan di edisi berikutnya.

Kami akan sangat mengahargai apabila semua pihak dapat menyampaikan

pendapatnya melalui [email protected].

Semoga courseware ini dapat memberikan manfaat bagi seluruh Civitas

Akademika Politeknik Telkom dalam memahami materi perkuliahan di

Politeknik Telkom.

Amin.

Wassalamu‟alaikum Wr. Wb.

Bandung, September 2009

Christanto Triwibisono

Wakil Direktur I

Bidang Akademik & Pengembangan

mailto:[email protected]


iv

DAFTAR ISI

KATA PENGANTAR ............................................................... iii

DAFTAR ISI .............................................................................. iv

1 PENGANTAR INTERAKSI MANUSIA DENGAN

KOMPUTER ............................................................. 1

1.1 Pendahuluan...................................................................... 2

1.2 Model Interaksi ................................................................. 6

1.3 Bidang yang Berkaitan....................................................... 7

1.4 Usability .......................................................................... 11

2 MANUSIA ............................................................... 20

2.1 Penglihatan ...................................................................... 21

2.2 Pendengaran ................................................................... 28

2.3 Peraba ............................................................................. 30

2.4 Memori ........................................................................... 30

3 KOMPUTER ........................................................... 37

3.1 Sistem Komputer ........................................................... 38

3.2 Layar monitor ................................................................. 38

3.3 Speaker dan Microphone ............................................... 42

3.4 Keyboard ........................................................................ 45

3.5 Mouse ............................................................................. 48

3.6 Touchscreen ................................................................... 51

4 KONSEP INTERAKSI ........................................... 61

4.1 Interaksi .......................................................................... 62

4.2 Baris Perintah Tunggal .................................................... 63

4.3 Baris Perintah Terstruktur ............................................. 67

4.4 Menu dan WIMP (Window Icon Menu Pointer) ........... 69

4.5 Bahasa Alami................................................................... 86

4.6 Query ............................................................................. 90

4.7 Form ............................................................................... 92


v

5 PRINSIP DESAIN ................................................ 102

5.1 Evaluasi Antarmuka ...................................................... 103

5.2 Prinsip dalam Desain Antar Muka ................................ 109

5.3 Eight Golden Rules of Dialog Design ........................... 110

5.4 General Principles of User Interface Design ............... 114

5.5 Object Oriented User Interface from IBM .................. 116

6 WINDOW & MULTIPLE WINDOW ...................... 127

6.1 Persoalan pada Aplikasi Berbasis Window .................. 128

6.2 Komponen Utama Window ......................................... 128

6.3 Operasi pada Window ................................................. 129

6.4 Multipe Window .......................................................... 131

6.5 Koordinasi pada Multipe Window ............................... 132

7 FORM..................................................................... 142

7.1 Panduan Pembuatan Form............................................ 143

7.2 Sederhanakan Desain Form ......................................... 143

7.3 Sediakan Label yang Lugas pada Setiap Elemen ............ 146

7.4 Cegah Kesalahan dan Berikan Sarana Recovery .......... 147

8 HELP AND GUIDE ................................................. 155

8.1 Help and Guide tidak penting? ..................................... 156

8.2 Model Help and Guide ................................................. 156

9 TEXT TO SPEECH ................................................. 167

9.1 Sejarah .......................................................................... 168

9.2 Text To Speech ............................................................ 172

9.3 TTS Bahasa Indonesia .................................................. 174

9.4 Pemrograman menggunakan TTS Bahasa Indonesia ... 177


vi

10 Speech Recognition ............................................... 188

10.1 Voice Recognition dan Speech Recognition.......................... 190

10.2 Skema Utama Speech Recognition .......................................... 191

10.3 Proses Pencocokan Pola Suara ................................................ 192

10.4 Aplikasi berbasis Speech Recogniton ..................................... 193


Pengantar Interaksi Manusia dengan Komputer 1

1 PENGANTAR INTERAKSI MANUSIA

DENGAN KOMPUTER

Overview

Penggunaan komputer pada era teknolgi digital, telah mengambil peran yang

cukup penting. Berbagai macam aplikasi yang pada komputer telah membantu

manusia dalam meningkatkan efektifitas dan efisiensinya. Untuk mendapatkan

tingkat efektifitas dan efisensi penggunaan yang optimum, diperlukan desain

user interface antara manusia dengan komputer. Bab ini akan membahas

uargensi desain antarmuka antara manusia dengan komputer.

Tujuan

Mahasiswa memahami urgensi desain antarmuka manusia dengan komputer.


2

1.1 Pendahuluan

Ilmu interaksi manusia dan komputer merupakan ilmu yang

mempelajari tentang cara mendesain, mengevaluasi, dan

mengimplementasikan sistem komputer yang interaktif sehingga user dapat

menggunakannya dengan mudah.

Pada prinsipnya, kerja komputer adalah menerima masukan (input),

memproses (process), dan memberikan keluaran (output), yang sering dikenal

dengan singkatan IPO. User memberikan memasukkan perintah atau data

kepada komputer. Masukan ini dilakukan dengan berbagai macam piranti

masukan (input device). Masukan ini akan direspon oleh komputer. Komputer

melakukan pengolahan dan melaksanakan perintah sesuai dengan perintah

user kemudian menyajikan kembali hasil pemrosesan tersebut kepada user.

Hal ini terjadi berulang kali sehingga terjadi interaksi. Interaksi tersebut

merupakan komunikasi dua arah antara manusia atau user dengan komputer.

Perhatikan gambar berikut ini.

Input

Output

Gambar 1 Interaksi Manusia dengan Komputer.

Proses

(Thinking /

Memorizing)



? Kerjakan latihan berikut ini!

1. Piranti masukan yang paling umum adalah keyboard dan

mouse. Sebutkan piranti masukan yang lain dan apa

fungsi dari piranti masukan tersebut?

Piranti Masukan Fungsi

2. Piranti keluaran yang paling umum adalah layar monitor

dan printer. Sebutkan piranti keluaran yang lain dan apa

fungsi dari piranti keluaran tersebut ?

Piranti Keluaran Fungsi

3. Beberapa piranti komputer ada yang beguna sebagai

piranti masukan dan sekaligus piranti keluaran. Sebutkan

piranti masukan dan sekaligus piranti keluaran tersebut

dan apa fungsinya?

Piranti I/O Fungsi


4

Perintah dan masukan user merupakan bahasa atau simbol yang dapat

dimengerti oleh manusia. Setelah masukan user diterima, komputer

melakukan proses dengan kerumitan yang sangat tinggi. Semua data pada

komputer dinyatakan dalam notasi biner. Notasi biner ini merupakan

represntasi dari suatu treshold tegangan tertentu sedemikian sehingga nilai 1

untuk tegangan tertentu dan nilai O untuk tegangan yang lain. Tidak hanya

representasi data saja yang rumit, pengolahan data komputer juga merupakan

proses yang tidak kalah rumitnya. Pada processor, dilakukan operasi yang

mengeksekusi perintah-perintah tingkat rendah yang dalam satu detik dapat

melaksanakan jutaan instruksi. Satu instruksi tingkat rendah berlangsung

sangat singkat, tergantung dari kecepatan processor yang digunakan.

Berbagai kerumitan yang ada pada pemrosesan data pada komputer

tidak akan diperlihatkan kepada user. User hanya diberikan interface tempat

data dimasukkan dan hasil pengolahan dikeluarkan. Antarmuka yang paling

umum adalah layar monitor.

Gambar 2 Interface komputer.

Melalui interface yang baik, interaksi akan optimal. Waktu delay untuk

memasukkan input dan waktu untuk memahami output dapat ditekan

seminimal mungkin.

Disadari atau tidak, pada dasarnya penggunaan komputer oleh manusia

merupakan sebuah interaksi atau dialog. Interkasi terjadi antara manusia

dengan layar monitor. Tidak hanya mata yang terlibat dengan melihat layar monitor. Berbagai macam aksi dilakukan tangan dengan menekan tombol pada

keyboard berupa tombol angka dan huruf, atau dengan melakukan satu

sentuhan kecil pada mouse. Hasil yang terlihat di layar monitor terus dipantau

dan menentukan aksi selanjutnya. Contohnya, ketika seseorang mengetikkan



kata “selamat pagi” namun ternyata ia salah mengetik “selamta pagi” user

segera melakukan aksi untuk memperbaiki. Aksi yang dilakukan mungkin

berbeda untuk satu user dengan user yang lain. Ada yang menggunakan

backspace, ada menggunakan key panah kiri, atau short cut dengan

menggunakan CTRL untuk berpindah ke kata sebelumnya baru melakukan

pergeseran. Berbagai macam aksi ini ditentukan oleh beberapa faktor.

Misalnya dari aspek teknologi aplikasi, mungkin telah tersedia auto correct

sehinga user tidak perlu memperbaikinya. Atau terdapat short cut untuk

berpindah antar kata, sehingga user dapat berpindah dari satu kata ke kata

yang lain dengan cepat. Selain itu, pengetahuan user terhadap aplikasi yang ia

gunakan juga menentukan langkah-langkah yang diambilnya. Boleh jadi aplikais

telah menyediakan berbagai macam fitur yang diperlukan, namun karena

ketidakhatuan user, maka fitur tersebut tidak digunakan.

User biasanya tidak menyadari adanya interaksi dengan komputer.

User baru menyadari proses interaksi ini apabila terdapat masalah yang

mengganggu interaksinya, misalnya proses atau respon yang lambat, layr yang

kurang menarik, layar yang sulit dibaca, teks alert yang sulit dipahami dan

sebagainya.

Gambar 3 Menu yang terlalu kecil pada Toolbar Microsoft Office.

? Tanpa mempelajari lebih jauh tentang konsep ineraksi manusia

dengan komputer, sebutkan interaksi yang tidak baik/tidak

nyaman dengan komputer berdasarkan pengalaman Anda!


6

1.2 Model Interaksi

Pada interaksi antara manusia dengan komputer terdapat beberapa

model yang umum digunakan, antara lain:

1. Command line interface

2. Menu

3. Natural language

4. Question/answer and query dialogue

5. Form-fills and spreadsheets

6. Windows, Icons, Menus and Pointers

? Dengan melakukan browsing di internet, maupun berdasarkan

pengalaman Anda dalam menggunakan Operating System maupun

aplikasi komputer, cobalah cari contoh-contoh interaksi untuk

model berikut:

1. Command line interface

2. Menu

3. Natural language

4. Question/answer and query dialogue



5. Form-fills and spreadsheets

6. Windows, Icons, Menus and Pointers

1.3 Bidang yang Berkaitan

Untuk mendapatkan interaksi yang baik antara manusia dengan komputer,

pada perancangan desain antar muka diperlukan berbagai macam

pertimbangan dari berbagai sudu disiplin ilmu. Bidang studi yang berperan

dalam ilmu interaksi komputer adalah sebagai berikut:

1. Teknik elektronika & ilmu komputer.

Bidang ini merupakan bidang dasar dalam pembahasan interaksi

manusia dengan komputer karena komputer sendiri merupakan subjek dalam

interaksi tersebut. Teknologi yang berkembang pada komputer akan sangat

mempengaruhi pola interaksi yang terjadi. Teknologi tersebut tidak hanya

teknologi perangkat keras, namun juga perangkat lunak. Berbagai macam

piranti masukan maupun keluaran semakin memanjakan pengguna. Perangkat

lunak yang memungkinkan penyajian data dalam berbgaia format seperti teks,

video, maupun suara juga semakin maju. Keduanya merupakan hal

fundamental dalam perancangan sistem interaksi antara manusia dengan

komputer.


8

2. Psikologi.

Bidang ini memperhatikan sifat, kebiasaan, persepsi, pengolahan

kognitif, dan ketrampilan motorik pengguna.

3. Perancangan grafis dan tipografi.

Bidang ini memperhatikan bagaimana representasi grafis (gambar) yang

mewakili berbagai macam ram kalimat. Gambar digunakan sebagai sarana

dialog yang cukup efektif saat terjadi interkasi antara manusia dengan

komputer. Sebuah gambar atau ikon dapat secara cepat memberikan

informasi atau makna bagi user tanpa harus bayak berkata-kata. Respon

kecepatan pemahaman terhadap gambar juga lebih baik dari pada respont

erhadap teks yang panjang.

4. Ergonomik.

Bidang ini berkaitan dengan aspek fisik untuk mendapatkan lingkungan

kerja yang nyaman. Aspek fisik ini misalnya berkaitan dengan meja, kursi,

lampu, keyboadrd, mouse, dan sebagainya.

5. Antropologi

Bidang ini merupakan cabang ilmu pengetahuan yang mempelajari

tentang manusia, dan memberi suatu pandangan tentang cara

kerja berkelompok yang masing – masing anggotanya dapat memberikan

konstribusi sesuai dengan bidangnya. Kehadiaran teknologi informasi (dengan

sarananya adalah komputer) sedikit banyak telah mempengaruhi cara kerja

dan pola hubingan sekelompok orang.

6. Linguistik

Bidang ini merupakan cabang ilmu pengetahuan yang mempelajari

tentang bahasa. Bahasa sebagai sarana komunikasi mendasar diperlukan

dalam pembuatan desain interaksi aantara manusia dengan komputer. Melalui

bahasa, berbagai macam simbol dan suara diintepretasikan sebagai perintah

yang akan dikerjakan oleh komputer. Contoh bahasa diantaranya bahasa

grafis, bahasa alami, bahasa menu, dan bahasa perintah. Bahasa yang kita

gunakan sehari-hari merupakan contoh bahasa alami.

7. Sosiologi

Bidang ini mempelajari tentang pengaruh sistem manusia-komputer

dalam struktur sosial. Berbagai macam dampak sosial dapat timbul oleh



adannya perkembangan teknologi komputer yang semakin canggihbaik dari

sisi hardware maupun software.

Teknik Elektro dan

Ilmu Komputer

Psikologi

Tipografi

Ergonomik

Antropologi

Linguistik

Sosiologi

? 1. Teknologi yang berkembang pada pada teknik elektro

dan dan ilmu komputer berpengaruh besar pada pola

interaksi yang terjadi antara manusia dengan komputer.

Berikan contoh-contoh yang berkaitan dengan perkembangan

teknologi ini baik hardware maupun software yang

mempengaruhi pola interaksi tersebut.

2. Berikan contoh peranan bidang psikologi dalam interaksi

antara manusia dengan komputer.


10

3. Berikan contoh peranan bidang perancangan grafis dan

tipografi.

4. Berikan contoh peranan bidang Ergonomik dalam

interaksi antara manusia dengan komputer.

5. Berikan contoh peranan bidang Antropologi dalam


6. Berikan contoh peranan bidang Linguistik dalam interaksi


7. Berikan contoh peranan bidang Sosiologi dalam interaksi




1.4 Usability

Dalam mendesain antarmuka komputer, perlu diperhatikan faktor

tingkat kebergunaan/ usability. Usability memegang peranan cukup besar agar

sistem secara baik dapat diterima user dan seluruh pihak yang terkait dengan

sistem.

Menurut Nielsen ada lima hal yang menentukan usability yaitu:

1. Learnability: User dapat segera memulai pekerjaanya semenjak

dimulainya penggunaan sistem.

2. Efficiency: User dapat meningkatkan produktifitasnya setelah pertama

kali belajar.

3. Memorability: User dapat menggunakan sistem kembali dengan cepat

setelah lama tidak menggunakan aplikasi tersebut tanpa perlu belajar

dari awal kembali

4. Errors: User harus mampu diarahkan untuk sekecil mungkin berbuat

kesalahan. Apabila user melakukan kesalahan harus ada langkah

penanganan yang dapat memulihkan kesalahan tersebut dengan

segera. 5. Satisfaction: User harus harus merasa nayaman dengan sistem aplikasi

yang digunakannya.

Nielson juga memperkenalkan prinsip dalam usability agar sistem

menjadi user friendly yaitu:

1. Simple and natural dialogue

2. Speak the user’s language

3. Minimise user memory load 4. Consistency

5. Feedback

6. Clearly marked exits

7. Shortcut

8. Good error messages

9. Prevent errors


12

? 1. Cobalah lakukan googling dan jelaskan prinsip usability dari

Nielson di atas!

a. ________________________________________

b. ________________________________________

c. ________________________________________

d. ________________________________________

e. ________________________________________

f. ________________________________________

g. ________________________________________

h. ________________________________________

i. ________________________________________

2. Shneiderman (1998), memperkenalkan 8 Golden Rules of

Interface Design. Cobalah lakukan googling, kemudian

sebutkan dan jelaskan kedelapan hal tersebut.

a. ________________________________________

________________________________________

b. ________________________________________

________________________________________

c. ________________________________________

________________________________________

d. ________________________________________

________________________________________

e. ________________________________________

________________________________________

f. ________________________________________

________________________________________

g. ________________________________________

________________________________________



h. ________________________________________

________________________________________

3. Seiring dengan evolusi usability dalam praktek sehari-hari, para praktisi kemudian mendefinisikan sekumpulan aturan

tersendiri. Sebagain besar memperbaiki aturan yang telah

dibuat para ahli sebelumnya dan sebagain lagi menambahkan

aturan baru. Salah satunya adalah Raymond (2004) yang

mendefinsikan sembilan aturan dalam usability. Cobalah

lakukan googling kemudian sebutkan dan jelaskan sembilan

aturan tersebut.

a. ________________________________________

________________________________________

b. ________________________________________

________________________________________

c. ________________________________________

________________________________________

d. ________________________________________

________________________________________

e. ________________________________________

________________________________________

f. ________________________________________

________________________________________

g. ________________________________________

________________________________________

h. ________________________________________

________________________________________

i. ________________________________________

________________________________________


14

Rangkuman

1. Interaksi antara manusia dengan komputer melibatkan 2 buah pihak yaitu

manusia sebagai pengguna dan komputer sebagai tools atau alat bantu.

2. Interaksi antara manusia dengan komputer dilakukan melakui interface

berupa piranti masukan dan piranti keluaran. 3. Piranti masukan yang paling sering digunakan adalah keyboard dan

mouse. Namun demikia, masih banyak lagi jenis piranti masukan yang

merupakan saranan untuk berinteraksi dengan komputer.

4. Piranti keluaran yang sering digunakn adalah layar monitor, printer, dan

speaker. Namun demikian masih banyak pula piranti keluaran yang

merupakan sarana untuk berinteraksi dengan komputer.

5. Disiplin ilmu interaksi manusia dengan komputer melibatkan berbagai

disiplin ilmu yang lain baik dari bidang.

6. Bidang Engineering pada interaksi manusia dan komputer berperan untuk

membuat rekayasa baru dengan terknologi yang lebih baik.

7. Bidang sosoal dalam interkasi manusia dan komputer berperan alam

mempelajari karakterisitik pengguna dan perubahan tingkah laku sebagai

akibat adanya interaksi antara manusia dengan komputer.

8. Usability merupakan tingkat kebergunaan suatu sistem oleh user.

9. Usability menentukan seberapa jauh sistem dapat idterima oleh user dan

seluruh pihak yang terkait.

10. Ada berbagai prinsip untuk meningkatkan usability yang dikemukanan

oleh para ahli diantaranya oleh Nielson, Shneiderman, dan Raymond.



Kuis Benar Salah

1. Interaksi manusia dengan komputer melibatkan merupakan interaksi yang

yang didukung oleh satu pihak yaitu user.

2. Manusia berinteraksi dengan komputer melalui semua proses yang terjadi

didalam pengolahan data pada komputer

3. Interface berperan sebagai sarana untuk menyembunyikan kerumitan

komputer dan menyajikan data yang dapat dipahami oleh user.

4. Printer dan Monitor merupakan sarana interaksi antara manusia dengan

komputer.

5. Keyboard dan mouse merupakan piranti masukan pada interaksi antara

manusia dengan komputer.

6. Plotter dan scanner merupakan piranti masukan pada interaksi manusia

dengan komputer.

7. Sreen Touch merupakan piranti masukan sekaligus piranti keluaran.

8. Usability tidak mempengaruhi tinkat kenyamanan dalam interaksi antara

manusia dengan komputer. 9. User harus menghafal sebanyakl mungkin untuk menjalankan aplikasi

dengan baik merupakan prinsip dari memorability.

10. Error Message bukan bagian dari printsip pembangunan interkasi manusia

dengan komputer.


16

Pilihan Ganda

1.

Pihak pada interkasi manusia dengan komputer adalah __________

A. User D User dan Komputer

B. Komputer E. User, desainer, dan komputer

C. Desainer

2.

Interaksi manusia dengan komputer melibatkan ilmu:

1. Teknik Elektro

2. Ergonomi

3. Ilmu Komputer 4. Astronomi

A. 1,2,3 D. 4

B. 1,3 E. 1,2,3,4

C. 2,4

3.

Pada IMK, bidang ini berkaitan dengan aspek fisik untuk mendapatkan

lingkungan kerja yang nyaman. Aspek fisik ini misalnya berkaitan dengan

meja, kursi, lampu, keyboadrd, mouse, dan sebagainya. Nama bidang ini

adalah

A. Ergonomi D. Fisiologi

B. Antropologi E. Sosiologi

C. Psikologi

4.

Pada IMK, bidang ini memperhatikan sifat, kebiasaan, persepsi, pengolahan

kognitif, dan ketrampilan motorik dari pengguna komputer. Nama bidang

ini adalah______



C. Psikologi



5.

Pada IMK, Bidang ini merupakan cabang ilmu pengetahuan yang

mempelajari tentang manusia, dan memberi suatu pandangan tentang

cara kerja berkelompok yang masing – masing anggotanya dapat

memberikan konstribusi sesuai dengan bidangnya. Kehadiaran teknologi

informasi (dengan sarananya adalah komputer) sedikit banyak telah

mempengaruhi cara kerja dan pola hubingan sekelompok orang. Nama

bidang ini adalah ________



C. Psikologi

6

Pada IMK, Bidang ini mempelajari tentang pengaruh sistem manusia-

komputer dalam struktur sosial. Berbagai macam dampak sosial dapat

timbul oleh adannya perkembangan teknologi komputer yang semakin

canggih baik dari sisi perangkat keras maupun perangkat lunak. Nama

bidang ini adalah _____



C. Psikologi

7 Perintah dalam DOS termasuk dalam type ______

A Command line interface D Form-fills and spreadsheets

B Menu E Question/answer and query

C Natural language dialogue

8 Perintah – perintah pada operasi database termasuk type ________

A Command line interface D Form-fills and spreadsheets

B Menu E Question/answer and query

C Natural language dialogue


18

9 Pengguna komputer sedapat mungkin tidak perlu banyak mengingat

kembali bagaimaana penggunaan suatu aplikasi komputer. Prinisip ini

selaras dengan _______

A Shortcut D Speak the user‟s language

B Good error messages E Minimise user memory load

C Prevent errors

10

Apluikasi harus mengarahkan agar user senantiasa tepat dalam

memberikan input ke komputer. Prinsip ini selaras dengan _____

A Shortcut D Speak the user‟s language

B Good error messages E Minimise user memory load

C Prevent errors



Latihan

1. Sebutkan ilmu-ilmu yang terkait dalam pembangunan interaksi antara

manusia dengan komputer! 2. Sebutkan berbagai macam type interaksi antara manusia dengan

komputer!

3. Sebutkan Prinsip Usability dari Shneiderman!

4. Sebutkan Prinsip Usability dari Raymond!

5. Jelaskan perbedaan mendasar antara IMK pada operating system DOS

dan Windows 3.1

6. Bagimana pendapat Anda tentang usability pada Micrososft Word 2007

dibanding dengan Micrososft Word 2003?

7. Bagaimana pendapat Anda tentang usability pada Micrososft Windows

Vista dengan XP?


20

2 MANUSIA

Overview

Manusia merupakan pihak pertama pada interkasi antara manusia dengan

komputer. Manusia dengan berbagai karakteristiknya menjadi dasar paling

kuat dalam pembangunan desain interface pada IMK. Melalui pengenalan

terhadap karakteristik manusia diharapak pembuat aplikasi memperhatikan

berbagai hal yang dapat meningkat usability dan mencegah terjadinya

penurunannya.

Peran manusia pada interkasi antara manusia dengan komputer dapat

dipandang sebagai sistem pengolah informasi yang menerima masukan dari

panca intedranya yaitu mata, telinga, dan kulit. Untuk teknologi tertentu

memungkinkan interaksi dengan indera lainya. Namun secara prinsip semua

interaksi dilakukan melalui panca indera. Tidak ada interaksi yang dilakukan

secara kebatinan. Teknologi terbaru adalah dengan menangkap sinyal otak,

namun arti sinyal ini masih sulit untuk diterjemahkan.

Melalui bab ini akan dibahas tentang manusia dan karakteristiknya khususnya

yang berkaitan dengan pembangunan desain interface antara manusia dengan

komputer.

Tujuan

1. Mahasiswa memahami karakteristik manusia yang berpengaruh pada IMK

yaitu panca inderanya.

2. Mahasiswa mengetahui sapek yang dapat meningkatkan dan menurunkan

usability berdasarkan karakteristik tersebut.


Manusia 21

2.1 Penglihatan

Bagi orang normal, mata merupakan media paling fundamental untuk

mengetahui dunia luar. Pengetahuan akan dunia luar ini akan menghasilkan

persepsi yang terorganisir akan gerakan, ukuran, bentuk, jarak, posisi relatif,

tekstur dan warna. Hasil persepsi ini akan mempengaruhi respon dari

individu yang bersangkutan. Semakin cepat persepsi yang didapat, semakin

cepoat respon yang diberikan. Apabila persepsi yang diterima benar akan

mendorong respon yang benar pula. Kecepatan persepsi ini juga

mempengaruhi tingkat kenyamanan dari user. Apabila user menggunakan

komputer, dan persepsi yang ia terima lebih lambat dari yang biasanya, maka

user akan merasakan ketidaknyamanan.

? Cobalah kerjakan latihan berikut.

1. Bacalah kedua teks berikut. Mana yang lebih nyaman di

baca? Faktor apa yang berpengaruh?

Teks I:

Salah satu aplikaisi yang populer dari

Microsft adalah Aplikasi perkantoran (Office

Application). Microsoft Word merupakan

bagian dari aplikasi perkantoran yang

ditujukan untuk pembuatan dan pengolahan

dokumen secara cepat dan mudah. Dengan

demikian dokumen yang dibuat tidak hanya

untuk keperluan perkantoran saja tapi juga

untuk keperluan yang lebih luas.

Teks II:

Selain itu HTMl pada awalnya termasuk format dokumen yang tidak langsung dapat dilihat segera hasil akhir tampilan dokumennya. Namun sekarang berbagai aplikasi telah menjadi penjembatan sehingga dokumen dapat di olah kedalam format HTML maupun latex dengan mudah dengan edtor yang mendukung WYISWYG pula. Dokumen yang dibuat di Microsoft Word pun dapat disimpan dalam format HTML. Namun hasilnya


22

tidak efisien. Untuk hal ini akan dipelajari di mata kuliah lain yang berkaitan dengan pemrograman web.

2. Bacalah kedua teks berikut. Mana yang lebih nyaman di

baca? Faktor apa yang berpengaruh?

Teks I:

Pemerintah pusat khususnya Departemen Komunikasi

dan Informatika, sebagai pemegang simpul kebijakan

informasi nasional (National/Chief Information

Officer), memerlukan sistem informasi yang mampu

membantu untuk melaksanakan percepatan observasi

kondisi nyata dari masyarakat, sehingga presiden dapat

melakukan orientasi, keputusan maupun tindakan

secara tepat, akurat dan cepat.

Teks II: Teknologi Informasi dan Komunikasi (TIK) diharapkan menjadi tulang punggung untuk

mencapai tata nilai dan tata kelola masyarakat berpengetahuan tersebut. Penerapan TIK

diselaraskan dengan sasaran strategi nasional yaitu pengelolalan pemerintahan yang baik

(Good Government Governance), peningkatan pertumbuhan ekonomi, dan mengubah pola

pikir dan budaya masyarakat agar lebih berorientasi pada masyarakat yang berpengetahuan

(knowledge based society). Strategi yang harus dijalankan untuk mewujudkan hal ini adalah

dengan membangun sebuah suprastruktur informasi bagi pemerintah Indonesia yang pada

dasarnya merupakan perwujduan dari e-Indoensia.

3. Mana yang lebih nyaman di baca? Faktor apa yang

berpengaruh?

Teks I:

Data Mining merupakan teknologi baru yang sangat berguna untuk membantu perusahaan-perusahaan menemukan informasi yang

sangat penting dari gudang data mereka.


Manusia 23

Teks II

Data mining meramalkan tren dan sifat-sifat perilaku bisnis yang

sangat berguna untuk mendukung pengambilan keputusan penting.

4. Mana yang lebih panjang, balok yang atas atau yang

bawah ? Fenomena ini dikenal dengan Ponzo Illusion.

5. Ruas grasi mana yang lebih panjang, yang atas atau yang

bawah? Fenomena ini disebut Muller Lyer Illusion

Ada beberapa faktor yang berpengaruh pada penglihatan manusia yaitu:

1. Luminans (luminance)

Merupakan banyaknya cahaya yang dipantulkan permukaan obyek.

Mata manusia dapat melihat dengan bantuan cahaya. Cahaya yang

mengenai benda akan dipantulkan sebagain oleh benda. Pantulan

cahaya ini apabila ditangkap oleh mata menjadi informasi

terlihatnya benda.


24

2. Kekontrasan

Merupakan perbandingan antara cahaya yang dikeluarkan oleh

suatu obyek terhadap cahaya yang dikeluarkan oleh latar belakang

obyek tersebut. Kekontrasan dapat dihitung sebagai selisih antara

luminans obyek dengan latar belakangnya dibagi dengan luminans

latar belakang. Nilai kontras positif apabila cahaya yang

dipancarkan oleh sebuah obyek lebih besar dibandingkan dengan

yang dipancarkan oleh latar belakangnya. Nilai kontras negatif

menyebabkan obyek yang sesungguhnya „tertutup‟ oleh latar

belakangnya.

3. Kecerahan

Merupakan tanggapan subyektif pada cahaya. Semakin tinggi

luminans semakin tinggi pula kecerahannya.

4. Sudut dan Ketajaman Penglihatan

Sudut penglihatan adalah sudut yang dibentuk antara arah

pandangan terhadap benda dengan garis normal benda. Garis

normal adalah garis yang tegak lurus dengan permbukaan bidang

benda. Sedangkan ketajaman penglihatan (visual acuity) merupakan

sudut penglihatan minimum ketika mata masih dapat melihat benda

dengan jelas.

5. Medan Penglihatan

merupakan sudut yang dibentuk dari mata bergerak ke kiri terjauh

hingga ke kanan terjauh.

6. Warna

Cahaya yang terlihat oleh mata merupakan gelombang

elektromagnetik. Gelombang elektromagnetik sendiri memiliki

spektrum gelombang. Panjang gelombang cahaya tampak berkisar

antara 400-700 nm. Apabila panjang gelombang adalah 400-700

nm, luminans konstan dan saturasinya (jumlah cahaya putih yang

ditambahkan) dibuat tetap, seseorang dengan penglihatan warna

normal mampu membedakan kira-kira 128 warna yang berbeda.

Spektrum warna pada gelombang elektromagnetik dapat dilihat

pada diagram gambar berikut.


Manusia 25

Warna memegang peranan penting dalam desain antar muka grafis. Interaksi

terbesar antara manusia dengan komputer sangat didominasi oleh antar muka

layar monitor. Setiap saat, mata pengguna komputer senantiasa tertuju pada

layar monitor. Evolusi tampilan antar muka grafis dapat kita lihat pada

tampilan windows dari waktu ke waktu.


26

? Isi luminance dan pewarnaan merupakan isu penting dalam desain

antar muka grafis. Perhatikan gambar-gambar berikut:

1. Teks manakah yang paling terlihat jelas?

Human Computer Interface and Interaction Design


















Manusia 27

2. Teks mana yang terlihat paling jelas?

3. Teks mana yang terlihat paling jelas?

4. Teks mana yang terlihat jelas?


28

2.2 Pendengaran

Pendengaran pada manusia memiliki karakteristik tersendiri antara lain

sebagai berikut:

- Pada umumnya suara yang dapat didengar oleh indera pendegaran

manusia berada pada frekuensi antara 20 Hz sampai dengan 20

Khertz.

- Usia dan keadaan medis seseorang dapat mempengaruhi daerah

frekuensi yang dapat didengarnya

- Suara dengan frekuensi antara1000 – 4000 Hertz merupakan daerah

sensitif.

Secara fisis, frekuensi bunyi menentukan tinggi rendahnya bunyi.

Gambaran tinggi rendahnya bunyi ini dapat terdengar pedeaanya pada tangga

nada.

Nada do pada satu oktaf dengan nada do pada oktaf di atasnya

dibedakan oleh frekuensinya.

Sedangkan keras lemahnya bunyi dipengaruhi oleh amplitdo getaran.

Amplitudo merupakan jarak terjauh dari titik setimbang. Semakin besar

semakin keras bunyinya. Tingkat kerasnya bunyi ini dinyatakan dalam satuan

Bell ( lebih sering dinyatakan dalam decibell, dB). Suara bisikan mempunyai

tingkat kebisingan 50dB sampai 70 dB. Suara kebisingan yang lebih dari 140 dB dapat merusak sistem pendengaran seseorang.


Manusia 29

Kedua telinga yang menghadap arah berlawanan juga dapat

memberikan efek situasi lingkungan. Misalnya kedua mata seseorang ditutup,

kemudian ada mobil yang melintas di dekat orang tersebut, maka dari suara

mobil tersebut, dapat ditentukan dari mana arah mobil tersebut dan kemana

tujuannya.

? 1. Pada alat musik gitar, piano, seruling, dan sebagainya

dapat mengeluarkan bunyi nada „do‟ dengan warna bunyi

yang berbeda beda. Apakah yang menyamakan kesemua

alat musik tersebut sehingga dapat menghasilkan nada

„do‟ pada oktaf yang sama?

2. Apa yang mempengaruhi kuat lemahnya bunyi?

3. Pada komputer biasanya dilengkapi dengan spaker dua

buah, seperti pada gambar berikut

Selain itu terdapat pula earphone seperti pada gambar:


30

Pada perlengkapan tersebut biasanya ada petunjuk L

(Left) dan R (Right).

- Apa maksud simbol L dan R tersebut?

- Sebaiknya kedua speaker di pasang sesuai petunjuk tersebut, mengapa demikian? Apa yang terjadi jika

dipasang terbalik?

2.3 Peraba

Indera peraba menjadi sarana interaksi yang menduduki urutan ketiga

setelah penglihatan dan pendengaran. Indera peraba dipengaruhi oleh tingkat

ergonomi. Interaksi ini contohnya adalah keyboard dan tombol yang biasanya

digunakan oleh tangan.

? 1. Sebutkan peripheral komputer yang melibatkan sentuhan

tangan!

2. Sebutkan peripheral komputer yang melibatkan sentuhan

kaki!

2.4 Memori

Memori bukanlah panca idnera, namun ia memegang peranan penting

dalam interaksi antara manusia dengan komputer. Contoh penggunaan

memori adalah pilihan menu berbasis suara pada operator telepon. User

sering lupa dengan menu yang telah di bacakan oleh mesin penjawab.

Memori berkaitan dengan pengolahan di otak manusia. Hal ini dapat

digambarkan pada diagram berikut:


Manusia 31

Memori manusia dapat dikelompokan menjadi dua:

1.Memory jangka pendek (Shor Term Memory), merupakan memori

jangka pendek, bersifat temporal dan cepat hilang.

2.Memory jangka panjang (Long Term Memory), merupakan memori

dari proses yang berulang-ulang dan masuk ke dalam alam bawah

sadar.

Perseptual

Intelektual

Kontrol Motorik

Sensor

Peranti keluaran

Pengontrol keluaran

Perseptual

Intelektual

Kontrol Motorik

Responder

Peranti masukan

Pengontrol masukan

Memori

Prosesor

Memori

Umpan Balik

Antaramuka

Ko

mp

ute

rM

an

usia

Pe

ng

ola

ha

n o

tom

atis

Pe

ng

ola

ha

n s

ad

ar


32

Rangkuman

1. Interpretasi manusia dengan lingkungannya dilakukan melalui panca

inderanya.

2. Panca indera yang paling dominan pada umumnya adalah mata. 3. Mata manusia mendeteksi lingkunan karena adanya cahaya

4. Cahaya yang masuk kemata pada dasarnya adalah gelombang

elekteromagnetik yang merupakan bagian kecil dari spektru gelombang

elektromagnetik.

5. Gelombang elektromagentik menentukan menetukan warna yang

dideteksi oleh manusia.

6. Warna merupakan faktro penting dalam antar muka grafis.

7. Indera pendengaran merukan indera kedua setelah mata yang paling sering

digunakan.

8. Pendegaran manusia dapat mendeteksi frekuensi suara antara 20 Hz

hingga 20 KHz.

9. Pendengaran manusia mampu mengintepretasikan lingkungannya berkaitan

dengan arah suara.

10. Peraba pada manusia berpengaruh pada tingkat ergonomis pada interaksi



Manusia 33

Kuis Benar Salah

1. Interpretasi manusia dengan lingkungannya dilakukan melalui perasaanya.

2. Secara umum, pendengaran manusia lebih dominan dari pada

penglihatannya.

3. Mata manusia dapat melihat melihat benda karena ada cahaya yang

memantul dari benda ke mata.

4. Cahaya merupakan gelombang elektromagentik.

5. Semua gelombang elektromagnetik merupakan cahaya.

6. Perbedaan frekuensi menentukan warna pada spektrum cahaya.

7. Suara merupakan komponen paling dominan pada desain antarmuka grafis.

8. Keras lemahnya bunyi tergantung dari frekuensinya.

9. Tinggi rendahnya bunyi ditentukan oelh cepat rambatnya.

10. Indera peraba sangat berpengaruh ditinjau dari aspek sosiologi pada

ingeraksi antara manusia dengan komputer.


34

Pilihan Ganda

1.

Secara umum indera yang paling dominan pada manusia adalah ______

A. Mata D Kulit

B. Telinga E. Lidah

C. Hidung

2.

Berikut ini warna yang terdapat pada spektrum warna

1. Hitam 2. Ungu

3. Putih

4. Merah

A. 1,2,3 D. 4

B. 1,3 E. 1,2,3,4

C. 2,4

3.

Banyaknya cahaya yang dipantulkan permukaan obyek disebut ______

A. Luminans D. Ketajaman Penglihatan

B. Kekontrasan E. warna

C. Kecerahan

4.

Perbandingan antara cahaya yang dikeluarkan oleh suatu obyek terhadap

cahaya yang dikeluarkan oleh latar belakang obyek tersebut disebut

_______

A. Luminans D. Ketajaman Penglihatan

B. Kekontrasan E. warna

C. Kecerahan


Manusia 35

5.

Mata manusia dapat melihat karena_______

A. Ada cahaya yang masuk ke mata D. Terdapat sinar infra merah

B. Ada gelombang elektromagnetik E. Terdapat sinar ultra violet

C. Mata memancarkan sinyal

6

Aspek yang dominan dalam desain antarmuka grafis adalah _____

A. Suara D. Getaran

B. Warna E. Permukaan

C. Ukuran

7.

1. Mata manusia dapat melihat cahaya infra red

2. Mata manusia dapat melihat cahaya violet

3. Mata manusia dapat melihat cahaya ultra violet

4. Mata manusia dapat melihat cahaya merah

Peryataan yang benar adalah

A 1,2,3 D 4

B 1,3 E 1,2,3,4

C 2,4

8 Keras lemahnya bunyi ditentukan oleh______

A Frekuensinya D Cepat rambatnya

B Amplitudonya E Sumber suaranya

C Panjang gelombangya

9 Perbedaan nada pada tangga nada dipengaruhi oleh _______

A Frekuensinya D Cepat rambatnya

B Amplitudonya E Sumber suaranya

C Bahan alat musiknya

10 Game DDR melibatkan indera peraba pada bagian _______

A Telapak tangan D muka

B Jari tangan E Perut

C kaki


36

Latihan

1. Sebutkan panca indera manusia!

2. Mengapa warna sangat dominan dalam desain antar muka pada

komputer?

3. Berolah lima contoh kombinasi yang buruk antara warna font dengan

background-nya! Tunjukkan dengan memperaktekan langsung di di

komputer!

4. Berilah lima contoh kombinasi yang baik antara warna font dengan

background-nya! Tunjukkan dengan memperaktekan langsung di

komputer!

5. Film kartun dibuat dengan melakukan pergantian gambar dengan cepat

dari kumpulan gambar statis. Cobalah eksplore di internet, berapakah

gambar minimum perdetik untuk mendaptkan gerakan yang tidak patah-

patah!

6. Cobalah eksplore di internet, apakah putih itu warna atau bukan!

7. Apakah yang menentukan tingkat kebisingan suara? 8. Apakah yang menentukan tinggi rendahnya bunyi?

9. Pada frekuensi berapa suara dapat didengar oleh telingan manusia?

10. Sebutkan peripheral komputer yang melibatkan indera peraba!

11. Memori pada otak kita ada yang tergolong jangka panjang. Sebutkan

contohnya!


Komputer 37

3 KOMPUTER

Overview

Komputer menurut asal katanya artinya alat bantu hitung. Namun secara

istilah, kata ini telah berkembang pengertiannya menjadi alat bantu elektronik

yang bekerja secara digital dalam memproses data. Data yang masuk ke

komputer serta hasil pengolahannya pada umumnya melibatkan manusia

sehingga terjadi interaksi. Pada bab ini akan dibahas bagaimana komputer

mendukung proses interkasi ini melalui berbagai media baik audio visual

maupun ybang bukan.

Tujuan

1. Mahasiswa memahami komputer sebagai bagian dari IMK.

2. Mahasiswa mengetahui komponen komputer yang menjadi interface

dengan user.


38

3.1 Sistem Komputer

Komputer secara sederhana dapat dipandang sebagai sistem IPO (Input

Process Output) sebgaimana dijelaskan pada bab 1.

Untuk mendukung proses tersebut diperlukan piranti pendukung baik

software maupun hardware dari komputer yang digunakan. Kesinergisan

antara hardware dan software ini contohnya adalah driver. Dengan driver,

hardware dapat bekerja dengan optimal. Layar monitor dapat menampilkan

grafis dengan baik, speaker dapat mengahsilkan bunyi dengan jelas, dan

sebagainya.

Berbagai piranti masukan tadi dapat di kategorikan sebagai piranti

masukan, piranti keluaran, dan piranti keduanya secara sekaligus.

Berikut ini akan di bahas beberapa perangkat yang mendukung untuk


3.2 Layar monitor

Layar monitor merupakan media output yang sangat dominan. Hampir

sebagian besar hasil pengolahan komputer di sajikan di layar monitor. Layar

monitor memiliki sejarah panjang dari generasi pertamanya. Perkembangan ini

dapat kita lihat antara lain sebagi berikut

1. Layar Monochrom, layar dengan warna background hitam dan warna

teks satu warna.

2. Layar bewarna, dengan teknologi tabung CRT

3. Layar berwarna , dengan teknologi LCD

Ditinjau dari bahannya, jenis layar monotir adalah:

1. Monitor Catoda Ray Tube (CRT)

Monitor jenis ini memiliki tabung yang menghasilkan elektron yang menembak

layar sedemikian sehingga terbentuk gambar di layar. Cara kerja ini mirip

dengan cara kerja pada televisi. Monitor ini menggunakan port 15 pin dengan

3 baris.

2. Monitor Liquid Crystal Display (LCD)

Monitor jenis ini bekerja dengan cara pemberian stimulasi arus listrik ke liquid

crystal (materi biphenyl), sedemikian sehingga terjadi perubahan properti dari

cahaya yang dilewatkan pada crystal.

3. Monitor TFT LCD

Monitor jenis ini bekerja dengan liquid crystal yang diletakkan di antara dua

pelat gelas, yaitu colour filter glass dan TFT glass. Colour filter glass memiliki

filter warna yang akan memancarkan warna, sedangkan TFT glass memiliki

Thin Film transistor sebanyak pixel yang ditampilkan. Liquid crystal bergerak


Komputer 39

sesuai dengan perbedaan voltase antara colour filter glass dengan TFT glass.

Banyaknya cahaya yang berasal dari Back Light ditentukan berdasarkan jumlah

pergerakan liquid crystal yang pada akhirnya akan membentuk warna.

Sedangkan jenis monitor menurut adapter, resolusi warna, dan

jumlah pin.

Type Monitor Adapter Card Resolusi Jumlah Warna

Jumlah Pin

Monochrome (Digital)

MDA, EGA, Hercules

80 x 25 2 9

CGA (Digital dan Analog)

CGA, EGA 640 x 480 16/2 9

EGA (Digital dan Analog)

XGA, CGA, EGA

640 x 480 16/2,

16 9

VGA (Analog) VGA 800 x 600 256 15

SVGA VGA 1024 x 768 16 juta 15

Keterangan:

MDA = Monochrome Display Adapter

EGA = Enhanced Graphics Adapter

VGA = Video Graphic Array

CGA = Colour Graphic Adapter

XGA = X-Graphic Adapter

SVGA = Super Video Graphic Array

Pada umumnya, setiap monitor dilengkapi dengan tombol menu pengaturan,

seperti :

Saklar ON/OFF yang berfungsi untuk memutuskan dan

menghubungkan sumber daya listrik.

Brightness Control, yaitu cerah atau redupnya layar.

Contrast Control, yaitu untuk mengatur cerah atau redupnya obyek

pada layar.

Vertical Size Control (V. Hold), yaitu untuk mengatur area layar bagian bawah dan atas.


40

Vertical Line (V. Line), yaitu untuk mengatur tinggi rendahnya obyek

pada layar.

Horisontal Size Control (H. Hold), yaitu untuk mengatur area layar

bagian kiri dan kanan.

Berkaitan dengan layar monitor, warna pada layar monitor sangat

menentukan kenyamanan antarmuka dengan pengguna. Warna dapat

dikateorikan sebagai warna dasar dan warna campuran. Warna campuran

merupakan warna yang dihasilkan dengan mencampurkan warna lain. Warna

dasar cahaya ada tiga yaitu Red, Green, Blue atau yang sering dikenal dengan

RGB. Warna cahaya lain dapat diturunkan dari campuran dua atau tiga warna tersebut.

Dalam komputer, setiap warna direpresentasikan dengan komninbasi

ketiga warna dasar tersebut. Setiap warna diberi rentang nilai dari 0 sampai

dengan 255. Rentang skala sebanyak 256 in didasarkan pada 1 byte yang

terdiri dari 8 bit biner, dimana nilai tertinggi untuk 1 byte adalah 255. Karena

setiap warna direpresentasikan dengan kombinasi ketiga warna dasar, jumlah

kombinasi warna yang mungkin adalah 256 x 256 256 = 16.777.216 warna.

Kombinasi untuk warna dapat dilihat pada tabel berikut.


Komputer 41

Warna yang mirip memiliki kedekatan komposisi RGB seperti contoh berikut.

Sumber: http://msdn.microsoft.com/en-us/library/aa358800(VS.85).aspx

http://msdn.microsoft.com/en-us/library/aa358800(VS.85).aspx


42

3.3 Speaker dan Microphone

Speaker digunakan untuk menyajikan data-data audio. Suara yang

dikeluarkan memiliki tingkat kemiripan dengan suara aselinya. Semakin mirip

dengan suara aselinya, semakin baik kualtias speaker tersebut. Namun distorsi

suara ini tidak dapat terelakan mengingat data suara direpresentasikan di

komputer melalui sampling suara. Contoh hasil sampling suara ditampilkan

seperti dalam gambar.

Pada prinsipnya semua suara audio, baik vokal maupun bunyi tertentu

merupakan hasil dari getaran dan merambat melalui udara dalam bentuk gelombang suara. Hal ini berimplikasi bahwa setiap suara memiliki bentuk

gelombangnya masing-masing. Gelombang suara ini merambat dalam bentuk

sinya analog seperti pada gambar di atas. Sinyal analog ini merupakan sinyal

yang kontinu. Sinyal yang di tangkap oleh alat perekam sering disertai noise

sehingga mengganggu kejernihan suara aslinya. Melalui teknik tertentu sinyal-

sinyal noise ini dapat dikurangi sehingga kualitas sinyalnya yang dihasilkan

menjadi lebih baik. Sinyal analog ini apabila di hendak disimpan di komputer

harus diubahke dalam format digital, mengingat komputer menyimpan data


Komputer 43

senantiasa dalam bentuk bit bit. Teknik pengubahan ini disebut sampling.

Pemrosesan Sinyal Digital (Digital Signal Prosessing) merupakan ilmu yang

mempelajari lebih lamjut mengenai teknik pengolahan sinyal.

Sampling

Sampling adalah proses pengambilan sinyal analog Pada proses ini

terjadi suatu pencuplikan dari bentukan sinyal analog. Pencuplikan dilakukan

pada bagian-bagian sinyal analog. Ini dilakukan dengan sinyal-sinyal sample.

Ada suatu aturan tertentu dari sinyal ini. Teori Shannon menyatakan

frekuensi sinyal ini paling sedikit adalah 2 kali frekuensi sinyal yang akan

disampling(sinyal analog). Ini adalah batas minimum dari frekuensi sample agar

nantinya cuplikan yang diambil menunjukkan bentukan sinyal yang asli

(analog). Lebih besar tentunya lebih baik, karena cuplikan akan lebih

menggambarkan sinyal yang asli. Setelah dilakukan proses ini maka

terbentuklah suatu sinyal analog-diskrit yang bentuknya menyerupai aslinya

namun hanya diambil diskrit-diskrit saja.

[http://www.elektroindonesia.com/elektro/elek35a.html]

Quantisasi

Ini adalah proses pembandingan level-level tiap diskrit sinyal hasil

sampling dengan tetapan level tertentu. Level-level ini adalah tetapan angka-

angka yang dijadikan menjadi bilangan biner. Sinyal-sinyal diskrit yang ada akan

disesuaikan levelnya dengan tetapan yang ada. Jika lebih kecil akan dinaikkan

dan jika lebih besar akan diturunkan. Prosesnya hampir sama dengan

pembulatan angka. Tetapan level yang ada tergantung pada resolusi dari alat,

karena tetapan level merupakan kombinasi angka biner, maka jika bitnya lebih

besar kombinasinya akan lebih banyak dan tetapan akan lebih banyak. Ini

membuat pembulatan level sinyal diskrit menjadi tidak jauh dengan level

aslinya. Dan bentukan sinyal akan lebih bervariasi sehingga akan terbentuk

seperti aslinya. Proses ini membuat sinyal lebih baik karena bentukkannya

lebih tetap. Proses ini juga mengecilkan error dari suatu sinyal.

[http://www.elektroindonesia.com/elektro/elek35a.html]

Setelah diquantisasi maka tiap-tiap diskrit yang ada telah memiliki

tetapan tertentu. Tetapan ini dapat dijadikan kombinasi bilangan biner, maka

terbentuklah bilangan-bilangan biner yang merupakan informasi dari sinyal.

Setelah menjadi sinyal digital maka proses-proses perekayasaan dapat

dilakukan. Yang harus dilakukan adalah merubah informasi digital tersebut


44

dengan proses digital sehingga menjadi suara-suara yang kita inginkan. Proses

dapat dilakukan dengan berbagai macam alat-alat digital (komputer). Sample-

sample yang ada juga digunakan sebagai informasi untuk menciptakan suara

dari berbagai macam alat elektronik (keyboard dan syntitizer). Penyimpanan

suara juga akan lebih baik karena informasinya adalah digital sehingga

berkembanglah CD dan DAT(Digital Tape).

Proses pada speaker merupakan kebalikan dari proses sebelumnya.

Data digital di ubah menjadi denyut listrik yang oleh speaker diubah menjadi

getaran sehingga menghasilkan bunyi. Warna dan keras lemahnya bunyi

ditentukan oleh denyut listrik tersebut. Perbedaan data menghasilkan denyut

listrik yang berbeda.

Bagian yang terpenting dari Speaker Dinamik adalah:Konus, Suspensi,

Kumparan suara dan Magnet. Perubahan medan magnet di dalam speaker

akan berinteraksi dengan medan konstan magnet yang menyebabkan

kumparan bergerak sebagai reaksi akibat ada tidaknya arus. Konus ikut

bergerak akibat kumparan suara bergerak sehingga pada udara sekita konus

akan terbentuk gelombang tekanan. Gelombang inilah yang terdengar sebagai

bunyi.

Speaker tunggal biasa disebut juga driver. Driver dengan ukuran lebih

dari 8″ biasanya digunakan untuk menangani frekuensi rendah (bas), atau disebut juga Woofer.

Driver yang digunakan untuk menangani frekuensi tinggi disebut

Tweeter. Pada sistem loudspeaker 2 way, ada ditemukan Tweeter dan

Woofer. Pada sistem loudspeaker 3 way, ada Woofer, Tweeter dan

Midrange.

Woofer biasanya berdiameter 8″ digunakan untuk nada bas, jadi perlu

membatasi frekuensi atasnya. Untuk memperoleh suara tengah yang baik maka perlu adanya driver midrange. Driver Midrange biasanya digunakan

dalam sistem speaker 3 way. Untuk memproduksi frekuensi tinggi diperlukan

tweeter dengan diameternya yang kecil.

Speaker biasanya diletakkan pada box. Ada dua jenis box speaker yaitu:

1. Kotak Rapat: udara yang berada di dalm kotak berfungsi sebagai

pegas terhadap konus.

2. Kotak Celah: Pada umumnya berfungsi sebagai resonator.

Mempunyai keunggulan untuk mengontrol redaman yang ada pada speaker.

[Sumber : http://speakerbuilder.wordpress.com/category/cara-kerja-speaker/]

http://speakerbuilder.wordpress.com/category/cara-kerja-speaker/


Komputer 45

3.4 Keyboard

Key merupakan interface masukan paling dominan untuk saat ini.

Berbagai macam keyboard pernah diproduksi namun yang terkenal dan

dominan dipakai adalah model QWERTY.


46

Keyboard model QWERTY lebih cocok untuk orang kidal, mengingat

karakter „a‟ termasuk karakter yang sering muncul, namun harus dipencet

oleh jari kelingking kiri yang secara kekuatan relatif paling lemah bagi orang

yang tidak kidal.

Model Keyboard yang lain diantaranya:

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

Apabila menggunakan keyboard umum, untuk mengetik kata yang terdiri dari

10 huruf berarti menekan tombol sebanyak 10 kali ketukan maka pada chord

keyboard dapat dilakukan 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

ada penolakan dari masyarakat karena terbiasa dengan QWERTY,

dan adanya kelelahan yang terjadi setelah pemakaian dalam waktu

lama.


Komputer 47

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.

contoh : tombol numerik pada keyboard bagian kanan, tombol angka pada kalkulator, tombol angka pada telpon

Cara Kerja QWERTY

Setiap kali salah satu tombol keyboard ditekan atau dilepas,

keyboard akan mengirim kode ke host (host adalah komputer kalau keyboard

dihubungkan ke PC, atau berupa mikrokontroler kalau keyboard dihubungkan

ke perlatan berbasis mikrokontroler). Kode tersebut dinamakan sebagai scan

code.

Scan code tombol „S‟ adalah 1B (angka heksadesimal setara dengan

angka biner 00011011). Ketika tombol „S‟ ditekan keyboard akan mengirim

1B, jika tombol „S‟ ditekan terus maka keyboard akan mengirimkan 1B

berikutnya terus menerus, sampai ada tombol lain yang ditekan atau tombol

„S‟ tadi dilepas.

Keyboard juga mengirim kode saat ada satu tombol yang dilepas,

kodenya adalah F0 (angka heksadesimal setara dengan angka biner 11110000),

jadi kalau tombol „S‟ tadi dilepas keyboard akan mengirim F0 dan 1B.

Kode-kode tersebut dikirim keyboard secara seri, artinya dikirimkan

satu bit demi satu bit. Misalnya 1B dikirimkan dengan cara : mula-mula dikirim

„1‟, sesaat kemudian „1‟ lagi dan menyusul „0‟ sampai akhirnya terkirim

sebanyak 8 bit yang berbentuk 00011011 (dikirim mulai dari bit yang paling

kanan kemudian beregeser satu per satu sampai yang paling kiri).

Masing-masing tombol punya scan code sendiri, termasuk tombol

„shift‟, tombol „ctrl‟ dan lain lain, jadi jika tombol „ctrl‟ ditekan bersama dengan

„S‟, maka scan code yang dikirim adalah 14 (scan code untuk „ctrl‟) dan 1B


48

(scan code untul „S‟). Terserah host untuk mengintepretasi scan code itu

sebagai apa, bearti merupakan tugas program dalam mikrokontroler untuk

mengenal scan code.

Scan code disusun sebagai kode 8 bit bisa dipakai untuk

membedakan 256 macam kode, sedangkan keyboard PC hanya punya 101

tombol, jadi sesungguhnya kode 8 bit tadi cukup untuk semua tombol. Tapi

tombol di keyboard PC dikelompokkan menjadi 2 bagian, bagian utama dan

bagian tambahan, bagian utama cukup dinyatakan dengan scan code 1 byte

saja, sedangkan bagian tambahan diwakili dengan beberapa byte scan code

yang selalu diawali dengan E0. Misalnya tombol „ctrl‟ kiri diwakili dengan 14

sedangkan tombol „ctrl‟ kanan diwakili dengan E0 14.

Gambar berikut menggambarkan scan code masing-masing tombol

keyboard PC. Terlihat pada gambar tersebut, scan code tidak berupa kode

ASCII yang biasa dipakai mewakili huruf , dan ditentukan secara acak, juga.

Sehingga setelah diterima host, scan code harus dirubah menjadi kode ASCII

dengan memakai cara „pencarian tabel‟.

3.5 Mouse

Tetikus atau yang lebih dikenal dengan nama mouse adalah alat yang

digunakan untuk memasukkan data ke dalam komputer selain papan ketik.

Tetikus berbentuk seperti seekor tikus sehingga dalam bahasa Inggris peranti

ini disebut mouse.

Mouse pertama kali dibuat pada tahun 1963 oleh Douglas Engelbart

berbahan kayu dengan satu tombol. Model kedua sudah dilengkapi dengan 3

tombol. Pada tahun 1970, Douglas Engelbart memperkenalkan mouse yang

dapat mengetahui posisi X-Y pada layar komputer, mouse ini dikenal dengan

nama X-Y Position Indicator (indikator posisi X-Y).


Komputer 49

Bentuk mouse yang paling umum mempunyai dua tombol, masing-

masing di sebelah kiri atas dan kanan atas yang dapat ditekan. Walaupun

demikian, komputer-komputer berbasis Macintosh biasanya menggunakan

mouse satu tombol.

Mouse Pertama di Dunia

Bagian Mouse

Bagian dalam mouse mekanik yang dipreteli. Bagian bawah adalah mouse, kiri

atas adalah bola, dan kanan atas adalah pengait.

Mouse bekerja dengan menangkap gerakan menggunakan bola yang

menyentuh permukaan keras dan rata. Mouse yang lebih modern sudah tidak

menggunakan bola lagi, tetapi menggunakan sinar optikal untuk mendeteksi

gerakan. Selain itu, ada pula yang sudah menggunakan teknologi nirkabel, baik

yang berbasis radio, sinar inframerah, maupun bluetooth.

Saat ini, teknologi terbaru sudah memungkinkan mouse memakai

sistem laser sehingga resolusinya dapat mencapai 2.000 titik per inci (dpi),


50

bahkan ada yang bisa mencapai 4.800 titik per inci. Biasanya mouse semacam

ini diperuntukkan bagi penggemar permainan video.

Prinsip Kerja Mouse Mekanik

1. Bola akan berputar saat mouse digerakkan.

2. Penggulung X dan Y mencengkeram bola tersebut dan memindahkan

gerakan.

3. Cakram menerjemahkan gerakan menjadi kode optikal lewat lubang

cahaya.

4. LED inframerah memancar lewat cakram.

5. Sensor mengumpulkan pantulan cahaya untuk mengubah posisi X dan Y.

Mouse optikal buatan Logitech bersensor laser dengan ketelitian mencapai

4.800 titik per inci, nirkabel dengan memanfaatkan gelombang radio


Komputer 51

3.6 Touchscreen

Layar sentuh atau dalam bahasa Inggris Touchscreens, touch screens,

touch panels atau touchscreen panels adalah layar tampilan komputer yang

sensitif terhadap sentuhan manusia, sehingga seseorang dapat berinteraksi

dengan komputer dengan cara menyentuh gambar atau tulisan yang

terpampang pada layar komputer.

Touchscreen sering dipakai pada kios informasi ditempat-tempat

umum, misalnya di bandara dan rumah sakit serta pada perangkat pelatihan

berbasis komputer.

Sistim touchscreen tersedia dalam bentuk monitor yang sudah

memiliki kemampuan layar sensitif sentuhan dan ada juga kit touchscreen

yang lebih ekonomis yang dapat dipasang pada monitor yang sudah ada.

Data yang dihasilkan dari sentuhan ini tentunya adalah data mengenai

posisi tangan Anda yang menyentuh sinyal ultrasonik tersebut. Jika ini

dilakukan secara kontinyu dan terdapat banyak sekali sensor gelombang

ultrasonic pada media yang disentuhnya, maka jadilah sebuah perangkat

touchscreen yang dapat Anda gunakan.

Touchscreen jenis ini diklaim sebagai jenis touchscreen yang paling canggih

dan memiliki banyak keunggulan daripada kedua jenis touchscreen lainnya.


52

Karena tidak menggunakan bahan pelapis metalik melainkan sebuah lapisan

kaca, maka tampilan dari layar touchscreen jenis ini mampu meneruskan

cahaya hingga 90 persen, sehingga lebih jernih dan terang dibandingkan

dengan Resistive touchscreen. Tanpa adanya lapisan sensor juga membuat

touchscreen jenis ini menjadi lebih kuat dan tahan lama karena tidak akan ada

lapisan yang dapat rusak atau haus ketika di sentuh, tidak ada lapisan yang

akan rusak ketika terkena air, minyak, debu, dan banyak lagi.

Namun touchscreen ini juga bukannya tanpa kelemahan. Meskipun secara fisik

kebal terhadap gangguan elemen-elemen luar, kinerja dari touchscreen ini

dapat diganggu oleh elemen-elemen seperti debu, air, dan benda-benda padat

lainnya. Sedikit saja terdapat debu atau benda lain yang menempel di atasnya

maka touchsreen dapat mendeteksinya sebagai suatu sentuhan. Sensor-sensor

ultrasonicnya akan langsung bekerja dengan baik. Maka itu touchscreen jenis

ini harus dijaga dengan ekstra hati-hati. Touchscreen jenis ini sangat cocok

digunakan pada ruangan training komputer, keperluan dalam ruangan untuk

menampilkan informasi dengan sangat jernih dan tajam, presentasi dalam

ruangan, dan banyak lagi.

Capasitive Touchscreen

Touchscreen jenis ini memiliki cara kerja yang cukup rumit, namun sangat

andal dalam ketahanan dan kejernihannya. Capasitive touchscreen memiliki

sebuah lapisan pembungkus yang merupakan kunci dari cara kerjanya, yaitu

pembungkus yang bersifat capasitive pada seluruh permukaannya. Panel

touchscreen ini dilengkapi dengan sebuah lapisan pembungkus berbahan

indium tinoxide yang dapat meneruskan arus listrik secara kontiniu untuk

kemudian ditujukan ke sensornya.

Lapisan ini dapat memanfaatkan sifat capacitive dari tangan atau tubuh

manusia, maka dari itu lapisan ini dipekerjakan sebagai sensor sentuhan dalam

touchscreen jenis ini. Ketika lapisan berada dalam status normal (tanpa ada

sentuhan tangan), sensor akan mengingat sebuah nilai arus listrik yang

dijadikan referensi. Ketika jari tangan Anda menyentuh permukaan lapisan ini,

maka nilai referensi tersebut berubah karena ada arus-arus listrik yang

berubah yang masuk ke sensor. Informasi dari kejadian ini yang berupa arus

listrik akan diterima oleh sensor yang akan diteruskan ke sebuah controller. Controller ini berfungsi untuk meneruskan informasi tersebut ke mesin

pengalkulasi posisi dari gangguan atau sentuhan tersebut. Proses kalkulasi

posisi akan dimulai di sini.

Kalkulasi ini menggunakan posisi dari ke empat titik sudur pada panel

touchscreen sebagai referensinya. Ketika hasil perhitungannya didapat, maka


Komputer 53

koordinat dan posisi dari sentuhan tadi dapat di ketahui dengan baik.

Akhirnya informasi dari posisi tersebut akan diintegrasikan dengan program

lain untuk menjalankan sebuah aplikasi.

Capasitive touchscreen sangat berbeda dengan kedua jenis touchscreen

sebelumnya. Touchscreen jenis ini baru dapat bekerja jika sentuhan-sentuhan

yang ditujukan kepadanya berasal dari benda yang bersifat konduktif seperti

misalnya jari-jari Anda. Tidak seperti Resistive atau Surface wave yang dapat

disentuh dengan jari tangan ataupun stylus, touchscreen ini hanya dapat

dioperasikan dengan jari saja. Tetapi dengan adanya sifat seperti ini, maka

touchscreen ini tidak mudah terpengaruh oleh gangguan dari benda-benda

lain di atasnya seperti misalnya debu atau air.

Tampilan layarnya pun sangat jernih daripada jenis Resistive touchscreen

sehingga sangat cocok untuk digunakan dalam berbagai keperluan interaksi

dalam publik umum seperti misalnya di restoran, kios elektronik, lokasi Point

Of Sales, dan banyak lagi.

Bagaimana Sebuah Layar Touchscreen Bekerja?

Sebuah layar touchscreen yang paling sederhana terdiri dari tiga buah

komponen utama dalam bekerja. Komponen tersebut adalah sebagai berikut:

1. Touch Sensor

Touch sensor merupakan sebuah lapisan penerima input dari luar monitor.

Input dari touchscreen adalah sebuah sentuhan, maka dari itu sensornya juga

merupakan sensor sentuh. Biasanya sensor sentuh berupa sebuah panel

terbuat dari kaca yang permukaannya sangat responsif jika disentuh. Touch

sensor ini diletakkan di permukaan paling depan dari sebuah layar

touchscreen, dengan demikian area yang responsif terhadap sentuhan

menutupi area pandang dari layar monitor. Maka dari itu ketika Anda

menyentuh permukaan layar monitornya, input juga telah diberikan oleh

Anda. Teknologi touch sensor yang kini banyak digunakan terdiri dari tiga

macam, seperti yang telah dijelaskan di atas, yaitu Resistive touchscreen,

Capasitive touchscreen, dan Surface wave touchscreen. Semua jenis sensor

ini memiliki cara kerja yang sama, yaitu menangkap perubahan arus dan sinyal-

sinyal listrik yang ada pada sensor tersebut, merekamnya dan mengubahnya

menjadi titik-titik koordinat yang berada di atas layar, sehingga posisi tepat dari sebuah sentuhan dapat langsung diketahui dengan benar.

2. Controller

Controller merupakan sebuah perangkat yang digunakan untuk

menghubungkan antara sensor dengan perangkat komputer yang akan

memproses sentuhansentuhan tersebut. Ketika sensor-sensor merekam


54

sebuah even sentuhan, maka data yang dimilikinya diteruskan ke sebuah

controller. Controller tersebut kemudian akan melakukan penerjemahan

informasi dari sensor-sensor tersebut menjadi informasi yang dimengerti oleh

prosessor komputer. Setelah informasi masuk dan diproses oleh processor,

maka hasil akhirnya akan dikeluarkan lagi ke monitor untuk ditampilkan.

Kembali controller bertugas untuk menterjemahkan informasi dari processor

untuk diubah menjadi sebentuk gambar yang ditampilkan di atas layar

monitor.

3. Software driver

Software driver merupakan sebuah software pengatur yang diinstal pada

perangkat komputer atau PC Anda yang tugasnya adalah untuk mengatur agar

perangkat touchscreen dan komputer dapat bekerja sama untuk digunakan

dalam berbagai macam keperluan. Software driver akan mengatur operating

system dari perangkat komputer bagaimana caranya menangani even-even

sentuhan yang berasal dari sensor-sensor di atas layar touchscreen.

Kebanyakan dari driver touchscreen saat ini sudah menggunakan driver yang

hampir sama dengan driver sebuah mouse. Hal ini akan membuat sebuah even

sentuhan pada satu titik di layar monitor seperti sebuah even klik pada mouse

di posisi yang sama. Dengan menggunakan driver dari perangkat mouse, maka

para developer program tidak perlu pusing-pusing lagi memikirkan bagaimana

programnya dapat berinteraksi dengan sebuah touchscreen

[http://www.indoforum.org/showthread.php?p=555275]


Komputer 55

Rangkuman

1. Dalam proses interaksi antara manusia dengan komputer terdapat

peripheral yang berfungsi untuk memberikan input dan menampilkan

output. 2. Monitor komputer merupakan media output yang sangat dominan yang

berkerja dengan menggunakan pengolahan warna cahaya.

3. Ditinjau dari bahannya, monitor dapat dikategorikan menjadi 3 macam

yaitu: CRT, LCD dan TFT LCD

4. Ditinjau dari adapternya, monitor dapat dikategorikan menjadi MDA,

EGA, VGA, CGA, XGA, SVGA

5. Warna pada komputer direpresenasikan oleh tiga warna dasar yaitu

merah, hijau, dan biru.

6. Setiap warna dasar RGB diberi skala 0 sampai dengan 255 yang berasal

dari pengkodean 8 bit.

7. Total warna yang dapat direpresentasikan oleh RGB aalah 256x256x256

warna

8. Keyboard yang paling berkembang saat ini adalah model QWERTY

dengan berbagai kelebihan dan kekurangannya.

9. Mouse merupakan piranti masukan untuk aplikasi berbasis windows.

10. Touch Screen bekerja berdasar sensor untuk menentukan posisi dan

pilihan user.


56

Kuis Benar Salah

1. Pada komputer terdapat piranti yang berfungsi sebagai masukan sekaligus

keluaran.

2. Layar monitor komputer bekerja bersasarkan pengolahan cairan

berwarna.

3. Teknologi LCD lebih kuno dibandingkan dengan tabung CRT.

4. Warna dasar cahaya terdiri dari merah, kuning, dan biru.

5. Setiap warna pada komputer pada dasarnya merukan kombinasi dari tiga

warna dasar.

6. FF0000 merukan warna merah sempurna.

7. Warna dasar dalam sistem RGB diberi derajat dari 1 sampai dengan 255.

8. Total warna yang dapat direpresentasikan oleh sistem RGB pada

komputer adalah 255x255x255.

9. Keyboard QWERTY cenderung lebih cocok untuk orang kidal

dibandingkan bukan kidal.

10. Piranti masukan mouse hadir lebih belakangan dibandingkan dengan keyboard.

11. Touch screen merupakan media input output.


Komputer 57

Pilihan Ganda

1.

Yang berfungsi sebagai piranti masukan sekaligus keluaran adalah

______

A. Mouse D Layar Monitor

B. Speaker E. Touchscreen

C. Keyboard

2.

Berikut ini warna yang merupakan warna dasar cahaya adalah pada

komputer adalah ______ 1. Merah

2. Kuning

3. Hijau

4. Biru

5. Hitam

6. Putih

A. 1,2,3 D. 4,5

B. 1,2,4 E. 2,4,5

C. 2,3,4

3.

Urutan Kombinasi warna dasar pada komputer adalah ______

A. Merah – Kuning – Biru D. Merah – Kuning – Hijau

B. Merah – Hijau – Biru E. Kuning – Oranye – Ungu

C. Merah – Oranye – Ungu

4.

Yang merupakan warna kuning adalah _____

A. FFFF00 D. 00FF00

B. FFFFFF E. 0000FF

C. FF0000


58

5.

Yang menghasilkan warna abu abu adalah_______

A. FF00FF D. 909090

B. CC9900 E. 112233

C. ABCDEF

6

Warna merah yang paling kuat adalah _____

A. FF0000 D. 110000

B. FF9999 E. AA0000

C. 990000

7.

1. Keyboard QWERTY paling banyak digunakan

2. Keyboard QWERTY cenderung menguntungkan orang kidal

3. Keyboard QWERTY disusun berdasarkan kode ASCII

4. Keyboard QWERTY disusun berdasarkan Abjad

5. Keyboard QWERT memiliki scan code yang sama dengan kode ASCII


A 1,2,3 D 2,4,5

B 1,3,5 E 1,2,3,5

C 1,2,5

8.

1. Mouse mekanik menggunakan bola untuk memutar rora penetu

koordinat pada monitor.

2. Mouse Optik menggunakan sensor cahaya untuk mendeteksi

perubahan koordinat.

3. Mouse mekanik lebih mudah bekerja pada permukaan yang kesat.

4. Mouse Optik lebih mudah bekerja pada permukaan yang licin dan

menkilap.


A 1,2,3 D 4

B 1,3 E 1,2,3,4

C 2,4


Komputer 59

9 Peralatan elektronik yang paling banyak menggunakan teknologi touch

screen adalah _______

A Televisi D Monitor CRT

B Handphone E Calculator

C PDA

10

1. Resistive touchscreen memiliki permukaan yang relatif buram.

2. Capasitive touchscreen bekerja oleh sentuhan jari ataupun stylus

3. Surface wave Touchscreen dapat terganggu oleh debu dan air.

Pernyataan yang benar adalah ______

A 1,2 D 1,2,3

B 1,3 E 1 saja

C 2,3


60

Latihan

1. Sebutkan warna dasar cahaya!

2. Bagaimana representasi warna pada komputer?

3. Buatlah tabel heksa desimal untuk warna –warna utama berikut:

a. Merah

b. Jingga

c. Kuning

d. Hijau

e. Biru

f. Ungu

4. Carilah program kecil di internet yang dapat memberikan visualisasi

mengenai kombinasi warna denngan bilangan heksa desimal yang menjadi

representasinya!

5. Bagaimana cara kerja mouse mekanik?

6. Bagaimana cara kerja mouse optik?

7. Apa kelebihan dan kekurang keyboard model QWERT? 8. Sebutkan jenis keyboard selain model QWERTY!

9. Sebutkan jenis touchscreen dan sifatnya!

10. Carilah video di internet yang menampilkan penggunaan touchscreen!


Konsep Interaksi 61

4 KONSEP INTERAKSI

Overview

Komputer dan Manusia dapat saling berinteraksi dengan menggunakan

antarmukan yang terdapat diantara prosesor komputer dengan manusia.

Interaksi yang timbul sangat dipengaruhi teknologi yang berkaitan dan

disesuiakan berdasarkan kebutuhan. Melalui bab ini akan dibahas berbagai

macam pola interaksi antara manusia dengan komputer.

Tujuan

1. Mahasiswa memahami konsep interaksi.

2. Mahasiswa mengetahui berbagai macam pola interaksi antara manusia

dan komputer. komponen komputer yang menjadi interface dengan

user.


62

4.1 Interaksi

Interkasi antara manusia dengan komputer dapat dipandang sebagai

dialog antara keduanya. Sebagaimana telah dijelaskan pada bab 1, interaksi ini

melibatkan manusia sebagai pengguna, prosesor komputer, dan antarmuka

diantara keduanya yang menjadi sarana input dan output.

Manusia Komputer

Setiap aplikasi memiliki pola interaksi sendiri-sendiri sesuai dengan

kebutuhan dan teknologi yang ada.

Beberapa pola yang telah diperkenalkan pada bab 1 adalah:

1. Antarmuka dengan baris perintah tunggal

2. Antarmuka dengan baris perintah terstuktur

3. Menu dan WIMP (Window Icon Menu Pointer)

4. Bahasa sehari-hari/alami

5. Dialog dengan tanya jawab terstruktur/Query

6. Formulir isian dan kertas kerja

Output

Input


Konsep Interaksi 63

4.2 Baris Perintah Tunggal

Interaksi ini merupakan interaksi yang paling primitif. Perintah yang dilakukan

dilakukan melalui keyboard dengan sebuah key maupun beberapa karakter

yang membentuk kata kunci tertentu.

? Bukalah Aplikasi MS DOS untuk menjalankan perintah Command

Line. Dengan bantuan informasi di internet cobalah eksplore

perintah-perintah ini dan cobalah untuk mempraktekannya!

1. DIR

2. DIR /P

3. DIR /W

4. EDIT HALO.TXT

5. TYPE HALO.TXT

6. COPY HALO.TXT CALO.TXT

7. REN HALO.TXT BALO.TXT


64

8. DEL H*.TXT

9. DEL *.TXT

10. DEL *.*

11. MKDIR ALOHA

Berbagai macam perintah di atas sangatlah familiar bagi pengguna komputer

sampai dengan awal 90-an. Perintah-perintah tersebut cukup sering dilakukan

sampai akhirnya hadirlah windows eksplorer yang menutup semua kerumitan

tersebut dan menggantinya dengan click and drop.

? Perintah kombinasi keyboard pada window juga dapat dilakukan

dengan menekan kombinasi tombol tertentu! Cobalah perintah-

perintah dibawah ini dan tentukan efek perintah tersebut!

1. [Ctrl]+[d]

2. [Ctrl]+[e]


Konsep Interaksi 65

3. [Alt] + [F4] Natural language

4. [Alt] + [Tab]

? Perintah kombinasi keyboard pada aplikasi Microsoft Word juga

dapat dilakukan untuk mempercepat operasi. Cobalah buka

aplikasi Microsoft Word, kemudian identifikasi perintah key

berikut ini:

1. F1

2. F2

3. F5

4. F12

5. [Ctrl]+[f]


66

? Perintah kombinasi keyboard juga terdapat pada berbagai macam

aplikasi yang lain, misalnya pada browser Mozilla. Cobalah ekplore

dari fungsi tombol/key berikut ini:

1. F3

2. F5

3. F6

4. [Ctrl] + [u]

5. [Alt]+[d]

6. [Ctrl]+[f]

Perintah baris tunggal dapat disarikan sebagai berikut:

• 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


Konsep Interaksi 67

Keuntungan Kerugian

Cepat

Efisien

Akurat

Ringkas

Luwes

Inisiatif oleh pengguna

Mendidik User lebih

berhati-hati dan faham

dengan setiap perintah

yang dijalankan

Memerlukan latihan

yang lama

Membutuhkan

penggunaan yang

teratur

Beban ingatan yang

tinggi

Jelek dalam

menangani kesalahan

Sebagai kesimpulan akhir, perintah tunggal dengan tombol atau kombinasinya

akan optimal apabila ditujukan sebagai perintah pelengkap, bukan perintah

utama sebagai mana perintah pada shell operating system.

4.3 Baris Perintah Terstruktur

Pola interaksi ini merupakan kumpulan dari banyak perintah tunggal menjadi

satu rangkaian. Pola ini sering dijumpai pada file .BAT pada operting system

windows dan .sh pada Linux (Catatan: pada linux, ekstension ini bukanlah hal

yang wajib dan dapat diubah sesuai kebutuhan). Dalam interaksi tingkat tinggi,

pola interaksi ini relatif jarang ditemui.


68

? 1. Sebagai latihan, cobalah buat file halo.BAT pada

Operating System Windows. File halo.BAT dapat dibuat

dari notepad atau editor teks lainnya. Isi file halo.BAT

adalah sebagai berikut.

mkdir coba cd coba

mkdir dir1

mkdir dir2

mkdir dir3

cd dir1

mkdir 1-a

mkdir 1-b

cd ..

cd dir2

mkdir 2-p

mkdir 2-q

cd..

cd dir3

mkdir 3-x

mkdir 3-y

2. Cobalah halankan file BAT dari command line maupun

dari windows eksplorer. (Catatan : untuk mengulangi

perintah yang sama, direktori yang terbentuk di hapus

dulu.)

3. Cobalah buat file .BAT untuk perintah yang lain yang

berkaitan dengan operasi-operasi dasar command line!

(Misalnya DIR /P, DIR /W, COPY, RENAME, dan

sebagainya.

4. Cobalah cari di internet sebuah file .sh kemudian

perhatikan isi file tersebut.


Konsep Interaksi 69

4.4 Menu dan WIMP (Window Icon Menu Pointer)

Menu merupakan sekumpulan pilihan yang diberikan kepada user. WIMP atau

Window Icon Menu Pointer merupakan model interaksi standar yang

berkembang pesat saat ini khususnya pada PC.

Window

- Merupakan area pada layar komputer yang umunya berbentuk kotak.

Merupakan sebuah terminal yang mandiri. Untuk sebuah aplikasi

dapat memiliki window dengan jumlah lebih besar dari satu, namun

masing–masing dapat bekerja mandiri dan tidak saling

mempengaruhi.

- Berisi teks, gambar, dan untuk aplikasi tertentu terndapat visualisasi

untuk hansil interaksi (misalnya hasil pengetikan, pemilihan warna,

dan sebagainya).

- Umumnya window berbentuk kotak dengan mengikuti pola tertentu,

namun ada pula window yang sudah di modifikasi sehingga berbentuk

lain.

- Satu window dengan window lainya dapat saling bertumpukan,

disembunyikan, atau ditampilkan semua.


70

- Pada window umumnya terdapat scrollbars untuk menggulung layar

naik turun atau menggeser layar kanan kiri

- Pada bagian atas terdapat Tittle bar yang berisi judul/nama dari

window.

Icon

- Icon merupakan gambar atau simbol yang berukuran kecil yang

berfungsi merepresentasikan suatu objek

- Berbagai macam window aplikasi dapat diperkecil menjadi ikon-ikon

sehingga dapat diakses dengan mudah.

- Icon dapat berbentuk apa saja dengan berbagai macam variasinya,

namun tetap mencermikan objek yang dimaksud.

- Berikut ini adalah kelebihan Icon:

o icon merupakan variasi dari menu, karena satu ikon

menunjukkan suatu aktifitas, yang dalam sistem menu

dinyatakan dalam bentuk teks

o merupakan terobosan besar karena mempunyai sifat yang

alamiah, ringkas, mudah diingat, mudah dipelajari & dikenal

o gambar lebih bersifat umum daripada tekstual

o menyingkat waktu dan memperkecil usaha untuk

mempelajari software


Konsep Interaksi 71

o kinerja user lebih tinggi dan adanya penurunan tingkat

kesalahan

o bagi pemrogram dapat dengan mudah mengelompokkan

ikon berdasarkan atributnya

- Kekurangan :

o penggunaan ikon menyembunyikan penurunan produktifitas

dibalik penampilan yang ramah

o penggunaan ikon bisa membingungkan dan boros tempat

o tidak efektif bila berurusan dengan perintah-perintah yang

banyak tetapi serupa

o user tertentu lebih suka membaca suatu teks karena lebih

jelas

o 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 (h

o anya muncul pada saat mouse/kursor berada pada ikon

tersebut)

o tidak adanya standarisasi

Pointer

- Pointer merupakan bagian yang unik dan sangat menonjol pada

model WIMP

- Pointer dapat dikendalikan dengan berbagai macam piranti misalnya

joystick, trackball, tombol kursor, namun yang paling populer adalah

mouse.

- Berikut ini adalah contoh bentuk mouse pointer yang terdapat pada

Operating System Windows (Vista).


72

Untuk melakukan pengaturan tampilan pointer pada Windows Vista,

dapat dilakukan dengan cara:

o Klik Start o Klik Control Panel

o Klik Hardware

o Klik Mouse


Konsep Interaksi 73

Berbagai pengaturan mouse (dapat dilakukan pada jendela berikut

ini.

- Window dapat diperkecil menjadi ikon-ikon untuk mempermudah

akses.


74

Menu

Sekumpulan pilihan pada menu dapat disajikan dengan beberapa cara

misalnya:

1. Secara Audio

Menu semacam ini banyak dijumpai pada peralatan berbasis suara,

misalnya telepon dan handphone. Menu pengisian pulsa adalah

contoh dari model menu ini. Secara umum menu berbasis suara

mengarahkan dari hal global ke yang spesifik:

Contoh:

“Selamat datang di layanan isi ulang

o Tekan 1 untuk bahasa Indonesia

o Or press 2 for English”

Jika user memasukkan bilangan selain 1 dan 2 akan muncul pesan

“Masukkan Anda salah, silakan ulangi lagi”

o “Tekan 1 untuk bahasa Indonesia

o Or press 2 for English”

Jika user memilih 1 menu akan dilanjutkan:

o “Untuk pengisian pulsa tekan 1”

o “Untuk Informasi sisa pulsa tekan 2”

o “Untuk informasi masa aktif atau masa tenggang tekan 3”

diikuti pengulangan menu yang ada. Dan seterusnya sampai user

dapat menggunakan menu level terdalam.

2. Secara Visual.

Menu secara visual merupakan menu yang banyak dijmpai pada

aplikasi dengan antarmuka layar monitor.


Konsep Interaksi 75

Selain itu, menu icon pada windows merupakan contoh menu jenis

ini. Menu pada windows telah mengalami perkembangan teknologi

secara pesat dan sering disebut sebagai WIMP (Window Icon Menu

Pointer)

Beberapa komponen tambahan dalam model WIMP, diantaranya

- Button (tombol) :

radio button

Radio button merupakan sekumpulan pilihan yang harus

dipilih salah satu oleh user. User tidak diperkenankan

memilih lebih dari 1 pilihan. Apabila user memilih pilihan

yang lain setelah sebelmnya menentukan pilihan, maka piliha

terakhir yang akan digunakan. Di bawah ini contoh

penggunaan radio button untuk quiz online. Contoh lain

adalah polling online, dimana setiap responden diminta

memilih salah satu dari jawaban yang disediakan.


76

check box : kumpulan dari pilihan-pilihan yang boleh memilih 1/lebih dari 1. Check box dapat juga digunakan

untuk polling yang memungkinkan pilihan lebih dari 1.

Contoh check box seperti pada gambar berikut:


Konsep Interaksi 77

- Pallettes (palet) :

Merupakan 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.


78

- Combo box

Combo Box merupaka kombinasi antara a drop-down list atau list box

dengan sebuah single-line textbox, yang memungkinkan user memilih

pilihan yang disediakan.

- List box

Llist box merupakan sebuah komponen GUI yang mengijinkan user

memilih satu atau lebih item dari sebuah list. Pemilihan lebih dari

satu ini dibantu dengan tombol Shift atau Control.


Konsep Interaksi 79

- 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.


80

- Kotak peringatan, muncul untuk memberitahu kesalahan atau

tuntunan

Perkembangan antarmuka grafis yang secara umum dikenal secara

luas adalah perkembagan windows dari waktu ke waktu.

Windows menjadi raja operating system di dunia saat menjamurnya

personal computer (PC). Kemudahan penggunaan Windows dan

kompatibilitas terhadap berbagai hardware menjadi pemicu utama

berkembangnya sistem operasi ini, meskipun secara sistem masih memiliki

banyak kelemahan, dan secara grafis masih relatif di bawah Mac OS.


Konsep Interaksi 81

(Sumber : http://www.guidebookgallery.org/screenshots/win31)

http://www.guidebookgallery.org/screenshots/win31


82


Konsep Interaksi 83


84

? Bandingkan format windows menu pada windows 3.1 , Windows

95, Windows XP, dan Windows Vista.

(Catatan : Screen shoot menu yang lebih lengkap dapat Anda

peroleh di internet dengan bantuan Google)

Manakah yang paling user freindly menurut Anda? Jelaskan dengan

menyebutkan kelebihan dan kukurangannya.

3. Secara Audio Visual

Menu ini pada dasarnya merupakan pengembagan dari menu visual.

Pada menu jenis ini, menu misual diiringi dengan audio yang

membedakan pilihan satu dengan pilihan yang lain. Menu jenis ini

paling sering dikumpai pada permainan / game baik pada komputer,

handphone maupun PS2.


Konsep Interaksi 85

4. Secara Hardware:

Menu jenis ini melibatkan piranti eksternal yang membantu dalam

menentukan pilihan. Pilihan direpresentasikan melalui alat fisik

tertentu. Game-game simulator biasanya memberikan menu melalui

hardware yang terhubung dengan sistem.

Contoh game yang populer adalah driving simulator dan flight

simulator. Berikut ini gambar Flight Simulator Boeing 747.

Piranti-piranti fisik tersebut merupakan menu yang dapat dipilih

modenya sebagaimana sistem yang di adopsinya. Layar monitor

berfungsi sebagai jendela dunia nyata yang menggambarkan efek dari

menu-menu yang telah dipilih.


86

Pada simulator mobil, layar nonitor juga berfugnsi sebagai jendela

kaca depan mobil dan kaca spion

4.5 Bahasa Alami

Pola interaksi dengan menggunakan bahasa alami lebih luas dari perintah baris

(command line). Interaksi dengan bahasa alami dapat dikategorikan menjadi

dua macam:

Interaksi secara tidak langsung

Contoh untuk interaksi ini adalah bahasa pemrograman. Dengan

bahasa pemrograman manusia memerintahkan komputer melalui

source code untuk melakukan suatu tugas tertentu. Walaupun bahasa

pemrogaman ini tidak langsung di mengerti oleh komputer, namun

interface terdepan antara komputer dengan user adalah bahasa alami.

Contoh bahasa pemrograman dalam bahasa Pascal, LISP, dan Prolog:


Konsep Interaksi 87

http://www.learn-programming.za.net/programming_pascal_learn12.html

http://forrest.psych.unc.edu/teaching/p285/p285pgmexmpchap3.html

http://www.learn-programming.za.net/programming_pascal_learn12.html

http://forrest.psych.unc.edu/teaching/p285/p285pgmexmpchap3.html


88

parent(adam,peter). % means adam is parent of peter

parent(eve,peter).

parent(adam,paul).

parent(marry,paul).

father(F,C):-man(F),parent(F,C).

mother(M,C):-woman(M),parent(M,C).

is_father(F):-father(F,_).

is_mother(M):-mother(M,_).

?-father(X,paul).

http://kti.mff.cuni.cz/~bartak/prolog/genealogy.html

Interaksi secara langsung

Contoh pola interaksi ini adalah Speech Recognition. Dengan teknologi Speech Recognition, user dapat memerintahkan secara lisan

tanpa harus mengetik perintah ke komputer. Pembahasan tentang

Speech recognition akan dilanjutkan lebih dalam pada akhir buku ini.

http://www.microsoft.com/enable/aging/scan3_large.aspx

http://kti.mff.cuni.cz/~bartak/prolog/genealogy.html

http://www.microsoft.com/enable/aging/scan3_large.aspx


Konsep Interaksi 89

Contoh lain adalah Speec to Text. Dengan teknologi ini, data yang berupa

plain text dapat disajikan dalam suara manusia melalui pola pembacaan

tertentu.

http://www.text-to-speech-software.com/

Text

To Speech

Application

http://www.sxsoftware.com/img/notepad_sx.gif

http://www.text-to-speech-software.com/

http://www.sxsoftware.com/img/notepad_sx.gif


90

4.6 Query

Interaksi jenis ini sering digunakan pada sistem informasi, dimana user

mengajukan serangkaian pertanyaan atau perintah yang akan dikerjakan oleh

komputer. Query merupakan pengembagan lebih lanjut dari interaksi dengan

bahasa alami yang difokuskan untuk tujuan terntentu. Perintah Query

biasanya berkaitan dengan dengan aplikasi database. Berikut ini contoh query

pada sutu data base.

SELECT UserId, Name, Position, EntryDate

FROM UserTable

WHERE Location=”BANDUNG”

Pada Microsoft Office tersedia juga terdapat fasilitas untuk membangun query

seperti pada gambar berikut.

Dengan menggunakan Query Designer terlihat lebih mudah dan cepat.

Namun pada kenyataanya, untuk para pakar database penggunaan query

dengan mengetik langsung lebih cepat dibandingkan dengan tools semacam ini.


Konsep Interaksi 91

Query Designer lebih tepat digunakan oleh para pemula. Untuk query yang

lebih kompleks, para programmer lebih senang membangunnya secara

langsung.

Query tidak hanya terdapat di database. Dalam pemrograman inteligensia

buatan, query juga memegang pernanan penting untuk mendapatkan suatu

jawaban dari kerangkaian fakta dan aturan.

/* upper case used for variables, lower case for

constants.

Terminate each clause by a period. A clause can

be written on multiple lines. Do not leave any

blank space. */

/* these are rules */

parent(X,Y):-mother(X,Y).

parent(X,Y):-father(X,Y).

grandparent(X,Y):-parent(X,Z),parent(Z,Y).

/* and these facts */

mother(sonja,mary).

mother(sonja,jane).

father(john,jim).

father(john,bob).

father(bob,bill).

father(bob,dan).

/* and these are goals

Find all X that are grandparents of Y. Type ; after

the first answer

is returned to see more answers.

grandparent(X,Y).

Find who John is a granparent of

grandparent(john,X).

*/


92

Source: http://www-users.cs.umn.edu/~gini/prolog/parent

Pada program prolog Query dapat digunakan untuk mendapatkan fakta baru

dari dari fakta dan aturan yang sudah ada, misalnya:

menentukan hubungan kekerabatan:

- Siapa saja Anak X

- Siapa saja saudara X

- Siapakah orang tua X

- Siapa saja sepupu X

untuk bidang kesehatan:

- Apa saja gejala penyakit Thypus? - Penyakit apa saja yang terdapat gejala demam?

- Jika terdapat gejala demam, pusing, muntah, penyakit apa saja yang

mungkin?

menentukan klasifikasi makhuk hidup.

- Apa saja yang termasuk vertebrata?

- Apa saja ciri ikan?

- Apakah Ikan Paus termasuk jenis ikah?

4.7 Form

Form merupakan tabulasi isian yang yang merupakan bentuk elektronik dari

borang. Form yang baik harus mendukung kemudahan dan kenyamanan

dengan tetap mejaga kualitas data. Berikut ini contoh dari form Menu

merupakan sekumpulan pilihan yang diberikan kepada user. Sekumpulan

pilihan ini dapat disejadikan dengan beberapa cara misalnya pada registerasi

yahoo, calon pengguna diminta mengisi form seperti gambar berikut:

http://www-users.cs.umn.edu/~gini/prolog/parent


Konsep Interaksi 93

? Pada form registrasi yahoo, cobalah eksplorasi form teresbut

dengan menjawab pertanyaan berikut ini. ( Untuk dapat melihat

halamannya secara komplit, silakan akses yahoo.com)

1. Apakah protokol yang digunakannya?


94

2. Mengapa menggunakan protokol di atas?

3. Dapatkah kita memasukkan tanggal lahir 29 Februari

tahun 1981? Mengapa?

4. Apa yang terjadi apabila mengisi tahun masa yang akan

datang, misalnya 2110?

5. Apa yang terjadi apabila apabila user mengsi password

kurang dari enam karakter?

6. Apakah fungsi tombol

7. Apakah nama gambar seperti ini?

8. Apakah fungsi gambar di atas?


Konsep Interaksi 95

9. Apakah ada teknologi untuk mengelabunya? Jika ada , apa

namanya?


96

Rangkuman

1. Antarmuka dengan baris perintah tunggal merupakan intarksi yang paling

primitif yang sering dijumpai pada perintah console operating system.

2. Antarmuka dengan baris perintah terstuktur merupakan kelanjutan dari

baris perintah tunggal yang bersifat jamak. 3. Menu dan WIMP (Window Icon Menu Pointer) merupakan standar

interaksi grafis saat ini.

4. Window merupakan area pada layar komputer yang umunya berbentuk

kotak, merupakan sebuah terminal yang mandiri. Untuk sebuah aplikasi

dapat memiliki window dengan jumlah lebih besar dari satu, namun

masing–masing dapat bekerja mandiri dan tidak saling mempengaruhi.

5. Icon merupakan gambar atau simbol yang berukuran kecil yang berfungsi

merepresentasikan suatu objek

6. Pointer merupakan bagian yang unik dan sangat menonjol pada model

WIMP, dapat dikendalikan dengan berbagai macam piranti misalnya

joystick, trackball, tombol kursor, namun yang paling populer adalah

mouse.

7. Menu merupakan sekumpulan pilihan yang diberikan kepada user yang

dapat disajikan dalam berbagai cara.

8. Pola interaksi dengan menggunakan bahasa alami lebih luas dari perintah

baris (command line).

9. Dengan teknologi Speech Recognition, user dapat memerintahkan secara

lisan tanpa harus mengetik perintah ke komputer.

10. Dialog dengan tanya jawab terstruktur/Query biasa digunakan pada basis

data dan intelegensia buatan.

11. Form merupakan tabulasi isian yang yang merupakan bentuk elektronik

dari borang.


Konsep Interaksi 97

Kuis Benar Salah

1. Teknologi antarmuka grafis sudah ada sejak komputer pertama kali

ditemukan.

2. Perintah baris tunggal sudah seharusnya ditinggalkan dan tidak diperlukan

lagi di era komputer modern.

3. Icon disket artinya menyimpan ke dalam disket.

4. Pointer merupakan simbol yang berukuran kecil dan berfungsi untuk

merepresentasikan objek.

5. Pada komputer terdapat piranti yang berfungsi sebagai masukan sekaligus

keluaran.

6. Ikon biasanya berupa image berukuran besar.

7. Query dapat digunakan untuk mencari fakta baru pada intelegensia buatan.

8. Text to speech mengubah file audio menjadi suara manusia.

9. Speech Recogniton merupakan interaksi modern dimana user

memberikan perintah secara lisan.

10. Windows Vista memiliki fasilitas Speech recogniton.


98

Pilihan Ganda

1.

Yang merupakan interaksi paling primitif adalah ______

A. WIMP D Perintah baris

B. Query E. Text to Speech

C. Speech Recognition

2.

Yang merupakan interaksi paling modern adalah ______

A. WIMP D. Perintah baris

B. Query E. Text to Speech

C. Speech Recognition

3.

Gambar atau simbol yang berukuran kecil yang berfungsi

merepresentasikan suatu objek disebut

A. Windows D. Menu

B. Button E. Pointer

C. Icon

4.

Gambar berikut merupakan menu ______


Konsep Interaksi 99

A. Check Box D. Radio Button

B. List Box E. Drop Down

C. Combo Box

5.

Gambar berikut merupakan menu _______

A. Check Box D. Radio Button

B. List Box E. Drop Down

C. Combo Box

6

Teknologi yang memungkinkan pembacaan sms adalah:

A. Speech Recording D. Text to Speech

B. Sampling E. Speech Recognition

C. Poliphonic

7.

1. Window aplikasi tidak selalu berbentuk kotak

2. Pointer pada Micorsoft Windows dapat diubah bentuknya

3. Short cut dapat berbentuk ikon

4. Graphical User Interface identik dengan WIMP.


A 1,23 D 4

B 1,3 E 1,2,3,4

C 2,4

8.

Interaksi yang paling sering ada pada oprasi database adalah______

A Short cut menu D Speech Recogntion

B Query E Pallet

C Text to Speeh


100

9 Misalkan 2 orang dari dua negara berbeda dengan bahasa yang berbeda

pula, saling menelepon dengan menggunakan bahasa masing-masing.

Teknologi yang mendukung hal ini adalah_____

A Pointing Device D Text To Speech

B Touch Screen E Speech Recognition

C WIMP

10

Operasi-operasi dasar pada sistem operasi yang sering digunakan oleh

hacker menggunakan pola interaksi

A Perintah baris D WIMP

B Speech to Text E Form

C Speech Recognition


Konsep Interaksi 101

Latihan

1. Sebutkan pola-pola interaksi dan jelaskan dengan singkat!

2. Jelaskan dengan singkat teknologi Text to Speech

3. Jelaskan dengan singkat teknologi Speech Recogniton.

4. Cobalah cari di internet aplikasi yang menggunakan intelgensia buatan.

Bagaimana antarmukanya?

5. Apa yang di maksud dengan query builder?

6. Sebutkan komponen –komponen dalam HTML yang sering digunakan

pada form.

7. Bagaimana caranya agar form di internet dapat dikirm secara aman?

8. Bagaimana caranya agar seserang tidak dapat mengirim form ribuan kali

dengan maksud membuat sistem down?

9. Bagaimana caranya mengubah tampilan pointer pada Micorsoft

Windows?

10. Sebutkan kelebihan dan kekurangan perintah baris!


102

5 PRINSIP DESAIN

Overview

Untuk membangun antarmuka yang baik harus diperhatikan prinsip-prinsip

dasar pada antarmuka antara user dengan komputer. Melalui bab ini akan

dibahas prinsip-prinsip pembangunan antarmuka dari berbagai kalangan yang

merupakan pakar di bidangnya.

Tujuan

1. Mahasiswa mengetahui prinsip-prinsip dasar dalam pembangunan

antar muka dengan komputer.

2. Mahasiswa mampu memberikan penilaian seberapa baik suatu antar

muka.

3. Mahasiswa dapat membangun antar muka yang baik berdasarkan

prinsip-prinsip dasar.


Prinsip Desain 103

5.1 Evaluasi Antarmuka

Sebagai pengguna aplikasi komputer, user akan memiliki penilaian

terhadap aplikasi yang dijalankannya. Berbagai macam penilaian akan muncul

terhadap suatu aplikasi yang sama. Seorang user akan mengatakan bahwa

aplikasi Micorsoft Word itu sulit digunakan. Pernyataan ini akan sangat

mungkin dilontarkan oleh seorang pengguna yang baru pertama kali

menggunakan aplikasi tersebut. Pernyataan yang berbeda akan dilontarkan

oleh user yang sudah lama berkecimpung dalam dunia pengolahan kata

semenjak dari jaman Aplikasi Chi-Writer dan Wordstar. Bagi pengguna yang

terkahir ini, aplikasi Microsoft Word merupakan aplikasi yang sangat mudah

dan menjadi suatu keajaiban dibandingkan aplikasi pengolah kata sebelumnya.

Namun pengguna pertama pun dapat menganggap bahwa aplikasi Micorsoft

Word itu sangat mudah setelah ia belajar sepekan.

Pada kasus di atas ada beberapa hal yang berpengaruh terhadap

penilaian user kepada Microsoft Word yaitu:

- Pengalaman

User kedua sudah berpengalaman dalam pengolah kata, sehingga

mampu membuat perbandingan dengan segera

- Kebiasaan

User kedua sudah terbiasa dengan aplikasi Microsfot Word selama

sepekan belajar sehingga mengubah persepsinya dari semula

aplikasi yang sulit menjadi aplikasi yang mudah - Lama belajar

Aplikasi Micrososft Word mendukung waktu pembelajaran yang

relatif singkat (learning time) sehingga user dapat menyesuaikan

dengan cepat dan memiliki tingkat kenyamanan yang tinggi.

- Kemudahan panduan

Boleh jadi, pengguna yang pertama dapat lebih cepat mengubah

persepsinya setelah dibantu penggunaan help yang interaktif dan

tepat sasaran. Help yang panjang, bertele-tele, tidak visual dan

berbentuk prosa, cenderung ditinggalkan oleh user.

Dengan pengalaman dan obeservasi, seseorang dapat menentukan kualitas

desain suatu aplikasi. Berikut ini beberapa contoh berkaitan dengan desain

aplikasi.


104

Perhatikan kedua gambar berikut ini.


Prinsip Desain 105

? Cobalah analisis dari kedua Window di atas. Lakukan

perbandingan pada keduanya.

1. Berupa jumlah kata pada gambar pertama?

2. Berupa jumlah kata pada gambar kedua?

3. Berapa lama (order detik) Anda memahami tampilan

window pertama?


window kedua?

5. Mana yang lebih disukai user, banyak petunjuk dengan

mengorbankan waktu yang singkat, atau sedikit

petunjuk namun lebih cepat waktunya?

6. Dalam kehidupan sehari-hari, apakah Anda selalu

membaca semua manual saat Anda membeli

software/hardware baru terlebih dahulu?

7. Saat mengoperasikan software/hardware baru, apakah

Anda membaca manual terlebih dahulu baru

melakukan aksi terhadap software/hardware Anda?


106

Berikut ini adalah contoh lain terhadap perbandingan alert.

?

Cobalah analisis dari kedua Window di atas. Lakukan





window pertama?


window kedua?


Prinsip Desain 107

5. Mana yang lebih disukai kebanyakan user?

http://www.joelonsoftware.com/index.html

Contoh gambar berikut berkaitan dengan form.

http://www.joelonsoftware.com/index.html


108

?

Cobalaha analisis dari kedua Window di atast. Lakukan





window pertama Sebagai sebuah form?


Prinsip Desain 109


window kedua sebagai sebuah form?

5. Mana yang lebih disukai oleh kebanyakan user?

http://www.startvbdotnet.com/forms/design.aspx

5.2 Prinsip dalam Desain Antar Muka

Untuk mendapatkan antar muka yang baik, perlu diperhatikan prinsip-

prinsip dasarnya pada saat mendesain. Para ahli mencoba memformulasikan

berbagai macam prinsip pembangunan antar muka yang baik.

Prinsip desain merupakan serangkaian panduan yang akan membantu

desainer mengambil keputusan perancangan selama proses tersebut berjalan.

Prinsip ini juga merupakan petunjuk umum yang dihasilkan dari pengalaman

para pakar, yang boleh jadi bebeda antara seorang pakar dengan pakar yang

lain. Namun diantara berbagai pendapat tersebut terdapat prinsip umum yang

berlaku untuk semua. Beberapa prinsip yang akan dibahas adalah sebagai

berikut.

1. Ben Shneiderman's dengan prinsipnya yang dikenal sebagai "Eight

Golden Rules of Dialog Design",

2. Deborah J. Mayhew's melalui "General Principles of User Interface

Design",

3. IBM's melalui "Design Principles for Tomorrow"

http://www.startvbdotnet.com/forms/design.aspx


110

5.3 Eight Golden Rules of Dialog Design

Ben Shneiderman mengusulkan delapan prinsip yang didasarkan pada

pengalamannya secara heuristik namun dapat diterpkan pada berbagai macam

sistem yang interaktif setelah melalui proses yang panjang dengan pemilahan,

perluasan, dan penginterpretasian. Kedelapan prinsip tersebut adalah:

1. Upayakan untuk tetap konsisten

Konsisten pada serangkaian aksi yang mirip merupakan hal yang penting.

Konsistensi ini berkaitan dengan tampilan, menu, bantuan, perintah,

pesan-pesan yang disampaikan, dan istilah yang digunakan di layar.

Pada gambar tersebut terdapat berbagai macam button „Yes‟ dengan

berbagai macam variasinya. Namun aplikasi yang konsisten, sekali

memilih bentuk button „Yes‟ maka bentuk tersebut harus senantiasa

digunakan pada setiap kali dibutuhkan.

Pada gambar berikut sebuah form untuk melakukan registrasi secara

online. Perhatikan bahwa terdapat inkonsistensi pada form tersebut

yaitu:

a. Penggunaan istilah Form (pada judul window), Formulir (pada

judul halaman), dan borang (pada pernyataan keaslian) untuk mengacu kepada terminologi yang sama.

b. Penggunaan istilah registrasi (judul halaman) dan daftar

(pada button bawah) untuk terminologi yang sama.


Prinsip Desain 111

2. Gunakan short cut pada bagian yang sering digunakan.

Dengan short cut, banyaknya interaksi dapat ditekan seminimal mungkin.

Semakin sedikit interaksi semakin mudah penggunaan, semakin kecil pula

kesalahan. Berbagai macam singkatan, tombol, perintah cepat dengan menggunakan key tertentu (Function, shit, control, tab, dsb.) sangat

berguna bagi user yang mahir dengan aplikasi yang digunakannya.

Contoh short cut dengan key:

- [Alt] + [tab]

- [Windows]+[e],

- [Windows]+[d],

- [Windows]+[r]

- [alt]+[f4].

- [Control]+[Alt]+[Del]


112

?

Perhatikan Window di atas. Window tersebut adalah pengaturan

jaringan pada Internet Eksplorer.

1. Berapa langkah Anda dapat menemukan window

tersebut?

2. Apakah window tersebut sering digunakan untuk orang

yang mobile?


Prinsip Desain 113

3. Apakah perlu short cut untuk wondow tersebut atau

tidak? Jelaskan!

3. Sediakan feedback yang informatif.

Untuk operasi yang umum berikan feedback yang umum sedangkan

untuk operasi yang khusus apalagi berbahaya berikan feedback dengan

penekanan. Desain yang dibuat harus tetap menginformasikan kepada

pengguna mengenai aksi atau interpretasi, perubahan status, adanya

kesalahan, atau adanya ekspesi yang relevan dan menarik secara melalui

bahasa yang jelas, singkat, tidak ambigu, dan familiar bagi pengguna.


114

4. Dialog memiliki lingkup tertentu.

Serangkaian akasi harus diatur kedalam kelompok sedemikian sehingga

terdapat bagian awal, pertengahan, dan penutup. Feedback yang

informatif pada sekelompok aksi tersebut memberikan kenyamanan bagi

pengguna dan selanjutnya menjadikan petunjuk untuk serangkaian

langkah berikutnya.

5. Sediakan penanganan kesalahan yang sederhana

Dalam mendesain sistem, harus dibuat sedapat mungkin pengguna tidak

melakukan kesalahan yang fatal. Apabila terjadi kesalahan yang serius,

sistem harus dapat mendeteksi dan melakukan penanganan kesalahan

secara sederhana dan komprehensif.

6. Perbolehkan user melakukan aksi mundur atau pembatalan.

Fitur ini menghilangkan kekhawatiran pengguna karena pengguna

melakukan kesalahan, maka aksi tersebut dapat di batalkan. Pembatalan

ini mungkin dapat berupa pembatalan sebuah aksi, sekelompok data

entri, ataupun sekelompok aksi.

7. Berikan kontrol internal

Pengguna cenderung merasa tahu dan mereka mampu mengendalikan

sistem. Oleh karena itu desain yang baik harus memposisikan pengguna

sebgaia inisiator ketimbang sepagai respoender dari sistem.

8. Kurangi aktifitas mengingat.

Keterbatasan manusia yang berkaitan dengan memori jangka pendek

menuntut desainer sistem membuat antarmukayang sederhana. Sedapat

mungkin user tidak perlu mengignat terlalu banyak.

5.4 General Principles of User Interface Design

Deborah J. Mayhew, memperkenalkan General Principles Of UI Design,

atau Prinsip Umum Desain User Interface. Ada 17 prinsip yang harus

dipahami para perancang sistem, terutama untuk mendapatkan hasil

maksimal dari tampilan yang dibuat.

1. User Compatibility

User Compatibility artinya kesesuaian tampilan dengan tipikal dari

user. karena berbeda user bisa jadi kebutuhan tampilannya

berbeda. misalnya, jika aplikasi diperuntukkan bagi anak-anak,

maka jangan menggunakan istilah atau tampilan orang dewasa.


Prinsip Desain 115

2. Product Compatibility

istilah ini mengartikan bahwa produk aplikasi yang dihasilkan

juga harus sesuai. memiliki tampilan yang sama/serupa. baik untuk

user yang awam maupun yang ahli.

3. Task Compatibility

berarti fungsional dari task/tugas yang ada harus sesuai dengan

tampilannya. misal untuk pilihan report, orang akan

langsung mengartikan akan ditampilkan laporan. sehingga tampilan

yang ada bukanlah tipe data (dari sisi pemrogram).

4. Work Flow Compatibility

aplikasi bisa dalam satu tampilan untuk berbagai pekerjaan. Jika

tampilan yang ada hanya untuk satu pekerjaan saja. misal

untuk kirim mail, maka kita harus membuka tampilan tersendiri

untuk daftar alamat.

5. Consistency

Konsisten. Contohnya, jika anda menggunakan istilah save

yang berarti simpan, maka gunakan terus istilah tersebut.

6. Familiarity

Icon disket akan lebih familiar jika digunakan untuk perintah

menyimpan.

7. Simplicity

aplikasi harus menyediakan pilihan default untuk suatu pekerjaan.

8. Direct Manipulation

manipulasi secara langsung. misalnya untuk

mempertebal huruf, cukup dengan ctrl+B.

9. Control

berikan kontrol penuh pada user, tipikal user biasanya tidak

mau terlalu banyak aturan.

10. WYSIWYG

What You See Is What You Get, buatlah tampilan mirip seperti

kehidupan nyata user. dan pastikan fungsionalitas yang ada

berjalan sesuai tujuan.

11. Flexibility

tool/alat yang bisa digunakan user. jangan hanya terpaku pada keyboard atau mouse saja.

12. Responsiveness

tampilan yang dibuat harus ada responnya. misal, yang sering

kita lihat ketika ada tampilan please wait... 68%...


116

13. Invisible Technology

user tidak penting mengetahui algoritma apa yang digunakan.

Contohnya untuk mengurutkan pengguna tidak perlu

mengetahui algoritma yang digunakan programmer (max sort,

bubble sort, quick sort, dst)

14. Robustness

handal. Dapat mengakomodir kesalahan user. jangan malah error,

apalagi sampai crash.

15. Protection

melindungi user dari kesalahan yang umum dilakukan. misalnya

dengan memberikan fitur back atau undo.

16. Ease of Learning

aplikasi. mudah dipelajari.

17. Ease of use

aplikasi harus mudah digunakan

5.5 Object Oriented User Interface from IBM

IBM memiliki prinsip-prinsip desain, yang diturunkan dari prinsip desain klasik

dengan perluasan yang mengkaitkan dengan antrmuka modern berdasarkan

pengalamannya pada object-oriented user interface (OOUI. Prinsip-prinsip

tersebut adalah sebagai berikut.

1. Kesederhanaan: Tidak menabaikan usability demi fungsionalitas tertentu.

Antarmuka yang baik harus tetap menjaga kesederhanaan. Sebuah

fungsionalitas yang handal namun sangat sulit untuk digunakan tetap

saja merupakan hal yang tidak disukai pengguna. Untuk fungsi-fungsi

dasar, harus segera terlihat oleh pengguna sedangkan fungsi lanjutan

dapat diberikan menu pilihan tersendiri. Namun harus senantiasa

diuhakan bahwa akses terhadap suatu fungsi memerlukan langkah

seminimum mungkin.

2. Support: pengguna tetap terkendali melalui panduan proaktif.

User senantiasa tetap dalam kendali. Keadaan sistem senantiasa

terkendali dan stabil. Apabila itnerkasi dihentikan, user dapat

memeperoleh sistem seperti keadaan saat dihaentikan, misalnya user

meninggalkan pekerjaanya sejam atau seharian.


Prinsip Desain 117

3. Familiarity: Bangun pemahaman pengguna.

Interaksi yang didasarkan pengalaman pengguna akan suatu sistem

akan sangat membantu dalam interaksi pada suatu sistem baru.

Pengalaman ini dapat berasal dari pengalaman sehari-harinya maupun

pengalaman menggunakan sistem yang lain.

4. Obviousness: Buat Objek fungsinya dapat terlihat dan intuitif.

Berbagai macamrepresentasi objek dapat di ambil dari dunia nyata.

Misalnya lamabang disket, mengindikasikan bahwa ikon tersebut

digunakan untuk menyimpan data. Contoh lainnya ikon telephone,

artinya pengguna dapa melakukan panggilan dengan menggunakan

menu tersebut.

5. Encouragement: Buat aksi dapat diperkirakan hasilnya dan dapat

dibatalkan.

Berbagai aksi pengguna harus menghasilkan hasil sebagaimana yang

diinginkan pengguna. Untuk itu desainer harus memahami benar-

benar pekerjaan pengguna, tujuannya, dan model mentalnya. User

dapat memperkirakan hasil atau akibat dari berbagai macam tindakan

yang dilakukannya pada sistem. Apabila hasilnya tidak seperti yang

diharapkan, pengguna harus diberi kesempatan untuk membatalkan

aksi tersebut, dan keadaan dipulihkan seperti sedia kala.

6. Satisfaction: Berikan pencapaian progress

Setiap aksi yang dilakukan user, berikan informasi yang cukup kepada

user mengenai aksi yang telah ia lakukan. Misalnya saat user

mengubah jenis font, maka jenis font yang diubah harus segera di

tampilkan agar user dapat segera mengevaluasi apakah font yang

dipilih cocok atau tidak. Apabila user tidak cocok dengan font baru

tersebut, maka dapat segera di ambil keputusan untuk mengubah

font kembali.

Contoh lain, apabila user mendelete file, maka setelah operasi

penghapusan, file tersebut harus hilang dari daftar file dengan segera.

Contoh penampilan progress adalah progress bar saat mendownload file atau menginstall suatu aplikasi.


118

7. Accessibility: Buat semua object dapat di akses setiap saat.

Pengguna harus dapat mengakses semua objek setiap saat. Hindari

sedapat mungkin adanya 'mode' dalam penggunaan aplkasi yang

menyebabkan perbedaan state pada interface. Misalnya adanya menu

yang tidak berjalan karena masalah hak akses, atau pesan "no longer

available".

8. Safety: Pastikan pengguna terbebas dari masalah.

Pengguna harus dilindungi dari kemungkinan melakukan kesalahan.

Pencegahan kesalahan ini sangat dintentukan oleh desain dari sistem

yang dibangun. Berbagai macam pencegahan kesalahan dapat

dilakukan denga pemberian alaternatif nilai masukan melalui combo

box, dropdwon, check box, radio button, autocomplete, dan

sebagainya.

9. Versatility: Berikan alternatif teknik interaksi.

Berikan kesempatan kepada pengguna untuk menentukan teknik

interkasi yang paling sesuai dengan keadaanya. Antarmuka yang

flexible akan sangat membantu pengguna pada berbagai macam

tingkatan keahlian, sering tidaknya berinteraksi, atau lingkungan

penggunaan.

Misalnya seorang pengguna yang sudah mahir dalam operasi file, lebih

menyukai command line dari pada interkasi melalui window. Dalam

beberapa kasus, operasi command line lebih cepat dari pada operasi

dengan menggunakan window. Contoh lainnya adalah pembangunan

query database. Query dapat dilakukan dengan menggunakan tool

atau dapat dibangun sendiri melalui console.

Berbagai macam piranti akan optimal untuk pengguna tertentu

tergantung siatuasi dan kondisinya. Misalnya microphone yang

digunakan pada aplikasi speech recognition akan sangat membantu

pada model entri secara hands-free.

10. Personalization: Berikan kesempatan pengguna untuk kustomisasi

Interface yang baik memberikan kepada pengguna melakukan kustomisasi dengan antarmukanya. Tidak ada seroang pengguna pun

yang memiliki kesamaan selera dalam semua hal. Melalui kustomisasi

akan membuat pengguna merasa nyaman.

Melalui personalisasi dapat meningkatkan produktifitas. Misalnya

adanya pengaturan nilai default dapat mempercepat proses input.


Prinsip Desain 119

11. Affinity: Sesuaikan objek dengan kehidupan nyata melalui desain visual

Dengan desain visual pada antarmuka, pengguna dapat meningkatkan

kualitas interaksi bersama sama dengan prinsip desain yang lain.

Desai visual yang dibangun harus mencerminkan model pengguna

dan juga fungsi yang diberikan tanpa menimbulkan ambiguitas.


120

Rangkuman

1. Prinsip desain merupakan panduan agar dipereoleh performansi

interaksi yang optimal.

2. Dialog sebaiknya sederhana dengan bahasa yang dipahami pengguna.

3. Desain senatiasa konsisten dengan urutan langkah, aksi, perintah, layout, dan terminologi sehingga antarmuka yang ada dapat segera dimengerti

oleh pengguna

4. Desain sebagikanya memberikan feedback yang informatif, khususnya

untuk aksi yang jarang dan penting.

5. Sedapat mungkin penggunaan ingatan pengguna diminimalkan.

6. Pengguna sedapat mungkin dapat melakukan langkah mundur (undo)

7. Langkah operasi /akses suatu fungsi harus seminimal mungkin, misalnya

menggunakan short cut.

8. Berikan kesempatan kepada pengguna untuk mengontrol sistem.

9. Deasin yang handal harus mencegak kesalahan penggunaan sedini

mungkin.

10. Desain yang baik harus terdokumentasi dan dapat dibaca dengan mudah

oleh penggguna sebagai user manual.


Prinsip Desain 121

Kuis Benar Salah

1. Button untuk sebuahfungsi yang sama sebaiknya berbeda untuk tiap

windows aplikasi.

2. Panjang Button sebaiknya mengikuti panjang teks button.

3. Sebuah aplikais perlu merancang antarmuka sendiri, tidak perlu

memperhatikan antarmukan yang sudah ada.

4. Berikut ini bentuk urutan opsi yang lazim.

5. Berikut ini bentuk urutan opsi yang lazim.

6. Berikut ini adalah input tanggal yang baik.

7. Antarmuka yang canggih lebih sulit digunakan.

8. Antarmuka yang bagus memerlukan waktu pebelajaran yang semakin lama.

9. User harus banyak mengingat agar dapat menggunakan sistem dengan

baik.

10. Warna background oranye sangat cocok untuk teks berwarna kuning.


122

Pilihan Ganda

1.

Berikut ini adalah beberapa program keuangan yang sedang dipelajari

oleh seorang user untuk sebuah fitur yang sama.

Aplikasi Waktu Belajar

I 5 menit

II 10 menit

III 12 menit

IV 20 menit

V 30 menit

Ditinjau dari konsep interaksi antarmuka, aplikasi yang paling baik adalah

aplikasi no __________

A. I D IV

B. II E. V

C. III

2.

Berikut ini Font yang tepat digunakan untuk registrasi sebuah account

Bank adalah:

1. Nama Gadis Ibu Kandung




A. 1,2,3 D. 4

B. 1,3 E. 1,2,3,4

C. 2,4


Prinsip Desain 123

3.

Dari ketiga macam inputan tanggal di atas, urutan dari yang paling

buruk sampai yang paling baik adalah_________

A. I-II-II D. II-I-III

B. III-II-I E. I-III-II

C. II-III-I

4.

Susunan menu yang paling baik adalah _______

A.

D.

B.

E.

C.

5.

Pengguna harus dapat mengakses semua objek setiap saat. Hindari

sedapat mungkin adanya 'mode' dalam penggunaan aplkasi yang

menyebabkan perbedaan state pada interface. Misalnya adanya menu

yang tidak berjalan karena masalah hak akses, atau pesan "no longer

available".

Isu di atas berkaitan dengan______


124

A. Safety D. Simplicity

B. Support E. Accessibility

C. Personalization

6

Dari hal-hal berikut yang mempengaruhi user satisfaction adalah

1. Jenis font

2. Warna

3. Kemiripan dengan aplikasi lain secara umum

4. Kemudahan penggunaan

A. 1,2,3 D. 4

B. 1,3 E. 1,2,3,4

C. 2,4

7

Interaksi yang didasarkan pengalaman pengguna akan suatu sistem akan

sangat membantu dalam interaksi pada suatu sistem baru. Pengalaman ini

dapat berasal dari pengalaman sehari-harinya maupun pengalaman

menggunakan sistem yang lain.

Isu di atas berkaitan dengan ______

A Affinity D. Simplicity

B Familiarity E. Obviousness

C Personalization

8.

Aplikasi yang pertama kali di install dan digunakan harus secepat

mungkin dapat difahami oleh user berkaitan dengan cara

menggunakannya. Hal ini berkaitan dengan ____

A ease of learning D Support

B ease of use E Familiarity

C satisfaction

9 Antarmuka input yang baik harus mencegah pengguna dari inputan

yang salah yang dapat mengganggu sistem. Hal ini merupakan prinsip

dari _____

A Robustness D Satisfaction

B Simplicity E Familiarity

C Protection


Prinsip Desain 125

10

Untuk membuka Windows Explorer secara cepat pada Micrososft

Windows dapat dilakukan dengan cara:

1. [Windows]+[e]

2. [Start] > [All Programs] > [Accessories] > Windows

Explorer

3. Klik kanan [Start] > Explore......

4. Klik kanan [Start] > Search....

5. [Windows]+[d]

A 1 D 4

B 2 E 5

C 3

11

Pesan terbaik untuk memberi tahu bahwa nama yang dimasukkan

salah karena tidak terdaftar di database adalah ______

A. “Ah elo.... masukin nama aja salah! B. “Maaf, Anda telah memasukakan nama yang sepertinya kurang tepat

untuk aplikasi ini. Pastikan kembali bahwa nama yang Anda masukkan

benar sesuai nama yang terdaftar pada waktu registrasi, agar Anda

dapat menjalankan program sistem informasi akademik ini dengan

baik.” C. “Masukan Nama Salah!” D. “Nama Tidak Terdaftar!” E. “Masukanmu Salah!”


126

Latihan

1. Bagaimana suatu desain dikatakan baik atau buruk? Jelaskan!

2. Sebutkan dan jelaskan prinsip desain dari Ben Shneiderman's dengan

prinsipnya yang dikenal sebagai "Eight Golden Rules of Dialog Design"!

3. Sebutkan dan jelaskan prinsip desain dari Deborah J. Mayhew's melalui

"General Principles of User Interface Design"!

4. Sebutkan dan jelaskan prinsip desain dari IBM's melalui "Design Principles

for Tomorrow" !

5. Apa yang dimaksud dengan User Centered Design?


Window & Multiple Window 127

6 WINDOW & MULTIPLE WINDOW

Overview

Antarmuka sebuah aplikasi seringkali tidak cukup untuk dapat disajikan dalam

sebuah halaman window. Untuk itu diperlukan kembali window lain yang

berkaitan langsung dengan window utama. Melalui bab ini akan dibahas

strategi untuk membangun multiple window.

Tujuan

1. Siswa memahami perlunya multiple window pada aplikasi tertentu.

2. Siswa dapat merancang aplikasi multiple window dengan baik

berdasarkan kaidah prinsip desain.


128

6.1 Persoalan pada Aplikasi Berbasis Window

Antarmuka Grafis telah menjadi antarmuka yang berkembang pesat

saat ini. Antarmuka ini sangat mengedepankan pengolahan grafis untuk

menyajikan berbagai aplikasi semenarik mungkin. Namun apabila ditelah lebih

lanjut, dasar antarmuka ini adalah window aplikasi. Window menjadi tempat

aplikasi bertumpu untuk berinteraksi dengan pengguna.

Aplikasi berbasis antarmuka window pada kenyataanya memiliki

beberapa kendala pada implementasinya diantaranya:

- Pengguna memerlukan informasi dari window lain dengan cepat.

- Pada window berukuran besar diperlukan pergerakan mata yang

berefek pada visibility berbagai menu pada window tersebut.

- Pada window kecil mengganggu ruang gerak bekerja.

Berbagai persoalan di atas memerlukan strategi untuk membuat

window yang memiliki komposis yang tepat sedemikian sehingga dapat

mendukung kemudahan penyelesaian tugas pengguna.

6.2 Komponen Utama Window

Sebuah window memiliki komponen dasar berikut:

- Judul window

Judul window memberikan informasi secara singkat mengenai

fungsi suatu window. Boleh jadi sebuah window tidak memiliki

judul, namun hal ini sangat tidak disarankan. Bar tempat judul

berada dapat pula diberi indikator apakah window tersebut sedang

aktif atau tidak. Indikator tersebut misalnya perubahan warna bar

yang lebih terang untuk window yang sedang aktif.

- Bingkai window

Bingkai window (border atau frame) merupakan batas suatu

window dengan lingkungannya (antarmukanya)

- Scroll bar

Merupakan kompone window yang berguna menggeser (ada yang

menggunakan istilah menggulung) isi window ke atas/bawah

maupun kiri/kanan.

- Menu dasar window

Menu dasar pada window merupakan menu untuk operasi window

itu sendiri, misalnya maximize, minimize, close.



Judul window

Menu dasar window

Scroll Bar

Border/Frame

6.3 Operasi pada Window

Sebuah window dapat dilakukan bermacam operasi yang akan berefek

kepada atribut window. Berikut ini beberapa operasi pada window yang

sering digunakan.

- Membuka Window

Untuk membuka window suatu aplikasi dapat dilakukan dari menu atau

short cut/icon melalui:

Perintah yang diketik dan perintah baris

Misalnya membuka aplikasi Run dilakukan dengan perintah

[Ctrl] + [R]. Selanjutnya apabila dikehendaki window

aplikasi DOS dapat dilakuan dengan perintah cmd (Enter).


130

Perintah suara

Perintah dengan menggunakan suara merupakan

implementasi dari Speech Recognition dan akan menjadi

topik lanjut dari mata kuliah ini. Untuk dapat menerapkan

perintah ini, desainer sistem harus memastikan bahwa

komputer yang digunakan memiliki sepsifikasi yang cukup

untuk dapat menjalankan

Klik

Klik ganda

Membuka window dengan mengklik menu atau mengklik ganda icon

merupakan pilihan yang paling umum. Namun dmeikina untuk kedaan

tertentu pilihan lain merupakan pilihan yang lebih tepat, misalnya

komputer untuk orang tuna netra, maka pilihan dengan perintah suara

merupakan pilihan yang paling tepat (walaupun bentuk window dan

isinya sendiri tidaklah penting bagi user tersebut).

- Menempatkan dan menentukan ukuran window

Window yang akan ditampilkan perlu diperhatikan posisi dan

ukurannya. Desainer harus menentukan apakah window yang

ditampilkan full screen atau tidak. Apabila tidak full screen, maka harus

ditentukan pada posisi mana window akan ditampilkan.

Secara umum, window akan ditampilkan secara full screen untuk

pertama kalinya. Pada awal aplikasi sering pula dijumpai dimana pengguna

diminta memasukkan user id dan password. Kedua macam isian ini

sangat sedikit memakan ruang window. Untuk itu diperlukan

keseimbangan dan keserasian dalam penyajiannya. Misalkan dengan

menambahkan gambar latar tipis atau banner pada halaman window

tersebut.

Sederhana namun kaku



- Mengubah ukuran window

Window yang telah ditampilkan perlu diperhatikan apakah pengguna

diperkenankan untuk mengubah ukurannya atau tidak. Secara umum

user dapat mengubah ukuran window tersebut, namun untuk beberapa

kasus window tidak boleh di ubah untuk memastikan bahwa informasi

dari window tersebut sampai secara utuh sebagai satu kesatuan.

Beberapa saran berkiatn dengan pengubahan window.

Window ditampilkan pada ukruan dan tempat terakhir kali

dilakukan perubahan.

Mempertimbangkan window-window lain yang sudah dibuka

Sebaiknya diletakkan di daerah fokus

Untuk window pesan (alert, message) ditampilkan secara

otomatis

- Memindahkan window

Pada operating system terntentu window dapat dipindah dengan men-

drag pada title bar-nya.

- Mengaktifkan window.

- Menutup window.

Umumnya window dapat aktif dengan mengklik sembarang di atas

window yang tidak aktif. Untuk berpindah ke window lain pada OS

Windows, dapat dilakukan dengan short cut [Alt] + [Tab].

6.4 Multipe Window

Seringkali berbagai macam informasi yang hendak disampaikan ke

pengguna tidak cukup disajikan dalam sebuah window. Dalam hal tertentu

pula, informasi perlu dijadikan sebagai window bertingkat, artinya isi dari

suatu window bergauntung dari keadaan (state) window yang lain.

Berbagai macam cara dilakukan untuk memberikan informasi kedalam

window lebih dari satu buah, diantaranya:

- Multiple monitor

Dengan cara ini, berbagai macam informasi dapat disjaikan

sekaligus. Misalnya pusat secutiry dapat melihat seluruh ruangan

dan lorong dengan melihat monitor CCTV dimana tiap CCTV satu

monitor.

Pada model ini, jarak antar monitor sangat mempengaruhi

kinerja pengguna. Perindahan mata, atau bahkan arah duduk dapat mengganggu fisik pengguna untuk jangka pengamatan yang lama.

- Rapid display flipping


132

Merupakan teknik untuk menampilkan secara bergantian isi

dari monitor. Penggantian isi tampilan secara cepat dapat dilakukan

dengan otomatis maupun diatur oleh pengguna.

- Split window

Cara ini dilakukan dengan membagi dua atau lebih suatu

window.

- Cascades

Cara ini dilakukan dengan mengurutkan window secara berundak

dari atas ke kanan bawah atau dari kiri bawah ke kanan.

6.5 Koordinasi pada Multipe Window

Untuk mengkoordinasi multiple window dapat dilakukan dalam

berbagai cara, diantaranya:

- Synchronized scrolling

Langkah ini dilakukan dengan sinkronisasi dua buah scroll bar pada

window yang berbeda. Pergerakan scroll bar satu akan

mempengaruhi scroll bar yang lain. Model ini sudah banyak

digunakan, misalnya pada Microsoft Power Point.



- Hierarchical browsing

Cara kerja teknik ini adalah pilihan pada satu window akan

menyebabkan window lainnya berubah content-nya berdasarkan

urutan tertentu. Misalnya Windows Explorer.


134

- Two dimensional browsing

Cara ini umumnya diimplementasikan pada peta, grafik, foto atau

gambar. Pemilihan suatu area akan ditampilkan detilnya di window

yang lain.



- Dependent windows opening

Cara ini dilakukan dengan menampilkan window-window lainnya

yang berkaitan secara berdekatan.


136

Rangkuman

1. Secara umum window memiliki judul, bingkai, scroll, dan menu dasar

2. Window berukuran lebar dapat memperlambat kinerja user

3. Window berukuran kecil mengganggu ruang gerak user 4. Window dapat dibuka dengan cara perintah yang diketik, perintah suara,

klik, dan klik ganda

5. Window Aplikasi dapat dibuka melalui ikon/shortcut aplikasi tersebut

6. Multiple window dapat disasjikan dengan beberapa cara misalnya

multiple monitor, rapid display flipping, split window, dan cascades.

7. Koordinasi antar window dapat dilakukan dengan Synchronized

scrolling, Hierarchical browsing, Two dimensional browsing, dan

Dependent windows opening



Kuis Benar Salah

1. Ukuran terbaik window sebuah aplikasi adalah memenuhi layar monitor.

2. Window tanpa judul lebih baik dari pada yang menggunakan judul.

3. Window dapat memiliki frame, dapat juga tidak.

4. Aplikasi Windows Explorer dapat dibuka dengan Short cut Key

5. Aplikasi Microsoft Word dapat dibuka dengan perintah baris.

6. Perintah suara untuk membuka window aplikasi melibatkan teknologi

Text To Speech

7. Pada Operating System Microsoft Windows, sebuah window dapat

diaktifkan dengan mengklik sembarang tempat pada area window

tersebut.

8. Pada Operating System Microsoft Windows, sebuah window dapat

digeser dengan men-drag title bar-nya.

9. Rapid Display Flipping dapat menyebabkan mata cepat lelah.

10. Window pada WinAmp selalu berbentuk kotak.


138

Pilihan Ganda

1. Ukuran window yang besar dapat mempengaruhi ______

A.

Luminans

D

. Visibiliti B. Kekontrasan E. warna

C. Kecerahan

2.

1. Window yang besar dapat menurunkan visibiliti

2. Window yang besar dapat menaikkan visibiliti

3. Window yang besar dapat menaikkan kekontrasan

4. Window yang besar dapat menurukan kekontrasan

Pernyataan yang benar adalah _____

A. 1,2,3 D. 1,2

B. 1,3 E. 1,2,3,4

C. 2,4

3.

1 2 3 4 5

Title Bar ditunjukkan oleh nomor _________



A. 1 D. 4

B. 2 E. 5

C. 3

4.

Menu dasar window ditunjukan oleh nomor_______

A. 1 D. 4

B. 2 E. 5

C. 3

5.

1. Perintah suara

2. Klik Ganda Ikon

3. Perintah batin

Untuk membuka window aplikasi dpat dilakukan dengan cara: i atas

berkaitan dengan______

A. 1 D. 1,2

B. 2 E. 1,3

C. 3

6

Dari cara membuka aplikasi berikut:

1. Perintah baris

2. Perintah suara

3. Klik Menu

Urutan dari yang paling kuno ke yang paling modern adalah ______

A. 1,2,3 D. 2,1,3

B. 1,3,2 E. 3,2,1

C. 2,3,1

7

Pada Microsoft Windows, perintah key untuk menurtup window

aplikasi adalah ______

A [Ctrl] + [F4] D. [Ctrl] + [Alt] + [Del]

B [Ctrl] + [F2] E. [Alt] + [Tab]

C [Alt] + [F4]


140

8.

Cara menampilkan banyak dengan mengurutkan window secara

berundak dari atas ke kanan bawah atau dari kiri bawah ke kanan

disebut _______

A Multiple monitor D Tiling

B Rapid display flipping E Cascade

C Split window

9 Teknik untuk menampilkan secara bergantian isi dari monitor

disebut________

A Multiple monitor D Tiling

B Rapid display flipping E Cascade

C Split window

10

Microsoft Powerpoint membagi window seperti berikut:

Scrolling window sebelah kiri mengakibatkan scrolling disebelah

kanan. Cara ini merupakan bentuk koordinasi dari_______

A Synchronized scrolling D Dependent windows opening

B Two dimensional browsing E Independent windows

C Hierarchical browsing Opening



Latihan

1. Sebutkan masalah yang timbul apabila window aplikasi berukuran kecil!

2. Sebutkan masalah yang timbul apabila window aplikasi berkukuran besar!

3. Sebutkan keuntungan yang diperoleh apabila window aplikasi berukuran

kecil!

4. Sebutkan keuntungan yang diperoleh apabila window aplikasi berkukuran

besar!

5. Sebutkan komponen-komponen pada window!

6. Sebutkan dan jelaskan operasi-operasi pada window!

7. Sebutkan dan jelaskan cara-cara penyajian window lebih dari satu!

8. Sebutkan dan jelaskan cara koordinasi antar window!


142

7 FORM

Overview

Berbagai macam aplikasi khususnya yang berkaitan dengan Sistem Informasi,

melakukan interaksi dengan pengguna melalui media form. Form merupakan

halaman yang terdiri dari sekumpulan isian. Form Pada komputer merupakan

bentuk transformasi dari form manual (borang). Hal mendasar dalam form

elkteronik adalah penjagaan integritas data. Berbagai macam isian user harus

diusahakan sevalid mungkin. Namun demikian tampilah form yang baik tetap

harus memperhatikan estetika dalam pembuatannya. Melalui bab ini akan

dibahas strategi pembuatan form pada aplikasi berbasis antarmuka grafis.

Tujuan

1. Siswa mengetahui desain form yang baik.

2. Siswa dapat merancang form yang baik.


Form 143

7.1 Panduan Pembuatan Form

Panduan pembuatan form, pada dasarnya merupakan penjabaran teknis

dari prinsip desain. Panduan pembuatan form berikut merupakan panduan

untuk aplikasi berbasis web, namun demikian untuk aplikasi desktop pun

panduan berikut masih relevan. Perbedaan yang timbul hanyalah pada tataran

implementasi. Misalnya pada aplikasi berbasis web, pengaturan warna lebih

dan style diimplementasikan dengan menggunakan CSS.

Berikut ini merupakan panduan dalam pembuatan form yang dapat

membantu pada saat mendesain form.

1. Sederhanakan desain form melalui pengaturan ruang dan

pengelompokkan

2. Sediakan label yang lugas pada setiap elemen dan tempatkan dengan

baik

3. Tingkatkan tampilan dengan teknologi yang mendukung

4. Cegah kesalahan dan berikan sarana recovery apabila terjadi

kesalahan.

7.2 Sederhanakan Desain Form

Untuk mendesain form yang sederhana melalui pengaturan ruang dan

pengelompokan, berikut ini merupakan hal-hal yang harus diperhatikan untuk

mewujudkannya.

Form dengan layout yang baik akan berdampak kepada kemudahan

dalam penggunaan. Sebaliknya Form yang buruk hanya akan memberikan

kebingungan dan keruwetan bagi pengguna yang pada akhirnya menjadi

pemicu kesalahan dalam pengisian form. Beberapa hal yang perlu diperhatikan

dalam membuat form yang sederhana diantaranya:

1. Berikan isian yang memang diperlukan.

2. Buat alur yang jelas dalam pengisian form.

a. Hindari bentuk multi kolom (isian yang sejajar) kecuali

benar-benar diperlukan.

b. Hindari ketidak rapihan dalam penampilan.

3. Kelompokkan item yang mirip dan urutkan sesuai logik.

a. Berikan judul untuk setiap kelompok dan berikan

perbedaan antara satu kelompok dengan kelompok yang

lain.

b. Bagi form yang panjang menjadi beberapa halaman sesuai

urutan logik.

i. Berikan progress pada tiap form , misalnya

halaman 2 dari 5, langkah 3 dari 5, dsb.


144

ii. Berikan sarana untuk mundur ke isian sebelumnya.

4. Letakkan label dekat dengan elemen isian dan hindari jarak yang

terlalu jauh.

a. Sebaiknya label rata kanan dan langsung berdampingan

elemen input

b. Label juga dapat diletakkan langsung di atas elemn input

5. Gunakan elemen form sesederhana mungkin

a. Opsi dropdown dapat meringkas sekumpulan pilihan yang

panjang pada radio button.

b. Apabila pilihan sedikit (berkisar 2 s.d. 6) maka pilihan dapat

disajikan dengan radio button agar semua pilihan dapat

segera terlihat oleh pengguna


Form 145


146

7.3 Sediakan Label yang Lugas pada Setiap Elemen

Kembali perlu ditekankan bahwa label sangat penting untuk sebuah

form. Berikut ini panduan yang berkaitan dengan label:

1. Labeli setiap elemen

2. Gunakan Asosiasi yang jelas untuk setiap elemen.

Misalnya Tanggal Lahir, disertai format penulisannnya.

3. Letakkan label pada tempat yang benar

Untuk teks dan list down, berada di kiri atau diatas elemen. Untuk

radio button dan check box berada di kanan.

4. Label harus jelas dan tidak memberikan peluang adanya ambiguitas.


Form 147

7.4 Cegah Kesalahan dan Berikan Sarana Recovery

Salah satu prindsip dasar yang harus didukung oleh antarmuka yang

baik adalah pencegahan kesalahan input oleh user. Hal-hal berikut ini dapat

dijadikan panduan untuk mengimplementasikan hal ini:

1. Berikan penekanan tentang informasi penting yang harus ada.

a. Berikan indikator melalui kata, misalnya : “Harus ada”,

“Required”.

b. Apabila isian yang harus ada jumlahnya banyak, berikan

tanda “*” dan beri keterangan arti tanda “*”

c. Berikan penjelasa yang lugas sehingga tidak ada makana

ganda. Sebagai contoh penggunaan kata „field‟. Bagi orang

yang sudah faham database, istilah filed tidak ada masalah,

namun bagi kebanyakan orang, field difahamai sebagai

tempat sapi merumput.

2. Berikan penjelasan dan instruksi singkat tetapi jelas di awal form.

Beberapa penjelasan yang dapat diberikan di awal antar lain.

a. Tujuan form


148

b. Jumlah halaman form

c. Peringatan pentingnya beberapa informasi yang harus

tersedia agar aplikasi dapat berjalan dengan baik.

d. Peringatan mengenai batasan wakatu pengisian (expired),

kemungkinan time out, dan sebagainya.

3. Pencegahan kesalahan sedini mungkin.

Pencegahan dilakukan semenjak user memasukkan data ke form.

Beberapa contoh misalnya:

a. Inputan User ID tidak mengijinkan karakter selain alfabet

dan numerik ditambah karakter titik (.), underscore (_) dan

dash (-). Ketika user mengetikkan karakter tersebut

otomatis tidak dimunculkan di inputan.

b. Inputan Nomor Pelanggan tidak mengjinkan adanya

karakter selain numerik.

c. Pemeriksaan terhadap instruksi berbahaya. Misalnya inputan

teks tertentu dapat disisipi SQL (SQL Injection) yang dapat

mengacaukan server. Contoh lainnya adalah perintah java

script yang akan mengacaukan tampilan. Apabila user

mencoba hal di atas segera dicegah dengan alert atau

warning.

4. Apabila terjadi kesalahan, berikan pesan secara jelas dan bermakna

bagi pengguna.


Form 149

Source:

- http://accessit.nda.ie/web-resources/guidance/developers/forms/dev-7.1





150

Rangkuman

1. Form yang baik bersifat sederhana namun tidak kaku

2. Pengaturan ruang (space) pada form mempengaruhi baik tidaknya form

3. Pengelompokan item dapat meningkatkan kualitas form

4. Label harus ada pada setiap elemen input pada form 5. Label harus diletakkan pada tempat yang sesuai.

6. Teknologi bahasa pemrograman dapat dipergunakan untuk

meningkatkan kualitas form

7. Form yang baik mencegah pengguna berbuat kesalahan

8. Teknologi pemrograman dapat digunakan untuk mencegah kesalahan

pengguna dalam memamsukkan data

9. Recovery kesalahan harus disediakan apabila terjadi kesalahan yang tidak

terhindarkan

10. Bahasa yang dipergunakan untuk pesan harus singkat, jelas, dan lugas.


Form 151

Kuis Benar Salah

1. Semakin kompleks suatu form semakin baik form tersebut.

2. Semakin canggih suatu form semakin sulit digunakan.

3. Informasi tinggi badan seseorang merupakan informasi yang sangat

penting pada form registrasi nasabah bank.

4. Dalam form biodata, Informasi Tempat dan Tanggal Lahir biasa

disajikan setelah informasi Pendidikan yang telah ditempuh.

5. Nama, alamat, tempat tanggal lahir merupakan informasi yang yang

dapat menjadi satu kelompok tertentu.

6. Riwayat organisasi biasa disajikan setelah informasi Riwayat

Pendidikan.

7. Label elemen tidak terlalu penting pada sebuah form.

8. Asal propinsi seseorang, sebaiknya disajikan dalam pilihan radio

button.

9. Pada survey kesenangan terhadap 10 jenis olah raga, bentuk check

box bukan pilihan yang tepat karena opsi sudah lebih dari 7. 10. Pencegahan kesalahan senantiasa merepotkan user karena terlalu

banyak aturan.


152

Pilihan Ganda

1.

Form di atas __________

A. Baik karena rapih

B. Buruk karena tidak ada informasi yang mana yang wajib diisi

C. Baik karena terurut logik

D. Buruk karena label diletakkan bukan pada tempat yang tepat

E. Baik karena jarak antara elemen input dengan tabel tidak terlalu jauh

2.

Isian yang berkaitan dengan tempat menempuh pendidikan dari

tingkat dasar sampai tinggi dikategorikan dengan nama

A. Riwayat Sekolah D. Riwayat Pelatihan

B. Riwayat Pendidikan E. Riwayat Gelar

C. Riwayat Kuliah

3.

Beriktut ini yang BUKAN merupakan data umum pribadi adalah

A. Nama D. Jenis Kelamin

B. Alamat E. Indeks Prestasi

C. No. Telepon

4.

Berikut ini yang dapat dimasukkan pada inputan nama secara umum

adalah

A asa D. *agus

B @gus E. Vera+Riandari

C Dela1977

Form 153

5.

Perpindahan dari isian satu field ke isian field berikutnya, secara

umum dapat digunakan key ____

A [Alt] D [Tab]

B [Alt]+[enter] E [Alt]+[Tab]

C [Enter]

6 Apabila form telah selesai diisi, maka untuk mensubmit-nya secara

umum dapat digunakan key _____

A [Alt] D [Tab]

B [Alt]+[enter] E [Alt]+[Tab]

C [Enter]

7

Isian Form reply berikut yang dapat mengganggu tampilan adalah

A OK, pendapatmu Bagus Jo! D Bagus Banget...

B Lihat nih 

8 Apabila terjadi kesalahan inputan oleh user maka sitem harus ______

A Berhenti D Memarahi user

B Menggantung (nge-hang) E Shut down

C Recovery

9

Gangguan keamanan pada form berupa peritnah – perintah SQL

melalui Form disebut ______

A Worm D SQL Injection

B Virus E SQL Programming

C DOS

10 Form yang baik pasti ______

A Nyaman digunakan D Lebar

B Terdapat baraneka warna E Penuh multimedia

C Terdapat baraneka macam font


154

Latihan

1. Apa yang dimakasud dengan form?

2. Apa fungsi label pada form? 3. Bagaimana pengelompokan item dalam form?

4. Bagaimana cara mencegah pengguna berbuat kesalahan?

5. Apa yang harus dilakukan sistem jika pengguna memasukkan data yang

tidak dikehendaki?


Help and Guide 155

8 HELP AND GUIDE

Overview

Salah satu hal penting dalam kualitas antarmuka adalah sedikitnya waktu untuk

pembelajaran terhadap aplikasi baru (Time of learning). Untuk memulai aplikasi

user dapat melakukan coba-coba atau dengan melihat panduan aplikasi.

Melalui bab ini akan dibahas pembangunan panduan untuk pengguna baik yang

berbasis teks maupun video.

Tujuan

1. Siswa memahami pentingnya mempersingkat waktu pembelajaran.

2. Siswa dapat merancang panduan yang baik berbasis teks maupun

audio video.


156

8.1 Help and Guide tidak penting?

Sebuah aplikasi yang masih baru tidak dapat secara langsung

dipergunakan oleh pengguna. Sebelum pengguna menggunakan apikasi

tersebut diperlukan proses belajar. Semakin sedikit waktu pembelajran

semakin baik.

Dalam proyek perangkat lunak, waktu belajar menjadi penting, karena

waktu belajar yang lama hanya memboroskan waktu dan biaya. Untuk itu

berbagai macam panduan diperlukan untuk menekan waktu belajar pengguna

Sayangnya, ada kecenderungan bahwa pengguna malas membuka

dokumen panduan. Sebagian besar lebih memilih coba-coba dan apabila

menemui kesulitan barulah membuka dokumen panduan.

Ada beberapa faktor yang membuat pengguna enggan mempergunakan

dokumen Help and Guide, diantaranya sebagai berikut.

1. Panduan yang dibuat memiliki tampilan yang tidak menarik.

2. Panduan yang dibuat terlalu komplek, padahal pengguna hanya

menginginkan satu atau beberapa fitur saja.

3. Ego pengguna, diamana pengguna cenderung merasa sok tahu

terhadap suatu aplikasi.

8.2 Model Help and Guide

Help and Guide yang berkembang saat ini dapat dikategorikan kedalam

beberapa model. Umumnya model tersebut tidak berdiri sendiri, boleh jadi

suatu model merupakan gabungan dari model yang lain. Model tersebut

diantarnya sebagai berikut.

1. Plain Text

Model ini biasa terdapat pada paket instalasi, dimana diasumsikan

aplikasi lain (penampil dokumen) belum terinstall. Bebragai

macam nama sering digunakan untuk model ini antara lain

o README.TXT

o README.FIRST

o INSTALL.TXT

Model ini merupakan model yang paling sederhana yang terdiri

dari dari palin text. Tips untuk model ini.

o Buatlah sesingkat mungkin

o Informasika hal-hal yang sangat penting saja, misalnya syarat-

syarat apa saja yang harus ada sebelum instalasi dan ritual

apa saja yang harus dijalani selama instalasi berlangusng.

o Letakkan pada tempat yang mudah dijangkau oleh pengguna,

misalkan pada driektori induk


Help and Guide 157

o Tetap memperhatikan layout tampilan.

Walaupun dibangun dari text editor yang sangat

sederhana (bahkan primitif) tetap harus diperhatikan

layout panduan teresbut, misalnya dengan tidak

membiarkan teks memanjang kekanan.


158

2. Frequently Asked Question (FAQ)

Model ini merupakan panduan yang didasarkan pada permasalahan

yang sering dijumpai oleh pengguna. Model ini berupa daftar

berbagai macam pertanyaan beserta jawabannya. Model ini sering

pula berbentuk sebagai Trobuble Shooting Guide, dimana isinya

adalah penyelesaian terhadap masalah-masalah selama penggunaan

aplikasi.


Help and Guide 159

3. Document Guide

Dokumen model ini biasanya berupa dokumen yang lebih resmi

dan memiliki layout yang jauh lebih baik. Berbagai macam ilustrasi

warna, font, gambar, dan citra sangat dominan dalam dokumen ini.

Dokumen jenis ini ada ada yang melekat pada aplikasi dan ada yang

terpisah. Panduan yang melekat pada aplikasi dapat langsung di

akses dengan memilih menu Help.


160

Panduan lain yang sekarang berkembang adalah dokumen .chm


Help and Guide 161

Model chm merupakan model yang cukup baik menggambarkan

struktur panduan. Model ini juga di adopsi menjadi model e-book

seperti pada gambat di atas.

4. Audio Video Help

Model ini merupakan model yang memadukan pengolahan grafis

dan audio video, sehingga user cukup melihat „file‟ mengenai

aplikasi yang diajarkan. Model ini sangat tepat untuk dikempangkan

pada training training. Model ini juga merupakan model panduan

modern dimana kapasitas bandwtih dan memori bukanlah halangan

utama.

Bebagai macam tools berkembang untuk memperagakan

penggunaan aplikasi secara langsung dari rekaman layar monitor

(misalnya screencam, screen recorder, camsatasia, dal sebagainya),

hingga pengolahan visualisasi tiga dimensi secara dinamis (misalnya

flash).


162

Rangkuman

1. Tampilan panduan yang tidak menarik dapat menyebabkan user tidak

mengindahkan panduan yang diberikan

2. Paduan yang terlalu komplek dapat menyebabkan user lebih memilih

mencoba coba sendiri suatu aplikasi yang baru 3. Pengguna cenderung merasa sok tahu dan lebih menyukai mengeksplore

terlebih dahulu daripada membaca panduan terlebih dahulu.

4. Panduan dalam bentuk plain text harus dibuat seringkas mungkin

5. Panduan dalam bentuk plain text hanya digunakan di awal sebelum

instalasi dan memuat hal-hal yang penting saja.

6. Panduan dalam bentuk plain text tetap harus memperhatikan layout

tampilan.

7. FAQ merupakan sekumpulan pertanyaan dan jawaban yang seringkali

diajukan oleh pengguna

8. Trouble shooting dapat disajikan sebagai bentuk panduan FAQ.

9. Document guide memanfaatkan teknologi pengolah kata dan penampil

dokumen untuk dapat menyajikan layotu yang baik melalui penataan

warna, font, ruang, gambar,dan citra.

10. Panduan berbentuk audio video merupakan panduan yang paling mutahir

dan dapat memvisualisasi secara langsung kasus-kasus yang hendak

diajarkan.


Help and Guide 163

Kuis Benar Salah

1. Panduan berbentuk plain text sudah kuno dan sudah tidak digunakan lagi.

2. Panduan berbentuk plain text tidak perlu memperhatikan layout tampilan

3. Panduan berbentuk palin text biasanya panjang dan rinci dalam

menjelaskan hal tertentu.

4. Panduan berbentuk plain text perlu disertakan warna dan gambar.

5. Panduan dalam bentuk video memerlukan spesifikasi yang sama dengan

panduan lainnya.

6. Panduan berbentuk .CHM terdiri dari tiga buah window.

7. Panduan berbentuk .chm dapat memuat gambar dan citra.

8. Panduan dokumen dapat dilihat langsung dari aplikasi yang sedang

dijalankan.

9. Untuk keperluan training dan presentasi, panduan videolah paling jelas

untuk menggambarkan fungsional aplikasi.

10. E-Book dapat disajikan dengan menggunakan .chm


164

Pilihan Ganda

1.

Panduan yang paling modern adalah ______

A. Plain text D Video

B. FAQ E. Document guide

C. .CHM

2.

README.FIRST merupakan panduan jenis ________

A. Plain text D. Video


C. .CHM

3.

Trouble shooting paling tepat disajikan dalam _________



C. .CHM

4.

Pandun singkat sebelum instalasi paling tepat dibuat dalam

bentuk______



C. .CHM

5

Untuk mengisi acara training suau aplikasi keuangan pada sebuah bank,

maka panduan yang paling tepat adalah



C. .CHM


Help and Guide 165

7

Buku ajar yang tersusun dalam beberapa bab dan sub bab lebih nyaman

disajikan dalam ______

A Plain text D. Video

B FAQ E. Application Guide

C .CHM

8.

Yang menjadi ciri khas pada panduan palin text adalah

A Karakter alfabet & alfanumerik D Warna

B Gambar E Grafik

C Citra

9 Dari dokumen berikut yang tidak mendukung layout secara grafis dan

warna adalah _______


B FAQ E. Document guide

C .CHM

10

Panduan di atas termasuk jenis _____


B FAQ E. Document guide

C .CHM


166

Latihan

1. Mengapa pengguna cenderung tidak menggunakan panduan?

2. Jelaskan tentang panduan berbentuk Plain text!

3. Jelaskan tentang panduan berbentuk FAQ!

4. Jelaskan tentang panduan berbentuk Video!

5. Jelaskan tentang panduan berbentuk .CHM!


Text to Speech 167

9 TEXT TO SPEECH

Overview

Antarmuka modern telah berkembang sangat pesat. Hal ini didukung oleh

disiplin ilmu di bidang ilmu komputer khususnya pengolahan bahasa alami.

Salah satu teknologi pada pengolahan bahasa alami adalah Text To Speech.

Melalui bab ini akan dibahas prinsip kerja Text To Speech dan bagaimana

membuat aplikasi Text To Speech secara sederhana.

Tujuan

1. Siswa memahami prinsip kerja Text To Speech.

2. Siswa dapat merancang aplikasi yang menggunakan teknologi Text

To Speech.

3. Siswa dapat mengimplentasikan aplikasi yang memiliki fitur Text To

Speech.


168

9.1 Sejarah

Perkembangan teknologi untuk membuat ucapan manusia atau yang

sering disebut sebagai teknologi pensitesa ucapan, telah mengalami perbaikan

dari masa ke masa. Perkembangan ini dapat dibagi menjadi tiga generasi.

Generasi pertama adalah sebelum tahun 1930. Pada masa ini penelitian-

penelitian lebih banyak ditujukan untuk memahami karakteristik sinyal ucapan

serta pengembangan pensintesa ucapan berbasis mekanik atau

elektromekanik. Geenerasi kedia dimulai sejak tahun 1930-an sampai dengan

ditemukannya komputer digital. Masa ini ditandai dengan pengembangan

berbagai alat pensintesa ucapan menggunakan teknologi elektronik analog.

Generasi ketiga dimulai sejak ditemukannya komputer digital hingga sekarang.

Pada masa ini, sintesa ucapan dilakukan menggunakan pendekatan-pendekatan

pemrosesan sinyal digital.

Generasi Pertama

Penelitian tentang ucapan dimulai dengan penelitian-penelitian untuk

melakukan pemahaman tentang sinyal ucapan. Berikut ini perkembagannya.

Tahun 1779: Imperial Academy of St. Petersburg menyelenggarakan suatu

kompetisi dengan tujuan untuk mengetahui hal-hal berikut.

1. “What is the nature and character of the sounds of the vowels a,

e, i, o, u that make them different from one another?” 2. “Can an instrument be constructed like the vox humana pipes of

an organ, which shall accurate express the sounds of the vowels?”

Seorang peneliti dari Rusia yang bernama Christian Gottlieb

Kratzenstein memenangkan kompetisi tersebut dengan membuat satu set

resonator akustik yang mensimulasikan mulut manusia. Resonator

Kratzenstein terdiri dari 5 bentuk tabung, masing-masing untuk

mensimulasikan satu bunyi vokal.

Resonator Kratzenstein

Tahun 1892: Robert Willis mengubah sintesa Kratzenstein menjadi sebuah

tabung tunggal yang dapat diatur panjangnya.


Text to Speech 169

Tahun 1791: Wolfgang von Kempelen membuat pensintesa ucpan dengan

menggunakan cara kerja seperti hembusan paru-paru, sebagaimana yang

terjadi pada manusia.

Gambar 2. Model Kedua Pensintesa Ucapan Buatan Wolfgang von Kempelen

Di Perancis, pada waktu yang hampir bersamaan dengan von

Kempelen, Abbe‟ Mical mengembangkan mesin lain yang dikenal sebagai “two

talking head”.

Hermann Helmholtz, seorang perintis peneliti akustik, pada

pertengahan abad ke-19 membuat perangkat elektro-mekanik yang terdiri

dari sejumlah garpu yang dapat ditala, kumparan elektrik, dan sejumlah resonator yang dapat mensintesa suara komposit yang sangat mirip suara

vokal manusia. Perangkat ini mungkin tidak memperlihatkan hubungan

langsung dengan berbagai penemuan alat-alat lainnya yang berhubungan

dengan aplikasi suara, tetapi keberadaan mesin tersebut memberikan ilham

bagi Alexander Graham Bell yang menghasilkan beberapa penemuan di bidang

aplikasi mesin yang berhubungan dengan suara manusia.


170

Tahun 1835, Wheatstone mendemonstrasikan mesin pensintesa

ucapan ciptaannya kepada Dublin Association.

Gambar 4. Versi Wheatstone dari Model Ketiga Pensintesa Ucapan

Buatan Wolfgang von Kempelen [Pel93]

Tahun 1863: Alexander Graham Bell dan dua saudaranya (Melly dan Ted)

pernah melakukan pengembangan mesin yang dapat menirukan ucapanucapan

manusia. Namun pada akhirnya Bell justru menemukan telepon.

Generasi Kedua

Tahun 1930: para peneliti mulai menggunakan model elektrik untuk analisis

dan menirukan ucapan uaitu VODER. Gambar 6 memperlihatkan blok

diagram VODER serta ekivalensinya dengan alat-alat ucap manusia. Suara

bersumber dari dua buah sumber bunyi, yaitu : noise dan osilator. Sumber

noise disediakan untuk mensintesa ucapan yang menyerupai noise, sedangkan

osilator untuk ucapan lainnya. Frekuensi osilator dikendalikan oleh pedal.

Frekuensi yang dihasilkan akan menentukan pitch dari bagian ucapan yang

dihasilkan. Sumber yang dihasilkan akan dilewatkan pada sepuluh bandpass

filter yang dihubungkan secara paralel dan masing-masing frekuensinya dapat

diatur. Tiga pengatur lainnya disediakan untuk mengatur proses transien, yaitu

untuk reproduksi konsonan stop, yaitu t, d, p, b, k, g.


Text to Speech 171

Generasi Ketiga

Tahun 1960-an: Teknik analisis dan sintesa ucapan terbagi menjadi dua

paradigma. Pendekatan pertama disebut articulatory synthesis. Dalam

pendekatan ini, mekanisme produksi ucapan dimodelkan secara fisiologi

dengan cukup rinci. Pendekatan kedua adalah terminal-analogue synthesis.

Pada pendekatan kedua ini, ucapan dimodelkan dengan model apapun.


172

Orientasinya lebih ditekankan pada usaha untuk memodelkan sinyal ucapan,

bukan pada bagaimana cara membangkitkannya.

Tahu 1990: Dennis Klatt pada mengembangkan Synthesizer bebasis komputer

digital yang sudah dirancang oleh Klatt pada seja tahun 1980.

9.2 Text To Speech

Text To Speech (TTS) adalah suatu sistem yang dapat mengubah teks

atau bahasa tulisan dalam suatu bahasa menjadi ucapan atau bahasa lisan

dalam bahasa yang sama[3]. Prinsip Sistem TTS dapat dibagi menjadi dua

yaitu:

Konverter Teks ke Fonem (Text to Phoneme) Konverter Teks ke Fonem berfungsi mengubah kalimat masukan dalam

suatu bahasa tertentu yang berbentuk teks menjadi rangkaian kode-kode

bunyi yang biasanya direpresentasikan dengan kode fonem, durasi serta

pitch-nya. Bagian ini bersifat sangat language dependant. Untuk suatu

bahasa baru, bagian ini harus dikembangkan secara lengkap khusus untuk

bahasa tersebut.

Konverter Fonem to Ucapan (Phoneme to Speech).

Konverter Fonem ke Ucapan akan menerima masukan berupa kode-

kode fonem serta pitch dan durasi yang dihasilkan oleh bagian

sebelumnya. Berdasarkan kode-kode tersebut, bagian Konverter Fonem

ke Ucapan akan menghasilkan bunyi atau sinyal ucapan yang sesuai

dengan kalimat yang ingin diucapkan. Ada beberapa alternatif teknik yang

dapat digunakan untuk implementasi bagian ini. Dua teknik yang banyak

digunakan adalah

- formant synthesizer

Formant synthesizer bekerja berdasarkan suatu model matematis

yang akan melakukan komputasi untuk menghasilkan sinyal ucapan

yang diinginkan. Synthesizer jenis ini telah lama digunakan pada

berbagai aplikasi. Walaupun dapat menghasilkan ucapan dengan

tingkat kemudahan interpretasi yang baik, synthesizer ini tidak

dapat menghasilkan ucapan dengan tingkat kealamian yang tinggi.

- diphone concatenation

Synthesizer yang menggunakan teknik diphone concatenation

bekerja dengan cara menggabung-gabungkan segmen-segmen bunyi

yang telah direkam sebelumnya. Setiap segmen berupa diphone

(gabungan dua buah fonem). Synthesizer jenis ini dapat


Text to Speech 173

menghasilkan bunyi ucapan dengan tingkat kealamian (naturalness)

yang tinggi

9.3 Diphone Concatenation

Pembentukan ucapan pada pensintesa ucapan menggunakan metoda

diphone concatenation pada prinsipnya dilakukan dengan cara menyusun

sejumlah diphone yang bersesuaian sehingga diperoleh ucapan yang

diinginkan. Sebagai contoh, pada gambar diperlihatkan pembentukan kata atau

ucapan “komputer” yang disusun dari diphone-diphone /_k/, /ko/, /om/ dan

seterusnya.

Gambar. Pembentukan Ucapan “komputer” dari Diphone-Diphone nya

Supaya pensitesa ucapan dapat mengucapkan semua kemungkinan kata atau

kalimat yang ada dalam suatu bahasa, sehingga sistem tersebut harus didukung

oleh diphone database yang terdiri dari semua kombinasi diphone yang ada

dalam bahasa tersebut.

Diphone concatenation engine atau unit pemroses diphone akan menerima

masukan berupa daftar fonem yang ingin diucapkan, masing-masing disertai

oleh durasi pengucapannya, serta pitch atau frekuensinya. Berdasarkan daftar


174

fonem yang diterima, unit ini akan menentukan susunan diphone yang sesuai.

Selanjutnya, unit ini akan melakukan smoothing sambungan antar diphone,

melakukan manipulasi durasi pengucapan serta manipulasi pitch (lihat Gambar

di bawah). Pada akhirnya, diphone concatenation engine akan menghasilkan

sinyal ucapan yang sesuai.

Gambar. Pembentukan Ucapan “komputer” dari Diphone-Diphone nya

Sejumlah teknik untuk pemrosesan diphone telah dikembangkan oleh

berbagai pihak, diantaranya adalah autoregressive (AR), Glottal AR, hybrid

harmonic/stocastic, time domain PSOLA (TD-PSOLA), multiband

resynthesis-PSOLA (MBR-PSOLA), serta Linear Prediction-PSOLA (LP-

PSOLA) [Dut97].

Source : http://teknologibahasa.wordpress.com/2008/03/14/sintesa-ucapan-dengan-

teknik-diphone-concatenation/

9.4 TTS Bahasa Indonesia

Pada saat ini telah ada TTS bahasa Indonesia yang dikenal dengan

nama IndoTTS yang dikembangkan oleh Arry Akhmad Arman dosen

Departemen Elektro Institut Teknologi Bandung (ITB)[2].


Text to Speech 175

IndoTTS dibangun dengan teknologi diphone concatenation, yaitu

suatu teknik untuk membangkitkan ucapan dengan cara menyambung-

nyambung diphone yang direkam dari ucapan manusia. Diphone-diphone

tersebut dikumpulkan dan disimpan di dalam sebuah diphone database yang

dalam hal ini berupa diphone database bahasa Indonesia[2].

Diphone adalah dua fonem berurutan. Dari 35 fonem akan tercipta

1.296 diphone yang di dalamnya sudah termasuk diphone "silence" untuk awal

dan akhir kata. Unit terkecil bentuk tulisan adalah huruf, sedangkan unit

terkecil bentuk lisan adalah fonem. Fonem tidak identik dengan huruf,

contohnya gabungan huruf "n" dan "g" akan menjadi fonem "ng". Karena hasil

akhir TTS adalah berupa ucapan, maka yang menjadi fokus di dalam

pengembangannya adalah fonem, bukan huruf. Di dalam bahasa Indonesia,

fonem yang ada berjumlah 35 buah[2].

Setelah diphone database tersedia, maka IndoTTS siap bekerja.

Rangkaian huruf yang dimasukkan akan diubah menjadi rangkaian fonem

lengkap dengan durasi dan frekuensinya. Data-data tersebut kemudian diumpankan ke modul Mbrola, yaitu metode speech synthesizer (penyusunan

ucapan) dengan menggunakan metode diphone produk Belgia, yang kemudian

akan menyambung diphone sesuai dengan database yang disediakan serta


176

memanipulasi durasi dan frekuensinya. Akhirnya, keluarlah ucapan dari

IndoTTS yang beraksen Indonesia.

Konfigurasi sistem IndoTTS ditunjukkan pada Gambar 2.1 berikut

ini[2].

Gambar 2.1 Konfigurasi Sistem IndoTTS[2]

IndoTTS juga dapat digabungkan dengan program lain yang

berbahasa Borland Delphi, Visual Basic atau C++ dengan memanfaatkan

System Development Kit (SDK) yang tersedia sehingga menghasilkan program

aplikasi baru. Diagram pengembangannya adalah sebagai berikut[2].

Gambar 2.2 Diagram Pengembangan Aplikasi Menggunakan IndoTTS[2]


Text to Speech 177

9.5 Pemrograman Menggunakan TTS Bahasa Indonesia

Untuk membangun aplikasi yang menggunakan TTS sangatlah mudah.

Dr Ary Akhmad Arman telah membuat library yang dapa dipergunakan secara

bebas sepanjang tidak untuk komersial.

Libary Indo TTS dapat di downlad di.....

Untuk menggunakan library ini sangatlah mudah. Langkah pertama

adalah menginstall MBROLA terlebih dahulu. Installer ini dapat didownload

secara bebas di internet.

Selanjutnya saat membuat program yang menggunakan modul TTS.

Cukup memanggil library IndoTTS. Sebagai contoh pada pemrograman Delphi

cukup menambahkan deklarasai seperti pada potongan berikut.

unit Unit1;

//Unit 1 merupakan implementasi dari Form 1 pada Project1

interface

uses

Windows, Messages, SysUtils, Variants, Classes,

Graphics, Controls, Forms, Dialogs, StdCtrls,

Buttons, ITTS_DLL_Interface,

ExtCtrls, Qt;

//Nama library yang digunakan pada unit ini

type

TForm1 = class(TForm)

BitBtn1: TBitBtn;

BitBtn2: TBitBtn;

BitBtn3: TBitBtn;

BitBtn4: TBitBtn;

Memo1: TMemo;

BitBtn7: TBitBtn;

Image1: TImage;

Label1: TLabel;

//..... dan seterusnya

Pada deklarasi tersebut, program memanggil library IndoTTS dengan

menyertakan ITTS_DLL_Interface. Dengan menggunakan library ini,

pemrogram terbebas dari kerumitan pemrosesan TTS itu sendiri. Namun


178

untuk dapat memodifikasi intonasi, lama ucapan fonem, dan sebagainya

pemrogram tetap memerlukan pengetahuan bagaimana TTS dibangun dan

bagaimana sinyal ucapan direpresentasikan.

Untuk mencoba menjalankan TTS, cukup dipanggil prosedur

IndoTTS_Say().

procedure TForm1.BitBtn1Click(Sender: TObject);

{

I.S. : Button1 di klik, IndoTTS siap membacakan Teks.

Terdapat File yang siap di-load untuk mengisi Memo1

F.S. : IndoTTS membacakan teks yang berada pada Memo1

}

begin

Memo1.Visible:=True;

BitBtn7.Visible:=True;

Memo1.Lines.LoadFromFile('pol.txt');

IndoTTS_Say(PChar(Memo1.Text));

end;

Pada Prosedur di atas, parameter teks di ambil dari teks yang berada

pada Memo1. Ketika BitBtn1 diklik. Maka IndoTTS akan mulai membacakan

teks yang berada pada Memo1.

procedure TForm1.BitBtn1Enter(Sender: TObject);

{

I.S. : Button1 di aktif, IndoTTS siap membacakan Teks

F.S. : IndoTTS membacakan teks yang berada pada parameter

IndoTTS_Say.

}

begin

IndoTTS_Say('Berita Politik');

end;

Pada Prosedur di atas, parameter teks di ambil dari teks yang

diberikan secara langsung. Teks dalam parameter tersebut akan secara

langsung dibaca oleh IndoTTS dan terdapat output suara ucapan “Berita

Politik” ketika BitBtn1 aktif.


Text to Speech 179

Untuk mengehentikan pembacaan yang dilakukan oleh IndoTTS

digunakan prosedur IndoTTS_SpeakOFF().

procedure TForm1.BitBtn7Click(Sender: TObject);

{

I.S. : IndoTTS sedang aktif memabacakan Teks.

F.S. : IndoTTS menghentikan pembacaan Teks.

}

begin

IndoTTS_SpeakOFF;

end;


180

Rangkuman

1. Sejarah TTS dapat dikategorikan menjadi tiga generasi

2. Generasi pertama difokuskan kepada alat yang dapat mengahsilkan suara

manusia secara mekanik

3. Generasi pertama difokuskan kepada alat yang dapat mengahsilkan suara manusia secara elektrik

4. Generasi pertama difokuskan kepada alat yang dapat mengahsilkan suara

manusia secara digital dengan salah satu paradigma yang berkembang

adalah pemodelan sinyal ucapan

5. Text To Speech (TTS) adalah suatu sistem yang dapat mengubah teks

atau bahasa tulisan dalam suatu bahasa menjadi ucapan atau bahasa lisan

dalam bahasa yang sama.

6. Prinsip Sistem TTS dapat dibagi menjadi dua yaitu: Konverter Teks ke

Fonem dan Konverter Fonem to Ucapan

7. Konverter Teks ke Fonem berfungsi mengubah kalimat masukan dalam

suatu bahasa tertentu yang berbentuk teks menjadi rangkaian kode-kode

bunyi yang biasanya direpresentasikan dengan kode fonem, durasi serta

pitch-nya.

8. Konverter Fonem ke Ucapan akan menerima masukan berupa kode-

kode fonem serta pitch dan durasi yang dihasilkan oleh bagian

sebelumnya.

9. Formant synthesizer bekerja berdasarkan suatu model matematis yang

akan melakukan komputasi untuk menghasilkan sinyal ucapan yang

diinginkan.

10. Synthesizer yang menggunakan teknik diphone concatenation bekerja

dengan cara menggabung-gabungkan segmen-segmen bunyi yang telah

direkam sebelumnya.


Text to Speech 181

Kuis Benar Salah

1. Pekembangan pensintesa ucapan sudah berkembang sejak ratusan tahun

silam.

2. Pengolahan sintesa ucapan secara digital sudah berkembang sejak tahun

1779.

3. Resonator Kratzenstein merupaka pensintesa ucapan yang pertama.

4. Resonator Kratzenstein diperkenalkan pada perlombaan di Imperial

Academy of St. Petersburg.

5. Voder merupapakan pensintesa ucapan pada generasi kedua.

6. Pada articulatory synthesis, mekanisme produksi ucapan dimodelkan

secara fisiologi dengan cukup rinci.

7. Pada terminal-analogue synthesis, ucapan dimodelkan dengan model

apapun.

8. Dennis Klatt memperkenalkan pensintesa ucapan berbasis digital.

9. TTS bahasa indonesia menggunakan diphone database Belgia

10. Diphone database bahasa Indoensia dibuat pertama kali oleh Arry Akhmad Arman.


182

Pilihan Ganda

1.

Perkembangan pensintesa ucapan pertama kali dimulai dari penemuan

________

A. Arry Akhmad Arman D.

Wolfgang von Kempelen

B. Alexander Graham Bell E. Kratzenstein

C. Dennis Klatt

2.

Berikut ini adalah model pensintesa ucapan dari ______

A. Hermann Helmholtz D. Wolfgang von Kempelen


C. Dennis Klatt

3.



Text to Speech 183



C. Dennis Klatt

4.




C. Dennis Klatt

5.



184

A.

Hermann Helmholtz D.

Wolfgang von

B. Alexander Graham Bell Kempelen

C. Dennis Klatt E. Kratzenstein

6

Text To Speech dengan diphone database Bahasa Indonesia pertama kali

dikembangkan oleh _____

A. Arry Akhmad Arman D. Wolfgang von

B. Alexander Graham Bell Kempelen

C. Dennis Klatt E. Kratzenstein

7.

1. Konverter Teks ke Fonem berfungsi mengubah kalimat masukan

dalam suatu bahasa tertentu yang berbentuk teks menjadi

rangkaian kode-kode bunyi yang biasanya direpresentasikan

dengan kode fonem, durasi serta pitch-nya.

2. Konverter Fonem ke Ucapan akan menerima masukan berupa

kode-kode fonem serta pitch dan durasi yang dihasilkan oleh

bagian sebelumnya.

3. Formant synthesizer bekerja berdasarkan suatu model

matematis yang akan melakukan komputasi untuk menghasilkan

sinyal ucapan yang diinginkan.

4. Synthesizer yang menggunakan teknik diphone concatenation

bekerja dengan cara menggabung-gabungkan segmen-segmen

bunyi yang telah direkam sebelumnya.

Pernyataan yang benar tentang konsep TTS adalah ______


Text to Speech 185

A 1,2,3 D. 4

B 1,3 E. 1,2,3,4

C 2,4

8.

Untuk mereprenstasikan kode fonem frase “kancingnya lepas” seperti

pada kalimat “Kancingnya lepas satu buah” adalah ____

A k/a/n/c/i/n/g/n/y/a/_/l/e/p/a/s

B k/a/n/c/i/ng/ny/a/_/l/e/p/a/s

C k/V/n/tS/i/N/nY/a/_/l/@/p/V/s

D k/V/n/tS/i/N/nY/a/_/l/e/p/V/s

E k/V/n/tS/i/nG/nY/a/_/l/@/p/V/s

9 Untuk membacakan teks pada IndoTTS digunakan perintah _____

A IndoTTSSay() D IndoTTS_Speak()

B IndoTTS_Begin() E IndoTTS_Say()

C IndoTTS_Start()

10

Untuk menghentikan pembacaan teks pada IndoTTS digunakan perintah

______

A IndoTTS_Stop D IndoTTS_SpeakOFF

B IndoTTS_Silent E IndoTTS_SpeakStop

C IndoTTS_Off


186

Latihan

1. Jelaskan dengan singkat sejarah perkembangan pensintesa ucapan?

2. Apa yang dimaksud dengan Fonem?

3. Apa yang dimaksud dengan Konverter Teks ke Fonem?

4. Apa yang dimaksud dengan Konverter Fonem to Ucapan?

5. Apa yang dimaksud dengan formant synthesizer?

6. Apa yang dimaksud dengan diphone concatenation?

7. Siapakah yang mengembangkan IndoTTS pertama kali?

8. Jelaskan cara kerja Indo TTS!

9. Representasikan teks berikut menjadi kedalam fonem!

a. Penjelasannya sangat menyebalkan

b. Cara mereduksi persamaan linier

c. Bunganya memerah disiang hari

10. Sebutkan fungsi-fungsi dasar yang dapt dipanggil dari IndoTTS dan

jelaskan fungsinya!


Text to Speech 187

Project

Buatlah sebuah aplikasi yang memanfaatkan IndoTTS. Delivery dari project ini

adalah:

1. sebuah CD yang berisi

a. Program executable

b. Laporan Project yang berkaitan dengan :

i. Pendahuluan

Latar Belakang

Rumusan Masalah

Tujuan

Batasan Masalah

Sistematika Penulisan

Jadwal Pengerjaan dan pembagian tugas

ii. Dasar Teori

iii. Perancangan

iv. Implementasi

v. Pengujian

vi. Kesimpulan

c. Panduan berupa:

i. Plaint text

ii. Document Guide

iii. Video Guide

iv. FAQ

d. Slide Presentation

2. Presentasi / sidang di kelas

Ketentuan Tugas:

1. Dikerjakan berkelompok, maksimal 4 orang

2. Peran serta/pemahaman anggota menentukan nilai individu.

3. Tidak Boleh terlambat, pada saat deadline harus dikumpulkan

sedapatnya. Apabila tidak mengumpulkan nilai project otomatis

NOL!


188

10 Speech Recognition

Overview

Voice Recognition merupakan model interaksi yang relatif masih sangat baru.

Berbagai riset masih terbuka lebar untuk mempebaiki model interaksi ini.

Melalui bab ini akan dibahas salah satu cabang dari Voice Recognition yaitu

Speech Recogniton.

Tujuan

1. Siswa memahami cara kerja Speech Recognition.

2. Siswa dapat merancang dan membangun aplikasi yang menggunakan

interaksi Speech Recogniton.


Speech Recognition 189

10.1 Voice Recognition dan Speech Recognition

Biometrik, termasuk di dalamnya speech recognition, secara umum

digunakan untuk identifikasi dan verifikasi. Identifikasi ialah mengenali identitas

seseorang, dilakukan perbandingan kecocokan antara data biometric

seseorang dalam database berisi record karakter seseorang. Sedangkan

verifikasi adalah menentukan apakah seseorang sesuai dengan apa yang

dikatakan terhadap dirinya. Biometric recognition merupakan sistem

pengenalan atau identifikasi seseorang berdasarkan karakteristik biologis

khusus yang dimiliki oleh orang tersebut. Fungsinya selain untuk sistem

keamanan dengan mengenali identitas seseorang, juga untuk identifikasi

penyakit yang diderita seseorang, keperluan militer, dan lain-lain. Aplikasi

biometric recognition antara lain retinal scan (identifikasi berdasarkan pola

pembuluh darah pada retina mata), fingerprint recognition (identifikasi pola

sidik jari unik pada setiap orang), face recognition (pengenalan seseorang

berdasarkan raut dan ekspresi seseorang dengan kunci utama pada letak mata

dan mulut), dan voice recognition.

Speech recognition adalah proses identifikasi suara berdasarkan kata

yang diucapkan. Parameter yang dibandingkan ialah tingkat penekanan suara

yang kemudian akan dicocokkan dengan template database yang tersedia.

Sedangkan sistem pengenalan suara berdasarkan orang yang berbicara

dinamakan speaker recognition. Pada pembahasan selanjutnya akan

difokuskan kepada speech recogntion dimana komputer diminta untuk mengenali isi ucapan dari pengguna. Selain itu speech recognition memiliki

kompleksitas algoritma yang lebih sederhana daripada speaker recognition.

Voice Recognition secara harfiah dapat diartikan sebagai pengenalan

suara. Secara istilah terdapat beberapa pengertian lain dari berbagai sumber

diantararnya:

1. http://www.hitl.washington.edu/scivw/EVE/IV.Definitions.html

The technology by which sounds, words or phrases spoken by humans are

converted into electrical signals, and these signals are transformed into coding

patterns that can be identified by a computer. Based on this identification, the

computer usually takes some action.

2. www.phonedog.com/cell-phone-buying-guide/glossary-of-cellular-

terms.aspx

Is a technology that makes your wireless device or computers capable of being

activated and controlled by voice commands.

http://www.hitl.washington.edu/scivw/EVE/IV.Definitions.html


190

3. http://searchcrm.techtarget.com/sDefinition/0,,sid11_gci213318,00.html

Voice or speech recognition is the ability of a machine or program to receive

and interpret dictation, or to understand and carry out spoken commands.

Sebagai ilustrasi mengenai voice recogntion, misalkan terdapat dua

orang yaitu orang A dan orang B, keduanya sama-sama mengucapkan

“Selamat Pagi”. Pada Speech Recogniton komputer cukup diminta mengenali

bahwa suar yang dimasukkan adalah “Selamat Pagi”. Namun Pada Speaker

Recogniton, komputer tidak cukup hanya mengenali suara “Selamat Pagi”,

namun lebih jauh ia harus mampu membedeakan yang mana suara orang A

dan yang mana suara orang B.

10.2 Skema Utama Speech Recognition

Skema Utama Speech Recognition dapat digambar sebagai berikut.



Pada Speech Recognition terdapat empat tahapan utama yaitu:

1. Penerimaan data input

2. Ekstraksi yaitu penyimpanan data masukan sekaligus pembuatan

database template

3. Pembandingan/pencocokan, yaitu tahap pencocokan data baru

dengan data suara pada template.

4. Validasi suara pengguna.

10.3 Proses Pencocokan Pola Suara

Secara umum speech recogntion mengolah data secara digital. Suara

aseli merupakan sinyal analog. Sebelum diolah suara ini harus diubah menjadi

sinyal digital melalui teknik sampling.

Dari sinyal diatas dilakukan sampling sehingga menjadi sinyal sebagai

berikut.


192

Sinyal hasi representasi ini yang menjadi dasar dalam perbandingan.

Sinyal hasil pengolahan suara dari pengguna dibandingkan dengan databse

sinyal yang sudah ada sebelumnya.

Pembandingan sinya ini sangat rumit dan membutuhkan alogoritma

yang komplek mengingat sinyal yang diperbandingkan jumlahnya sangat banyak

dan perlu diperthatikan jarak sampling dan intonasi suatu ucapan.

Beberapa faktor dapat menyebabkan kesalahan dalam proses

pencocokan ini antara lain:

1. Kesalahan dalam pengucapan (misspoken) dan pembacaan

(misread) frasa

2. Keadaan emosional yang ekstrim (misalnya stress, sedang

marah, sedang sedih)

3. Pergantian penempatan microphone (intrasession atau

intersession)

4. Kekurangan atau ketidak-konsistenan akustik dari ruangan

(misalnya multipath dan noise)

5. channel mismatch (misalnya penggunaan microphone yang

berbeda dalam perekaman dan verifikasi)

6. Sakit (misalnya flu yang dapat merubah vocal tract)

7. Penuaan / aging (model vocal tract dapat berubah berdasarkan

usia)

10.4 Aplikasi berbasis Speech Recogniton

Saat ini telah banyak vendor-vendor yang menawarkan aplikasi yang

menggunakan teknolog Speech Recognition. Bahkan Microsoft Windows

(pada XP dan Vista) telah dilengkapi fitur ini. Tentu saja fitur ini belumlah

sempurna apalagi jika digunakan dalam bahasa Indonesia.

Berbagai aplikasi freeware pun sudah banyak tersedia di internet.

Dengan aplikasi freeware inipun, seseorang dapat membuat aplikasi speech

recognition sederhana yang mampu merperlihatkan keunggulan penggunaan

Speech Recogntion. Sebagai contoh, perintah pada game yang menekan

tombol panah atas sebagai perintah untuk menembak, dapat diganti dengan

perintah “Tembak!” ke komputer. Tentu saja, sebelumnya harus ada training

untuk memperkenalkan ucapan “Tembak” tersebut. Dengan training kualitas

pengenalan suara dapat ditingkatkan. Semakin banyak latihan, semakin baik

kemampuan pengenalan suaranya.



Rangkuman

1. Voice Recognition merupakan model interaksi yang relatif masih sangat

baru dibanding meodel interakasi lain yang telah ada.

2. Biometrik, termasuk di dalamnya speech recognition, secara umum

digunakan untuk identifikasi dan verifikasi. 3. Speech recognition adalah proses identifikasi suara berdasarkan kata

yang diucapkan.

4. Pada Speaker Recogniton, komputer tidak cukup hanya mengenali suara

namun lebih jauh ia harus mampu mengenali siapa yang mengucapkan

suatu kata.

5. Secara umum speech recogntion mengolah data secara digital.

6. Suara aseli merupakan sinyal analog.

7. Data dari sinyal analog dikonversi menjadi sinyal digital dilakukan melalui

proses sampling

8. Terdapat beberapa faktor yang dapat mempengaruhi kegagalan

pengenlan suara pada Speech Recognition.

9. Untuk dapat meningkatkan kualitas pengengenalan suara pada Speech

Recogntion diperlukan training.

10. Berbagai aplikasi Speech Recogntion freeware sudah banyak tersedia di

internet dan dapat digunakan untuk membuat program sederhana.


194

Kuis Benar Salah

1. Voice Recoginiton termasuk bagian dari Biometrik

2. Voice Recognition lebih luas dari Speech Recognition

3. Speaker Recognition lebih mudah diimplementasikan dibanding Speech

Recogniton.

4. Speech recognition adalah proses identifikasi suara berdasarkan kata yang

diucapkan.

5. Suara manusia merupakan sinyal analog.

6. Suara manusia disimpan dalam komputer secara analog.

7. Suara manusia disimpan dalam komputer telah mengalamai perubahan

sinyal.

8. Proses Sampling mengubah sinyal digital menjadi sinyal analog.

9. Speech recogntion merupakan teknologi modern dan belum ada versi

freewarenya.

10. Pola suara seseorang senantiasa tetap setiap saat.



Pilihan Ganda

1.

Berikut ini yang tidak termasuk biomertik adalah ______

A. Suara manusia D Sidik jari

B. Password E. Retina mata

C. Rajah Tangan

2.

Pernyataan yang benar dari ketiga pernyataan berikut adalah____

1. Kesalahan dalam pengucapan (misspoken) dan pembacaan

(misread) frasa mempengaruhi keakuratan speech recognition.

2. Keadaan emosional yang ekstrim (misalnya stress, sedang marah, sedang sedih) mempengaruhi keakuratan speech recognition.

3. Pergantian penempatan microphone (intrasession atau

intersession) tidak berpengaruh pada interaksi speech

recognition.

A. 1,2,3 D. 1saja

B. 1,3 E. 2,3

C. 1,2

3.

1. Perbedaan ruangan

2. Perbedaan peralatan

3. Sakit

4. Penuaan

Dari keempat hal di atas, yang berpengaruh pada kegagalan

pengenalan suara adalah_________

A. 1,2,3 D. 4 saja

B. 1,3 E. 1,2,3,4

C. 2,4


196

4.

Sampling merupakan proses mengubah sinyal _____ ke sinyal

_____

A. Digital – Radio D. Analog – Analog

B. Digital – Analog E. Radio – Analog

C. Analog – Digital

5.

1. Speech Recognition tidak mementingkan siapa pengucap

suara

2. Speaker Recognition lebih mudah dibandung Speech

Recognition.

3. Speaker Recognition merupakan Voice Recogntion

Pernyataan yang benar dari ketiga pernyataan di atas adalah ____

A. 1,2,3 D. 2,3

B. 1,2 E. 2 saja

C. 1,3

6

1. Windows 3.1

2. Windows 95

3. Windows XP

4. Windows Vista

Operating System Windows yang mendukung Speech Recogntion

adalah _____

A. Tak satupun D. 2,3,4

B. 4 E. 1,2,3,4

C. 3,4

7

1. Pantai

2. Puncak gedung

3. Pegunungan

4. Ruang kamar dengan dinding karpet dan kapas

Pada saat merekam suara, tempat di atas yang dapat memberikan

hasil suara yang terbebas dari noise adalah _______



A Tak satupun D. 2,3,4

B 4 saja E. 1,2,3,4

C 3,4

8.

Tujuan utama Speaker Recogniton adalah _____

A Mengenali kata yang diucapkan D Pencocokan data suara

B Mengenali siapa yang berbicara E Mengubah sinyal Analog

C Menyimpan data suara ke digital

9 Yang merupakan sinyal analog adalah_______

1. Suara manusia berbicara

2. Suara Speaker dari komputer

3. Suara Burung berkicau

4. Suara kipas komputer

A 1 saja D 1,2,3,4

B 1,2 E 4 saja

C 1,2,3

10

Speech Recogntion bermanfaat untuk:

1. Menulis di text editor tanpa mengetik ke kyeboard

2. Bermain game cukup dengan perintah oral

3. Mebuka email dari jarak jauh

4. Mematikan komputer secara lisan

A 1,2,3 D 1,3,4

B 2,3,4 E 1,2,3,4

C 1,2,4


198

Latihan

1. Sebutkan contoh biometrik!

2. Apa yang dimaksud dengan Voice Recongnition?

3. Apa yang dimaksud dengan Speech Recognition?

4. Apa yang dimaksud dengan Speaker Recognition?

5. Apa yang dimaksud dengan Sampling?

6. Apa perbedaan sinyal analog dan digital?

7. Apa yang mempengaruhi kegagalan pola pengenalan suara pada Voice

Recognition?

8. Sebutkan Operating System yang support untuk voice Recogniton!

9. Sebutkan softare komersial Speech Reconition!

10. Sebutkan softare freeware Speech Reconition!



Project

Buatlah sebuah aplikasi yang memanfaatkan Speech Recogntion

(pengembangan dari yang sudah ada pada Operating System), dengan

mengintegrasikan ke game atau aplikasi lainnya. Delivery dari project ini

adalah:

1. sebuah CD yang berisi

a. Program executable

b. Laporan Project yang berkaitan dengan :

i. Pendahuluan

Latar Belakang

Rumusan Masalah

Tujuan

Batasan Masalah

Sistematika Penulisan

Jadwal Pengerjaan dan pembagian tugas

ii. Dasar Teori

iii. Perancangan

iv. Implementasi

v. Pengujian

vi. Kesimpulan

c. Panduan berupa:

i. Plainte text

ii. Document Guide

iii. Video Guide

iv. FAQ d. Slide Presentation

2. Presentasi / sidang di kelas

Ketentuan Tugas:

1. Dikerjakan berkelompok, maksimal 4 orang

2. Peran serta/pemahaman anggota menentukan nilai individu.

Tidak Boleh terlambat, pada saat deadline harus dikumpulkan sedapatnya.

Apabila tidak mengumpulkan nilai project otomatis NOL!

desain user interface.pdf

Documents