Interface Dan GUI

SOFTSKILL

Minggu ke-4

          A.   Pendahuluan

            Interface yang menggunakan berbagai teknik dialog pada dasarnya adalah untuk mendapatkan satu kriteria yang sangat penting dalam pengoperasian sebuah program aplikasi, yakni aspek ramah dengan pengguna.

            Kata “ramah dengan pengguna” nampaknya mudah diucapkan, tetapi merupakan persoalan tersendiri bagi para perancang dan pemrogram suatu program aplikasi.

1.1 Tujuan Interface User

            Untuk memudahkan pengguna dalam berkomunikasi atau berdialog dengan sesama user lainnya. Sehingga dapat mengurangi biaya untuk pengoperasiannya.  Dengan semakin canggih nya teknologi yaitu “Antarmuka” atau “Interface” semua pengguna dapat menggunakannya untuk berdialog, berdikusi, dan bahkan untuk bertatapan muka langsung  secara visulisasi.

1.2 Perbandingan Interface

            Kita dapat memanfaatkan fasilitas bantuan langsung (online help), pada editor Turbo Pascal berbeda yang ada di dalam Word Perfect for Windows.

B.   Tipe-tipe Interface

2.1 Komponen Dasar

Komponen-komponen dasar interface grafis antara lain adalah :

Ø  Tombol tekan (dalam gambar adalah kotak dengan label “Simpan”),

Ø  spin box

Ø  list box

Ø  combo box

Ø  tombol radio

Ø  check button

Ø  dan penggeser (sliding bar atau disingkat slider) baik yang tegak maupun datar.

Selain komponen-komponen interfacelainnya adalah :

Ø  Ikon (icon)

Ø  Text box

Ø  Editor box

  

2.2 Perangkat Interaktif

Alat Interaktif adalah perangkat-perangkat yang digunakan untuk memberi perintah komputer. Perangkat interaktif contohnya:  Mouse, Trackball, dan Gamepad

 Mouse

 Trackball

Gamepad

Model monitor ada 3 macam yaitu : 

      1.     Monitor komputer 

Adalah salah satu jenis soft-copy device, karena keluarannya adalah berupa sinyal elektronik, dalam hal ini berupa gambar yang tampil di layar monitor. Gambar yang tampil adalah hasil pemrosesan data ataupun informasi masukan. Monitor memiliki berbagai ukuran layar seperti layaknya sebuah televisi. Tiap merek dan ukuran monitor memiliki tingkat resolusi yang berbeda. Resolusi ini lah yang akan menentukan ketajaman gambar yang dapat ditampilkan pada layar monitor. Jenis-jenis monitor saat ini sudah sangat beragam, mulai dari bentuk yang besar dengan layar cembung, sampai dengan bentuk yang tipis dengan layar datar (flat).

      2.     Monitor CRT

CRT (Cathode Rsdsday Tube) atau tabung sinar katoda ditemukan oleh Karl Ferdinand Braun ,teknologi yang digunakan adalah tabung sinar katoda. 

3.     Monitor LCD

LCD singkatan dari Liquid Crystal Display, Pada mulanya LCD display digunakan pada komputer laptop sebelum teknologi meningkat dan akhirnya di pakai pada  monitor desktop. LCD monitor  terdiri dari lima lapisan yaitu  backlight, selembar kaca terpolarisasi , mask piksel berwarna  , lapisan larutan kristal cair responsif terhadap kotak kabel dari koordinat x, y, dan selembar kaca terpolarisasi kedua.

4.     Monitor Plasma

Monitor Plasma atau lebih dikenal dengan PDP (Panel Display Plasma) adalah perangkat layar datar yg menggunakan fenomena gas discharge untuk menampilkan gambar.

Berdasarkan gambar yang dihasilkan :

1.     Monochrome display

Adalah jenis CRT layar komputer yang sangat umum di hari-hari awal komputasi, dari 1960-an hingga 1980-an, sebelum warna monitor menjadi populer. Mereka masih banyak digunakan dalam aplikasi seperti komputerisasi cash register sistem layar Green adalah nama umum untuk sebuah monitor monokrom menggunakan. hijau "P1" fosfor layar.

Melimpah di-awal-pertengahan 1980-an, mereka berhasil Teletype terminal dan CRT warna didahului sebagai perangkat output dominan visual untuk komputer.

DESAIN

Tidak seperti monitor warna, yang menampilkan teks dan grafis dalam beberapa warna melalui penggunaan bolak-intensitas warna merah, hijau, dan biru fosfor , monitor monokrom hanya memiliki satu warna fosfor (mono berarti "satu", dan krom berarti "warna").Semua teks dan grafis yang ditampilkan dalam warna itu. Beberapa monitor memiliki kemampuan untuk mengubah kecerahan individupiksel , sehingga menciptakan ilusi kedalaman dan warna, persis seperti televisi hitam-putih.

CONTOH

Terkenal contoh monitor monokrom awal adalah VT100 dari Digital Equipment Corporation , yang dirilis pada tahun 1978, dan IBM 5151, yang disertai IBM PC Model 5150 pada 1.981 rilis. The 5151 dirancang untuk bekerja dengan PC Adapter Tampilan Monochrome (MDA) text-satunya kartu grafis , tetapi pihak ketiga Hercules Graphics Card menjadi pendamping populer untuk layar 5151 karena 'Hercules resolusi tinggi bitmapped kemampuan monokrom grafis, banyak digunakan untuk grafis presentasi bisnis yang dihasilkan darispreadsheet seperti Lotus 1-2-3 .

Monitor monokrom sangat rentan terhadap layar membakar (maka munculnya, dan nama, dari screen saver ), karena fosfor yang digunakan adalah intensitas yang sangat tinggi. Efek lain dari intensitas tinggi fosfor adalah efek yang dikenal sebagai "ghosting", dimana suatu Pijaran ekor redup isi layar adalah sebentar terlihat setelah layar telah blanked. Ini memiliki tempat tertentu dalam budaya pop , sebagaimana dibuktikan dalam film seperti The Matrix.

Organic Light-Emitting Diode (OLED) atau diode cahaya organik adalah sebuah semikon duktor sebagai pemancar cahaya yang terbuat dari lapisan organik. OLED digunakan dalam teknologi elektroluminensi, seperti pada aplikasi tampilan layar atau sensor. Teknologi ini terkenal fleksibel dengan ketipisannya yang mencapai kurang dari 1 mm.

OLED merupakan piranti penting dalam teknologi elektroluminensi. Teknologi tersebut memiliki dasar konsep pancaran cahaya yang dihasilkan oleh piranti akibat adanya medan listrik yang diberikan. Teknologi OLED dikembangkan untuk memperoleh tampilan yang luas, fleksibel, murah dan dapat digunakan sebagai layar yang efisien untuk berbagai keperluan layar tampilan.

Jumlah warna dari cahaya yang dipancarkan oleh piranti OLED berkembang dari satu warna menjadi multi-warna. Fenomena ini diperoleh dengan membuat variasi tegangan listrik yang diberikan kepada piranti OLED sehingga piranti tersebut memiliki prospek untuk menjadi piranti alternatif seperti teknologi tampilan layar datar berdasarkan kristal cair. beberapa teknologi layar tampilan dengan teknologi OLED sudah masuk ke pasar, mulai dari alat penerangan, alat konsumsi rumah tangga seperti televisi, gadget seperti telepon genggam, papan ketik (keyboard), kamera digital, jam tangan digital, komputer jinjing (laptop), layar komputer, sampai pada alat informasi seperti layar pengumuman di pasar swalayan, bandara, hotel atau rumah sakit.

2.3 Dialog Control

1. Dialog Berbasis Perintah Tunggal (Command Line Dialogue)

Merupakan ragam dialog yang paling konvensional. Perintah-perintah tunggal yang dapat dioperasikan biasanya tergantung dari sistem komputer yang dipakai dan berada dalam suatu domain yang disebut bahasa perintah (command language). Bahasa perintah harus dirancang sedemikian rupa sehingga mereka mempunyai sifat alamiah, yakni mudah dipelajari dan diingat oleh kebanyakan pengguna. Meskipun bersifat buatan, bahasa buatan ini tetap mempunyai struktur leksikal, sintaksis dan semantik tertentu.

Beberapa contoh sederhana yang bisa kita lihat antara lain adalah perintah-perintah yang dimiliki oleh DOS (Disk Operating System). Terbagi atas perintah dalam (internal command) yang tidak memerlukan suatu berkas .EXE atau .COM tertentu (Contoh: DIR, CLS) dan perintah luar (external command) yang memerlukan suatu berkas .EXE atau .COM tertentu (Contoh: FORMAT, DELTREE).

Berikut keuntungan dan kerugian penggunaan dialog berbasis perintah tunggal:

2. Dialog Berbasis Bahasa Pemrograman (Programming language dialogue)

Dalam keadaan tertentu, penggunaan dialog berbasis perintah tunggal sering tidak memadai, khususnya ketika pengguna terus memberikan sederetan perintah-perintah yang sama setiap kali ia menjalankan program aplikasi tersebut. Dialog berbasis bahasa pemrograman merupakan ragam dialog yang memungkinkan pengguna untuk mengemas sejumalh perintah kedalam suatu berkas yang sering disebut batch file. Perintah-perintah yang dituliskan dalam ragam dialog berbasis bahasa pemrograman tidak harus menggunakan salah satu bahasa pemrograman baik tingkat rendah maupun tingkat tinggi seperti Assembler, Pascal, C, FORTRAN atau BASIC, tetapi harus mengikuti aturan-aturan tertentu.

3. Antarmuka Berbasis Bahasa Alami (Natural Language Interface)

Dalam film fiksi ilmiah kita seringkali melihat komunikasi antara manusia dengan komputer lewat suatu bahasa ucapan yang secara jelas memanfaatkan bahasa alami (natural language). Dengan melihat pada perbedaan bahasa yang digunakan oleh manusia dan komputer, maka sebuah sistem yang mengimplementasikan dialog berbasis bahasa alami perlu mempunyai sebuah sistem penterjemah yang dapat menterjemahkan suatu kalimat pada dua arah. Ketika manusia memberikan instruksi, sistem penterjemah harus menerjemahkan instruksi tersebut ke dalam format instruksi lain yang dapat dimengerti oleh komputer. Sebaliknya, ketika komputer akan memberikan jawaban, sistem penterjemah harus mampu menterjemahkan format instruksi komputer menjadi pesan yang dimengerti oleh manusia. Dari sisi pengguna, tentunya ia menginginkan keluwesan yang sebesar-besarnya dalam memberikan instruksi kepada komputer. Tetapi, dari sisi perancang sistem, semakin luwes bahasa alami yang dikehendaki oleh pengguna, semakin rumit pula sistem penterjemah yang harus disiapkan.

Berikut keuntungan dan kerugian penggunaan antarmuka berbasis bahasa alami.

2.4 Form Isian

            Teknik dialog pengisian borang (form filling dialogue) merupakan suatu penerapan langsung dari aktifitas pengisian borang dalam kehidupan sehari-hari dimana pengguna akan dihadapkan pada suatu bentuk borang yang ada di layar komputer yang mereka gunakan. Perlman membuat perbedaan antara menu dan borang. Menu adalah dialog yang menampilkan sejumlah alternatif pilihan yang pilihan-pilihan itu dapat dipilih pengguna dengan cara tertentu pada setiap daur aktifitas. Borang adalah tampilan dari sejumlah persyaratan (requirement) yang menampilkan sejumlah pilihan dan berbagai nilai parameter yang telah ditentukan dan diintegrasikan kedalam sebuah tampilan pada layar.

Contoh dialog berbasis pengisian borang :

Keuntungan dan kerugian penggunaan dialog berbasis pengisian borang adalah:

C.   Tipe-tipe Interaksi

3.1 Manipulasi Langsung

Karakteristik yang sangat penting dari ragam dialog ini adalah adanya penyajian langsung suatu aktifitas oleh sistem kepada pengguna sehingga aktifitas itu akan dikerjakan oleh sistem komputer ketika pengguna memberikan instruksi lewat manipulasi langsung dari semacam kenyataan maya (virtual reality) yang terpampang lewat tampilan yang muncul dilayar.

Penerapan manipulasi langsung pada berbagai bidang diantaranya:

a. Kontrol Proses

Kontrol proses didalam berbagai industri, misalnya pada pembangkitan dan penyaluran listrik dan industri makanan berskala besar biasanya memanfaatkan tampilan visual yang berupa panel-panel kontrol yang dihubungkan kesuatu sistem pengontrol berbasis komputer. Dalam perkembangannya, panel-panel kontrol yang semula menempel pada dinding tembok, sehingga memerlukan ruangan yang cukup besar, kemudian diubah menjadi semacam tampilan yang dapat digambarkan pada layar komputer, sehingga operator akan lebih nyaman.

b. Editor Teks

Konsep WYSIWYG (What You See Is What You Get) merupakan fenomena pengolah kata modern yang banyak sekali memberikan kemudahan pada pengguna. Pengguna akan mendapatkan hasil cetakan seperti apa yang muncul pada layar tampilan. Sehingga, ketika pengguna melakukan manipulasi ke atas suatu teks pada layar, maka sebenarnya ia juga melakukan manipulasi atas hasil cetakan yang ia harapkan.

c. Simulator

Simulator merupakan sistem miniatur yang mencoba menirukan kerja suatu sistem yang berskala sangat besar atau sangat kecil jika dilihat dari kacamata orang awam. Misalnya pada simulator penerbangan. Didalam simulator penerbangan, seorang calon pilot seolah-olah sedang berada didalam sebuat pesawat yang menjadi tanggung jawab secara penuh. Kesalahan yang sangat kecilpun akan sangat dirasakan oleh calon pilot yang ada didalam sebuah simulator itu. Meski dengan tampilan yang tidak selengkap papan kontrol pada pesawat, seseorang dapat mempelajari hal-hal yang sangat mendasar agar ia dapat menerbangkan suatu pesawat terbang.

d. Kontrol Lalu Lintas Penerbangan

Sistem radar berpegang pada adanya kemampuan untuk mengenal pola bentuk-bentuk tertentu seperti yang dapat dikerjakan oleh manusia. Dalam hal ini, dunia tiga dimensi tempat sebuah pesawat sedang menjelajahi dunia ini akan diterjemahkan ke dalam layar dua dimensi yang ada di hadapan seorang operator. Lewat tampilan dua dimensi, yang merefleksikan dunia tiga dimensi itulah seorang operator dapat mengontrol lalu lintas penerbangan

e. Perancangan Bentuk/model ( computer aided design )

Saat sekarang kita dapat meliha berbagai program aplikasi untuk perancangan suatu sistem. Contoh yang pali populer barangkali adalah sebuah program yang bernama engan Auto CAD. Dengan program ini kita dapat merancang suatu model pesawa terbang, baik dengan tampilan yang disebut denagn wireframe model maupun berujut tampilan seperti sebuah pesawat yang sesungguhnya dengan memanfaatkan fasilitas rendering yang dimilikinya. Program ini juga serin dimanfaatkan untuk melakukan pemetaan berbasis komputer (computer-based mapping)

Keuntungan dan kerugian dialog berbasis manipulasi langsung

3.2 Bahasa Perintah

Merupakan ragam dialog yang paling konvensional. Perintah-perintah tunggal yang dapat dioperasikan biasanya tergantung dari sistem komputer yang dipakai dan berada dalam suatu domain yang disebut bahasa perintah (command language). Bahasa perintah harus dirancang sedemikian rupa sehingga mereka mempunyai sifat alamiah, yakni mudah dipelajari dan diingat oleh kebanyakan pengguna. Meskipun bersifat buatan, bahasa buatan ini tetap mempunyai struktur leksikal, sintaksis dan semantik tertentu.

Beberapa contoh sederhana yang bisa kita lihat antara lain adalah perintah-perintah yang dimiliki oleh DOS (Disk Operating System). Terbagi atas perintah dalam (internal command) yang tidak memerlukan suatu berkas .EXE atau .COM tertentu (Contoh: DIR, CLS) dan perintah luar (external command) yang memerlukan suatu berkas .EXE atau .COM tertentu (Contoh: FORMAT, DELTREE).

Berikut keuntungan dan kerugian penggunaan dialog berbasis perintah tunggal:

3.3 Bahasa Natural

Dalam film fiksi ilmiah kita seringkali melihat komunikasi antara manusia dengan komputer lewat suatu bahasa ucapan yang secara jelas memanfaatkan bahasa alami (natural language).

Dengan melihat pada perbedaan bahasa yang digunakan oleh manusia dan komputer, maka sebuah sistem yang mengimplementasikan dialog berbasis bahasa alami perlu mempunyai sebuah sistem penterjemah yang dapat menterjemahkan suatu kalimat pada dua arah. Ketika manusia memberikan instruksi, sistem penterjemah harus menerjemahkan instruksi tersebut ke dalam format instruksi lain yang dapat dimengerti oleh komputer. Sebaliknya, ketika komputer akan memberikan jawaban, sistem penterjemah harus mampu menterjemahkan format instruksi komputer menjadi pesan yang dimengerti oleh manusia. Dari sisi pengguna, tentunya ia menginginkan keluwesan yang sebesar-besarnya dalam memberikan instruksi kepada komputer. Tetapi, dari sisi perancang sistem, semakin luwes bahasa alami yang dikehendaki = oleh pengguna, semakin rumit pula sistem penterjemah yang harus disiapkan.

Berikut keuntungan dan kerugian penggunaan antarmuka berbasis bahasa alami.

3.4 Sistem Menu

Sistem menu merupakan pilihan yang tepat untuk menunjukkan kemampuan dan fasilitas yang dimiliki oleh sebuah program aplikasi kepada pengguna. Menu adalah daftar  sejumlah pilihan dalam jumlah terbatas, yang biasanya berupa suatu kalimat atau kumpulan beberapa kata.

a. Sistem menu datar

Dalam sistem menu datar, kemampuan dan fasilitas yang dimiliki oleh suatu program aplikasi akan ditampilkan secara lengkap, dan biasanya menggunakan kalimat-kalimat yang cukup panjang.

Contoh sistem menu datar

b. Sistem menu tarik (pulldown) yang berbasis pada struktur hirarki pilihan (struktur pohon pilihan)

Sebuah menu tarik pada dasarnya adalah sistem menu yang pilihan-pilihannya dikelompokkan menurut kategori tertentu atau menurut cara tertentu sehingga mereka membentuk semacam hirarki pilihan. Pada hirarki paling tinggi, pilihan-pilihan itu disebut dengan pilihan/menu utama. Sebagian atau semua pilihan/menu utama dapat mempunyai salah satu atau lebih subpilihan/submenu. Sebuah subpilihan/submenu dari suatu pilihan/menu utama dapat mempunyai satu atau lebih sub-pilihan dan seterusnya. Struktur ini membentuk semacam struktur pohon.

Contoh sistem menu tarik

Keuntungan dan kerugian penggunaan sistem menu adalah:

Minggu ke-5

A. Graphical User Interface (GUI)

1.1 Pendahuluan

Pada awal diciptakannya, komputer dijalankan dengan menggunakan perintah yang diketik pada layar monitor menggunakan keyboard. Hal ini berlaku untuk semua program ataupun perintah-perintah tertentu yang berhubungan dengan sistem informasi. Hal ini tentu saja dirasa tidak praktis dan kurang canggih. Selain itu hanya orang-orang tertentu saja yang bisa mengoperasikannya. Oleh karena itu para ahli terdorong untuk dapat menciptakan sesuatu yang dapat digunakan oleh orang kebanyakan dengan cara yang praktis dan mudah diingat. Akhirnya lahirlah yang disebut dengan GUI atau graphical User Interface.

GUI adalah seperangkat aplikasi yang menampilkan semua menu, ikon dan alat penunjuk lainnya yang menggantikan perintah ketik di shell. Hal ini membuat pengguna komputer menjadi lebih mudah mengoperasikan sebuah perangkat daripada mengingat perintah yang menggunakan teks pada sebuah kotak komando tertentu. Hal ini didasarkan bahwa manusia lebih mudah mengingat gambar dibanding tulisan. GUI pertama kali digunakan dalam komputer yang diproduksi oleh Apple yakni Machintosh dengan Steve Jobs sebagai penggagasnya. Namun belakangan sistem operasi lain mengikutinya, seperti misalnya Microsoft dengan GUI Windows-nya yang menjadi tren setter penggunaan start menu dan taskbar di bawah.

1.2 Apa Itu GUI ?

GUI adalah suatu media virtual yang dapat membuat pengguna memberikan perintah tertentu pada komputer tanpa mengetik perintah tersebut, namun menggunakan gambar yang tersedia. Pengguna tidak mengetikkan perintah seperti pada komputer dengan Shell atau teks. Dengan GUI, perintah dapat dikonversi menjadi ikon dalam layar monitor yang dapat diklik untuk memulai fungsinya. Sebagai contoh, tentu anda paham dengan sebuah ikon berbentuk kertas dengan huruf W diatasnya kan? Itu adalah ikon untuk menjalankan Microsoft Word, sebuah aplikasi yang digunakan untuk mengetik. Atau anda pasti familiar dengan tombol di pojok kiri bawah, yakni tombol bertuliskan Start atau logo Windows itu. Segala sesuatu yang anda lihat di Komputer anda saat ini adalah GUI.

1.3 Kelebihan Dari GUI

- Desain Grafis lebih menarik.
- GUI memungkinkan user untuk berinteraksi dengan komputer secara lebih baik.
- Memudahkan pengguna.
- Menarik minat pengguna.
- Resolusi gambar yang tinggi.

1.4 Pengembangan Aplikasi Dengan GUI Menggunakan PHP

Saat ini kita dapat menemukan beberapa solusi yang dapat digunakan untuk membangun aplikasi GUI dengan menggunakan PHP. Solusi yang ada dan cukup banyak dikenal saat ini adalah: PHP-GTK, WinBinder, dan PHP-QT.

Sayangnya, walaupun solusi untuk pembangunan aplikasi GUI menggunakan PHP sudah tersedia, kita masih “belum” dapat menemukan aplikasi GUI komersial berskala enterprise yang dibangun dengan menggunakan PHP. Mengapa hal ini bisa terjadi? Beberapa penyebab yang mendasari minimnya penggunaan PHP dalam pembangunan aplikasi GUI adalah sebagai berikut :

Belum mature-nya solusi yang ada. Hal ini menyebabkan developer enggan untuk menggunakan PHP untuk membangun aplikasi GUI komersial

Perkembangan dari solusi-solusi tersebut masih kurang cepat

Tingkat kesulitan pembangunan aplikasi GUI menggunakan PHP masih relatif tinggi

Kemampuan yang dimiliki PHP untuk pembangunan aplikasi GUI masih jauh tertinggal jika dibandingkan dengan bahasa pemrograman lain yang sudah lebih dahulu digunakan untuk pembangunan aplikasi GUI, misalnya Java, C# dan C++

Serta berbagai alasan lainnya

Untuk menjawab berbagai masalah tersebut di atas, saat ini tengah dikembangkan sebuah solusi baru untuk membantu pembangunan aplikasi GUI menggunakan PHP. Solusi baru tersebut adalah Klorofil Platform. Klorofil Platform dibangun oleh suatu komunitas yang bernama Klorofil Collaboration Project atau dikenal juga dengan nama Klorofil. Di dalam Klorofil Platform terdapat sebuah GUI framework yang bernama gambArt. GUI framework inilah yang dapat kita gunakan untuk membangun aplikasi GUI menggunakan PHP.

Sebelum kita membahas lebih lanjut mengenai Klorofil Platform, gambArt, dan lain sebagainya, kita akan melihat terlebih dahulu salah satu aplikasi yang dibangun menggunakan gambar. Gambar kalkulator yang anda lihat adalah dibangun dengan menggunakan PHP dan gambar.

DAFTAR PUSTAKA

1.      Dewi Agushinta R , 2008 , “Interaksi Manusia dan Komputer” : Teori Dasar, Universitas Gunadarma, Kelapa Dua, Jakarta..

2.      Ida Ayu Yulie Primashanti, 2008 , “Interaksi Manusia dan Komputer” : Teori Dasar, Universitas Gunadarma, Kelapa Dua, Jakarta..

3.      Raskin, J, 2000, The Human Interface, Addison Wesley.

4.      Shneiderman, B, 1998, Designing The User Interface Design, 2nd Edition, MacMillan, London.

5.      Downtown, Andy , “Dialogue Style: Basic Techniques and Guidelines,” in Engineering the Human-Computer Interface, ed. Andy Downtown, McGrawHill International Editions, 1992.

6.      Newman, W. M and Lamming, M. G, 1995, Interactive System Design, Addison Wesley, Cambrigde, Great Britain.