Published by: Ridwan Institute
Syntax Literate: Jurnal Ilmiah Indonesia p–ISSN: 2541-0849 e-ISSN: 2548-1398 Vol. 7, No. 09, September 2022

## PERANCANGAN MOBILE WEBSITE DIREKTORI COFFEE INDUSTRY KOTA MALANG DALAM MENDUKUNG “CAFÉ HOPPING”
Reyza Dwi Dzulqarnain Kahfi 1* , Irfansyah 2
1* Program  Studi  Magister  Desain,  Fakultas  Seni  Rupa  dan  Desain,  Institut  Teknologi Bandung, Indonesia
2 Fakultas Seni Rupa dan Desain, Institut Teknologi Bandung, Indonesia Email: 1* reyzadzulqarnain@gmail.com, 2 irfansyah@itb.ac.id

## Abstrak
Pertumbuhan  industri  kopi  di  Kota  Malang  menciptakan  tantangan  bagi  pelaku usaha  dan  penikmat  kopi.  Fenomena  "cafe  hopping"  menjadi  tren  yang  menarik perhatian,  namun  kesulitan  dalam  mencari  kedai  kopi  yang  sesuai  menimbulkan hambatan. Penelitian ini merancang mobile website Direktori Coffee Industri Kota Malang  dengan  pendekatan  design  thinking  dan  Elements  of  User  Experience. Dengan melibatkan pemilik kedai, penikmat kopi, dan HIPMI Kota Malang, hasil perancangan  diharapkan  mampu  mengatasi  hambatan  tersebut,  memberikan informasi yang efektif, dan mendukung pertumbuhan industri kopi di Kota Malang.
Kata  Kunci :  Industri  Kopi,  Mobile  Website,  Cafe  Hopping,  Design  Thinking,  Kota Malang

## Abstract
The growth of the coffee industry in Malang presents challenges for businesses and coffee enthusiasts. The phenomenon of "cafe hopping" has become a notable trend, but difficulties in finding suitable coffee shops pose obstacles. This research designs a  mobile  website  for  the  Coffee  Industry  Directory  in  Malang  using  the  design thinking  and  Elements  of  User  Experience  approaches.  Involving  coffee  shop owners,  enthusiasts,  and  HIPMI  Malang,  the  design  aims  to  overcome  these barriers,  provide  effective  information,  and  support  the  growth  of  the  coffee industry in Malang.
Keywords:  Coffee  Industry,  Mobile  Website,  Cafe  Hopping,  Design  Thinking,  Malang City

## Pendahuluan
Kopi memiliki tempat khusus di hati banyak orang di penjuru dunia. Kopi telah menjadi lebih dari sekedar minuman, kopi dapat mewakili gaya hidup, pengalaman sosial, dan kesempatan untuk eksplorasi sebuah budaya. Di berbagai daerah di Indonesia, kopi telah  menjadi  fenomena  yang  merangkul  banyak  aspek  kehidupan,  berbagai  etnis, geografi  yang  beragam,  dan  perpaduan  pengaruh  tradisional  dan  modern.  Fenomena minum  kopi  atau ngopi berkembang  tidak  terlepas  dari  gaya  masyarakat  urban  yang gemar  berkumpul  dan  mengekspresikan  diri.  Budaya ngopi juga  sudah  bergeser  dari menikmati  secangkir  kopi  menjadi  pilihan  gaya  hidup  berbagai  kalangan.  Semakin modern  sebuah  era  maka  semakin  menuntut  pula  terjadinya  peningkatan  gaya  hidup manusia itu sendiri. Gaya hidup konsumtif salah satunya yang mendorong budaya ngopi menuju  tingkatan  yang  berbeda  dari  sebelumnya.  Konsumtif  secara  tidak  sadar membentuk  impian  dan  kesadaran  para  konsumen  hingga  melahirkan  pola-pola konsumerisme yang tidak ada habisnya.
Hal  ini  menciptakan  fenomena  unik  yang  dikenal  sebagai "cafe  hopping" yang melibatkan  mengunjungi  berbagai  kedai  kopi  untuk  menikmati  suasana,  kualitas  kopi, dan  menu  yang  tersedia.  Fenomena cafe  hopping ini  telah  menciptakan  budaya,  gaya hidup  dan  pola  konsumerisme  tersendiri,  khususnya  di  kalangan  penikmat  kopi  dan pengunjung yang mencari pengalaman baru. Pengunjung sering bepergian ke kedai kopi yang  berbeda  untuk  menjelajahi  rasa  dan  jenis  kopi  yang  berbeda,  menikmati  suasana yang berbeda, dan mengabadikan momen dengan membagikannya di media sosial. Gaya hidup yang mengalir melalui secangkir kopi menjadikan ngopi sebagai pilihan gaya hidup yang bisa didapatkan, diisi ulang, atau bahkan ditingkatkan (Tucker, 2011: 6-7). Terlebih dengan banyaknya bermunculan cafe dan kedai kopi, menjadikan cafe hoping ini menjadi sebuah tren yang marak dalam beberapa tahun terakhir di berbagai daerah di Indonesia.
Pada  akhirnya ngopi menjadi  sebuah  aktifitas  sosial  dan  suatu  saat  menjadi kompetisi untuk diri sendiri  yang tidak lebih untuk kompetisi pada teman dan anggota masyarakat  untuk  menunjukkan  eksistensi  diri  yang  lain  sebagai  simbol  status  sosial, harga. diri, dan citra insan modern dan tidak ketinggalan zaman. Oleh sebab itu hal ini erat  kaitannya  dengan  sebuah  eksistensialisme  dari  pribadi  seseorang.  Kopi  dipandang sebagai artefak budaya masyarakat urban yang terikat pada praktik sosial dan kemudian dianggap sebagai profil atau identitas sosial. Budaya kopi dan budaya anak muda dikenal eksis sebagai sirkuit budaya yang menonjolkan empat momen yakni budaya, representasi, identitas, produksi, konsumsi. Budaya ngopi telah menjadi pilihan gaya hidup bagi anak muda umumnya untuk memenuhi representasi identitas anak nongkrong yang ideal.
Kuliner merupakan subsektor penyumbang terbesar dari produk domestik bruto (PDB). Namun sektor ini sedikit-banyak kurang memiliki kekuatan untuk memasarkan dan memperkenalkan merek mereka. Saat merancang direktori media perlu pertimbangan desain sangat penting untuk memastikan pengalaman pengguna  yang terbaik dan tidak terbatasi  oleh  system  dari  suatu platform .  Desain  yang  baik  harus  dapat  menyajikan informasi secara efektif, jelas, intuitif dan menarik, serta memberikan pengalaman yang mudah dan memuaskan kepada user dalam mencari dan menjelajahi kedai kopi di Kota
Malang.  Oleh  karena  itu,  diperlukan  penelitian  yang  mendalam  untuk  menghasilkan desain media direktori industri kopi yang efektif dan menarik perhatian pengguna di kota Malang.
Mobile website memiliki potensi dan solusi yang cukup signifikan sebagai media direktori karena dikelola tanpa mengikuti system dari suatu platform sosial media yang banyak digunakan oleh media direktori yang saat ini banyak bermunculan. Perancangan mobile website ini juga akan bekerja sama dengan media direktori online di Kota Malang yakni  Kondimen  (@kondimen.mlg)  yang  sudah  berkiprah  sejak  1  April  2017  menjadi salah satu pionir media direktori kopi di Kota Malang dengan jumlah pengikut sebanyak 13  ribu  di  Instagram,  menjadikan  Kondimen  sebuah  media  yang  diakui  oleh  penikmat kopi.  Kondimen  lahir  dari  keresahan  munculnya  kedai  kopi  atau café yang  banyak bermunculan di Kota Malang. Kondimen ingin memudahkan para penikmat kopi untuk menemukan  kedai  kopi  atau café yang  akan  dikunjungi.  Teori  desain  media  direktori berbasis mobile website mengacu pada prinsip-prinsip dan konsep yang digunakan dalam merancang dan mengembangkan sebuah direktori online. Sebuah direktori online adalah situs  web  yang  memuat  daftar  tautan  atau  informasi  tentang  berbagai  situs  web  atau sumber  daya  online  lainnya,  biasanya  diorganisir  dalam  kategori-kategori  atau subkategori yang berbeda.
Dalam  perancangan  media  direktori  berbasis mobile  website ,  penelitian  ini menggunakan teori design thinking . Design thinking merupakan sebuah eksplorasi atau rencana  desain  dalam  berbagai  ranah. Desain  thinking mengacu  pada  sudut  pandang sebagai  manusia  dalam  merangkai  dan  menciptakan  sebuah  rancangan  desain.  Lebih lanjut, design  thinking menitikberatkan  pendekatan  dengan  manusia  guna mengintegrasikan  kebutuhan  manusia  lain  (pengguna),  khususnya  terkait  penggunaan teknologi dalam kaitannya dengan perkembangan informasi dan bisnis. Design thinking akan  melakukan  pendekatan  gabungan  tiga  faktor,  yaitu viability (bisnis), desirability (manusia),  dan feasibility (penggunaan  teknologi).  Nantinya, desain  thinking ini  akan berkutat pada inspirasi, ide, dan juga bagaimana penerapannya (Brown, 2008).
Penelitian  ini  bertujuan  untuk  merancang  mobile  website  Direktori  Coffee Industri Kota Malang yang mendukung "café hopping" dengan fokus pada karakteristik penikmat  kopi  di  Kota  Malang.  Penelitian  ini  akan  mengembangkan  desain  media direktori  yang  responsif  dan  tepat,  serta  mengidentifikasi  manfaat  dan  pengaruhnya terhadap industri kopi di kota tersebut. Tujuan utama melibatkan identifikasi karakteristik penikmat kopi "café hopping" dan perancangan mobile website, sedangkan manfaatnya mencakup  pelayanan  informasi  dan  rekomendasi  kepada  konsumen,  kemudahan  bagi wisatawan,  peningkatan  jumlah  pelanggan  bagi  pelaku  industri  kopi,  serta  dukungan terhadap  pengembangan  sektor  kuliner  Kota  Malang  oleh  pemerintah  daerah.  Dengan pendekatan  fenomenologi  desain,  tesis  ini  diharapkan  tidak  hanya  menjadi  acuan  bagi desainer,  tetapi  juga  memberikan  kontribusi  positif  bagi  masyarakat,  industri,  dan pemerintah setempat.

## Metode Penelitian
Metode  perancangan  yang  digunakan  dalam  penelitian  ini  melibatkan  dua pendekatan utama, yaitu The Elements of User Experience (UX) oleh Jesse James Garrett dan Design Thinking. Dalam konteks perancangan mobile website untuk direktori kedai kopi  dan café di  Kota Malang, dipilih mobile website sebagai  hasil akhir  perancangan karena  memfasilitasi  pengguna  untuk  mengakses  informasi  dengan  cepat.  Tahapan perancangan  melibatkan  Strategy,  Scope,  Structure,  Skeleton,  dan  Surface  dari  The Elements of UX, serta tahapan Emphatize, Define, Ideate, Prototype, dan Test dari Design Thinking.  Metode  pengumpulan  data  mencakup  observasi,  wawancara  mendalam, kuesioner,  dan  dokumentasi.  Data  wawancara  diperoleh  dari  tiga  narasumber  yang merupakan pemilik kedai kopi dan café, serta sekretaris HIPMI Kota Malang, pengerajin biji  kopi,  dan  penikmat  kedai  kopi  di  Kota  Malang.  Analisis  data  melibatkan  proses iteratif  design  thinking,  dengan  tahapan  Emphatize  dan  Define  untuk  memahami kebutuhan  pengguna,  Ideate  untuk  mengembangkan  ide,  Prototype  untuk  merancang struktur mobile website, dan Test untuk menguji coba kepada pelaku industri kopi dan penikmat  kopi  di  Kota  Malang.  Proses  ini  diarahkan  untuk  memastikan  efektivitas, efisiensi, dan tingkat kesenangan pengguna terhadap perancangan mobile website, serta mendapatkan  umpan  balik  untuk  melakukan  perbaikan  jika  diperlukan.  Selain  itu, tahapan  pengujian  usabilitas  mengikuti  10  pedoman  pengujian  usabilitas  dari  Nielsen (1994). Metode perancangan ini diharapkan dapat menghasilkan mobile website direktori yang  memenuhi  kebutuhan  dan  ekspektasi  pengguna  dalam  mendukung  aktivitas  café hopping di Kota Malang.

## Hasil dan Pembahasan
Ideasi  dan  konsep  dasar  dalam  perancangan  ini  berdasar  pada  kebutuhan  dan kemudahan dalam mengakses direktori agar tercapainya tujuan yang ingin dicapai, yakni mempermudah  konsumen  dan  pengunjung  kedai  kopi  dan café di  Kota  Malang  agar menemukan tempat destinasi sesuai dengan preferensi dan kebutuhan dari pengguna. Dari pengumpulan  data  yang  penulis  lakukan  dan  identitas  dari  direktori  yang  akan dikembangkan  yakni  Kondimen  Malang.  Metode  yang  akan  digunakan  dalam perancangan ini menggunakan penggabungan 2 metode yakni Design Thinking dan Five Planes Method. Penjabaran metode konsep umum digambarkan sebagai berikut.

## Gambar 1. Konsep Umum Metode Perancangan

## A. UI/UX Mobile Website Direktori
Pendekatan “Five Planes”. oleh J.J. Garret (2011) digunakan dalam perancangan direktori mobile  website untuk  kedai  kopi  dan cafe ini.  Metode  ini  memiliki  lima tahapan atau level yang berbeda, yaitu Strategy Plane, Scope Plane, Structure Plane, Skeleton  Plane, dan Surface  Plane. Strategi,  batasan,  dan  struktur mobile  website berfungsi  sebagai  bentuk  abstrak  dari  alur,  yang  kemudian  dilakukan  ke  bentuk konkret  dari  antarmuka  dan  pengalaman  pengguna.  Perancang  dapat  mengulang  di dalam setiap langkah jika diperlukan, tetapi seluruh proses harus diselesaikan secara berurutan.

## B. Uji Usabilitas
Uji  usabilitas  adalah  metode  mengevaluasi  produk  atau  rancangan  dengan pengujian  kepada  pengguna  yang  representatif.  Tujuannya  adalah  untuk mengidentifikasi  masalah  dari  fungsi  dan  pengoperasian,  mengumpulkan  data kualitatif dan kuantitatif, dan menentukan kepuasan pengguna terhadap produk atau rancangan.
Uji  usabilitas  dapat  dilakukan  dengan  berbagai  cara,  dalam  hal  ini  akan ditentukan langkah yang akan dilakukan berdasarkan dari "10 Usability Heuristics for User Interface Design" oleh Jacob Nielsen (1994). Berikut ini beberapa langkah umum yang akan dilakukan.
a. Penentukan tujuan dan sasaran tes: Hal ini termasuk mengidentifikasi target audiens, tugas-tugas yang akan diuji, dan metrik yang akan digunakan untuk mengukur keberhasilan.
b. Merencanakan tes: Hal ini mencakup pemilihan pengaturan tes, memutuskan data apa yang akan dikumpulkan, dan membuat rencana tes.
c. Merekrut peserta: Peserta harus mewakili  audiens target dan harus direkrut terlebih dahulu.
d. Melaksanakan  tes:  Selama  tes  berlangsung,  peserta  harus  diminta  untuk menyelesaikan tugas-tugas  yang telah diidentifikasi  dalam rencana tes. Tes harus  dilakukan  di  lingkungan  yang  tenang  dan  bebas  dari  gangguan,  dan peserta  harus  didorong  untuk  berpikir  dengan  suara  keras  saat  mereka menyelesaikan tugas-tugas tersebut.
e. Mengumpulkan  data:  Data  harus  dikumpulkan  selama  tes  berlangsung, termasuk pengamatan, catatan, dan metrik.  Data  ini dapat  digunakan untuk mengidentifikasi  masalah kegunaan dan melakukan perbaikan pada produk atau layanan.
f. Menganalisis data: Data yang dikumpulkan selama pengujian harus dianalisis untuk mengidentifikasi masalah kegunaan dan untuk menentukan kepuasan pengguna terhadap produk atau layanan.
g. Melaporkan  hasil:  Hasil  uji  kegunaan  harus  dilaporkan  kepada  para pemangku kepentingan, termasuk perancang, pengembang, dan manajemen. Laporan tersebut harus mencakup rekomendasi untuk meningkatkan produk atau layanan berdasarkan data yang dikumpulkan selama pengujian.
C. Strategy Plane
1. Identifikasi Tujuan
Membuat media direktori mobile website untuk kedai kopi dan café di Kota Malang adalah tujuan utama dari perancangan ini. Meskipun demikian, tujuan ini dapat didefinisikan dalam bentuk informasi (produk sebagai informasi) dan fungsi (produk sebagai fungsi).
a. Konsumen dan penikmati kopi dapat mencari informasi kedai kopi dan café yang ingin dituju dengan cepat.
b. Fitur lain yang dihadirkan juga memberikan informasi tentang aktivitas, karir, dan berita terkait kopi dan kedai kopi di Kota Malang.
Tujuan yang telah disebutkan diatas saling berhubungan dengan sumber data yang telah dikumpulkan melalui kuesioner kepada konsumen kedai kopi dan juga wawancara kepada pelaku industri kopi. Berdasarkan tujuan tersebut, perancangan mobile  website akan  dirancang  dengan  kemudahan  dan  kecepatan  akses  bagi pengguna  dalam  mencari  informasi  kedai  kopi  dan café di  Kota  Malang,  serta dengan update dan  penambahan  informasi  secara  berkala  agar  pengguna  dapat memiliki  rekomendasi  destinasi  kedai  kopi  dan cafe baru  untuk  mendukung kegiatan café hopping .
2. Kebutuhan Pengguna
Kebutuhan  pengguna  berdasarkan  data  yang  telah  dihimpun  yakni  menitik beratkan  pencarian  informasi  kedai  kopi  dan café yang  sesuai  dengan  preferensi pengguna dengan cepat dan akurat, karena dalam riset perancang menemukan pain pengunjung kedai kopi dan café yang kesulitan dalam menemukan informasi kedai kopi  dan café di  sosial  media  karena  algoritma  yang  semakin  memperkeruh
pencarian.  Selain  itu  pengguna  juga  dapat  memiliki  informasi  terkait  berita  dan aktivitas  seputar  kopi  dan  kedai  kopi  di  Kota  Malang.  Secara  garis  besar perancangan  direktori  ini  agar  terhimpun  dan  terarsip  dengan  baik  tentang  kedai kopi dan café di Kota Malang.
3. Segmentasi Pengguna
Segmentasi pengguna utama adalah pengunjung dan penikmat kedai kopi dan cafe di  Kota  Malang.  Dibutuhkan  informasi  seputar  kopi  dan  kedai  kopi  secara berkala, valid dan transparan. Segmentasi pengguna ini telah dijabarkan dalam sub bab III.4.1 tentang strata segmentasi bagaimana kesinambungan antara segmentasi pengguna dan juga segmentasi kedai kopi dan cafe.
a. Segmentasi pengguna sekunder adalah pelaku industri kedai kopi dan cafe yang akan memiliki wadah secara nyata dan aktif dalam meningkatkan industri kedai kopi  dan cafe di  Kota  Malang,  dimana  pelaku  dapat  melihat  reaksi  dan pengalaman  pengunjung  agar  dapat  menemukan  inovasi  dan  memenuhi kebutuhan pengunjung dan penikmat kopi.

## D. Scope Plane
Pada tahapan ini, dalam hal kebutuhan fungsional dan konten direktori, penulis membatasi  elemen-elemen  yang  telah  dibahas  pada  tahap  strategi  sebelumnya. Functional Specifications, Content Requirements, dan User Requirements merupakan tiga  bagian  dari  tahap  ini.  Berikut  ini  adalah  penjelasannya  dari  tahapan  yang  telah disebutkan.
1. Function Specification
Aspek yang akan digunakan untuk membuat direktori kedai kopi dan cafe di  Kota  Malang  memiliki  batasan  yang  telah  ditentukan.  Berikut  ini  adalah kebutuhan fungsi utama dari direktori, yakni:
a. Direktori dan konten bersifat informatif dan rekomendatif tentang kedai kopi dan café di Kota Malang.
b. Navigasi utama akan berada pada filter direktori dimana fitur tersebut akan memudahkan pengguna dalam pengoperasian perancangan.
c. Perancangan  sistem  dengan  fitur  direktori  agar  pengguna  dapat  menyaring dan menemukan informasi dengan spesifik dan mudah tentang kedai kopi dan café sesuai dengan preferensi pengguna.
d. Mobile  website terbagi  menjadi  dua  bagian  yaitu  direktori  dan  artikel informasi  terkait  industri.  Masing-masing  akan  memiliki  halaman  khusus untuk menampilkan informasi yang terkategorikan.
2. Content Requitements
Penulis menyusun konten-konten yang dibutuhkan sebagai panduan untuk tahap  selanjutnya,  berdasarkan  kebutuhan  dan  tujuan  dari  penggunaan  website yang  telah  dijabarkan  pada  tahap  sebelumnya.  Berdasarkan  sumber  data  dan tujuan  perancangan mobile  website direktori,  penulis  menentukan  konten  yang akan dirancang sebagai panduan untuk tahapan berikutnya. Terdapat dua bagian besar untuk konten yang ditentukan, yakni:
a. Filter Direktori
Filter  direktori  menjadi  konten  utama  dalam  membantu  pengguna dalam  mencari  kedai  kopi  dan cafe juga  sebagai  wadah  penyampaian informasi terkait industri kopi di Kota Malang. Berdasarkan topik dan objek penelitian  yakni  kedai  kopi  dan cafe di  Kota  Malang,  dimana  sumber  data berkaitan  dengan  penentuan  konten  informasi  yang  akan  ditampilkan. Berdasarkan  kategori  yang  telah  ditentukan  terdapat  beberapa  kebutuhan meliputi  cakupan  area,  sajian,  jangkauan  harga,  hingga  fasilitas  yang diberikan.  Komponen  tersebut  berdasar  dari  masing-masing  kategori  yang diberi  keterangan  dari  tingkat  prioritas.  Setiap  pengoperasian  direktori memiliki skema yang akan memberikan komponen informasi sesuai dengan filter  yang  telah  dipilih.  Berikut  paparan  skema  yang  berhubungan  dengan komponen informasi dalam direktori tersebut:
1) Jangkauan area yang akan mencakupi 5 kecamatan di Kota Malang, serta terdapat landmark yang  akan  menjadi  penandaa  cakupan  area,  seperti halnya sekitar kayutangan, alun-alun, tugu, dsb.
2) Fasilitas yang dimiliki oleh tiap kedai kopi akan dijabarkan dan dapat di filter  sesuai  dengan  preferensi  pengunjung,  seperti  halnya  ruangan indoor, terdapat smoking area, area parker yang luas, dsb.
3) Menu  sajian  juga  dapat  dipilih  dalam  konten  filter  ini  yang  telah dikategorikan sesuai garis besar dari jenis kategori menu, seperti halnya jenis olahan kopi, sajian barat, sajian asia, program sarapan, dsb.
4) Rentang harga yang telah disesuaikan berdasarkan pada jangkauan harga seluruh kedai kopi di Kota Malang dan akan dijadikan satuan pengukuran dari poin 1 (termurah). hingga 5 (termahal).
b. Informasi Industri Kopi
Konten  utama  yang  kedua  terdapat  beberapa  bagian  konten  yang termasuk  dalam  lingkup  informasi  industri  kopi  di  Kota  Malang  yang diperbarui secara berkala dan waktu yang sebenarnya. Hal ini menjadi wadah baru  bagi  masyarakat  dan  pengguna  agar  mendapat  informasi  seputar kegiatan  dan  edukasi  mengenai  industri  kopi  di  Kota  Malang.  Terdapat kategori konten yakni Aktifitas, Berita dan Karir seputar industri kopi di Kota Malang.
3. User Requirements
Ekspektasi  pengguna  dan  interaksi  dalam  pengoperasian mobile website dalam User  Requirements .  Pengguna  diharapkan  dapat  menjalankan  fitur-fitur yang dihadirkan dan dapat menyelesaikan tugas dalam pencarian informasi dalam direktori mobile  website. Berikut  merupakan  tugas  yang  pengguna  harus  dapat jalankan dalam direktori, yakni:
Tabel 1 User Requirements direktori kedai kopi Pengguna Interaksi dan Ekspektasi Pengguna 1. Pengunjung  Kedai  Kopi
dan Cafe di Kota Malang
2. Penikmati Kopi yang berkunjung  atau  di  Kota Malang
3. Pelaku  industri  kopi  di
Kota Malang
4. Masyarakat  umum  yang berkunjung di Kota Malang Memanfaatkan fitur di homepage. Mencari informasi kedai kopi dan cafe terdekat atau  sesuai  dengan  preferensi  yang  ingin dikunjungi.
Mencari  informasi  terkait  berita,  aktifitas kegiatan seputar kopi atau di kedai kopi dan cafe di Kota Malang.
Menemukan detail informasi dan memanfaatkan fitur  seperti  foto,  ulasan,  video,  dsb.  dalam artikel  kedai  kopi  dan cafe yang  ingin
dikunjungi.
4. Structure Plane
a. Interaction Design
Setelah membagi jenis pengguna yang dilakukan di User Requirements, maka ditentukan interaksi yang juga disesuaikan kepada jenis pengguna agar alur pengoperasian pada mobile website dapat menunjang kebutuhan fitur dari pengguna.
Rancangan interaksi untuk pengguna sudah dapat memanfaatkan fitur di homepage sesaat awal mengakses mobile website. Lalu pengguna juga dapat mencari informasi spesifik terkait kedai kopi dan cafe menggunakan fitur filter direktori  yang  akan  diatur  atau  disesuaikan  dengan  bagian  tersendiri  agar memudahkan dalam pengoperasian oleh segala jenis pengguna. Interaksi yang dirancang  pada  filter  direktori  akan  sangat  memudahkan  dan  mempercepat pencarian  oleh  pengguna.  Penjabaran  detail  interaktif  dalam  mobile  website akan dijelaskan sebagai berikut:
Gambar 2. Interaction design pengguna
b. Information Architecture
Pemetaan konten informasi yang akan disusun dalam situs web direktori ini adalah tujuan dari langkah hierarki ini. Halaman utama menampilkan entri data  dengan  kategori  kategori  terbaru  sebagai  pusat  penyajian  konten informasi.
c. User Task Flow
Untuk  memberikan  pengalaman  pengguna  dan  membantu  pengguna mencapai  tujuan  mereka  ketika  mengoperasikan mobile  website direktori dibutuhkan alur pengguna karena hal ini menjadi salah satu komponen utama dalam tahap bidang struktural.  Alur ini menunjukkan berbagai  tahapan  yang mungkin dilakukan oleh pengguna saat berinteraksi, mulai dari navigasi hingga menyelesaikan aktivitas  yang diinginkan. Pengguna dapat mencari informasi secara efisien karena dirancang intuitif melalui alur kerja pengguna. Alur ini menjadi  landasan  dalam  perancangan  struktur  dan  navigasi  agar  tercapainya tujuan yang komprehensif.
5. Skeleton Plane
a. Interface Design
Antarmuka  dirancang  dengan  mengedepankan  hirarkis  tata  letak  agar dapat mencapai tujuan dimana direktori mobile website dapat mempermudah dan  mempercepat  pencarian  kedai  kopi  dan café sesuai  dengan  preferensi pengguna,  dengan  elemen  terkait  yang  sederhana  namun  efektif  dan  tidak memiliki banyak aksen dan ornamen diharapkan dapat memberikan prioritas konten yang sesuai.
b. Navigation Design
Perancangan navigasi dalam direktori mobile website
mempertimbangkan kebutuhan dan celah yang dapat menjadi solusi dalam alur pengoperasian  dan  struktur  informasi  konten.  Desain  dalam  navigasi  dibuat agar  dapat  diakses  dengan  cepat  dan  mudah  dalam  pengoperasian  bagi pengguna  untuk  menjelajahi  seluruh  fitur  dan  konten  yang  dihadirkan.  Hal tersebut agar pengguna dapat memanfaatkan direktori dengan responsif.
6. Surface Plane
Tahapan  akhir  dalam  metode five  planes ini  yakni Surface  Plane dimana fokus dalam hal ini adalah bagaimana menentukan tampilan visual yang menarik dan  fungsional  dalam kebutuhan direktori kedai  kopi  dan café di  Kota Malang. Tahap  ini  akan  mempertimbangkan  estetika  visual  dan  kemudahan  dalam pengoperasian agar dapat memberikan kemudahan pada pengguna.
Penggabungan  antar  elemen  grafis  seperti  halnya  warna,  elemen,  ikon,  dan tipografi  akan  dikemas  sedemikian  rupa  agar  dapat  mencapai  antarmuka  yang harmonis  dan berkesinambungan antara satu  dengan lainnya. Selain itu hirarkis konten  juga  dipertimbangkan  agar  pengoperasian  perancangan  dapat tersampaikan dengan baik. Berikut adalah hasil dari tampilan antarmuka direktori mobile website.

## 7. Prototype Mobile Website
Tahapan  ini  merupakan  metode  dalam  pengembangan  sebuah  rancangan dengan  menggabungkan  unsur-unsur  yang  sudah  ditentukan.  Hal  ini  ditujukan untuk  dapat  dioperasikannya  sebuah  rancangan  dalam  hal  ini  adalah  direktori mobile website. Perancang menggunakan software yang umum digunakan dalam prototyping  mobile  website yakni  Figma,  karena  kemudahan  dalam pengoperasian.  Dalam  memenuhi  kebutuhan  navigasi  dan  interaksi  dapat dilakukan  dengan software ini  dengan  menghubungkan  antara  satu  halaman dengan yang lain. Berikut adalah gambaran dari prototype dalam perancangan ini.
8. Uji Usabilitas
Setelah  seluruh  proses  perancangan  telah  usai  dilakukan,  tahap  selanjutnya merupakan tahap pengujian agar dapat memiliki tolak ukur pada perancangan ini dalam segi kegunaan, alur, kemudahan, serta tujuan yang ingin dicapai sudah terpenuhi. Metode yang digunakan merupakan Heuristic Evaluation dari Nielsen. Metode ini merupakan pengujian  yang  cukup  sering  digunakan  dalam  menilai  perancangan website karena proses  yang  cukup  ringkas  dan  tidak  memerlukan  biaya  yang  banyak. Heuristic Evaluation memiliki 10 poin yang menjadi tolak ukur penilaian yakni Visibility of system status, Match between system and the real world, User control and freedom, Consistency and  Standards,  Error  Prevention,  Recognition  rather  than  recall  ,  Flexibility  and efficiency of use, Aesthetic and Minimalist design, Help users recognize, diagnose, and recover from errors, dan Help and documentation.
Prototype yang  akan  di  uji  cobakan  dilakukan  melalui  scenario  tugas  dengan menentukan partisipan yakni khalayak umum sesuai dengan segmentasi dan tujuan dari perancangan  ini  dengan mempertimbangkan karakteristik  pengguna  yang  juga pengunjung kedai kopi dan café . Dari hasil uji usabilitas diatas akan dievaluasi dan akan dijadikan  acuan  penilaian  apakah  perancangan  sudah  memenuhi  penilaian  dari  uji usabilitas ataupun masih perlu ada perbaikan. Berikut merupakan penjabaran dari metode uji usabilitas yang akan dilakukan dalam perancangan ini.
a. Tujuan Uji Usabilitas
Penetapan tujuan dalam uji usabilitas ini dilakukan agar memiliki batasan yang  ingin  dicapai.  Berikut  merupakan  tujuan  yang  penulis  tentukan berdasarkan sumber data yang dimiliki.
1) Evaluasi  menyeluruh  dari  rancangan  dengan  metode  dari Heuristic Evaluation dimana dilakukan identifikasi sejauh mana perancangan sesuai dengan 10 poin dari metode yang telah ditentukan.
2) Evaluasi kekurangan dari perancangan yang menjadi penghambat dalam pengoperasian direktori mobile website.
3) Mendapat umpan balik dari pengguna yang akan menjadi penanda apakah perancangan  sudah  mencapai  tujuan  yang  diharapkan  atau  masih  perlu adanya perbaikan.
4) Memiliki  penilaian  dari  pengguna  bagaimana  perancangan  yang  sudah dilakukan dari segi fungsionalitas dan estetika visual.
b. Partisipan Uji Usabilitas
Pemilihan partisipan untuk prosedur uji usabilitas dilakukan secara acak kepada  pengunjung  kedai  kopi  dan café di  Kota  Malang  agar  tujuan  kepada segmentasi  dapat  terpenuhi.  Partisipan  yang  dipilih  juga  diharapkan  dapat menjadi  penggambaran  dari  kebanyakan  pengunjung  kedai  kopi  dan café di Kota  Malang.  Berikut  adalah  partisipan  yang  didapatkan  dalam  proses  uji usabilitas dilakukan.
Tabel 2 Daftar partisipan uji usabilitas No.  Partisipan 1 Nama Hanisa Pramesty Profesi Mahasiswa Pengunjung dari kedai kopi Jokopi No.  Partisipan 2 Nama Denni Ardyanto Profesi Pekerja Swasta Pengunjung dari kedai kopi Amstirdam Coffee No.  Partisipan 3 Nama Yolan Profesi Pelajar SMA Pengunjung dari kedai kopi Toko Roti Cengli
c. Prosedur Uji Usabilitas
Prosedur  yang  akan  dijalankan  dalam  uji  usabilitas  perancangan  ini dengan  menggunakan  skenario  tugas  yang  perlu  dijalankan  oleh  partisipan. Skenario  tugas  disusun  menyesuaikan  dengan  bagian  dari  rancangan  untuk melihat kegunaan dari sebuah fitur, navigasi dan alur pengoperasian. Skenario tugas ini akan diberikan nilai oleh partisipan sesuai dengan tingkat kesulitan dalam  pengoperasian  direktori mobile  website. Penilaian  akan  menggunakan poin 1 (Sulit), 2 (Sedang), 3 (Mudah). Berikut adalah detail skenario tugas serta perhitungan nilai yang akan dilakukan.
9. Hasil dan Analisis Uji Usabilitas
a. Analisis Uji Usabilitas
Dari  tabel  hasil  uji  usabilitas  diatas  maka  selanjutnya  akan  dilakukan analisis dan penilaian rata-rata. Penilaian akan dilakukan dengan pendekatan kualitatif yang akan ditetapkan pada setiap pengujian. Berikut adalah kategori penilaian yang telah ditentukan untuk dapat menentukan hasil analisis dari uji usabilitas yang telah dilakukan.
Tabel 3 Tabel kategori penilaian uji usabilitas No.  Kategori Penilaian Skenario Tugas Kategori Hasil 1 0-8 Tidak Baik (Perlu iterasi) 2 9-16 Baik 3 17-24 Sangat Baik Tabel 4 Tabel kategori penilaian skenario tugas No.  Kategori Penilaian Heuristic Evaluation  Kategori Hasil 1 0-10 Sangat  Tidak  Baik  (Perlu iterasi) 2 11-20 Tidak Baik (Perlu iterasi) 3 21-30 Cukup Baik 4 31-40 Baik 5 41-50 Sangat Baik
Dari kategori penilaian diatas akan dijadikan acuan untuk memberikan nilai  rata—rata  keseluruhan  pada  uji  usabilitas  yang  telah  dilakukan  oleh partisipan.  Nilai  ini  juga  bisa  menjadi  bahan  pertimbangan  untuk  perancang apabila  terdapat  kekurangan  dalam  penilaian  dan  menemukan  titik permasalahan  yang  ditemukan  oleh  partisipan.  Partisipan  akan  di  inisialkan dengan Partisipan 1 (P1), Partisipan 2 (P2), Partisipan 3 (P3). Berikut adalah hasil analisis dari penilaian dari uji usabilitas.

## Tabel 5
Tabel hasil rata-rata penilaian skenario tugas partisipan
No.
Rata-rata Penilaian Poin Penilaian Nilai
P1 P2 P3 1 Mengamati halaman utama. 2 3 3 2 Mengamati rekomendasi kedai kopi mingguan.  3 3 3 3 Mencari preferensi kedai kopi yang ingin dituju melalui filter direktori 3 2 3 4 Menentukan kedai kopi sesuai preferensi yang telah dipilih melalui filter direktori 3 2 2 5 Menentukan dan mencari  informasi dari kedai kopi dari hasil pencarian filter direktori 2 3 3 6 Mengamati burger menu 3 3 3
7 Menentukan dan memilih konten dan fitur yang ada di dalam burger menu 2 3 3 8 Mencari  informasi  yang  telah  tersedia  dari kategori yang dipilih dalam burger menu 2 2 3 Jumlah Skor 20 21 23 Kategori Hasil Penilaian Sangat Baik Sangat Baik Sangat Baik Tabel 6 Tabel hasil rata-rata penilaian uji usabilitas partisipan
No. Rata-rata Penilaian Poin Penilaian Nilai P1 P2 P3 1 Visibility of system status 4 5 5 2 Match between system and the real world 5 4 5 3 User control and freedom 3 4 4 4 Consistency and Standards 4 4 5 5 Error Prevention 2 2 2 6 Recognition rather than recall 4 2 3 7 Flexibility and efficiency of use 5 5 5 8 Aesthetic and Minimalist design 5 5 5 9 Help  users  recognize,  diagnose,  and  recover  from errors 3 5 3 10 Help and documentation 2 3 2 Jumlah Skor 37 34 39 Kategori Hasil Penilaian Baik  Baik  Baik Dari  table  penilaian  yang  telah  dilakukan, prototype dari  perancangan direktori  kedai  kopi  dan café di  Kota  Malang  menunjukkan  penilaian  di kategori sangat baik untuk uji usabilitas skenario tugas dan kategori penilaian baik  untuk  penilaian  10  poin heuristic  evaluation .  Berdasarkan  hasil  ini didapatkan  bahwa  perancangan  ini  dapat  memenuhi  kriteria  dari  kebutuhan pengguna  yakni  pengunjung  kedai  kopi  untuk  mendukung  kegiatan café hopping .

## Kesimpulan
Kopi  dan  Kota  Malang  saling  terkait  dalam  menggambarkan  dinamika  industri kopi  dan  budaya  ngopi  di  perkotaan.  Meskipun  pertumbuhan  ini  menjanjikan,  banyak pelaku dan penikmat kopi merasakan stagnasi dalam industri tersebut. Untuk mengatasi kesulitan dalam mencari kedai kopi dan mendukung fenomena "cafe hopping," penelitian
ini merancang mobile website Direktori Coffee Industri Kota Malang dengan pendekatan design thinking. Temuan lapangan menunjukkan tantangan industri, kesulitan pelaku cafe hopping,  dan  dampak  negatif  dari  penggunaan  sosial  media  sebagai  direktori.  Dengan fokus  pada  kebutuhan  pengguna,  tren  desain,  dan  uji  coba  prototipe,  perancangan  ini bertujuan  memberikan  kontribusi  positif  dalam  mengatasi  masalah  tersebut  dan mendukung perkembangan industri kopi di Kota Malang.

## BIBLIOGRAFI
Aak.(1980): Budidaya Tanaman Kopi. Yogyakarta. Yayasan Kanisius.
Aziz,  A.  (2018):  Coffee  Culture  and  Social  Interaction  in  Malang  City.  Journal  of Indonesian Coffee Studies, 12(3), 215-228.
Bricklin, D. (2018): The Evolution of the World Wide Web: From Directory to Search. In Technology and the Future of Work, 35-50. Routledge .
Bringhurst, Robert (2012): The Elements of Typographic Style. Vancouver: Hartley & Marks Publishers.
Brown, Andy & Jones, Rhia & Crabb, Michael & Sandford, James & Brooks, Matthew &  Armstrong,  Michael  &  Jay,  Caroline.  (2015).  Dynamic  Subtitles:  The  User Experience.
Brown,  D.  (2019): Cross-Platform  UX  Design:  Creating  Consistent  User  Experiences across Devices. O'Reilly Media.
Brown, T. (2008): Design thinking. Harvard Business Review, 86(6), 84-92.
Chaney, D. (1996). Lifestyles: Sebuah Pengantar Komprehensi. Yogyakarta. Percetakan Jalasutra.
Chaney,  D.  (2002):  Lifestyle,  Values,  and  Beliefs:  A  Global  Perspective.  Bloomsbury Academic.
Clark,  J.  A.,  (2015):  Responsive  Web  Design  in  Practice.  1st  penyunt.  Maryland: Rowman & Littlefield.
Danarti dan Najayati, S. (2004): Kopi: Budidaya dan Penanganan Pasca Panen. Penebar Swadaya. Jakarta.
Garrett, J. J., (2011): The Elements of User Experience:  User-Centered  Deisgn for the Web and Beyond, Second Edition. California, Newriders .
Giles, J. (2005): Internet encyclopaedias go head to head. Nature, 438(7070), 900-901.
Hagtvedt, H., & Patrick, V. M. (2018): The Moderating Role of Physical Environments in the Experience of Incongruity. Journal of Consumer Research, 45(1), 174-190.
Hattox, R. S. (1985): Coffee and Coffeehouses: The Origins of a Social Beverage in the Medieval Near East. University of Washington Press.
Hidayat, B. (2021): The Aesthetics of Coffee Shops in Malang City. Coffee Aesthetics Review, 45(2), 120-134.
Hoch, S. J., & Deighton, J. (1989): Managing  what  consumers  learn from experience.
Journal of Marketing, 53(2), 1-20.
ISO. (2019): ISO 9241-210:2019 Ergonomics of human-system: Human-centred design for interactive systems . International Organization for Standardization, 210.
Kare, S. (2010): Icons Speak: Susan Kare on Icon Design. Smashing Magazine.
Kotler, Keller. (2008): Manajemen Pemasaran. Jakarta: Erlangga.
Krug,  S.  (2014): Don't Make  Me  Think,  Revisited:  A  CommonSense  Approach  to  Web Usability. New Riders.
Lupton, E. (2010): Thinking with type: a critical guide for designers, writers, editors, & students. New York: Princteton Architectural Press.
Lidwell, W., Holden, K., & Butler, J. (2010): Universal Principles of Design. Rockport Publishers.
Marcotte, E. (2010): Responsive Web Design. A List Apart.
McQuivey, J. (2013). Digital Disruption: Unleashing the Next Wave of Innovation. Las Vegas: Amazon Publishing
Moskowitz,  M.,  &  Schatzberg,  A.  (2009):  The  Starbucks  Experience:  5  Principles  for
Turning Ordinary into Extraordinary. McGraw-Hill.
Nielsen, J. (1993): Usability Engineering. Academic Press.
Nielsen, J., & Norman, D. (1994): User Interface Directions for the Web . Nielsen Norman Group.
Nielsen,  Jakob.  (1999):  Usability  Evaluation  Methods:  The  Reliability  and  Usage  of Cognitive Walkthrough and Usability Test. Denmark.
Norman, D. (2013): The Design of Everyday Things. Basic Books.
Norman, D. (2004): Emotional Design: Why We Love (or Hate) Everyday Things. Basic Books.
Ogah, C.O. & Obebe, T.O. (2012): Caffeine Content of Cocoa and Coffee Beverages in Lagos, Nigeria, Global Research Publishing, 3 (1), 404- 405.
Park, A.Y, Gretzel.U. (2007): Success Factors for Destination Marketing Web Sites: A Qualitative Meta-Analysis. Journal of Travel Research (SAGE Publications)-Vol. 46, Iss: 1, pp 46-63. doi.org/10.1177/00472875073023
Pendergrast,  M.  (2010): Uncommon  Grounds:  The  History  of  Coffee  and  How  It Transformed Our World. Basic Books.
Pine,  B.  J.,  &  Gilmore,  J.  H.  (1998):  Welcome  to  the  Experience  Economy.  Harvard Business Review, 76(4), 97-105.
Shneiderman, B. (2010): Designing the User Interface: Strategies for Effective Human- Computer Interaction. Pearson.
Smith, A. (2019): The Rise of the Coffee Connoisseur: From Gourmet Beans to Latte Art. Coffee Connoisseur Magazine, 35(4), 42-47.
Smith, J., (2010): The History of Temperate Agroforestry. Organic Research. Center.
Spencer,  Anne  Ross,  (2017):  Epidemiology  as  a  Framework  for  Large-Scale  Mobile Application  Accessibility  Assessment.  In  Proceedings  of  the  19 th International ACM SIGACCESS Conference on Computers and Accessibility (ASSETS ’17). ACM, NewYork, NY, USA, 2–11.
Spiekermann,  Erick.  (2014):  Stop  Stealing  The  Sheep  &  Find  Out  How  Type  Works. United States: Peachpit.
Subandy, Idi Ibrahim. (1997): Ectasy Gaya Hidup: Kebudayaan Pop dalam Masyarakat Komoditas Indonesia. Bandung: Mizan Pustaka
Tschichold, Jan, (1991): The Form of the Book, Hartley & Marks.
Tucker, Catherine M. (2011): Coffee Culture:  Local Experiences,  Global Connections. New York: Routledge, 6-7.
Ward, J., O'Malley, L., & Kovacs, B. (2017): Café Culture: Exploring coffee shop social interaction and implications for design. Proceedings of the 2017 Conference on Designing Interactive Systems, 797-809.
Walter, A. (2011). Designing for Emotion. A Book Apart.
Badan Pusat Statistik Kota Malang. Diperoleh melalui situs internet: https://malangkota.bps.go.id/indicator/16/133/1/jumlah-restoran-rumah-makan- menurut-kecamatan-di-kota-malang.html/. Diakses pada tanggal 13 Juli 2023.
DeMers,  J.  (2014).  The  Ultimate  Guide  To  Article  Directories  And  Their  Benefits.
Forbes.
Gallagher, B. (2020). How to Use Online Business Directories: 25 Tips to Get Results. SCORE.
GSMA.  (2021).  The  Mobile  Economy  2021.  Diperoleh  melalui  situs  internet: https://www.gsma.com/mobileeconomy/.
International Telecommunication Union (ITU). (2021). ICT facts and figures 2020.
Liew, C. (2020). The Difference Between Web Directories and Search Engines.
Nielsen, J. (2016). Mobile Usability.
Nielsen, (2018). Nielsen. Diperoleh melalui situs internet: www.nielsen.com
Pew Research Center. (2021). Mobile Technology and Home Broadband 2021
Copyright holder:
Reyza Dwi Dzulqarnain Kahfi, Irfansyah (2022)

## First publication right:
Syntax Literate: Jurnal Ilmiah Indonesia
This article is licensed under: