PRAKATA. 1. Bapak Helmi Zain Nuri, S.T., MT. selaku Ketua Program Studi Teknik Informatika Universitas Muhammadiyah Yogyakarta.

Transkripsi

1 PRAKATA Assalamu alaikum Wr. Wb. Alhamdulillahirabbil alamin puji syukur penulis panjatkan kehadirat Allah SWT yang telah memberikan nikmat dan hidayah-nya sehingga penulis dapat menyelesaikan penyusunan skripsi dengan judul. PERANCANGAN DESAIN USER INTERFACE PADA APLIKASI JOB MATCHING PROFILE MENGGUNAKAN PRINSIP 8 GOLDEN RULES OF INTERFACE DESIGN Berbagai usaha dan upaya telah penulis lakukan untuk menyelesaikan penyusunan skripsi ini, karena keterbatasan kemampuan penulis, maka penulis meminta maaf apabila terdapat kesalahan pemilihan kata, susunan penulisan dan sistematika pembahasan. Penulis berharap skripsi ini dapat memberikan manfaat bagi penulis khususnya dan pembaca pada umumnya. Tidak lupa penulis mengucapkan terima kasih kepada semua pihak yang telah membantu dalam proses penelitian dan penyusunan skripsi ini, diantaranya: 1. Bapak Helmi Zain Nuri, S.T., MT. selaku Ketua Program Studi Teknik Informatika Universitas Muhammadiyah Yogyakarta. 2. Bapak Dr. Ir. Dwijoko Purbohadi, M.T. selaku dosen pembimbing I yang dengan sabar membimbing, memberikan ilmu dan mengarahkan penulis sehingga selama melaksanakan penelitian tugas akhir ini hingga menyelesaikan penyusunan skripsi ini. 3. Bapak Reza Giga Isnanda, S.T., M.Sc. selaku dosen pembimbing II yang dengan sabar memberikan ilmu dan pengetahuan, semoga bermanfaat baik sekarang hingga dikemudian hari. 4. Ibu Aprilia Kurnianti, S.T., M.Eng. selaku dosen penguji ujian pendadaran skripsi yang senantiasa memberikan saran demi perkembangan ilmu pengetahuan serta perkembangan dunia pendidikan. iv

2 5. Segenap dosen dan pengajar di Jurusan Teknik Informatika Universitas Muhammadiyah Yogyakarta. 6. Staff Tata Usaha Jurusan Teknik Informatika Fakultas Teknik Universitas Muhammadiyah Yogyakarta. 7. M.Rausan Fikri, rekan seperjuangan yang telah banyak berjasa dalam membantu pengembangan aplikasi. 8. Rekan seperjuangan Jurusan Teknik Informatika Semua pihak yang telah membantu penulis yang tidak bisa disebutkan satu persatu. Penulis menyadari bahwa skripsi ini memiliki kekurangan, maka dari itu penulis mengahrapkan kritik dan saran yang bersifat membangun sehingga menjadi masukan bagi penulis guna penyusunan karya-karya selanjutnya. Wassalamu alaikum Wr.Wb Helmiawan Zaki Yamani v

3 PERNYATAAN Dengan ini saya menyatakan bahwa dalam skripsi ini tidak terdapat karya yang pernah diajukan untuk memperoleh gelar kesarjanaan di suatu Perguruan Tinggi dan sepanjang pengetahuan saya juga tidak terdapat karya atau pendapat yang pernah ditulis atau diterbitkan oleh orang lain, kecuali yang secara tertulis dikutip dalam naskah ini dan disebutkan dalam daftar perpustakaan. Yogyakarta, 14 April 2017 vi

4 DAFTAR ISI PENGESAHAN I... ii PENGESAHAN II... iii PRAKATA... iv PERNYATAAN... vi DAFTAR ISI... vii DAFTAR GAMBAR... ix DAFTAR TABEL... xii INTISARI... xiii ABSTRACT... xiv BAB I PENDAHULUAN Latar Belakang Identifikasi Masalah Batasan Masalah Tujuan Penelitian Manfaat Penelitian Sistematika Penulisan... 6 BAB II TINJAUAN PUSTAKA DAN LANDASAN TEORI Tinjauan Pustaka Landasan Teori Profile Matching User Interface Human Computer Interaction Prinsip 8 Golden Rules of Interface Design Standart ISO (2010) BAB III METODOLOGI PENELITIAN Alur Penelitian Alat dan Bahan Penelitian Metode Pengumpulan Data vii

5 3.3.1 Observasi Wawancara Analisa Data Analisa Proses Pengambilan Data Mahasiswa dan Perusahaan Analisa Proses Matching Analisa Kebutuhan Aplikasi Rancangan Sistem Rancangan Sistem Rancangan Antarmuka BAB IV HASIL DAN PEMBAHASAN Panduan Pemasangan Aplikasi Fungsi Fungsi Aplikasi Halaman Masuk Halaman Data Mahasiswa Halaman Data Perusahaan Halaman Atur Kualifikasi Halaman Pencocokan Mahasiswa Halaman Pencocokan Perusahaan Halaman Laporan Pencocokan Perusahaan Halaman Laporan Pencocokan Mahasiswa Halaman Ubah Kata Sandi Halaman Daftar User Halaman Lupa Kata Sandi Halaman Data Kadaluarsa Pesan Peringatan Pembahasan Poin-Poin Penerapan 8 Golden Rules Strive For Consistency Cater to universal usability Offer Informative Feedback Design Dialogs to Yields Closure viii

6 4.3.5 Prevent Errors Permit Easy Reversal of Actions Support Internal Locus of Control Reduce Short Term Memory Load Pembahasan Penjelasan Metric dan Measure Tingkat Kemudahan User Mengoperasikan Aplikasi Tingkat Kualitas Tampilan atau Interface Aplikasi BAB V KESIMPULAN DAN SARAN Kesimpulan Saran DAFTAR PUSTAKA LAMPIRAN Daftar Pertanyaan Jawaban ix

7 DAFTAR GAMBAR Gambar 2. 1 Ruang Lingkup Human Computer Interaction (HCI) Gambar 3. 1 Model Waterfall (2001) Gambar 3. 2 Use Case Diagram Gambar 3. 3 Activity Diagram Menu Masuk Gambar 3. 4 Activity Diagram Menu Data Mahasiswa Gambar 3. 5 Activity Diagram Menu Data Perusahaan Gambar 3. 6 Activity Diagram Menu Atur Kualifikasi Gambar 3. 7 Activity Diagram Menu Pencocokan Mahasiswa Gambar 3. 8 Activity Diagram Menu Pencocokan Perusahaan Gambar 3. 9 Activity Diagram Menu Rincian Perusahaan Gambar Activity Diagram Menu Rincian Mahasiswa Gambar Activity Diagram Menu Rincian Mahasiswa Gambar Activity Diagram Menu Rincian Perusahaan Gambar Activity Diagram Menu Daftar User Gambar Activity Diagram Menu Lupa Kata Sandi Gambar Activity Diagram Menu Data Kadaluarsa Gambar Activity Diagram Menu Bantuan Gambar Rancangan Antarmuka Menu Masuk Gambar Rancangan tampilan feedback Gambar Rancangan Antarmuka Data Mahasiswa Gambar Tampilan feedback tambah...45 Gambar Tampilan feedback edit Gambar Tampilan pesan hapus Gambar Rancangan Antarmuka Data Perusahaan Gambar Tampilan pesan hapus Gambar Rancangan Antarmuka Menu Atur Kualifikasi Gambar Rancangan Antarmuka Menu Pencocokan Mahasiswa Gambar Rancangan Antarmuka Menu Pencocokan Perusahaan Gambar Rancangan Antarmuka Menu Laporan Pencocokan Mahasiswa Gambar Rancangan Antarmuka Menu Laporan Pencocokan Perusahaan Gambar Rancangan Antarmuka Menu Rincian Mahasiswa Gambar Rancangan Antarmuka Menu Rincian Perusahaan Gambar Rancangan Antarmuka Menu Daftar user Gambar Feedback data tidak lengkap...55 Gambar Feedback sukses menyimpan Gambar Rancangan Antarmuka Menu Lupa Kata Sandi Gambar Feedback salah menginputkan data ix

8 Gambar Rancangan Antarmuka Menu Data Kadaluarsa Gambar Rancangan Antarmuka Menu Ubah Kata Sandi Gambar Feedback salah menginputkan data Gambar Rancangan Antarmuka Menu Ubah Kata Sandi Gambar 4. 1 Pemilihan bahasa Gambar 4. 2 Tampilan awal installasi SAP Crytal Report Gambar 4. 3 Tampilan License Agreement Gambar 4. 4 Tampilan Start Installation Gambar 4. 5 Tampilan proses installasi aplikasi Gambar 4. 6 Folder Disk Gambar 4. 7 Jalankan Setup Gambar 4. 8 Tampilan awal installasi Gambar 4. 9 Tampilan License Agreement Gambar Tampilan Customer Information Gambar Tampilan Destination Folder Gambar Tampilan proses installasi Gambar Tampilan shortcut aplikasi Gambar Tampilan pengaturan Run as Administrator Gambar Halaman Masuk Gambar Peringatan jika nama user dan kata sandi belum diisi Gambar Peringatan jika nama user atau kata sandi salah Gambar Halaman Data Mahasiswa Gambar Tambah Data Mahasiswa Gambar Edit Data Mahasiswa Gambar Konfirmasi untuk menghapus data Gambar Halaman Data Perusahaan Gambar Tambah Data Perusahaan Gambar Edit Data Perusahaan Gambar Konfirmasi untuk menghapus data Gambar Tambah Kualifikasi Gambar Hapus Kualifikasi Gambar Halaman Pencocokan Mahasiswa Gambar Pemberitahuan setelah menekan tombol Cocokkan Gambar Tampilan hasil pencocokan Gambar Tampilan rincian perusahaan Gambar Halaman Pencocokan Perusahaan Gambar Tampilan hasil pencocokan Gambar Tampilan rincian mahasiswa Gambar Tampilan hasil laporan pencocokan Gambar Tampilan hasil laporan pencocokan x

9 Gambar Tampilan Print Report Gambar Tampilan laporan hasil pencocokan Gambar Halaman Ubah Kata Sandi Gambar Halaman Daftar User Baru Gambar Halaman Lupa Kata Sandi Gambar Halaman Ubah Kata Sandi Gambar Halaman Data Perusahaan Lama Gambar Pesan Sukses Mengubah Data Gambar Pesan Konfirmasi Saat Menghapus Data Gambar Pesan data berhasil dihapus Gambar Pesan data tidak lengkap Gambar Letak tombol Bantuan Gambar Tampilan Halaman Bantuan Gambar Strive for consistency Gambar Fitur pencarian Gambar Feedback salah kata sandi Gambar Feedback kolom kosong Gambar Feedback data berhasil dihapus Gambar Feedback data berhasil diperbaharui Gambar Feedback data berhasil di tambah Gambar Tampilan saat tombol Tambah belum ditekan Gambar Tampilan saat tombol Tambah sudah ditekan Gambar Tampilan saat tombol Simpan sudah ditekan Gambar Letak Link Button Lupa Password Gambar Tampilan halaman Lupa Password Gambar Tampilan halaman Ubah Kata Sandi Gambar Tampilan validasi kolom Nama Gambar Tampilan saat tombol Edit ditekan Gambar Tampilan saat tombol Hapus ditekan Gambar Letak tombol Batal Gambar Tampilan pesan konfirmasi Gambar Tampilan pesan saat akan menghapus data Gambar Tampilan hasil pencocokan xi

10 DAFTAR TABEL Tabel 3. 1 Spesifikasi minimum visual studio Tabel 3. 2 Spesifikasi Laptop Pengembang Tabel 3. 3 Spesifikasi Minimum Laptop Pengguna Tabel 4. 1 Daftar matric dan measure Tabel 4. 2 Penjelasan Metric tingkat kemudahan user mengoperasikan aplikasi 104 Tabel 4. 3 Penjelasan Metric tingkat kualitas tampilan atau interface aplikasi xii