PERANCANGAN TAMPILAN

9.1 PENGANTAR

Salah satu criteria penting dari sebuah antar muka adalah tampilan yang menarik. Ada pepatah mengatakan, “Cinta pada pandangan pertama.” Jika pepatah ini dikaitkan dengan sebuah antar muka, maka tampilan yang dihadapi oleh penggunalah yang pertama kali akan menarik perhatian pengguna untuk mengoperasikannya.

Untuk membuat tampilan yang menarik memang tidak mudah dilakukan. Seorang perancang tampilan selain harus mempunyai jiwa seni yang memadai, ia juga harus mengerti selera pengguna secara umum. Hal lain yang perlu disadari oleh seorang perancang tampilan adalah bahwa ia harus bisa meyakinkan pemrogramnya bahwa apa yang ia bayangkan dapat diwujudkan (diimplementasikan) dengan peranti bantu yang tersedia.

Bagi perancang antarmuka, hal yang sangat penting untuk ia perhatikan adalah bahwa ia sebaiknya (atau seharusnya) mendokumentasikan semua pekerjaan yang ia lakukan. Dengan dokumentasi yang baik, ia dapat merubah rancangannya ketika ia berubah pikiran atau menemukan bahwa rancangannya tidak mudah di implementasikan. Perubahan yang terjadi bisa karena usulan pengguna yang berubah atau karena alasan lain.

Dokumentasi rancangan dapat dikerjakan atau dilakukan dengan beberapa cara:

1.    Membuat sketsa pada kertas (yang dalam bab ini akan di jelaskan pada Subbab 9.4),

2.    Menggunakan peranti purwarupa GUI,

3.    Menuliskan keterangan yang menjelaskan tentang kaitan antara satu jendela dengan jendela yang lain,

4.    Menggunakan peranti bantu yang disebut CASE (Computer-Aided Software Engineering).

Cara kedua dan keempat tidak selalu dapat diterapkan, karena peranti tersebut biasanya harus dibeliu dan seringkali cukup mahal. Cara ini kebanyakan diterapkan pada pembuatan antar muka grafis untuk suatu jenis pekerjaan berskala besar.

9.2 CARA PENDEKATAN

Sebuah program aplikasi pastilah ditujukan kepada pengguna, yang utama, bukan perancang program aplikasi tersebut. Program aplikasi pada dasarnya dapat dikelompokkan dalam dua kategori besar, yakni program aplikasi untuk keperluan khusus dengan pengguna yang khusus pula (special purpose software), yang juga sering dikenal dengan sebutan public software. Karena perbedaan pada calon pengguna, maka perancang program antarmuka perlu memperhatikan hal ini.

Pada kelompok pertama, yakni pada program aplikasi untuk keperluan khusus, misalnya program aplikasi untuk inventori gudang , pengelolaan data akademis mahasiswa, pelayanan reservasi hotel, dan program-program aplikasi yang serupa, kelompok calon pengguna yang akan memanfaatkan program aplikasi tersebut dapat dengan mudah diperkirakan, baik dalam hal keahlian pengguna maupun ragam antar muka yang akan digunakan. Untuk kelompok ini ada satu pendekatan yang dapat dilakukan, yakni pendekatan yang disebut dengan pendekatan perancangan berpusat-ke-pengguna (user-centered design approach).

Pendekatan perancangan berpusat-ke-pengguna adalah perancangan antarmuka yang melibatkan pengguna. Pelibatan pengguna disini tidak diartikan bahwa pengguna harus ikut memikirkan bagaimana implementasinya nanti., tetapi pengguna diajak untuk aktif berpendapat ketika perancang antarmuka sedang menggambar “wajah” antarmuka yang mereka inginkan. Dengan kata lain, perancang dan pengguna duduk bersama-sama untuk merancang wajah antarmuka yang diinginkan pengguna. Pengguna menyampaikan keinginannya, sementara perancang menggambar keinginan pengguna tersebut sambil menjelaskan keuntungan adan kerugian wajah antarmuka yang diinginkan oleh pengguna, serta kerumitan implementasinya. Dengan cara ini maka pengguna seolah-olah sudah mempunyai gambaran nyata tentang antarmuka yang nanti akan merenka gunakan.

Pada perancangan-oleh-pengguna, pengguna sendirilah yang merancang wajaah antarmuka yang diinginkan. Di satu sisi, cara ini akan mempercepat proses pengimplementasian modul antarmuka. Tetapi disisi yang lain, hal ini justru sangat memberatkan pemrogram karena apa yang diinginkan pengguna belum tentu dapat diimplementasikan dengan mudah, atau bahkan tidak dapat dikerjakan dengan menggunakan peranti bantu yang ada.

Perancang program aplikasi yang dimasukkan dalam kelompok kedua, atau public software, perlu menganggap bahwa program aplikasi tersebut akan digunakan oleh pengguna dengan berbagai tingkat kepandaian dan karakteristik yang sangat beragam. Disatu sisi keadaan ini dapat ia gunakan untuk “memaksa” pengguna untuk menggunakan antar muka yang ia buat, tetapi pada sisi lain “pemaksaan” itu akan berakibat bahwa program aplikasinya menjadi tidak banyak penggunanya. Satu kunci penting dalam pembuatan modul antarmuka untuk program-program aplikasi pada kelompok ini adalah dengan melakukan customization. Dengan customization pengguna dapat menggunakan program aplikasi dengan wajah antarmuka yang sesuai dengan selera masing-masing pengguna.

Salah satu contoh dari adanya kemampuan yang dimiliki oleh sebuah program aplikasi atau system operasi yang dapat disesuaikan dengan karakteristik pengguna adalah pengaturan desktop pada OS X versi 10.5. dengan adanya kemampuan ini, maka pengguna dapat memilih sendiri latar belakang dekkstop yang dia inginkan. Latar belakang standar barang kali bukan merupakan gambar favoritnya, sehingga pengguna dapat mengubahnya sesuai keinginan justru akan membuat mata pengguna itu sakit, dikarenakan mata harus melakukan akomomasi maksimum terus-menerus untuk menyesuaikan dengan warna tampilan yang ada.

Selain cara pendekatan yang dijelaskan diatas, anda yang terbiasa menulis program-program aplikasi mungkin  mempunyai cara khusus untuk berhadapan dengan pengguna. Tetapi perlu anda ingat bahwa apapun cara yang anda gunakan, anda tetap harus mempunyai pedoman bahwa pada akhirnya program itu bukan untuk anda sendiri, tetapi akan dogunakan oleh orang lain. Dengan kata lain, jangan pernah mengabaikan pendapat (calon) pengguna program aplikasi anda.

9.3 PRINSIP DAN PEUTUNJUK PERANCANGAN

Antarmuka secara alamiah terbagi menjadi empat komponen: model pengguna, bahasa perintah, umpan balik, penampilan imformasi. Model pengguna merupakan dasar dari tiga komponen yang lain. Seperti dijelaskan pada Bab III, model mental pengguna merupakan model konseptual yang dimiliki oleh pengguna ketika ia menggunakan sebuah system atau program aplikasi. Model ini memungkinkan seorang pengguna untuk mengembangkan pemahaman mendasar tentang bagian yang dikerjakan oleh program, bahkan oleh pengguna yang sama sekali tidak mengetahui teknologi computer. Dengan pertolongan model itu pengguna dapat mengantisipasi pengaruh suatu tindakan yang ia lakukan dan dapat memilih strategi yang cocok untuk mengoperasikan program tersebut. Model pengguna dapat berupa suatu simulasi tentang keadaan sebenarnya dalam dunia nyata, sehingga ia tidak perlu mengembangkannya sendiri dari awal.

Setelah pengguna mengetahui dan memahami model yang ia inginkan, dia memerlukan peranti untuk memanipulasikan model itu. Peranti pemanipulasian model ini sering disebut dengan bahasa perintah (command language), yang sekaligus merupakan komponen kedua dari antarmuka pengguna. Idealnya, program computer kita mempunyai bahasa perintah yang alami, sehingga model pengguna dengan cepat dapat dioperasionalkan.

Komponen ketiga adalah umpan balik. Umpan balik disini diartikan sebagai kemampuan sebuah program yang membantu pengguna untuk mengoperasikan rogram itu sendiri. Umpan balik dapat berbentuk pesan penjelasan, pesan penerimaan perintah, indikasi adanya obyek tepilih, penampilan karakter yang diberikan lewat papan ketik. Beberapa bentuk umpan balik terutama ditujukan kepada pengguna yang belum berpengalaman dalam menjalankan program sebuah aplikasi. Umpan balik dapat digunakan untuk memberikan keyakinan bahwa program telah menerima perintah pengguna dan dapat memahami maksud perintah tersebut.

Komponen keeempat adalah tampilan informasi. Komponen ini digunakan untuk menunjukkan status informasi atau program ketika pengguna melakukan suatu tindakan. Pada bagian ini perancang harus menampilkan pesan-pesan tersebut seefektif mungkin sehingga mudah dipahami oleh pengguna.

Setelah kita memahami beberapa prinsip dalam perancangan antarmuka pengguna, pada bagian berikut ini akan diberikan petunjuk singkat tentang perancangan antarmuka yang akan anda lakukan sebagai seorang perancang tampilan.

9.3.1 URUTAN PERANCANGAN

Perancangan dialog, seperti halnya perancangan system yang lain, harus dikerjakan secara atas-ke-bawah (top-down). Proses perancangannya dapat dikerjakan secara bertahap (stepwise refinement) sampai rancangan yang diinginkan terbentuk, yaitu sebagai berikut:

1.    Pemilihan ragam dialog

Untuk suatu tugas tertentu, pilihlah ragam dialog yang menurut perkiraan cocok untuk tugas tersebut. Ragam dialog dapat dipilih dari sejumlah ragam dialog yang telah dijelaskan pada bab-bab sebelumnya. Pemilihan ragam dialog dapat dipengaruhi oleh karakteristik populasi pengguna (pengguna mula, menengah atau pengguna ahli), tipe dialog yang diperlukan, dan kendala teknologi yang ada untuk mengimplementasikan ragam dialog tersebut.  Ragam dialog yang terpilih dapat berupa sebuah ragam tunggal, atau sekumpulan ragam dialog yang satu sama lain saling mendukung.

2.    Perancangan struktur dialog

Tahap kedua adalah melakukan analisis tugas dan menentukan model pengguna dari tugas tersebut untuk membentuk struktur dialog yang sesuai. Dalam tahap ini pengguna sebaiknya banyak dilibatkan, sehingga pengguna langsung mendapatkan umpan balik dari diskusi yang terjadi. Pada tahap ini suatu purwarupa dialog seringkali dibuat untuk memberikan gambaran yang lebih jelas kepada calon pengguna.

3.    Perancangan format pesan

Pada tahap ini tata letak tampilan dan keterangan tekstual secara terinci harus mendapat perhatian lebih. Selain itu, kebutuhan data masukan yang mengharuskan pengguna untuk memasukkan data kedalam computer juga harus dipertimbangkan dari segi efisiennya. Salah satu contohnya adalah dengan mengurangi pengetikan yang tidak perlu dengan cara mengefektifkan pengguna tombol.

4.    Perancangan penanganan kesalahan

Dalam pengoprasian sebuah program aplikasi tidak dapat dihindarkan adanya kesalahan yang dilakukan oleh pengguna ketika ia memasukkan data, atau kesalahan yang timbul karena programnya melakukan operasi yang tidak sah, misalnya pembagian dengan nol. Untuk menghindari adanya kondisi penghentian eksekusi program berhenti Karena terjadi kesalahan, maka bentuk-bentuk penanganan kesalahan perlu diberikan.

Bentuk bentuk penanganan kesalahan yang dapat diberikan antara lain adalah:

a.    Validasi pemasukan data: misalnya jika pengguna harus memasukkan bilangan positif, sementara ia memasukkan data negative atau nol, maka harus ada mekanisme untuk mengulang pemasukan data tersebut.

b.    Proteksi pengguna: program memberikan peringatan ketika pengguna melakukan tindakan secara tidak sengaja, misalnya penghapusan berkas.

c.    Pemulihan dari kesalahan: tersedianya mekanisme untuk membatalkan tindakan yang baru saja dilakukan.

d.    Penampilan pesan salah yang tepat dan sesuai dengan kesalahan yang terjadi pada waktu itu.

5.    Perancangan struktur data

Setelah semua aspek antarmuka dipertimbangkan maka tiba saatnya bagi anda untuk memusatkan perhatian pada struktur internalnya. Dalam hal ini anda harus menentukan struktur data yang dapat digunakan untuk menyajikan dan mendukung fungsionalitas komponen-komponen antarmuka yang diperlukan. Strutur ini harus dipetakan langsung kedalam model pengguna yang telah dibuat, meskipun tingkat kompleksitas antara satu aplikasi dengan aplikasi lain dapat saja berbeda. Sebagai contoh, struktur data yang diperlukan untuk mengimplementasikan dialog berbasis grafis jauh lebih rumit dibandingkan dengan struktur data yang diperlukan pada dialog berbasis tekstual. Meskipun demikian, sesulit atau semudah apapun struktur data yang akan digunakan, struktur data tersebut harus diturunkan dari spesifikasi antarmuka yang telah dibuat. Hal ini perlu ditekankan agar keinginan pengguna dan model system yang telah dirancang saling mempunyai kecocokan satu sama lain.

9.3.2 PERANCANGAN TAMPILAN BERBASIS TEKS

Sebelum layar tampilan berkemampuan grafis dekenal luas, antarmuka pada berbagai program aplikasi hamper dipastikan berbasis tekstual, yakni yang mendasarkan diri pada kumpulan karakter ASCII. Meskipun saat ini teknologi layar tampilan yang mendukung aplikasi grafis semakin canggih, tetapi antarmuka berbasis teks masih digunakan.

Pada perancangan antarmuka berbasis teks, ada enam factor yang harus dipertimbangkan agar diperoleh tata letak tampilan yang berkualitas tinggi. Keenam factor tersebut dijelaskan sebagai berikut:

1.    Urutan penyajian

Dalam model pengguna telah dijelaskan urutan operasi dari sebuah program aplikasi. Dengan demikian urutan penyajian tampilan berbasis teks juga harus disesuaikan dengan model pengguna yang telah disusun. Jika hal ini tidak dapat dicapai maka perancang harus membuat semacam kesepakatan dengan calon pengguna tentang urutan tampilan yang akan digunakan. Dengan cara ini maka pengguna akan merasa tidak tertipu dengan apa yang sebelumnya telah disepakati bersama.

2.    Kelonggaran (Spaciousness)

Penyusunan tata leetak yang tidak mengindahkan estetika akan mempersulit pengguna dalam melakukan pencarian suatu teks. Penggunaan tabulasi dan sejumlah spasi, meskipun kadang-kadang menghabiskan tempat kosong pada layar, akan memudahkan pengguna mencari suatu teks yang diinginkan.teks-teks tertentu harus ditempatkan dalam posisi tertentu dengan harapan teks tersebut dapat langsung memusatkan perhatian pengguna.

3.    Pengelompokan

Teks yang saling berkaitan sebaiknya dikelompokkan untuk mempermudah penstrukturan layar tampilan secara keseluruhan. Beberapa karakter khusus, atau baris kosong, dapat dipasang untuk menunjukkan kelompok teks yang berbeda.

4.    Relevansi

Tampilkan pesan-pesan relevan atau sesuai dengan topic yang sedang ditampilkan pada layar.

5.    Konsistensi

Dalam system berbasis frame (misalnya pada dialog berbasis pengisian borang), pengguna sering dihadapkan pada sejumlah tampilan yang penuh dengan informasi. Dalam hal ini perancang harus konsisten dalam menggunakan ruang tampilan yang tersedia. Dengan cara seperti ini maka pengguna secara tidak langsung akan membawa dirinya sendiri untuk mempelajari berbagai tipe informasi yang dapat ditemukan.

6.    Kesederhanaan

Kesederhanaan disini menunjuk kepada cara paling mudah untuk menyajikan aras informasi yang dapat dipahami dengan cepat oleh pengguna

9.3.3 PERANCANGAN TAMPILAN BERBASIS GRAFIS

Dunia grafis sudah dikenal lama, khususnya bagi mereka yang bergerak dalam bidang dan percetakan . Dalam dunia computer, ketenaran antarmuka berbasis dapat dikatakan “baru saja dimulai” seiring dengan semakin meluasnya teknologi penampilan gambar pada layar computer. Dengan antarmuka berbasis grafis berbagai pengontrolan format tampilan dapat dikerjakan dengan lebih mudah, dan fleksibelitas tampilan dapat semakin dirasakan oleh perancang tampilan maupun penggunanya. Di sisi lain, kita harus memerhatikan beberapa kendala dalam penerapan antarmuka berbasis grafis ini, yang antara lain adalah waktu tanggap, kecepatan penampilan, lebar pita penampilan, dan tipe pada layar monokrom (meskipun saat ini semakin jarang ditemui) lebih terbatas disbanding jika menggunakan layar berwarna.

Pada tahun 1970-an, di Xerox Paolo Alto Research Center (PARC) dilakukan sejumlah penelitian yang mengarah kepada perancangan antarmuka yang disebut Xerox Star, yang menggunakan teknik manipulasi langsung. Selain itu, pada tahun 1983, ditempat yang sama juga dikembangkan suatu antarmuka berbasis grafis yang kemudian dikenal dengan sebutan Lisa, yang berjalan pada Macintosh. Penelitian lain untuk mendapatkan antarmuka berbasis grafisterus dilakukan. Beberapa kemampuan yang dimiliki oleh Xerox Star dan lisa, yang kemudian diikiuti oleh system seperti Microsoft Windows dengan versi terbarunya, dan system operasi seperti Macintosh, yaitu leopard Snow, anrata lain adalah :

1.    penggunaan tidak harus mengingat perintah-perintah yang seringkali cukup panjang, tetapi cukup dikerjakan dengan melihat dan kemudian menunjukkan ke suatu gambar yang mewakili suatu aktivitas (yang seterusnya dengan icon)

2.    penggunaan boring property atau option untuk mengatur kenampakan (wajah) desktop,

3.    kemampuan WYSIWYG (what you see is what you get) yang kemudian menjadi sangat terkenal,

4.    perintah-perintah yang berlaku umum, seperti SAVE, 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 mengembangkan sendiri. Kedua, penampilan obyek-obyek grafis harus dilakukan dengan keyakinan penuh bahwa ia akan dengan mudah dimengerti oleh pengguna. Ketiga, gunakan mekanisme yang konsisten untuk memanipulasi obyek yang akan muncul di layar.

2.    Urutan visual dan focus pengguna

Antarmuka grafis dapat digunakan untuk menarik perhatian pengguna antara lain dengan membuat suatu obyek-obyek tertentu, serta menyajikan suatu animasi yang akan lebih menarik perhatian pengguna. Namun demikian penggunaan rangsangan visual yang berlebihan justru akan membuat pengguna bingung dan merasa tidak nyaman. Gunakanlah rangsangan visual tertentu untuk maksud tertentu. Sebagai contoh, gunakan suatu symbol yang berkedip untuk menyatakan posisi kursor: atau gunakan warna dengan kontras yang berbda untuk menunjukkan adanya pilihan yang berbeda. Dengan cara seperti ini maka akan menjadi terbiasa dengan tanda-tanda- khsus pada layar meskipun ia mengguanaka system yang berbeda.

3.    Struktur internal

Pada pengolah kata-kata seringkali menulis beberapa kata yang berbeda dengan kata-kata lain, misalnya ada sekelompok kata yang ditebalkan, dimiringkan, atau diberi garis bawah. Pada salah satu pengolah kata, kita dapat melihat apa yang disebut dengan reveal code, yakni suatu tanda khusus yang digunakan untuk menunjukkan adanya tabulasi, identasi, style halaman, dan lain-lain. Reveal code biasanya berupa karakter khusus. Pada antarmuka bebasis grafis, khususnya pada obyek-obyek yang dimanipulasi, perancangan juga harus memberikan struktur internal (reveal structure) dalam bentuk yang berbeda dengan yang digunakan pada dokumen teks. Hal ini bertujuan untuk memberitahu pengguna sampai sejauh mana pengguna dapat mengubah atau memanipulasi obyek tersebut. Mekanisme ini, bersama – sama dengan elemen lain yang tersembunyi, misalnya peralatan obyek, merupakan kunci yang sangat penting dalam perancangan antarmuka berbasis grafis

4.    Kosa kata grafis yang konsisten dan sesuai

Penggunaan symbol-simbol obyek atau ikon, tidak ada standarnya, dan biasanya disesuaikan dengan kreativitas perancangnya. Untuk program aplikasi yang berbeda pengunaan symbol yang berbeda untuk tujuan yang sama tentu saja sangat wajar. Tetapi pada sebuah program aplikasi, hendaknya digunakan symbol yang sama untuk yujuan yang sama, sehingga pengguna akan merasa bingung ketika ia harus melakukan aktivitas yang dimaksud. Tetapi, agar pengguna tidak memerlukan waktu untuk belajar hal-hal yang pernah mereka pelajari, meskipun pada berbagai program aplikasi yang berbeda, ada baiknya digunakan ikon yang sama untuk tujuan yang sama.

5.    Kesesuain 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, meskipun sudah jarang dijumpai, pemnculan 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, terutama setelah layar jenis  LCD dikembangkan, kraetivitas perancang saat ini lebih dituntut untuk memenuhi permintaan penguna akan aspek kenyamanan, keindahan, dan keramahan antarmuka.

9.3.4 WAKTU TANGGAP

Secara umum, pengguna menginginkan bahwa program aplikasinya dapat memberikan waktu tanggap yang sependek-pendeknya. Tetapi waktu tanggap yang baik memang tidak dapat ditentukan, karena ada beberapa aspek yang mempengaruhi, antara lain ragam interaksi yang diinginkan dan kefasihan pengguna dalam menjalankan program aplikasi. Selain itu, waktu tanggap yang berbeda-beda dapat mempengaruhi konsentrasi pengguna yang pada gilirannya akan mempengaruhi kinerja pengguna

Waktu tanggap yang lama, lebih dari 14 detik akan menyebabkan perhatian pengguna terpecah ke aktivitas lain, sehingga pengguna cenderung untuk melakukan aktivitas sampai system menyelesaikan apa yang harus ia kerjakan. Pada beberapa aplikasi yang memerlukan aktivitas interaktif, misalnya pemilihan menu, pengisian boring, dan pemberian perintah, waktu tanggap yang kurang dari 2 detik dianggap cukup memadai. Tetapi, ada system yang memerlukan waktu tanggap seketika, misalnya pemasukan karakter demi karakter lewat papan ketikl, atau pelacakan kursor mouse.

9.3.5 PENANGANAN KESALAHAN

Kata bijak mengatakan “berbuat salah adalah manusiawi”. Tetapi, dalam dunia computer, kesalahan kecil dapat berakibat fatal sehingga harus diupayakan agar kesalahan-kesalahan yang mungkin dilakukan dapat dihindari dengan cara-cara tertentu agar tidak mengakibatkan terhentinya eksekusi program aplikasi.

Kesalahan dibagi menjadi dua, yakni kesalahn pada saat penulisan program yakni kesalahn sintaksis yang secara langsung akan dideteksi oleh compiler sehingga sering disebut dengan compile-time error atau fatal error. Kesalahan sintaksis terjadi pada saat program sedang dikompilasi. Sebelum kesalahan itu dibetulkan, program tidak akan dapat dioperasikan. Kesalahan logika adalah kesalahan yang terjadi pada saat program sedang dijalankan. Kesalahan ini akan mengakibatkan terhentinya eksekusi program secara abnormal. Gambar 9.5 menunjukkan contoh program dalam bahasa pascal yang berisi kesalahan sintaksis.

Dalam bahasa pemrograman [ascal, operator / tidak dapat digunakan pada operan (peubah) yang bertipe  integer. Ketika program diatas dikompilasi, compiler akan melihat bahwa pada baris [4] akan terjadi kesalahan yang berbunyi Type mismatch. Tetapi ketika baris [4] diubah menjadi

            C1 := A div B;

[1]          var A, B, C1 ; integer;                 [2]          begin                 [3]          readln(A) ; readln (B);                 [4]          writeln(C1) ;                 [5]          end.

Maka pesan kesalahan tidak akan muncul lagi. Hal ini berarti program berhasil dikompilasi dan siap untuk dijalankan.

Gambar 9.5 Contoh kesalahan sintaksis

Kesalahan logika berasal dari dua penyebab. Penyebab pertama datang dari penggunanya, misalnya ketika pengguna mengisikan data yang tidak sah. Penyebab yang kedua berasal dari proses eksekusi. Beberapa contoh dapat disebutkan di sini misalnya ketika program perlu membaca data dari sebuah berkas ternyata berkas yang dimaksud tersebut tidak ada, ketika terjadi pembagian dengan nol, terjadi kekurangan memori ketika program akan mengalokasikan perubah dinamis, dan lain-lain. Jika kesalahan sintaksis langsung dapat dideteksi oleh compiler, maka kesalahan logika tidak akan dapat diperkirakan kapan ia akan datang, sehingga cara penayangannyapun terkadang cukup susah dan memakan waktu lama.

[1]          var A, B, C1 ; integer;                 [2]          begin                 [3]          readln(A) ; readln (B);                 [4]          C1 := A div B ;                 [5]          end.

Penanganan kesalahan harus dilakukan dengan tepat. Salah satu strategi yang biasa dilakukan adalah dengan memberikan pesan umpan balik kepada pengguna akan keadaan eksekusi program saat itu. Penanganan kesalahan ini hanya dapat dilakukan apabila didalam program saat itu. Penanganan kesalahan ini hanya dapat dilakukan apabila didalam program tersebut terdapat modul perangkap kesalahan. Berdasarkan kondisi pada perangkap kesalahan inilah dapat dilakukan penanganan kesalahan yang tepat. Perhatikan contoh program pada gambar 9.6 yang merupakan modifikasi dari gambar 9.5 dengan peubahan pada baris [4].

Gambar 9.6 Program yang mengandung kemungkinan salah logika

Sepintas program yang tersaji pada gambar 9.6 tampak sempurna, tetapi coba sedikit teliti. Sekarang cobalah memasukkan nilai 0 untuk perubah B, dan perhatikan apa yang terjadi. Anda akan melihat pesan yang berbunyi Divide by Zero dan program tidak memberikan hasil apapun. Ketika pesan di atas muncul, berarti terjadi kesalahan logika, yaitu bahwa di dalam operasi matematis, pembagian dengan nol tidak mungkin dilaksanakan sehingga program diatas mungkin masih mengandung kesalahan yang dapat berakibat fatal. Sekarang bandingkan program diatas dengan program pada gambar 9.7

[  1]        var A, B, C1 ; integer;                 [  2]        begin                 [  3]        readln(A) ; readln (B);                 [  4]        if B = 0 then                 [  5]                        wrieln(“Pembagian dengan nol tak diijinkan”)                 [  6]        else                 [  7]        begin                 [  8]                            C1 := A div B ;                 [  9]                            writeln(C1);                 [10]                        end                        [11]        end.

 

Gambar 9.7 program yang berisi perangkap kesalahan

Pada gambar 9.7 penulis menyisipkan perangkap kesalahan pada baris [4], yakni dengan mencetak apakah nilai B sama dengan 0. Jika ya, maka program akan menampilkan pesan “pembagian dengan nol tak dijinkan”, dan eksekusi program akan berhenti secara normal. Jika nilai peubah B tidak sama dengan 0, maka program akan melanjutkan eksekusi ke baris [8], kemudian ke baris [9], dan seterusnya. Dalam rekayasa perangkat lunak, program pada Gambar 9.7 dikatakan mempunyai tibgkat reboystness yang lebih baik dibandingkan program pada gambar 9.6

Kesalahan logika diatas dianggap terjadi pada sebuah system yang berdiri sendiri (stand alone system0. Kesalahan logika juga dapat terjadi pada system banyak pengguna (multiuser). Dalam system banyak pengguna yang diakibatkan oleh pengguna lain. Cara penanganan kesalahan pada system benyak pengguna lebih rumit disbanding pada system yang berdiri sendiri, tetapi biasanya didukung oleh system perangkat kerasnya.

9.4 PERANTI BANTU PERANCANGAN TAMPILAN

Pada bagian awal dari babini telah dijelaskan bahwa perancangan seharusnya membuat dokumentasi tata letak tampilan yang akan diimplementasikan. Hal ini selain berguna bagi pemrograman sebagai pedoman untuk mengimplimentasikan antarmuka tersebut, juga sangat berguna bagi pengguna terutama untuk program-program aplikasi pesanan, yang memungkinkan untuk membayangkan wajah program aplikasi yang akan dibuat. Padan subbab ini diperkenalkan sebuah peranti sederhana yang dapay digunakan untuk mendokumentasikan wajah antarmuka yang diinginkan. Peranti bantu yang dimaksud hanya berbetuk lembaran kertas yang tidak perlu disiapkan secara khusus, tetapi dapat menggunakan sembarang kertas kosong. Untuk mempermudah penamaan maka lembaran kertas yang dimaksud diberi nama dengan lembar kerja tampilan (screen design work sheet), untuk seterusnya disingkat dengan LKT. Gambar 9.8 menunjukkan contoh LKT yang dimaksud

Gambar 9.8 Lembar Kerja Tampilan

LKT yang disajikan pada gambar 9.8 pada dasarnya terdiri atas empat bagian yaitu ;

1.    Nomor lembar kerja

2.    Tampilan: berisi sketsa tampilan yang akan muncul dilayar

3.    Navigasi: bagian ini antara lain menjelaskan kapan tampilan yang dimaksud akan muncu, dan kapan tampilan itu berubah menjadi tampilan lain. Perubahan tampilan biasanya disebabkan oleh adanya suatu peristiwa (event). Peristiwa tersebut antara lain dapat berupa penekanan tombol mouse atau papan ketik oleh pengguna, atau oleh peristiwa khusus dari program aplikasi yang sedang dieksekusi. Peristiwa ini dapat berupa perangkap kesalahan, program meminta masukan dari pengguna dan lain-lain.

5.    Keterangan: bagian ini berisi penjelasan singkat tentang atribut tampilan yang akan dipakai. Sebagai contoh; teks judul menggunakan font Times New Roman, 20 point, berwarna cyan, warna latar belakang biru tua; teks pada push button menggunakan font arial, 16 point, berwarna biru muda; dan lain-lain

Gambar 9.9 menunjukkan contoh penggunaan LKt untuk merancang tampilan pengisian data pada program aplikasi pegelolaan data KTP (Kartu Tanda Penduduk). Dalam Gambar 9.9 ditunjukkan berbagai elemen antarmuka grafis yang digunakan untuk mempermudah pengguna dalam pengisian data KTP. Seperti dijelaskan diatas, pada bagian Navigator diisikan peristiwa-peristiwa khusus yang akan meyebabkan tampilan berubah atau kejadian lain oleh program, dan pada bagian Keterangan diidikan berbagai attibut tampilan yang diinginkan perancang.

Gambar 9.9 Contoh penggunaan lembar kerja tampilan

9.5 JARING SEMANTIC TAMPILAN

Aspek penting yang ingin ditonjolkan dari perancangan tampilan adalah wajah program aplikasi yang memungkinkan pengguna berdialog dengan computer. Hal yang mungkin menjadi persoalan, khususnya bagi pemrograman, adalah apabila cacah tampilan cukup banyak dan masing-masing tampilan mempunyai navigasi yang berbeda-beda.

Agar pemrogram tidak perlu membolak-balik lembar kerja pada saat ia menuliskan program untuk disesuaikan dengan navigasi pada setiap lembar kerja, akan lebih mudah bagi pemrogram untuk memeriksa navigasi yang ada dengan menggambarkannya lewat suatu bagian yang disebut jarring semantic tampilan (screen semantic net)

Jarring semantic tampilan terdiri atas dua komponen : nomor tampilan (lembar kerja) dan transisi yang menyebabkan perpindahahn ke tampilan yang lain (sesuai dengan isi bagian pada rancangan tampilan). Dalam jaring semantic, tampilan diberi notasi sebagai lingkaran dan transisi diberi tanda anak panah.  Pada bagian atas atau bawah anak panah perlu dituliskan event yang akan mengakibatkan adanya transisi. Gambar 9.10 menunjukkan contoh sebuah jaring semantic tampilan.

Gambar 9.10 Contoh jaring semantic tampilan

Pada contoh yang tersaji pada gambar 9.10, T!, T2, …. T7 adalah nomor tampilan (lembar kerja), tulisan yang ada,  Alt-S, Exit, Esc, dan lain-lain, menyatakan peristiwa, dan anak panah menunjukkan transisi yang terjadi. Sebagai contoh, jika pengguna sedang berada pada tampilan T5, dan kemudian ia menekan tombol Alt+Q (ada peristiwa penekanan papan ketik), maka tampilan akan berubah menjadi T7; jika menekan Selesai, ia akan dibawa kembali ke tampilan T1.

Dalam contoh diatas, pada tampilan T2 terdapat satu transisi yang berlabel Loop. Transisi semacam ini biasanya dipakai untuk meminta konfirmasi pengguna, khususnya apabila ada kesalahan eksekusi yang diperangkap oleh program aplikasi.

Peristiwa yang menyebabkan terjadinya transisi dari satu tampilan ke tampilan berikutnya, seperti dikatakan di atas, dapat berupa penekanan tombol papan ketik, pemilihan tombol tekan pada layar tampilan (dengan cara mengklik tombol tekan) atau juga dapat disebabkan karena adanya kondisi khusus. Dalam contoh yang tersaji pada gambar 9.10 memang tidak terlalu jelas tulisan yang menyatakan penekanan tombol papan ketik, tulisan yang menyatakan pemilihan tombol tekan, atau tulisan yang menyatakan adanya peristiwa khusus oleh program. Untuk alas an ini sebaiknya dibuat kesepakatan antara pemrograman dan perancang tampilan agar pemrogram dapat benar-benar mempunyai persepsi yang sama dengan perancangan tampilan.