REKAYASA KEBERGUNAAN PADA SISTEM INFORMASI KEHUMASAN IPB
HENDRO PRABOWO HADI
DEPARTEMEN ILMU KOMPUTER FAKULTAS MATEMATIKA DAN ILMU PENGETHAUAN ALAM INSTITUT PERTANIAN BOGOR BOGOR 2010
REKAYASA KEBERGUNAAN PADA SISTEM INFORMASI KEHUMASAN IPB
HENDRO PRABOWO HADI
Skripsi Skripsi sebagai salah satu syarat untuk memperoleh gelar Sarjana Komputer pada Departemen Ilmu Komputer
DEPARTEMEN ILMU KOMPUTER FAKULTAS MATEMATIKA DAN ILMU PENGETHAUAN ALAM INSTITUT PERTANIAN BOGOR BOGOR 2010
ABSTRACT PRABOWO HADI, HENDRO. Usability Engineering on IPB Public Relationship Information System. Supervised by ARIF IMAM SUROSO and HENDRA RAHMAWAN. This research proposes the dissemination of information about IPB to users who are on campus location. It also aims to build an information system that applies usability methods during system development so it can build a user-friendly and also easy–to-learn system. This information system will be installed into touch screen that will make users able to interact with system directly. Today‟s touch screens are often durable and robust and work well in environments where it will be exposed to wear. Another advantage is that touch screens are intuitive to use. However, good and rich content is not enough to make users explore it. The content has to be easily accessible and presented in a usable and experiential way. Based on the analysis of Computer System Usability Questionnaire (CSUQ), the development of Sistem Informasi Kehumasan IPB managed to perform a well usability. This is shown by the value of overall satisfaction (OVERALL) = 5.48, and obtained a value for each attribute, the system usefullness (SYSUSE) = 5.69, information quality (INFOQUAL) = 5.39, and interface quality (INTQUAL) = 5.20 on a 7 point-scale. Keywords: usability engineering, information system, computer system usability questionnaire.
Judul Nama NRP
: Rekayasa Kebergunaan pada Sistem Informasi Kehumasan IPB : Hendro Prabowo Hadi : G64063497
Menyetujui:
Pembimbing I,
Pembimbing II,
Dr. Ir. Arif Imam Suroso, M.Sc, CS NIP 19610618 198601 1 002
Hendra Rahmawan, S.Kom, MT NIP 19820501 200912 1 004
Mengetahui: Ketua Departeman Ilmu Komputer Institut Pertanian Bogor
Dr. Ir. Sri Nurdiati, M.Sc. NIP 19601126 198601 2 001
PRAKATA
Alhamdulillahi Rabbil ’Alamin, segala puji dan syukur penulis panjatkan kepada Allah SWT atas limpahan rahmat dan hidayah-Nya, sehingga penulis dapat menyelesaikan tugas akhir yang berjudul Rekayasa Kebergunaan pada Sistem Informasi Kehumasan IPB dengan baik dan lancar. Penulis juga menyampaikan ucapan terima kasih kepada: 1. Bapak Dr. Ir. Arif Imam Suroso, M.Sc, CS serta Bapak Hendra Rahmawan, S.Kom, M.T. selaku dosen pembimbing yang telah memberikan arahan dan bimbingan dengan sabar kepada penulis dalam menyelesaikan skripsi ini. 2. Bapak Firman Ardiansyah, S.Kom, M.Si. selaku dosen penguji yang juga telah banyak memberikan masukan kepada penulis dalam menyelesaikan skripsi ini. 3. Ayah, Ibu, Kakak, dan Adik tercinta, yang tidak henti-hentinya memberikan doa, kasih sayang, dan dukungan kepada penulis. 4. Lies Umi Kulsum yang selalu menemani serta senantiasa memberikan motivasi dan kasih sayang kepada penulis. 5. Hamidah sebagai teman satu bimbingan yang selalu memberikan masukan, saran, dan semangat kepada penulis serta Wildan Rahman, Syamsul Bachri, dan Moh. Farhad Idris yang banyak membantu dalam penyelesaian skripsi ini. 6. Staf sekretariat Wakil Rektor Bidang Bisnis dan Komunikasi, pihak Humas IPB, serta Bapak Agus Winarno yang membantu dalam instalasi sistem pada media touch screen. 7. Staf pengajar dan TU Ilmu Komputer yang telah banyak membantu. 8. Cemara Family, rekan-rekan ilkomerz 43, dan Pondok Sahabat atas segala kebersamaan, bantuan, dan motivasi yang telah diberikan kepada penulis. 9. Responden yang telah meluangkan waktunya untuk mengisi kuisioner. Penulis menyadari bahwa masih terdapat kekurangan dalam penulisan skripsi ini. Semoga skripsi ini bermanfaat. Bogor, Desember 2010
Hendro Prabowo Hadi
RIWAYAT HIDUP
Hendro Prabowo Hadi dilahirkan di Pamekasan, Madura, Jawa Timur pada tanggal 23 Juni 1987. Penulis adalah anak kedua dari tiga bersaudara dari pasangan Bapak Mashudi dan Ibu Sri Ernawati. Pada tahun 2006, penulis lulus dari Sekolah Menengah Atas (SMA) Negeri 1 Pamekasan dan diterima menjadi mahasiswa Departemen Ilmu Komputer Institut Pertanian Bogor melalui jalur Undangan Seleksi Masuk IPB (USMI). Pada tahun 2008, penulis terpilih menjadi koordinator komunitas FOKERZ (Film Community of Ilkomerz) Himpunan Mahasiswa Ilmu Komputer dan berhasil menjadi pemenang Film Terbaik pada kompetisi G-Action 2008 yang diselenggarakan oleh Badan Eksekutif Mahasiswa FMIPA. Pada tahun yang sama, penulis juga terpilih menjadi Ketua organisasi mahasiswa daerah, Keluarga Mahasiswa Madura (GASISMA). Pada tahun 2009, penulis melaksanakan kegiatan praktik kerja lapangan di PT. PLN DJBB Area Pelayanan dan Jaringan (APJ) Bekasi selama 35 hari. Selama mengikuti perkuliahan, penulis pernah menjadi asisten praktikum untuk mata kuliah Penerapan Komputer di Departemen Ilmu Komputer, IPB.
DAFTAR ISI Halaman DAFTAR GAMBAR ..................................................................................................................... vi DAFTAR TABEL ......................................................................................................................... vi DAFTAR LAMPIRAN.................................................................................................................. vi PENDAHULUAN Latar Belakang ......................................................................................................................... Rumusan Masalah .................................................................................................................... Tujuan Penelitian ..................................................................................................................... Ruang Lingkup Penelitian ........................................................................................................ Manfaat Penelitian ...................................................................................................................
1 1 1 1 1
TINJAUAN PUSTAKA Sistem Informasi ...................................................................................................................... Usability Engineering .............................................................................................................. Touch Screen ............................................................................................................................ Jenis-Jenis Touch Screen.......................................................................................................... Touch Screen Design Guideline ............................................................................................... Komponen User Interface ........................................................................................................ Heuristic Evaluation ................................................................................................................
1 2 2 2 3 4 5
METODE PENELITIAN A. Analisis Kebutuhan ........................................................................................................... 1. Profil Pengguna.......................................................................................................... 2. Analisis Tugas Kontekstual ....................................................................................... 3. Tujuan Usability ........................................................................................................ 4. Kapabilitas Platform .................................................................................................. 5. Prinsip Perancangan Umum ....................................................................................... B. Perancangan, Pengujian, dan Pengembangan ................................................................... 1. Perancangan Ulang .................................................................................................... 2. Desain Model Konseptual .......................................................................................... 3. Screen Design Standards ........................................................................................... 4. Detailed User Interface Design ................................................................................. 5. Iterative Detailed User Interface Design ................................................................... C. Instalasi ............................................................................................................................. User Feedback ..................................................................................................................
5 5 5 5 5 6 6 6 6 6 6 6 6 6
HASIL DAN PEMBAHASAN A. Analisis Kebutuhan ........................................................................................................... 1. Profil Pengguna.......................................................................................................... 2. Analisis Tugas Kontekstual ....................................................................................... 3. Tujuan Usability ........................................................................................................ 4. Kapabilitas Platform .................................................................................................. 5. Prinsip Perancangan Umum ....................................................................................... B. Perancangan, Pengujian, dan Pengembangan ................................................................... 1. Perancangan Ulang .................................................................................................... 2. Desain Model Konseptual .......................................................................................... 3. Screen Design Standards ........................................................................................... 4. Desain Antarmuka Detail........................................................................................... 5. Evaluasi Antarmuka Detail ........................................................................................ C. Instalasi ............................................................................................................................ User Feedback ..................................................................................................................
6 6 7 9 9 9 9 9 9 10 10 12 13 13
iv
KESIMPULAN DAN SARAN Kesimpulan .............................................................................................................................. 14 Saran ........................................................................................................................................ 14 DAFTAR PUSTAKA .................................................................................................................... 15 LAMPIRAN .................................................................................................................................. 16
v
DAFTAR GAMBAR Halaman 1 2 3 4 5
Usability Engineering Lifecycle ............................................................................................... Konsep pembagian ruang untuk halaman utama ...................................................................... Konsep pembagian ruang untuk halaman lainnya (halaman isi) .............................................. Topologi instalasi sistem .......................................................................................................... Instalasi Sistem Informasi Kehumasan IPB .............................................................................
5 10 10 13 13
DAFTAR TABEL Halaman 1 2 3 4 5 6 7 8 9 10
Data dan analisis profil pengguna ............................................................................................ Karakteristik fisik pengguna .................................................................................................... Koleksi data pengamatan tugas ................................................................................................ Screen design standard ............................................................................................................ Tingkat kemampuan baca dengan kombinasi warna berbeda .................................................. Jenis-jenis tombol .................................................................................................................... Jenis-jenis thumbnail button..................................................................................................... Navigasi ................................................................................................................................... Jenis-jenis scroll button............................................................................................................ Hasil perhitungan heuristic evaluation.....................................................................................
7 7 8 10 11 11 12 12 12 13
DAFTAR LAMPIRAN Halaman 1 2 3 4 5 6 7 8 9
Kuisioner (profil pengguna) ..................................................................................................... Tampilan Sistem Informasi Kehumasan IPB ........................................................................... Heuristic evaluation checklist .................................................................................................. Rekapitulasi hasil perhitungan heuristic evaluation................................................................. Tampilan halaman administrasi Sistem Informasi Kehumasan IPB ........................................ Kuisioner CSUQ (Computer System Usability Questionnaire) ............................................... Penilaian pengguna terhadap sistem secara keseluruhan menggunakan kuisioner CSUQ ....... Tabel deskripsi dan hasil uji sistem (panel administrasi) ......................................................... Tabel deskripsi dan hasil uji sistem (touch screen client) ........................................................
17 18 20 25 28 29 30 32 36
vi
PENDAHULUAN Latar Belakang Institut Pertanian Bogor (IPB) merupakan salah satu perguruan tinggi terkemuka di Indonesia. Hal tersebut dapat dibuktikan dengan masuknya IPB ke dalam 10 besar universitas terbaik di Indonesia. IPB memiliki berbagai informasi yang dibutuhkan oleh masyarakat luas baik berupa agenda kegiatan IPB, informasi mengenai pendidikan maupun informasi seputar kampus. Saat ini, masyarakat luas dapat melihat informasi seputar IPB melalui website. Namun, hal itu tidak sepenuhnya dapat memenuhi kebutuhan akan informasi tersebut. Pada website IPB masih terdapat beberapa fitur yang belum terintegrasi seperti foto-foto kegiatan, dan video-video seputar IPB. Bagi masyarakat umum yang sedang berada di lokasi kampus dan ingin mengakses informasi tersebut, maka mereka harus terhubung ke jaringan IPB terlebih dahulu. Selain itu, sistem yang konvensional mengharuskan pengguna untuk mengetikkan alamat serta mengakses menumenu yang tersedia meggunakan mouse atau keyboard yang memungkinkan terjadinya kesalahan. Untuk mengatasi kebutuhan akan informasi tersebut, salah satu solusi yang dapat dilakukan adalah dengan mengembangkan sebuah sistem yang dapat memberikan semua informasi yang diperlukan seputar IPB, baik berupa berita, agenda, produk IPB maupun foto dan video kegiatan yang diselenggarakan oleh IPB. Sistem ini ditujukan bagi para pengguna yang berkunjung ke IPB. Dengan adanya aplikasi ini diharapkan pengguna dapat memperoleh informasi yang diperlukan seputar IPB dengan mudah. Untuk mengganti penggunaan sistem yang masih konvensional, maka sistem ini akan diimplementasikan pada media touch screen agar pengguna dapat berinteraksi langsung dengan aplikasi tanpa harus menggunakan alat input mouse atau keyboard. Pengembangan sistem informasi ini tentunya akan membantu pihak terkait dalam penyebarluasan informasi. Sistem informasi ini juga dapat dijadikan sebagai media untuk mempromosikan produk. Sistem yang akan dikembangkan ini akan ditujukan bagi pengguna baru. Oleh karena itu, sistem dirancang agar pengguna mudah mengoperasikan aplikasi tersebut. Kemudahan penggunaan suatu sistem dinilai dari antarmuka aplikasi tersebut. Antarmuka yang buruk dapat
menyulitkan pengguna untuk menyelesaikan suatu tugas tertentu. Hal ini mendorong pengguna untuk tidak melanjutkan menggunakan aplikasi tersebut. Rumusan Masalah Rumusan masalah pada penelitian ini adalah membangun sistem informasi dengan memperhatikan usability pada perancangan antarmuka selama pengembangan sistem. Tujuan Penelitian Tujuan dari penelitian ini adalah: 1 Membangun sebuah sistem informasi seputar IPB. 2 Merancang sebuah sistem yang user friendly dengan memperhatikan usability pada perancangan antarmuka selama pengembangan sistem. Ruang Lingkup Penelitian Ruang lingkup penelitian ini adalah : 1 Data yang digunakan meliputi agenda IPB, informasi IPB, foto-foto kegiatan dan videovideo seputar IPB. 2 Pengembangan sistem ini menggunakan php sebagai bahasa pemrograman server side serta menggabungkan JavaScript, CSS dan HTML untuk perancangan GUI. 3 Sistem yang dikembangkan dipasang pada touch screen beresolusi 1280 x 960 pixel (memiliki perbandingan 4:3). Manfaat Penelitian Manfaat dari Sistem Informasi Kehumasan IPB yang dihasilkan dari penelitian ini dapat membantu memberikan informasi seputar IPB bagi para pengguna dengan memberikan kemudahan dalam mengakses menu yang tersedia. TINJAUAN PUSTAKA Sistem Informasi Informasi merupakan data yang telah diolah menjadi bentuk yang memiliki makna dan dapat digunakan oleh manusia. Sedangkan sistem informasi merupakan komponen yang saling terkait yang bertujuan untuk mengumpulkan, mengolah, menyimpan, dan menyebarkan informasi untuk mendukung pengambilan keputusan, koordinasi, dan pengendalian (Laudon 2006).
1
Usability Engineering Usability merupakan faktor penting dalam mengembangkan sebuah aplikasi. Pengembang harus memahami prinsip-prinsip usability sebelum mengimplementasikannya pada sebuah aplikasi. Berdasarkan standar ISO/IEC 9126 (2001), usability didefinisikan sebagai sekumpulan atribut kualitas yang menunjang usaha yang diperlukan dalam penggunaan serta peningkatan dugaan individu terhadap aplikasi tersebut melalui penilaian sekumpulan pengguna (Seffah 2009). Usability engineering sendiri merupakan sebuah aturan yang menyediakan metodemetode terstruktur untuk menerapkan usability pada perancangan antarmuka pengguna selama pengembangan produk (Mayhew 1999). Secara umum usability didefinisikan melalui hubungan antara beberapa faktor antara lain: Efficiency Kemampuan aplikasi dalam memberikan hasil yang diinginkan pengguna sesuai dengan jumlah sumber daya yang dikeluarkan. Effectiveness Kemampuan aplikasi yang membantu pengguna untuk memperoleh tujuan tertentu dengan akurasi sesuai konteks yang diberikan. Satisfaction Satisfaction menjelaskan tingkat kepuasan pengguna secara subjektif dalam menggunakan aplikasi. Learnability Kemudahan pengguna untuk menguasai feature yang diperlukan dalam mencapai tujuan tertentu dalam konteks penggunaan tertentu. Touch Screen Touch screen merupakan layar yang yang terbuat dari permukaan khusus yang sensitif terhadap sentuhan jari ataupun stylus. Untuk berinteraksi dengan aplikasi cukup menyentuh objek secara langsung yang tampil pada layar (Galitz 2007). Nordgren (2007) menyebutkan bahwa saat ini touch screen sering dioperasikan pada lingkungan yang terbuka seperti bandara. Touch screen menggunakan interaksi secara langsung tanpa bantuan alat fisik lainnya seperti mouse. Oleh karena itu, touch screen umum digunakan pada tempat-tempat umum dengan maksud dan tujuan yang berbeda-beda seperti:
Pemberitahuan informasi publik. Antarmuka yang user friendly sangat diperlukan karena pengguna biasanya merupakan orang baru dan memiliki sedikit pengalaman menggunakan komputer, sehingga touch screen dapat memberi kemudahan dalam mengakses informasi yang diperlukan. Sistem penjualan dan restauran. Touch screen dapat membuat input data menjadi lebih cepat dan mudah, serta bisa menghemat tempat yang biasanya dialokasikan untuk mouse dan keyboard. Customer self-service. Contohnya pada ATM serta e-ticket pada terminal-terminal untuk mengurangi antrian. Sistem kontrol dan automatisasi. Pada proses industri, touch screen diperlukan untuk menghemat ruang serta dengan antarmuka grafis, operator dapat mengawasi dan mengendalikan operasi cukup dengan menyentuh layar. Komputer untuk pelatihan. Touch screen dapat membantu membuat proses pembelajaran menjadi lebih menyenangkan dan interaktif serta mengurangi waktu pelatihan bagi pengguna komputer baru. Teknologi bantu. Beberapa orang memiliki masalah dalam menggunakan mouse, keyboard, serta peralatan lainnya. Pada kasus tertentu, touch screen dapat menjadi salah satu solusinya. Jenis-Jenis Touch Screen Teknologi touch screen terus berkembang dari waktu ke waktu. Teknologi ini cukup banyak berkembang untuk memenuhi berbagai kebutuhan. Saat ini touch screen tidak hanya digunakan pada perangkat komputer saja. Mobil, motor, telepon genggam, PDA, konsol game, mesin-mesin berat, pesawat terbang, dan banyak lagi perangkat yang telah dilengkapi touch screen (Bjornskiold 2008). Berikut ini adalah beberapa teknologi touch screen yang masing-masing memiliki fungsi dan kegunaannya tersendiri. 1. Resistive touch screen Resistive touch screen merupakan layar yang cara kerjanya harus ditekan, dapat menggunakan jari atau benda apapun yg ditekankan di layar. Kelemahan untuk layar ini adalah jika diletakkan di kantong (terutama kantong celana), bisa tertekan-tekan dan mengakibatkan layar jadi gampang rusak karena sering tertekan.
2
Layar dengan teknologi ini memiliki tingkat kejernihan gambar sebesar 75% saja, sehingga monitor akan tampak kurang jernih. Touch sensor jenis ini sangat rentan dan lemah terhadap sentuhan benda-benda yang agak tajam. Teknologi ini tidak akan terpengaruh oleh elemen-elemen lain di luar seperti misalnya debu atau air, namun akan merespon semua sentuhan yang mengenainya, baik itu menggunakan jari tangan langsung maupun menggunakan benda lain seperti stylus. Sangat cocok digunakan untuk keperluan di dalam dunia industri seperti di pabrik, laboratorium, dan banyak lagi. 2. Capacitive touch screen Cara penggunaan capacitive touch screen harus dengan sentuhan jari, tidak dapat menggunakan benda lain (kuku, stylus, dsb). Karena layar ini bekerja dengan memanfaatkan muatan listrik yang ada di tubuh kita. Layar sentuh model kapasitif ini hampir tidak memiliki kelemahan yang berarti, karena layar ini adalah pengembangan terbaru untuk menggantikan layar resistif. Capacitive touch screen baru dapat bekerja jika sentuhan-sentuhan yang ditujukan kepadanya berasal dari benda yang bersifat konduktif seperti misalnya jari. Tampilan layarnya memiliki kejernihan hingga sekitar 90%, sehingga cocok untuk digunakan dalam berbagai keperluan interaksi publik seperti misalnya di restoran, kios elektronik, lokasi point of sales, dan lain-lain. 3. Surface acoustic wave system Teknologi ini tidak menggunakan bahan pelapis metalik melainkan sebuah lapisan kaca, maka tampilan dari layar touch screen jenis ini mampu meneruskan cahaya hingga 90%, sehingga lebih jernih dan terang dibandingkan dengan resistive touch screen. Tanpa adanya lapisan sensor juga membuat touch screen jenis ini menjadi lebih kuat dan tahan lama karena tidak akan ada lapisan yang dapat rusak ketika disentuh, ketika terkena air, minyak, debu, dan banyak lagi. Kelemahan dari touch screen jenis ini adalah kinerjanya dapat diganggu oleh elemen-elemen seperti debu, air, dan benda-benda padat lainnya. Sedikit saja terdapat debu atau benda lain yang menempel di atasnya maka touch sreen dapat mendeteksinya sebagai suatu sentuhan. Touch screen jenis ini cocok digunakan pada ruangan training komputer, keperluan dalam ruangan untuk menampilkan informasi dengan sangat
jernih dan tajam dan saat presentasi dalam ruangan. 4. Multi touch screen Multi touch screen merupakan pengembangan dari teknologi layar sentuh yang sudah ada. Dari arti kata “multi” yang berarti banyak, sudah terlihat bahwa keunggulan layar sentuh ini dapat disentuh oleh lebih dari satu jari. Multi touch screen ini mampu disentuh oleh puluhan jari dari orang yang berbeda-beda secara bersamaan. Jenis touch screen ini dapat digunakan untuk membesarkan, mengecilkan, mengubah posisi, dan memindahkan posisi objek pada layar monitor seperti foto atau games. Layar multi touch screen ini biasa digunakan pada handphone, komputer, MP3 player, dan sebagainya. Touch Screen Design Guideline Nordgren (2007) meyebutkan dalam mendesain antarmuka aplikasi touch screen tentunya berbeda dengan aplikasi desktop. Perusahaan touch screen, Touch Screen Inc memberikan 10 tips untuk pengembangan aplikasi touch screen, antara lain: 1 Selalu dijalankan pada full screen mode atau menggunakan keseluruhan screen area. 2 Menggunakan warna background yang cerah untuk mengurangi pantulan cahaya serta untuk menyembunyikan sidik jari. 3 Dragging, double-clicks, scroll bars, dropdown menus, multiple windows, dapat membingungkan pengguna baru. Oleh karena itu sebaiknya menggunakan antarmuka point-click yang sederhana dan tombol yang besar. 4 Pengguna akan lebih fokus pada layar jika cursor dinon-aktifkan. 5 Feedback diberikan pada pengguna segera setelah layar disentuh. Hal tersebut akan meyakinkan pengguna bahwa aksi mereka telah diproses. Tombol 3-D effects cocok untuk tujuan tersebut. 6 Aplikasi yang dibuat cepat dan menyenangkan. Pengguna tidak menyukai sistem yang lambat. 7 Aplikasi touch screen yang dibuat intuitif, serta pengguna diberi panduan sebanyak mungkin. 8 Membatasi pilihan. 9 Animasi dan font berukuran besar dapat menarik pengguna. 10 Menguji aplikasi yang telah dibuat. Jika pengguna berhenti walaupun hanya sesaat,
3
itu pertanda masalah timbul dan harus segera dibenahi.
Suara
Pada perancangan sebuah aplikasi, perlu diperhatikan beberapa komponen user interface yang dapat mempengaruhi kinerja aplikasi secara langsung. Komponen-komponen tersebut antara lain:
Suara merupakan cara yang baik untuk memberitahukan informasi. Stone et al. (2005) menyebutkan tiga fungsi penggunaan suara, yaitu: Memperkuat komponen visual GUI. Menunjukkan operasi berhasil dilakukan. Menarik perhatian.
Teks
Tombol
Tipografi meliputi pemilihan jenis huruf dan penentuan ukuran huruf. Dalam merancang antarmuka, Galitz (2002) menyarankan untuk menggunakan tidak lebih dari dua typeface dengan salah satu typeface mendominasi. Jenis huruf yang digunakan biasanya adalah yang sederhana dan sering digunakan, seperti Arial dan Times New Roman.
Karena touch screen digunakan pada aplikasi point-and-click, maka sebagian besar touch screen dipenuhi dengan button serta ruang untuk menampilkan data. Oleh karena itu, tombol memegang peranan penting pada desain touch screen (Stone et al. 2005).
Komponen User Interface
Kelebihan dari teks adalah tidak ambigu jika dibandingkan dengan komponen GUI lainnya. Tetapi teks juga memerlukan tempat ekstra serta waktu pemrosesan lebih lama dan pengguna yang berpengalaman kemungkinan lebih memilih icon. Jika teks digunakan untuk tujuan navigasi, sangatlah penting untuk menggunakan kata seringkas mungkin (tapi hindari singkatan), mudah dikenali serta mudah diingat. Penggunaan tipe font dalam teks sangat berpengaruh kepada kemudahan dalam membaca informasi yang akan diberikan. Apabila kita bertujuan untuk mencetaknya, maka pergunakanlah tipe font serif, sedangkan apabila menggunakan teks dalam GUI, font sans serif dianjurkan untuk digunakan karena memiliki resolusi yang lebih rendah daripada font serif. Hal penting lainnya untuk diingat adalah gunakan bahasa atau terminologi yang umum. Pengguna seharusnya tidak mempelajari istilah-istilah sulit. Warna Menurut Nielsen (2006), untuk memperjelas teks digunakan warna teks yang kontras dengan warna latar yaitu teks berwarna gelap dengan latar belakang berwarna terang (positive text) atau teks berwarna terang dengan latar berwarna gelap (negative text). Baik di alam maupun di layar, benda-benda berwarna memiliki daya tarik yang lebih kuat. Penerapan strategi pewarnaan ini dapat membedakan hal penting dengan yang tidak penting, menandakan suatu tugas tertentu, membuat tampilan lebih atraktif, mewakili status tertentu, menarik perhatian, menunjukkan hubungan, dan sebagainya.
Pemilihan icon juga perlu diperhatikan. Beberapa property yang harus dimiliki icon antara lain: Dapat dibedakan dengan mudah dari yang lainnya, untuk menghindari kesalahan. Mudah dikenali dan dipahami sehingga pengguna dapat mengerti fungsi icon tersebut. Sederhana, tanpa detail yang tidak perlu. Hindari kompleksitas seperti penggunaan banyak warna. Navigasi Berdasarkan panduan Galitz (2002), setiap aplikasi seharusnya dilengkapi dengan navigasi. Navigasi bertujuan untuk memudahkan pengguna mengetahui posisi dan keberadaan mereka dalam aplikasi tersebut pada saat itu. Selain itu, navigasi bertujuan untuk menentukan pilihan. Navigasi mengacu pada metode yang digunakan seseorang untuk menemukan apa yang mereka inginkan. Sebuah struktur navigasi yang efisien merupakan elemen terpenting dalam usability sebuah sistem. Struktur navigasi yang sederhana dan jelas merupakan cara yang dianjurkan untuk menampilkan informasi. Scrolling Scrolling terkadang diperlukan untuk melihat seluruh isi halaman. Halaman yang berukuran besar dapat menyebabkan terjadinya banyak scrolling, sehingga tidak praktis dan tidak efisien (Galitz 2002). Ketika informasi yang disajikan tidak dapat ditampilkan dalam sebuah window, informasi tambahannya haruslah visible. Hal ini dapat diatasi dengan membuat scrolling untuk menampilkan data.
4
Heuristic Evaluation
A. Analisis Kebutuhan
Heuristic evaluation merupakan sebuah evaluasi rinci terhadap sebuah sistem yang dilakukan oleh ahli desain antarmuka untuk mengidentifikasi permasalahan (Galitz 2007). Pada heuristic evaluation, antarmuka diberikan penilaian dengan beberapa prinsip usability yang dikenali.
1. Profil Pengguna
METODE PENELITIAN Metode yang digunakan dalam penelitian ini merujuk pada usability engineering lifecycle (Mayhew 1999) untuk aplikasi sederhana yang dapat dilihat pada Gambar 1. Secara garis besar, metode ini meliputi dua kegiatan utama yaitu analisis dan perancangan. Berikut penjelasan tiap tahap dari metode yang digunakan.
Profil pengguna adalah sebuah dokumen yang digunakan untuk mengidentifikasi kebutuhan dan tujuan dari sasaran kelompok pengguna. Pada tahap ini ditentukan pengguna sistem yang dibuat. Pengguna tersebut ditentukan berdasarkan persyaratan dan kriteria tertentu. Pengguna yang telah ditentukan tersebut diberikan kuisioner untuk mendukung analisis profil pengguna. Terdapat dua cara utama untuk memperoleh profil pengguna. Cara yang pertama adalah melakukan wawancara dengan orang yang berpengetahuan tentang calon pengguna. Dalam hal ini adalah pihak Humas IPB. Cara yang kedua adalah dengan melakukan penyebaran kuisioner. Hal yang perlu diperhatikan dalam penyusunan kuisioner adalah bagaimana menentukan kelompok pengguna secara jelas serta menyusun pertanyaan yang bisa menggali informasi seputar pengguna dan harapan pengguna terhadap aplikasi yang dikembangkan. Pada penelitian ini responden dibatasi pada mahasiswa S1 dan S2. 2. Tugas Kontekstual Pada tahap ini dilakukan analisis mengenai tugas pengguna yang berkaitan dengan aliran proses dan kerangka kerja. Analisis ini digunakan sebagai dasar untuk menentukan dan mengatur tujuan usability serta reorganisasi perancangan antarmuka. Penentuan aliran proses kerja disesuaikan dengan profil pengguna. 3. Tujuan Usability Pada tahap ini dirumuskan tujuan-tujuan kualitatif dan kuantitatif khusus yang menggambarkan kebutuhan usability. Perumusan dilakukan berdasarkan hasil analisis dari profil pengguna dan analisis tugas kontekstual. Tujuan usability ini lebih fokus terhadap kegiatan perancangan bentuk dasar untuk evaluasi. Mengingat sistem ini ditujukan bagi pengguna baru, maka tujuan utamanya yaitu easy-to-learn. 4. Kapabilitas Platform
Gambar 1 Usability Engineering Lifecycle (Mayhew 1999).
Tahapan ini dilakukan untuk menentukan platform yang sesuai dalam pengembangan Sistem Informasi Kehumasan IPB untuk memenuhi kebutuhan pengguna. Pada tahap ini juga dilakukan studi mengenai antarmuka
5
pengguna terhadap platform teknologi yang digunakan untuk produk. 5. Prinsip Perancangan Umum Pada tahap ini, yang dilakukan adalah meninjau dan memahami kembali prinsipprinsip desain antarmuka yang baik sesuai dengan analisis pada tahap-tahap sebelumnya. Selain itu, dilakukan evaluasi terhadap kelemahan-kelemahan yang berkaitan dengan navigasinya. B. Perancangan, Pengujian, dan Pengembangan 1. Perancangan Ulang Tahap ini adalah tahap perancangan ulang tugas pengguna pada tingkat organisasi dan aliran proses. Perancangan ulang ini berdasarkan semua data pada tahap analisis kebutuhan beserta tujuan usability-nya. Pada tahap ini tidak dilakukan perancangan antarmuka pengguna, hanya organisasi abstrak fungsionalitas dan perancangan aliran proses. 2. Desain Model Konseptual Pada tahap ini dilakukan proses sketsa desain. Aturan-aturan mengenai konsistensi kerja produk, proses, dan aksinya dibangun pada tahap ini. Selain itu, juga dilakukan identifikasi navigasi dan tampilan. Desain antarmuka layar secara rinci belum dilakukan di sini. 3. Screen Design Standards Pada tahap ini dilakukan proses desain antarmuka sistem berdasarkan evaluasi pada langkah sebelumnya. Antarmuka yang dibangun adalah antarmuka berdasarkan kebutuhan pengguna. 4. Desain Antarmuka Detail Pada tahapan ini didefinisikan serta dilakukan pula proses dokumentasi perancangan berdasarkan pada desain model konseptual serta screen design standard yang dibangun pada tugas sebelumnya sehingga alur, tampilan, serta interaksi yang dirancang mengikuti standard antarmuka pengguna yang telah dibuat pada tugas sebelumnya. 5. Evaluasi Antarmuka Detail Tahap ini adalah langkah untuk melakukan evaluasi terhadap rancangan antarmuka yang telah dibuat. Evaluasi ini digunakan untuk menentukan keberhasilan tujuan usability yang telah ditentukan sebelumnya. Evaluasi pada tahapan ini dapat dilakukan dengan
menggunakan heuristic evaluation atau dievaluasi langsung oleh seorang ahli desain antamuka. C. Instalasi User Feedback Tujuan dari tahap ini adalah memperoleh data usability setelah produk selesai terpasang (installed) dan digunakan serta untuk memperoleh informasi mengenai desain antarmuka pengembangan produk lebih lanjut. User feedback dapat diperoleh dengan menerapkan salah satu teknik evaluasi dari pengguna ahli seperti formal usability testing, kuisioner, wawancara, fokus grup, serta usage studies. HASIL DAN PEMBAHASAN A. Analisis Kebutuhan 1. Profil Pengguna Sebagaimana yang telah dijelaskan bahwa terdapat dua cara untuk memperoleh profil pegguna, yaitu dengan metode wawancara serta penyebaran kuisioner. Kedua cara tersebut telah ditempuh dalam penelitian ini. Tahap pertama yang dilakukan adalah teknik wawancara. Wawancara singkat telah dilakukan dengan Kepala Bidang Humas dan Protokoler IPB, Ibu Ir. Henny Windarti, M.Si. Pada wawancara tersebut, diperoleh hasil bahwa target pengguna merupakan masyarakat luas yang berkujung ke IPB. Pada wawancara tersebut juga diperoleh beberapa fasilitas yang seharusnya terdapat pada aplikasi touch screen tersebut, seperti galeri foto, video, agenda kegiatan IPB, profil IPB, organisasi IPB, unit administrasi IPB, informasi seputar fakultas, serta beberapa produk unggulan IPB. Sedangkan teknik yang kedua yaitu penyebaran kuisioner juga telah dilakukan. Kuisioner tersebut bertujuan untuk menggali informasi yang diperlukan. Contoh kuisioner tersebut dapat dilihat pada Lampiran 1. Setelah kuisioner dibagikan, kemudian dianalisis untuk memperoleh profil pengguna. Hasil analisis profil pengguna berdasarkan kuisioner dapat dilihat pada Tabel 1. Dari Tabel 1 terlihat bahwa responden mengunjungi rektorat untuk keperluan administrasi serta untuk memperoleh informasi seputar kampus. Selain itu, dari kuisioner yang dibagikan diperoleh data bahwa informasi yang diharapkan berupa agenda kegiatan IPB, agenda pimpinan, serta informasi umum seputar IPB.
6
Tabel 1 Data dan analisis profil pengguna No
Pertanyaan
1 Jenis kelamin? 2 Pekerjaan? 3
Penguasaan Komputer?
Alasan 4 mendatangi rektorat? 5 Kidal? Pernah 6 menggunakan touch screen?
Informasi yang 7 dibutuhkan seputar IPB?
Jawaban
2. Analisis Tugas Kontekstual
Jmlh %
Laki-laki Perempuan Mahasiswa S1 Mahasiswa S2 Kurang Cukup Baik Administrasi Cari Informasi Lain-lain Ya Tidak
10 10 14 6 0 12 8 12 9 7 0 20
50 50 70 30 0 60 40 43 32 25 0 100
Ya
18
90
Tidak
2
10
Agenda pimpinan Kegiatan-kegiatan IPB Organigram pejabat IPB Profil IPB Alamat / kontak Lain-lain
4
12,5
5
15,6
3
9,4
7 8 5
21,9 25 15,6
Pengguna pada sistem ini merupakan masyarakat umum, namun pada perancangan sistem ini responden hanya dibatasi pada mahasiswa S1 dan mahasiswa S2. Selain itu, dari kusioner yang dibagikan diperoleh data bahwa pengguna memiliki kemampuan penguasaan komputer yang bisa dikategorikan cukup, serta rata-rata dari mereka menjawab pernah menggunakan aplikasi touch screen. Dari kuisioner tersebut juga diperoleh data bahwa pengguna tidak bertangan kidal, sehingga perlu diperhatikan navigasi yang sesuai. Dengan beberapa pertimbangan, sistem ini dibangun untuk mengakomodasi baik pengguna kidal ataupun tidak. Mengingat bahwa pengguna sistem ini merupakan pengguna baru, maka perlu diperhatikan tujuan dari pembangunan sistem ini yang menekankan pada pembangunan antarmuka yang easy-tolearn serta easy-to-remember. Dari kuisioner yang dibagikan diperoleh data karakteristik fisik pengguna yang dapat dilihat pada Tabel 2. Tabel 2 Karakteristik fisik pengguna Karakteristik fisik
Tingkat
Usia
19-40 tahun
Jenis Kelamin
Pria dan wanita
Penggunaan tangan
Tangan kanan
Berdasarkan profil pengguna, diperoleh rancangan alur kerja tugas dan koleksi data pengamatan tugas yang dapat dilihat pada Tabel 3. Dari data tersebut dapat diamati perilaku pengguna dalam memperoleh informasi yang diperlukan. Adapun alur kerja tugas yang dilakukan untuk keperluan navigasi adalah sebagai berikut: a. Melihat agenda IPB serta pimpinan IPB. Kegiatan ini bertujuan untuk mengamati kemudahan navigasi pengguna dalam memperoleh informasi agenda di IPB maupun agenda para pimpinan. Untuk mengurangi tahapan yang harus dilakukan pengguna, maka cara mengakses agenda adalah dengan memilih menu „Agenda‟, menentukan pilihan agenda, kemudian pilih tanggal tertentu untuk melihat agenda pada tanggal tersebut. b. Melihat dokumentasi seputar IPB berupa video-video serta foto-foto seputar IPB. Kegiatan ini bertujuan untuk mengamati apakah pengguna dapat memutar video (play) serta melihat foto-foto kegiatan. Untuk mengakses menu ini, pilih menu „Galeri‟ pada halaman beranda. Untuk masuk ke menu video, pilih menu „Video‟. Kemudian pilih video yang akan diputar dari playlist yang tersedia. Untuk masuk ke menu gambar, pilih menu „Gambar‟, kemudian sentuh thumbnail untuk melihat foto dengan ukuran lebih besar. c. Melihat informasi seputar fakultas serta produk unggulan IPB. Menu ini dapat diakses dengan memilih menu „Fakultas dan Produk‟. Untuk melihat informasi fakultas, pilih menu „Fakultas‟, kemudian pilih fakultas yang dituju. Untuk melihat informasi mengenai produk unggulan IPB, pilih menu „Produk‟, kemudian sentuh thumbnail untuk melihat informasi produk lebih detail. d. Melihat struktur organisasi IPB yang dibatasi hanya pada alamat, nomor telepon, serta alamat e-mail direktorat dan kantor di bawah rektor, wakil rektor bidang akademik dan kemahasiswaan, wakil rektor bidang sumberdaya dan pengembangan, wakil rektor bidang riset dan kerjasama, serta wakil rektor bidang bisnis dan komunikasi. Menu ini dapat diakses dengan memilih menu „Tentang‟, kemudian pilih menu „Organisasi‟. Sentuh thumbnail untuk melihat informasi kontak yang dapat dihubungi.
7
Tabel 3 Koleksi data pengamatan tugas Aktor (pengguna) Umum
Trigger
Use case (tugas)
Melihat agenda pimpinan
Bertanya ke sekretariat pimpinan
1. Pergi ke sekretariat pimpinan 2. Melihat papan agenda pimpinan 3. Bertanya pada sekretaris pimpinan
Mengunjungi situs IPB
1. Mengetikkan alamat situs Banyak masyarakat luas IPB (http://smap.ipb.ac.id/) yang tidak mengetahui 2. Memilih menu pencarian mengenai situs tersebut agenda Pengguna bingung 3. Mengisi form pencarian memilih menu Pengguna bingung mengisi form Agenda tidak update Salah mengetikkan alamat
Melihat informasi fakultas
Mengunjungi situs IPB
1. Mengetikkan alamat situs IPB (http://ipb.ac.id/) 2. Memilih menu “Education” 3. Memilih informasi yang diinginkan
Pengguna bingung memilih menu Salah mengetikkan alamat
Melihat informasi produk unggulan IPB
Mengunjungi situs IPB
1. Mengetikkan alamat situs IPB (http://ipb.ac.id) 2. Memilih menu “Database penelitian” 3. Mengisi form 4. Memilih menu “Produk Unggulan”
Pengguna bingung memilih menu Salah mengetikkan alamat
Melihat struktur organisasi IPB
Mengunjungi situs IPB
1. Mengetikkan alamat situs IPB (http://ipb.ac.id) 2. Memilih menu “About IPB” 3. Memilih menu “Organizational Structure”
Pengguna bingung memilih menu Salah mengetikkan alamat
Melihat profil IPB
Mengunjungi situs IPB
1. Mengetikkan alamat situs IPB (http://ipb.ac.id) 2. Memilih menu “About IPB”
Pengguna bingung memilih menu Salah mengetikkan alamat
Urutan skenario tugas
Kesalahan, masalah, dan komentar Tidak mengetahui ruang sekretariat pimpinan
8
e. Melihat profil IPB yang dibatasi pada visi dan misi, tujuan dan motto, serta lambang dan bendera IPB. Untuk mengakses menu ini, pilih menu „Tentang‟, kemudian pilih menu „Profil‟. Sentuh tab yang tersedia untuk melihat informasi tertentu seputar IPB. 3. Tujuan Usability Tujuan utama pembangunan sistem informasi ini adalah easy to learn, yaitu antarmuka penguna dibuat mudah untuk dipelajari dan tidak membuat pengguna mengingat urutan-urutan yang benar untuk menyelesaikan tugasnya. Adapun tujuan kualitatif yang diperoleh adalah sebagai berikut: Memudahkan navigasi. Memberikan user experience yang menyenangkan bagi pengguna. Mempercepat alur kerja. 4. Kapabilitas platform Perancangan dan pembangunan sistem informasi ini menggunakan sistem operasi Microsoft Windows dengan pertimbangan bahwa sistem ini akan dipasang pada sistem operasi tersebut. Adapun kemampuan dan batasan yang didefinisikan adalah sebagai berikut: Ukuran dan resolusi layar Sistem ini dibangun khusus untuk dipasang pada layar beresolusi 1280 x 960 pixel. Perancangan ukuran halaman yang kurang tepat akan menyebabkan terjadinya scrolling. Input devices Pengembangan aplikasi ini ditujukan khusus untuk touch screen, oleh karena itu perlu diperhatikan aspek-aspek yang dapat berpengaruh terhadap perancangan antarmuka produk. Seperti yang telah dijelaskan pada bagian tinjauan pustaka bahwa terdapat empat jenis touch screen. Aplikasi ini ditujukan khusus untuk touch screen jenis capacitive screen yang cocok untuk digunakan dalam berbagai keperluan interaksi publik. Plugin Sistem ini memerlukan plugin flash player untuk memutar file video, karena secara default sistem operasi Microsoft Windows tidak menyediakan plugin ini. Aplikasi ini juga memerlukan plugin Apple Quick Time agar bisa menjalankan fungsi suara ketika button disentuh.
Mozilla Firefox dan Mozilla Prism Sistem ini dijalankan pada browser Mozilla Firefox serta untuk mendukung mode full screen, maka diperlukan aplikasi Mozilla Prism yang dapat membuat sistem ini berjalan pada mode full screen. 5. Prinsip perancangan umum Pada perancangan sistem ini diperhatikan beberapa aspek dalam merancang desain antarmuka. Aspek-aspek yang dimaksud antara lain pemilihan teks, warna, suara, tombol, pengaturan navigasi, serta penggunaan scrolling. Petunjuk perancangan aplikasi ini merujuk pada pedoman perancangan antarmuka yang dapat dilihat pada bagian tinjauan pustaka pada bagian touch screen design guideline dan pada bagian komponen user interface. B. Desain, Pengujian, dan Pengembangan 1. Perancangan ulang Tahap ini tidak dilakukan karena tahap ini merupakan tahap rekayasa ulang, validasi, dan perbaikan dari tahap profil pengguna dan analisis tugas kontekstual yang telah dilakukan sebelumnya. 2. Desain model konseptual Berdasarkan analisis kebutuhan, kemudian akan dirancang antarmuka yang sesuai dengan tujuan pengguna. Perancangan aplikasi touch screen ini tentunya dititikberatkan pada kemudahan penggunaan karena rata-rata penggunanya adalah untrained user. Sketsa rancangan aplikasi dapat dilihat pada Gambar 2 dan Gambar 3. Di bawah ini adalah langkahlangkah perancangan model konseptual yang dilakukan: a. Pengaturan ruang dan tata letak Touch screen biasanya memiliki ukuran tetap (fixed size) dan pada sistem yang dibangun ini menggunakan ukuran layar beresolusi 1280 x 960 pixel. Selain itu pada aplikasi touch screen, tombol (button) yang digunakan juga memiliki ukuran dan jarak minimum untuk menjamin pengoperasian menggunakan jari. Ukuran minimum pada button sebesar ¾ x ¾ inch, sedangkan jarak minimum antar button sebesar ¼ inch. Mengingat sistem ini dibangun untuk touch screen, maka tata letaknya juga dilakukan dengan cara yang berbeda. Hal yang diperhatikan adalah mengidentifikasi pengelompokan fungsi elemen-elemen yang diletakkan berdekatan dan mengelompokkannya ke dalam functional areas, seperti: - Data display
9
-
Data input atau data selection Grouping of function keys Numerical or text keypad Status display
Tabel 4 Screen design standard
b. Perancangan antarmuka utama Perancangan antarmuka utama dilakukan berdasarkan pembagian ruang. Hal yang perlu diingat juga adalah touch screen tidak cocok untuk data entry serta hindari penggunaan scrolling yang tidak menerapkan point-click, dengan kata lain pengguna diharuskan menahan scroll dan menggesernya secara vertikal maupun horizontal untuk melakukan operasi scrolling.
HEADER
No
Konten menu
Jenis kontrol
1
Aksi navigasi
Push button
2
Aksi scrolling
Scrolling button
3
Teks informasi
Text block
4
Informasi detail
Pop up
4. Desain Antarmuka Detail Berdasarkan tahap conceptual model design dan screen design standards, yang dilakukan pada tahap ini adalah menggabungkan kedua tahap tersebut dengan menerapkan prinsipprinsip perancangan umum. Tampilan halaman aplikasi dapat dilihat pada Lampiran 2. Pengaturan ruang dan tata letak
BUTTON
BUTTON
BUTTON
BUTTON
BUTTON
Gambar 2 Konsep pembagian ruang untuk halaman utama.
Aplikasi touch screen ini dirancang khusus untuk layar beresolusi 1280 x 960 pixel. Secara keseluruhan, halaman pada aplikasi ini terbagi menjadi tiga bagian yaitu header yang berfungsi sebagai navigasi untuk mengetahui menu yang sedang diakses, content yang merupakan isi, serta button untuk menampilkan menu bantuan, kembali (kembali ke halaman sebelumnya), dan beranda (kembali ke halaman utama). Teks
HEADER
Sebagaimana yang telah diuraikan pada bagian tinjauan pustaka bahwa penggunaan teks pada GUI sebaiknya menggunakan tipe font face sans-serif yang beresolusi lebih rendah dan lebih mudah dibaca. Atas pertimbangan itulah, sistem informasi ini menggunakan font face sans- serif.
CONTENT
Warna BUTTON
BUTTON
Gambar 3 Konsep pembagian ruang untuk halaman lainnya (halaman isi). 3. Screen design standards Tujuan dari screen design standard adalah untuk memastikan konsistensi serta kesederhanaan pada perancangan detail keseluruhan antarmuka suatu produk. Konsisten tidak hanya berkaitan dengan easy-to-learn atau easy-to-remember tapi juga easy-to-use. Pengguna mengharapkan konsistensi pada aplikasi dan cenderung akan melakukan kesalahan jika terjadi inkonsistensi. Beberapa standar yang digunakan dapat dilihat pada Tabel 4.
Sebagaimana yang telah disebutkan pada tips pengembangan aplikasi touch screen yang menyebutkan bahwa warna background yang cerah dapat mengurangi pantulan cahaya serta dapat menyembunyikan sidik jari. Atas pertimbangan tersebut, maka aplikasi yang dibangun ini pun dirancang dengan menggunakan komposisi background yang lebih terang dengan foreground lebih gelap. Tingkat kemampuan baca dengan beberapa kombinasi warna teks dan background dapat dilihat pada Tabel 5. Pengembangan aplikasi ini menerapkan teknik positive text, yaitu menggunakan teks berwarna gelap serta latar berwarna terang. Sedangkan pada komponen GUI lainnnya
10
didominasi warna biru. Hal ini didasari oleh lambang IPB yang memiliki warna dasar biru. Tabel 5 Tingkat kemampuan baca dengan kombinasi warna berbeda Kombinasi warna Teks hitam pada background putih
Tingkat baca Tinggi: nilai kontras tertinggi. Perbedaan yang tampak tinggi.
Teks biru pada background putih
Tinggi: perbedaan yang tampak tinggi, selama menggunakan biru tua.
Teks hitam pada background abu-abu
Sedang: perbedaan yang tampak antara sedang menuju tinggi bergantung pada kombinasi warna dan saturation level.
Teks putih pada background biru
Tombol Tombol pada perancangan sistem ini sengaja dibuat berukuran besar serta kelihatan agak timbul. Dengan tombol yang semacam itu diharapkan dapat meningkatkan dugaan sehingga pengguna dapat berinteraksi dengan baik. Pada aplikasi touch screen ini, terdapat beberapa tombol yang digunakan seperti yang ditunjukkan pada Tabel 6. Tabel 6 Jenis-jenis tombol Tombol
Tombol utama
“Has been activated” button pada menu Agenda “Will be activated” button pada menu Agenda
Rendah: susah dibaca.
Teks abu-abu pada background putih
Rendah: nilai kontras rendah. Perbedaan yang tampak rendah.
Teks putih pada background abu-abu
Rendah: nilai kontras rendah. Perbedaan yang tampak rendah.
Teks merah pada background biru
Sangat rendah: kombinasi warna bercetak tebal tertentu membetunk efek berbayang, melelahkan mata.
Teks merah pada background hitam
Sangat rendah: kombinasi warna bercetak tebal tertentu membetunk efek berbayang, melelahkan mata.
Fungsi
Tombol default pada menu Agenda Tombol untuk kembali ke halaman utama
Tombol untuk masuk ke pilihan fakultas pada menu Fakultas
Selain itu, pada aplikasi ini juga terdapat thumbnail buttons, yaitu gambar yang clickable berfungsi untuk preview gambar (pada menu gambar dan produk) atau sebagai tombol untuk memproses menu yang dituju (pada menu organisasi). Thumbnail buttons dapat dilihat pada Tabel 7.
Suara
Navigasi
Untuk memberikan feedback pada pengguna, maka saat pengguna melakukan aksi (menyentuh tombol) akan disertai suara untuk meyakinkan pengguna bahwa proses sedang berlangsung atau sudah sukses dilakukan.
Untuk memberi tahu dimana posisi pengguna saat ini serta untuk mempermudah menuju halaman tertentu, tentunya diperlukan navigasi. Hal ini ditunjukkan oleh header pada tiap halaman yang menunjukkan posisi pengguna. Pada aplikasi ini, telah dirancang navigasi yang dapat dilihat pada Tabel 8.
11
Tabel 7 Jenis-jenis thumbnail button Thumbnail buttons
Lokasi (menu) Gambar
Mengingat aplikasi touch screen dijalankan pada full screen mode, maka scrolling sangat penting untuk dihindari, baik itu vertical maupun horizontal scrolling. Namun karena informasi yang akan diberikan relatif banyak, maka salah satu solusinya adalah dengan membuat scroll button seperti terlihat pada Tabel 9. Tabel 9 Jenis-jenis scroll button Scroll button
Fungsi
Produk Scroll button pada menu Video Scroll button pada menu Produk
Organisasi Scroll button pada menu Fakultas
Scroll button pada menu Organisasi
Tabel 8 Navigasi Navigasi
Fungsi menunjukkan welcome screen menunjukkan posisi pada tiaptiap menu kembali ke welcome screen (home) serta untuk kembali ke posisi sebelumnya (back)
Scrolling Perancangan antarmuka sistem informasi ini menekankan pada minimalisasi scrolling. Untuk memenuhi tujuan tersebut, maka resolusi layar yang dipakai harus 1280 x 960 pixel karena aplikasi ini akan dipasang pada layar beresolusi 1280 x 960 pixel serta pada sistem ini informasi yang ditampilkan diharapkan tidak berlebihan namun cukup untuk memenuhi kebutuhan pengguna akan informasi seputar IPB.
Scroll button pada pop-up menu Gambar
5. Evaluasi Antarmuka Detail Evaluasi pada tahapan ini hanya seputar masalah sederhana seperti masalah-masalah kosmetik (hiasan) pada rancangan antarmuka. Sebagaimana yang telah disebutkan pada bagian metode penelitian bahwa tahapan ini bisa dilakukan menggunakan heuristic evaluation atau bisa juga menggunakan evaluasi secara langsung oleh seorang ahli desain antarmuka. Evaluasi yang dilakukan pada penelitian ini menggunakan metode heuristic evaluation yang dilakukan oleh enam mahasiswa Departemen Ilmu Komputer. Keenam evaluator menguji sistem kemudian mengisi checklist HE yang dapat dilihat pada Lampiran 3. Hasil lengkap HE dapat dilihat pada Lampiran 4. Dari hasil checklist tersebut, dilakukan penghitungan tingkat kesesuaian antarmuka dengan standar dalam HE. Tabel 10 menunjukkan hasil perhitungan heurisic evaluation.
12
Tabel 10 Hasil perhitungan heuristic evaluation Poin evaluasi 1. Visibility system of status
Persentase kesesuaian
fungsionalitas sistem. Deskripsi dan hasil uji sistem dapat dilihat pada Lampiran 8 dan 9.
88.09%
2. Match between system and the real world
100%
3. User control and freedom
87,5%
4. Consistency and standards
81,94%
5. Help user recognize, diagnose, and recover from errors
83,33%
6. Error prevention
72,22%
7. Recognition rather than call
90,91%
8. Flexibility
100%
Gambar 4 Topologi instalasi sistem.
9. Aesthetic and minimalist design
91,67
Sistem Informasi Kehumasan IPB ini telah di-install pada media touch screen di Kampus Progam Pascasarjana Manajemen dan Bisnis IPB (MB-IPB). Dokumentasi pemasangan aplikasi ini dapat dilihat pada Gambar 5.
10. Help and documentation
78,57%
C. Instalasi Sistem Informasi Kehumasan IPB dibangun berbasis web. Hal ini ditujukan agar informasi yang disajikan bersifat dinamis (dapat dilakukan update informasi dengan mudah), kemudahan dalam instalasi (hanya memerlukan browser untuk menjalankan aplikasi), serta dengan pertimbangan skalabilitas (aplikasi dapat dipasang dimana pun dengan catatan terhubung pada jaringan IPB). Sistem ini terbagi ke dalam tiga bagian yaitu server aplikasi, touch screen client, dan panel administrator. Server aplikasi merupakan tempat database disimpan, touch screen client merupakan tempat aplikasi desktop dipasang atau dengan kata lain merupakan aplikasi yang dapat diakses langsung oleh pengguna (telah dipasang pada media touch screen), serta administrator yang merupakan panel untuk meng-update informasi yang ingin ditampilkan. Pada panel ini dapat dilakukan update agenda, foto, video, dan produk serta dapat dilakukan pula beberapa operasi manipulasi sederhana seperti tambah, upload, edit, dan hapus. Tampilan panel administrator tersebut dapat dilihat pada Lampiran 5. Topologi instalasi sistem informasi ini dapat dilihat pada Gambar 4. Untuk menjamin keberhasilan kerja sistem, maka dilakukan beberapa uji sistem baik uji panel administrator maupun uji aplikasi touch screen client. Pengujian yang dilakukan pada panel administrator menggunakan teknik blackbox, yang hanya berfokus pada
Gambar 5 Instalasi Sistem Informasi Kehumasan IPB. User Feedback Setelah aplikasi yang dibangun mendapat persetujuan untuk melakukan uji sistem, maka aplikasi Sistem Informasi Kehumasan IPB diinstall pada media touch screen yang terdapat di Kampus MB-IPB. Uji aplikasi ini dilakukan untuk memperoleh user feedback dari pengguna aplikasi. Metode yang dilakukan untuk memperoleh user feedback yaitu penyebaran kuisioner. Sesuai dengan tujuan usability pada sistem yang dibuat, yaitu easy to learn maka fokus
13
pengujian hanya pada pengguna baru. Kuisioner yang dibagikan mengikuti Computer System Usability Questionnaire (CSUQ) yang dapat dilihat pada Lampiran 6. Sistem yang telah di-install diujikan kepada 31 orang responden. Hasil dari kuisioner tersebut dapat dilihat pada Lampiran 7. Skala penilaian berkisar dari 1 sampai 7. Semakin tinggi nilai yang diperoleh menunjukkan semakin bagus hasil penilaian pengguna terhadap sistem. Dari Lampiran 7 dapat diketahui nilai mean, median, mode, standard deviation, confidence level, upper, serta lower hasil pengujian sistem. Hal pertama yang harus diperhatikan ketika menghitung nilai statistik deskriptif adalah mengukur tingkat kecenderungan suatu nilai terhadap titik tengah. Ketiga hal umum yang harus dihitung antara lain mean, median, dan mode. Kuisioner CSUQ yang digunakan dapat dibagi ke dalam empat atribut, antara lain system usefulness (SYSUSE), information quality (INFOQUAL), interface quality (INTQUAL), dan overall satisfaction (OVERALL). Dari Lampiran 7 dapat dilihat bahwa nilai masing-masing atribut yang diperoleh adalah SYSUSE = 5,69, INFOQUAL = 5,39, INTQUAL = 5,20, dan OVERALL = 5,48. Hasil perhitungan kuisioner menunjukkan bahwa nilai mean dari setiap pertanyaan melebihi nilai tengah. Dengan kata lain responden merasa puas dengan sistem yang dibangun. Yang menjadi perhatian lebih adalah pertanyaan kuisioner nomor 12 yang menanyakan tentang fitur (fungsi) yang diharapkan pada sistem. Pada nomor tersebut nilai mean yang diperoleh adalah 5,00 (nilai mean terendah). Faktor-faktor yang dapat mempengaruhi hal tersebut adalah sebagian besar responden yang merupakan mahasiswa MB-IPB mengharapkan adanya fitur jurnal serta terdapat fitur search pada sistem. Nilai mean pada pertanyaan kuisioner nomor 2 memperoleh nilai tertinggi yaitu sebesar 6,10. Hal yang ditanyakan pada nomor tersebut mengenai penggunaan sistem yang sederhana. Faktor yang dapat mempengaruhi tingginya nilai tersebut adalah pembangunan sistem memperhatikan usability yang dikhususkan bagi pengguna baru serta penerapan antarmuka point-click memudahkan pengguna untuk berinteraksi dengan sistem secara langsung.
KESIMPULAN DAN SARAN Kesimpulan Kebutuhan akan informasi menjadi hal yang penting dewasa ini. IPB sebagai salah satu perguruan tinggi terkemuka di Indonesia memiliki informasi yang dibutuhkan masyarakat luas. Oleh karena itu, penelitian ini dilakukan untuk membantu penyebarluasan informasi bagi pengguna yang sedang berada di lokasi kampus. Penelitian ini juga bertujuan untuk membangun sebuah sistem informasi yang user friendly. Pada penelitian ini digunakan metode usability engineering lifecycle yang memperhatikan usability pada perancangan sistem selama pengembangan sistem. Sistem ini diimplementasikan pada media touch screen yang lebih interaktif dibandingkan dengan komputer atau laptop yang masih menggunakan mouse dan keyboard (konvensional). Selain itu, sistem ini dibangun lebih sederhana sehingga memudahkan penggunaan aplikasi khususnya bagi pengguna baru. Pembangunan Sistem Informasi Kehumasan IPB pada penelitian ini telah berhasil mencapai usability yang baik. Hal ini dapat ditunjukkan dari hasil analisis kuisioner CSUQ yang dibagikan kepada 31 responden. Dari skala penilaian berkisar 1 sampai 7, sistem ini mendapatkan nilai kepuasan secara keseluruhan (OVERALL) sebesar 5,48, serta memperoleh nilai untuk masing-masing atribut, yaitu system usefulness (SYSUSE) = 5,69, information quality (INFOQUAL) = 5,39, serta interface quality (INTQUAL) = 5,20. Saran Pada penelitian selanjutnya diharapkan dapat memperbanyak konten sistem. Hal ini dikarenakan, dari kuisioner yang dibagikan banyak diperoleh kritik dan saran untuk menambah informasi seputar kampus IPB lebih luas lagi. Pada penelitian selanjutnya juga perlu diperhatikan tentang perangkat penyampaian informasi. Media touch screen yang kurang sensitif terhadap sentuhan menyebabkan ketidaknyamanan pada penggunaan sistem. Pengguna harus mengeluarkan tenaga ekstra dan berkali-kali menyentuh layar untuk mengakses suatu menu. Akibatnya, banyak pengguna yang mengeluhkan hal tersebut.
14
DAFTAR PUSTAKA Bjornskiold F, Johansson R. 2008. Touchscreen GUI Design and Evaluation of an OnDevice Portal. Sweden: Umea University. Galitz WO. 2007. The Essential Guide to User Interface Design: An Introduction to GUI Design Principles and Techniques. Ed ke-3. Indiana: Wiley Publishing Inc. Laudon K, Laudon J. 2006. Management Information System: Managing Digital Firm. New Jersey: Pearson/Prentice Hall. Mayhew DJ. 1999. The Usability Engineering Lifecycle: A Practitioner’s Handbook for User Interface Design. San Fransisco: Morgan Kaufmann Publisher. Nielsen J, Loranger H. 2006. Prioritizing Web Usability. Barkeley: New Riders. Nordgren P. 2007. Development of a touch screen interface for Scania Interactor. Sweden: Umea University. Seffah Ahmed, Metzker E. 2009. Adoptioncentric Usability Engineering. London: Springer. Stone D, Jarett C. 2005. User Interface Design and Evaluation. UK: Elsevier Inc. Tullis T, Albert B. 2008. Measuring the User Experience: Collecting, Analyzing, and Presenting Usability Metrics. San Fransisco: Morgan Kaufmann Publisher.
15
LAMPIRAN
Lampiran 1 Kuisioner (profil pengguna) Kuisioner ini dibagikan untuk keperluan menyusun skripsi dengan judul “Rekayasa Kebergunan pada Sistem Informasi Kehumasan IPB” Ilmu Komputer – Institut Pertanian Bogor
Nama
:
Jenis Kelamin*
:
Pekerjaan**
:
Laki-laki / Perempuan
1.
Apa tujuan Anda mendatangi rektorat? Jawaban :
2.
Penguasaan Komputer Kurang
3.
tahun
Baik
Tidak
Apakah Anda pernah menggunakan touch screen? Ya
5.
:
Apakah Anda kidal? Ya
4.
Cukup
Umur
Tidak
Alasan Anda mendatangi rektorat Jawaban :
6.
Jika Anda mendatangi rektorat dan menjumpai touch screen yang akan memberikan informasi seputar IPB, informasi apa sajakah yang Anda harapkan? Jawaban :
Terima Kasih * **
: coret yang tidak perlu : Jika Anda seorang mahasiswa/i, sebutkan program studi Anda beserta tahun masuk
17
Lampiran 2 Tampilan Sistem Informasi Kehumasan IPB
Welcome screen
Halaman Agenda (pop-up)
Halama Video
Halaman Fakultas & Produk
Halaman Agenda
Halaman Galeri
Halaman Gambar
Halaman Fakultas (awal)
18
Halaman Fakultas (detail)
Halaman Tentang
Halaman Organisasi
Halaman Produk
Halaman Organisasi
Halaman Profil
19
Lampiran 3 Heuristic evaluation checklist HEURISTIC EVALUATION Evaluator _________________________________________ 1
Tanggal __________________
Visibility of system status Sistem Memberikan informasi apa yang sedang terjadi melalui feedback dengan waktu yang sesuai (reasonable time).
#
Review Checklist
1.1
Apakah semua tampilan dimulai dengan judul atau header yang menggambarkan konten?
1.2
Apakah terdapat konsistensi desain ikon dan style pada sistem?
1.3 1.4 1.5 1.6
Apakah selected icon yang berada di sekitar unselected icon dapat dibedakan? Adakah feedback yang diberikan sistem setiap kali sebuah aksi dilakukan? Setelah pengguna menyelesaikan suatu tahap, apakah ada feedback yang memberikan indikasi bahwa tahap berikutnya dapat dilakukan? Adakah feedback visual pada saat suatu objek dipilih?
1.7
Apakah current status ikon dapat dilihat dengan jelas?
1.8
Jika terdapat delay (lebih dari 15 detik) pada sistem, apakah user diberi tahu bahwa sistem sedang bekerja? Pengguna harus mengingat suatu informasi dalam waktu kurang dari 2 detik. Tidak diperlukan konsentrasi tinggi serta tidak diperlukan mengingat informasi : 2 - 15 detik. Apakah penamaan menu konsisten dengan tugas pengguna?
1.9 1.10 1.11 1.12 1.13
Apakah sistem menyediakan visibility: dengan melihat saja pengguna dapat mengenali aksi yang harus dilakukan. Apakah GUI menunjukkan suatu pilihan telah dibuat?
1.14
Apakah GUI menunjukkan pilihan yang telah dibuat dapat di-deselect?
Yes
No
N/A
Komentar : 2
Match between system and the real world Sistem berkomunikasi menggunakan user's language, melalui kata-kata, frase, dan konsep yang familiar, bukan melalui bahasa yang bersifat teknis.
#
Review Checklist
2.1
Apakah icon-icon jelas dan familiar?
2.2
Apakah menu dikelompokkan sesuai dengan langkah kerja sebenarnya?
2.3
Jika bentuk-bentuk dipilih sebagai tanda-tanda visual dalam sistem, apakah bentuk tersebut dapat dikenali dan sesuai dengan fungsinya?
2.4
Apakah pemilihan menu sudah berada pada kategori yang sesuai (dapat dipahami)? Apakah jargon-jargon yang dipilih menggunakan bahasa manusia dan menghindari bahasa teknis komputer? Apakah nama perintah spesifik?
2.5 2.6
Yes
No
N/A
20
Komentar : 3
User control and freedom User memiliki kebebasan untuk memilih urutan task (when appropriate), daripada sistem yang melakukan untuk user. Jika user memilih fungsi secara tidak sengaja (yang tidak diinginkan), user dapat memperbaikinya dengan mudah.
#
Review Checklist
3,1
Ketika suatu task selesai, apakah sistem menunggu sinyal dari pengguna sebelum melakukan proses?
3.2
Jika sistem memiliki multiple menu, adakah mekanisme untuk kembali ke menu sebelumnya?
3.3
Jika pengguna dapat kembali ke menu sebelumnya, dapatkah pengguna mengubah pilihan-pilihan pada menu sebelumnya tersebut?
3.4
Apakah pengguna dapat mengulang aksi yang dilakukan dengan mudah?
Yes
No
N/A
Komentar : 4
Consistency and standards User sebaiknya tidak dibingungkan dengan kata-kata, situasi dan aksi yang berbeda namun memiliki arti sama.
#
Review Checklist
4,1
Apakah penggunaan banyak huruf kapital / kata-kata dengan huruf besar semua telah dihindari?
4.2
Apakah ikon memiliki label?
4.3
Ikon tidak lebih dari 12-20 macam?
4.4
Adakah tanda visual yang jelas untuk mengidentifikasi active window?
4.5
Apakah setiap window memiliki title?
4.6 4.6
Jika 'close' merupakan sebuah pilihan, apakah menu tersebut selalu tampak di pojok kanan atas? Apakah struktur menu sesuai dengan struktur task?
4.7
Apakah title menu rata tengah atau rata kiri?
4.8
Apakah teknik "menarik perhatian" dilakukan?
4.9
Apakah tidak ada lebih dari empat jenis warna yang dominan dan warna-warna tersebut tidak senada?
4.10
Apakah aksi-aksi yang dapat dilakukan memiliki nama yang konsisten?
4.11
Apakah warna-warna terang digunakan untuk menarik perhatian pengguna?
Yes
No
N/A
Komentar :
21
5
Help user recognize, diagnose, and recover from errors Petunjuk diungkapkan dengan bahasa yang sederhana.
#
Review Checklist
5.1
Apakah petunjuk bersifat membangun, tanpa bermaksud mengkritik pengguna?
5.2
Apakah petunjuk disebutkan dengan jelas dan tidak ambigu?
5.3
Apakah bahasa yang digunakan menghindari non-Indonesia?
Yes
No
N/A
Yes
No
N/A
Komentar : 6
Error prevention Mengedapankan dalam menghindari kesalahan yang mungkin terjadi.
#
Review Checklist
6.1
Apakah sistem menghindarkan pengguna dari melakukan kesalahan?
6.2
Apakah pemilihan menu pada level yang lebih tinggi digunakan sebagai title pada menu di bawahnya?
6.3
Apakah pemilihan menu logis, khusus, dan satu sama lain berbeda?
Komentar : 7
Recognition rather than recall Membuat objek, aksi, dan pilihan visible. User tidak perlu mengingat-ingat informasi dari satu bagian ke bagian yang lain. Petunjuk penggunaan sistem visible.
#
Review Checklist
7.1
Apakah tampilan dimulai dari kiri atas?
7.2
Apakah data yang tampil berurutan?
7.3
Apakah text area memiliki "breathing space" di sekitarnya?
7.4
Apakah teks mudah dibaca?
7.5
Apakah white space digunakan untuk memfokuskan mata pengguna ke posisi yang tepat?
7.6
Apakah item-item dikelompokkan ke dalam zona-zona tertentu dan dapat dibedakan satu zona dengan zona lain?
7.7
Apakah antara zona yang satu dengan yang lain terpisah?
7.8
Apakah warna yang digunakan untuk mengelompokkan elemen yang berhubungan sama?
7.9
Apakah penggunaan warna pada sistem konsisten?
7.10
Apakah inactive menu dapat dibedakan?
7.11
Adakah pilihan menu default?
Yes
No
N/A
Komentar :
22
8
Flexibility Penggunaan shortcut dapat mempercepat aksi yang dilakukan.
#
Review Checklist
8.1
Apakah terdapat shortcut untuk membantu navigasi?
8.2
Apakah shortcut yang diberikan dapat memenuhi kebutuhan pengguna?
Yes
No
N/A
Yes
No
N/A
Komentar : 9
Aesthetic and minimalist design Dialog tidak berisi informasi yang irrelevant atau jarang dibutuhkan.
#
Review Checklist
9.1
Apakah hanya informasi penting yang ditampilkan pada layar?
9.2
Semua ikon dapat dibedakan satu dengan yang lain?
9.3
Apakah objek besar dan garis tebal digunakan untuk membedakan ikon?
9.4
Apakah semua icon "keluar" dari background?
9.5
Apakah pilihan sub menu hanya berasosiasi dengan satu level menu yang lebih tinggi?
9.6
Apakah menu sudah cukup jelas (singkat)?
Komentar : 10
Help and documentation Walaupun sistem dapat digunakan lebih baik tanpa dokumentasi, namun kadang-kadang masih diperlukan untuk menyediakan bantuan dan dokumentasi.
#
Review Checklist
10.1
Apakah instruksi-instruksi dapat terlihat?
10.2
10.4
Apakah instruksi yang muncul mengikuti aksi yang dilakukan atau akan dilakukan pengguna? Jika ikon atau menu ambigu, apakah ada penjelasan tambahan pada ikon yang sedang terpilih? Apakah ada fungsi help?
10.5
Navigasi: Apakah informasi mudah ditemukan?
10.6
Presentasi: Apakah layout dirancang dengan baik?
10.7 10.8
Conversation: Apakah informasi yang diberikan utuh, akurat dan mudah dipahami? Goal oriented (apa yang saya dapat lakukan dengan sistem ini?)
10.9
Deskriptif (what is this thing for?)
10.3
Yes
No
N/A
10.10 Prosedural (bagaimana saya melakukan task ini?) 10.11 Navigational (where am I?) 10.12 Apakah pengguna dapat pindah dari halaman help dan melanjutkan pekerjaannya dengan mudah? 10.13 Apakah mudah mengakses help? 10.14 Apakah pengguna dapat me-resume pekerjaannya setelah melihat help?
23
Komentar :
---------------------------- TERIMA KASIH ----------------------------
24
Lampiran 4 Rekapitulasi hasil perhitungan heuristic evaluation # 1.
P1
P2
P3
P4
P5
Persentase kesesuaian
P6
Visibility system of status 1.1
1
1
1
1
1
1
1.2
1
1
1
1
1
1
1.3
1
1
1
1
1
3
1.4
1
1
1
1
1
2
1.5
1
1
1
1
1
3
1.6
1
1
1
1
1
1
1.7
1
1
1
1
1
1
1.8
1
1
2
2
2
3
1.9
1
1
1
2
1
2
1.10
1
1
1
1
1
1
1.11
1
1
1
1
1
1
1.12
1
1
1
1
1
1
1.13
1
1
1
1
1
1
1.14
1
1
1
1
1
2
2.
3.
4.
88,09%
Match between system and the real world 2.1
1
1
1
1
1
1
2.2
1
1
1
1
1
1
2.3
1
1
1
1
1
1
2.4
1
1
1
1
1
1
2.5
1
1
1
1
1
1
2.6
1
1
1
1
1
1
100%
User control and freedom 3.1
1
2
2
1
1
1
3.2
1
1
1
1
1
1
3.3
1
1
1
1
1
1
3.4
1
1
1
1
2
1
87,5%
Consistency and standards 4.1
1
1
2
1
1
1
4.2
1
1
1
1
1
1
4.3
2
1
1
1
1
1
4.4
1
1
1
1
1
3
4.5
1
3
1
1
3
1
4.6
1
2
2
2
3
2
81,94%
25
#
P1
P2
P3
P4
P5
Persentase kesesuaian
P6
4.7
1
3
1
1
1
1
4.8
1
1
1
1
1
1
4.9
1
1
1
1
1
1
4.10
1
1
1
1
1
1
4.11
1
1
1
1
1
1
4.12
1
2
2
1
1
1
5.
6.
7.
Help user recognize, diagnose, and recover from errors 5.1
1
1
1
2
1
1
5.2
1
1
1
1
1
1
5.3
1
1
2
2
1
1
Error prevention 6.1
1
1
1
1
2
3
6.2
1
1
2
2
1
1
6.3
1
1
1
1
1
2
1
3
1
1
1
2
7.2
1
1
1
1
1
1
7.3
1
1
1
1
1
1
7.4
1
1
1
1
1
1
7.5
1
1
1
1
1
1
7.6
1
1
1
1
1
1
7.7
1
1
1
1
1
1
7.8
1
1
1
1
1
1
7.9
1
1
1
1
1
1
7.10
1
3
1
1
1
1
7.11
2
1
2
1
1
2
8.1
1
1
1
1
1
1
8.2
1
1
1
1
1
1
9.
72,22%
Recognition rather than call 7.1
8.
83,33
90,91%
Flexibility 100%
Aesthetic and minimalist design 9.1
1
1
1
1
1
1
9.2
1
1
1
1
1
1
9.3
1
3
1
1
1
1
9.4
1
2
1
1
3
1
9.5
1
1
1
1
1
1
91,67%
26
# 9.6
P1
P2 1
P3
P4
P5
Persentase kesesuaian
P6
1
1
1
1
1
10. Help and documentation 10.1
1
1
1
1
1
1
10.2
1
1
1
1
1
1
10.3
3
2
1
1
2
1
10.4
1
1
1
2
1
1
10.5
1
1
2
1
1
1
10.6
1
1
1
1
1
1
10.7
1
1
1
1
1
1
10.8
1
1
1
1
1
1
10.9
1
3
1
1
1
1
10.10
1
3
1
1
1
1
10.11
1
1
1
1
1
3
10.12
1
1
2
2
2
1
10.13
1
1
2
2
1
2
10.14
1
2
2
2
1
2
78,57%
27
Lampiran 5 Tampilan halaman administrasi Sistem Informasi Kehumasan IPB
Halaman administrasi Agenda
Halaman administrasi Video
Halaman administrasi Agenda (tambah)
Halaman administrasi Video (tambah)
Halaman administrasi Gambar
Halaman administrasi Gambar (tambah)
Halaman administrasi Produk
Halaman administrasi Produk (tambah)
28
Lampiran 6 Kuisioner CSUQ (Computer System Usability Questionnaire) Kuisioner ini dibagikan untuk keperluan menyusun skripsi dengan judul “Rekayasa Kebergunaan pada Sistem Informasi Kehumasan IPB” Ilmu Komputer – Institut Pertanian Bogor Nama
:
Jenis Kelamin*
:
Pekerjaan**
:
Laki-laki / Perempuan
Umur
:
tahun
Setelah Anda menggunakan aplikasi tersebut, tolong isi pertanyaan-pertanyaan berikut. 1.
Berikan tingkat kepuasan Anda terhadap aplikasi tersebut! Hitamkan pada salah satu lingkaran. Tidak Setuju Sangat setuju Penilaian #
Evaluasi 1
1 2
Secara keseluruhan, Saya puas dengan kemudahan dalam menggunakan sistem ini Penggunaan sistem sederhana (tidak rumit)
3
Saya dapat menyelesaikan tugas dengan cepat
4
Saya merasa nyaman menggunakan sistem ini (tidak membingungkan) Sistem mudah dipelajari
5 6
8
Setiap kali saya membuat kesalahan menggunakan sistem ini, saya dengan cepat dan mudah dapat memperbaikinya Informasi (seperti agenda, video, foto, dan dokumentasi lainnya) yang disediakan sistem cukup jelas Mudah menemukan informasi yang dicari
9
Informasi yang tersedia mudah dimengerti
10
Pengelompokan informasi pada sistem dapat dipahami
11
Interface (antarmuka pengguna) sistem menarik
12
Sistem ini dilengkapi dengan fitur (fungsi) yang saya harapkan Secara keseluruhan, saya puas dengan sistem ini
7
13 2.
2
3
4
5
6
7
Berikan kritik dan saran Anda mengenai aplikasi ini!
Terima Kasih * **
: coret yang tidak perlu : Jika Anda seorang mahasiswa/i, sebutkan program studi Anda beserta tahun masuk
29
Lampiran 7 Penilaian pengguna terhadap sistem secara keseluruhan menggunakan kuisioner CSUQ Responden
Q1
Q2
Q3
Q4
Q5
Q6
Q7
Q8
Q9
Q10
Q11
Q12
Q13
SYSUSE INFOQUAL
INTERQUAL OVERALL
1
6
7
6
6
6
6
4
5
7
6
7
5
6
6,2
5,6
6,0
5,9
2
6
7
5
6
6
6
6
6
6
6
5
5
6
6,0
6,0
5,0
5,8
3
4
4
3
4
5
5
5
5
6
6
4
4
4
4,0
5,4
4,0
4,5
4
6
7
6
7
7
7
7
6
6
6
3
3
5
6,6
6,4
3,0
5,8
5
4
6
5
5
6
6
5
5
6
6
4
4
5
5,2
5,6
4,0
5,2
6
4
5
4
5
7
7
3
4
4
6
4
5
5
5,0
4,8
4,5
4,8
7
5
7
5
6
7
7
4
4
6
5
7
5
5
6,0
5,2
6,0
5,6
8
6
6
5
5
6
5
4
5
5
5
6
5
6
5,6
4,8
5,5
5,3
9
6
5
6
6
6
6
6
5
6
6
6
5
6
5,8
5,8
5,5
5,8
10
6
6
5
6
6
6
5
6
6
6
5
6
6
5,8
5,8
5,5
5,8
11
5
6
6
5
5
4
4
4
5
6
4
3
5
5,4
4,6
3,5
4,8
12
5
7
5
6
6
6
6
6
6
6
6
6
6
5,8
6,0
6,0
5,9
13
7
7
5
5
6
5
5
5
5
4
6
6
6
6,0
4,8
6,0
5,5
14
6
7
5
5
6
5
4
4
5
5
6
5
6
5,8
4,6
5,5
5,3
15
6
7
4
5
6
6
3
5
4
4
7
5
6
5,6
4,4
6,0
5,2
16
5
6
5
5
7
5
4
4
5
4
6
6
6
5,6
4,4
6,0
5,2
17
6
6
5
6
6
5
6
6
6
6
6
6
5
5,8
5,8
6,0
5,8
18
7
7
7
7
7
7
7
7
7
7
7
7
7
7,0
7,0
7,0
7,0
19
4
5
5
4
4
5
3
4
5
6
4
4
4
4,4
4,6
4,0
4,4
20
6
7
6
7
7
6
6
5
6
6
7
6
6
6,6
5,8
6,5
6,2
21
6
5
4
4
5
5
6
5
5
5
5
5
5
4,8
5,2
5,0
5,0
22
4
4
4
4
4
4
4
4
4
4
4
4
4
4,0
4,0
4,0
4,0
23
6
7
7
6
6
6
6
6
7
6
6
6
6
6,4
6,2
6,0
6,2
30
Responden
Q1
Q2
Q3
Q4
Q5
Q6
Q7
Q8
Q9
Q10
Q11
Q12
Q13
SYSUSE INFOQUAL
INTERQUAL OVERALL
24
6
6
6
7
7
6
7
3
6
7
6
5
6
6,4
5,8
5,5
6,0
25
5
5
6
5
5
6
3
4
4
5
4
3
5
5,2
4,4
3,5
4,6
26
6
5
5
5
5
5
5
5
5
5
5
5
5
5,2
5,0
5,0
5,1
27
7
7
6
6
6
6
5
6
6
7
3
3
5
6,4
6,0
3,0
5,6
28
6
6
6
6
6
6
6
6
6
6
6
6
6
6,0
6,0
6,0
6,0
29
6
6
3
6
7
6
6
6
6
6
6
5
5
5,6
6,0
5,5
5,7
30
6
7
6
7
7
6
6
6
6
6
7
6
6
6,6
6,0
6,5
6,3
31
6
7
5
6
7
5
5
5
6
5
7
6
6
6,2
5,2
6,5
5,8
Mean
5,61
6,10
5,17
5,57
6,03
5,67
5,07
5,07
5,53
5,60
5,40
5,00
5,47
5,69
5,39
5,20
5,48
Median
6,00
6,00
5,00
6,00
6,00
6,00
5,00
5,00
6,00
6,00
6,00
5,00
6,00
5,80
5,50
5,50
5,62
Mode
6,00
7,00
5,00
6,00
6,00
6,00
6,00
6,00
6,00
6,00
6,00
5,00
6,00
5,80
6,00
6,00
5,85
Std Dev
0,88
0,96
0,99
0,94
0,89
0,80
1,23
0,94
0,82
0,86
1,25
1,08
0,73
0,74
0,73
1,11
0,65
Minimum
4,00
4,00
3,00
4,00
4,00
4,00
3,00
3,00
4,00
4,00
3,00
3,00
4,00
4,00
4,00
3,00
4,00
Maximum
7,00
7,00
7,00
7,00
7,00
7,00
7,00
7,00
7,00
7,00
7,00
7,00
7,00
7,00
7,00
7,00
7,00
Conf (95%)
0,32
0,36
0,37
0,35
0,33
0,30
0,46
0,35
0,31
0,32
0,47
0,40
0,27
0,28
0,27
0,41
0,24
Upper
5,94
6,46
5,53
5,92
6,37
5,97
5,53
5,42
5,84
5,92
5,87
5,40
5,74
5,97
5,66
5,61
5,72
Lower
5,29
5,74
4,80
5,22
5,70
5,37
4,61
4,71
5,23
5,28
4,93
4,60
5,19
5,42
5,11
4,79
5,24
31
Lampiran 8 Tabel deskripsi dan hasil uji sistem (panel adminstrator) No
Skenario Uji
Hasil yang Diharapkan Masuk sistem sebagai administrator
Hasil Uji
Deskipsi Uji
Kondisi Awal
1
Memasukkan username dan password
Halaman login
Mengisikan username dan password lalu menekan tombol “LOGIN”
2
Melihat record agenda
Halaman agenda
Memilih tab agenda
Muncul tabel semua record agenda yang terdiri atas kolom nama, tanggal, waktu, kegiatan, serta tempat agenda
OK
3
Menambah agenda
Halaman agenda
Memilih tautan “tambah agenda”, kemudian akan muncul form untuk menambah agenda. Setelah selesai melakukan penambahan agenda, tekan tombol “submit”
Data berhasil ditambahkan dan kembali ke halaman agenda
OK
4
Melakukan edit agenda
Halaman agenda
Memilih tautan “edit”, kemudian akan muncul text box serta text area untuk mengubah data. Setelah selesai melakukan pengubahan data, tekan tombol “ubah”
Data berhasil diubah dan kembali ke halaman agenda
OK
5
Menghapus salah satu record agenda
Halaman agenda
Memilih tautan “hapus”, kemudian akan muncul pesan konfirmasi
Jika memilih “ya” maka record akan terhapus dan kembali ke halaman agenda, jika memilih “tidak” maka akan langsung kembali ke halaman agenda
OK
6
Melihat record video
Halaman video
Memilih tab video
Muncul tabel semua record video yang terdiri atas nama, durasi, preview serta deskripsi video
OK
OK
32
No
Deskipsi Uji
Kondisi Awal
Skenario Uji
Hasil yang Diharapkan Video berhasil ditambahkan dan kembali ke halaman video
Hasil Uji
7
Menambah video
Halaman video
Memilih tautan “tambah video”, kemudian akan muncul form untuk menambah video. Setelah selesai melakukan penambahan video, tekan tombol “upload”
OK
8
Melakukan edit video
Halaman video
Memilih tautan “edit”, kemudian akan muncul text box serta text area untuk mengubah data. Setelah selesai melakukan pengubahan data, tekan tombol “ubah”
Data berhasil diubah dan kembali ke halaman video
OK
9
Menghapus salah satu record video
Halaman video
Memilih tautan “hapus”, kemudian akan muncul pesan konfirmasi
Jika memilih “ya” maka record akan terhapus dan kembali ke halaman video, jika memilih “tidak” maka akan lagsung kembali ke halaman video
OK
10
Melihat record gambar
Halaman gambar
Memilih tab gambar
Muncul tabel semua record gambar yang terdiri atas nama, deskripsi, tempat, tanggal, serta preview gambar
OK
11
Menambah gambar
Halaman gambar
Memilih tautan “tambah gambar”, kemudian akan muncul form untuk menambah gambar. Setelah selesai melakukan penambahan gambar, tekan tombol “upload”
Gambar berhasil ditambahkan dan kembali ke halaman gambar
OK
33
No
Deskipsi Uji
Kondisi Awal
Skenario Uji
Hasil yang Diharapkan Data berhasil diubah dan kembali ke halaman gambar
Hasil Uji
12
Melakukan edit gambar
Halaman gambar
Memilih tautan “edit”, kemudian akan muncul text box serta text area untuk mengubah data. Setelah selesai melakukan pengubahan data, tekan tombol “ubah”
OK
13
Menghapus salah satu record gambar
Halaman gambar
Memilih tautan “hapus”, kemudian akan muncul pesan konfirmasi
Jika memilih “ya” maka record akan terhapus dan kembali ke halaman gambar, jika memilih “tidak” maka akan lagsung kembali ke halaman gambar
OK
14
Melihat record produk
Halaman produk
Memilih tab produk
Muncul tabel semua record produk yang terdiri atas nama, inventor, fakultas, deskripsi, serta preview produk
OK
15
Menambah produk
Halaman produk
Memilih tautan “tambah produk”, kemudian akan muncul form untuk menambah produk. Setelah selesai melakukan penambahan produk, tekan tombol “upload”
Produk berhasil ditambahkan dan kembali ke halaman produk
OK
16
Melakukan edit produk
Halaman produk
Memilih tautan “edit”, kemudian akan muncul text box serta text area untuk mengubah data. Setelah selesai melakukan pengubahan data, tekan tombol “ubah”
Data berhasil diubah dan kembali ke halaman produk
OK
34
No
Deskipsi Uji
17
Menghapus salah satu record produk
Kondisi Awal Halaman produk
Skenario Uji Memilih tautan “hapus”, kemudian akan muncul pesan konfirmasi
Hasil yang Diharapkan Jika memilih “ya” maka record akan terhapus dan kembali ke halaman produk, jika memilih “tidak” maka akan lagsung kembali ke halaman produk
Hasil Uji OK
35
Lampiran 9 Tabel deskripsi dan hasil uji sistem (touch screen client) No
Deskipsi Uji
Kondisi Awal
Skenario Uji
Hasil yang Diharapkan Mengetahui agenda pada tanggal tertentu berupa waktu, kegiatan, serta tempat agenda berlangsung
Hasil Uji
1
Melihat agenda pada tanggal tertentu
Halaman utama
Sentuh tombol “agenda”, pilih agenda IPB atau pimpinan yang akan dilihat, lalu sentuh tanggal
OK
2
Kembali ke halaman utama
Pop-up agenda pada tanggal tertentu
Sentuh tautan “close”, kemudian sentuh tombol “beranda”
Kembali ke halaman utama
OK
3
Memutar video dari playlist yang tersedia
Halaman utama
Sentuh tombol “galeri”, sentuh tombol “video”, lalu pilih video dari playlist
Dapat memutar video
OK
4
Melihat gambar
Halaman video
Sentuh tombol “kembali”, sentuh tombol “gambar”, lalu sentuh thumbnail gambar yang diinginkan
Dapat melihat gambar dengan ukuran yang lebih besar
OK
5
Melihat informasi kontak departemen
Halaman utama
Sentuh tombol “fakultas & produk”, sentuh tombol “fakultas”, sentuh tombol “departemen” yang dituju, sentuh tombol “jurusan” yang dituju, lalu sentuh tab “kontak”
Dapat mengetahui informasi kontak departemen yang dituju
OK
6
Melihat rincian produk riset IPB
Halaman fakultas
Sentuh tombol “fakultas & produk”, sentuh tombol “produk”, lalu sentuh thumbnail produk untuk melihat info produk lebih rinci
Dapat mengetahui informasi produk riset IPB secara rinci
OK
7
Melihat tujuan dan motto IPB
Halaman utama
Sentuh tombol “tentang”, sentuh tombol “profil”, lalu sentuh tab “tujuan dan motto”
Dapat mengetahui tujuan dan motto IPB
OK
8
Melihat informasi kontak kantor dan direktorat
Halaman profil
Sentuh tombol “kembali”, sentuh tombol “organisasi”, sentuh thumbnail untuk melihat kontak kantor dan direktorat
Dapat mengetahui informasi kontak kantor dan direktorat yang dituju
OK
36
