Pemrograman Lanjut

MODUL TEORI
6&7
Graphic User Interface
Deskripsi :

Pada modul 6 dan 7 ini akan dibahas mengenai konsep dasar IMK dan Hubungan IMK dengan GUI
(Graphic User Interface)

Topic :
a. IMK
b. Sejarah GUI
c. GUI python
Pemrograman Lanjut

A. Sejarah IMK
Ketika komputer pertama kali diperkenalkan secara komersial pada tahun 50-an,
mesin ini sangat sulit dipakai dan sangat tidak praktis. Hal demikian karena waktu itu
komputer merupakan mesin yang sangat mahal dan besar, hanya dipakai dikalangan tertentu,
misalnya para ilmuwan atau ahli-ahli teknik. Setelah komputer pribadi (PC) diperkenalkan
pada tahun 70-an, maka berkembanglah penggunaan teknologi ini secara cepat dan
mengagumkan ke berbagai penjuru kehidupan (pendidikan, perdagangan, pertahanan,
perusahaan, dan sebagainya). Kemajuan- kemajuan teknologi tersebut akhirnya juga
mempengaruhi rancangan sistem. Sistem rancangan dituntut harus bisa memenuhi
kebutuhan pemakai, sistem harus mempunyai kecocokkan dengan kebutuhan pemakai atau
suatu sistem yang dirancang harus berorientasi kepada pemakai. Pada awal tahun 70-an, juga
mulai muncul isu teknik antarmuka pemakai (user interface) yang diketahui sebagai Man-
Machine Interaction (MMI) atau Interaksi Manusia-Mesin.
Pada Man-Machine Interaction sudah diterapkan sistem yang "user friendly".
Namun, sifat user friendly pada MMI ini diartikan secara terbatas. User friendly pada MMI
hanya dikaitkan dengan aspek-aspek yang berhubungan dengan estetika atau keindahan
tampilan pada layar saja. Sistem tersebut hanya menitik beratkan pada aspek rancangan
antarmukanya saja, sedangkan faktor- faktor atau aspek-aspek yang berhubungan dengan
pemakai baik secara organisasi atau individu belum diperhatikan.
Para peneliti akademis mengatakan suatu rancangan sistem yang berorientasi kepada
pemakai, yang memperhatikan kapabilitas dan kelemahan pemakai ataupun sistem
(komputer) akan memberi kontribusi kepada interaksi manusia-komputer yang lebih baik.
Maka pada pertengahan tahun 80-an diperkenalkanlah istilah Human- Computer Interaction
(HCI) atau Interaksi Manusia-Komputer (IMK).
Interaksi manusia-komputer (Human-Computer Interaction- HCI) merupakan satu
disiplin ilmu yang mengkaji tentang komunikasi atau interaksi di antara pengguna dengan
sistem. Pada HCI ini cakupan atau fokus perhatiannya lebih luas, tidak hanya berfokus pada
rancangan antarmuka saja, tetapi juga memperhatikan semua aspek yang berhubungan
dengan interaksi antara manusia dan komputer. HCI ini kemudian berkembang sebagai
disiplin ilmu tersendiri (yang merupakan bidang ilmu interdisipliner) yang membahas
hubungan timbal balik antara manusia-komputer beserta efek-efek yang terjadi diantaranya.
Menurut Baecker dan Buxton HCI ini didefinisikan sebagai "set of processes,
dialogues, and actions through-which a human user employs and interacts with computer".
ACM-SGCHI [dalam PRE94] lebih jauh menuliskan definisi tentang HCI sebagai berikut:
Pemrograman Lanjut

“human-computer interaction is a discipline concerned with the design, evaluation

and implementation of interactive computing system for human use and with the study of
major phenomena surrounding them. ".
Dengan demikian terlihat jelas bahwa fokus perhatian HCI tidak hanya pada
keindahan tampilannya saja atau hanya tertuju pada tampilan antarmukanya saja, tetapi juga
memperhatikan aspek-aspek pemakai, implementasi sistem rancangannya dan fenomena
lingkungannya, dan lainnya. Misalnya, rancangan sistem itu harus memperhatikan
kenyamanan pemakai, kemudahan dalam pemakaian, mudah untuk dipelajari dan lain
sebagainya.

B. Sekilas IMK
Dalam berinteraksi dengan komputer, para pemakai pertama kali akan berhadapan
dengan perangkat keras komputer. Untuk sampai pada isi yang ingin disampaikan oleh
perangkat lunak, pemakai dihadapkan terlebih dahulu dengan seperangkat alat seperti papan
ketik (keyboard), monitor, mouse, joystick, dan lain-lain. Pemakai harus dapat
mengoperasikan seperangkat alat tersebut. Selanjutnya, pemakai akan berhadapan dengan
macam-macam tampilan menu, macam-macam perintah yang terdiri dari kata atau kata-kata
yang harus diketikkannya, misalnya save, copy, delete, atau macam-macam ikon. Peralatan,
perintah, ikon dan lain-lain yang disebutkan di atas dikenal dengan nama interface
(antarmuka). Interface ini merupakan lapisan pertama yang langsung bertatap muka dengan
pemakai.
Sistem interaksi itu sendiri juga merupakan bagian dari sistem komputer yang dibuat,
sehingga memungkinkan manusia bermteraksi dengan sistem komputer se-efektif mungkin
guna memanfaatkan kemampuan pengolahan yang tersedia pada sistem komputer. Salah satu
model antarmuka antara manusia dan komputer atau rangkaian kegiatan interaksi manusia-
komputer secara sederhana dapat disimak pada gambar di bawah :
Pemrograman Lanjut

Dari Gambar diatas terlihat bahwa manusia memberi isyarat, atau masukan data
kepada sistem pengolah informasi komputer, melalui alat masukan yang tersedia pada sistim
komputer (misalnya keyboard). Berdasarkan masukan ini, melalui alat keluarannya
(misalnya monitor), hasil-hasil pengolahan dari prosesor komputer disajikan kepada
manusia. Melalui sensor manusia, seperti penglihatan (mata), pendengaran (telinga), dan
peraba, sajian atau masukan-masukan itu kemudian dipantau/dimonitor untuk selanjutnya
diteruskan ke sistem pengolah informasi manusia (perceptual processing,
intellectual/cognitive processing, dan motor control yang selalu berinteraksi dengan human
memory) untuk ditafsirkan.
Setelah penafsiran dilakukan dan keputusan diambil, maka diteruskanlah perintah ke
alat responder manusia (tangan, jari, suara, dan lainnya) untuk melakukan tindak lanjutan
yang pada umumnya diwujudkan berupa masukan kembali ke komputer. Rangkaian pesan
dan isyarat antara manusia dengan komputer membentuk suatu dialog interaktif, yakni
serangkaian aksi dan reaksi yang saling berkaitan. Memperhatikan rangkaian kegiatan
interaksi yang terjadi, jelaslah bahwa sifat dari suatu interaksi sangat ditentukan oleh dialog
manusia-komputer dan teknologi dari alat masukan serta keluaran yang digunakan.
Pemrograman Lanjut

Dengan faktor-faktor yang tercakup pada HCI tersebut, sekarang semakin menjadi
jelas peranan HCI di dalam rancangan sistem. la akan mempertinggi kualitas interaksi antara
system komputer dan manusia. Untuk bisa tercapainya kualitas yang tinggi pada interaksi
tersebut, maka secara sistematik perlu diterapkannya pengetahuan tentang tujuan
manusia (human goals), kapabilitas dan keterbatasan manusia bersama-sama dengan
pengetahuan tentang kapabilitas dan keterbatasan komputer pada sistem. Pengetahuan-
pengetahuan yang berhubungan itu selanjutnya untuk mengetahui aspek-aspek fisik, sosial,
organisasi dan lingkungan kerja pemakai. Dengan demikian, perancang sistem harus bisa
membuat transisi dari 'apa yang dapat dilakukan kepada sistem (functionality)" menjadi
'bagaimana sistem itu harus dilakukan agar cocok dengan pemakai (usability)".

C. Tujuan IMK

Tujuan dari IMK adalah untuk menghasilkan sistem yang bermanfaat (usable) dan
aman (safe), maksud dari bermanfaat (usable) disini yaitu manusia berinteraksi dengan
sistem komputer se- efektif mungkin guna memanfaatkan kemampuan pengolahan yang
tersedia pada sistem komputer. Kedua sistem tersebut bisa untuk mengembangkan dan
meningkatkan keamanan (safety), utilitas (utility), ketergunaan (usability), efektifitas
(efectiveness) dan efisiensinya (eficiency). Sistem yang dimaksud konteksnya tidak hanya
pada perangkat keras dan perangkat lunak, tetapi juga mencakup lingkungan secara
keseluruhan, baik itu lingkungan organisasi masyarakat kerja atau lingkungan keluarga.
Sedangkan utilitas mengacu kepada fungsionalitas sistem atau sistem tersebut dapat
meningkatkan efektifitas dan efesiensi kerjanya. Ketergunaan (usability) disini dimaksudkan
bahwa sstem yang dibuat tersebut mudah digunakan dan mudah dipelajari baik secara
individu ataupun kelompok.
Pendapat Preece, J. di atas didasarkan pada pemikiran yang menyatakan bahwa
kepentingan pemakai sistem harus didahulukan, pemakai tidak bisa diubah secara radikal
terhadap sistem yang telah ada, sistem yang dirancang harus cocok dengan kebutuhan-
kebutuhan pemakai. Selanjutnya, dalam berinteraksi dengan komputer, para pemakai pertama
kali akan berhadapan dengan perangkat keras komputer. Untuk sampai pada isi yang ingin
disampaikan oleh perangkat lunak, pemakai dihadapkan terlebih dahulu dengan seperangkat
alat seperti papan ketik (keyboard), monitor, mouse, joystick, dan lain-lain. Pemakai harus
dapat mengoperasikan seperangkat alat tersebut. Selanjutnya, pemakai akan berhadapan
dengan macam-macam tampilan menu, macam-macam perintah yang terdiri dari kata atau
Pemrograman Lanjut

kata-kata yang harus diketikkannya, misalnya save, copy, delete, atau macam-macam ikon.
Peralatan, perintah, ikon dan lain-lain yang disebutkan di atas dikenal dengan nama interface
(antarmuka). Interface ini merupakan lapisan pertama yang langsung bertatap muka dengan
pemakai.

D. GUI

Pada beberapa tahun terakhir ini, istilah antarmuka grafis (graphical user interface,
GUI) semakin banyak terdengar. Istilah ini merujuk pada suatu program antarmuka berbasis
grafis, dimana perintah-perintah tidak lagi diketikan lewat papan ketik, tetapi dengan
cara melakukan interaksi langsung terhadap apa yang terlihat pada layar, yang sebenarnya
merupakan suatu abstraksi dari suatu perintah kepada komputer agar komputer mengerjakan
apa yang kita inginkan.
Pemakaian antarmuka grafis menjadi semakin meningkat, setelah keberhasilan cara
ini dipakai pada Microsoft Windows maupun pada Apple Macintosh. Pada kedua sistem ini,
layar komputer menyajikan objek-objek grafis untuk menggambarkan sesuatu yang lebih
nyata, misalnya kertas, arsip, lemari arsip, keranjang sampah, dan lain-lain. Dengan
menggunakan mouse, pengguna sistem mengklik suatu gambar pada layar, yang selanjutnya
disebut ikon (icon), dan sistem akan mengerjakan semua perintah yang ”disembunyikan”
didalam ikon tersebut. Pengguna sistem tidak perlu mengetahui bagaimana perintah-perintah
tersebut dikerjakan, tetapi hasilnya bisa segera dilihat pada layar.
Dengan semakin pesatnya perkembangan teknologi grafika komputer, khususnya
dalam hal pemanfaatan raster display, dan juga atas keberhasilan dari Microsoft Windows
maupun Apple Macintosh, antarmuka grafis semakin menarik perhatian berbagai pihak.
Salah satu yang paling menarik perhatiannya, yaitu perintah-perintah untuk mengerjakan
suatu aktifitas tidak perlu diketikkan lewat papan ketik, tetapi diganti dengan hanya mengklik
suatu ikon yang terlihat dilayar. Dengan variasi ikon yang sangat menarik, akan membuat
program menjadi lebih hidup.

E. Komponen GUI
Secara umum, komponen-komponen dasar dari antarmuka grafis adalah tombol,
penggeser atau penggulung layar, dan ikon, serta piranti masukan yang biasanya
menggunakan mouse. Tombol biasanya digunakan untuk menampilkan pilihan- pilihan yang
tersedia, menunjukkan perubahan nilai parameter atau untuk menunjukan pilihan-pilihan
yang berstatus aktif atau pasif. Beberapa macam tombol yang sering digunakan antara lain
adalah tombol tekan (push button), check button, dan radio buttton.
Pemrograman Lanjut

Penggeser layar adalah komponen kedua dari piranti antarmuka yang hampir selalu ada.
Seperti diketahui, informasi yang akan ditampilkan di layar seringkali melebihi ukuran layar
yang sebenarnya, sehingga tidak semua informasi bisa tampil secara utuh. Kegunaan dari
penggeser adalah untuk menggulung layar agar informasi berikutnya, atau sebelumnya, bisa
ditampilkan pada layar. Sesuai dengan ukuran layar, maka penggeseran layar bisa dilakukan
ke arah vertikal dan ke arah horizontal.

F. GUI Python
Python merupakan bahasa pemrograman yang bersifat open source (sumber terbuka)
yang berarti bahwa dibebaskan untuk setiap orang menggunakan dan sumber tersebut
tersedia baik untuk dilihat ataupun untuk dimodifikasi. Atau setiap orang dapat memberikan
masukan dalam hal memperbaiki sumber tersebut untuk kemajuan project secara
keseluruhan. Dalam membuat suatu program berbasiskan grafis, di dalam python
memerlukan pustaka GUI yang mendukung untuk pembuatan program grafis tersebut.
Salah satu pustaka yang terdapat langsung di dalam Python yaitu Tkinter. Tkinter
adalah sebuah pustaka grafis (GUI widget) yang telah di set untuk Python sendiri. Dalam
membangun sebuah aplikasi antarmuka grafis pada Python, pustaka Tkinter sangat mudah
dan cepat dalam prosesnya, dan dapat secara langsung ditambahkan kerangka komponen
yang lebih besar di Python itu sendiri.