## PENGEMBANGAN UI/UX APLIKASI QAYIMMASJID UNTUK PENGELOLAAN KEGIATAN MASJID MENGGUNAKAN HUMAN-CENTERED DESIGN
Endang Habinuddin 1 , Waway Qodratulloh S 2 , Ida Suhartini 3 , Zulkifli Arsyad 4 , Siti Dwi Setiarini 5 , Yadhi Aditya Permana 6 , Endang Hatma Juniawati 7 Politeknik Negeri Bandung Jl. Gegerkalong Hilir, Ciwaruga, Kab. Bandung Barat, Jawa Barat e-mail: endang.h@polban.ac.id 1 , waway@polban.ac.id 2 ,ida@jtk.polban.ac.id 3 , zulkifli.arsyad@jtk.polban.ac.id 4 , siti.dwi@polban.ac.id 5 , yadhi@jtk.polban.ac.id 6 , ehjuniwati@polban.ac.id 7

## ABSTRAK
Pengurus  (Qayyim)  Masjid  memiliki  tugas  untuk  mengelola  berbagai  macam  data.  Data  yang  diolah biasanya  berupa  data  kegiatan  serta  keuangan.  Selain  mengelola,  Qayyim  Masjid  juga  harus menginformasikan  kegiatan  dan  keuangan  kepada  jamaah.  Pengelolaan  data  serta  informasi  tersebut masih  banyak  dilakukan  dengan  cara  konvensional.  Sehingga,  menyebabkan  Qayyim  Masjid  cukup kesulitan  dalam  mengelolanya.  Selain  itu, penginformasian  data  tersebut  kepada  jamaah  membutuhkan waktu yang tidak sebentar dan juga memungkinkan informasi tidak menyeluruh sampai ke semua jamaah. Sistem Informasi saat ini dapat membantu pengelolaan serta penginformasian data-data tersebut. Pada tahun  2020,  aplikasi  QayimMasjid  pun  dibangun  untuk  membantu  Qayyim  Masjid  Riyadhushsholihin mengatasi  permasalahan  tersebut.  Namun,  setelah  diuji  dengan  uji  heuristik  didapatkan  bahwa  UI/UX aplikasi  tersebut  masih  perlu  perbaikan  minor  dan  kosmetik.  Sehingga,  UI/UX  aplikasi  tersebut dikembangkan  dengan  menggunakan  metode  Human-Centered  Design  dengan  Scrum  pada  tahap pengembangan  aplikasinya.  Aplikasi  yang  juga  dapat  digunakan  oleh  Qayyim  Masjid  lain  membuat aplikasi ini selain membutuhkan perbaikan UI/UX, dibutuhkan pula pengunggahan aplikasi ke playstore. Metode deskriptif digunakan dalam penelitian ini untuk dapat menjelaskan situasi aplikasi terbaru yang dibandingkan dengan aplikasi sebelumnya. Jumlah pengguna yang melkukan uji heuristik awal dan akhir berjumlah 6 pengguna dan merupakan pengguna yang sama. Setelah pengguna tersebut menguji aplikasi, didapatkan hasil bahwa seluruh UI/UX telah semakin baik dan hanya perlu penyesuaian kosmetik saja.
Kata kunci: UI/UX, Mobile Application, Human-Centered Design, Uji Heuristik, Desain Ulang

## ABSTRACT
The  organizing  (Qayyim)  of  the  mosque  has  the  task  of  managing  various  kinds  of  data.  The  data  is processed, usually activities and financial data. In addition to managing it, Qayyim Masjid must also report activities  and  finances  to  the  congregation.  The  management  of  data  and  information  mostly  used  the conventional way. Thus causing the Qayyim Masjid quite difficult in managing it. In addition, to share the informations takes more  time and allows the incomplete information to reach all the congregation. The current information system can help Qayyim to manage and inform these data. In 2020, the QayimMasjid application  was  built  to  help  the  Qayyim  of  the  Riyadhushsholihin  Mosque  overcome  these  problems. However, after being tested with heuristics tests, it was found that the UI/UX of the application still needs minor and cosmetic improvements. Thus, the UI/UX of the application was developed using the Human- Centered Design methods with Scrum at the application development stage. Applications that can also be used  by  other  Qayyim  Masjid  make  this  application  also  requires  the  application  is  uploaded  to  the playstore.  The  descriptive  method  is  used  in  this  study.  It  is  able  to  explain  the  situation  of  the  latest application  compared  to  the  previous  application.  The  number  of  users  who  did  the  initial  and  final heuristics tests that were opened 6 same users for before and after application development. After the user tests the app, the results are the whole UI/UX has improved well and needs to adjust the cosmetics.
Keywords: UI/UX, Mobile Application, Human-Centered Design, Heuristics Test, Redesign
Pengembangan UI/UX Aplikasi Qayimmasjid untuk Pengelolaan Kegiatan Masjid Menggunakan Human-Centered Design – (Endang Habinuddin, Waway Qodratulloh S, Ida Suhartini, Zulkifli Arsyad,Siti Dwi Setiarini, Yadhi Aditya Permana, Endang Hatma Juniawati)

## 1. PENDAHULUAN
Perkembangan teknologi memicu banyak sektor untuk mengikuti perkembangannya. Teknologi informasi sangat dibutuhkan oleh setiap organisasi baik organisasi yang berorientasi profit maupun yang tidak  [1].  Permasalahan  yang  dihadapi  oleh  masyarakat  pun  dapat  diselesaikan  dengan  teknologi.  Tak terkecuali  permasalahan  yang  dihadapi  oleh  pengurus  ( Qayyim )  Masjid.  Permasalahan-permasalahan seperti kesulitan pengurus masjid untuk memberikan informasi kegiatan, keuangan, aktivitas komunitas, serta administrasi (pengarsipan) dapat diselesaikan dengan aplikasi mobile [1–4]. Pengelolaan penyelesaian masalah tersebut juga dapat dilakukan secara profesional menggunakan aplikasi mobile [1]. Permasalahan tersebut juga dialami oleh Qayyim Masjid Riyadhushsholihin. Qayyim Masjid Riyyadhushsholihien merupakan generasi muda yang cukup terdidik dan energik terlihat  dari  profil pendidikan  pengurusnya  yang  rata-rata mengenyam  pendidikan  tinggi.  Lokasi  masjid Riyyadhushsholihien  di  Kampung  Leuwidulang  RT  03/01  Desa  Rancamulya  Kecamatan  Pameungpeuk Kabupaten Bandung. Jarak dari Polban ke lokasi mitra sekira 20 KM ke arah selatan kota Bandung. Di masjid  ini,  selain  untuk  kegiatan  keagamaan  juga  merupakan  kantor  bagi  aktifitas  organisasi kemasyarakatan Persatuan Islam (PERSIS) tingkat jamaah. Pengurus jamaah yang berkantor di masjid ini, terdiri dari Pimpinan Jamaah (PJ) PERSIS, PJ PERSISTRI, PJ Pemuda PERSIS, dan PJ Pemudi PERSIS.
Secara umum, kegiatan Qayyim Masjid ini terbagi menjadi 2, yakni insidental dan rutinan. Kegiatan yang sifatnya insidental meliputi: 1. Pengurusan Zakat Fitrah saat iedul fitri, 2. Pengurusan Mudhahi (yang ber-qurban) saat iedul adha, 3. Pengurusan Jenazah apabila ada warga yang meninggal, 4. Kegiatan tabligh akbar pada hari besar keagamaan, 5. Pesantren kilat selama ramadlan, 6. Takhtimul Quran fii Ramadhan (khataman  Quran  setiap  malam  di  bulan  Ramadlan),  sedangkan  yang  termasuk  dalam  kegiatan  rutinan, meliputi kegiatan minggunan dan bulanan terlihat pada Tabel 1.

## Tabel 1. Kegiatan rutinan
Waktu Kegiatan Jumat 1. Pelaksanaan shalat berjamaah 2. Kebersihan masjid 3. Dilaksanakan rutin harian 4. Pelaksanaan ibadah Jumat 5. Dilaksanakan rutin pekanan Ahad pagi 1. Jihad (Pengajian Ahad) 2. Dilaksanakan rutin bulanan Jumat malam 1. Kajian Islam 2. Dilaksanakan rutin pekanan Sabtu malam 1. Kajian Islam khusus Pemuda 2. Dilaksanakan rutin pekanan Ahad siang 1. Kajian Islam khusus ibu-ibu dan Pemudi 2. Dilaksanakan rutin Bulanan Ahad subuh 1. Kajian Islam khusus ibu-ibu dan Pemudi 2. Dilaksanakan rutin pekanan
Berdasarkan daftar kegiatan insidental dan rutinan di atas, maka adanya kebutuhan bagi Pengurus Masjid  untuk  mampu  mengelola  kegaitan  beserta  mencatat  biaya  kegiatan  agar  dapat  memberikan pelayanan kepada masyarakat secara lebih baik [5, 6]. Semaraknya kegiatan yang dilaksanakan di Masjid Riyyadushshalihien juga menjadi modal yang cukup penting untuk dapat dikelola melalui Sistem Informasi Manajemen (SIM) Masjid.
Beberapa  aplikasi  seperti  SIMAS  KEMENAG  PATI,  e-MOSQUE,  KakiMasjid,  serta QURANBEST INDONESIA dapat mengelola kegiatan serta keuangan (infaq) masjid  [3, 7–9]. Aplikasi-
aplikasi tersebut pun sejalan dengan inisiasi kementerian agama khususnya Kemenag jawa barat dan juga gubernur  jawa  barat  untuk  melakukan  digitalisasi  pengelolaan  masjid  [10].  Permasalahan  yang  dialami Qayyim Masjid Riyyadushshalihien pun akhirnya diselesaikan dengan adanya aplikasi QayimMasjid yang dibuat tahun 2020. Aplikasi yang berjalan di sistem operasi dengan pengguna terbanyak (android)  [2] ini dibagikan dalam bentuk file instalasi berekstensi .apk untuk dilakukan instalasi pada smartphone android melalui file tersebut.
Survei  dilakukan  untuk  mengetahui  bagaimana  kesesuaian  tampilan  aplikasi  QayimMasjid terhadap  kebutuhan  pengguna.  6  pengguna  menjadi responden pada  survei  ini.  Berdasarkan hasil  survei tersebut,  disimpulkan  bahwa  aplikasi  QayimMasjid  ini  butuh  perbaikan  baik  dari  segi  fitur  maupun kemudahan penggunaan berdasarkan tampilan (UI/UX). Fitur yang butuh ada diantaranya fitur notifikasi serta  info  masjid  sekitar.  Selain  fitur,  tampilan  pun  harus  diperbaiki.  Hal  ini  terlihat  dari  hasil  evaluasi heuristik pada aplikasi QayimMasjid pertama [11, 12]. Evaluasi heuristik menghasilkan rata-rata nilai 1,85. Hal  ini  menunjukkan  bahwa  aplikasi  QayimMasjid  membutuhkan  perbaikan  kosmetik  dan  kekurangan minor pada tampilan [12]. Secara spesifik perbaikan yang harus dilakukan yaitu pada H4, H6, H8, dan H9. Sedangkan,  H1,  H2,  H5,  H7,  serta  H10  hanya  perlu  diperbaiki  kosmetik-kosmetiknya.  Tabel  2 menunjukkan kriteria dari setiap kategori heuristik yang menjadi evaluasi terhadap kemudahan penggunaan berdasarkan UI/UX.
Tabel 2. Kategori evaluasi heuristik
Kategori Kriteria H1 Visibility of system status H2 Match between system and the real world H3 User control and freedom H4 Consistency and standards H5 Error prevention H6 Recognition rather than recall H7 Flexibility and efficiency of use H8 Aesthetic and minimalist design H9 Help users recognize, diagnose, and recover from errors H10 Help and documentation
Kemudahan  penggunaan  aplikasi  sangat  penting  untuk  membuat  pengguna  nyaman  dan  loyal dalam menggunakan aplikasi [8]. Oleh karena itu, temuan-temuan di atas penting untuk diperbaiki. Selain itu,  interaksi  yang  membuat  pengguna  nyaman  dalam  menggunakan  sangat  terkait  dengan  proses pengembangan aplikasi. Di dalam proses pengembangan aplikasi harus terdapat proses yang memastikan bahwa interaksi antara manusia dengan tampilan aplikasi saling berkaitan [8]. Ilmu interaksi manusia dan komputer dibutuhkan dalam memperbaiki kekurangan-kekurangan aplikasi sebelumnya berdasarkan hasil evaluasi heuristik tersebut.
Perbaikan  UI/UX  dapat  menggunakan  beberapa  cara.  Diantaranya  yaitu User-Centered  Design (UCD) dan Human-Centered Design (HCD). Aplikasi ini mempunyai fitur dapat digunakan oleh banyak Qayyim Masjid. Sehingga, secara umum harus dapat mudah dan nyaman digunakan oleh masyarakat umum yang mempunyai kebutuhan serupa dengan Qayyim Masjid Riyyadhushsholihien. HCD akhirnya menjadi pilihan metode pengembangan UI/UX aplikasi QayimMasjid. HCD ini dilakukan untuk merancang suatu desain berorientasi kepada manusia sebagai pengguna, sehingga desain atau tampilan dari aplikasi dapat sesuai kebutuhan pengguna yang lebih luas [11][13]. Hasil evaluasi heuristik terhadap aplikasi sebelumnya menjadi acuan apa saja yang harus dilakukan desain tampilan ulang. Selain itu, aplikasi android agar lebih memudahkan  pengguna  dalam  menginstalasinya  perlu  untuk  diunggah  ke playstore ,  sehingga  aplikasi QayimMasjidpun perlu diungga ke playstore . Penelitian ini dirancang menggunakan Design Science Research Management (DSRM). DSRM dipilih karena kemudahan penggunaan aplikasi berdasarkan UI/UX ini harus berorientasi kepada kebutuhan pengguna  dan  DSRM  berawal  dari Design  Thinking yang  merupakan  metode  perancangan  yang berorientasi kepada kebutuhan pengguna [14]. DSRM baik digunakan untuk mencapai target peningkatan UI/UX suatu aplikasi mobile [15]. DSRM memiliki beberapa tahapan yaitu: 1) Problem identification and motivation ,  2) Define  the  objectives  for  a  solution ,  3) Design  and  development ,  4) Demonstration ,  5) Evaluation, dan 6) Communication [14]. Berdasarkan proses DSRM nomor 1, didapatkan tujuan riset ini yaitu untuk menyelesaiakan permasalahan: 1) Bagaimana mengembangkan aplikasi QayimMasjid menjadi
Pengembangan UI/UX Aplikasi Qayimmasjid untuk Pengelolaan Kegiatan Masjid Menggunakan Human-Centered Design – (Endang Habinuddin, Waway Qodratulloh S, Ida Suhartini, Zulkifli Arsyad,Siti Dwi Setiarini, Yadhi Aditya Permana, Endang Hatma Juniawati)
aplikasi  yang  nyaman  digunakan  oleh  pengguna?  2)  Bagaiamana  mengevaluasi  kenyamanan  pengguna dalam  menggunakan  aplikasi  QayimMasjid  yang  telah  disesuaikan  dengan  kebutuhan  pengguna menggunakan metode Human-Centered Design ?
Hasil penelitian ini dihitung menggunakan metode deskriptif [12]. Metode ini banyak digunakan untuk  menjelaskan  suatu  kejadian  pada  penelitian.  Harapan  yang  dihasilkan  dari  riset  ini  yaitu  dengan menggunakan metode deskriptif dapat dijelaskan perbedaan sebelum dan sesudah aplikasi dikembangkan menggunakan metode HCD berdasarkan hasil evaluasi heuristik. Evaluasi heuristik yang dilakukan di awal sebagai dasar untuk perbandingan evaluasi heuristik pada aplikasi QayimMasjid dengan UI/UX yang sudah sesuai dengan kebutuhan pengguna.

## 2. METODE PENELITIAN
Seperti  yang  sudah  dibahas  pada  pendahuluan,  metodologi  penelitian  yang  digunakan  adalah DSRM. DSRM memiliki beberapa tahapan yaitu: 1) Problem identification and motivation , 2) Define the objectives  for  a  solution ,  3) Design  and  development ,  4) Demonstration ,  5) Evaluation, dan  6) Communication [14]. Tahapan DSRM dapat dilihat pada Gambar 1. Tahap 1 yaitu identifikasi masalah dan motivasi.  Pada  tahap  ini  dihasilkan  rumusan  permasalahan  yang  dihadapi  oleh Qayyim Masjid  dalam mengelola kegiatan dan keuangan. Dalam hal ini evaluasi heuristik yang langsung dijawab oleh pengguna menjadi alat untuk mengukur kondisi permasalahan sebelum dilakukan penelitian. Setelah permasalahan diketahui, selanjutnya adalah tahap penentuan objektif penelitian. Luaran tahap ini yaitu berupa tujuan dari penelitian ini. Selanjutnya yaitu tahap perancangan dan pengembangan. Tahap ini pengembangan  UI/UX menggunakan metode HCD, dimana berdasarkan hasil identifikasi permasalahan di awal didapatkan pula kebutuhan pengguna. Sehingga tahap perancangan dan pengembangan ini dapat menggunakan HCD. Tahap berikutnya  yaitu  tahap  demonstrasi.  Pada  tahap  ini  dilakukan  demonstrasi  aplikasi  kepada  pengguna. Sebagai kelanjutan dari demonstrasi ini, evaluasi pun dilakukan untuk mendapatkan hasil pengembangan UI/UX  aplikasi.  Evaluasi  yang  dilakukan  sama  dengan  evaluasi  pada  tahap  identifikasi  masalah  yaitu evaluasi  heuristik.  Luaran  dari  tahap  evaluasi  ini  berupa  data  yang  dapat  menjelaskan  perbedaan  hasil evaluasi  pada  tahap  1  dan  evaluasi  aplikasi  QayimMasjid  yang  telaha  dikembangkan  UI/UX  nya.  Oleh karena  itu  tahap  evaluasi  ini  menggunakan  metode  deskriptif.  Tahap  terakhir  yaitu  tahap  komunikasi, dimana  pada  tahap  ini  hasil  penelitian  ini  dikomunikasikan  kepada  masyarakat  luas  dengan mempublikasikan hasilnya dalam bentuk karya tulis.
Gambar 1. Tahapan DSRM
Metode  penelitian  yang  digunakan  adalah  metode  deskriptif  [12].  Metode  deskriptif  sendiri merupakan  sebuah  penelitian  yang  bertujuan  untuk  memberikan  atau  menjabarkan  suatu  keadaan  atau fenomena  yang  terjadi  saat  ini  dengan  menggunakan  prosedur  ilmiah  untuk  menjawab  masalah  secara aktual.  Sesuai  dengan  tujuan  dari  penelitian  ini  yaitu  akan  menjelaskan  perbandingan  antara  evaluasi heuristik aplikasi  QayimMasjid 2020 dan 2021 yang sudah dikembangkan UI/UX nya sesuai kebutuhan pengguna.
Evaluasi heuristik digunakan dalam mendapatkan hasil aspek apa saja dari UI/UX aplikasi yang perlu perbaikan. Tahapan dari evaluasi heuristik ini terdapat pada Gambar 2 [12]. Tahap demi tahap yang dilakukan pada uji kegunaan dengan evaluasi heuristik yaitu: 1. Pemilihan evaluator
Memilih pengguna yang dapat menjadi representasi Qayyim Masjid Riyyadhushsholihien.
2. Penentuan tujuan dari aplikasi
Tujuan aplikasi QayimMasjid yang akan diuji ditentukan pada tahap ini.
3. Penentuan task yang akan dijalankan pada aplikasi untuk diuji yang berkaitang dengan tujuan aplikasi Pemberitahuan  kepada  pengguna  apa  saja  yang  harus  dilakukan  untuk  dapat  mengevaluasi  tampilan aplikasi dengan evaluasi heuristik.
4. Penyajian hasil pengujian dengan instrumen evaluasi heuristik. Pengujian dilakuakn denga evaluasi heuristik dengan ketegori evaluasi seperti pada Gambar 1 dan skala penilaian  0  sampai 4. 0  menunjukkan  bahwa  aspek  dimaksud  tidak  perlu perbaikan, 4  menunjukkan bahwa aspek dimaksud sangat perlu perbaikan major.
Gambar 2. Tahapan pengujian kegunaan dengan evaluasi heuristik [12]

## 3. HASIL DAN PEMBAHASAN
Berdasarkan tahapan DSRM pada metodologi penelitian ini, berikut hasil dan analisis dari setiap tahapan penelitian ini:

## 3.1. Identifikasi masalah dan motivasi
Pada  tahap  ini  dilakukan  pengidentifikasian  masalah  dan  hal-hal  yang  menjadi  motivasi dilaksanakannya riset ini. Identifikasi masalah dilakukan dengan melakukan wawancara langsung kepada Qayyim Masjid Riyyadhushsholihien. Berdasarkan hasil wawancara tersebut, didapatkan permsalahan yang dihadapi oleh Qayyim Masjid Riyyadhushsholihien adalah kesulitan memberikan informasi secara realtime kepada para jamaah berupa informasi kegiatan dan keuangan. Permasalahn ini muncul di tahun 2020 tidak hanya di Masjid Riyyadhushsholihien saja, namun beberapa masjid pun mempunyai masalah yang sama. Pada tahun tersebut, terbangunlah suatu aplikasi bernama QayimMasjid. Aplikasi ini tidak dapat langsung digunakan  oleh Qayyim Masjid,  karena  sumber  aplikasi  masih  berupa  file  .apk  dan  belum  diunggah  ke Playstore . Aplikasi ini pun dapat digunakan oleh Qayyim Masjid lain yang melakukan perndaftaran pada aplikasi. Permasalahan yang ada diantaranya terkait kemudahan pengguna dalam menggunakan aplikasi, fitur  yang  masih  minim,  serta  belum  dapat  diakses  melalui  Playstore,  maka  dibuatlah  perbaikan  dari aplikasi.  Hal  ini  yang  menjadi  motivasi  utama  untuk  mengembangkan  UI/UX  yang  ada  agar  lebih memudahkan pengguna dalam menggunakan aplikasi QayimMasjid. Selain itu, menjadi motivasi tambahan pula untuk mengunggahnya dalam Playstore dan menambah fitur yang dibutuhkan oleh pengguna.
Pengembangan UI/UX Aplikasi Qayimmasjid untuk Pengelolaan Kegiatan Masjid Menggunakan Human-Centered Design – (Endang Habinuddin, Waway Qodratulloh S, Ida Suhartini, Zulkifli Arsyad,Siti Dwi Setiarini, Yadhi Aditya Permana, Endang Hatma Juniawati)
Berdasarkan  masalah  yang  ada,  hal  utama  yang  perlu  diperbaiki  yaitu  UI/UX  dari  aplikasi. Berdasarkan  evaluasi  heuristik,  didapatkan  perlunya  perubahan  secara  kosmetik  dan  minor  pada  bagian tertentu. Hal ini mendasari rumusan masalah penelitian ini yaitu:
1)  Bagaimana  mengembangkan  aplikasi  QayimMasjid  menjadi  aplikasi  yang  nyaman  digunakan  oleh pengguna?
2)  Bagaiamana  mengevaluasi  kenyamanan  pengguna  dalam  menggunakan  aplikasi  QayimMasjid  yang telah disesuaikan dengan kebutuhan pengguna menggunakan metode Human-Centered Design ?

## 3.2. Pendefinisian objektif
Jawaban  dari  rumusan  masalah  dibutuhkan  untuk  menyelesaikan  permasalahan.  Sehingga, jawaban tersebut menjadi tujuan penelitian ini. Tujuan penelitian yang menjadi luaran tahap ini yaitu: 1) Pengembangan UI/UX aplikasi QayimMasjid menjadi aplikasi yang nyaman digunakan oleh pengguna. 2)  Evaluasi  kenyamanan  pengguna  dalam  menggunakan  aplikasi  QayimMasjid  yang  telah  disesuaikan dengan kebutuhan pengguna menggunakan metode Human-Centered Design .

## 3.3. Perancangan dan pengembangan
Pada  tahap  ini  dilakukan  perancangan  dan  pengembangan  solusi.  Perencanaan  pengembangan solusi dilakukan dengan menggunakan metode HCD, karena akan menyelesaikan masalah Qayyim Masjid Riyyadhushsholihien sekaligus juga bertujuan agar dapat digunakan oleh Qayyim Masjid lainnya. Tahap demi tahap yang dilakukan dengan metode HCD ini yaitu[13]:
1) Spesifikasi konteks dari penggunaan dan kebutuhan
Seperti  yang  telah  dibahas  pada  pendahuluan  dan  metode  penelitian,  bahwa  untuk  mengetahui kebutuhan UI/UX aplikasi dari sisi pengguna dilakukan uji heuristik terhadap aplikasi QayimMasjid tahun 2020. Uji heuristik dilakukan oleh pengguna yang dapat dapat merepresentasikan Qayyim Masjid Riyyadhushsholihien.  Pada  tahap  ini  dihasilkan consistency  and  standards,  recognition  rather  than recall, aesthetic and minimalist design, serta help users recognize, diagnose, and recover from errors harus  diperbaiki  kekurangan-kekurangan  minornya.  Sedangkan, visibility  of  system  status,  match between system and the real world, error prevention, flexibility and efficiency of use, serta help and documentation hanya  perlu  diperbaiki  kosmetik-kosmetiknya.  Berdasarkan  hal  tersebut  rencana pengembangan UI/UX nya yaitu:
a.  Menambahkan  informasi  berupa  pesan  error,  petunjuk  pengisian  formulir,  serta  kemudahan memperbaiki kesalahan pengisian formulir b. Menambahah informasi jadwal melalui notifikasi smartphone android c. Memperbaiki Bahasa agar lebih dimengerti oleh pengguna d. Menggunakan icon yang dapat dipahami oleh pengguna
e. Memperbaiki tampilan agar mempercepat penggunaan (tidak terlalu banyak yang harus diklik untuk satu proses)
f. Memperbaiki beberapa fitur agar sesuai dengan kebutuhan pengguna
g. Memperbaiki tampilan agar mudah digunakan tanpa membaca help atau dokumentasi.
Rencana  ini  kemudian  diimplementasikan  pada  proses  produksi  desain  solusi  yang  direncanakan menggunakan  metode agile dengan  kerangka  kerja scrum . Scrum digunakan  karena  dapat mengakomodir kebutuhan penelitian dengan pendekatan HCD. Selain itu, metode iterative-increment scrum sangat membantu pengerjaan agar lebih focus dan terevaluasi setiap hari[16].
2) Produksi rancangan solusi
Sebagai dukungan produksi solusi, rancangan pengembangan solusi ditetapkan menggunakan kerangka kerja scrum . Gambar 3 berikut menunjukkan alur kerangka kerja dengan menggunakan scrum .

## Gambar 3. Proses Scrum [17]
Pada pengembangan aplikasi QayimMasjid ini telah dilakukan dalam 4 sprint (4 putaran) dalam waktu 4 pekan (masing-masing sprint dilakukan dalam 1 pekan). Pembagian sprint secara umum dapat dilihat pada Tabel 3.
Tabel 3. Pembagian Sprint dalam Proses Scrum
Sprint ke- Target Selesai 1 - Dashboard 2 - Profile - Kegiatan Masjid - Pengumuman Masjid - Transaksi Masjid - Register - Authentication 3 - Search - Bug Fix + CR
- Dokumentasi selesai
4 - Jamaah ( user ) - Change Request ( user sebagai qayyim Masjid)
Seluruh  sprint  selesai  dapat  diselesaikan  serta  menghasilkan  luaran  tahap  ini  dengan  keluarnya  aplikasi QayimMasjid versi 2021 dalam bentuk .apk yang kemudian diunggah ke playstore [18]. Gambar 4 berikut menunjukkan hasil luaran tahap ini.
Pengembangan UI/UX Aplikasi Qayimmasjid untuk Pengelolaan Kegiatan Masjid Menggunakan Human-Centered Design – (Endang Habinuddin, Waway Qodratulloh S, Ida Suhartini, Zulkifli Arsyad,Siti Dwi Setiarini, Yadhi Aditya Permana, Endang Hatma Juniawati)
Gambar 4. Tampilan Aplikasi QayimMasjid
Aplikasi yang telah selesaisampai fitur search di sprint 3 kemudian diuji. Setelah diuji ditemukan beberapa bug yaitu pada fitur tampilan darkmode , masih ada yang belum menggunakan keterangan pengisian, dan lainnya.  Namun,  setelah  pengujian,  perbaikan bug dilakukan  pada sprint 3  pun  dapat  selesai  tepat  pada waktunya.
3) Evaluasi terhadap kebutuhan Evaluasi ini dilakukan pada tahap evaluasi DSRM setelah tahap demonstrasi yang dilakukan oleh pengguna yang merepresentasikan Qayyim Masjid Riyyadhushsholihien.

## 3.4. Demonstrasi
Tahap demonstrasi dilakukan dengan memilih pengguna yang akan melakukan uji coba aplikasi dan melkasanakan evaluasi pada tahap selanjutnya. Pengguna yang dipilih sama dengan pengguna pada evaluasi awal yaitu sebanyak 6 pengguna yang merepresentasikan Qayyim Masjid Riyyadhushsholihien.

## 3.5. Evaluasi
Evaluasi yang dilakukan setelah aplikasi QayimMasjid versi 2021 selesai sama dengan evaluasi yang dilakukan pada aplikasi QayimMasjid sebelumnya. Uji heuristik dilakukan dan dievaluasi langsung oleh  pengguna  agar  dapat  dievaluasi  kesesuaian  UI/UX  aplikasi  dengan  kebutuhan  pengguna.  Hasil pengujian ini kemudian dibandingkan secara deskriptif dengan hasil pengujian sebelumnya [12]. Sehingga, terlihat semakin mendekati tidak ada masalah U/UX atau semakin banyak yang perlu diperbaiki. Tabel 4 menunjukkan hasil evaluasi dari uji heuristik pada aplikasi QayimMasjid versi 2020 dan versi 2021.
Tabel 4. Perbandingan hasil uji heuristik QayimMasjid 2020 dan 2021
Kategori Aplikasi 2020 Aplikasi 2021 Kesimpulan H1 1.50 0.67 Semakin baik H2 1.50 0.50 Semakin baik H3 1.67 0.50 Semakin baik H4 2.33 0.50 Semakin baik H5 1.50 0.50 Semakin baik H6 2.33 0.67 Semakin baik H7 1.83 0.50 Semakin baik H8 2.00 0.50 Semakin baik H9 2.17 1.00 Semakin baik H10 1.67 0.33 Semakin baik Rata-rata 1.85 0.57 Semakin baik
Berdasarkan  data  pada  Tabel  4  secara  deskriptif  dapat  disimpulkan  bahwa  secara  rata-rata  UI/UX  pada aplikasi QayimMasjid sudah semakin baik. Nilai rata-rata 0.57 dan dari seluruh aspek tidak ada nilai yang lebih  dari  1  menunjukkan  bahwa  aplikasi  QayimMasjid  yang  terbaru  hanya  membutuhkan  penyesuaian kosmetik-kosmetik saja.

## 3.6. Komunikasi
Tahap  ini  merupakan  tahap  komunikasi  penelitian  kepada  umum  agar  dapat  menjadi keberlanjutan penelitian pada bidang yang sama. Hal ini dilakukan dengan mengunggah luaran penelitian berupa aplikasi QayimMasjid pada playstore . Selain itu, penelitian ini ditulis menjadi suatu artikel ilmiah yang dipublikasikan.

## 4. KESIMPULAN
Berdasarkan  pemaparan  pada  bagian  pendahuluan,  penelitian  ini  akan  menjawab  bagaimana mengembangkan  UI/UX  dari  aplikasi  QayimMasjid,  dan  bagaimana  hasil  dari  evaluasi  heuristik  pada aplkasi  QayimMasjid  yang  telah  dikembangkan.  Setelah  dilakukan  penelitian  menggunakan  metodologi DSRM, serta pengembangan aplikasi menggunakan metode Human-Centered Design , didapatkan secara deskriptif rata-rata nilai evaluasi heuristik semua aspek semula 1,85 menjadi 0,57. Hal ini memiliki makna bahwa dengan menggunakan metode HCD, pengembangan UI/UX pada aplikasi QayimMasjid ini sangat berpengaruh. Akibatnya, nilai evaluasi heuristik secara rata-rata semakin kecil yang artinya semakin tidak membutuhkan  perbaikan  tampilan.  Kalaupun  harus  ada  perbaikan  hanya  dari  sisi  kosmetik  nya  saja. Adapun perbaikan kosmetik pun dapat menjadi penelitian lanjutan dari penelitian ini.
Pengembangan UI/UX Aplikasi Qayimmasjid untuk Pengelolaan Kegiatan Masjid Menggunakan Human-Centered Design – (Endang Habinuddin, Waway Qodratulloh S, Ida Suhartini, Zulkifli Arsyad,Siti Dwi Setiarini, Yadhi Aditya Permana, Endang Hatma Juniawati)

## DAFTAR PUSTAKA
[1] Maulani GAF, Sapril Mubarok TM (2020) Strategic Planning of Information Systems for Mosque in Indonesia. Business Innovation and Entrepreneurship Journal 2:107–111
[2] Nasution  S,  Nasution  AH,  Yamita  F  (2020)  Mobile  Application  of  Religious  Activities  for  the Great  Mosque  Islamic  Center  Rokan  Hulu  with  Push  Notification.  In:  Second  International Conference on Science, Engineering and Technology (ICoSET 2019). Scitepress, pp 155–162
[3] Shaari MA, Samsudin R (2016) Mobile Mosque Companion Application (KakiMasjid). In: UTM Computing ProceedingsInnovations in Computing Technology and Applications. pp 1–6
[4] da  Rocha  Seixas  L,  Gomes  AS,  de  Melo  Filho  IJ  (2016)  Effectiveness  of  gamification  in  the engagement of students. Computers in Human Behavior 58:48–63
[5] Dodik K (2018) Sistem Informasi Pengelolaan Masjid Ibaadurrahman Berbasis Web.
[6] Rahman  RA  (2013)  Mengenal  Sistem  Informasi  Manajemen.  Mengenal  Sistem  Informasi
Manajemen. Accessed 21 Dec 2021 [7] AW/AT (2021) Kemenag Pati Lakukan Pilot Project Digitalisasi Masjid. http://pati.kemenag.go.id/berita/read/kemenag-pati-lakukan-pilot-project-digitalisasi-masjid-.
Accessed 21 Dec 2021
[8] bin Fadzil MI, bin Omar R, bin Khamis KA, bin Syed Jaafar SMS (2020) The Effectiveness of Smartphone Application Usability among E-society of Bertam Perdana Penang: A Case Study of Masjid  Abdullah  Fahim  E-Mosque  Application.  In:  PervasiveHealth:  Pervasive  Computing
Technologies for Healthcare. ICST, pp 90–94 [9] Quran Best Al Quran Indonesia Senyaman Cetak. https://play.google.com/store/apps/details?id=com.quranbest.app. Accessed 21 Dec 2021
[10] Sudrajat  A  (2021)  Ridwan  Kamil  Dorong  DKM  Masjid  Kembangkan  “Kencleng”  Digital. https://jabar.antaranews.com/berita/338425/ridwan-kamil-dorong-dkm-masjid-kembangkan- kencleng-digital?page=all. Accessed 21 Dec 2021
[11] Tolle  H,  Rokhmawati  RI,  Eunike  MT  (2020)  Evaluasi  dan  Perancangan  User  Interface  untuk Meningkatkan  User  Experience  menggunakan  Metode  Human-Centered  Design  dan  Heuristic Evaluation pada Aplikasi Ezyschool. In: SIET’20: 5th International Conference on Sustainable Information Engineering. pp 200–205
[12] Ependi U (2017) Heuristic Evaluation for Mobile Application (Studi Kasus: Aplikasi Depo Auto 2000 Tanjung Api Api Palembang). Jurnal SIMETRIS 8:
[13] Tolle H, Rokhmawati RI, Eunike MT (2020) User experience design of malang city public service information  mobile  application  using  human-centered  design  method.  In:  PervasiveHealth: Pervasive Computing Technologies for Healthcare. ICST, pp 200–205
[14] Vasilevski N, Birt J (2021) Human-Centered Design Science Research Evaluation for Gamified
Augmented Reality. Frontiers in Virtual Reality 2:122–130
[15] Patrick  E,  Leo  J,  Kaijage  S,  Patrick  E,  Leo  J,  Kaijage  S  (2021)  Design  of  an  Interactive  Geo- Location Mobile Application for Civil Societies in East Africa. Journal of Software Engineering and Applications 14:549–562
[16] Pilz J, Deutschländer J, Thomaschewski J, Schön E-M (2021) Integrating Agile Human-Centered Design  with  Lean  UX  and  Scrum.  In:  WEBIST  2021  -  17th  International  Conference  on  Web Information Systems and Technologies. Scitepress, pp 467–473
[17] Ardito C, Baldassarre MT, Caivano D, Lanzilotti R (2017) Integrating a SCRUM-Based Process with Human Centred Design: An Experience from an Action Research Study. In: Proceedings  - 2017 IEEE/ACM 5th International Workshop on Conducting Empirical Studies in Industry, CESI
2017. Institute of Electrical and Electronics Engineers Inc., pp 2–8 [18] WayQS (2021) QayimMasjid.
https://play.google.com/store/apps/details?id=com.pkm.polban.qayimmasjid.  Accessed  27  Dec 2021