INTERAKSI MANUSIA DAN KOMPUTER
Bidang ilmu interaksi manusia dan komputer adalah ilmu yang mempelajari tentang bagaimana mendesain, mengevaluasi, dan mengimplementasikan sistem komputer yang interaktif sehingga dapat digunakan oleh manusia dengan mudah. Interaksi adalah komunikasi 2 arah antara manusia (user) dan sistem komputer. Interaksi menjadi maksimal apabila kedua belah pihak mampu memberikan stimulan dan respon (aksi & reaksi) yang saling mendukung. Jika salah satu tidak bisa, maka interaksi akan mengalami hambatan atau bahkan menuju pembiasan tujuan.
Interaksi adalah juga disebut proses hubungan timbal balik diantara manusia (aktif) dengan komputer (pasif). IMK adalah perihal, tata bentuk, penilaian dan implementasi sistem komputer interaktif untuk kegunaan manuasia dengan kajian fenomena yang didalamnya / interaksi antara pengguna dengan sistem. komponen yang melibatkan model interaksi diantara pengguna :
a. Pengguna (manusia)
b. Sistem (mesin)
c. Interaksi
PRINSIP USABILITY
Usability dalam interaksi manusia dan komputer merupakan bagian penting yang harus terpenuhi dalam perancangan sebuah sistem. Misalnya dalam pembuatan sebuah web. Web usability adalah salah satu faktor penting dalam mengembangkan sebuah web. Pengembang harus memahami prinsip-prinsip usability sebelum mengimplemen-tasikannya pada sebuah web. Menurut Jacob Nielsen, usability adalah sebuah atribut kualitas yang menilai tingkat kemudahan user interface untuk digunakan. Usability juga mengacu kepada metode untuk meningkatkan kemudahan penggunaan seiama proses perancangan.
Usability didefenisikan melalui lima komponen, yaitu :
a. Learnability
Learnability menjelaskan tingkat kemudahan pengguna untuk memenuhi task-task dasar ketika pertama kali mereka melihat/menggunakan hasil perancangan.
b. Efficiency
Efficiency menjelaskan tingkat kecepatan pengguna dalam menyelesaikan task-task setelah mereka mempelajari hasil perancangan.
c. Memorability
Memorability menjelaskan tingkat kemudahan pengguna dalam menggunakan rancangan dengan baik, setelah beberapa lama tidak menggunakannya.
d. Errors
Errors menjelaskan jumlah error yang dilakukan oleh pengguna, tingkat kejengkelan terhadap error dan cara memperbaiki error.
e. Satisfaction
Satisfaction menjelaskan tingkat kepuasan pengguna dalam menggunakan rancangan.
Sebuah web dangan usability akan ditinggalkan penggunanya hanya dalam hitungan menit.
Misalnya dikarenakan beberapa kondisi sebagai berikut :
➔ Web Sulit digunakan
➔ Navigasi web yang buruk.
➔ Pengguna tidak mendapatkan apa yang diinginkan.
➔ Pengguna mendapatkan adanya kesalahan pada web.
➔ Homepage tidak menjelaskan tentang apa yang ditawarkan oleh perusahaan
➔ Petunjuk yang kurang jelas
D E S A I N
Desain biasa diterjemahkan sebagai seni terapan, arsitektur, dan berbagai pencapaian kreatif lainnya. Proses desain pada umumnya memperhitungkan aspek fungsi, estetik dan berbagai macam aspek lainnya, yang biasanya datanya didapatkan dari riset, pemikiran, brainstorming, maupun dari desain yang sudah ada sebelumnya. Dalam IMK merupakan fase perancangan yang kreatif. Pada fase ini tujuan perancangan harus terlihat.
Tujuan perancangan adalah untuk lebih mendalami pemahaman terhadap sekumpulan nilai, sekelompok orang, atau domain. Selain itu adalah memberikan teknik yang dapat dihandalkan untuk perancangan secara berulang dari sistem interaktif yang sukses dan berdaya guna. Tujuan utama disusunnya berbagai cara interaksi manusia & komputer : untuk mempermudah manusia dalam mengoperasikan komputer dan mendapatkan berbagai umpan balik yang ia perlukan selama ia bekerja pada sebuah sistem komputer.
Faktor penting dalam membuat disain sistem interaksi yang baik adalah penggunaan notasi yang tepat untuk merekam dan mendiskusikan kemungkinan-kemungkinan.
Teknik yang lazim digunakan antara lain:
• Spesifikasi dalam bahasa alami: cenderung bertele-tele, samar-samar, dan membingungkan.
• Bahasa formal dan semiformal: efektif untuk bahasa perintah.
• Menu-tree structures: menunjukkan tata letak menu. Tidak menunjukkan seluruh aksi yang mungkin.
Desain konseptual:
Mendefinisikan model mental yang diharapkan
Menyembunyikan teknologi sistem
Merancang system image yang cocok/sesuai
Penerapan pedoman desain dengan tepat
D I A L O G
Dialog dalam arti umum adalah percakapan antara dua kelompok atau lebih. Sedangkan dialog dalam konteks perencanaan user interface adalah struktur dari percakapan antara user dan sistem komputer.
Dialog Manusia – Komputer:
• Berbeda dengan dialog antar manusia pada umumnya, dialog dengan komputer biasanya terstruktur dan terbatas.
• Beberapa ciri-ciri dari dialog terstruktur yang nantinya ditemukan dalam dialog komputer:
- Menyebutkan beberapa hal tertentu secara berurutan.
- Beberapa bagian dari dialog dilakukan secara bersamaan.
- Dialog berikutnya tergantung pada respon dari partisipan.
- Dialog terstruktur biasanya tidak langsung menuju pada arti katakatanya/ semantik tapi pada level sintaksis.
Dalam konteks perancangan antarmuka pengguna Dialog adalah struktur dari percakapan antara pengguna dengan sistem komputer. Ragam dialog : kemampuan untuk memahami berbagai sistem interaktif yang digunakan selama ini.
3 tingkatan bahasa komputer dalam suatu dialog!
Tingkatan bahasa komputer dalam suatu dialog :
a. leksikal è tingkat paling rendah icon pada layar bahasa manusia ekivalen dengan bunyi dan ejaan suatu kata
b. sintaksis è urutan dan struktur dari input dan output bahasa manusia ekivalen dengan grammar suatu kalimat
c. semantik è percakapan yang berkaitan degan pengaruh pada struktur data internal komputer dan dunia eksternal bahasa manusia ekivalen dengan arti yang berasal dari lapisan dalam suatu percakapan
D H T M L
Merupakan singkatan dari Dynamic HTML, merupakan suatu teknik untuk menampilkan halaman secara dinamis (agar web lebih dinamis), dengan menggunakan kombinasi dari HTML, bahasa scripting pada sisi client (seperti JavaScript), dan bahasa pendefinisian style Cascading Style Sheet (CSS). Dengan adanya fasilitas ini, akan memungkinkan untuk dibuat dan dijalankan sebuah program kecil yang berada di sisi client dan dijalankan oleh web browser. DHTML mengijinkan skrip bahasa pemrograman untuk diubah menjadi variabel-variabel pada setiap pendefenisian bahasa pemrograman halaman web, yang menghasilkan efek perubahan tampilan beserta dengan fungsi-fungsinya setelah halaman web ditampilkan. Berbeda dengan HTML, yang memiliki kemampuan menghasilkan dan mengolah halaman web sebelum ditampilkan.
Saingan dari teknologi ini adalah teknik yang dijalankan melalui Macromedia Flash untuk memunculkan animasi dan Scalable Vector Graphics (SVG). Namun SVG belum terlalu didukung oleh beberapa web browser.Dokumen HTML yang statis dikembangkan lebih interaktif, yang selanjutnya dikenal dengan DHTML (Dynamic HTML). DHTML tidak sebatas gerakan-gerakan yang ditampilkan di dokumen web, namun DHMTL lebih menitikberatkan pada interaktivitas. Bagi pengembang situs web, DHTML memberikan peluang untuk menambah fungsi-fungsi yang sangat bermanfaat.
Pengguna di sisi client tidak hanya diberikan informasi, tapi dapat pula berinteraksi melakukan pengubahan terhadap informasi tersebut. Suatu contoh interaksi kecil DHTML ada fasilitas search engine pada dokumen web. Pemakai mengisikan beberapa kata, kemudian server mengirim kata-kata tersebut ke server. Lalu server memberikan respons dengan memberikan link-link ke dokumen HTML yang mengandung kata-kata itu.
Dengan demikian DHTML menambah interaktifitas dokumen web, tanpa harus menjaga koneksi terus menerus ke server web. Ingatlah bahwa masih menggunakan HTTP (sejak lahirnya), protokol yang berjalanan di atas TCP/IP ini hanya sekali-sekali saja mengkoneksikan client ke server. Setelah membawa sebuah tugas dari browser ke server dan sebaliknya, HTTP memutuskan hubungan ke server.
ANTAR MUKA BERBASIS GRAFIK
Dengan antarmuka berbasis grafis berbagai kemudahan dalam hal pengontrolan format tampilan dapat dikerjakan denagn lebi mudah dan fleksibilitas tampilan dapat semakin dirasakan oleh perancang tampilan maupun penggunanya. Di sisi lain, kita harus memperhatikan, beberapa kendala dalam penerapan antarmuka berbasis grafis ini, antaralain adalah waktu tanggap, kecepatan penampilan, lebarpita penampilan, dan tipe tampilan (berorientasi ke tektual atau grafis). Dalam hal ini adalah GUI : Graphical User Interface.
· Pengguna tidak harus mengingat perintah-perintah yang serin kali cukup panjang, tetapi cukup dikerjakan dengan melihat dan kemudian menunjuk kesuati gambar yan mewakili suatu aktifitas (yang seterusnya disebut dengan ikon)
· Penggunaan borang property atau option untuk mengatur kenampakan (wajah) desktop
· Kemampuan WYSIWYG (what you see is what you get) yan kemudian menjadi sangat
terkenal
· Perintah-perintah yan berlaku umum, seperti MOVE, DELETE, atau COPY, dan lain-lain.
Berdasarkan kelebihan-kelebihan yang disebutkan pada contoh diatas, ada lima faktor yang perlu diperhatikan pada saat kita merancang antarmuka berbasis grafis yang masing-masing dijelaskan sebagai berikut.
1. Ilusi pada obyek-obyek yang dapat dimanipulasi
Perancangan antarmuka berbasis grafis yang efektif harus melibatkan tiga komponen.
§ Pertama, gunakan kumpulan obyek yang disesuaikan dengan aplikasi yang akan dibuat. Jika obyek-obyek itu belum ada, kita dapat mengembangkannya sendiri.
§ Kedua, penampilan obyek-obyek grafis harus dilakukan denagn keyakinan bahwa ia akan dengan mudah dimengerti oleh pengguna.
§ Ketiga, gunakan mekanisme yang konsisten untuk memanipulasi obyek yagn akan muncul dilayar.
2. Urutan visual dan fokus pengguna
Antarmuka dapat digunakan untuk menarik perhatian pengguna antara lain dengan menbuat suatu obyek berkedip, menggunakan warna tertentu untuk obyek-iobyek tertentu, serta menyajikan suatu animasi yang akan lebih menarik perhatian pengguna. Tetapi, penggunanan rangsangan visual yang berlebihan justru akan membuat pengguna bingung dan merasa tidak nyaman.
3. Struktur internal
Pada pengolah kata kita seringkali menulis beberapa kata yang berbeda dengan kata-kata yan lain, misalnya ada sekelompok kata yang ditebalkan, dimiringkan, atau diberi garis bawah. Pada salah satu pengola kata, kita dapat melihat apa yan disebut denagn reveal code, yakni suatu tanda khusus yan digunkan untuk menunjukkan adanya perbadaan font style. Reveal code ini tdak akan ikut dicetak, tetapi digunakan untuk menunjukkan kepada pengguna antara lain tentang font style yang digunakan, batas kiri dan batas kanan dari halaman teks setrta informasi yang lain. Reveal code biasanya berupa suatu karakter khusus.
4. Kosakata grafis yang konsisten dan sesuai
Penggunaan simbol-simbol obyek, atau ikon, memang tidak ada standarnya, dan biasanya disesuaikan dengan kreatifitas perancangnya.
5. Kesesuaian dengan media
Karakteristik khusus dari layar tampilan yang digunakan akan mempunyai pengaruh yang besar terhadap keindahan “wajah” antarmuka yang akan ditampilkan. Pada layar tampilan yang masih berbasis pada karakter, misalnya CGA, pemunculan gambar tidak akan secantik apabila kita menggunakan layar tampilan yang sering disebut dengan bitmap atau raster display. Dengan semakin canggihnya teknologi layar tampilan pada saat ini, kreatifitas perancang tampilanlah yang saat ini lebih dituntut untuk memenuhi permintaan pengguna akan aspek kenyamanan dan keramahan antarmuka.
W E B S I T E
Website dapat diartikan sebagai kumpulan halaman-halaman yang digunakan untuk mempublikasikan informasi berupa teks, gambar dan program multimedia lainnya berupa animasi (gambar gerak, tulisan gerak), suara, dan atau gabungan dari semuanya itu baik yang bersifat statis maupun dinamis yang membentuk satu rangkaian bangunan yang saling terkait antara satu page dengan page yang lain yang sering disebut sebagai hyperlink. Atau juga dapat didefinisakan sebagai hypertext untuk menampilkan data berupa teks, gambar, bunyi, animasi dan data multimedia lainnya, yang diantara data tersebut saling berhubungan satu sama lain.
Karena Pada dasarnya Website adalah sebuah cara untuk menampilkan diri di Internet. Website adalah sebuah tempat di Internet, siapa saja di dunia ini dapat mengunjunginya, kapan saja mereka dapat mengetahui tentang dirnya, memberi pertanyaan kepadanya, memberikan masukan atau bahkan mengetahui dan membeli produk.
Halaman-halaman dari website akan bisa diakses melalui sebuah URL yang biasa disebut Homepage. URL ini mengatur halaman-halaman situs untuk menjadi sebuah hirarki, meskipun, hyperlink-hyperlink yang ada di halaman tersebut mengatur para pembaca dan memberitahu mereka sususan keseluruhan dan bagaimana arus informasi ini berjalan.
Semua orang menggunakan Web untuk segala sesuatu mulai dari pekerjaan sekolah sampai dengan memesan makanan karena prosesnya yang cepat, murah, mudah & menyenangkan! Bahkan orang yang suka belanja sekalipun mencari produk yang diinginkan di Web. Kini mereka berusaha mencari produk atau servis , tempat pertama yang mereka cari adalah di Web - dan jika mereka tidak dapat menemukan produk dan servis di Web, kemungkinan besar mereka akan menemukan kompetitor yang sudah memiliki Website!
Website hanyalah sebuah kumpulan file yang terletak pada sebuah komputer yang terhubung ke Internet. Ketika seseorang mengunjungi Website Anda, mereka sebenarnya hanya terhubung ke sebuah komputer dan komputer (yang kemudian disebut sebagai Server) tersebut memberikan file yang ingin mereka lihat. Untuk memiliki sebuah Website maka membutuhkan sebuah Alamat Website yaitu Nama Domain dan sebuah servis Computer/Server untuk menyimpan data yaitu Servis Web Hosting.
Beberapa hal dari usaha yang akan terbantu dengan adanya situs web adalah :
|
VISUALISASI INFORMASI
Visualisasi adalah rekayasa dalam pembuatan gambar, diagram atau animasi untuk penampilan suatu informasi. Secara umum, visualisasi dalam bentuk gambar baik yang bersifat abstrak maupun nyata telah dikenal sejak awal dari peradaban manusia. Pada saat ini visualisasi telah berkembang dan banyak dipakai untuk keperluan ilmu pengetahuan, rekayasa, visualisasi disain produk, pendidikan, multimedia interaktif, kedokteran, dll.
Informasi yang merupakan hasil suatu pengolahan data dapat dipresentasikan dalam bentuk lisan, tulis, dan visual. Sumberdaya daerah yang merupakan salah satu bentuk informasi geografis dapat disajikan secara visual pada web dalam bentuk peta.
Pemakaian dari grafika komputer merupakan perkembangan penting dalam dunia visualisasi, setelah ditemukannya teknik garis perspektif pada zaman Renaissance. Perkembangan bidang animasi juga telah membantu banyak dalam bidang visualisasi yang lebih kompleks dan canggih.
Dukungan Komputer Dalam Proses Visualisasi Informasi
1. Menyimpan Data Komputer. Komputer memungkinan teknik penyimpnan data yang lebih murah dibandingkan dengan cara konvensional (menggunakan kertas). Data-data bisa disimpan dalam bentuk digital
2. Proses Komputasi. Komputer dapat meningkatkan kecepatan akses pada data digital yang tersimpan untuk keperluan eksplorasi.
3. Penyajian Informasi. Komputer memungkinkan penyajian informasi ke dalam berbagai bentuk yang dapat disesuaikan dengan keinginan.
Model Dasar Proses Visualisasi Informasi
Data mentah (dalam format yang tak tentu) akan diolah sedemikian rupa sehingga bisa diekstrak dan disaring menjadi bentuk data yang dapat dianalisis (proses abstraksi data) seperti data dalam struktur pohon, vektor dan metadata. Data abstrak ini kemudian akan dipetakan (proses visualisasi data abstrak) dalam berbagai bentuk representasi seperti Grafik, Map dsb. Representasi ini kemudian akan dirender menjadi Gambar. Di dalam bentuk sebagai Gambar, data memiliki parameter grafik yang bisa diatur seperti posisi, skala, perbesar/perkecil.
STYLE SHEET
Style Sheet adalah template yang mengontrol pemformatan tag HTML pada halaman web anda. Bila anda telah terbiasa menggunakan Microsoft Word, anda dapat melihat bahwa konsep Style Sheet mirip dengan template pada Microsoft Word: anda dapat megubah penampilan pada dokumen Word dengan mengubah format pada style dokumen. Begitu pula anda dapat mengubah penampilan halaman web dengan mengubah format pada tag HTML tertentu melalui Style Sheet, untuk selanjutnya menggantikan spesifikasi default dari browser untuk tag-tag tersebut.
Style Sheet dapat digunakan dengan 3 cara, sesuai dengan kebutuhan :
• Dengan membuat link ke file Style Sheet dari file HTML. Metode seperti ini memungkinkan untuk mengubah style sejumlah halaman web dengan hanya mengedit satu file Style Sheet.
• Dengan menyisipkan Style Sheet pada file HTML. Metode seperti ini memungkinkan untuk mengubah style suatu halaman web dengan hanya mengedit beberapa baris Style Sheet.
• Dengan menyisipkan secara inline pada tag dalam file HTML. Hal ini memberi cara tercepat untuk mengubah suatu tag, sejumlah tag, atau satu blok informasi pada halaman web.
Sehingga dapat menggunakan satu, dua, atau ketiga cara tersebut pada halaman web.
Dalam hal ini adalah Cascading Style Sheets (CSS) adalah mekanisme sederhana untuk menambah style (contoh: huruf, warna, spasi) pada dokumen Web.
Cascading Style Sheet(CSS) adalah sebuah dokumen yang digunakan untuk menangani pengaturan halaman web. Document ini tidak dapat disebut sebagai bahasa pemrograman, melainkan sebuah desain berbasiskan Scripting yang embeded pada tag HTML. Jadi, CSS merupakan sebuah pengembangan document yang dapat melalukan dukungan terhadap HTML dalam desain web. CSS dapat menciptakan fungsi-fungsi yang dikolaburasikan dengan JavaScript, sehingga semua bentuk animasi ataupun Event yang dilakalukan oleh JavaScript dapat dipadukan dengan desain CSS. Selain itu CSS juga dapat menggantikan fungsi tabel, hal tersebut sangat bermanfaat bagi Kita yang hendak mengembangkan sehuah sistem informasi maupun sistem komputerisasi yang menuntut kecepatan dan keindahan desain yang dapat selalu berubah tanpa harus merombak semua sistem yang telah berjalan.
Jadi, dengan menggunakan satu halaman Document CSS Kita dapat melakukan pengaturan terhadap semua halaman web yang ada. Sehingga apabila Kita ingin melakukan perubahan desain maka Kita tidak perlu untuk membuka semua halaman web yang ada, melainkan hanya perlu merubah satu halaman Document CSS saja.
EFEK VISUAL PADA PAGE
Adalah berbagai macam cara untuk membuat tampilan suatu halaman website lebih menarik. Efek – efek dengan property filter dapat menambahkan style efek pada text dan gambar. Macam-macam filters yaitu seperti Alpha (membuat efek buram), Blur (efek kabur), Shadow (bayangan), Drop Shadow (bayangan mengambang) dan lain–lainnya. Pada HTML efek – efek visual ini diletakkan pada style.
VB SCRIPT
VBScript atau lengkapnya Visual Basic Scripting Edition adalah sebuah bahasa skrip yang diinterpretasikan saat dieksekusi yang dikembangkan oleh Microsoft Corporation. VBScript merupakan sebuah bahasa skrip turunan dari bahasa pemrograman Visual Basic for Applications (VBA) yang digunakan di dalam Microsoft Office dan beberapa platform pengembangan buatan Microsoft lainnya. VBScript menghilangkan beberapa fungsi dari VBA, seperti halnya fungsi I/O berkas dan akses langsung terhadap sistem operasi untuk menyediakan sebuah platform yang aman untuk mengembangkan aplikasi berbasis web dengan menggunakan platform Active Server Pages (ASP). Internet Explorer merupakan penjelajah web pertama yang menyediakan dukungan terhadap kode skrip yang ditulis dalam bahasa VBScript. VBScript tidak dapat digunakan untuk membuat program yang berdiri sendiri. Akan tetapi, VBScript harus dimasukkan ke dalam sebuah berkas HTML. Ketika Internet Explorer membuka dokumen berkas HTML tersebut, VBScript dapat melakukan fungsi yang sama seperti JavaScript--skrip tersebut akan dieksekusi.
Skrip VBScript yang dimasukkan di dalam berkas HTML harus dimasukkan di antara tag . Berikut ini adalah contohnya (yang akan menampilkan sebuah dialog box berisi Hello World! ketika sebuah tombol diklik oleh pengguna):
Bahasa Script adalah jenis bahasa program yang digunakan untuk menyediakan kendali pada lingkungan komputer. Bahasa script adalah bahasa yang terinterpretasi dan bukan bahasa terkompilasi. Ini artinya bahwa program yang dibagun dengan bahasa script harun berjalan pada lingkungan yang mendukung bahasa script tersebut dan tidak dapat berjalan sebagai aplikasi yang mandiri.
HTML tidak dapat meng-interpret bahasa script sendirian, tetapi HTML tau benar bagaimana memanggil interpreter dari bahasa script untuk melakukan interpretasi. Dengan bahasa script seperti VBScript, keterbatasan HTML dapat dihilangkan. Bahasa script yang banyak dipergunakan pada saat ini adalah JavaScript dan VBScript. Kedua bahasa tersebut dapat diletakkan di dalam halaman web jika browser kita mendukung keduanya.
Dengan HTML kita dapat meletakkan kontrol seperti tombol dan kotak teks pada halaman web. Tanpa bahasa script seperti VBScript, aksi yang dilakukan user terhadap kontrol pada halaman web harus dikirim ke web Server. Aksi tersebut tidak dapat diproses pada komputer pemakai. Lebih jauh lagi tanpa bahasa script, control dan felsibilitas web sangat terbatas. Dengan VBScript kita tidak hanya dapat mengkaitkan ke kontrol pada web page, tetapi kita juga dapat menulis kode yang dapat merespon aksi yang dilakukan oleh pamakai terhadap kontrol tersebut.
