I.PENGENALAN IMK
Bidang Ilmu Interaksi Manusia dan Komputer adalah:
“Ilmu yang mempelajari bagaimana mendesain,mengevaluasi dan mengimplementasikan sistem komputer yang interaktif sehingga dapat digunakan oleh manusia dengan mudah ”
Definisi Interaksi Manusia dan Komputer :
“Sebuah hubungan antara manusia dan komputer yang mempunyai karakteristik tertentu untuk mencapai suatu tujuan tertentu dengan menjalankan sebuah sistem yang enggunakan antarmuka (interface).”
Definisi Antarmuka Manusia dan Komputer
“Media yang memungkinkan manusia berinteraksi dengan komputer untuk memberikan suatu perintah kepada komputer ”
Sebuah program aplikasi terdiri dari 2 bagian yaitu:
- Bagian Antarmuka.
- Bagian Aplikasi.
Media antarmuka manusia dan komputer terbagi menjadi 2 yaitu :
a. Media tekstual
b. Media GUI (Graphical User Interface)
a. Media Tekstual adalah “ bentuk sederhana dialog atau komunikasi antara manusia dan komputer yang hanya berisi teks dan kurang menarik “.Contoh: perintah “readln” dan “writeln” dalam Pascal.
Contoh listing program menggunakan PASCAL
Var A, B, C : integer;
Begin
write(‘Masukan bilangan pertama: ‘);
readln(A);
write(‘Masukan bilangan kedua: ‘); readln(B);
C := A * B – B;
writeln; writeln(‘Hasilnya adalah : ‘, C);
end.
/------------------------------------/
OUTPUT :
Masukan bilangan pertama: 5
Masukan bilangan kedua: 2
Hasilnya adalah : 8
b. Media GUI (Graphical ser Interface) adalah
“bentuk dialog atau komunikasi antara manusia dan komputer yang berbentuk grafis dan sangat atraktif”.
Contoh antarmuka manusia dengan komputer yang berbentuk grafis menggunakan pemrograman visual(Visual Basic, Visual Foxpro, Delphi dan lain-lain).
2. Bidang Studi
Untuk membuat media interaksi manusia dan komputer yang lebih baik maka harus mempelajari dan memahami bidang ilmu lain :
a. Teknik Elektronika dan ilmu komputer Berhubungan dengan perangkat keras untuk merancang sistem interaksi manusia dan komputer.
b. Psikologi
Memahami bagaimana pengguna dapat menggunakan sifat dan kebiasaan baiknya agar dapat menjodohkan mesin dengan manusia sehingga dapat bekerjasama.
c. Perancangan grafis dan tipografi
Memanfaatkan gambar sebagai sarana dialog yang cukup efektif antara manusia dan komputer.
d. Ergonomik
Berhubungan dengan aspek fisik untuk mendapatkan lingkungan kerja yang nyaman ketika
berinteraksi dengan komputer.
e. Antropologi
Pandangan mendalam tentang cara kerja berkelompok yang masing-masing anggotanya
diharapkan memberikan kontribusi teknologi pengetahuan sesuai dengan bidangnya masing-masing.
f. Linguistik
Bahasa merupakan sarana komunikasi yang akan mengarahkan pengguna ketika ia berinteraksi dengan komputer.
g. Sosiologi
Berkaitan dengan studi tentang pengaruh sistem manusia dengan komputer dalam struktur sosial.
misal: Dampak komputerisasi terhadap keberadaan seorang user di sebuah perusahaan.
3. Piranti (alat) Bantu Pengembang Sistem
Untuk mempercepat proses perancangan dan pengembangan antarmuka (interface) diperlukan piranti pengembangan sistem seperti pemrogaman visual (Visual Basic,Visual Foxpro, Delphi, Visual C++ dan lain-lain).
Keuntungan menggunakan piranti bantu adalah :
a. Antarmuka yang dihasilkan menjadi lebih baik
b. Program antarmukanya menjadi mudah ditulis dan lebih ekonomis dalam pemeliharaannya.
4. Pengelompokan Piranti Bantu
Berdasarkan fungsinya piranti bantu terbagi menjadi 2 yaitu :
a. Piranti bantu Aplikasi (application software)
Program yang biasa dipakai oleh pemakai untuk melakukan tugas-tugas, misalnya membuat dokumen, manipulasi photo dan membuat laporan.
b. Piranti bantu Sistem (System Software)
Program yang digunakan untuk mengontrol sumberdaya komputer seperti CPU dan hardware masukan/keluaran.
5. Strategi Pengembangan Antarmuka/interface
Beberapa hal yang harus diperhatikan :
a) Pengetahuan tentang mekanisme fungsi manusia sebagai pengguna komputer.
b) Pengetahuan tentang mekanisme fungsi manusia sebagai pengguna komputer.
c) Informasi tentang ragam dialog, struktur,isi tekstual dan grafis, tanggapan waktu,kecepatan tampilan.
d) Penggunaan prototipe yang disusun secara bersama-sama antara calon pengguna dan perancang sistem.
e) Teknik evaluasi dengan menggunakan uji coba sejumlah kasus, tanya jawab dan kuisioner.
Latihan Soal IMK
1. Media yang memungkinkan manusia berinteraksi dengan komputer untuk memberikan suatu perintah kepada komputer adalah definisi dari :
a. Program b. Aplikasi
c. Interface d. Salah Semua
2. Bagian yang berfungsi menghasilkan informasi berdasarkan pengolahan data yang sudah dimasukan oleh pengguna lewat algoritma adalah definisi dari:
a. Program b. Aplikasi
c. Interface d. Salah Semua
3. Media bentuk sederhana dialog antara manusia dan komputer yang kurang menarik karena berisi teks adalah adalah :
a. Media Gambar b. Media Tekstual
c. Media GUI d. Media Aplikasi
4. Bahasa pemrograman dibawah ini yang masih berbentuk teks hasil outputnya adalah :
a. Delphi b. Visual Basic
b. Pascal d. Visual Foxpro
5. Bidang studi yang harus diketahui pada interaksi manusia dan komputer yaitu mampu mengimplementasikan hasil rancangan kedalamprogram aplikasi adalah :
a. Ergonomik
b. Psikologi
c. Teknik Elektronika dan Ilmu Komputer
d. Antropologi
II.FAKTOR MANUSIA
Sistem Komputer terdiri atas 3(tiga) aspek yaitu :
a. Aspek Perangkat Keras (Hardware).
b. Aspek Perangkat Lunak (Software).
c. Aspek Manusia (Brainware).
Faktor manusia (brainware) dalam merancang Antarmuka adalah :
1. Penglihatan
a)Luminas
b)Kontras
c)Kecerahan
d)Sudut dan Ketajaman Penglihatan
e)Medan Penglihatan
f)Warna
2. Pendengaran
- Kebanyakan manusia mendeteksi suara dalam frekuensi 20 Hertz – 20 KHertz
- Manusia juga mendengar suara antara 50 dB (decible) – 70 dB.Telinga manusia akan rusak mendengar lebih dari 140 dB.Manusia tidak mendengar frekuensi kurang dari 20 dB
3. Sentuhan
- Sentuhan merupakan sarana manusia untuk berinteraksi.
- Sebagai contoh dalam penggunaan papan ketik (keyboard) atau tombol, maka manusia akan lebih nyaman apabila tombol atau keyboard tidak berat proses penekanannya.
4. Pemodelan Sistem Pengolahan
- Model sistem pengolahan manusia terdiri dari pengolahan perseptual, pengolahan intelektual dan pengendalian motorik yang beinteraksi dengan memori manusia.
- Model sistem komputer terdiri dari pengolah (processor) dan memori. Interaksi keduanya melalui bus
5. Pengendalian Motorik
Pengendalian motorik pada manusia dapat dilatih untuk mencapai taraf tertentu seperti mengetik 10 jari untuk kecepatan 1000 huruf permenit
Soal Latihan IMK
1. Dibawah ini adalah merupakan piranti (alat) input pada perangkat keras (hardware), kecuali :
a. Monitor b. Mouse
c. Bar Code Reader d. Scanner
2. Dibawah ini adalah merupakan piranti (alat) output pada perangkat keras (hardware) , kecuali :
a. Printer b. keyboard
c. Speaker Audio d. LCD
3. Media bentuk sederhana dialog antara manusia dan komputer yang kurang menarik karena berisi teks adalah adalah :
a. Media Gambar b. Media Tekstual
c. Media GUI d. Media Aplikasi
4. Bahasa pemrograman dibawah ini yang masih berbentuk teks hasil outputnya adalah :
a. Delphi b. Visual Basic
c. Pascal d. Visual Foxpro
5. Program yang digunakan untuk mengontrol sumber daya komputer seperti CPU dan hardware masukan/keluaran adalah :
a. Ms-Excel b. Ms-Windows
c. Ms-Access d. Pascal
III. RAGAM DIALOG
Ragam dialog (Dialoque Style) :
“Cara yang digunakan untuk mengorganisasikan berbagai tehnik dialog”
Beberapa Sifat setiap Ragam Dialog :
a. Inisiatif
b. Keluwesan
c. Kompleksitas
d. Kekuatan
e. Beban Informasi
Karakteristik Ragam Dialog
a. Konsistensi
b. Umpan balik
c. Observabilitas
d. Kontrolabilitas
e. Efisiensi
f. Keseimbangan
Kategori Ragam Dialog :
1. Ragam Dialog Interaktif
a.Dialog berbasis perintah tunggal(Command line dialogue).
b.Dialog berbasis bahasa pemrograman(Programming language dialogue).
c. Antarmuka berbasis bahasa alami(Natural language interface).
d. Sistem Menu.
e. Dialog berbasis pengisian formulir(Form filling dialogue).
f. Antarmuka Berbasis Ikon
g. Sistem Penjendelaan(windowing system)
h. Manipulasi Langsung
i. Antarmuka Berbasis Interaksi Grafis
2. Dialog berbasis perintah tunggal(Command line dialogue).
“Perintah-perintah tunggal yang dioperasikan tergantung dengan sistem operasi komputer yang dipakai “.
contoh :DOS (dir, delete, format, copy, dll)
Unix / Linux (ls, vi, who, passwd, dll)
3. Dialog berbasis bahasa pemrograman(Programming language dialogue).
“Dialog yang dikemas sejumlah perintah kedalam suatu bentuk berkas (file) berupa batch file”.
4. Antarmuka berbasis bahasa alami(Natural language interface).
“Dialog yang berisikan instruksi-instruksi dalam bahasa alami (manusia) yang diterjemahkan oleh sistem penterjemah“.
5. Sistem Menu
“Dialog yang menampilkan daftar sejumlah pilihan dalam jumlah terbatas ”
Sistem Menu terbagi menjadi 2 yaitu :
a)Sistem Menu Datar
-Selektor pilihan
-Penggunaan Tanda terang (highlight marker)
b)Sistem Menu Tarik (Pulldown)
6. Dialog berbasis pengisian formulir(Form filling dialogue).
“ Dialog dimana pengguna (user) dihadapkan kesuatu bentuk formulir dilayar komputer yang berisi sejumlah pengisian data dan opsi (option) yang telah ditentukan ”.
7. Antarmuka berbasis ikon (icon)
“ Dialog yang menggunakan simbol atau tanda untuk menunjukan suatu pilihan aktifitas tertentu”.
8. Sistem Penjendelaan
“Sistem antarmuka yang memungkinkan pengguna untuk menampilkan berbagai informasi pada satu atau lebih jendela (window) “.
Jenis-jenis jendela (window) :
a. Jendela TTY
b. Time-Multiplexed Windows
c. Space multiplex window
d. Non Homogen
9. Manipulasi Langsung
“ Penyajian langsung aktifitas kepada pengguna (user) sehingga aktifitas akan dikerjakan oleh komputer ketika pengguna memberikan instruksi langsung yang ada pada layar komputer “.
Penerapan manipulasi langsung:
a. Kontrol Proses
b. Editor Teks
c. Simulator
d. Kontrol Lalu lintas penerbangan
e. Perancangan Bentuk/model( computer aided design )
10. Antarmuka Berbasis Interaksi Grafis.
“Dialog berbentuk pesan atau informasi pada suatu gambar atau link yang tampil ketika pengguna melakukan suatu aktifitas“.
Latihan Soal IMK
1. Pada ragam dialog pengguna memberikan tanggapan atas prompt yang berikan oleh komputer untuk memasukkan perintah atau parameter perintah disebut :
a. Inisiatif b. Keluwesan
c. Kompleksitas d. Umpan Balik
2. Pada ragam dialog pengguna mempunyai kesempatan melakukan customizing dan memperluas antarmuka dari sebuah sistem untuk memenuhi kebutuhan disebut :
a. Inisiatif b. Keluwesan
c. Kompleksitas d. Umpan Balik
3. Pada ragam dialog jika pengguna melakukan kesalahan komputasi, maka program akan menampilkan suatu pesan kesalahan disebut :
a. Inisiatif b. Keluwesan
c. Kompleksitas d. Umpan Balik
4. Pada Ragam Dialog, jenis dialog yang paling konvensional adalah :
a. Programming Language Dialogue
b. Natural Language Interface
c. Form Filling Dialogue
d. Command line Dialogue
5. Beberapa perintah seperti DIR, COPY, FORMAT,PASSWD, WHO, VI, LS merupakan terdapat pada kategori ragam dialog :
a. Programming Language Dialogue
b. Natural Language Interface
c. Form Filling Dialogue
d. Command line Dialogue
IV.PRINSIP DESAIN ANTAR MUKA(INTERFACE)
1.Merefleksikan model mental user
Merefleksikan kombinasi pengalaman dunia riil,pengalaman dari software lain, dan penggunaan komputer secara umum
2.Explicit and Implied Action
a)Explicit actions adalah kondisi yang jelas dalam memberikan petunjuk untuk manipulasi suatu obyek.
b)Implied actions adalah kondisi yang hanya memberikan kesan visual untuk memanipulasi obyek.
Direct Manipulation
user mendapatkan dampaknya dengan segera setelah melakukan suatu aksi.
User Control
mengijinkan user mengontrol dan menginisialisasi aksi.
Feedback and Communication
selalu memberitahukan user apa yang terjadi dari suatu aksi.
Consistency
user dapat mentransfer pengetahuan dan kemampuan dari suatu aplikasi ke aplikasi lain.
WYSIWYG (What You See Is What You Get)
tidak ada perbedaan antara yang dilihat di layar dengan hasil outputnya.
Aesthetic Integrity
informasi diorganisasikan dengan baik dan konsisten dengan prinsip desain visual yang baik.
Mengembangkan software yang baik:
a)High Performance
b)Mudah digunakan
c)Penampilan yang baik
d)Reliability
e)Mampu beradaptasi
f)Interoperability
g)Mobility
Mengambil Keputusan Dalam Desain
• Aplikasi semakin membesar, dan menjadi semakin lambat.
• User Interface pada aplikasi semakin kompleks.
• Waktu yang diperlukan untuk mengembangkan fitur baru menjadi lebih lama.
• Dokumentasi aplikasi dan dokumen help menjadi lebih melebar.
• Resiko adanya efek pada fitur yang sudah ada.
• Meningkatkan waktu yang diperlukan untuk memvalidasi aplikasi
Mendesain Layout
Model Aplikasi
Ada 3 Model Aplikasi:
1. Berbasis Dokumen
2. Berbasis Non Dokumen
3. Utilitas
1. Layout Berbasis Dokumen
Microsoft Word 2003
Macromedia Flash MX 2004 4
2. Layout Berbasis Non Dokumen
Microsoft Outlook 2003
My SQL
MYOB
3. Layout Utilitas
Ada kecenderungan aplikasi seperti ini menekankan pula pada style disamping fitur aplikasi
Power DVD XP
Kaspersky Anti Virus
Control Center Pada Linux
LATIHAN SOAL IMK
1.Kondisi yang jelas dalam memberikan petunjuk untuk manipulasi suatu obyek pada prinsip desain interface disebut :
a.Implied actions b .Explicit actions
c. User Control d. Consistency
2.Mengijinkan user mengontrol dan menginisialisasi aksipada prinsip desain interface disebut
a. Implied actions
b. Explicit actions
c. User Control
d. Consistency
3. User dapat mentransfer pengetahuan dan kemampuan dari suatu aplikasi ke aplikasi lain pada prinsip desain interface disebut :
a. Implied actions
b. Explicit actions
c. User Control
d. Consistency
4. Tidak ada perbedaan antara yang dilihat di layar dengan hasil outputnya pada prinsip desain interface disebut :
a. Direct Manipulation
b. WYSIWYG (What You See Is What You Get)
c. Aesthetic Integrity
d. Explicit actions
5. Model yang digunakan dalam mendisain layout adalah,kecuali :
a. Berbasis Dokumen
b. Berbasis Non Dokumen
c. Utilitas
d. Non utilitas
V.PIRANTI INTERAKTIF
1. Piranti Masukan Keyboard
Tombol pada papan ketik (keyboard) dikelompokkan menjadi 4 bagian :
a. Tombol Fungsi (function key)
b. Tombol Alphanumerik (alphanumeric key)
c. Tombol Kontrol (control key)
d. Tombol Numerik (numeric key)
Jenis-jenis tata letak papan ketik (keyboard) yaitu :
a. Tata Letak QWERTY
b. Tata Letak Dvorak
c. Tata Letak Alphabetik
d. Tata Letak Klockenberg
e. Papan Ketik untuk penyingkatan kata
Dibagi menjadi 2 yaitu :
- Tata letak Palantype
- Tata letak Stenotype
f. Papan Tombol Numerik
2. Peranti Penuding dan Pengambil(Pointing and picking device)
“ Peranti interaktif yang digunakan untukmenunjuk/menuding atau menempatkan kursor pada suatu posisi dilayar tampilan dan untuk mengambil suatu item informasi untuk dipindahkan ketempat lain “.
Peranti interaktif harus memenuhi syarat yaitu
“dalam pengontrolan kursor harus ada umpan balik (feedback) yang segera nampak dilayar komputer ketika ada gerakan peranti interaktif “.
Perbandingan (ratio) kontrol/tampilan :
K/T=Gerakan tangan atau respon/Gerakan kursor
Peranti penuding dan pengambil terdiri dari :
a. Mouse
1)Mouse Mekanis
Bola yang terdapat dimouse akan menggerakan beberapa sensor ketika mouse digerakan.
2)Mouse Optic
Terdiri dari 2 LED (Light Emitting Diode) dan 2 lensa (photo-transistor) untuk medeteksi gerakan.Salah satu LED akan mengeluarkan cahaya berwarna merah dan LED yang lain mengeluarkan cahaya inframerah
b. Joystick
Gerakan kursor dikendalikan oleh gerakan tuas atau dengan tekanan pada tuas.
c. Trackball
Prinsip kerjanya sama dengan mouse, tapi berbeda dalam cara penggunaanya.
d. Pointing Stick
Prinsip kerjanya sama dengan mouse dan cara penggunaannya sama dengan trackball
e. Touch Pad
f. Touch Screen
g. Digitizing tablet / Graphics tablet
Peranti pengambil data dalam bentuk sederatan koordinat (x,y) yang menentukan gerakan pena pada media digitasi.
h. Light Pen
Prinsip kerjanya adalah memantau selisih antara waktu saat elektron mulai melakukan gerakan dan pada saat lokasi tempat pena menyala.
3. Pengambilan Gambar Terformat
Dipergunakan untuk mengambil citra terformat,bentuk dan format hurufnya sudah ditentukan.
Kategori peranti ini adalah :
a)Bar code Reader
Pola garis-garis hitam putih yang sering dijumpai pada barang-barang yang dijual di toko swalayan.
b)Magnetic Ink Character Recognation (MICR)
Digunakan untuk membaca karakter-karakter khusus yang dicetak dengan tinta khusus pula.Karakter yang telah diceak dengan tinta dimagnetisasi oleh Peranti MICR,sehingga dapat dibaca dan diterjemahkan menjadi sinyal digital
c)Optical Mark Recognation (OMR)
Peranti yang membaca tulisan pensil dan mengubahnya menjadi bentuk yang dapat dibaca oleh komputer dengan bantuan refleksi optik dengan mengenali ketebalan tulisan.
d)Optical Character Recognation (OCR)
Peranti yang dapat membaca teks dengan mengonversikannya ke dalam kode digital.Dapat mengubah teks menjadi suara,merekam naskah.
4. Pengambil Gambar tak Terformat
Dipergunakan untuk mengambil gambar atau citra yang belum memiliki format baku.
Kategori peranti ini adalah :
a)Image Scanner
Peranti yang dapat mengambil masukandata gambar, foto bahkan juga tulisan tangan.Hasilnya kemudian diubah menjadi menjadi isyarat digital.
b)Kamera digital
Mengubah citra optik ke sebuah replika film atau elektronis. Menggunakan lensa untuk membuat citra dari sebuah obyek.
c)Pembaca Retina Mata
Berfungsi membaca retina mata dan menghasilkan identitas retina mata.
5. Gerakan
Peranti yang digunakan untuk memantau gerakan manusia yang banyak dimanfaatkan pada virtual reality adalah :
a)Headset
Peranti yang dipasang di kepala, menutup mata, yang digunakan untuk menangkap dan merekam gerakan kepala, serta menayangkan berbagai macam gambar ke mata pemakai.
b)Glove
Peranti berbentuk sarung tangan yang digunakan untuk merekam jenis serta kekuatan gerakan jari dan tangan pemakai.
6. Layar Tampilan terdiri dari :
a)Pengingat digital (frame buffer)
Citra yang akan ditampilkan ke layar disimpan sebagai matrix nilai elemennya menunjukkan intensitas dari citra grafis yang akan ditampilkan.
b)Pengendali tampilan (display controller)
Berfungsi untuk melewatkan isi pengingat digital dan mengolahnya untuk di tampilkan kelayar.
Gambar monitor
- Pada pengingat digital (frame buffer), citra grafis ditampilkan sebagai pola bit.
- Dengan mengolah pola bit menjadi pixel.Untuk gambar hitam-putih, warna hitam menggunakan bit 1 dan warna putih menggunakan bit 0.
7. Pengolah Tampilan (display processor)
Bagian yang mengubah pola bit dari pengingat digital menjadi tegangan analog, yang selanjutnya akan membangkitkan elektron yang digunakan untuk menembak fosfor pada layar tampilan.
Jenis adapter atau pengolah tampilan yang digunakan pada komputer adalah :
- MDA (Momochrome Display Adapter)
- CGA (Color Graphics Adapter)
- VGA (Video Graphics Array)
- SVGA (Super Video Graphics Array).
8. Tipe Layar Tampilan
Beberapa jenis tipe layar tampilan :
a. Direct-drive Monochrome Monitor
b. Composite Monochrome Monitor
c. Composite Color Monitor
d. Red-Green-Blue Monitor
e. Variable Frequency
Latihan Soal IMK
1.Gambar dibawah ini adalah jenis keyboard :
a. Keyboard Dvorak
b. Keyboard QWERTY
c. Keyboard alphabetik
d. Keyboard klockenberg
2. Gambar dibawah ini adalah jenis keyboard :
a. Keyboard Dvorak
b. Keyboard QWERTY
c. Keyboard alphabetik
d. Keyboard klockenberg
3. Dibawah ini adalah jenis Piranti perangkat keras pengambilan gambar terformat, kecuali :
a. Bar Code Reader
b. Image Scanner
c. Magnetic Ink Character Recognation (MICR)
d. Optical Mark Recognation (OMR)
4. Dibawah ini yang merupakan jenis Piranti perangkat keras pengambilan gambar tidak terformat adalah :
a. Bar Code Reader
b. Image Scanner
c. Magnetic Ink Character Recognation (MICR)
d. Optical Mark Recognation (OMR)
5. Yang termasuk kelompok dalam tombol pada papan ketik adalah, kecuali :
a. Tombol Fungsi b. Tombol Alphanumerik
c. Tombol Kontrol d. Tombol Alphabet
VI.DESAIN INTERFACE(PERANCANGAN TAMPILAN)
1. Cara Pendekatan
Terdapat 2 pendekatan dalam merancang tampilan yaitu :
a. User centered design approach.
b. User design approach.
2. Prinsip dan Petunjuk Perancangan
a. Urutan Perancangan
1)Pemilihan ragam dialog
2)Perancangan struktur dialog
3)Perancangan format pesan
4)Perancangan penanganan kesalahan
5)Perancangan struktur data
b. Perancangan tampilan berbasis teks
1)Urutan penyajian
2)Kelonggaran
3)Pengelompokan
4)Relevansi
5)Konsistensi
6)Kesederhanaan
c. Perancangan tampilan berbasis Grafis
Terdapat 5 faktor yang diperlukan yaitu :
1)Ilusi pada obyek-obyek.
2)Urutan visual dan fokus pengguna.
3)Struktur Internal.
4)Kosakata grafis yang konsistensi dan sesuai.
5)Kesesuaian dengan media.
d. Waktu tanggap
e. Penanganan Kesalahan
3. Peranti Bantu Sederhana
4. Jaring Semantik Tampilan
Latihan Soal IMK
1. Pemilihan ragam dialog dipengaruhi, kecuali
a. Karakterisitk populasi pengguna
b. Tipe dialog yang diperlukan
c. Kendala teknologi
d. Struktur dari data
2. Faktor yang perlu dipertimbangkan dalam perancangan antarmuka berbasis teks, kecuali
a. Urutan penyajian
b. Kelonggaran
c. Pengelompokan
d. Kesesuaian dengan media
3. Untuk merancang program aplikasi special purpose software adalah
a. User centered design
b. User design approach
c. Application Design Approach
d. Special Design Approach
4. Urutan pertama dalam perancangan tampilan adalah
a. Pemilihan ragam dialog
b. Perancangan struktur dialog
c. Perancangan format pesan
d. Perancangan Struktur data
5. Pada perancangan program dimungkinkan program berhenti karena terjadi kesalahan yg disebut
a. Abnormal terminator
b. Error program
c. Run time error
d. Semua benar
Graphical User Interface (GUI)
Unit standar Graph menyediakan suatu pustaka lebih dari 50 buah rutin grafik yang dapat dipergunakan untuk keperluan pembuatan grafik Grafik driver menunjukkan graphics adapter yang dipergunakan untuk monitor. Tiap – tiap driver berisi kode dan data yang diperlukan supaya grafik dapat ditampilkan di layar, karena tiap –tiap layar yang menggunakan graphics adapter tertentu mempunyai karakteristik yang berbeda.
Menggunakan grafik
Untuk memulai menggunakan grafik, gunakan prosedur standar InitGraph :
InitGraph(var GraphDriver : Integer;
var GraphMode : Integer;
DriverPath : String);
Graph Driver pada unit standar graph :
Detect =0, CGA =1, MCGA=2, EGA=3, EGA64=4, EGAMono=5, RESERVED=6, HercMono=7, ATT400=8, VGA=9, PC3270=10
Berpindah dari mode grafik ke mode teks dan sebaliknya
Dari keadaan mode grafik bila akan berpindah ke mode teks, maka dapat digunakan dengan prosedur standar RestoreCrtMode dan untuk kembali dari ke keadaan mode grafik, dapat dilakukan dengan prosedur standar SetGraphMode
Mengakhiri penggunaan grafik
Untuk mengakhiri penggunaan grafik dan menyebabkan keadaan kembali pada mode layar semula sebelum mode grafik dipergunakan adalah : CloseGraph
Sistem Koordinat
Pada mode grafik, ujung kiri atas dari layar (0,0). Nilai dari X atau kolom bergerak ke arah kanan dan nilai Y bergerak ke arah bawah. Jumlah kolom dan baris tergantung dari mode grafik yang dipergunakan.
Pengaturan warna
hal yang perlu diketahui tentang pengaturan warna di mode grafik :
1.Warna yang tersedia adalah sebanyak 16 warna di mode grafik yaitu :
Black=0, Blue=1, Green=2, Cyan=3, Red=4, Magenta=5, Brown=6, LightGray=7, DarkGray=8, LightBlue=9,
LightGreen=10, LightCyan=11, LightRed=12, LightMagenta=13, Yellow=14, White=15
2. Pallete, merupakan warna – warna yang dipilih dari seluruh 16 warna yang tersedia.
3. Warna Background, merupakan warna dasar layar.
Prosedur standar : SetBkColor(Warna)
4. Warna penggambaran grafik merupakan warna yang diambil dari warna-warna yang tersedia di pallete.
Prosedur standar : SetColor(warna)
Membuat garis
Membuat garis dari koordinat (X1,Y1) sampai dengan (X2,Y2) :
Line(X1,Y1,X2,Y2:integer);
Untuk membuat garis dari posisi yang terakhir kali sampai di koordinat tertentu :
LineTo(X,Y:integer);
Menambah garis secara relatif dari titik terakhir kali:
LineRel(Dx,Dy : integer);
Menuju suatu titik tertentu tanpa menggambarnya:
MoveTo(X,Y :integer);
Membuat kotak
Prosedur standar yang digunakan untuk membuat kotak adalah :
Rectangle(x1,y1,x2,y2 : Integer);
Membuat Diagram Batang
Prosedur standar yang digunakan untuk membuat diagram batang adalah :
Bar(x1,y1,x2,y2 : Integer); dan
Bar3D(x1,y1,x2,y2 : integer; Depth :word;Top : boolean);
Mewarnai Obyek
Prosedur standar yang digunakan untuk mewarnai obyek adalah :
FloodFill(X,Y : integer ;Border:word);
SetFillStyle(Pattern : word; Color:word);
Membuat Tulisan
Prosedur standar yang digunakan untuk membuat tulisan adalah :
OutText(TextString : string);
OutTextXY(X,Y:integer; TextString:string);
Menentukan jenis font :
SetTextStyle(Font,Direction : word;
CharSize : word)
Membuat Titik
Prosedur standar yang digunakan untuk membuat titik adalah :
PutPixel(X,Y : integer ; Pixel : word);
Untuk mengetahui warna dari suatu titik pada suatu koordinat tertentu :
GetPixel(X,Y : integer);
Membuat Lingkaran
Prosedur standar yang digunakan untuk membuat lingkaran adalah :
Circle(X,Y : integer ; Radius : word);
Membuat Busur
Prosedur standar yang digunakan untuk membuat busur adalah :
Arc(X,Y : integer ; St Angle,EndAngle, Radius : word);
Membuat ellipse
Prosedur standar yang digunakan untuk membuat ellipse adalah :
Ellipse(X,Y : integer ; StAngle,EndAngle:word;
XRadius, YRadius : word);
Membuat Pie Chart
Prosedur standar yang digunakan untuk membuat pie chart adalah :
PieSlice(X,Y : integer ; StAngle,EndAngle, Radius : word);
Membuat Poligon
Prosedur standar yang digunakan untuk membuat poligon (segi banyak) adalah :
DrawPoly(NumPoint : word; var PolyPoints);
Membuat View
Prosedur standar yang digunakan untuk membuat view adalah :
SetViewPort(x1,y1,x2,y2 : integer ; Clip : boolean);
Latihan Soal IMK
1. GUI singkatan dari
a. Graphical User Interface c. Graphical Unit Interface
b. Graphic Unit Interface d. Graphic User Interface
2. Berisi kode dan data yang diperlukan supaya grafik dapat ditampilkan di layar
a. Grafik driver c. VGA Card
b. GUI d. Program
3. Porsedur untuk memulai menggunakan grafik adalah
a. Close Graph c. Open Graph
b. InitGraph d. Set Graph
4. Graph Diver pada unit standar graph, kecuali
a. CGA b. VGA c. EGA d. IGA
5. Prosedur standar untuk berpindah dari mode grafik ke mode teks
a. CloseGraph c. OpenGraph
b. RestoreCrtMode d. SetGraphMode
ASPEK ERGONOMIK
Beberapa Aspek yang berhubungan dengan Ergonomik yaitu :
1.Pengukuran dan Antropometrik
Antropometrik : Bidang ilmu yang berhubungan dengan pengukuran tubuh manusia. Misal: tinggi badan dan jangkauan tangan.
2. Aspek Ergonomik dari stasiun kerja
a. Pemasukan data.
Pekerjaan berorientasi pada hardcopy, lebih banyak melukan pengetikan daripada melihat ke layar tampilan.Operator membutuhkan kursi yang baik dan dapat diatur, papan ketik yang dapat diatur, posisi dokumen yang tepat dan kualitas dokumen sumber yang baik.
b. Akuisisi data dan Pengolahan Kata
Pekerjaan yang lebih banyak menatap layar tampilan.User sebaiknya disediakan layar tampilan dengan kualitas karakter yang baik, kontrat karakter ke layar yang tinggi serta kendali kilau yang memadai.
c. Pekerjaan Interaktif.
Pekerjaan yang variatif, user tidak diam ditempat tetapi bergerak dalam pekerjaannya.
3. Pencahayaan
- Cahaya langsung
- Cahaya Tak langsung
4. Suhu dan Kualitas Udara
5. Gangguan Suara
6. Kesehatan dan Keamanan Kerja
7. Kebiasaan Dalam Bekerja
Latihan Soal IMK
1. Faktor yang berhubungan dengan kenyamanan kerja
a. Ergonomik c. Antropometrik
b. GUI d. Estetika
2. Aspek penting yang perlu dipertimbangkan yang berhubungan dengan kenyamanan kerja,kecuali
a. Aspek Ergonomik c. Kualitas udara
b. Pencahayaan d. Jenis Komputer
3. Suatu bidang ilmu yang berhubungan dengan pengukuran tubuh manusia
a. Ergonomik c. Statistik
b. Antropometrik d. Estetik
4. Tipe pekerjaan yang perlu dipertimbangkan yang berhubungan dengan ergonomik, kecuali
a. Pemasukkan data c. Interaktif
b. Akuisisi data d. Perencanaan
5. Tujuan dari Antropometrik
a. Keseimbangan teori dengan yang sebenarnya
b. Menghasilkan GUI yang baik
c. Tampilan program yang bagus
d. Agar tidak terjadi kebosanan kerja
Komponen Antarmuka Grafis
Adalah bentuk – bentuk tampilan antarmuka yang dipakai pada paket–paket program aplikasi, baik yang bekerja pada mode teks maupun pada mode grafik
1. Tombol Tekan
Digunakan untuk mengaktifkan suatu aktivitas apabila tombol tersebut ditekan menggunakan mouse (Click Mouse).
2. Spin Box
Digunakan untuk mengatur nilai suatu peubah,biasanya bertipe numerik,dengan menambah atau mengurangkannya dengan suatu nilai tertentu.Dalam spinbox nilai maksimum dan minimum peubah harus dinyatakan dengan jelas, supaya tombol tidak memutar (spinning) terus menerus
3. List Box
Digunakan untuk menampilkan sejumlah pilihan yang tersedia yang dapat dipilih oleh pengguna program.Biasanya pilihan yang dapat dipilih berupa pilihan tunggal,tetapi dalam kondisi tertentu juga dimungkinkan untuk membuat pilihan jamak (multiple choices).
4. Combo Box
Mempunyai fungsi yang sama dengan list box,yaitu untuk menampilkan sejumlah pilihan yang dapat dipilih secara bebas oleh pengguna.
perbedaan antara list box dengan combo box:
a.Jika pada list box semua atau sebagian pilihan yang tersedia langsung akan terlihat,sedangkan pada combo box pilihan tidak akan terlihat sampai pengguna menekan tombol kontrol.
b. Pada list box pengguna hanya dapat memilih pilihan yang tersedia, sedang pada combo box pengguna dapat memasukkan pilihan yang mungkin tidak ada dalam daftar pilihan yang tersedia
5. Tombol Radio
Sejumlah pilihan yang memungkinkan pengguna untuk memilih salah satu pilihan yang tersedia, pilihan tersebut dapat bernilai on atau off yang ditandai dengan tanda tertentu.
6. Check Box
Sejumlah pilihan yang memungkinkan pengguna untuk memilih salah satu atau lebih pilihan yang tersedia.
7. Label Box
Digunakan untuk memberikan komentar atau memberi nama pada masing – masing komponen antarmuka grafis
Latihan Soal IMK
1. Komponen antarmuk a grafis yang digunakan untuk mengatur nilai suatu peubah, bias anya bertipe numerik, dengan menambah atau mengurangkannya dengan suatu nilai tertentu dan nilai maksimum dan minimum peubah dinyatakan dengan jelas adalah :
a. Spin Box c. Tombol tek an
b. List Box d. Combo Box
2. Komponen antarmuk a grafis yang digunakan untuk menampilkan sejumlah pilihan yang tersedia yang dapat dipilih oleh pengguna program. Biasanya pilihan yang dapat dipilih berupa pilihan tunggal, tetapi dalam kondisi tertentu juga dimungkinkan untuk membuatpilihan jamak (multiple choices) adalah :
a. Spin Box c. Tombol tek an
b. List Box d. Combo Box
3. Komponen antarmuk a grafis yang menampilkan pilihan tidak akan terlihat sampai pengguna menekan tombol kontrol dan juga dapat memasukk an pilihan yang mungk in tidak ada dalam daftar pilihan yang tersedia adalah :
a. Spin Box c. Tombol tek an
b. List Box d. Combo Box
4. Sejumlah pilihan yang memungkinkan pengguna untuk memilih salah satu pilihan yang tersedia, pilihan tersebut dapat bernilai on atau off yang ditandai dengan tanda tertentu :
a. Tombol Tekan c. Check Box
b. Tombol Radio d. Combo Box
5. Komponen antarmuk a grafis yang digunakan untuk mengaktifkan suatu aktivitas apabila tombol tersebut ditekan menggunakan mouse (Click Mouse) adalah :
a. Spin Box c. Tombol tek an
b. List Box d. Combo Box
Mendesain Window
Memilih Jenis Window
1. Document window
2. Application window
3. Utility window
4. Dialogs and Alerts
Mendesain bagian window
Tampilan Windows XP
Tampilan Windows Classic
Tampilan Window B II for Linux
1. Mendesain Title
Setiap window sebaiknya diberi judul (title). Sebuah judul window yang bagus berisi informasi yang relevan.Beri judul yang berbeda pada tiap window yang sedang dibuka.
2. Mendesain Border and Windows Command
Border Window
Shape Window
3. Modality
Sebuah modal window melarang user berinteraksi dengan window lain dalam aplikasi yang sama (application modal) atau aplikasi yang lain termasuk desktop itu sendiri (system modal)Non-Modal window tidak melarang berhubungan dengan aplikasi utama atau window lain.
4. Focus
Focus berarti user menentukan window mana yang seharusnya menerima data dari keyboard,mouse, atau device input yang lain.
3 mekanisme:
a. Click to focus : berarti sebuah window mendapat focus karena diklik oleh user
b. Point to focus : berarti sebuah window mendapat focus karena ditunjuk oleh mouse.
Dikenal juga dengan “sloppy focus”
c. Keyboard focus : berarti sebuah window mendapat focus karena dipilih user menggunakan shortcut keyboard seperti Alt+Tab.
Mendesain Primary Window
Primary window umumnya mempresentasikan data user seperti dokumen teks pada aplikasi word processor, gambar pada aplikasi pengolah gambar, spreadsheet pada aplikasi seperti excel, dsb.Normalnya primary window mempunyai sebuah border, sebuah menubar, dan sebuah status bar, dan mungkin juga mempunyai satu atau lebih toolbar.
1. Mendesain Title
Aplikasi yang menyebutkan extensinya
Aplikasi yang menyertakan informasi penting lainnya
Aplikasi yang tidak berbasis dokumen
Aplikasi yang memberikan keterangan tambahan sehubungan engan status aplikasi
2. Window Commands
Pada primary window, mempunyai beberapa perintah yang terdapat pada control boxnya:
• Close
• Maximize
• Minimize
• Restore Down
3. Hubungan dengan dokumen dan window
• Single Document Interface (SDI)
Aplikasi single document interface menempatkan masing-masing dokumen pada sebuah primary window tersendiri.Jadi tiap – tiap dokumen terasa sebagai sebuah aplikasi yang berdiri sendiri.
Contoh aplikasi SDI adalah Microsoft Word
• Controlled Single Document Interface (CSDI)
CSDI adalah aplikasi yang ruangnya untuk menu tidak cukup untuk masing – masing dokumen yang terbuka, sehingga tampak ada primary window yang hanya terdiri dari menu,sedangkan primary window lainnya berisi dokumen, dimana dokumen tersebut dikontrol melalui primary window control (yang berisi menu)
Contoh aplikasi CSDI adalah GIMP
• Multiple Document Interface (MDI)
MDI menampilkan beberapa dokumen dalam window tunggal.Window ini dapat menggunakan panned, tabbed, atau menampilkan lebih dari satu sekaligus.
Contoh aplikasi MDI adalah Macromedia Flash MX
4. Mendesain Utility Window
• Instanst Apply
Window yang mengijinkan user mengubah nilai atau setting seperti property atau preference,update nilai nilai atau setting akan serta merta membuat perubahan pada window
Contoh Instant Apply adalah Customize pada Microsoft Word
• Explicit Apply
Window yang dapat merubah suatu nilai – nilai dengan secara eksplisit.
Ciri khas explicit apply yaitu mempunyai 3 button :
1. Apply : Mengimplementasikan semua setting dalam window, tetapi utility window tidak langsung ditutup
2. Cancel : Mereset semua perubahan pada setting dimana nilai – nilai dikembalikan ke keadaan saat window ini dibuka.
3. Ok : Mengimplementasikan semua setting pada window dan menutup window preference
Contoh Explicit Apply
• Property Window
Adalah tempat user dapat melihat dan mengubah karakteristik sebuah objek,seperti dokumen, file, atau aplikasi.
Contoh property pada MS.Word
• Preferences Window
Adalah window tempat user dapat memodifikasi tampilan window maupun. tingkah lakunya
Contoh :
Option pada MS. Word
• Toolboxes
Window untuk mengakses sekumpulan aksi maupun toggle dengan tampilan toolbar kecil seperti button.
Contoh Toolboxes
• Toolbox Categories
Pengelompokkan Toolbox berdasarkan fungsinya
Contoh :
5. Mendesain Alerts
Alert menyediakan informasi tentang keadaan sebuah sistem aplikasi atau menanyakan informasi penting tentang proses selanjutnya dari sebuah task khusus.
• Alert Text
Terdiri dari dua jenis :
1. Primary text , menyediakan informasi singkat atau usulan tindakan kepada user yang terdiri dari satu kalimat.
2. Secondary text, menyediakan informasi yang lebih detail tentang problem atau anjuran tindakan kepada user.
• Alerts Button
Menyediakan tombol persetujuan untuk melupakan alert atau melakukan tindakan selanjutnya berdasarkan informasi pada Primary text.
Button – button yang biasa ada di alert :
Cancel, Help, Yes, No, Save, Abort, dsb
• Spacing and Positioning
Pedoman membuat alert:
- Border mengelilingi semua sisi alert
- Spasi antara icon dan teks adalah 12 pixel
- Spasi horizontal antar button adalah 6 pixel
- Spasi di bawah baik primary text maupun secondary text adalah 24 pixel
• Information Alerts
Memberitahukan sebuah informasi kepada user sebelum melanjutkan aksinya atau menampilkan informasi yang memang diminta oleh user.
• Error Alerts
Digunakan untuk menampilkan peringatan error saat operasi yang diminta tidak dapat dilakukan secara lengkap.
• Confirmation Alerts
Melakukan konfirmasi ketika user ingin menghapus datanya atau melakukan aktivitas yang akan menimbulkan resiko.
• Save Confirmation Alerts
Membantu user agar tidak kehilangan dokumen/perubahan pada dokumen ketika menutup aplikasi.
• Authentication Alerts
Memaksa user memasukkan informasi yang diperlukan untuk dapat mengakses informasi lebih lanjut.
6. Mendesain Dialog Boxes
Dialog boxes (kotak dialog) menyediakan pertukaran informasi, atau dialog, antara user dan aplikasi.Dapat menggunakan kotak dialog untuk menangkap informasi yang diperlukan dari user untuk tugas atau aksi tertentu,misalkan percetakan
Pedoman umum membuat kotak dialog:
Border Ya
Modality Dapat berupa modal maupun non modal window
Title Format Nama Perintah
Resizing Biasanya tidak dapat diubah ukurannya oleh user kecuali pada k asus khusus
Button Dapat mengikuti pedoman yang digunak an alerts.
• Additional Button
Kita dapat menambahkan button tam bahan selain affirmative button (tombol persetujuan) dan cancel Pedoman memberi button tambahan :
- Tempatkan button tambahan dalam satu area di bagian bawah kotak dialog di sebelah kiri button standar.
- Aturlah button berdekatan dengan kontrol yang berhubungan dengan button tersebut.
• Layout
Sebaiknya menyusun kontrol dengan memperhatikan arah pengguna aplikasi membaca dimana umumnya biasanya dari kiri ke kanan dan dari atas ke bawah.Karena itu tempatkan kontrol utama sedekat mungkin dengan posisi ujung kiri atas.
Contoh pada Macromedia Flash MX
Latihan soal IMK
1. Jenis widow, kecuali
a. Document Window c. Utility Window
b. Application Window d. Multiple Window
2. Yang perlu diperhatikan dalam mendesain judul window, kecuali
a. Window harus diberi Judul
b. Judul Window harus relevan
c. Beri judul yang berbeda pada window yang dibuka
d. Berilah Font yang menarik
3. Ketentuan boleh tidaknya berinteraksi dari wondow
satu ke window lain dalam satu aplikasi
a. Modality c. Ergonomik
b. Entity d. Flexiblelity
4. Yang perlu diperhatikan dalam mendesain window, kecuali
a. Desain Judul Window c. Desain Border
b. Modality d. Warna Window
5. Mekanisme saat window menerim a data data dari input device, kecuali
a. Click to focus c. Keyboard focus
b. Point to focus d. Enter focus
Pengertian Internet adalah“ Sebuah jaringan komputer yang menghubungkan jutaan komputer yang tersebar di seluruh dunia “
1. Cara mengakses internet
-Melalui sebuah ISP (Internet Service Provider)
-Melalui jaringan TV kabel
2. Sumber Daya Internet
a. Email
b. Newsgroup
c. Mailing List
d. WWW
- Dasar World Wide Web (WWW)
- Web Portal
- Multimedia pada Web
e. FTP
f. Telnet
3. Pengenalan Pembuatan Web Page Aplikasi web biasanya dibuat menggunakan HTML (Hypertext Manipulation Language)
Latihan Soal IMK
1. Jaringan komputer yang menghubungkan computer seluruh dunia
a. Intranet c. Internet
b. Ekstranet d. Indonet
2. Cara mengakses internet
a. Dial Up c. WiFi
b. ADSL d. Semua benar
3. Perusahaan penyedia jasa layanan internet
a. Internet Service Provider c. Warung Telekomunikasi
b. Warung Internet d. Internet Station Provider
4. Sumber daya internet, kecuali
a. E-Mail c. Telnet
b. Mailing List d. Blog
5. Jaringan komunikasi tanpa kabel disebut dengan :
a. Intranet b. WiFi
c. Ekstranet d. Indonet
1. Internet dan E-business
a. Sistem Bisnis Internal
b. Perdagangan Elektronis
- Business to Business (B2B)
Keuntungan B2B
a. Business to Consumer (B2C)
b. Consumer to Consumer (C2C)
c. Consumer to Business (C2B)
2. E - Intermediary
a. Penjualan Bersindikat
b. Agen Pembelanjaan
c. Makelar Bisnis ke Bisnis
Latihan Soal IMK
1. E – Intermediary pada internet atau situs web yang menawarkan hubungan kepada konsumen ke situs-situs web lain atas jasa ini web yang menghubungkan ke web lain akan mendapatkan komisi disebut :
a. Agen Pembelanjaan c. Makelar Bisnis ke Bisnis
b. Penjual Bersindikat d. M-Commerce
2. Situs web yang tidak mempunyai produk tetapi merupakan perantara yang menyediakan sarana komunikasi dan informasi seperti produk dan harga yang berasal dari pemasok diantara pebisnis disebut :
a. Agen Pembelanjaan c. Makelar Bisnis ke Bisnis
b. Penjual Bersindik at d. M-Commerce
3. Pada perdagangan elektronis yang model perdagangan yang terjadi antara konsumen dengan konsumen dan memungk inkan orang-orang dapat menjual atau membeli barang diantara mereka sendiri disebut :
a. Business to Business (B2B) c. Consumer to Consumer (C2C)
b. Business to Consumer (B2C) d. Consumer to Busines s (C2B)
4. Pada perdagangan elektronis yang mendukung bisnis berbasis konsumen ke pelaku bisnis yang memungkin konsumen dapat menjual ke suatu perusahaan disebut :
a. Business to Business (B2B) c. Consumer to Consumer (C2C)
b. Business to Consumer (B2C) d. Consumer to Business (C2B)
5. Pada perdagangan elektonis atau e-commerce yang menyatakan jual beli produk atau jasa melibatkan dua atau beberapa perusahaan yang umumnya terlibat perusahaan pemasok, distributor, pabrik disebut :
a. Business to Business (B2B) c. Consumer to Consumer (C2C)
b. Business to Consumer (B2C) d. Consumer to Business (C2B)
