perancangan ulang aplikasi sukabumi participatory

18
PERANCANGAN ULANG APLIKASI SUKABUMI PARTICIPATORY RESPONDER (SUPER) DI KOTA SUKABUMI Laporan Tugas Akhir Ditulis sebagai syarat untuk memperoleh gelar Sarjana Desain (S.Ds.) Nama : Shania Jiehan Geraldine NIM : 00000025554 Program Studi : Desain Komunikasi Visual Fakultas : Seni dan Desain UNIVERSITAS MULTIMEDIA NUSANTARA TANGERANG 2020

Upload: others

Post on 02-Jun-2022

4 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: PERANCANGAN ULANG APLIKASI SUKABUMI PARTICIPATORY

PERANCANGAN ULANG APLIKASI SUKABUMI

PARTICIPATORY RESPONDER (SUPER)

DI KOTA SUKABUMI

Laporan Tugas Akhir

Ditulis sebagai syarat untuk memperoleh gelar Sarjana Desain (S.Ds.)

Nama : Shania Jiehan Geraldine

NIM : 00000025554

Program Studi : Desain Komunikasi Visual

Fakultas : Seni dan Desain

UNIVERSITAS MULTIMEDIA NUSANTARA

TANGERANG

2020

Page 2: PERANCANGAN ULANG APLIKASI SUKABUMI PARTICIPATORY

i

LEMBAR PERNYATAAN TIDAK MELAKUKAN PLAGIAT

Saya yang bertanda tangan di bawah ini:

Nama : Shania Jiehan G

NIM : 00000025554

Program Studi : Desain Komunikasi Visual

Fakultas : Seni dan Desain

Universitas Multimedia Nusantara

Judul Tugas Akhir :

PERANCANGAN ULANG APLIKASI SUKABUMI PARTICIPATORY

RESPONDER (SUPER) DI KOTA SUKABUMI

dengan ini menyatakan bahwa, laporan dan karya tugas akhir ini adalah asli dan

belum pernah diajukan untuk mendapatkan gelar sarjana, baik di Universitas

Multimedia Nusantara maupun di perguruan tinggi lainnya.

Karya tulis ini bukan saduran/terjemahan, murni gagasan, rumusan dan

pelaksanaan penelitian/implementasi saya sendiri, tanpa bantuan pihak lain,

kecuali arahan pembimbing akademik dan narasumber.

Demikian surat Pernyataan Originalitas ini saya buat dengan sebenarnya,

apabila di kemudian hari terdapat penyimpangan serta ketidakbenaran dalam

pernyataan ini, maka saya bersedia menerima sanksi akademik berupa pencabutan

gelar (S.Ds.) yang telah diperoleh, serta sanksi lainnya sesuai dengan norma yang

berlaku di Universitas Multimedia Nusantara.

Tangerang, 5 Januari 2021

Shania Jiehan Geraldine

Page 3: PERANCANGAN ULANG APLIKASI SUKABUMI PARTICIPATORY

ii

HALAMAN PENGESAHAN TUGAS AKHIR

PERANCANGAN ULANG APLIKASI SUKABUMI

PARTICIPATORY RESPONDER (SUPER)

DI KOTA SUKABUMI

Oleh

Nama : Shania Jiehan Geraldine

NIM : 00000025554

Program Studi : Desain Komunikasi Visual

Fakultas : Seni dan Desain

Tangerang, 20 Januari 2021

Penguji Ketua Sidang

Clemens Felix Setiyawan, S.Sn.,M.Hum. Darfi Rizkavirwan, S.Sn., M.Ds.

Ketua Program Studi

Mohammad Rizaldi, S.T., M.Ds.

Rani Aryani Widjono, S.Sn., M.Ds.

Page 4: PERANCANGAN ULANG APLIKASI SUKABUMI PARTICIPATORY

iii

KATA PENGANTAR

Puji dan syukur penulis panjatkan kepada Tuhan Yang Maha Esa sehingga

dapat menyelesaikan proposal Tugas Akhir yang berjudul “Perancangan Ulang

Aplikasi Sukabumi Participatory Responder (SUPER) di Kota Sukabumi”.

Laporan ini disusun berdasarkan ketertarikan penulis dalam merancang ulang

sebuah aplikasi pengaduan guna membantu masyarakat dalam menyampaikan

keluhan mengenai masalah infrastruktur yang ada di Kota Sukabumi. Topik ini

dipilih dikarenakan masih banyak masyarakat Kota Sukabumi yang kurang minat

dan merasa efektif dengan keberadaan aplikasi tersebut sekarang ini.

Topik ini dianggap penting karena permasalahan yang sering terjadi di

kalangan masyarakat, khususnya warga Kota Sukabumi, mengenai wadah/ tempat

yang efektif dalam menyampaikan keluhan kepada pemerintah setempat/ instansi

yang terkait. Target pembaca dari proposal ini adalah orang-orang yang memiliki

ketertarikan yang serupa dalam merancang aplikasi layanan masyarakat di

Indonesia.Dalam penyusunan proposal ini, penulis mendapatkan beberapa hal

yang dapat dipelajari seperti time management agar proposal ini dapat selesai

tepat waktu dan keteraturan dalam menulis. Penulis berharap semoga proposal ini

kedepannya dapat berguna dan bermanfaat bagi pembaca.

Saya ingin mengucapkan terima kasih juga berikan orang-orang yang telah

membantu dalam keberlangsungan Tugas Akhir ini, di antara lain :

Page 5: PERANCANGAN ULANG APLIKASI SUKABUMI PARTICIPATORY

iv

1. Mohammad Rizaldi, S.T., M.Ds. sebagai ketua program studi Desain

Komunikasi Visual.

2. Rani Aryani Widjono, S.Sn., M.Ds. sebagai dosen pembimbing dalam

perancangan.

3. Ukasyah Ananda Putra, Frendy Yuwono, dan Tantan Sontani sebagai

narasumber dalam memberikan informasi untuk pemenuhan

pengambilan data.

4. Vee Mahendra, Ivan Ginanjar, Veronica Liliani, Ellyn Natalia, Refiand

Imanuel, Mariska Gracia, dan Ivan Johan yang telah meluangkan

waktu dalam berdiskusi seputar infrastruktur di Kota Sukabumi.

5. Teman-teman satu kelompok bimbingan yang selalu memberi

semangat.

6. Keluarga yang selalu ada dalam memberikan semangat, pendapat, dan

solusi dalam menyelesaikan perancangan aplikasi ini.

Tangerang, 5 Januari 2021

Shania Jiehan Geraldine

Page 6: PERANCANGAN ULANG APLIKASI SUKABUMI PARTICIPATORY

v

ABSTRAKSI

Infrastruktur sangatlah penting bagi pembangunan sebuah kota. Hal ini

dikarenakan infrastruktur merupakan roda pembangun dari ekonomi dan

kesejahteraan di kota tersebut. Namun, hal ini masih luput dari perhatian

pemerintah, terutama dengan fasilitas yang sudah tersedia/ada sebelumnya.

Partisipasi masyarakat setempat sangat diperlukan, khususnya dalam melaporkan

keadaan infrastruktur yang bermasalah. Tetapi, masih saja banyak masyarakat

yang tidak mengetahui kemana harus melapor dan tidak tahu kabar selanjutnya

dari laporannya tersebut. Adanya perancangan ulang aplikasi layanan pengaduan

masalah ini agar dapat lebih efektif digunakan masyarakat, khususnya warga Kota

Sukabumi, dalam memberikan keluhan dan tanggapan kepada pemerintah

mengenai keadaan infrastruktur yang ada di lingkungan sekitar. Dalam

perancangan, metode yang menggunakan adalah metode Human Centered Design

yang dikembangkan oleh IDEO. Diharapkan melalui aplikasi ini, masyarakat di

Kota Sukabumi dapat lebih peduli dengan keadaan sekitar, khususnya keadaan

infrastrukturnya, dengan cara melapor kepada pemerintah setempat secara real-

time dan dapat mengetahui progres dari laporan tersebut dengan mudah.

Kata kunci : aplikasi, service design, pemerintah, pengaduan masyarakat,

infrastruktur

Page 7: PERANCANGAN ULANG APLIKASI SUKABUMI PARTICIPATORY

vi

ABSTRACT

Infrastructure is very important for the development of a city. This is because

infrastructure is the building wheel of the city's economy and welfare. However,

this has still escaped the attention of the government, especially for the existing

facilities. The participation of the local community is needed, especially in

reporting the condition of problematic infrastructure. However, there are still

many people who do not know where to report and do not know the next

information from the report. The redesign of this complaint service application is

in order to help the society, especially the residents of Sukabumi City, in

providing complaints and responses to the government regarding the condition of

the existing infrastructure in the surrounding environment. In designing, the

method used is the Human Centered Design method that has been developed by

IDEO. It is hoped that through this public service application, people in Sukabumi

City can care more about their surroundings, especially the condition of their

infrastructure, by reporting to the local government in real-time and being able to

know the progress of the report easily.

Keywords: application, service design, government, public complaint,

infrastructure

Page 8: PERANCANGAN ULANG APLIKASI SUKABUMI PARTICIPATORY

vii

DAFTAR ISI

LEMBAR PERNYATAAN TIDAK MELAKUKAN PLAGIAT ................................... i

KATA PENGANTAR ....................................................................................................iii

ABSTRAKSI ................................................................................................................... v

ABSTRACT ..................................................................................................................... vi

DAFTAR ISI ................................................................................................................. vii

DAFTAR GAMBAR ....................................................................................................... x

DAFTAR TABEL ......................................................................................................... xv

DAFTAR LAMPIRAN ................................................................................................ xvi

BAB I PENDAHULUAN ............................................................................................... 1

1.1. Latar Belakang ...................................................................................................... 1

1.2. Rumusan Masalah ................................................................................................ 3

1.3. Batasan Masalah ................................................................................................... 3

1.4. Tujuan Tugas Akhir ............................................................................................. 5

1.5. Manfaat Tugas Akhir ........................................................................................... 5

BAB II TINJAUAN PUSTAKA ..................................................................................... 7

2.1. Teori Perancangan ................................................................................................ 7

2.1.1. Prinsip Desain...........................................................................................................................8

2.1.2. Elemen Desain ....................................................................................................................... 13

2.2. Mobile Application ............................................................................................... 24

2.2.1. Application Categories ....................................................................................................... 24

Page 9: PERANCANGAN ULANG APLIKASI SUKABUMI PARTICIPATORY

viii

2.2.2. User Interface & User Experience .................................................................................. 27

2.2.3. User Experience ..................................................................................................................... 32

2.2.4. Usability .................................................................................................................................... 39

2.3. Service Design ...................................................................................................... 43

2.3.1. Service Design Principles ................................................................................................... 44

2.3.2. Komponen dalam Service Design .................................................................................. 45

2.4. Pelayanan Publik ................................................................................................ 46

2.4.1. Pengelompokkan Pelayanan Publik............................................................................ 47

2.4.2. Pengaduan Masyarakat ..................................................................................................... 48

2.4.3. Smart City ................................................................................................................................ 49

2.4.4. Infrastruktur .......................................................................................................................... 50

BAB III METODOLOGI .............................................................................................52

3.1. Metodologi Pengumpulan Data ......................................................................... 52

3.1.1. Survei ......................................................................................................................................... 52

3.1.2. Focus Group Discussion .................................................................................................... 55

3.1.3. Wawancara ............................................................................................................................. 60

3.1.4. Observasi ................................................................................................................................. 70

3.1.5. Studi Eksisting ....................................................................................................................... 71

3.2. Metodologi Perancangan .................................................................................... 80

3.2.1. Observation ............................................................................................................................. 83

3.2.2. Ideation ..................................................................................................................................... 85

3.2.2.1. Mind Map .............................................................................................................................. 85

3.2.3. Rapid Prototyping ................................................................................................................ 98

3.2.3.2. High fidelity ...................................................................................................................... 101

Page 10: PERANCANGAN ULANG APLIKASI SUKABUMI PARTICIPATORY

ix

BAB IV ANALISIS ................................................................................................... 118

4.1. Analisis Alpha ................................................................................................... 118

4.1.1. Analisis Hasil Alpha test ................................................................................................. 118

4.1.2. Solusi Desain ....................................................................................................................... 124

4.2. Analisis Beta ...................................................................................................... 127

4.2.1. Analisis Desain ................................................................................................................... 128

4.2.2. Analisis Beta Test .............................................................................................................. 158

BAB V KESIMPULAN DAN SARAN ..................................................................... 166

5.1. Kesimpulan ........................................................................................................ 166

5.2. Saran .................................................................................................................. 167

DAFTAR PUSTAKA ................................................................................................ xviii

LAMPIRAN A: FORM BIMBINGAN ................................................................ xxiii

LAMPIRAN B: SURVEI ....................................................................................... xvii

LAMPIRAN C: SURVEI ALPHA TEST .......................................................... xxxiii

LAMPIRAN D : SURVEI BETA TEST ............................................................. xxxvi

LAMPIRAN E : TRANSKRIP WAWANCARA ..............................................xxxvii

LAMPIRAN F : TRANSKRIP WAWANCARA BAPPEDA ............................... lvii

LAMPIRAN G : TRANSKRIP WAWANCARA DISKOMINFO ...................... lxix

Page 11: PERANCANGAN ULANG APLIKASI SUKABUMI PARTICIPATORY

x

DAFTAR GAMBAR

Gambar 2.1. Desain Poster It’s Time To Get Organized……………………….....8

Gambar 2.2. Jenis Gestalt………………………………………………………....9

Gambar 2.3. Salah satu penggunaan emphasis………………………….……….10

Gambar 2.4. Fibonacci Square…………………………………………………...12

Gambar 2.5. Fibonacci Spiral ……………………………………………………13

Gambar 2.6. Macam - macam jenis bentuk………………………………………14

Gambar 2.7. Contoh gambar dengan menggunakan figure/ground……………...15

Gambar 2.8. Perbedaan warna RGB dan CMYK………………………………..16

Gambar 2.9. Perbedaan jenis tipografi sans serif dan serif………………………17

Gambar 2.10. Contoh penggunaan tracking dan leading………………………...17

Gambar 2.11. Grid anatomy……………………………………………………...18

Gambar 2.12. Grid guidelines..…………………………………………………..19

Gambar 2.13. Bentuk icon……………………………………………...………..20

Gambar 2.14. Perbedaan icon dan bentuk asli…………………………………...21

Gambar 2.15. Iklan Burger King………………………………………………....22

Gambar 2.16. Contoh dokumentasi jurnalis dalam koran………………………..23

Gambar 2.17 Contoh fotografi sebagai karya seni……………………………….23

Gambar 2.18. Aplikasi Angry Birds……………………………………………..25

Gambar 2.19. Aplikasi Facebook………………………………………………...25

Gambar 2.20. Aplikasi Gojek……………………….............................................26

Gambar 2.21. Aplikasi Ruang Guru………………………...................................26

Gambar 2.22. Aplikasi Paper pada iPad………………………............................27

Page 12: PERANCANGAN ULANG APLIKASI SUKABUMI PARTICIPATORY

xi

Gambar 2.23. Checkboxes……………………………………………………….30

Gambar 2.24. Radio buttons……………………………………………………...31

Gambar 2.25. Text fields…………………………………………………………31

Gambar 2.26. Dropdown…………………………………………………………31

Gambar 2.27. List boxes…………………………………………………………31

Gambar 2.28. Action button……………………………………………………...32

Gambar 2.29. The five planes……………………………………………………33

Gambar 2.30. Salah satu contoh tampilan feedback……………………………..34

Gambar 2.31. Contoh pemberian batasan aksi dalam 1 halaman………………..35

Gambar 2.32. Contoh konsistensi dalam penggunaan warna keterangan……….36

Gambar 2.33. Contoh penggunaan petunjuk dalam bentuk tulisan dan tombol…37

Gambar 2.34. Perbandingan tampilan tiap prototype…………………………….38

Gambar 2.35. Proses Penelitian service design…………………………………..44

Gambar 2.36. Komponen dalam proses implementasi service design…………...45

Gambar 2.37. 6 Dimensi Smart City……………………………………………..49

Gambar 3.1. Grafik responden pernah dan tidak melapor ke pemerintah……….53

Gambar 3.2. Grafik kendala ketika melapor ke pemerintah dan cara pelaporan...53

Gambar 3.3. Grafik alasan tidak pernah melapor………………………………..54

Gambar 3.4. Dokumentasi FGD dengan 7 warga Kota Sukabumi………………55

Gambar 3.5. Dokumentasi wawancara dengan Kak Uka………………………...61

Gambar 3.6. Wawancara dengan Pak Frendy melalui Whatsapp call……...…....64

Gambar 3.7. Wawancara dengan Pak Tantan Sontani……………………...……67

Gambar 3.8. Kompilasi masalah infrastruktur di Kota Sukabumi……………….70

Page 13: PERANCANGAN ULANG APLIKASI SUKABUMI PARTICIPATORY

xii

Gambar 3.9. Kompilasi billboard di Kota Sukabumi…………………………….70

Gambar 3.10. Screenshot tampilan aplikasi SUPER…………………………….71

Gambar 3.11. Screenshot tampilan aplikasi JAKI……………………………….74

Gambar 3.12. Screenshot pada tampilan aplikasi Qlue…………………………..76

Gambar 3.13. Mind map Kota Sukabumi………………………………………..85

Gambar 3.14 Moodboard………………………………………………………...87

Gambar 3.15. Persona Ojek Online………………………………………………89

Gambar 3.16. Persona Wiraswasta……………………………………………….89

Gambar 3.17. Empathy Map Ojek Online……………………………………….90

Gambar 3.18. Empathy Map Wiraswasta………………………………...……...91

Gambar 3.19. Journey Map Ojek Online………………………………………...92

Gambar 3.20. Journey Map Wiraswasta…………………………………………92

Gambar 3.21. Information Architecture………………………………………….93

Gambar 3.22. Flowchart………………………………………………………….94

Gambar 3.23. Ecosystem Map…………………………………………………...95

Gambar 3.24. Sketsa Digital……………………………………………………..96

Gambar 3.25. Wireframe………………………………………………………....98

Gambar 3.26. Grid dalam tampilan aplikasi……………………………………..99

Gambar 3.27. Proses penyederhanaan pada icon……………………………….100

Gambar 3.28. Tampilan beberapa icon dan button………………………...…...103

Gambar 3.29. Tampilan icon pada pertolongan darurat………………………...103

Gambar 3.30. Tampilan icon pada penilaian kinerja……………………...……105

Gambar 3.31. Proses penyederhanaan icon pada Warta Kota dan Survei……...106

Page 14: PERANCANGAN ULANG APLIKASI SUKABUMI PARTICIPATORY

xiii

Gambar 3.32. Proses penyederhanaan dan penggabungan icon fungsi baru…...107

Gambar 3.33. Tampilan icon pada konten…………………...…………………108

Gambar 3.34. Contoh penyederhanaan bangunan Masjid Agung.……………..108

Gambar 3.35. Tampilan ilustrasi halaman awal………………………………...109

Gambar 3.36. Contoh penyederhanaan karakter warga dan pemerintah…….....110

Gambar 3.37. Tampilan ilustrasi halaman pengenalan…………………………111

Gambar 3.38. Contoh penyederhanaan bentuk bus wisata……………………..111

Gambar 3.39. Tampilan ilustrasi pada bagian kategori fasilitas………………..112

Gambar 3.40. Contoh penyederhanaan memegang KTP……………………….113

Gambar 3.41. Contoh penyederhanaan bentuk PJU….…………………………113

Gambar 3.42. Tampilan ilustrasi pada bagian kategori jenis laporan…………..114

Gambar 3.43. Tampilan high fidelity dari aplikasi…………...………………...115

Gambar 4.1. Hasil survei User Experience……………………………………..118

Gambar 4.2. Hasil survei Satisfaction…………………………………………..118

Gambar 4.3. Hasil survei User Interface………………………………………..120

Gambar 4.4. Hasil survei secara keseluruhan…………………………………..122

Gambar 4.5. Perubahan ukuran tulisan…………………………………………124

Gambar 4.6. Perubahan tampilan notifikasi…………………………………….124

Gambar 4.7. Perubahan tampilan icon notifikasi……………………………….125

Gambar 4.8. Perubahan tulisan pada tampilan permintaan bantuan……………125

Gambar 4.9. Penambahan informasi pada bagian peringkat warga aktif……….125

Gambar 4.10. Dokumentasi beta test….………….…………………………….126

Gambar 4.11. Tampilan homepage...…………….……………………………..127

Page 15: PERANCANGAN ULANG APLIKASI SUKABUMI PARTICIPATORY

xiv

Gambar 4.12. Tampilan halaman masuk dan registrasi akun…………...……...130

Gambar 4.13. Tampilan halaman pengenalan…....……………………………..132

Gambar 4.14. Tampilan fungsi pertolongan darurat……………………………134

Gambar 4.15. Tampilan dari setiap bantuan darurat…………………………....135

Gambar 4.16. Tampilan dari fungsi Warta Kota………………………………..136

Gambar 4.17. Tampilan dari fungsi Info Kota.......……………………………..137

Gambar 4.18. Tampilan dari fungsi Lapor dan LaporanKu…………………….139

Gambar 4.19. Tampilan pop-up pada fungsi lapor…………………...………...140

Gambar 4.20. Tampilan LaporanKu……………………………………………141

Gambar 4.21. Tampilan notifikasi…......................…………...………………..142

Gambar 4.22. Tampilan fungsi Respon Penduduk….…………………………..143

Gambar 4.23. Tampilan verifikasi Data Penduduk……………………………..144

Gambar 4.24. Tampilan fungsi Data Penduduk dan layanan e-KTP…………...145

Gambar 4.25. Tampilan fungsi Sapa Penduduk………………………………...146

Gambar 4.26. Tampilan fungsi Chat Admin…....………………………………147

Gambar 4.27. Tampilan fungsi Survei…....…………………………………….148

Gambar 4.28. Tampilan profil…....……………………………………………..150

Gambar 4.29. Tampilan sub-menu…....………………………………………...151

Gambar 4.30. Tampilan pengaturan…....……………………………………….152

Gambar 4.31. Tampilan dari keterangan pada App store……………………….154

Gambar 4.32. Tampilan poster mengenai aplikasi……………………………...155

Gambar 4.33. Tampilan billboard mengenai aplikasi…………………………..156

Gambar 4.34. Hasil survei User Interface…....………………………………...158

Page 16: PERANCANGAN ULANG APLIKASI SUKABUMI PARTICIPATORY

xv

Gambar 4.35. Hasil survei mengenai fungsi aplikasi…………………………...160

Gambar 4.36. Hasil survei User Experience…....……………………………....162

Gambar 4.37. Hasil penilaian satisfaction…....………………………………...164

Page 17: PERANCANGAN ULANG APLIKASI SUKABUMI PARTICIPATORY

xx

DAFTAR TABEL

Tabel 3.1. Daftar nama peserta FGD………………………………...…………..49

Tabel 3.2. Tabel perbandingan aplikasi dari hasil FGD……………………...…..52

Tabel 3.3. Tabel kesimpulan studi eksisting………………………………...…...70

Tabel 4.1. Tabel peserta beta test………………………………………...……..148

Page 18: PERANCANGAN ULANG APLIKASI SUKABUMI PARTICIPATORY

xxi

DAFTAR LAMPIRAN

LAMPIRAN A: FORM BIMBINGAN…………………………….…………..xii

LAMPIRAN B: SURVEI…………………………………………………….. xiii

LAMPIRAN C: SURVEI ALPHA TEST…………………………………....xxiv

LAMPIRAN D: SURVEI BETA TEST………….………….…….…………xxxi

LAMPIRAN E: TRANSKRIP WAWANCARA………….…….………….xxxii

LAMPIRAN F: TRANSKRIP WAWANCARA BAPPEDA………..………..lxii

LAMPIRAN G: TRANSKRIP WAWANCARA DISKOMINF..……..….…..lxiv