BAB 3 ANALISIS DAN PERANCANGAN. memperoleh data yang akan mendukung proses pembuatan mobile application. Pertanyaan 1: Berapakah usia anda?

40 BAB 3 ANALISIS DAN PERANCANGAN

3.1 Analisis Aplikasi 3.1.1 Analisis User Analisis user dilakukan dengan metode kuisioner yang melibatkan 100 orang responden yang diambil secara acak. Kuisioner ini bertujuan untuk memperoleh data yang akan mendukung proses pembuatan mobile application sesuai dengan kebutuhan masyarakat. Berikut ini adalah kuisioner yang telah penulis sebarkan:

Pertanyaan 1: Berapakah usia anda?

Usia Responden > 40 tahun < 18 tahun 5

4

18 - 40 tahun 91

Gambar 3.1 Pie Diagram Usia Responden

41 Tabel 3.1 Usia Responden Usia

Jumlah Responden

Persentase

< 18 tahun

5

5%

18 – 40 tahun

91

91 %

> 40 tahun

4

4%

Total

100

100 %

Pertanyaan 1 dimaksudkan untuk mengetahui rata-rata usia responden pada saat pengambilan data. Hasil yang diperoleh adalah responden yang berusia 18 – 40 tahun merupakan responden yang memiliki suara terbanyak dalam pengisian kuisioner ini dengan persentase 91%. Gambar 3.1 menunjukkan persentase responden dalam bentuk diagram dan Tabel 3.1 menunjukkan jumlah beserta persentase dari usia responden.

Pertanyaan 2: Apakah profesi anda? Wiraswast Pelajar a Karyawan 5 4 6

Other Profesi Responden 5

Mahasiswa 80

Gambar 3.2 Pie Diagram Profesi Responden

42 Tabel 3.2 Profesi Responden Profesi

Jumlah Responden

Persentase Responden

Pelajar

5

5%

Mahasiswa

80

80 %

Karyawan

6

6%

Wiraswasta

4

4%

Other

5

5%

Total

100

100 %

Pertanyaan 2 dimaksudkan untuk mengetahui rata-rata profesi responden pada saat pengambilan data. Hasil yang diperoleh adalah responden yang berprofesi sebagai mahasiswa merupakan responden yang memiliki suara terbanyak dalam pengisian kuisioner ini dengan persentase 80%. Gambar 3.2 menunjukkan persentase responden dalam bentuk diagram dan menunjukkan jumlah beserta persentase dari profesi responden.

Tabel 3.2

43 Pertanyaan 3: Apakah anda pengguna smartphone Android?

Responden Pengguna Smartphone Android Tidak

Ya

46

54

Gambar 3.3 Pie Diagram Responden Pengguna Smartphone Android

Tabel 3.3 Responden Pengguna Smartphone Android Pengguna smartphone Android

Jumlah Responden


Ya

54

54 %

Tidak

46

46 %

Total

100

100 %

Pertanyaan 3 dimaksudkan untuk mengetahui berapa banyak responden pengisi kuisioner yang menggunakan smartphone Android. Hasil yang diperoleh terbanyak adalah responden yang menggunakan smartphone Android sebanyak 54 %. Gambar 3.3 menunjukkan persentase responden dalam bentuk diagram dan Tabel 3.3 menunjukkan jumlah peserta beserta persentase dari responden pengguna smartphone Android.

44 Pertanyaan 4.1: (Pertanyaan ini hanya untuk responden yang tidak menggunakan Android) Jika tidak, apakah anda tertarik untuk memiliki

Ketertarikan Responden Untuk Menggunakan Smartphone Android Tidak Ya

14

32

smartphone Android?

Gambar 3.4 Pie Diagram Ketertarikan Responden Untuk Menggunakan Smartphone Android

Tabel 3.4 Ketertarikan Responden Untuk Menggunakan Smartphone Android Ketertarikan Responden

Jumlah Responden


Ya

32

32 %

Tidak

14

14 %

Total

46

46%

Pertanyaan 4.1 dimaksudkan untuk mengetahui ketertarikan responden yang melakukan pengisian kuisioner namun tidak memakai smartphone Android. Hasil yang di peroleh adalah responden yang tertarik untuk menggunakan

45 smartphone Android memiliki suara terbanyak dalam pengisian kuisioner ini dengan persentase 32 %. Gambar 3.4 menunjukkan persentase responden dalam bentuk diagram dan Tabel 3.4 menunjukkan jumlah beserta persentase dari ketertarikan responden untuk menggunakan smartphone Android.

Pertanyaaan

4.2:

(Pertanyaan

ini

hanya

untuk

responden

yang

menggunakan smartphone Android) Jika ya, versi Android apa yang anda

Versi Android yang dimiliki Responden Lainnya Jellybean Ice Cream Sandwich Gingerbread Froyo 0

5

10

15

20

gunakan?

Gambar 3.5 Clustered Bar Diagram Versi Android Yang Dimiliki Responden

Tabel 3.5 Versi Android Yang Dimiliki Responden Versi Android

Jumlah Responden


Froyo

11

11%

Gingerbread

12

12 %

46 Ice Cream Sandwich

20

20 %

Jelly Bean

9

9%

Lainnya

2

2%

Total

54

54 %

Pertanyaan 4.2 dimaksudkan untuk mengetahui versi Android apa yang dimiliki oleh responden yang melakukan pengisian kuisioner. Hasil yang diperoleh adalah responden dengan pengguna versi Ice Cream Sandwich memiliki suara terbanyak dalam pengisian kuisioner ini dengan persentase 20 %. Gambar 3.5 menunjukkan persentase responden dalam bentuk diagram dan Tabel 3.5 menunjukkan jumlah beserta persentase dari versi Android yang dimiliki oleh responden.

Pertanyaan 5: Apakah anda pernah terjebak di dalam antrian yang panjang?

Terjebak Di Dalam Antrian Yang Panjang Tidak 11

Ya 89

47 Gambar 3.6 Pie Diagram Responden Yang Pernah Terjebak Di Dalam Antrian Panjang

Tabel 3.6 Responden Yang Pernah Terjebak Di Dalam Antrian Panjang Terjebak Di Antrian Panjang

Jumlah Responden


Ya

89

89 %

Tidak

11

11 %

Total

100

100

Pertanyaan 5 dimaksudkan untuk mengetahui responden yang melakukan pengisian kuisioner pernah atau tidak untuk terjebak di dalam antrian yang panjang. Hasil yang diperoleh adalah responden yang pernah terjebak di dalam antrian yang panjang memiliki suara terbanyak dalam pengisian kuisioner ini dengan persentase 89 %. Gambar 3.6 menunjukkan persentase responden dalam bentuk diagram dan Tabel 3.6 menunjukkan jumlah beserta persentase dari responden yang terjebak di antrian panjang.

48

Pertanyaan 5.1 : (Pertanyaan ini hanya untuk responden yang menjawab pernah terjebak di dalam antrian panjang) Jika pernah, permasalahan apa yang paling sering anda hadapi saat melakukan antrian?

Permasalahan Yang Dihadapi Saat Tenaga Melakukan Antrian Biaya 3 3

Waktu 83

Gambar 3.7 Pie Diagram Permasalahan Yang Dihadapi Saat Melakukan Antrian

Tabel 3.7 Permasalahan Yang Dihadapi Saat Melakukan Antrian Hal Paling Dikorbankan Jumlah Responden


Waktu

83

83 %

Tenaga

3

3%

Biaya

3

3%

Total

89

89 %

Saat Mengantri

49 Pertanyaan 5.1 dimaksudkan untuk mengetahui hal yang paling dikorbankan oleh responden yang melakukan pengisian kuisioner pada saat mengantri. Hasil yang diperoleh adalah waktu yang responden korbankan pada saat mengantri memiliki suara terbanyak dalam pengisian kuisioner ini dengan persentase 83 %. Gambar 3.7 menunjukkan persentase responden dalam bentuk diagram dan Tabel 3.7 menunjukkan jumlah beserta persentase dari hal yang paling dikorbankan oleh responden pada saat mengantri.

Pertanyaan 6: Apakah yang anda lakukan jika terjebak di dalam antrian yang panjang?

Hal Yang Dilakukan Responden Saat Menunggu Di Dalam Antrian Meninggalkan Panjang Antrian dan Tidak Kembali Lagi 7 Meninggalkan Antrian Sebentar dan Kembali Lagi

Menunggu 50

43

Gambar 3.8 Pie Diagram Hal Yang Dilakukan Responden Saat Menunggu Di Dalam Antrian Panjang

50

Tabel 3.8 Hal Yang Dilakukan Saat Menunggu Di Dalam Antrian Panjang Hal Yang Dilakukan Saat Menunggu Di Dalam

Jumlah Responden


50

50 %

43

43 %

7

7%

100

100 %

Antrian Panjang Menunggu Meninggalkan Antrian Sementara dan Kembali Lagi Meninggalkan Antrian dan Tidak Kembali Lagi Total

Pertanyaan 6 dimaksudkan untuk mengetahui hal yang dilakukan responden yang mengisi kuisioner pada saat menunggu di dalam antrian panjang. Hasil yang diperoleh adalah responden yang menunggu di dalam antrian panjang memiliki suara terbanyak dalam pengisian kuisioner ini dengan persentase 50 %. Gambar 3.8 menunjukkan persentase responden dalam bentuk diagram. Tabel 3.8 menunjukkan jumlah beserta persentase hal yang dilakukan pada saat menunggu di antrian panjang dari responden.

51 Pertanyaan 7: Pernahkah nomor antrian anda terlewat begitu saja karena anda tidak berada di tempat pada saat customer service memanggil nomor

Nomor Antrian Responden Terlewat Tidak Ya 41 59

antrian anda?

Gambar 3.9 Pie Diagram Nomor Antrian Responden Terlewat

Tabel 3.9 Nomor Antrian Responden Terlewat Nomor Antrian Terlewat

Jumlah Responden


Ya

59

59 %

Tidak

41

41 %

Total

100

100 %

Pertanyaan 7 dimaksudkan untuk mengetahui berapa sering nomor antrian responden yang melakukan pengisian kuisioner terlewat karena responden tidak berada di tempat. Hasil yang diperoleh adalah nomor responden

52 yang terlewat memiliki suara terbanyak dalam pengisian kuisioner ini dengan persentase 59 %. Gambar 3.9 menunjukkan persentase responden dalam bentuk diagram dan Tabel 3.9 menunjukkan jumlah beserta persentase dari nomor antrian responden yang terlewat.

Pertanyaan 8: Apakah anda pernah merasa kesulitan untuk menghubungi customer service suatu instansi dikarenakan anda tidak mengetahui akan nomor telepon instansi tersebut?

Kesulitan Mengetahui Nomor Telepon Instansi Tidak 20 Ya 80

Gambar 3.10 Pie Diagram Kesulitan Mengetahui Nomor Telephone Instansi

Tabel 3.10 Kesulitan Mengetahui Nomor Telephone Instansi Kesulitan Mengetahui Jumlah Responden


Ya

80

80 %

Tidak

20

20 %

Nomor Telephone Instansi

53 Total

100

100 %

Pertanyaan 8 dimaksudkan untuk mengetahui responden yang mengisi kuisioner kesulitan atau tidak untuk mengetahui nomor telephone instansi. Hasil yang diperoleh adalah responden yang kesulitan mengetahui nomor telepon instansi memiliki suara terbanyak dalam pengisian kuisioner ini dengan persentase 80 %. Gambar 3.10 menunjukkan responden dalam bentuk diagram dan tabel 3.10 menunjukkan jumlah beserta persentase dari responden yang kesulitan mengetahui nomor telephone instansi.

3.1.2 Kesimpulan Analisis User Dengan Metode Questionnaire Berdasarkan hasil questionnaire yang diperoleh, dapat disimpulkan dari profesi responden tertinggi yaitu 80% berprofesi sebagai mahasiswa, dari 80% mahasiswa tersebut didapatkan data bahwa 42 orang menggunakan smartphone Android dan 38 orang tidak menggunakan smartphone Android.

3.1.3 Analisis Pelayanan Customer Service Yang Sudah Ada Berdasarkan hasil survei yang penulis lakukan ke 5 instansi yang berbeda yaitu kantor imigrasi, bank, Layanan Mahasiswa Universitas Bina Nusantara, customer service perusahaan mobile device, dan customer service perusahaan provider, maka penulis mengelompokkan jenis pelayanan customer service sebagai berikut:

54 3.1.3.1 Pelayanan Customer Service Melalui Panggilan Menggunakan Telepon (Call Service) Seringkali jika customer tidak sempat untuk mendatangi sebuah instansi maka customer akan menghubunginya lewat telepon seluler, karena waktu yang dibutuhkan lebih efisien, tidak terbatas jarak, dan dapat dilakukan dimana saja. Customer tidak perlu menghabiskan waktu dan tenaga karena customer tidak perlu mengunjungi instansi yang terkait untuk mendapatkan solusi. Namun tidak semua masalah yang dihadapi customer dapat diselesaikan melalui hubungan singkat lewat hubungan telepon. Jika customer menelepon customer service melalui line tanpa bayar, sering kali layanan operator sedang sibuk sehingga customer tidak dapat menanyakan keluhannya. Jika customer menelepon customer service melalu line berbayar, biasanya customer akan cepat terhubung namun saldo telepon customer akan berkurang. Terkadang ada pula customer yang telah menghubungi customer service namun keluhannya tidak terselesaikan akibat kurangnya komunikasi dua arah antara customer dan customer

service

ataupun

customer

memang

diharuskan

untuk

mendatangi instansi untuk mendapatkan penanganan lebih lanjut.

3.1.3.2 Pelayanan Customer Service Dengan Mendatangi Instansi Customer yang tidak menemukan solusi bagi masalahnya sering kali datang ke sebuah instansi agar permasalahannya dapat diselesaikan. Karena komunikasi dengan bertatap muka (face to face) seringkali lebih

55 efektif karena customer service bisa menjelaskan dan membimbing customer dengan lebih rinci mengenai solusi permasalahan. Namun, untuk mendatangi sebuah instansi dibutuhkan waktu, tenaga, dan biaya karena customer harus meluangkan waktunya untuk mendatangi sebuah instansi. Pada saat customer telah sampai di instansi, sering kali terdapat antrian, terutama jika banyak customer yang mempunyai keluhan namun jumlah customer service terbatas. Berdasarkan survei yang penulis lakukan ke 5 instansi yang berbeda, berikut ini adalah proses yang penulis lewati: a. Kantor imigrasi Pada kantor imigrasi, penulis bertujuan untuk mengajukan permohonan pembuatan passport, prosesnya sebagai berikut: •

Mengambil antrian dengan menekan layar touch screen, lalu dibawah layar touch screen terdapat mesin yang mengeluarkan kertas nomor antrian.

•

Menunggu nomor antrian dipanggil.

•

Menyerahkan

berkas

permohonan

pembuatan

passport. •

Mendapat kertas nomor antrian baru untuk membawa berkas asli.

•

Memperlihatkan berkas asli dan mendapat kertas nomor antrian baru untuk pembayaran.

56 •

Melakukan pembayaran dan mendapat kertas nomor antrian baru untuk sesi foto, dan pengambilan sidik jari, dan wawancara.

•

Mendapatkan kertas nomor antrian baru untuk pengambilan passport.

•

Passport diterima.

b. Bank Pada bank, penulis bertujuan untuk mengajukan pembuatan buku rekening tabungan yang baru, prosesnya sebagai berikut: •

Mengambil nomor antrian dibantu oleh security yang menekan tombol mesin kertas nomor antrian.

•


•

Menyerahkan KTP dan kartu ATM kemudian customer service mencocokan data diri customer sesuai dengan yang tertera pada komputer dan menanyakan

nomor

telepon

customer

untuk

memastikan data customer sesuai dengan yang dimiliki oleh instansi. •

Customer service menginput data customer.

•

Buku rekening yang baru diterima.

57 c. Layanan Mahasiswa Universitas Bina Nusantara Pada Layanan Mahasiswa Universitas Bina Nusantara, penulis bertujuan untuk berkonsultasi tentang cara pergantian judul skripsi, prosesnya sebagai berikut: •

Mengambil nomor antrian dengan sistem tapping menggunakan kartu mahasiswa.

•


•

Berkonsultasi dengan customer service.

•

Mengisi questionnaire mengenai kepuasan customer terhadap layanan.

•

Sesi konsultasi selesai.

d. Customer service perusahaan mobile device Pada customer service perusahaan mobile device, penulis bertujuan untuk mengganti layar handphone, prosesnya sebagai berikut: •

Mengambil nomor antrian menggunakan mesin kertas nomor antrian.

•

Menunggu antrian dipanggil.

•

Menyerahkan

handphone

yang

akan

diservis,

kemudian customer service mencocokan nomor seri handphone di komputer untuk memastikan handphone masih bergaransi.

58 •

Customer menunggu handphone diservis di ruang tunggu.

•

Customer

service

memanggil

customer

untuk

mengambil handphone yang telah selesai diservis. •

Handphone diterima.

e. Customer service perusahaan provider Pada customer service perusahaan provider, penulis bertujuan untuk melakukan aktivasi simcard paket promosi pemakaian Android selama 1 tahun, prosesnya sebagai berikut: •

Mengambil nomor antrian dibantu oleh security dengan menekan tombol mesin kertas nomor antrian.

•

Menunggu antrian dipanggil.

•

Menyerahkan

handphone

dan

customer

service

mencatat nomor seri handphone dan simcard milik customer ke dalam komputer. •

Aktivasi selesai.

Dari hasil wawancara yang penulis lakukan terhadap beberapa customer yang mengunjungi instansi, maka penulis mendapatkan hasil sebagai berikut: •

Jumlah customer service yang sedang bertugas terbatas.

•

Ruang tunggu customer penuh.

•

Hilangnya nomor antrian sehingga harus mengambil nomor antrian baru.

59 •

Suasana menjadi kurang nyaman.

3.1.4 Kesimpulan Analisis Sistem Antrian Dengan Metode Survei Dan Wawancara Jika kita mendatangi sebuah instansi, sistem antrian yang tersedia untuk customer service biasanya menggunakan nomor yang di print di selembar kertas kemudian dibagikan ke customer sesuai dengan urutan kedatangan. Tidak jarang customer membuang kertas sembarangan dan membuat lantai instansi menjadi kotor. Selain sistem antrian kertas, terdapat pula sistem antrian dengan menggunakan ID Card. Sistem ini cukup mudah dan tidak membuat instansi menjadi kotor. Namun apabila ID Card rusak atau tertinggal maka customer akan kesulitan untuk mengambil nomor antrian. Pada beberapa instansi dengan jumlah customer yang terlalu banyak menunggu, sering kali antrian menjadi sangat panjang dan ruang tunggu instansi menjadi penuh. Oleh karena mobilitas customer yang sibuk, maka beberapa customer memilih meninggalkan antrian namun kembali lagi, ataupun meninggalkan antrian namun tidak kembali lagi. Jika customer datang terlambat pada saat nomor antriannya di panggil, maka customer akan kehilangan nomor antrian dan harus mengantri lagi dari awal.

3.1.5 Hasil Dan Kesimpulan Analisis Dari hasil survei yang penulis lakukan, terlihat bahwa sistem yang sedang berjalan dewasa ini adalah nomor antrian kertas dan card tapping, berikut ini

60 adalah kelebihan dan kelemahan antara sistem antrian dengan menggunakan kertas dan kartu: a. Sistem antrian kertas. Kelebihan: • Mudah didapat. • Tidak memerlukan proses registrasi. Kelemahan: • Mudah sobek. • Mudah hilang. • Mudah tercecer. • Mudah lusuh.

b. Sistem antrian kartu. Kelebihan: • Tidak memerlukan supply kertas. • Mudah digunakan. `Kelemahan: • Customer malas melakukan proses registrasi mendapatkan kartu. • Fiturnya tidak dapat dikembangkan. • Dapat tertinggal. • Dapat patah. Berdasarkan hasil seluruh analisis, maka penulis menyimpulkan bahwa sistem antrian yang ada pada saat ini kurang efektif untuk

61 memberikan pelayanan maksimal bagi para customer yang mengunjungi instansi, untuk menciptakan suasana yang kondusif dibutuhkan sebuah solusi permasalahan yang memungkinkan customer untuk melakukan antrian tanpa harus berdesakan di ruang tunggu. Berdasarkan Information Platform of CRM pada bab 2, sistem yang didukung oleh Information Technology (IT) dapat memungkinkan Customer operation/service mengirimkan input ke Integrated Marketing Information Platform yang terdiri dari Information Content, Relational Databases, Decision Support System, Active Intelligence, Business Rules, Collaborative Communications, dan User Profiles demi membantu customer service melakukan proses pelayanan secara maksimal. Menurut Noer Soetji Rachmawati yang merupakan Customer Service Coordinator di salah satu bank, setiap customer yang datang diperkirakan mendapat waktu layanan selama 10 menit. Sehingga perkiraan waktu yang dibutuhkan untuk menunggu nomor antrian customer untuk dipanggil yaitu: Estimasi waktu= 10 menit*(nomor antrian-nomor antrian sekarang)

3.2 Perancangan Aplikasi 3.2.1 Gambaran Umum Aplikasi Yang Dibuat Sistem Pengambilan Nomor Antrian yang berbasis Android dan web ini menyediakan aplikasi pengambilan nomor antrian yang memudahkan customer pengguna aplikasi web untuk mengambil nomor antrian di instansi manapun, dan customer pengguna aplikasi smartphone Android untuk dapat mengambil nomor

62 antrian dimanapun. Untuk dapat mengakses layanan ini, instansi harus terlebih dahulu diregistrasi oleh admin melalui website. Admin akan meregistrasi Head Officer dan instansi terkait. Setelah Head Officer diregistrasi dan dapat mengakses website, Head Officer dapat meregistrasi para customer service untuk membuka layanan, menutup layanan, menghapus antrian, dan meng-input keluhan customer. Untuk Head Officer sendiri dapat mengakses study case yang berisi daftar keluhan

customer. Customer dapat melakukan registrasi

menggunakan smartphone Android dan web. aplikasi web terbatas pada proses registrasi dan pengambilan nomor antrian di instansi yang telah terdaftar. Pada aplikasi smartphone Android, setelah customer melakukan proses registrasi maka customer dapat mengambil nomor antrian di instansi yang sudah terdaftar, mengubah profile pribadi, mengganti password, mendapatkan notifikasi, melihat nomor antrian, melihat estimasi waktu antrian, mengambil nomor antrian di instansi yang berbeda, dan melakukan panggilan ke nomor instansi yang tersedia.

3.2.2 Perancangan Story Board 3.2.3.1 Perancangan Story Board Mobile Perancangan layar aplikasi ini merupakan perancangan layar Graphic User Interface (GUI) yang berisi menu-menu dari aplikasi antrian berbasis mobile yang dapat diakses oleh customer. Perancangan layar yang tersedia adalah sebagai berikut:

A. Perancangan Layar Log In

63

Gambar 3.11 Perancangan Layar Log In

Perancangan layar Log In terdiri dari: •

Logo aplikasi

•

EditText Username, untuk input username customer yang telah terdaftar.

•

Password, untuk input password customer yang telah terdaftar.

•

Button Log In, untuk mengecek apakah username dan password telah sesuai dan proses masuk ke layar utama Home.

•

Button Don’t have account? Sign Up here, untuk menampilkan layar Sign Up bagi customer yang belum melakukan pendaftaran.

64

B. Perancangan Layar Sign Up

Gambar 3.12 Perancangan Layar Sign Up

Perancangan layar Sign Up terdiri dari: •

Logo aplikasi

•

EditText Name, untuk memasukan nama customer yang akan membuat account.

•

Password, untuk memasukan password yang customer inginkan.

•

Confirm Password, untuk mengkonfirmasi kesamaan bahwa password yang diisi sebelumnya telah benar.

•

EditText Email, untuk memasukan email yang dimiliki oleh customer.

65

C. Perancangan Layar Sign Up 2

Gambar 3.13 Perancangan Layar Sign Up 2

Perancangan layar Sign Up 2 terdiri dari: •

EditText Phone Number, untuk memasukan nomor telephone yang dimiliki oleh customer.

•

DatePicker Month, Date, dan Year, untuk memungkinkan customer untuk mengisi tanggal, bulan, dan tahun kelahirannya.

•

RadioButton Male dan Female, agar customer dapat memilih jenis kelamin pria atau wanita.

•

EditText Address, agar customer dapat memasukan alamat.

66 •

Button Submit, untuk mengecek data yang di input telah benar agar customer bisa terdaftar dengan sukses.

D. Perancangan Layar Sign Up Confirmation

Gambar 3.14 Perancangan Layar Sign Up Confirmation

Perancangan layar Sign Up Confirmation terdiri dari: •

Logo aplikasi

•

TextView Name, Password, Email, Phone Number, Birth Date, Gender, Address untuk menampilkan data diri yang telah di input oleh customer saat melakukan Sign Up.

•

Button Submit, untuk mengkonfirmasi bahwa data yang ditampilkan di layar Sign Up Confirmation telah sesuai agar customer bisa terdaftar dengan sukses.

67 E. Perancangan Layar Sign Up Confirmation 2

Gambar 3.15 Perancangan Layar Sign Up Confirmation 2

Perancangan layar Sign Up Confirmation 2 terdiri dari: •

AlertDialogue Confirm, untuk memberi peringatan apakah customer ingin menyimpan profile berdasarkan data yang telah di input.

•

Button Yes, untuk memastikan bahwa customer setuju bahwa data profile yang di input telah sesuai.

•

Button Cancel, untuk membatalkan data profile yang telah di input namun customer akan langsung merubah data kembali.

•

Button No, untuk membatalkan data profile yang telah di input.\

68 F. Perancangan Layar Sign Up Success

Gambar 3.16 Perancangan Layar Sign Up Success

Perancangan layar Sign Up Success terdiri dari: •

Progress Dialogue Loading, untuk menampilkan data sedang di proses

•

Toast Registration Success, untuk memberitahukan kepada customer bahwa pendaftaran profile-nya telah sukses.

69 G. Perancangan Layar Home

Gambar 3.17 Perancangan Layar Home

Perancangan layar Home terdiri dari: •

Logo aplikasi

•

Terdapat kata sambutan disertai username yang sedang membuka apilkasi di sisi kanan atas.

•

Spinner Instance Name, agar customer dapat memilih Instansi yang akan dikunjungi.

•

GridView Pick Queue Number, agar customer dapat mengambil nomor antrian.

•

GridView My Profile, agar customer dapat melihat profile dirinya sendiri.

•

GridView My Queue, agar customer dapat melihat antrian yang telah diambil.

70 •

GridView Call the Customer Service, agar customer dapat menelepon customer service.

•

GridView About Us, agar customer dapat melihat profile aplikasi.

H. Perancangan Layar Select The Instance

Gambar 3.18 Perancangan Layar Select The Instance

Perancangan layar Select The Instance terdiri dari: •

Spinner

Instance Name, untuk memudahkan customer

untuk memilih nama instansi yang akan dikunjungi.

71 I. Perancangan Layar Pick Queue Number

Gambar 3.19 Perancangan Layar Pick QueueNumber

Perancangan layar Pick Queue terdiri dari: •

Logo aplikasi

•

TextView Instance Name, untuk menampilkan instansi yang telah dipilih sebelumnya.

•

TextView Queue Number, untuk menampilkan nomor antrian yang tersedia.

•

Toast Your queue number has been added, Go to My queue menu to see All your queue number untuk memberitahukan bahwa nomor antrian telah terdaftar.

•

Button Ok, untuk membuka layar berikutnya yaitu Pick Queue Number and Time Estimation.

72 J. Perancangan Layar Pick Queue Number and Time Estimation

Gambar 3.20 Perancangan Layar Pick Queue Number and Time Estimation

Perancangan layar Pick Queue Number and Time Estimation terdiri dari: •

Logo aplikasi

•


•

TextView Queue Number, untuk menampilkan nomor antrian yang tersedia.

•

Time Estimation, untuk menampilkan perkiraan waktu nomor antrian akan dipanggil.

•

Button Ok, untuk kembali ke layar Home.

73 K. Perancangan Layar Pick Queue Number Validate

Gambar 3.21 Perancangan Layar Pick Queue Number Validate

Perancangan layar Pick Queue Number Validate terdiri dari: •

Logo aplikasi.

•


•

TextView ! (Alert), untuk menampilkan bahwa nomor antrian tidak bisa diambil.

•

Toast You can pick queue number after 1 minute, untuk memberitahukan bahwa customer dapat mengambil nomer antrian berikutnya setelah 1 menit.

•


74 L. Perancangan Layar My Profile

Gambar 3.22 Perancangan Layar My Profile

Perancangan layar My Profile terdiri dari: •

Logo aplikasi

•

TextView Name, Email, Phone Number, Birth Date, Gender, dan Address, untuk menampilkan customer profile.

•

Button Edit Profile, untuk mengubah customer profile.

•

Button Change Password, untuk mengubah password customer.

75 M. Perancangan Layar Edit Profile

Gambar 3.23 Perancangan Layar Edit Profile

Perancangan layar Edit Profile terdiri dari: •

Logo aplikasi.

•

EditText Name, untuk memasukan nama baru customer yang akan diganti.

•

Password, untuk memasukan password yang customer miliki sebelumnya.

•


•


76 N. Perancangan Layar Edit Profile 2

Gambar 2.24 Perancangan Layar Edit Profile 2

Perancangan layar Edit Profile 2 terdiri dari: •

EditText Phone Number, untuk memasukan nomor telepon yang dimiliki oleh customer.

•

DatePicker Month, Date, dan Year, untuk memungkinkan customer untuk mengisi tanggal, bulan, dan tahun kelahirannya.

•

RadioButton Male dan Female, agar customer dapat memilih jenis kelamin pria atau wanita.

•

EditText Address, agar customer dapat memasukan alamat.

•


77 O. Perancangan Layar Edit Profile Confirmation

Gambar 3.25 Perancangan Layar Edit Profile Confirmation

Perancangan layar Edit Profile Confirmation terdiri dari: •


•

Button Yes, untuk memastikan bahwa customer setuju bahwa data profile yang di input telah sesuai.

•

Button Cancel, untuk membatalkan data profile yang telah di input namun customer akan langsung merubah data kembali.

•

Button No, untuk membatalkan data profile yang telah di input.

78 P. Perancangan Layar Edit Profile Success

Gambar 3.26 Perancangan Layar Edit Profile Success

Perancangan layar Edit Profile Success terdiri dari: •

Progress Dialogue Loading, untuk menampilkan data sedang diproses.

•

Toast Your profile has been changed, untuk memberitahukan kepada customer bahwa profile-nya telah diubah.

79 Q.

Perancangan Layar Change Password

Gambar 3.27 Perancangan Layar Change Password

Perancangan layar Change Password terdiri dari: •

EditText Old Password, agar customer bisa memasukan password lama.

•

EditText New Password, agar customer bisa memasukan password baru.

•

EditText Confirm New Password, agar customer bisa mengkonfirmasi password baru.

•

Button Submit, untuk mengecek data yang di input telah benar agar perubahan password yang dilakukan customer bisa terdaftar dengan sukses.

80 R.

Perancangan Layar Change Password Confirmation

Gambar 3.28 Perancangan Layar Change Password Confirmation

Perancangan layar Change Password Confirmation terdiri dari: •


•

Button Yes, untuk memastikan bahwa customer setuju bahwa password yang di input telah sesuai.

•

Button Cancel, untuk membatalkan password yang telah di input namun customer akan langsung merubah data kembali.

•

Button No, untuk membatalkan password yang telah di input.

81 S.

Perancangan Layar Change Password Success

Gambar 3.29 Perancangan Layar Change Password Success

Perancangan layar Change Password Success terdiri dari: •

ProgressDialogue Loading, untuk menampilkan data sedang diproses.

•

Toast

Your

profile

has

been

changed,

untuk

memberitahukan kepada customer bahwa profile-nya telah diubah.

82 T.

Perancangan Layar My Queue

Gambar 3.30 Perancangan Layar My Queue

Perancangan layar My Queue terdiri dari: •Logo aplikasi •TextView Instance Name 1, untuk menampilkan nama instansi pertama yang telah dipilih. •TextView Instance Name n, untuk menampilkan nama instansi yang dipilih selanjutnya karena customer dapat memesan nomor antrian di lebih dari 1 Instansi. •TextView Recent Queue Number, untuk menampilkan nomor antrian yang sedang berjalan. •TextView My Queue Number n, untuk menampilkan nomor antrian yang dimiliki customer.

83 •TextView Status, untuk menampilkan status antrian. Terdapat 3 status yaitu, “waiting”, “on service” dan “done”. Status “waiting” akan muncul ketika nomer antrian customer belum dipanggil. Status “on service” akan muncul ketika nomor antrian customer sedang dilayani oleh customer service. Status “done” akan muncul ketika nomor antrian telah dilayani oleh customer service ataupun terlewat.

U.

Perancangan Layar Set Notification and Time Estimation

Gambar 3.31 Perancangan Layar Set Notification and Time Estimation

Perancangan layar Set Notification and Time Estimation terdiri dari: •

Logo aplikasi.

84 •

TextView Instance Name, untuk menampilkan nama Instansi yang telah dipilih.

•

TextView In this feature you can activate your queue number of each instance that you have picked, untuk memberi tahu bahwa fitur ini berguna untuk membantu customer mengaktifkan notifikasi.

•

TextView Your Number, untuk menampilkan nomor antrian yang customer miliki.

•

TextView Time Estimation, untuk menampilkan perkiraan waktu nomor antrian customer akan dipanggil.

•

V.

Button Set Notification, untuk mengaktifkan notifikasi.

Perancangan Layar Set Notification Success

Gambar 3.32 Perancangan Layar Set Notification Success

85 Perancangan layar Set Notification Success terdiri dari: •

Toast Notification for this instance has been switched on, untuk memberitahu customer bahwa notifikasi untuk instansi yang bersangkutan telah diaktifkan.

W.

Perancangan Layar Show Notification

Gambar 3.33 Perancangan Layar Show Notification

Perancangan layar Show Notification terdiri dari: •

TextView Date, untuk menampilkan tanggal

•

TextView Time, untuk menampilkan waktu.

•

Logo q-mobile

•

TextView Attention, untuk menampilkan peringatan

86 •

TextView n number left, untuk menampilkan berapa orang yang harus dilewati sebelum nomer antrian customer dipanggil.

X.

Perancangan Call to Customer Service

Gambar 3.34 Perancangan Call to Customer Service

Perancangan layar Call to Customer Service terdiri dari: •

Instance Customer Service Number, untuk menampilkan nomor telepon customer service sesuai dengan instansi yang di pilih sebelumnya.

•

Keyboard Phone Number, untuk mengetik nomer telepon Instansi, namun jika pada nama Instansi sudah dipilih pada layar Menu, maka nomer telepon pada Customer Service akan muncul secara otomatis.

87 •

Button Call, untuk melakukan panggilan ke nomor Instansi yang berada pada layar.

Y.

Layar Perancangan About

Gambar 3.35 Layar Perancangan About

Perancangan layar About terdiri dari: •

Logo aplikasi.

•

TextView About, untuk memberitahukan bahwa layar yang dibuka adalah layar About.

•

TextView Text, untuk menjelaskan perkenalan aplikasi.

88 Z.

Perancangan Layar Log Out

Gambar 3.36 Perancangan Layar Log Out

Perancangan layar Log Out terdiri dari: •

Option menu Log Out, agar customer bisa keluar dari aplikasi dengan cara menekan tombol menu pada device.

3.2.3.2 Perancangan Story Board Web Berikut ini adalah perancangan layar web yang dapat dibuka oleh admin, head officer,customer service dan customer. Perancangan yang tersedia pada layar web adalah sebagai berikut:

89 A.

Perancangan Layar Web Login

Gambar 3.37 Perancangan Layar Web Login

Perancangan layar Web Login terdiri dari: •

Layar Web Login dapat di akses oleh admin, head officer, dan customer service.

•

Logo aplikasi.

•

TextBox UserID, agar user bisa mengisi ID, apabila Head Officer ingin melakukan log in, harus pastikan admin telah melakukan registrasi ID bagi Head Officer. Jika Customer service ingin melakukan log in, harus pastikan Head Officer telah melakukan registrasi ID bagi customer service.

•

Password, agar user dapat mengisi password.

•

Button Submit, untuk mengecek data yang di input telah benar agar bisa masuk ke layar Home.

90 B. Perancangan Layar Admin Home

Gambar 3.38 Perancangan Layar Admin Home

Perancangan layar Admin Home terdiri dari: •

Layar ini hanya bisa diakses oleh admin.

•

Logo aplikasi.

•

Button Log Out, untuk keluar dari aplikasi website.

•

Label Date, untuk melihat tanggal pada saat website sedang diakses.

•

Button Register the instance and the Head Officer, untuk meregistrasi Head Officer dan meregistrasi instansi

•

Label Copyright, untuk mencantumkan hak cipta bagi web application.

91 C. Perancangan Layar Register The Instance

Gambar 3.39 Perancangan Layar Register The Instance

Perancangan layar Register The Instance terdiri dari: •

Layar ini hanya bisa diakses oleh admin.

•

Logo aplikasi.

•


•

Button Back to home, untuk kembali ke layar admin Home.

•


•

TextBox Instance Name, untuk memasukan nama instansi.

92 •

TextBox Instance Address, untuk memasukan alamat instansi.

•

ComboBox Instance Type, untuk memilih salah satu dari tipe instansi yang tersedia yaitu pemerintahan, perbankan, dan telekomunikasi.

•

TextBox Instance Phone, untuk memasukan nomer telepon instansi.

•

TextBox Instance Description, untuk memasukan deskripsi mengenai profile instansi yang terkait.

•

TextBox Head Office Name, untuk memasukan nama head officer.

•

Password, untuk memasukan password yang akan dipakai oleh Head Officer.

•

TextBox Head Officer Email, untuk memasukan email head officer.

•

Button Submit, untuk mengecek data yang di input telah benar agar head officer bisa terdaftar dengan sukses.

•


93 D. Perancangan Layar Notification Register Instance Success

Gambar 3.40 Perancangan Layar Notification Registration Instance Success

Perancangan Layar Notification Registration Instance Success terdiri dari: •

Alert Registration was successful, untuk memberikan notifikasi bahwa proses meregistrasi instansi telah dilakukan dengan sukses.

•


•

TextView Instance Name, Instance ID, Head Officer Name, Head Officer ID, Head Officer Password, untuk menampilkan Nama instansi, ID instansi, Nama Head Officer, ID Head Officer, dan Password Head Officer yang telah sukses terdaftar.

94 E. Perancangan Layar Head Officer Home

Gambar 3.41 Perancangan Layar Head Officer Home

Perancangan layar Head Officer Home terdiri dari: •

Layar ini hanya bisa diakses oleh Head Officer.

•

Logo aplikasi.

•

Button

Study

Case

Problem,

untuk

mempelajari

permasalahan yang dimiliki oleh customer mengenai Instansi terkait. •

Log Out, untuk keluar dari aplikasi website.

•


•

Button register the customer service, untuk meregistrasi customer service.

•


95 F. Perancangan Layar Register Customer Service

Gambar 3.42 Perancangan Layar Register Customer Service

Perancangan layar Register Customer Service terdiri dari: •


•

Logo aplikasi.

•


•

Button Back to home, untuk kembali ke layar Head Officer Home.

•

Button

Study

Case

Problem,

untuk

mempelajari

permasalahan yang dimiliki oleh customer mengenai instansi terkait.. •


•

TextBox Customer Service Name, untuk mengisi nama customer service.

96 •

PasswordField, untuk mengisi password customer service.

•

ComboBox Gender, untuk memilih jenis kelamin customer service.

•

Button Submit, untuk mengecek data yang di input telah benar agar customer service bisa terdaftar dengan sukses.

•


G. Perancangan Layar Notification Registration Customer Service Success

Gambar 3.43 Perancangan Layar Notification Registration Customer Service Success

Perancangan Layar Notification Registration Customer Service Success terdiri dari: •

Alert Registration was successful, untuk memberikan notifikasi bahwa proses meregistrasi customer service telah dilakukan dengan sukses.

97 •


•

TextView Customer Service Name, Customer Service ID, Customer Service Password, untuk menampilkan Nama customer service, ID customer service, dan Password customer service yang telah sukses terdaftar.

H. Perancangan Layar Study Case Problem

Gambar 3.44 Perancangan Layar Study Case Problem

Perancangan layar Study Case Problem terdiri dari: •


•

Logo aplikasi.

•


98 •

Button Back to home, untuk kembali ke layar Head Officer Home.

•

Button

Study

Case

Problem,

untuk

mempelajari

permasalahan yang dimiliki oleh customer mengenai Instansi terkait.. •


•

TextBox

Keyword,

untuk

memasukan

kata

kunci

berdasarkan ID customer service. •

Button Search, untuk melakukan pencarian sesuai kata kunci.

•

Label Subject, menampilkan subject keluhan customer

•

Label Problem, menampilkan

rincian permasalahan

customer •

Label Response, menampilkan saran sebagai solusi bagi permasalahan customer

•

Label Post on (date), untuk menampilkan pada tanggal berapa permasalahan diinput.

•

Label By (ID customer service), untuk menampilkan ID customer service yang menginput data.

99 I. Perancangan Layar Customer Service Home

Gambar 3.45 Perancangan Layar Customer Service Home

Perancangan layar Customer Service Home terdiri dari: •

Layar ini hanya bisa diakses oleh Customer Service.

•

Logo aplikasi.

•


•

Label Date, untuk melihat tanggal pada saat web sedang diakses.

•

Button open queue, untuk membuka antrian.

•


100 J. Perancangan Layar Queue Manager

Gambar 3.46 Perancangan Layar Queue Manager

Perancangan layar Queue Manager terdiri dari: •

Label Date, untuk melihat tanggal pada saat web sedang diakses.

•

Label Time, untuk melihat waktu pada saat web sedang diakses

•

TextBox Subject, untuk mengisi subject permasalahan yang dialami oleh customer.

•

TextBox Problem, untuk mengisi definisi permasalahan yang dialami oleh customer.

•

TextBox Response, untuk mengisi respon dari customer service terhadap permasalahan yang dialami oleh customer.

101 •

Label Queue Active, untuk menampilkan nomor antrian yang telah dilayani.

•

Label Queue Number, untuk menampilkan nomor antrian yang sedang dilayani.

•

Button Clear Queue, untuk menghapus antrian.

•

Button Next, untuk melayani customer berikutnya.

•

Button Close Queue, untuk mengakhiri layanan.

•

Button Submit, untuk menyimpan data yang akan diinput.

K.

Perancangan Layar Choose Instance

Gambar 3.47 Perancangan Layar Web Choose Instance

Perancangan Layar Choose Instance terdiri dari:

102 • Choose Instance hanya dapat di akses oleh karyawan instansi sesuai dengan instansi terkait untuk memungkinkan layar web customer dapat dibuka. •

Logo aplikasi.

•

Combo Box Select The Instance, untuk memilih instansi

•

Button Enter, untuk masuk ke layar form pick queue.

L.

Perancangan Layar Form Pick Queue

Gambar 3.48 Perancangan Layar Form Pick Queue

Perancangan layar Form Pick Queue terdiri dari: •

Layar Form Pick Queue hanya dapat di akses oleh customer yang berada di instansi.

•

Logo aplikasi.

•

TextBox Username, agar customer bisa mengisi username.

•

Password, agar user dapat mengisi password.

103 •

Button Submit, untuk mengecek data yang di input telah benar agar bisa masuk ke layar Home.

•

Button Sign Up here, agar customer dapat melakukan proses registrasi.

M. Perancangan Layar Register Form

Gambar 3.49 Perancangan Layar Register Form

Perancangan layar Register Form terdiri dari: •

Layar ini hanya bisa diakses oleh customer yang berada di instansi.

•

Logo aplikasi.

•

EditText Name, untuk memasukan nama baru customer yang akan diganti.

104 •

Password, untuk memasukan password yang customer miliki sebelumnya.

•


•


•

EditText Phone Number, untuk memasukan nomor telephone yang dimiliki oleh customer.

•

Combo Box Month, Date, dan Year, untuk memungkinkan customer untuk mengisi tanggal, bulan, dan tahun kelahirannya.

•

Combo Box Male dan Female, agar customer dapat memilih jenis kelamin pria atau wanita.

•

TextBox Address, agar customer dapat memasukan alamat.

•


105

N. Perancangan Layar Customer Registration Success

Gambar 3.50 Perancangan Layar Customer Registration Success

Perancangan Layar Customer Registration Success terdiri dari: • Alert Registration Success, untuk memberitahu customer bahwa proses registrasi sukses dilakukan.

106

O. Perancangan Layar Pick Queue Success

Gambar 3.51 Perancangan Layar Pick Queue Success

Perancangan Layar Pick Queue Success terdiri dari: •

Alert Your queue number, untuk menampilkan peringatan nomor antrian sukses dilakukan.

•

View queue number, untuk menampilkan nomor antrian yang di dapat.

•

Button Ok, untuk kembali ke layar Pick Queue Customer.

107

3.3 Skema Perancangan Sistem Melalui Pendekatan Ubiquitous Computing

Gambar 3.52 Skema Perancangan Sistem Melalui Pendekatan Ubiquitous Computing

Pada perancangan sistem ini, admin, head officer, customer service, dan customer terhubung dalam satu jaringan. Pada skema dapat dilihat bahwa customer mengambil nomor antrian ke server dan disimpan ke database dimana customer service akan mengubah nomor antrian setiap waktunya dan akan memanggil customer pada saat nomor antriannya tiba. Customer service akan me-input case problem customer ke dalam database, sehingga head officer dapat mengetahui dan mempelajari case problem customer pada instansi masing-masing. Admin bertugas untuk mendaftarkan instansi.

108

3.4 Perancangan UML Berikut ini adalah perancangan UML yang digunakan dalam aplikasi mobile dan web: 3.4.1 Perancangan Use Case

109 Gambar 3.53 Perancangan Primary Use Case 3.4.2 Perancangan Activity Diagram

Gambar 3.54 Activity Diagram Register The Instance

Activity ini menjelaskan proses pendaftaran instansi yang dilakukan oleh admin pada aplikasi website. •

Pada halaman Register The Instance, admin mengisi formulir registrasi instansi.

•

Apabila data yang diisikan belum valid, maka aplikasi akan menampilkan pesan error.

•

apabila data yang diisikan sudah valid maka registrasi sukses.

Gambar 3.55 Activity Diagram Register The Customer Service

110

Activity ini menjelaskan proses pendaftaran customer service yang dilakukan oleh head officer pada aplikasi website. •

Pada halaman Register The Customer Service, head officer mengisi formulir registrasi customer service..

•


•

Apabila data yang diisikan sudah valid maka maka registrasi sukses.

Gambar 3.56 Activity Diagram Study Case Problem

Activity ini menjelaskan proses untuk menampilkan laporan mengenai masalah, keluhan, maupun saran customer kepada head officer dengan aplikasi website. •

Pada halaman home, headofficer memilih study case problem link.

•

Aplikasi akan menampilkan halaman study case problem.

•

Aplikasi akan menampilkan seluruh permasalahan, keluhan, ataupun saran customer terhadap masing-masing instansi.

111

Gambar 3.57 Activity Diagram Open Queue

Activity ini menjelaskan proses pada saat customer service membuka pendaftaran antrian pada aplikasi website. •

Setelah customer service berhasil melakukan login, aplikasi akan menapilkan halaman Home.

•

Customer service membuka pendaftaran antrian.

•

Pendaftaran antrian telah dibuka.

Gambar 3.58 Activity Diagram Submit Case Problem

Activity ini menjelaskan proses penyimpanan data yang berisi permasalahan yang dimiliki customer terhadap masing-masing instansi yang dilakukan oleh customer service pada aplikasi website.

112 •

Pada halaman Queue Manager, customer service mengisikan data yang berisi permasalahan yang dimiliki customer.

•


•

Apabila data yang diisikan sudah valid maka aplikasi akan menampilkan pesan bahwa permasalahan telah di simpan.

•

Data case problem telah disimpan.

Gambar 3.59 Activity Diagram Update Queue Number

Activity ini menjelaskan proses saat customer service meng-update nomor antrian untuk melakukan panggilan terhadap nomor antrian selanjutnya. •

Aplikasi akan menampilkan halaman Queue Manager dan pada halaman ini customer service melihat daftar antrian.

•

Kemudian customer service memanggil customer pada nomor antrian selanjutnya.

•

Customer pada nomor antrian selanjutnya dipanggil.

113

Gambar 3.60 Activity Diagram Clear Queue

Activity ini menjelaskan proses saat melakukan penghapusan seluruh daftar antrian melalui aplikasi website. •


• •

Kemudian customer service menghapus daftar antrian . Semua daftar antrian akan terhapus.

Gambar 3.61 Activity Diagram Close Queue

Activity ini menjelaskan proses pada saat customer service melakukan penutupan pendaftaran antrian pada aplikasi website. •


•

Kemudian customer service menutup pendaftaran antrian.

•

Pendaftaran antrian akan tertutup.

114

Gambar 3.62 Activity Diagram Register A Customer

Activity ini menjelaskan proses registrasi akun untuk customer

pada

aplikasi mobile. •

Saat aplikasi pertama kali dijalankan, customer akan melihat halaman login dan menu untuk melakukan registrasi.

•

Saat customer memilih menu Sign Up, maka customer akan melihat form registrasi.

•

Saat form registrasi dikirimkan sistem akan melakukan validasi data, jika form sudah benar maka data akan ditampilkan dan customer akan melihat pesan untuk melakukan konfirmasi, jika form belum sesuai maka customer akan melihat pesan error.

•

Jika customer sudah melakukan konfirmasi maka customer akan mendapatkan pesan registrasi sukses.

115

Gambar 3.63 Activity Diagram Pick Queue Number

Activity ini menjelaskan proses pengambilan nomor antrian customer service pada aplikasi mobile. •

Saat customer berhasil login, customer akan melihat menu untuk memilih nama instansi

•

Setelah memilih nama instansi, customer bisa melakukan pengambilan nomor antrian dengan memilih menu pick queue number.

•

Setelah memilih menu pick queue number, customer akan mendapatkan nomor antrian dan dapat melihat estimasi waktu berapa lama nomor antrian customer akan dipanggil. Nomor antrianpun sudah disimpan ke database.

Gambar 3.64 Activity Diagram Set Notification

Activity ini menjelaskan proses pengaturan notifikasi antrian oleh customer pada aplikasi mobile.

116 •

Customer dapat melihat nomor antrian yang sudah diambil di dalam menu My Queue.

•

Pada saat customer memilih menu My Queue, customer akan melihat list nomor antriannya pada setiap instansi dan customer juga dapat melihat informasi nomor antrian yang sedang berjalan.

•

Customer dapat mengatur pemberitahuan dengan memilih nomor antrian yang terdapat pada list my queue,dan aplikasi pun akan pindah ke menu Set Notification.

•

Pada menu Set Notification, customer dapat melihat estimasi waktu berapa lama nomor antrian customer akan dipanggil.

•

Customer dapat mengaktifkan pemberitahuan dengan memilih tombol Set Notification,dan customer akan mendapatkan pesan bahwa notifikasi sudah diaktifkan.

Gambar 3.65 Activity Diagram Call To The Customer Service

Activity ini menjelaskan proses melakukan panggilan telepon ke custome service melalui aplikasi mobile. •

Aplikasi akan menampilkan tampilan menu utama, Lalu customer memilih nama instansi yang akan dihubungi.

117 •

Setelah memilih nama instansi, customer dapat melakukan panggilan telepon dengan memilih menu Call To The Customer Service.

•

Aplikasi akan secara otomatis pindah ke activity phone service dan menampilkan nomor telepon dari instansi yang sudah dipilih sebelumnya, setelah melakukan konfirmasi panggilan phone service akan melakukan panggilan.

Gambar 3.66 Activity Diagram Edit Profile

Activity ini menjelaskan proses penggantian profile customer pada aplikasi mobile •

Saat customer memilih menu my profile, customer akan melihat profil dan tombol Edit Profile.

•

Saat customer memilih tombol Edit Profile maka customer akan melihat form untuk melakukan penggantian profile.

•

Setelah customer mengisi form penggantian profile dan dikirim, aplikasi akan melakukan validasi data, jika form sudah benar maka customer akan melihat data apa saja yang sudah diinput.

•

jika data sudah sesuai maka customer bisa melanjutkan proses dengan menekan tombol submit lalu mendapatkan pesan untuk melakukan

118 konfirmasi peggantian profile dan customer akan mendapatkan pesan bahwa penggantian profile berhasil ,jika data form belum sesuai maka customer akan melihat pesan error.

Gambar 3.67 Activity Diagram Change Password

Activity ini menjelaskan proses penggantian password customer pada aplikasi mobile. •

Saat customer memilih menu My Profile, customer akan melihat profile dan tombol change password.

•

Customer dapat melakukan penggantian password dengan memilih tombol change password, lalu customer akan mendapatkan form untuk mengganti password.

•

Setelah mengisi form penggantian password, aplikasi akan melakukan validasi data. Jika data pada form tersebut sudah sesuai, maka customer akan diminta untuk mengkonfirmasi untuk melakukan penggantian password dan proses selesai, tetapi jika data pada form belum sesuai, maka customer akan mendapatkan pesan error dan kembali ke tampilan form penggantian password.

119

Gambar 3.68 Activity Diagram Register The Customer Web

Activity ini menjelaskan proses pendaftaran customer yang dilakukan melalui aplikasi web. •

Pada halaman Register The Customer, customer mengisi formulir registrasi customer.

•


•

Apabila data yang diisikan sudah valid maka maka registrasi sukses.

Gambar 3.69 Activity Diagram Pick Queue Number Customer Web

Activity ini menjelaskan proses pengambilan nomor antrian customer service pada aplikasi web.

120 •

customer akan melihat menu untuk memilih nama instansi

•

Setelah memilih nama instansi, customer bisa melakukan pengambilan nomor antrian dengan memilih mengisi form pick queue number.

•

Setelah mengisi form pick queue number, customer akan mendapatkan nomor antrian dan nomor antrianpun sudah disimpan ke database.

121

3.4.3 Perancangan Class Diagram

Gambar 3.70 Class Diagram Sistem Pengambilan Nomor Antrian

122 3.4.4 Perancangan Sequence Diagram

Gambar 3.71 Sequence Diagram Register the Instance

Sequence ini menjelaskan sistem proses pendaftaran instansi yang dilakukan oleh admin pada aplikasi website. •

Setelah admin berhasil melakukan log in, aplikasi akan menampilkan halaman Home.

•

Admin memilih link Register the Instance.

•

Aplikasi akan mengambil data Instance Type.

123 •

Aplikasi akan menampilkan halaman Register the Instance.

•

Admin mengisi data sesuai dengan formulir registrasi instansi.

•

Setelah menekan tombol submit, aplikasi akan menjalankan fungsi doRegisterInstance().

•

Controller register pada register instance akan menjalankan fungsi addNewInstance()

untuk

disimpan

di

table

instance

dan

addNewHeadOfficer() untuk disimpan di table head officer dan table user dalam database. •

Apablia data yang di input sudah valid, aplikasi akan memberi informasi bahwa registrasi sukses.

•

Apabila data yang di input tidak valid, aplikasi akan menampilkan pesan error.

124

Gambar 3.72 Sequence Diagram Register The Customer Service Member

Sequence ini menjelaskan sistem proses pendaftaran customer service yang dilakukan oleh head officer pada aplikasi website. •

Setelah customer service berhasil melakukan log in, aplikasi akan menampilkan halaman Home.

•

Customer service memilih Register The Customer Service link.

•

Aplikasi akan menampilkan halaman Register The Customer Service.

•

Head officer mengisi data sesuai dengan formulir registrasi customer service.

125 •

Setelah menekan tombol submit, aplikasi akan menjalankan fungsi doRegisterCustomerService().

•

Controller

register

customer

service

akan

menjalankan

fungsi

addNewCustomerService() untuk disimpan di table customer service dan table user dalam database. •

Apablia data yang diinput sudah valid, aplikasi akan memberi informasi bahwa registrasi sukses.

•

apabila data yang diinput tidak valid, aplikasi akan menampilkan pesan error.

Gambar 3.73 Sequence Diagram Study Case Problem

126 Sequence

ini

menjelaskan

proses

untuk

menampilkan

laporan

permasalahan kepada head officer yang dimiliki customer terhadap masingmasing instansi melalui aplikasi website. •

Pada halaman Home, head officer memilih link menu study case problem.

•

Aplikasi menjalankan fungsi DoStudyCaseProblem().

•

Aplikasi menampilkan halaman study case problem.

•

Aplikasi menampilkan seluruh permasalahan yang dimiliki customer terhadap masing-masing instansi.

Gambar 3.74 Sequence Diagram Open Queue

127 Sequence ini menjelaskan proses melakukan pembukaan antrian baru dengan mengganti status pada log_status_queue table dari status closed menjadi opened. •

Saat customer service berhasil melakukan login, aplikasi akan menampilkan halaman home.

•

Dengan memilih link open queue, aplikasi akan menjalankan fungsi OpenQueue().

•

Kemudian controller queue akan menjalankan fungsi InsertStatus() untuk mengganti status antrian yang ada di table log_status_queue.

•

Pendaftaran antrian telah dibuka.

Gambar 3.75 Sequence Diagram Submit Case Problem

128 Sequence ini menjelaskan sistem proses penyimpanan data yang berisi permasalahan yang dimiliki customer di table case problem dalam database yang dilakukan oleh customer service pada aplikasi website. •

Aplikasi akan menampilkan halaman Queue Manager.

•

Customer service mengisikan data pada formulir case problem.

•

Aplikasi akan menjalankan fungsi doSubmitCaseProblem.

•

Controller

submit

case

problem

akan

menjalankan

fungsi

AddNewCaseProblem() untuk disimpan di table case problem dalam database. •

Apablia data yang diinput sudah valid, aplikasi akan memberi informasi bahwa registrasi sukses namun apabila data yang diinput tidak valid maka aplikasi akan menampilkan pesan error.

129

Gambar 3.76 Sequence Diagram Update Queue Number

Sequence ini menjelaskan proses customer service meng-update nomor status daftar antrian dari status “waiting” menjadi pada log_status_queue table dalam database. •

Pada halaman queue manager, customer service memangil customer.

•

Aplikasi menjalankan fungsi CallCustomer().

•

Controller queue menjalankan fungsi UpdateQueueStatus().

•

Aplikasi menampilkan nomor antrian saat ini.

•

Customer service mendapatkan nomor antrian.

130 •

Customer selesai dilayani.

•

Dengan menekan tombol done, aplikasi menjalankan fungsi NextQueue().

•

Controller queue menjalankan fungsi UpdateQueueStatus().

Gambar 3.77 Sequence Diagram Clear Queue

Sequence ini menjelaskan sistem proses melakukan penghapusan seluruh daftar antrian yang ada pada queue table dalam database. •

Saat customer service membuka halaman queue manager, aplikasi akan mendapatkan daftar antrian.

•

Aplikasi menampilkan daftar antrian.

131 •

Dengan menekan tombol clear queue, maka aplikasi akan menjalankan fungsi ClearQueue().

•

Seluruh daftar antrian yang ada pada queue table di dalam database akan terhapus.

•

Aplikasi akan menampilkan pemberitahuan bahwa daftar antrian telah dihapus.

Gambar 3.78 Sequence Diagram Close Queue

Sequence ini menjelaskan proses melakukan penggantian status daftar antrian dari status opened menjadi “closed” pada log_status_queue table dalam database.

132 •

Saat customer service membuka halaman queue manager, aplikasi akan mendapatkan daftar antrian.

•

Dengan menekan tombol close queue, maka aplikasi akan menjalankan fungsi CloseQueue().

•

Kemudian controller queue akan menjalankan fungsi InsertStatus() untuk mengganti status antrian yang ada di table log_status_queue.

•

Pendaftaran antrian telah ditutup.

Gambar 3.79 Sequence Diagram Register The Customer

133 Sequence ini menjelaskan sistem proses pada saat customer melakukan registrasi pada aplikasi mobile. •

Saat aplikasi pertama kali dijalankan, customer akan melihat halaman login dan menu untuk melakukan registrasi

yang ditampilkan

MobileInterface. •

Saat customer memilih menu Sign Up,sistem akan menampilakan form registrasi.

•

Setelah form diisi dan customer mengirim form tersebut, sistem akan menjalankan fungsi ValidasiData() yang ada di SignUpActivity.

•

Jika form sudah sesuai maka data akan ditampilkan dan customer akan melihat pesan untuk melakukan konfirmasi, jika form belum sesuai maka customer akan melihat pesan error.

•

Saat customer melakukan konfirmasi maka sistem akan menggunakan fungsi RegisterCustomer() yang ada di sign up confirmation activity dan mengirim data customer ke server RegisterCustomerCR, lalu di server data tersebut di-input kedalam database customer dengan menggunakan fungsi InsertCustomerData(),sistem akan mendapatkan pesan dari server bahwa data berhasil diinput dan customer akan mendapatkan pesan registrasi sukses.

134

Gambar 3.80 Sequence Diagram Pick Queue Number

Sequence ini menjelaskan sistem proses pada saat customer melakukan pengambilan nomor antrian di setiap instansi pada aplikasi mobile. •

Sebelum mengambil nomor antrian, customer harus memilih nama instansi terlebih dahulu dengan memilih menu Select The Instance yang ditampilkan oleh MobileInterface.

•

Setelah memilih instansi, customer dapat melakukan pengambilan nomor antrian dengan memilih menu pick queue number. Sistem akan mengunakan

fungsi

PickQueueNumber()

yang

ada

di

Pick

135 QueueNumberActivity dan QueueNumberActivity menggunakan fungsi PickQueueNumber() yang ada di server QueueCR. •

Fungsi PickQueueNumber() akan melakukan pengecekan status antrian yang sedang berjalan di database LogQueue,jika status antrian adalah “close” maka sistem akan menampilkan pesan bahwa antrian masih ditutup, tetapi jika status antrian adalah “open”,maka nomor antrian untuk customer akan diinput ke dalam database Queue.

•

Sistem juga akan menggunakan fungsi QueueEstimatingTime() yang ada di server QueueCR, melakukan estimasi waktu terhadap nomor antrian customer dan mengembalikannya ke MobileInterface

customer lalu

menampilkan estimasi waktu. •

Setelah proses pengambilan nomor antrian berhasil,maka aplikasi akan menampilkan pesan bahwa antrian sudah berhasil ditambahkan.

136

Gambar 3.81 Sequence Diagram Notification

Customer dapat melihat nomor antrian yang sudah diambil di dalam menu My Queue. •

Pada saat customer memilih menu My Queue, MobileInterface akan menampilkan

tampilan

My

Queue

dan

menjalankan

fungsi

GetCurrentQueue() yang ada di MyQueueActivity,lalu MyQueueActivity menjalankan fungsi GetOnServiceQueue() yang ada di server QueueCR

137 untuk menampilkan nomor antrian yang sedang berjalan. Sistem juga menjalankan fungsi GetMyQueue() yang ada di MyQueueActivity, lalu MyQueueActivity menjalankan fungsi GetMyQueue() yang ada di server QueueCR untuk menampilkan nomor antrian yang dimiliki oleh customer. •

Saat melihat nomor antrian yang dimiliki, customer dapat mengaktifkan notifikasi dengan menekan tombol Set Notification.

•

Saat tombol set notification dipilih, sistem akan menjalankan fungsi setNotification() yang ada di SetNotificationActivity(),dan server akan menjalankan fungsi queueChecker() yang ada di server QueueCR dan mengirimkan hasilnya ke sistem.

•

Jika jarak nomor antrian yang sedang berjalan lebih besar dari 0 dan lebih kecil dari lima maka sistem akan menjalankan fungsi ShowNotification() yang ada di SetNotificationActivity sehingga customer akan mendapatkan pemberitahuan jika nomor antrian yang dimiliki sudah dekat .

138

Gambar 3.82 Sequence Diagram Call The Customer Service

Sequence ini menjelaskan sistem proses saat melakukan panggilan telepon ke customer melalui aplikasi mobile. •

Saat Customer berhasil log in, system akan menjalankan MobileInterface untuk menampilkan menu utama. Saat customer memilih instasi pada spinner ,sistem akan menampilkan daftar nama instasi yang terdapat pada database Android.

139 •

Setelah daftar nama instasi muncul, customer bisa memilih nama instansi dan melakukan panggilan ke customer service dengan memilih menu Call To The Customer Service yang terdapat di menu utama.

•

Saat customer memilih menu Call To The Customer Service, sistem akan mengambil nomor telepon instansi yang dituju lalu memindahkan tampilan

ke

phone

service

dengan

menggunakan

fungsi

CallToTheCustomerService() yang terdapat pada HomeActivity dan menampilkan nomor telepon dari instansi tersebut. •

Setelah itu, customer bisa melakukan panggilan dengan nomer telepon yang sudah didapat dari database dengan menekan tombol panggil.

140

Gambar 3.83 Sequence Diagram Edit Profile

Sequence ini menjelaskan sistem proses pada saat customer melakukan penggantian profile di aplikasi mobile. •

Customer dapat melakukan penggantian profile pada menu my profile, saat memilih menu My Profile, system akan menampilkan tampilan My Profile pada MobileInterface dan akan mengambil data profile yang terdapat di server dengan menggunakan fungsi getProfile() yang ada di MyProfileActivity. MyProfileActivity akan melakukan permintaan data

141 profile customer dengan menjalankan fungsi getProfile() yang ada pada server EditCustomerProfileCR dan profile pun ditampilkan. •

Saat customer memilih tombol edit profile maka aplikasi akan menampilkan form penggantian profile ,dan customer dapat mengisi form tersebut.

•

Saat form akan dikirim, sistem akan menampilkan pesan untuk mengkonfirmasi

penggantian

profile.

jika

customer

sudah

mengkonfirmasi maka sistem akan melakukan validasi data dengan menggunakan

fungsi

ValidateData()

yang

ada

pada

MyProfileUpdateActivity. •

Jika data sudah valid maka sistem akan mengirimkan form tersebut dengan menggunakan fungsi EditProfileCustomer() yang ada di server EditCustomerProfileCR lalu server akan melakukan insert ke database dengan menggunakan fungsi InsertCustomerData() yang ada di database Customer dan sistem menampilkan pesan sukses.

•

Jika data tidak valid maka aplikasi akan menampilkan pesan kepada customer.

142

Gambar 3.84 Sequence Diagram Change Password

Sequence ini menjelaskan sistem proses pada saat customer melakukan penggantian password akunnya di aplikasi mobile. •

Customer dapat melakukan penggantian password pada menu my profile, saat memilih menu my profile, sistem akan menampilkan tampilan dari MobileInterface dan mengambil data profile yang terdapat di server dengan menggunakan fungsi getProfile() yang ada di MyProfileActivity dan profile pun ditampilkan.

•

Saat Customer memilih tombol change password maka sistem akan menampilkan form penggantian password dari MobileInterface,dan customer dapat mengisi form tersebut.

•

Saat form akan dikirim,sistem akan melakukan validasi data dengan menggunakan

fungsi

ValidateData()

yang

ada

pada

143 ChangePasswordActivity ,jika data sudah valid maka sistem akan mengirimkan

form

tersebut

dengan

menggunakan

fungsi

ChangePassword() yang ada pada ChangePasswordCR lalu server akan melakukan

insert

ke

database

dengan

menggunakan

fungsi

InsertCustomerData() yang ada pada database Customer dan sistem menampilkan pesan sukses. •

Jika data tidak valid maka aplikasi akan menampilkan pesan kepada customer.

Gambar 3.85 Sequence Diagram Register The Customer Web

Sequence ini menjelaskan sistem proses pada saat customer melakukan registrasi melalui aplikasi web.

144 •

Saat customer memilih menu Sign Up,sistem akan menampilakan form registrasi.

•

Setelah form diisi dan customer mengirim form tersebut, sistem akan menjalankan fungsi ValidasiData() yang ada di RegisterCustomerCR.

•

Jika form sudah sesuai maka sistem akan menjalankan fungsi RegisterCustomer() dan data akan di input kedalam database Customer dengan menggunakan fungsi InsertCustomerData(). Sistem akan mendapatkan pesan dari server bahwa data berhasil diinput dan customer akan mendapatkan pesan registrasi sukses.

3.86 Sequence Diagram Pick Queue Number Customer Web

145 Sequence ini menjelaskan sistem proses pada saat customer melakukan pengambilan nomor antrian di setiap instansi pada aplikasi web. •

Sebelum mengambil nomor antrian, customer harus memilih nama instansi yang ditampilkan oleh WebInterface.

•

Setelah memilih instansi, customer dapat melakukan pengambilan nomor antrian dengan memilih mengisi form pick queue number. Sistem akan mengunakan

fungsi

PickQueueNumber()

yang

ada

di

PickQueueNumberCR dan menggunakan fungsi ValidateData(). •

Jika data yang di input customer sudah valid,maka PickQueueNumberCR akan menjalankan fungsi PickQueueNumber() yang ada di QueueCR.

•

Fungsi PickQueueNumber() akan melakukan pengecekan status antrian yang sedang berjalan di database LogQueue,jika status antrian adalah “close” maka sistem akan menampilkan pesan bahwa antrian masih ditutup, tetapi jika status antrian adalah “open”,maka nomor antrian untuk customer akan diinput ke dalam database Queue dengan menggunakan fungsi InserQueueNumber().

•

Setelah proses pengambilan nomor antrian berhasil,maka aplikasi akan menampilkan nomor antrian yang didapat oleh customer.

146 3.5 Perancangan Database Berikut ini adalah tabel-tabel yang digunakan untuk aplikasi:

Tabel 3.11 User Nama Tabel: User Primary Key: id_user Nama Kolom

Tipe Data

Panjang Tipe Data

Keterangan

id_user

Char

10

ID User

username

Varchar

30

Nama Username

password

Char

65

Password User

id_jenis_user

Integer

11

ID Jenis User

Tabel 3.12 Jenis User Nama Tabel: JenisUser Primary Key: id_jenis_user Nama Kolom

Tipe Data

Panjang Tipe Data

Keterangan

id_jenis_user

Integer

11

ID Jenis User

jenis_user

Varchar

20

Jenis User

147 Tabel 3.13 Queue Nama Tabel: Queue Nama Kolom

Tipe Data

Panjang Tipe Data

Keterangan

id_instance

Char

10

ID Instansi

id_customer

Char

10

ID Customer ID Customer

id_customerservice

Char

10 Service Mengetahui status

status_queue

Varchar

15 service

number_queue

Integer

11

Nomer Antrian

timestamp

Timestamp

Timestamp

Waktu

Tabel 3.14 LogQueue Nama Tabel: LogQueue Nama Kolom

Tipe Data

Panjang Tipe Data

Keterangan

id_instance

Char

10

ID Instansi

id_customerservice

Char

10

ID Customer Service Mengetahui antrian status

Integer

11 dibuka atau ditutup

timestamp

Timestamp

Timestamp

Waktu

148 Tabel 3.15 Jenis Instance Nama Tabel: Jenis_Instance Primary Key: id_jenis_instance Nama Kolom

Tipe Data

Panjang Tipe Data

Keterangan

id_jenis_instance

Integer

11

ID Jenis Instansi

jenis_instance

Varchar

20

Jenis Instansi

Tabel 3.16 Instance Nama Tabel: Instance Primary Key: id_instance Nama Kolom

Tipe Data

Panjang Tipe Data

Keterangan

id_instance

Char

10

ID Instansi

instance_name

Varchar

30

Nama Instansi

instance_address

Text

30

Alamat Instansi

instance_description

Text

-

Deskripsi Instansi

Instance_phone

Varchar

20

Nomer Telephone Instansi id_jenis_instance

Integer

11

ID Jenis Instansi

149 Tabel 3.17 Head Officer Nama Tabel: HeadOfficer Primary Key: id_head_officer Nama Kolom

Tipe Data

Panjang Tipe Data

Keterangan

id_head_officer

Char

10

ID Head Officer

email

Varchar

30

Email Head Officer

id_instance

Char

10

ID Instansi

Tabel 3.18 Customer Service Nama Tabel: CustomerService Primary Key: id_customerservice Nama Kolom

Tipe Data

Panjang Tipe Data

id_customerservice

Char

10

Keterangan ID Customer Service Jenis Kelamin

customerservice_gender

Integer

11 Customer Service

id_instance

Char

10

ID Instansi

Tabel 3.19 Customer Nama Tabel: Customer Primary Key: id_customer Nama Kolom

Tipe Data

Panjang Tipe Data

Keterangan

id_customer

Char

10

ID Customer

150 Tanggal Lahir tanggal_lahir

Date

Customer

email

Varchar

30

gender

Integer

11

Email Customer Jenis Kelamin Customer

address

Text

-

phone

Varchar

20

Alamat Customer Nomer telephone Customer

Tabel 3.20 Case Problem Nama Tabel: CaseProblem Nama Kolom

Tipe Data

Panjang Tipe Data

Keterangan

id_instance

Char

10

ID Instansi

id_customerservice

Char

10

ID Customer Service Judul subject

Text

Permasalahan

problem

Text

-

Masalah

response

Text

-

Respon

BAB 3 ANALISIS DAN PERANCANGAN. memperoleh data yang akan mendukung proses pembuatan mobile application. Pertanyaan 1: Berapakah usia anda?

Recommend Documents