Bab 3 Metode Perancangan Sistem

dokumen-dokumen yang mirip
Bab 3 Metode dan Perancangan Sistem

Bab 4 Hasil dan Pembahasan

BAB III ANALISIS DAN DESAIN SISTEM


BAB II ANALISIS DAN PERANCANGAN. Sistem informasi penjualan pakaian wanita berbasis web diperlukan

BAB II ANALISIS DAN PERANCANGAN. pembuatan sebuah web. Langkah ini sebagai gambaran apa saja yang

BAB III ANALISIS DAN PERANCANGAN

BAB II ANALISIS DAN PERANCANGAN. (user) dan fungsinya, diagram alir sistem, perancangan basis data,

BAB V IMPLEMENTASI SISTEM

BAB III ANALISIS DAN DESAIN SISTEM

BAB III ANALISA DAN DESAIN SISTEM

BAB III ANALISIS DAN DESAIN SISTEM

Bab 3. Metode Perancangan Sistem

BAB II ANALISIS DAN PERANCANGAN SISTEM. yang dibangun adalah sistem pendukung, user dan perannya,

BAB IV HASIL DAN UJI COBA

BAB III ANALISIS DAN RANCANGAN SISTEM

BAB III DESAIN DAN PERANCANGAN

BAB III ANALISIS DAN DESAIN SISTEM

BAB III ANALISA DAN PERANCANGAN

BAB 3 PERANCANGAN SISTEM. sistem, pendefenisian darikebutuhan-kebutuhan fungsional persiapan untuk

BAB III ANALISIS DAN DESAIN SISTEM

Tampilan Layar Admin Manajemen Kontak Kami, digunakan untuk menambah,

BAB II ANALISIS DAN PERANCANGAN

BAB III ANALISIS MASALAH DAN RANCANGAN PROGRAM

BAB III ANALISIS DAN DESAIN SISTEM

BAB IV ANALISIS DAN PERANCANGAN. diidentifikasi lalu dicarikan solusinya. Dalam tahap ini akan diuraikan beberapa

BAB IV DESKRIPSI SISTEM. terhadap sistem inventaris hardware serta sistem pengolahan data hardware

BAB IV IMPLEMENTASI SISTEM. Tahap implementasi sistem merupakan proses yang dilakukan setelah tahap perancangan

BAB III ANALISA DAN PERANCANGAN SISTEM

BAB III ANALISIS DAN PERANCANGAN SISTEM

BAB III ANALISIS DAN DESAIN SISTEM

BAB IV ANALISIS DAN PERANCANGAN. singkat keterangan flowchart tersebut adalah sebagai berikut. User yang mengunjungi

BAB IV ANALISIS DAN PERANCANGAN. suatu sistem informasi yang utuh ke dalam bagian-bagian komponennya

Bab 3 Metode dan Perancangan Sistem

BAB III ANALISIS DAN PERANCANGAN

BAB III ANALISA DAN PERANCANGAN

BAB III ANALISIS DAN PERANCANGAN

BAB IV PERANCANGAN SISTEM

BAB 3 PERANCANGAN SISTEM. sistem baik yang lama maupun untuk mulai memiliki sistem yang baru. Perancangan

BAB III ANALISA DAN DESAIN SISTEM

BAB III ANALISIS DAN DESAIN SISTEM

BAB III PERANCANGAN PENELITIAN

BAB IV PERANCANGAN SISTEM

BAB IV HASIL DAN UJI COBA

BAB IV HASIL DAN PEMBAHASAN

BAB IV DESKRIPSI SISTEM. manual. Manual di sini mempunyai arti bahwa belum adanya sebuah sistem yang

BAB IV DESKRIPSI PEKERJAAN. penyebaran informasi masih menggunakan cara selebaran ataupun melalui suratsurat

Bab 3 Metode Perancangan

BAB IV IMPLEMENTASI DAN EVALUASI

BAB III ANALISA DAN DESAIN SISTEM

BAB III ANALISIS DAN PERANCANGAN SISTEM. Sistem merupakan sekumpulan elemen yang satuan. fungsinya saling berhubungan dan bertanggungjawab

BAB III ANALISIS DAN DESAIN SISTEM

BAB III ANALISIS DAN DESAIN SISTEM

BAB III ANALISA DAN PERANCANGAN SISTEM 1.1 Alat dan Bahan Alat

BAB III METODOLOGI PENELITIAN. Penelitian ini dilakukan di Jurusan Ilmu Komputer Fakultas Matematika dan Ilmu

BAB III ANALISIS DAN DESAIN SISTEM

BAB IV DESKRIPSI SISTEM. dilakukan adalah identifikasi permasalahan yang terdiri dari survei, wawancara

BAB IV HASIL DAN UJI COBA

BAB IV DESKRIPSI PEKERJAAN. dapat mencatat debit tertinggi sungai. Aplikasi yang ada pada Balai Besar

BAB IV DESKRIPSI SISTEM. untuk peningkatan kinerja Aplikasi Jadwal Kegiatan pada SMA Negeri 1 Klakah

BAB 2 ANALISIS DAN PERANCANGAN. Sistem perangkat lunak (software) merupakan programprogram. pendukung dalam menjalankan perangkat keras.

BAB III ANALISA DAN DESAIN SISTEM

BAB III ANALISIS DAN DESAIN SISTEM

BAB III ANALISIS DAN DESAIN SISTEM

BAB III ANALISIS DAN DESAIN SISTEM

PEMBUATAN WEBSITE INFORMASI MUSEUM DI JAKARTA DENGAN MENGGUNAKAN MACROMEDIA DREAMWEAVER 8, PHP DAN MYSQL

BAB II ANALISIS DAN PERANCANGAN. Komponen - komponen yang diperlukan untuk menganalisis

Bab 3. Metode Dan Perancangan Sistem

BAB III ANALISIS DAN DESAIN SISTEM

BAB IV PERANCANGAN SISTEM. gambaran secara umum kepada user tentang sistem yang baru. Data

BAB III ANALISIS DAN PERANCANGAN

BAB III ANALISIS DAN DESAIN SISTEM

BAB IV ANALISIS DAN PERANCANGAN

BAB II ANALISIS DAN PERANCANGAN

BAB II ANALISIS DAN PERANCANGAN. Komponen-komponen yang diperlukan untuk menganalisis kebutuhan dari objek

BAB III ANALISA DAN DESAIN SISTEM

Gambar 4-1 Use Case Diagram Website Tabel 4-1 Skenario Use Case melihat web

BAB III ANALISA DAN DESAIN SISTEM

BAB IV DISKRIPSI PEKERJAAN. Menganalisa Proses merupakan langkah awal dalam membuat Tutorial ini.

BAB III ANALISA KEBUTUHAN DAN PERANCANGAN SISTEM

BAB IV ANALISIS DAN PERANCANGAN. Analisis Sistem ini merupakan penguraian dari suatu sistem pengolahan aplikasi

BAB III ANALISIS DAN DESAIN SISTEM

BAB III PEMBAHASAN. 3.1 Analisis

BAB II ANALISIS DAN PERANCANGAN

Hal LANDASAN TEORI

BAB II ANALISIS DAN PERANCANGAN

BAB III ANALISA DAN DESAIN SISTEM

BAB III ANALISA DAN DESAIN SISTEM

BAB 4 HASIL DAN PEMBAHASAN

BAB III ANALISIS DAN DESAIN SISTEM

BAB III ANALISIS DAN DESAIN SISTEM

BAB IV ANALISIS DAN PERANCANGAN SISTEM

BAB III ANALISA DAN DESAIN SISTEM

1 BAB III ANALISA KEBUTUHAN DAN PERANCANGAN SISTEM

BAB II ANALISIS DAN PERANCANGAN. tentang jam tangan, yang meliputi data barang,cara pembelian,tentang web

BAB III ANALISIS DAN UJI COBA

BAB V IMPLEMENTASI DAN PENGUJIAN. (Studi kasus Dinas Tenaga Kerja dan Transmigrasi sub Kepegawaian dan Umum) ada

BAB III ANALISA DAN PERANCANGAN SISTEM

BAB III ANALISIS DAN DESAIN SISTEM

BAB III ANALISA DAN DESAIN SISTEM

Transkripsi:

Bab 3 Metode Perancangan Sistem Pada bab ini dibahas mengenai metode perancangan yang dipergunakan dalam membuat Sistem Informasi Kepuasan Pelanggan Terhadap Loyalitas Pada Roemah Emak Backpacker 4H/3M, beserta rancangan-rancangan baik berupa use case, activity diagram, entity relationship diagram, dan tabel tabel basis data dari sistem tersebut. 3.1 Metode Rekayasa Perangkat Lunak 3.1.1 Pembahasan Metode Prototyping Metode rekayasa perangkat lunak yang digunakan dalam pembuatan tugas akhir ini ialah metode prototyping. Metode prototyping merupakan sebuah metode rekayasa perangkat lunak yang bersifat iteratif. Metode ini menuntut adanya hubungan kerja yang dekat atau komunikasi intensif antara pembangun aplikasi dengan pengguna. Adapun keuntungan menggunakan metode prototyping adalah metode prototyping melibatkan partisipasi aktif dari pengguna sehingga dapat meningkatkan moral pengguna dalam menggunakan aplikasi yang dihasilkan. Selain itu pengguna dapat mengetahui kesesuaian antara sistem yang akan dihasilkan dengan kebutuhan mereka tanpa harus menunggu sampai sistem diimplemetasikan. Dengan hal ini memungkinkan pengguna lebih cepat dalam memberikan tanggapan yang dapat membawa 29

30 kepada solusi yang lebih baik dalam membangun perangkat lunak. Adapun tahapan tahapan yang harus dilalui dalam metode prototyping ini ialah mengumpulkan informasi tentang kebutuhan aplikasi, dari kebutuhan tersebut kemudian dibuat prototypenya. Pada pembuatan prototype, yang diutamakan ialah proses masukan dan keluaran dari aplikasi. Disini kualitas aplikasi yang dibangun belum diperhatikan. Setelah melalui tahapan pembuatan prototype, tahapan selanjutnya ialah memperlihatkan prototype tersebut kepada pengguna. Pada tahap inilah evaluasi terhadap prototype dilakukan, tiga tahapan tersebut akan berulang selama prototype yang dibangun belum sesuai dengan kebutuhan pengguna. Gambar 3.1 merupakan gambar tahapan yang harus dilakukan dalam metode prototyping. Gambar 3.1 Bagan Model Prototyping (Pressman, 2001) Metode perancangan sistem dengan menggunakan metode prototyping ini bukanlah merupakan sesuatu yang lengkap, tetapi sesuatu yang harus dimodifikasi kembali, dikembangkan, ditambahkan atau digabungkan dengan sistem informasi yang

31 lain bila perlu atau dapat dikatakan bahwa software yang terbentuk hanyalah sebagai suatu prototype yaitu sebagai gambaran dari kebutuhan seorang user. 3.2 Pendiskripsian Kebutuhan (Requirement Gathering) 3.2.1 Tahap Perencanaan (Pengumpulan Kebutuhan) Tahap perencanaan merupakan tahap awal untuk mengumpulkan kebutuhan. Pengumpulan data pada tahap ini dengan cara melakukan wawancara dengan pihak biro Tour Roemah Emak dan observasi di biro tersebut untuk mengetahui tentang kebutuhan aplikasi yang akan dibuat. 3.2.2 Tahap Desain Sistem (Perancangan) Tahap berikutnya yaitu tahap desain sistem atau perancangan sistem. Pada tahap ini dilakukan desain pada aplikasi sesuai dengan kebutuhan yang diperlukan dan desain database sesuai dengan data data yang ada di dalam apllikasi. Aplikasi yang dibuat lebih memfokuskan kepada input, proses, dan output sesuai dengan kebutuhan yang telah diketahui pada tahap sebelumnya. 3.2.3 Tahap Evaluasi Prototype Tahap evaluasi prototype merupakan tahapan akhir dalam pengembangan dari aplikasi yang dibuat. Pada tahap ini aplikasi akan diuji oleh pengguna dan hasil dari aplikasi yang dibuat hanya berupa prototype.

32 Adapun software dan hardware yang dibutuhkan dalam pembuatan sistem tersebut adalah : Spesifikasi software yang dibutuhkan : Xampp, MySQL Rational Rose PHP 5 Spesifikasi hardware yang dibutuhkan : Prosesor Intel Pentium 4 RAM 512 MB Sistem Operasi Windows XP Sp 2 Hardisk 80 Gb Keyboard dan Monitor Optical mouse

33 3.3 Desain Sistem Desain sistem dimaksud untuk membantu dalam pengembangan aplikasi yang akan dibuat nanti yaitu berupa website. Pada bagian ini akan dibahas use case diagram, dan activity diagram. Di bawah ini adalah gambaran desain sistem yang dengan menggunakan metode UML. 3.3.1 Perancangan UML Prototype Pertama 3.3.1.1 Use Case Diagram Dari pengumpulan data berdasarkan hasil wawancara yang telah dilakukan untuk penyerahan prototype pertama, fungsionalitas yang dimiliki oleh sistem yang akan dibangun digambarkan pada use case diagram yang ada pada Gambar 3.2. kelola data member admin melihat hasil survey kepuasan pelanggan pelanggan <<include>> <<include>> kelola data kuesioner <<include>> <<include>> <<include>> kelola data paket tour <<include>> <<include>> login <<include>> melihat informasi web biro tour roemah emak kelola data berita ganti password menjawab kuesioner pada sistem kepuasan pelanggan Gambar 3.2 Use Case Diagram Sistem Informasi Kepuasan Pelanggan biro Tour Roemah Emak Prototype Pertama

34 3.3.1.2 Activity Diagram Activity diagram adalah diagram yang memperlihatkan aliran dari suatu aktivitas ke aktivitas lainnya dalam suatu sistem. Untuk perancangan Activity Diagram pelanggan prototype pertama dapat dilihat pada Gambar 3.3. user sistem Start login invalid valid? mengisi kuesioner kepuasan pelanggan lihat hasil survey kepuasan pelanggan logout End Gambar 3.3 Activity Diagram Pelanggan biro Tour Roemah Emak Prototype Pertama

35 Perancangan activity diagram admin prototype pertama, dapat dilihat pada Gambar 3.4. user Start sistem Login invalid valid? berita paket tour data pelanggan paket roemah emak backpacker 4H/3M kuesioner hasil analisa ganti password log out End Gambar 3.4 Activity Diagram Admin Sistem Informasi Kepuasan PelangganPaket Roemah Emak Backpacker 4H/3M Prototype Pertama

36 3.3.2 Perancangan UML Prototype Kedua 3.3.2.1 Use Case Diagram Dari hasil evaluasi yang didapatkan setelah penyerahan prototype pertama, terdapat perubahan terhadap use case kelola data berita dan kelola data paket tur yang harus dihapus karena use case tersebut tidak diperlukan dalam sistem ini, sehingga dapat diketahui fungsionalitas yang harus dimiliki oleh sistem yang akan dibangun. Hal tersebut digambarkan pada Gambar 3.5. kelola data member admin <<include>> <<include>> melihat hasil surv ey kepuasan pelanggan pelanggan kelola data kuesioner <<include>> <<include>> login <<include>> melihat inf ormasi web biro tour roemah emak ganti password <<include>> <<include>> menjawab kuesioner pada sistem kepuasan pelanggan dan loyalitas kelola kotak saran mengisi kotak saran Gambar 3.5 Use Case Diagram Sistem Informasi Kepuasan Pelanggan biro Tour Roemah Emak Prototype Kedua Gambar 3.5 menjelaskan bahwa Dalam Use case diagram tersebut terdapat 2 pengguna yaitu pelanggan dan admin. User dalam sistem ini adalah pelanggan dari biro Tour Roemah Emak dan yang merupakan admin adalah kepala biro Tour Roemah Emak yang memiliki wewenang untuk mengelola sistem. Admin memiliki semua fungsionalitas yang dimiliki oleh sistem ini. Sedangkan untuk pelanggan

37 hanya dapat melihat informasi web dari biro Tour Roemah Emak, mengisi atau menjawab kuesioner dari sistem informasi kepuasan dan loyalitas pelanggan tersebut, juga mengisi kotak saran. 3.3.2.2 Activity Diagram Berdasarkan hasil evaluasi yang didapatkan setelah penyerahan prototype pertama, terdapat perubahan yaitu adanya penambahan activity registrasi untuk pelanggan agar dapat melakukan akses seperti mengisi kuesioner, melihat hasil survey yang dilakukan setelah login, sehingga dapat diketahui perancangan activity diagram pelanggan seperti pada Gambar 3.6. user sistem Start Registrasi login valid invalid mengisi kuesioner kepuasan pelanggan dan loyalitas lihat hasil survey kepuasan pelanggan dan loyalitas Mengisi kotak saran logout End Gambar 3.6 Activity Diagram Pelanggan biro Tour Roemah Emak Prototype Kedua

38 Gambar 3.6 menjelaskan bahwa user yaitu pelanggan biro Tour Roemah Emak akan melakukan proses login dimana user itu sendiri harus melakukan registrasi terlebih dahulu. Setelah melakukan proses registrasi, user dapat melakukan proses login. Pada saat melakukan login, inputan akan dicek oleh sistem, jika valid, maka user dapat mengakses kuesioner kepuasan pelanggan, dan jika tidak valid, dapat berarti bahwa inputan seperti username dan password salah, untuk itu user harus melakukan proses login kembali. Setelah berhasil melakukan login, user hanya sekali dalam menjawab kuesioner tersebut. User juga dapat mengisi kotak saran yang berisi kritik, saran, maupun kesan dan pesan terhadap pelayanan yang diberikan, jika telah melakukan proses proses tersebut, maka hasil dari kuesioner yang dijawab akan disimpan ke dalam database. User juga dapat melihat hasil dari jawaban kuesioner itu berupa grafik. Pada activity diagram admin juga terdapat perubahan terhadap activity berita dan paket tur, dalam hal ini activity tersebut dihapus atau ditiadakan karena tidak diperlukan dalam sistem ini, sehingga dapat diketahui perancangan activity diagram admin seperti pada Gambar 3.7.

39 user sistem Start Login invalid valid? manage user manage kuesioner manage saran melihat grafik update password log out End Gambar 3.7 Activity diagram Admin Sistem Informasi Kepuasan Pelanggan biro Tour Roemah Emak Prototype Kedua Gambar 3.7 menjelaskan bahwa admin mempunyai hak untuk mengelola sistem secara keseluruhan yaitu untuk manage user, manage kuesioner, melihat grafik, update password. Admin dapat mengelola sistem yang dibuat tentunya harus melalui proses login.

40 3.4 Desain Database Dalam pembuatan Sistem Informasi Kepuasan Pelanggan Terhadap Loyalitas Pada Paket Roemah Emak Backpacker 4H/3M ini, database dibuat dengan menggunakan MySql. Untuk mendesain suatu database, maka harus membuat ERD (Entity Relationship Diagram) yang merupakan suatu model untuk menjelaskan hubungan antar data di dalam database berdasarkan objek objek dasar data yang mempunyai hubungan antar relasi seperti pada gambar 3.8. Gambar 3.8 ERD Sistem informasi kepuasan dan loyalitas pelanggan Kamus Data : Admin : {id_admin, username, password} User : {id_pelanggan, nama, alamat, email, contact, username, password} Pertanyaan : {id_pertanyaan, pertanyaan, id_kategori}

41 Kategori Polling Paket Tur : {id_kategori, nama_kategori} : {id_polling, id_user, id_pertanyaan, pilihan} : {id_pesan, id_pelanggan, jenis, tanggal_pesan} 3.4.1 Perancangan Database Objek yang telah dihasilkan dari perancangan sebelumnya, dinyatakan dalam bentuk tabel tabel. Pada bagian ini akan dijelaskan tabel tabel basis data yang digunakan dalam perancangan aplikasi ini. 3.4.1.1 Tabel tb_admin Tabel tb_admin digunakan untuk menyimpan data administrator yang meliputi : id, username, dan password. Tabel administrator dapat dilihat pada Tabel 3.1. Tabel 3.1 Tabel tb_admin Field Type Length Key Id_admin Int 15 Primary key Username Varchar 25 Password Varchar 35 3.4.1.2 Tabel tb_kategori Tabel tb_kategori digunakan untuk menyimpan data kategori yang meliputi : id, nama_kategori. Tabel kategori dapat dilihat pada Tabel 3.2. Tabel 3.2 Tabel tb_kategori Field Type Length Key Id_Kategori Int 15 Primary key Nama_Kategori Varchar 35

42 3.4.1.3 Tabel tb_user Tabel tb_user digunakan untuk menyimpan data pelanggan biro tur yang meliputi : id, nama, alamat, email, contact, username, password. Tabel tb_user dapat dilihat pada Tabel 3.3. Tabel 3.3 Tabel tb_user Field Type Length Key Id_user Int 15 Primary key Nama Varchar 50 Alamat Varchar 100 Email Varchar 35 Contact Varchar 40 Username Varchar 35 Password Varchar 30 3.4.1.4 Tabel tb_nps Table tb_nps digunakan untuk menyimpan data net promoter score yang meliputi : id_nps, id_user, score. Tabel tb_nps dapat dilihat pada Tabel 3.4. Tabel 3.4 Tabel tb_nps Field Type Length Key Id_nps Int 11 Primary key Id_user Int 9 Foreign key Score Int 11

43 3.4.1.5 Tabel tb_pertanyaan Tabel tb_pertanyaan digunakan untuk menyimpan data pertanyaan yang meliputi : id, pertanyaan, id_kategori. Tabel tb_pertanyaan dapat dilihat pada Tabel 3.5. Tabel 3.5 Tabel tb_pertanyaan Field Type Length Key Id_Pertanyaan Int 15 Primary key Pertanyaan Varchar 255 Id_Kategori Int 15 Foreign key 3.4.1.6 Tabel tb_polling Tabel polling digunakan untuk menyimpan data polling yang meliputi : id, id_user, id_pertanyaan dan pilihan. Tabel tb_polling dapat dilihat pada Tabel 3.6. Tabel 3.6 Tabel tb_polling Field Type Length Key Id_Polling Int 15 Primary key Id_User Int 15 Foreign key Id_Pertanyaan Int 15 Foreign key Pilihan Varchar 20 3.4.1.7 Tabel tb_saran Tabel tb_saran digunakan untuk menyimpan data saran yang meliputi : id_saran, id_user, teks_saran, tanggal. Tabel tb_saran dapat dilihat pada Tabel 3.7.

44 Tabel 3.7 Tabel tb_saran Field Type Length Key Id_Saran Int 9 Primary key Id_User Int 9 Foreign key Teks_Saran Text Tanggal Date 3.4.2 Relasi Antar Tabel Dengan terdapatnya hubungan antar tabel dalam satu database, maka kita perlu merelasikan tabel tabel tersebut. Relasi antar tabel dapat dilihat pada Gambar 3.9. tb_kategori -id_kategori -nama_kategori 1 1..* tb_pertanyaan -id_pertanyaan -pertanyaan -id_kategori tb_polling -id_polling -id_user -id_pertanyaan -pilihan 1..* 1..* 1..* 1..* tb_user -id_user -nama -alamat -email -contact -username -password 1..* tb_admin -id_admin -username -password 1..* tb_saran -id_saran -id_user -teks_saran -tanggal 1..* 1..* tb_nps -id_nps -id_user -score Gambar 3.9 Relasi Antar Tabel

45 Gambar 3.9 menjelaskan relasi antar tabel pada database yang telah dirancang. Tabel tb_user memiliki relasi dengan tabel tb_polling, tb_nps, tb_saran, tb_pesan dimana field id_user sebagai foreign key di antara kedua tabel tersebut. Tabel tb_polling memiliki relasi dengan tabel tb_pertanyaan dimana field id_pertanyaan sebagai foreign key di antara kedua tabel tabel tersebut. Tabel tb_pertanyaan memiliki relasi dengan tabel tb_kategori dimana field id_kategori sebagai foreign key di antara kedua tabel tersebut. 3.5 Desain Antar Muka Dalam pembuatan sistem informasi kepuasan pelanggan, tentunya diperlukan desain antar muka sebagai gambaran terhadap sistem informasi yang ada. Desain ini menjadi dasar untuk membuat tampilan pada aplikasi web yang dibuat. 3.5.1 Perancangan Desain Antar Muka Prototype Pertama Secara garis besar desain antar muka prototype pertama, dapat dilihat pada Gambar 3.10.

46 HEADER MENU CONTENT LINK FOOTER Gambar 3.10 Desain Antar Muka Prototype Pertama Gambar 3.10 merupakan rancangan antar muka pembuatan aplikasi sistem informasi kepuasan pelanggan pada halaman admin, dan halaman pelanggan.

47 3.5.1.1 Desain Halaman Login Desain halaman login prototype pertama dapat dilihat pada Gambar 3.11. Halaman Tentang Paket Berita Peta Galeri Depan Kami Tour Silahkan Login, Username : Password : LOGIN EXIT Gambar 3.11 Desain Halaman Login Prototype Pertama Gambar 3.11 merupakan desain dari halaman login pada prototype pertama dimana user harus memasukkan username dan password untuk melakukan login.

48 3.5.1.2 Desain Halaman Kuesioner Desain halaman kuesioner prototype pertama dapat dilihat pada Gambar 3.12. Halaman Tentang Paket Berita Peta Galeri Keluar Depan Kami Tour Kuesioner Gambar 3.12 Desain Antar Muka Halaman Kuesioner Prototype Pertama Gambar 3.12 merupakan desain halaman kuesioner yang merupakan bagian dari sistem informasi kepuasan dan loyalitas pelanggan setelah pelanggan melakukan login.

49 3.5.1.3 Desain Halaman Input Data Pelanggan Desain antar muka untuk halaman input data pelanggan prototype pertama dapat dilihat pada Gambar 3.13. Halaman Tentang Paket Berita Peta Galeri Keluar Depan Kami Tour TAMBAH USER Input Pelanggan Kode Pelanggan : Nama Pelanggan : Alamat : Kecamatan : Kabupaten / Kota : Jenis Identitas : KTP SIM No Identitas : No Telepon : No HP : SIMPAN Gambar 3.13 Desain Antar Muka Halaman Input Data Pelanggan Prototype Pertama

50 3.5.1.4 Desain Halaman Hasil Survey Tingkat Kepuasan Pelanggan dan Loyalitas biro Tour Roemah Emak Desain halaman laporan hasil survey tingkat kepuasan pelanggan prototype pertama dapat dilihat pada Gambar 3.14. Halaman Depan Tentang Kami Paket Tour Berita Peta Galeri Keluar Periode survey Tahun : Bulan Tampilkan TABEL Jumlah Responden : GRAFIK Gambar 3.14 Desain Halaman Hasil Survey Tingkat Kepuasan Pelanggan biro Tour Roemah Emak Prototype Pertama

51 3.5.2 Perancangan Desain Antar Muka Prototype Kedua Dari hasil evaluasi yang didapat setelah penyerahan prototype pertama, terdapat perubahan pada letak menu yaitu berada dibawah header, tidak sejajar dengan content dan link seperti pada prototype pertama, tetapi menu berada di atas content dan link, sehingga dapat diketahui desain antar muka seperti pada Gambar 3.15. HEADER MENU LINK CONTENT FOOTER Gambar 3.15 Desain Antar Muka Prototype Kedua Keterangan : 1. Header : Berisikan desain yang merupakan judul dari website yang dibuat. 2. Menu : Berisikan menu halaman depan, tentang kami, paket tur, berita, peta, galeri, kuesioner. 3. Link : berisikan login form, registrasi, dan link terkait.

52 4. Content : berisikan tampilan halaman dari masing-masing halaman yang dipilih oleh user. Misalnya pengguna atau user memilih kategori sistem kepuasan pelanggan, maka akan memuat kuesioner kepuasan pelanggan biro Tour Roemah Emak. 5. Footer : berisikan desain footer dan data dari pembuat. 3.5.2.1 Desain Halaman Login Dari hasil evaluasi terhadap prototype pertama, terdapat perubahan pada form login dimana ada tambahan checkbox untuk nantinya admin dapat melakukan login dengan memberi tanda centang ( ) pada checkbox tersebut dan tombol exit dihilangkan atau dihapus, sehingga dapat diketahui desain halaman login bagi pelanggan dapat dilihat pada Gambar 3.16.

53 Halaman Depan Paket Tur Tentang Kami Berita Peta Galeri Username : LOGIN FORM Password : Login Admin Gambar 3.16 Desain Halaman Login Prototype Kedua Gambar 3.16 berisikan form login berfungsi bagi pelanggan untuk masuk pada sistem kepuasan pelanggan. Pelanggan memasukkan username pada bagian User Name dan password pada bagian Password dengan benar untuk dapat melakukan proses login. Jika tidak valid, proses login tidak akan berjalan begitupun sebagai admin jika melakukan login, harus memasukan username dan password juga memberi tanda centang ( ) pada checkbox untuk bisa melakukan login sebagai admin.

54 3.5.2.2 Desain Halaman Kuesioner Dari hasil evaluasi pada prototype pertama, terdapat perubahan yaitu ada tambahan tombol logout dan link dimana kuesioner dapat diakses ketika user atau pelanggan melakukan login, sehingga dapat diketahui desain halaman kuesioner yang dibutuhkan dalam sistem seperti pada Gambar 3.17. Halaman Paket Tentang Berita Peta Galeri Kuesioner Depan Tur kami Logout Link Kuesioner Gambar 3.17 Desain Antar Muka Halaman Kuesioner Prototype Kedua Gambar 3.17 berisikan halaman kuesioner yang merupakan bagian penting dalam sistem informasi kepuasan dan loyalitas pelanggan biro Tour Roemah Emak.

55 3.5.2.3 Desain Halaman Input Data Pelanggan Dari hasil evaluasi prototype pertama, terdapat perubahan yaitu pada isi dari halaman input data pelanggan tersebut dan untuk melakukan input data pelanggan, admin harus melakukan login terlebih dahulu sehingga ada perubahan pada tampilan dari halaman input data pelanggan tersebut berupa adanya tombol logout dan tombol link yang merupakan tambahan dari sistem yang dibuat, juga menu yang berbeda setelah admin melakukan login dan penambahan tombol batal untuk admin membatalkan input data pelanggan, maka dapat dihasilkan desain halaman input data pelanggan yang dapat dilihat pada Gambar 3.18. Manage User Manage Kuesioner Grafik Update Password Logout Link Nama : Alamat : Email : Contact : Username : Password : Simpan Batal Gambar 3.18 Desain Halaman Input Data Pelanggan Prototype Kedua

56 Gambar 3.18 menunjukkan form tambah Input Pelanggan. Admin memasukkan data pelanggan sesuai dengan data yang ada dan dapat disimpan dengan mengklik tombol Simpan ataupun jika ingin membatalkan input data pelanggan dengan mengklik tombol Batal. 3.5.2.4 Desain Halaman Hasil Survey Tingkat Kepuasan Pelanggan biro Tour Roemah Emak Dari hasil evaluasi pada prototype pertama, terdapat perubahan pada tampilan dari hasil survey dimana grafik yang dihasilkan berupa dua macam grafik yaitu grafik pie, dan histogram, kemudian terdapat total responden dan perubahan tampilan pada menu dengan adanya tombol logout karena untuk melihat hasil tersebut, admin harus melakukan login terlebih dahulu dan tombol link yang merupakan tambahan dari sistem yang dibuat, maka dapat dihasilkan desain halaman hasil survey tingkat kepuasan pelanggan biro Tour Roemah Emak seperti pada Gambar 3.19.

57 Manage User Manage Kuesioner Grafik Update Password Logout Link Total Responden : Grafik per kategori Grafik Histogram Gambar 3.19 Desain Halaman Hasil Survey Tingkat Kepuasan Pelanggan biro Tour Roemah Emak Prototype Kedua Gambar 3.19 menunjukkan hasil survey kepuasan pelanggan berdasarkan kuesioner yang telah diisi dan grafik yang dihasilkan menggunakan JPGraph yang merupakan library dari PHP yang bersifat object oriented. Fungsi utama dari library ini adalah untuk menggambar grafik pada browser sesuai dengan data yang ada. 3.5.2.5 Desain Halaman Kotak Saran Berdasarkan hasil evaluasi pada prototype pertama, maka pada prototype kedua ini ditambahkan kotak saran yang bertujuan untuk mengetahui secara spesifik tentang keinginan pelanggan terhadap pelayanan.

58 Kotak saran berupa keluhan, kritik, saran, maupun kesan terhadap pelayanan yang diberikan. Desain halaman kotak saran untuk admin dan pelanggan dapat dilihat pada Gambar 3.20 dan Gambar 3.21. Manage User Manage Kuesioner Grafik Kotak Saran Update Password Logout Link Kotak Saran Nama :... Email :... Pesan : Gambar 3.20 Desain Halaman Kotak Saran Untuk Admin Gambar 3.20 menjelaskan bahwa admin dapat melihat isi dari kotak saran yang berguna sebagai sarana umpan balik (feedback) yang mempunyai manfaat sebagai tindakan korektif dan tindakan pencegahan terhadap proses pelayanan yang telah dilakukan oleh biro Tour Roemah Emak agar bisa lebih baik dalam meningkatkan kualitas pelayanan.

59 Halaman Paket Tentang Berita Peta Galeri Kuesioner Kotak Depan Tur kami Saran Logout Link Kotak Saran Nama :... Email :... Pesan : Kirim Gambar 3.21 Desain Halaman Kotak Saran Untuk Pelanggan Gambar 3.21 menjelaskan bahwa pelanggan dapat memberikan keterangan yang lebih spesifik mengenai apa saja yang diinginkan pelanggan menyangkut pelayanan yang diberikan oleh biro Tour Roemah Emak. Keterangan yang diberikan oleh pelanggan berupa kritik, saran, maupun kesan dan pesan.