Volume 7 Nomor 1, Maret 2023, pp. 190-199 ISSN: 2548-9771/EISSN: 2549-7200 https://tunasbangsa.ac.id/ejurnal/index.php/jsakti
Perancangan User Interface Dan User Experience Fitur Customer Relationship Management (CRM) Pada Aplikasi Krealogi dengan Metode Design Thinking
Maulana Yusup 1 , Imam Ma'ruf Nugroho 2 , Syariful Alam 3 1,2,3 Sekolah Tinggi Teknologi Wastukancana Purwakarta, Indonesia e-mail: maulanayusup13@wastukancana.ac.id 1 , imam.ma@wastukancana.ac.id 2 , syarifulalam@wastukancana.ac.id 3

## Abstract
At this time the Krealogi application wants to create a new feature, namely the Customer Relationship Management  feature,  with  Customer  Relations  it  is  expected  to  be  able  to  help  provide  a  means  to make it easier to connect with customers so that customers are more generous to  Micro, Small and Medium Enterprises (MSME), but currently Krealogi does not have a suitable application design. user friendly to their target users. From the basis of this problem the author will design a user interface and user  experience  Customer  Relationship  Management  that  is  user  friendly  with  the  design  thinking method and for  testing  using the single ease  question  method. After testing the respondents,  it  was found a score of 6.5 which means that the value of the UI designed is quite easy for users to use.
Keywords: mobile application, Interface, Krealogi, Design Thinking, CRM.

## Abstrak
Pada  saat  ini  Aplikasi  Krealogi  ingin  membuat  fitur  baru  yaitu  fitur  Customer  Relationship Management  dengan  Customer  Relationship  ini  diharapkan  bisa  membantu  untuk  sarana  untuk memudahkan berhubungan dengan pelanggan agar pelanggan lebih royal ke para umkm, akan tetapi saat ini krealogi tidak mempunyai desain aplikasi yang user friendly untuk target pengguna mereka. Dari  dasar  permasalahan  ini penulis akan  merancang user interface dan  user  experience Customer Relastionship  management  (CRM)  yang  user  friendly  dengan  metode  design  thinking  dan  untuk testing  memakai  metode  single  ease  question.  Setelah  testing  kepada  responden  didapati  skor  6.5 yang artinya nilai tersebut ui yang dirancang sudah cukup mudah untuk digunakan oleh pengguna.
Kata kunci: Aplikasi Mobile, Antarmuka, Krealogi, Design Thinking, CRM.

## 1. PENDAHULUAN
Segala  jenis  usaha  pada  umumnya  memiliki  tujuan  dasar  yang  sama  yaitu memperoleh keuntungan sebesar-besarnya. Berbagai cara dilakukan oleh seluruh perusahaan  untuk  mempertahankan  dan  memenangkan  persaingan  bisnis.  Salah satu  faktor  yang  berperan  penting  dalam  mencapai  tujuan  tersebut  adalah loyalnya  pelanggan  yang  dimiliki  perusahaan.  Oleh  karena  itu,  dibutuhkan  suatu strategi  bisnis  supaya  hubungan  pelanggan  dengan  perusahaan  dapat  dibangun dan dikelola dengan baik agar kedua belah pihak saling memperoleh keuntungan. Strategi  bisnis  tersebut  diterapkan  melalui  metode  Customer  Relationship Management  (CRM).  CRM  merupakan  strategi  bisnis  menyeluruh  dalam  suatu perusahaan  yang  memungkinkan  perusahaan  tersebut  secara  efektif  dapat mengelola  hubungan  dengan  para  pelanggan  [1].  CRM  ini  juga  bisa  diterapkan kesemua bidang usaha atau bisnis.
Volume 7 Nomor 1, Maret 2023, pp. 190-199 ISSN: 2548-9771/EISSN: 2549-7200 https://tunasbangsa.ac.id/ejurnal/index.php/jsakti
User Experience menurut Bevan dkk. (2015) adalah berpusat pada preferensi pengguna,  pemahaman,  respon  psikologi  baik  berupa  fisik  maupun  emosi  yang terjadi  sebelum  menggunakan  produk,  saat  menggunakan  produk,  dan  setelah menggunakan  produk.  Hal  pertama  yang  dibutuhkan  untuk  menciptakan user experience yang baik adalah memastikan kebutuhan yang sesuai dengan pengguna.
( joy to use )[2].
Customer  Relationship  Management (CRM)  merupakan  salah  satu  strategi dalam  bisnis  yang  mengintegrasikan  proses-proses  dan  fungsi-fungsi  internal dengan  semua  jaringan  eksternal  untuk  menciptakan  serta  memberikan  nilai tambah untuk kemudahan. Menurut (Buttle dalam Prawira) “CRM didukung oleh data  konsumen  berkualitas  dan  teknologi  informasi”  (Prawira,  2013).  Penerapan konsep  Manajemen  Hubungan  Pelanggan  (CRM)  dapat  diterapkan  untuk memberikan peningkatan pelayanan bagi konsumen atau member agar selalu loyal. Menurut  Kurniawan“  Kerangka  komponen  diklasifikasikan  dalam  operasional, analitikal dan collaborative”[3].
Aplikasi  Krealogi  merupakan  sebuah  bagian  dari  revolusi  digital  untuk UMKM Indonesia. Aplikasi Krealogi dibuat dengan tampilan yang ramah pengguna, sehingga  dapat  digunakan  oleh  pelaku  usaha  dari  berbagai  kalangan.  Selain  itu, Krealogi juga merupakan sebuah wadah untuk mengembangkan kemampuan dan keterampilan  pelaku  UMKM. Aplikasi  Krealogi  menghadirkan  kemudahan  dalam pencatatan  dan  perencanaan  strategis  UMKM.  Fitur-fitur  unggulan  seperti  Catat Pesanan,  Rencana  Produksi,  Catat  Biaya  hingga  Laporan  Usaha  akan  membantu proses-proses tersebut.
Pada  saat  ini  Krealogi  ingin  membuat  fitur  CRM  untuk  memudahkan  para UMKM  menyimpan  data  infomasi  pelanggan.  Dalam  pembuatan  fitur  CRM  akan dilakukan perancangan UI dan UX terlebih dahulu, dengan dibuatnya perancangan UI  dan  UX  terlebih  dahulu  diharapkan  perancang  akan  tahu  gambaran  besar tentang fitur yang akan dibuat dari segi tampilan dan pengalaman pengguna.

## 2. METODOLOGI PENELITIAN
Pada pengembangan ini peneliti menggunakan metode design thinking , Design thinking adalah  proses  yang  sifatnya  berulang  yang  dilakukan  untuk  memahami pengguna, menantang asumsi, dan mengkaji ulang permasalahan yang ada untuk mencari  strategi  alternatif  dan  mendapatkan  solusi.[2].  Adapun  tahapan-tahapan yang harus dilalui bisa dilihat di Gambar 1 dibawah ini.
Volume 7 Nomor 1, Maret 2023, pp. 190-199 ISSN: 2548-9771/EISSN: 2549-7200 https://tunasbangsa.ac.id/ejurnal/index.php/jsakti
Start Empathize (pengumpulan Data) Empathy map Define (Analisis Permasalahan) Poin of View (PoV) User Persona
How Migh We (HMW)
Ideate (Pengembangan Ide) Solution Idea Affinity Diagram Crazy Userflow Wireframe Low-Fidelity Prototype (Perancangan Antarmuka) Wireframe High-Fidelity Prototyping Testing (Pengujian Antarmuka) Iterasi Penarikan Kesimpulan Selesai Metode Design Thinking

## Gambar 1. Tahapan Design Thinking
Metode yang digunakan peneliti yaitu metode design thinking. Dalam metode design thinking peroses pengembangan dilakukan secara terstruktur dan bertahap di dalam design thinking ada 5 tahapan sebagai berikut.
Gambar 2. Proses Design Thinking [4]

## 2.1. Emphatize
Pada  tahap empathize ini  peneliti  menggali  permasalahan  pengguna menggunakan metode wawancara, hasil dari wawancara akan menjadi data yang akan  petakan  menjadi Empathity map. Di  dalam empathy map ini  data-data  telah didapatkan  dibagi  menjadi  4  bagian  yaitu say (yang  dikatakan), think (yang dipikirkan), does (yang dilakukan), feel (yang dirasakan).

## Tabel 1. Emphatize
Aspek Empathy map Pertanyaan Says Fitur apa yang anda butuhkan yang berhubungan dengan customer? Mengapa memilih fitur tersebut? Does Sebelumnya apa yang anda lakukan hingga membutuhkan fitur yang tadi anda sebutkan? Thinking Mengapa memilih fitur tersebut? Feel Apa yang anda rasakan ketika melakukan hal tersebut?
Volume 7 Nomor 1, Maret 2023, pp. 190-199 ISSN: 2548-9771/EISSN: 2549-7200 https://tunasbangsa.ac.id/ejurnal/index.php/jsakti

## 2.2. Define
Pada  tahapan Define ini  merupakan  proses  pemahaman  atas  permasalahan dan kebutuhan pengguna yang akan didefinisian permasalahan yang ada pada user menggunakan metode Point of View (PoV).
a) User Persona
Pada  tahap  ini  peneliti  membuat  user  persona  untuk  memahami  alur pengguna  yang  di  olah  dari  hasil Empathy map akan  dibuatkan  kategori-kategori user  persona  untuk  mentargetkan  pengguna  yang  spesifik.  Dengan  user  persona peleliti dapat memahami kebutuhan dan permasalahan apa saja yang didapatkan dari hasil pengumpulan data.
Gambar 3. User persona[5]

## b) User Persona
Pada  tahap  peneliti  membuat  gambaran-gambaran  dari  penentuan  dari permasalahan  dari  sudut  pandang  responden  untuk  mencari  solution  idea  pada tahap ideated
c) Ideated
Pada  tahapan Ideate ini  peneliti  pengembangan  ide  solusi  bedasarkan pernyataan  sesuai  dengan  pernyataan  masalah yang  sudah  didapatkan.  Di  dalam ideate ini ada beberapa sub yaitu Solution ide , Affinity diagram , User flow , crazy 8’s, Wireframe Low-Fidelity.
d) Prototype
Selanjutnya tahapan keempat yaitu tahapan prototype, Prototype merupakan perancangan  prototipe  berdasarkan  rekomendasi  ide  solusi  ke  dalam  bentuk rancangan  antarmuka  pengguna.  Perancangan  antarmuka  pengguna  yang dilakukan  menggunakan  teknik  Prototyping.  Di  tahapan  ini  peneliti  membuat perancangan berupa Wireframe High Fidelity , dan Prototyping .

## e) Testing
Di  dalam  tahapan  testing  ini  peneliti  menggunakan  metode Single  Ease Question (SEQ),  dengan  metode  ini  peneliti  diharapkan  untuk  menggali  tentang experience responden dari task ke task dan berikan nilai dari rentang 1-7 dari sisi
Volume 7 Nomor 1, Maret 2023, pp. 190-199 ISSN: 2548-9771/EISSN: 2549-7200 https://tunasbangsa.ac.id/ejurnal/index.php/jsakti
kemudahan flow, design , dan lain lain. Jika nilai lebih dari 4 maka desain yang telah di rancang masuk kedalam ketegori mudah digunakan.
SEQ terdiri dari satu pertanyaan dengan skala likert 1 sampai 7 dari pilihan yaitu:  sangat  sulit,  sulit,  cukup  sulit,  netral,  cukup  mudah,  mudah,  dan  sangat mudah.[6]
Gambar 4. Definisi Nilai Single Ease Question [7].
Gambar  5. Sekala Penilaian Single Ease Question . [8]

## 3. HASIL DAN PEMBAHASAN
3.1. Empatize
Pada tahap empathize ini peneliti mewawancara 5 para pelaku UMKM untuk mencari tahu apa saja permasalahan-permasalahan seputar Customer relationship management (CRM) . Setelah melakukan wawancara ke 5 pelaku UMKM didapatkan poin-poin sebagai berikut :
Tabel 2. Poin-poin User Kebutuhan Responden 1 1) membutuhkan fitur kontak Responden 2 2) membutuhkan  fitur  catatan  pesanan  bisa  tersambung  dengan whatsapp  customer  dan  catatan  pesanan  bisa  tersambung dengan whatsapp customer Responden 3 3) membutuhkan fitur membagikan pesan kesemua customer dan membagikan kartu nama Responden 4 4) mebutuhkan laporan penjualan dari customer Responden 5 5) membutuhkan fitur task untuk memanagemen customer
Hasil  dari  wawancara  akan  dibuatkan  empaty  map  untuk  mengetahui kebutuhan responden.
Volume 7 Nomor 1, Maret 2023, pp. 190-199 ISSN: 2548-9771/EISSN: 2549-7200 https://tunasbangsa.ac.id/ejurnal/index.php/jsakti
Gambar 6. Empahty Map

## 3.2. Define
Pada tahap define ini peneliti merincikan permasalahan-permasalahan yang akan dibahas sudah ditentukan dari hasil empathize yang dilakukan kepada para umkm. Berikut ini adalah hasil dari pain of view pendefinisian masalah bisa dilihat di tabel 1 Pain of View pendefinisian masalah
Tabel 3. Pain of View User Kebutuhan Frustration Responden 1 6) Butuh kontak pelanggan di dalam aplikasi 7) Pencatatan kontak pelanggan masih secara manual melalui kontak hp Responden 2 8) Membutuhkan aplikasi yang simple 9) Catatan pesanan bisa tersambung dengan whatsapp customer 10) Membuka whatsapp manual Ketika mau berkomunikasi dengan pelanggan Responden 3 11) Membagikan pesan kesemua pelanggan dan membagikan kartu nama usaha 12) Membagikan pesan ke pelaggan di whatsapp Responden 4 13) Laporan penjualan pelanggans 14) Menganalisa sendiri dari penjualan Responden 5 15) membutuhkan task 16) Jadwal pertemuan dengan  masih mencatat di catatan hp

## 3.2.1 User Persona
Pembuatan user persona akan  dibuat  berdasarkan  hasil pain of view dengan menyesuaikan kebutuhan responden. User persona dibagi menjadi 3 bagian yaitu Biodata, Need, Frustration. Berikut ini adalah hasil dari User Persona.
Volume 7 Nomor 1, Maret 2023, pp. 190-199 ISSN: 2548-9771/EISSN: 2549-7200 https://tunasbangsa.ac.id/ejurnal/index.php/jsakti
Gambar 7. User Persona

## 3.2.2. Ideate
Pada  tahap  pengembangan  ide  ini  peneliti  melakukan  pencarian  solusi  dari pernyataan yang ada dengan cara brainstorming pada tahap ini diharuskan berfikir secara out  of  the  box untuk  menciptakan  solusi,  solusi-solusi  yang  sudah didapatkan  akan  dituangkan  ke  dalam  solution  idea.  Solution  idea  berfungsi sebagai penentu ide-ide apa yang akan dituangkan dari permasalahan yang ada.[8], selanjutnya solusi yang didapatkan akan di kategorikan sesuai tema ide Berikut ini adalah hasil dari brainstorming bisa dilihat di gambar
Gambar 8. Ide Solution
3.2.3. Crazy8
Selanjutnya akan dibuat sketsa kasar untuk mengetahui gambaran-gambaran interface tentang  ide  solusi  yang  akan  dibangun  setiap screen. Peneliti menggambar  sketsa  di  kertas  yang  dilipat  menjadi  8  bagian,  satu screen hanya membutuhkan 1 menit untuk mengerjakan 1 screen interface . Berikut ini hasil dari Crazy’8.
Volume 7 Nomor 1, Maret 2023, pp. 190-199 ISSN: 2548-9771/EISSN: 2549-7200 https://tunasbangsa.ac.id/ejurnal/index.php/jsakti
Gambar 9. Cazy8

## 3.2.4. Prototype
Pada  tahap  Prototype  ini  peneliti  menyatukan  semua  screen  sesuai  dengan flow yang telah dibuat. Untuk melihat prototype aplikasi dapat dilihat melalui link https://bit.ly/maulanay. Selanjutnya akan dibuatnya wireframe, Wireframe adalah sebagai kerangka awal sebelum halaman website atau antarmuka sebuah aplikasi didesain [9]

## 3.2.5. Wireframe High-fidelity
Pada high-fidelity tampilan desain solusi lebih detail seperti warna, icon, dll. Bentuk  high-fidelity  berupa  mockup  [10].  Pada  tahap High  Fidelity peneliti membuat wireframe dengan  detail  paling  baik,  disini  semua  konten  yang  akan ditampilkan dalam wireframe sudah tergambar jelas.
Gambar 10. Wireframe High Fidelity

## 3.2.6. Testing
Tahap  terakhir  yaitu  tahap  testing  dimana  tahap  ini  adalah  tahap memvalidasi ide solusi yang diterapkan ke dalam design apakah ide solusi sudah benar-benar  sesuai  dengan  kebutuhan  dan  menjawab  permasalahan  responden atau  tidak.  Peneliti  menggunakan  metode  Single  Ease  Question  (SEQ).  Berikut merupakan tugas-tugas yang akan diberikan  dan dikerjakan oleh responden bisa dilihat di tabel berikut ini:
Volume 7 Nomor 1, Maret 2023, pp. 190-199 ISSN: 2548-9771/EISSN: 2549-7200 https://tunasbangsa.ac.id/ejurnal/index.php/jsakti
Tabel 4. Task Single Ease Question No  Fungsi Tugas 1 Menambah Kontak & Melihat Detail Kontak Pengguna  berada  di  beranda  masuk  ke  bagian  kontak  untuk menambahkan kontak dan berakhir di detail kontak yang telah di tambahkan 2 Mengedit Kontak Pengguna  berada  di  detail  kontak,  pengguna  mengklik  option untuk  menampilkan  option  edit  kontak  dan  berakhir  di  detail kontak 3 Menghapus Kontak Pengguna  berada  di  detail  kontak,  pengguna  mengklik  option untuk menampilkan option hapus kontak dan berakhir di daftar kontak 4 Mengimport Kontak Pengguna berada di daftar kontak kemudian pengguna mengklik option unutk menampilkan option impor kontak dan diarahkan ke kontak hp yang akan diimpor 5 Mengeksport Kontak Pengguna berada di daftar kontak kemudian pengguna mengklik option untuk menampilkan option impor kontak dan diarahkan ke  kontak  hp  yang  akan  diimpor  kemudian  berakhir  di  daftar kontak 6 Membuat Tugas Pengguna  berada  di  beranda  masuk  ke  bagian  tugas  untuk menambahkan tugas dan berakhir di tugas 7 Mengedit Tugas Pengguna berada di tugas kemudian pengguna mengklik option untuk menampikan option edit tugas dan berakhir di tugas 8 Menghapus Tugas Pengguna berada di tugas kemudian pengguna mengklik option untuk menampikan option edit tugas dan berakhir di tugas 9 Membagikan pesan Pengguna  berada  di  beranda  kemudian  pengguna  masuk  ke broadcast  dan  memilih  broadcast  pesan  setelah  itu  pengguna memilih kontak tujuan yang akan dibagiakan, mengisi pesan dan kirim  pesan  dan  berakhir  di  whatsapp  untuk  melihat  hasil membagiakn pesan 10  Membagikan Kartu Nama Pengguna  berada  di  beranda  kemudian  pengguna  masuk  ke broadscast dan memilih broadcast kartu nama usaha setelah itu pengguna memilih kontak tujuan yang akan di bagiakan, mengisi subjek  dan  kirim  kartu  nama  usaha  dan  berakhir  di  whatsapp untuk melihat hasil membagikan kartu nama usaha 11  Menghubungi  pelanggan di whatsapp Pengguna  berada  di  beranda  memilih  menu  pesanan  dan memilih pelanggan yang akan di hubungi Customer dan berakhir di whatsapp untuk mulai menghubungi Customer 12  Melihat Laporan Penjualan  Pengguna  berada  di  beranda  emmilih  menu  pesanan  dan
memilih laporan penjualan dan berakhir di laporan penjualan.

## Tabel 5. Hasil Pengujian Single Ease Question (SEQ)
No  Responden  Nilai F1  F2  F3  F4  F5  F6  F7  F8  F9  F10  F11  F12 1 R 6 7 7 6 6 7 6 7 7 6 6 6 2 R2 7 7 7 7 7 7 7 7 6 6 6 6 3 R3 7 6 7 6 6 6 6 6 6 6 6 6 4 R4 7 7 7 6 6 7 7 7 7 7 7 6 5 R5 7 7 7 6 6 6 7 7 6 6 6 7 Rata Rata Nilai 6.8  6.8  7 6.2  6.2  6.6  6.6  6.8  6.4  6.2 6.2 6.2 SEQ 6.5
Volume 7 Nomor 1, Maret 2023, pp. 190-199 ISSN: 2548-9771/EISSN: 2549-7200 https://tunasbangsa.ac.id/ejurnal/index.php/jsakti
Dari  tugas  yang  telah  dikerjakan  responden  akan  memberikan  nilai Single Ease Question (SEQ) dari partask (F) yang akan cari rata rata setiap pertask (F) dan untuk  melihat  nilai  akhir  SEQ  dari  semua  nilai  rata-rata  akan  dicari  nilai  tengah atau median maka menghasilkan nilai akhir 6.5

## 4. SIMPULAN
Dari hasil pengujian ke 5 responden yang sudah dilakukan, nilai Single Ease Question  didapatkan  nilai  median  6.5  yang  artinya  nilai  tersebut  cukup  mudah untuk  digunakan  oleh  user.    dengan  perancangan  fitur  customer  relationship management pada aplikasi krealogi ini bisa jadi bahan pertimbangan desain yang user friendly untuk di develop.

## DAFTAR PUSTAKA
[1] H.  E.  Pramudiya,  Y.  Dri  Handarkho,  And  F.  S.  Rahayu,  “Pramudiya, Pengimplementasian  Crm  Pada  Pembangunan  E-Commerce  Untuk  Usaha  Mikro Kecil  Menengah  257  Pengimplementasian  Crm  Pada  Pembangunan  E-Commerce Untuk Usaha Mikro Kecil Menengah (Studi Kasus: Dolanan Puzzle),” Oct. 2015.
[2] M.  Azmi,  A.  Putra  Kharisma,  And  M.  A.  Akbar,  “Evaluasi  User  Experience  Aplikasi Mobile Pemesanan Makanan Online Dengan Metode Design Thinking (Studi Kasus Grabfood),” 2019. [Online]. Available: Http://J-Ptiik.Ub.Ac.Id
[3] H.  Purwanto  And  A.  Sumbaryadi,  “E-Crm  Berbasis  Web  Pada  Sistem  Informasi Penjualan  Funiture,” Maret ,  Vol.  14,  No.  1,  P.  15,  2018,  [Online].  Available: Www.Bsi.Ac.Id
[4] R.  L.  Ramadhan,  A.  Syahrina,  And  A.  Musnansyah,  “Perancangan  Ulang  User Interface  Dan  User  Experience  Pada  Website  Telkom  University  Open  Library Menggunakan Metode User Centered Design,” 2021.
[5] S.  Informatika  And  A.  Polinema,  “Penerapan  Metode  Design  Thinking  Pada Perancangan User Interface Aplikasi Kotakku,” Siap) , P. 2020, 2020.
[6] D. A. Fatah, “Evaluasi Usability Dan Perbaikan Desain Aplikasi Mobile Menggunakan Usability  Testing  Dengan  Pendekatan  Human-Centered  Design  (Hcd),” Rekayasa , Vol. 13, No. 2, Pp. 130–143, Aug. 2020, Doi: 10.21107/Rekayasa.V13i2.6584.
[7] D. Ari Anggara, W. Harianto, And A. Aziz, “Prototipe Desain User Interface Aplikasi Ibu  Siaga  Menggunakan  Lean  Ux  58  Prototipe  Desain  User  Interface  Aplikasi  Ibu Siaga Menggunakan Lean Ux,” 2021.
[8] R.  Fahrudin  And  R.  Ilyasa,  “Perancangan  Aplikasi  ‘Nugas’  Menggunakan  Metode Design Thinking Dan Agile Development,” 2021.
[9] M. S. Hartawan And J. Id, “Swadharma (Jeis) Penerapan User Centered Design (Ucd) Pada Wireframe Desain User Interface Dan User Experience Aplikasi Sinopsis Film,” Vol. 002 Nomor 01, 2022.
[10]  A. Rino, W. Putra, H. Muslimah Az-Zahra, And S. H. Wijoyo, “Evaluasi Dan Perbaikan Antarmuka  Aplikasi  E-Tpt  Kpp  Pratama  Malang  Utara  Menggunakan  Pendekatan Human-Centered Design (Hcd),” 2019. [Online]. Available: Http://J-Ptiik.Ub.Ac.Id