## Perancangan UI/UX Design Aplikasi Jasa Fotografi Dengan Design Science Research Methodology
Deden Sukma Hendrawan 1 , Mochzen Gito Resmi 2 , Uus Muhammad Husni Tamyiz 3
1,2,3 Jurusan Teknik Informatika, Sekolah Tinggi Teknologi Wastukancana Jln. Cikopak No. 53 Mulyamekar, Kec. Babakancikao, Sadang, Kabupaten Purwakarta, Jawa Barat
1 dedensukma45@wastukancana.ac.id, 2 mochzen@sttwastukancana.ac.id, 3 uusmt@sttwastukancana.ac.id
Intisari—  Industri  kreatif  seperti  dunia  fotografi  memiliki  warna  tersendiri  dalam  lika-liku  teknis  yang  mempengaruhi berkembangnya dunia fotografi. Banyak unsur pendukung dari sisi alat dan sumber daya manusia yang ikut berperan dalam dunia fotografi, alat-alat yang dibutuhkan seperti kamera, lensa, tripod, lampu, dll. Berdasarkan subjek yang ditampilkan, karya fotografi memiliki  bentuk  yang  berbeda  dan  terklasifikasi  dalam  tiga  subdisiplin,  yaitu  genre  fotografi  komersial,  jurnalistik,  dan  fotografi seni/ekspresi. User Interface (UI) adalah cara program dan pengguna untuk berinteraksi. Istilah user interface terkadang digunakan sebagai  pengganti  istilah  Human  Computer  Interaction  (HCI)  dimana  semua  aspek  dari  interaksi  pengguna  dan  komputer.  User Experience  (UX)  merupakan  persepsi  seseorang  dan  responnya  dari  penggunaan  sebuah  produk,  sistem,  atau  jasa.  User  Experiece (UX) menilai seberapa kepuasan dan kenyamanan seseorang terhadap sebuah produk, sistem, dan jasa. Metode yang digunakan oleh penulis  untuk  merancang  UI/UX  Design  Aplikasi  Reservasi  Fotografi  adalah  Design  Science  Research  Methodology  dengan menggunakan  uji  Heuristic  Evaluation.  Tujuan  penelitian  ini  untuk  merancang  UI/UX  Design  pada  sebuah  aplikasi  reservasi  jasa fotografi  yang  terintegrasi  dengan  aplikasi  mobile  untuk  memudahkan  proses  tersebut  yang  dapat  dipesan  atau  reservasi  terlebih dahulu bagi pelanggan terhadap jasa fotografi. Perangkat lunak yang digunakan untuk merancang UI/UX Design ini adalah aplikasi Figma.
Kata kunci — Fotografi, Design Science Research Methology , Heuristic Evaluation , UI/UX Design , Figma
Abstract—  Creative  industries  such  as  the  world  of  photography  have  their  own  color  in  the  technical  twists  and  turns  that  influence  the development of the world of photography. There are many supporting elements in terms of tools and human resources that play a role in the world  of  photography,  the  tools needed  such as  cameras,  lenses, tripods, lights,  etc. Based  on  the subject  shown, photographic  works  have different  forms  and  are  classified  in  three  subdisciplines,  namely  the genres of  commercial  photography,  journalism,  and  art/expression photography. User  Interface (UI)  is  the  way  programs  and  users  interact. The  term user  interface  is sometimes  used  instead  of the  term Human Computer Interaction (HCI) where all aspects of user and computer interaction. User Experience (UX) is a person's perception and response  from  the  use  of  a  product,  system,  or  service. User  Experiece (UX)  assesses  how  satisfied  and  comfortable  a  person  is  with  a product,  system,  and  service. The  method  used  by  the  author  to  design  the  UI/UX Design of  the  Photography  Reservation  Application  is the Design  Science  Research  Methodology using  the Heuristic  Evaluation test. The  purpose  of  this  study  is  to  design  a  UI/UX Design on  a photography  service  reservation  application  that  is  integrated  with  a mobile application  to  facilitate  the  process  that  can  be  booked  or reserved in advance for customers of photography services. The software used to design this UI/UX Design is a Figma application. Keywords — Photography, Design Science Research Methology, Heuristic Evaluation, UI/UX Design, Figma

## I. P ENDAHULUAN
Pada  era  digital  ini  perkembangan  sistem  teknologi, informasi,  dan  komunikasi  mempunyai  kekuatan  besar  yang mampu  memajukan  kebutuhan  berbagai  macam  industri (Zamroni,  2017).  Industri  kreatif  seperti  dunia  fotografi memiliki  warna  tersendiri  dalam  lika-liku  teknis  yang mempengaruhi berkembangnya dunia fotografi. Banyak unsur pendukung  dari  sisi  alat  dan  sumber  daya  manusia  yang  ikut berperan  dalam  dunia  fotografi,  alat-alat  yang  dibutuhkan seperti  kamera,  lensa,  tripod,  lampu,  dll  (Antopani,  2016). Salah  satu genre fotografi  yang  paling  diminati  adalah  genre seni/ekspresi  yaitu  foto prewedding. Foto prewedding dapat dibuat  bebas  mengikuti  konsep  atau  tanpa  konsep  tertentu (Wijaya, 2019).
Foto prewedding seolah sudah menjadi keharusan sebelum pernikahan,  dan  terus  berkembang  dengan  berbagai  konsep dan  tema.  Foto prewedding yaitu  foto  yang  mempergunakan kostum  dengan  kreasi  dan  aturan  adat  tertentu.  Sehingga dalam  pembuatannya  melibatkan  tata  rias,  tata  busana,  tata
gaya,  fotografer  hingga  pencipta  skenario  atau story  telling (Wijaya, 2019) . Hingga saat ini untuk memesan jasa fotografi masih  dilakukan  dengan  mendatangi  tempat  studio  foto  atau menghubungi  kontak  fotografer  yang  tersedia,  dikarenakan belum  adanya  aplikasi  yang  beredar  di Play  Store dan App Store yang  menyediakan  layanan  jasa  reservasi  fotografi. Tentu  dengan  hal  ini  tidak  efektif,  karena  para  pelanggan harus  datang  ke  studio  foto  hanya  untuk  menentukan  jadwal dan tempat yang tepat dengan fotografer (Amin et al., 2018).
Ketika masyarakat lebih memilih menggunakan smartphone , maka untuk membangun sebuah aplikasi berbasis mobile ,  perlu  memperhatikan  tampilan  antar  muka  ( user interface )  dan  pengalaman  pengguna  ( user  experience ) (Handayani,  2021).  UI/UX Design dibutuhkan  sebagai gerbang utama untuk dibuatnya sebuah program aplikasi, yang merupakan  rancangan  awal  agar  didapatkannya  gambaran perancangan aplikasi yang akan digunakan. User Interface (UI) adalah  cara  program  dan  pengguna  untuk  berinteraksi  (El Ghiffary et al., 2018) .
Menurut  Wiryawan  (2019) User  Experience (UX) merupakan persepsi seseorang dan responnya dari penggunaan sebuah  produk,  sistem,  atau  jasa .  User  Experiece (UX) menilai  seberapa  kepuasan  dan  kenyamanan  seseorang terhadap  sebuah  produk,  sistem,  dan  jasa.  Sebuah  prinsip dalam  membangun  UX  adalah  khalayak  mempunyai kekuasaan  dalam  menentukan  tingkat  kepuasan  sendiri ( costumer rule ). Berdasarkan permasalahan diatas, dibutuhkan perancangan  sebuah  desain  antarmuka  ( user  interface )  dan pengalaman pengguna ( user experience ) pada sebuah aplikasi reservasi jasa fotografi.

## II. M ETODOLOGI P ENELITIAN
Metode  penelitian  yang  digunakan  adalah Design  Science Research  Methodology dan  terdapadat  enam  tahapan  pada metode  ini.  Alur  penelitian  digunakan  sebagai  pedoman penulis  dalam  pelaksanaan  penelitian  ini  agar  hasil  yang dicapai  tidak  menyimpang  dari  tujuan  yang  telah  ditentukan sebelumnya.
Gambar 1.  Metode Penelitian

## A. Problem Identification and Motivation
Proses  identifikasi  spesifikasi  masalah  penelitian  dan mencari  solusi  penyelesaian  untuk  masalah  tersebut.  Dua  hal yang  dilakukan  untuk  mencari  solusi  adalah  berfokus  pada peneliti  dan  pengguna  dalam  penelitian  tersebut,  yang nantinya  akan  mencarikan  solusi  dan  membantu  untuk memahami alasan pemahaman peneliti dari masalah .

## B. Define the Objective for a Solution
Proses untuk menyimpulkan tujuan dari masalah yang ada dan  bagaimana  seharusnya  masalah  tersebut  diselesaikan. Selain tujuan umum seperti kelayakan dan kinerja, pada tahap ini juga disimpulkan mengenai kriteria spesifik apa saja yang harus dipenuhi oleh solusi yang ada untuk permasalahan pada tahap pertama.

## C. Design and Development
Tahapan  untuk  membuat  artefak  yang  memecahkan masalah,  yaitu  membangun  model,  metode  atau  konstruksi dari  sumber  daya  teknis,  sosial,  dan  informasi  di  mana kontribusi  penelitian  tertanam.  Secara  konseptual,  desain artefak  penelitian  dapat  berupa  objek  yang  dirancang  dan didesain oleh peneliti.

## D. Demonstration
Merupakan tahap untuk menunjukkan penggunaan artefak. Membuktikan  bahwa  artefak  berfungsi  untuk  memecahkan satu atau lebih contoh masalah yang ada.

## E. Evaluation
Tahap  evaluasi  untuk  melihat  seberapa  baik  artefak bekerja.  Tahapan  ini  juga  meliputi  pengamatan  dan pengukuran  untuk  mengetahui  seberapa  baik  artefak mendukung  solusi  untuk  masalah  dengan  membandingkan tujuan  dengan  hasil  yang  diamati,  sekaligus  sebagai  bukti bahwa  artefak  tersebut  dapat  menyelesaikan  masalah.  Tahap evaluasi  menggunakan  metode Heuristic  Evaluation untuk mendapatkan hasil yang maksimal.

## III. H ASIL DAN P EMBAHASAN

## A. Identifikasi Masalah
Identifikasi  dan  penentuan  masalah  pada  tahap  ini  yang dihadapi  oleh  pengguna  mengenai  kebutuhan  jasa  reservasi fotografi  akan  disortir  dan  ditentukan  untuk  memahami karakteristik  dari  setiap  masalah-masalah  yang  ada.  Dari setiap list yang sudah ditentukan seperti fitur atau menu akan menjadi prioritas utama dan ada tindak lanjut untuk memenuhi kriteria  yang  akan  dirancang  pada  tahap  berikutnya.  Berikut list dari pain points yang sudah ditentukan:
Berdasarkan  permasalahan  yang  sudah  ditentukan  pada pain points akan  menjadi  patokan  dalam  perancangan  UI/UX Design dan  akan  dikembangkan  kembali  untuk  mendapatkan solusi  yang  tepat  atau  solusi  yang  konkrit  bagi  pengguna. Agar  hasil  yang  diinginkan  dari  perancangan  tersebut  bisa memenuhi kebutuhan pengguna dan menyelesaikan permasalahan yang sudah diproses sebelumnya.
B. Solusi Permasalahan
Berdasarkan  permasalahan  yang  sudah  didefinisikan  dan dikembangkan sesuai kebutuhan dari para pengguna mengenai list pain  points yang  diperlukan  pada  aplikasi  reservasi  jasa fotografi  agar  mendapatkan  hasil  yang  maksimal  serta memenuhi  kebutuhan  reservasi  jasa  fotografi  tersebut  bagi para  pengguna.  Dari  setiap  persamalahan  tersebut  ada  solusi yang  akan  digunakan  untuk  membuat  perancangan  UI/UX Design aplikasi reservasi jasa fotografi berbasis mobile .
Gambar 3. Solution Idea
Solusi dari permasalahan yang sudah didefinisikan yang akan digunakan  sebagai  acuan  untuk  membuat  rancangan  secara menyeluruh  pada  UI/UX Design aplikasi  reservasi  jasa fotografi.  Solusi-solusi  tersebut  untuk  memenuhi  kebutuhan pengguna  dan  meningkatkan  sistem  reservasi  jasa  fotografi agar mendapatkan hasil yang diinginkan dan dari setiap solusi tersebut akan dibuatnya desain yang selaras.
C. User Flow
Gambar 4. User Flow
User  Flow tersebut  merupakan  proses  alur  atau  aktifitas secara  keseluruhan  dan  secara  garis  besar  yang  dimana pengguna  dapat  menggunakan  aplikasi  tersebut.  Pengguna diarahkan  dari  proses  alur  pertama  sampai  proses  alur  akhir untuk  mengakses  semua  fitur  dan menu yang  tersedia  pada aplikasi reservasi jasa fotografi.
D. Wireframe
Wireframe yang  digunakan  adalah wireframe  low-fidelity , yang  dimana  pembuatan  sketsa  atau  kualitas  yang  rendah. Dengan  tujuan  untuk  memberikan  gambaran  saat  pengerjaan berlangsung.  Ketika  sedang  maka  sudah  memikili  acuan  d yang  akan  dibuat.  Ada  beberapa  halaman  yang  terdapat  pada wireframe tersebut, yaitu: 1. Halaman Login
Gambar 5. Wireframe Halaman Login
2. Halaman Beranda
Gambar 6. Wireframe Beranda 3. Halaman Paket Foto

## 4. Halaman Pilih Fotografer
Gambar 8. Wireframe Halaman Pilih Fotografer

## 5. Halaman Tiket
Gambar 9. Wireframe Halaman Tiket
E. User Interface Design
1. Halaman Login
Gambar 10.  UI Design Halaman Login
Hasil  perancangan  desain  antar  muka  mengenai  halaman login  yang  dibuat  untuk  memudahkan  pengguna  saat  masuk ke dalam aplikasi.

## 2. Halaman Beranda
Gambar 11.  UI Design Halaman Beranda
Halaman beranda yang dirancang untuk pengguna agar mendapatkan fitur atau layanan yang dapat membantu dan memberikan  pengalaman  yang  baik  saat  diakses.  Pada halaman  beranda  ini  memiliki  desain  minimalis  dan  tidak terlalu memiliki banyak menu. Karena tujuan dari halaman beranda dirancang  agar menjadi pusat akses pada aplikasi reservasi  jasa  fotografi.  Fitur  yang  disediakan  seperti lokasi, kategori foto, voucher , profile , notifikasi, dan menu halaman tiket yang dapat diakses secara mudah.

## 3. Halaman Paket Foto
Gambar 12.  UI Design Halaman Paket Foto
Pada halaman paket foto pengguna dapat memilih dan  mendapatkan  informasi  yang  berkaitan  dengan  paket foto yang dipilih serta dapat disesuaikan dengan kebutuhan dari  pengguna.  Pada  halaman  ini  memiliki  fitur whislist dan rating agar  pengguna  dapat  mengetahui  ulasan  yang
terdapat  pada  kategori  foto yang  dipilih  sebelumnya.  Dan pengguna  mempunyai  akses  untuk  mengatur  jadwal  yang ingin dipesan.

## 4. Halaman Pilih Fotografer

## Gambar 13.  UI Design Halaman Pilih Fotografer
Halaman pilih fotografer memberikan informasi mengenai fotografer  yang  dapat  dipesan  sesuai  dengan  kebutuhan pengguna.  Dan  dapat  melihat  seputar  hasil  karya  berupa gambar dari setiap fotografer yang disediakan oleh aplikasi.

## 5. Halaman Tiket

## Gambar 14.  UI Design Halaman Tiket
Halaman  tiket  akan  tersedia  jika  pengguna  sudah menyelesaikan  pesanannya  berupa  reservasi  jasa  fotografi yang  lengkap.  Halaman  tiket  mempunyai  informasi  yang meliputi  waktu  dan  tempat  yang  sudah  ditentukan  oleh pengguna  dan  medapatkan  booking  code  sebagai  tanda  bukti pesanan  untuk  pengguna.  Tiket  tersebut  akan update secara berkala sesuai dengan proses sesi foto berlangsung.

## F. Evaluasi
Tahap  evaluasi  akan  diuji   berdasarkan hasil  perancangan yang  berupa  desain  antarmuka  untuk  aplikasi  reservasi  jasa fotografi  menggunakan  sepuluh  penilaian  dengan  skala  1-10 yang terdapat pada uji Heuristic Evaluation.
T ABEL I
UJI HEURISTIC EVALUATION Penilaian Desain Terdapat Nilai Visibility of system status Ya 7 Match between system and the real world Ya 9 User control and freedom Ya 8 Consistency and standards Ya 8 Error prevention Ya 7 Recognition rather than recall Ya 7 Flexibility and efficiency of use Ya 8 Aesthetic and minimalist design Ya 9 Help users recognize, diagnose, and recover from errors Ya 7 Help and documentation Ya 7 IV. K ESIMPULAN
Dalam  perancangan  ui/ux design pada  aplikasi  berbasis mobile , penulis menggunakan metode design science research methodology dan  menggunakan  uji heuristic  evaluation agar perancangan  ui/ux design memiliki  kualitas  yang  baik  dan memiliki  tampilan  yang  menarik  serta  dapat  membantu pengguna  saat  menggunakan  aplikasi  reservasi  jasa  fotografi tersebut.  Perancangan  ui/ux design berbasis mobile ini dirancang  dapat  melakukan  memesan  atau  reservasi  jasa fotografi  sesuai  standar  dan  kebutuhan  pengguna  sehingga pengguna  mendapatkan  layanan  jasa  fotografi  yang  baik  dan mudah. Penggunaan uji heurtistic evaluation dalam perancangan  ui/ux design pada  aplikasi mobile dapat membantu menentukan fitur unggulan yang dapat memudahkan pengguna saat mengakses aplikasi reservasi jasa fotografi  dan  meningkatkan  dari  sisi  pengalaman  pengguna saat menggunakana aplikasi reservasi jasa fotografi.

## R EFERENSI
[1] Amin,  A.  I.,  Darmawan,  E.,  &  Budianto,  H.  (2018).  Implementasi CRM  (Customer  Relationship  Management)  pada  Sistem  Informasi Reservasi  Fotografi  Berbasis  Web  di  Toko  Aini  Photo  Kuningan. Jurnal Sistem Dan Informatika , 9 , 9.
[2] Antopani, T. (2016). Fotografi, Pariwisata, Dan Media Aktualisasi Diri. REKAM:  Jurnal  Fotografi,  Televisi,  Dan  Animasi , 11 (1),  31. https://doi.org/10.24821/rekam.v11i1.1293
[3] Ashila,  G.  (2019).  User  Interface  Heuristic  Evaluation  Pada  Sistem Informasi Nasabah Koperasi Mitra Swadaya PT. Gajah Tunggal.
[4] El  Ghiffary,  M.  N.,  Susanto,  T.  D.,  &  Herdianti,  A.  (2018).  Analisis Komponen  Desain  Layout,  Warna,  dan  Kontrol  Pada  Antarmuka Pengguna  Aplikasi  Mobile  Berdasarkan  Kemudahan  Penggunaan (Studi Kasus: Aplikasi Olride). Jurnal Teknik ITS , Vol. 7 (1), A 143-A 148.
[5] Handayani,  V.  (2021). Design  Science  Research  Methodology (Studi Kasus : MIN 4 Jakarta ) Analisis Dan Perancangan UI/UX Aplikasi E- Learning Berbasis  Gamifikasi  Dengan Design  Science  Research Methodology (Studi  Kasus :  MIN  4  Jakarta). Teknik  Informatika  UIN Jakarta , 197.
[6] Nielsen, J. (1994). 08 Heuristic Evaluatoin . 59.
[7] Pratama,  H.  Y.,  Hanggara, B.  T.,  & Setiawan,  N.  Y.  (2022).  Evaluasi Usability  dengan  Menerapkan  Metode  Heuristic  Evaluation  pada Website Dinas Pendidikan Kota Batu. 6(3), 1350–1359.
[8] Wijaya, A. (2019). Foto Prewedding Bali . 2 , 190–195.
[9] Wiryawan,  M.  B.  (2019).  User  Experience  (Ux)  sebagai  Bagian  dari Pemikiran Desain dalam Pendidikan Tinggi Desain Komunikasi Visual.
Humaniora , 2 (2), 1158. https://doi.org/10.21512/humaniora.v2i2.3166
[10] Zamroni,  M.  (2017).  Perkembangan  Teknologi  Komunikasi  Dan Dampaknya  Terhadap  Kehidupan.  Jurnal  Pendidikan,  X(2),  195– 211.knologi  Komunikasi  Dan  Dampaknya  Terhadap  Kehidupan. Jurnal Pendidikan , X (2), 195–211.