Yudi Eko Windarto, Marfuah: Perancangan User Interface Human Resource Cloud Management Software Berbasis Android

## PERANCANGAN USER INTERFACE HUMAN RESOURCE CLOUD MANAGEMENT SOFTWARE BERBASIS ANDROID
1 Yudi Eko Windarto, 2 Marfuah
1 Departemen Teknik Komputer, Fakultas Teknik, Universitas Diponegoro, Jalan Prof Sudharto,SH, Tembalang, Kota Semarang, Jawa Tengah 50275 - Indonesia
2 Prodi Sistem Informasi, Fakultas Komputer, Universitas Universal, Kompleks Maha Vihara Duta Maitreya, Sungai Panas, Batam 29456, Kepulauan Riau - Indonesia Email: yudi@live.undip.ac.id , marfuah916@gmail.com
(Diterima: 19 Juli 2020, direvisi: 5 Agustus  2020, disetujui: 9 September 2020  )

## ABSTRACT
One social company that helps in the development of  IT to help welfare organizations and companies such  as  building  applications  to  develop  IT    and  addressing  social  problems  is  the  Tri-Niche Indonesia company. In addition to IT services the Tri-Niche also develops other innovative projects at home that support the resolution of various social problems through the power of IT by collaborating with  welfare  entities  and  companies.  IT  has  unlimited  potential,  always  advancing  and  developing. One  of  the  things  done  by  Tri-Niche  Indonesia  is  by  preparing  an  application  to  manage  company employee  data  so  that  it is  easier to  make rescue related to  human resources  needed.  The  research objective  was  to  build  a  user  interface  design  for  HR  monitoring  applications. First,  make preparations in the form of identification of problems related to the user interface and data collection techniques using interview techniques. The design stage analyzes the solution and then builds a user interface based on user needs using HRCMS. HRCMS is a graphical display that is used as a liaison between  the  "HRCMS"  Application  and  users.  This  research  builds  user  interfaces  to  animate employee  data  using  Android  HRCMS.  The  results  of  this  study  consist  of  a  simple  User  Interface design based on the principle of User Interface Design as a reference to make it  easier for employees to use applications.
Keywords: android HRCMS, design, mobile application , user interface

## ABSTRAK
Salah  satu  perusahaan  sosial  yang  berfokus  pada  pemanfaatan  kekuatan  teknologi  informasi  untuk membantu  organisasi  kesejahteraan  dan  perusahaan  seperti  membangun  aplikasi  inovatif  untuk menyelesaikan kendala TI serta mengatasi masalah sosial adalah Tri-Niche Indonesia. Selain layanan TI Tri-Niche juga  mengembangkan  proyek  inovatif in-house lainnya  yang  bertujuan  untuk menyelesaikan  berbagai  masalah  sosial  melalui  kekuatan  TI  dengan  berkolaborasi  dengan entitas kesejahteraan dan perusahaan.  TI memiliki potensi yang tidak terbatas, selalu maju dan berkembang. Salah  satu  hal  yang  dilakukan Tri-Niche Indonesia  ialah  mempersiapakan  aplikasi  untuk memanajemen data pegawai perusahaan agar lebih mudah dalam melakukan pemantauan sumber daya manusia  (SDM)  yang  dimiliki.  Penelitian  ini bertujuan  membangun  rancangan user interface terkait aplikasi pemantauan SDM. Pada tahap utama melakukan persiapan berupa identifikasi masalah yang berkaitan dengan user interface dan teknik pengumpulan data dengan melakukan wawancara. Tahap perancangan  melakukan  analisis  solusi  dan  kemudian  membangun user  interface berdasarkan kebutuhan  pengguna  menggunakan  HRCMS. HRCMS ( Human  Resource  Cloud  Management Software )  merupakan  bentuk  tampilan  grafis  yang  digunakan  sebagai  penghubung  antara  Aplikasi “ HRCMS ”  dengan  pengguna.  Penelitian  ini  membangunan User  interface untuk  memantau  data pegawai  menggunakan  Android HRCMS .  Hasil  penelitian    berupa  rancangan User  Interface yang sederhana berdasarkan prinsip User Interface Design sebagai acuan untuk memudahkan para pegawai dalam penggunaan aplikasi.
Kata Kunci: android HRCMs, design, aplikasi mobile, user interface
Yudi Eko Windarto, Marfuah: Perancangan User Interface Human Resource Cloud Management Software Berbasis Android

## 1 PENDAHULUAN
Teknologi  Informasi  memiliki  potensi  yang  tidak  terbatas,  selalu  maju  dan  berkembang. Perkembangan  teknologi  informasi  yang  begitu  pesat  juga  harus  diikuti  dengan  perkembangan perusahaan.  Perusahaan  yang  ingin  maju  dan  terus  berkembang  justru  melihat  perkembangan teknologi informasi yang begitu cepat sebagai peluang  yang  mendukung perkembangan perusahaan. Salah satu perusahaan yang selalu meningkatkan perkembangan perusahaan yaitu Tri-Niche Indonesia yang  berada  di  Kota  Semarang  dengan  tujuan  untuk  mengatasi  masalah  sosial  yang  lebih  besar  di masa depan.
Tri-Niche Indonesi  merupakan  salah  satu  perusahaan  sosial  yang  berfokus  pada  pemanfaatan kekuatan  teknologi  informasi  untuk  membantu  organisasi  kesejahteraan  dan  perusahaan  seperti membangun  aplikasi  inovatif  untuk  menyelesaikan  kendala  teknologi  informasi  serta  mengatasi masalah  sosial.  Perusahaan Tri-Niche juga  mengembangkan  proyek  inovatif in-house lainnya  yang bertujuan untuk menyelesaikan berbagai masalah sosial melalui kekuatan teknologi informasi dengan berkolaborasi dengan entitas kesejahteraan dan perusahaan [1]. Salah satu hal yang dilakukan oleh Tri-Niche Indonesia ialah dengan mempersiapakan aplikasi untuk memanajemen data pegawai perusahaan agar lebih mudah dalam melakukan pemantauan terkait sumber daya manusia yang dimiliki. Adapun beberapa fitur yang terdapat dalam aplikasi data pegawai antara  lain  menampilkan  menu login ,  daftar  kehadiran  pegawai,  detail  informasi  gaji  dan  bonus. Persiapan  aplikasi tersebut  dalam  desain  aplikasi  salah  satu  hal  yang  dilakukan  yaitu  membuat user interface yang  sederhana  berdasarkan  prinsip,  mengingat user  interface memiliki  peran  yang  sangat penting  dalam  efektifitas  sistem  informasi  [2]. User  Interface  Design untuk  memudahkan  para pegawai  dalam  penggunaan  aplikasi  [3].  Dengan  demikian  tujuan  penelitian  ini  yaitu  membangun rancangan user  interface terkait  aplikasi  pemantauan  SDM.  Pada  tahap  utama  melakukan  persiapan berupa  identifikasi  masalah  yang  berkaitan  dengan user  interface dan  teknik  pengumpulan  data dengan  melakukan  wawancara  terhadap  8  (delapan)  orang  pegawai Tri-Naiche Indonesia  termasuk pimpinan  dan  manajer  proyek.  Tahap  perancangan  melakukan  analisis  solusi  dan  kemudian membangun user  interface berdasarkan  kebutuhan  pengguna  menggunakan  HRCMS.  HRCMS ( Human  Resource  Cloud Management  Software )  merupakan  bentuk  tampilan  grafis  yang  digunakan sebagai  penghubung  antara  Aplikasi  “HRCMS”  dengan  pengguna.  Penelitian  sebelumnya  [4] mengenai  kerangka  kerja  evaluasi User Interface (UI)  dan User  eXperience (UX)  untuk  lingkungan pembelajaran  di  bidang  ilmu  komputer  dan  pendidikan  rekayasa  perangkat  lunak,  penelitian  ini menghasilkan  5  (lima)  konsep  dalam  evaluasi  UI/UX  yaitu usability,  utility,  teknology,  users  and context .
Berdasarkan  5  konsep  tersebut dijelaskan  bahwa usability berkaitan  dengan  efektivitas, efisiensi,  dan  kepuasan  pengguna  terhadap  suatu  aplikasi. Utility mengenai  kebergunaan  objek  atau aplikasi.  Kemudian context dalam  proses  pengembangan  aplikasi  yang  berkaitan  dengan  konsep, teknik  dan  pengujian. Users berkaitan  dengan  aktor  atau class pengguna  sistem  sehingga  menjadi penting untuk melibatkan mereka dalam proses evaluasi dan sekaligus menjadi sumber pengumpulan data  untuk  evaluasi.  Kemudian  juga  perlu  dipahami  bahwa  dalam  proses  evaluasi  perlu  memahami bagaimana  peran technology yang  digunakan,  bagaimana  pengguna  belajar  berinteraksi  dengan teknologi, dan bagaimana teknologi dapat memfasilitasi kebutuhan pengguna. Karena proses evaluasi salah  satunya  mementingkan user maka  pada  tahap  awal  persiapan  hingga  pembangunan user interface juga dipandang pelu untuk keterlibatan user secara aktif.

## 2 TINJAUAN PUSTAKA
Penelitian  terdahulu  [5]  mengenai  UI/UX  dengan  metode google  design mengatakan  bahwa berdasarkan google  analytics  website adanya  permasalahan  yang  terjadi  diantaranya  terkait  faktor user interface yang tidak tepat dan menarik. Sehingga penelitian ini dilakukan  untuk menghasilkan user  interface yang  memiliki  keseragaman  baik  dari  segi  warna, font ,  hingga  tata  letak, user experience yang sesuai dengan pengalaman user .
Selanjutnya  penelitian  yang  pernah  ada  mengenai  analisis  desain user  interface dalam  game edukasi [6]. Penelitian ini menempatkan objek peletakan elemen desain dengan pendekatan kualitatif. Dengan  metode  studi  kasus  hasil  penelitian  ini  berupa  kajian  visual  estetik  terhadap  desain user interface yang nantinya digunakan sebagai acuan dalam mendesain user interface game edukatif.
Yudi Eko Windarto, Marfuah: Perancangan User Interface Human Resource Cloud Management Software Berbasis Android
User Interface merupakan bentuk tampilan grafis yang berhubungan langsung dengan pengguna [7][8]. User  Interface berfungsi  untuk  menghubungkan  antara  pengguna  dengan  sistem  operasi, sehingga  komputer  tersebut  bisa  digunakan  [9][10]. User  interface atau  antarmuka  pengguna merupakan  tampilan  berupa  tulisan,  gambar,  petunjuk,  dan  tombol  yang  memungkinkan  pengguna dapat  berinteraksi  dengan  perangkat  lunak  tersebut  [11][12][13].  Pembuatan  antarmuka  pengguna bertujuan  untuk  menjadikan  media  informasi  menjadi  mudah  digunakan  oleh  pengguna,  atau  yang disebut dengan user friendly [14][15]. Istilah user friendly merujuk kepada kemampuan dimana suatu sistem  mudah dioperasikan dan mempunyai sejumlah kemampuan lainnya sehingga pengguna merasa betah dalam mengoperasikan program tersebut [16][17].
Berdasarkan beberapa penelitian terdahulu [5] membangun user interface website yang berfokus pada device  desktop menghasilkan  bentuk branding dengan  pemberian  skema  warna  pada  tampilan. Pemilihan flat  design sebagai  ilustrasi  yang  sesuai  disetiap  elemen  dan  juga  konsistensi layout. Kemudian  dalam  penelitian  [6]  membangun user  interface  game edukatif  berdasarkan  elemen, ilustrasi,  typografi,  audio,  dan  tombol  navigasi.  Pada  tiap  elemen  memiliki  proporsi  tampilan  yang berbeda.  Game edukasi berbasis komputer ukuran elemen navigasi antara 10-20% dari ukuran layar, ukuran tampilan materi  60 – 70%. Sedangkan game mobile Android untuk proporsi navigasi dibuat lebih  besar  yaitu  15  –  25  %  dari  ukuran  layar.  Dengan  demikian  terdapat  perbedaan  yang  harus diperhatikan dalam membangun user interface berbasis android, untuk menangani hal tersebut maka dalam  penelitian  ini  membutuhkan  tampilan  grafis  yang  dapat  menampilkan  secara  detail  mengenai user interface yang dibangun yaitu dengan menggunakan HRCMS.

## 3 METODE PENELITIAN
Metode  dalam  penelitian  ini  berfokus  pada  2  tahap  awal  yaitu  tahap  persiapan  dan  tahap perancangan.  2  tahapan  ini  menghasilkan  rancangan user  interface yang  akan  mempermudah  dalam pembangunan sistem nantinya sebagaimana Gambar 1.
Persiapan Perancangan Pembangunan

## Evaluasi

## Gambar 1. Prosedur Penelitian [18]
Berdasaran  Gambar  1  dapat  dijelaskan  bahwa  pada  tahap  persiapan  dilakukan  identifikasi masalah  yang  berkaitan  dengan user  interface dan  teknik  pengumpulan  data  dengan  melakukan wawancara  terhadap  8  orang  yang  terdiri  dari  pimpinan,  manajer  proyek,  HRD, marketing dan  4 orang programmer Tri-Niche  Indonesia.  Tahap  perancangan  dilakukan  berdasarkan  hasil  yang didapatkan  pada  tahap  persiapan  yang  kemudian  dianalisis  untuk  memetakan  rancangan  solusi user interface yang  akan  dibangun.  Kemudian  pada  tahap  pembangunan  yaitu  melakukan  pembangunan user  interface berdasarkan  kebutuhan  pengguna  yang user  frendly menggunakan  HRCMS.  Tahap evaluasi dilakukan setelah pembangunan user interface maka tahap terakhir yaitu melakukan evaluasi
Yudi Eko Windarto, Marfuah: Perancangan User Interface Human Resource Cloud Management Software Berbasis Android
ulang  dengan  demo user  interface terhadap  para  pengguna  aplikasi  yaitu  para  pegawai  Tri-Niche Indonesia.

## 4 HASIL DAN PEMBAHASAN
User interface aplikasi yang dirancanga berisi fitur diantaranya menampilkan menul login , daftar kehadiran  pegawai,  dan  detail  informasi  gaji  serta  bonus. User  interface aplikasi  HRCMS menghasilkan    bentuk  visual  secara  umum  stuktur  desain user  interface yang  nantinya  diharapkan menjadi  acuan  untuk  menciptakan  desain interface fungsional  untuk  menciptakan  pengalaman pengguna yang baik. Halaman Login sebagaimana Gambar 2.
Gambar 2. Tampilan Halaman Login Gambar 3. Tampilan Halaman Utama
Gambar  2  merupakan  halaman login .  Pengguna  memasukkan username dan password yang dimiliki. Apabila pengguna lupa terhadap username dan atau password maka dapat memanfaat kan fitur forget  password .  Gambar  3  menunjukkan  tampilan  halaman  utama  dimana user dapat  melihat fitur-fitur apa saja yang tersedia dalam aplikasi. Halaman notification sebagaiaman Gambar 4.
Yudi Eko Windarto, Marfuah: Perancangan User Interface Human Resource Cloud Management Software Berbasis Android
Gambar 4. Tampilan Halaman Notification Gambar 5. Tampilan Halaman Inbox Messaging Gambar  4  menunjukkan  tampilan  ketika user memilih  fitur notification .  Apabila user memilih fitur notification .maka akan muncul 3 pilihan, yaitu News Update , Submission Notification , dan Reply to Comments . Pada fitur News Update , pegawai akan menerima pemberitahuan mengenai berita yang baru  saja  dipublikasikan.  Fitur Submission  Notification ,  pegawai  akan  menerima  pemberitahuan apakah  pengajuan  yang  dilakukan  di  terima  atau  di  tolak  oleh  perusahaan.  Pada  fitur Reply  to Comments ,  pegawai  akan  menerima  pemberitahuan  dari user lain  yang  membalas  komentar  status. Halaman Inbox Messaging sebagaiamana Gambar 5 menunjukkan tampilan ketika user memilih fitur Inbox  Messaging .  Apabila user memilih  fitur  tersebut  maka  akan  muncul  daftar  nama  yang  pernah mengirimkan pesan pribadi kepada pemilik akun tersebut. Halaman Obrolan sebagaimana Gambar 6.
Gambar 6. Tampilan Halaman Obrolan
Gambar 7. Tampilan Saat User Memilih Fitur
“Clip”
Gambar  6  menunjukkan  tampilan  ketika user memilih  salah  satu  nama  yang  ada  dalam Inbox Messaging . Apabila user memilih salah satu nama maka akan membuka halaman obrolan. Sedangkan pada  Gambar  7 user akan  mendapatkan  fitur “Clip” digunakan  untuk  membuka  lebih  banyak  lagi
Yudi Eko Windarto, Marfuah: Perancangan User Interface Human Resource Cloud Management Software Berbasis Android
fitur yang disediakan yaitu, Camera digunakan untuk mengambil gambar atau video . Halaman Three Lines sebagaimana  8.
Gambar 8. Tampilan Halaman Ketika User Membuka Fitur Three Lines Gambar 9. Tampilan Halaman Three Lines Ketika Di Scroll Down
Gambar  8  menunjukkan  tampilan  ketika user memilih  fitur Three  Lines yang  berada  di  bagian pojok  kanan  atas.  Apabila user memilih  fitur  tersebut  maka  akan  menggeser  halaman  utama  dan menampilkan fitur  – fitur yang berada di halaman utama dalam sudut pandang samping. Sedangkan Gambar  9  menunjukkan  tampilan  ketika user melakukan scroll  down .  Apabila user melakukan  hal tersebut  maka  akan  menampilkan  fitur  –  fitur  secara  lengkap.  Halaman QR  Barcoden sebagaimana Gambar 10.
Gambar 10. Tampilan Halaman Qr Barcode Gambar 11. Tampilan Halaman News Update
Gambar 10. menunjukkan tampilan ketika user memilih fitur QR Barcode . Apabila user memilih fitur  tersebut  maka  akan  secara  otomatis  mengaktifkan  kamera smartphone .  Fitur QR  Barcode
Yudi Eko Windarto, Marfuah: Perancangan User Interface Human Resource Cloud Management Software Berbasis Android
nantinya  akan  berguna  untuk  mengisi  kehadiran  pegawai.  Gambar  11  menunjukkan  tampilan  ketika user memilih  fitur News  Update .  Apabila user memilih  fitur  tersebut  maka  dapat  melihat  berita  – berita baru atau berita – berita yang terdahulu. Halaman Latest Posts sebagaiamana Gambar 12.
Gambar 12. Tampilan Halaman Latest Posts Gambar 13. Tampilan Halaman To Do List
Gambar 12 menunjukkan tampilan ketika user memilih fitur Latest Post. Apabila user memilih fitur tersebut maka dapat mengganti, memposting, dan membatalkan postingan terbaru atau postingan yang  terdahulu. Gambar 13 menunjukkan tampilan ketika user memilih fitur To Do List . Apabila user memilih fitur tersebut maka dapat  melihat daftar tugas  – tugas pegawai yang telah dibuat dan harus dikerjakan pada suatu rentang waktu. Halaman Progress Box sebagaimana Gambar 14.
Gambar 14. Tampilan Halaman Progress Box
Gambar 15. Tampilan Halaman Leave
Management “ Leave List ”
Yudi Eko Windarto, Marfuah: Perancangan User Interface Human Resource Cloud Management Software Berbasis Android
Gambar 16. Tampilan Halaman View Ketika Status Pending Gambar 17. Tampilan Halaman View Ketika Status Expired
Gambar 14 menunjukkan tampilan ketika user memilih fitur Progress Box . Apabila user memilih fitur  tersebut  maka  dapat  melihat  kemajuan  yang  sudah  dilakukan  secara  detail.  Gambar  15 menunjukkan tampilan ketika user memilih fitur Leave Management bagian “ Leave List ” . Gambar  16  menunjukkan  tampilan  ketika user menekan View  Detail pada  bagian Action . Kemudian  muncul  halaman View .  Pada  halaman  tersebut admin dapat  melihat  rincian  lengkap permohonan cuti. Admin dapat memilih Reject sebagai menolak permohonan user, Approve sebagai menyetujui  permohonan user ,  dan Cancel digunakan  untuk  menutup  halaman view. Gambar  17 menunjukkan  tampilan  ketika user menekan View  Detail pada  bagian Action. Kemudian  muncul halaman View. Apabila memilih nama yang sudah memiliki status Expired, maka hanya muncul detail permohonan yang sudah lama  melakukan permohonan cuti dan telah disetujui oleh admin . Halaman Leave Management “Off List ” sebagaimana Gambar 18.
Gambar 18. Tampilan Halaman Leave Mangement “Off List”
Gambar 19. Tampilan Halaman Leave Mangement “Sick List”
Yudi Eko Windarto, Marfuah: Perancangan User Interface Human Resource Cloud Management Software Berbasis Android
Gambar  18  menunjukkan  tampilan  ketika user memilih  fitur Leave  Management bagian “Off List” . Apabila user memilih fitur tersebut maka dapat melihat daftar – daftar nama yang sudah tidak aktif  bekerja.  Gambar  19  menunjukkan  tampilan  ketika user memilih  fitur Leave  Management bagian “Sick List” . Fitur tersebut untuk melihat daftar – daftar nama yang melakukan permohonan izin sakit. Halaman Reimbursement “Claim List ” sebagaiamana Gambar 20.
Gambar 20. Tampilan Halaman Reimbursement “Claim List”
Gambar 21. Tampilan Halaman Claim Info
Ketika Memilih View Detail
Gambar 22. Tampilan Saat Admin Telah
Melakukan Approve Gambar 23. Tampilan Halaman Reimbursement “Reimbursement List”
Yudi Eko Windarto, Marfuah: Perancangan User Interface Human Resource Cloud Management Software Berbasis Android
Gambar 20 menunjukkan tampilan ketika user memilih fitur Reimbursement bagian “Claim List” . Apabila user memilih  fitur  tersebut  maka  dapat  melihat  daftar  –  daftar  nama  pegawai  yang  ingin melakukan permohonan klaim untuk membeli alat – alat kantor maupun barang lainnya. Admin dapat melihat  nama  pegawai  yang  melakukan  permohonan “Name”.  Claim  Title digunakan  sebagai keterangan  barang  yang  ingin  di  klaim  atau  dibeli. Status digunakan  apabila  permohonan  pegawai tersebut sudah di setujui atau belum di setujui oleh admin. Approve digunakan sebagai status apabila permohonan  pegawai  tersebut  sudah  disetujui  oleh admin ,  dan Pending digunakan  sebagai status apabila pegawai tersebut belum disetujui oleh admin, Claim Date digunakan sebagai waktu pegawai melakukan  permohonan  klaim  barang. Picture digunakan  untuk  gambaran  apa  yang  ingin  di  klaim oleh pegawai tersebut. Description digunakan sebagai keterangan detail barang yang ingin di klaim, dan Action digunakan admin untuk melihat lebih detail informasi permohonan klaim dan menyetujui permohonan.
Gambar  21  menunjukkan  tampilan  ketika admin memilih  fitur View  Detail .  Apabila admin memilih  fitur  tersebut  maka  akan  muncul  detail  informasi  permohonan  klaim  yang  diajukan  oleh pegawai.  Gambar  22  menunjukkan  tampilan  ketika admin melakukan Approve maka Status akan berubah menjadi Approved.
Sedangkan  Gambar  23  menunjukkan  tampilan  ketika user memilih  fitur Reimbursement bagian “Reimbursement List” . Apabila user memilih fitur tersebut maka dapat melihat daftar – daftar nama  pegawai  yang  ingin  melakukan  permohonan  penggantian  biaya. Admin dapat  melihat  nama pegawai yang melakukan permohonan “Name”. Reim Title digunakan sebagai keterangan barang yang ingin biayanya akan diganti. Status digunakan apabila permohonan pegawai tersebut sudah di setujui atau  belum  di  setujui  oleh admin.  Approve digunakan  sebagai status apabila  permohonan  pegawai tersebut sudah disetujui oleh admin , dan Pending digunakan sebagai status apabila pegawai tersebut belum  disetuju  oleh admin.  Reim  Date digunakan  sebagai  waktu  pegawai  melakukan  permohonan penggantian  biaya. Picture digunakan  untuk  gambaran  apa  yang  ingin  biayanya  akan  diganti  oleh pegawai tersebut. Description digunakan sebagai keterangan detail barang yang ingin di ganti biaya, dan Action digunakan admin untuk melihat lebih detail informasi permohonan penggantian biaya dan menyetujui permohonan. Halaman Attendance “Full Time” sebagaiamana Gambar 24.
Gambar 24. Tampilan Halaman Attendance “Full Time” Gambar 25. Tampilan Halaman Edit Attendance Ketika Memilih Edit
Pada  Gambar  24  menunjukkan  tampilan  ketika user memilih  fitur Attendance bagian “Full Time” .  Apabila user memilih  fitur  tersebut  maka  dapat  melihat  daftar  –  daftar  nama  pegawai  yang bekerja  waktu  penuh  dan  kehadiran  pegawai. Date digunakan  sebagai  waktu  yang  tertera  pada kalender. Check In digunakan sebagai waktu ketika pegawai tersebut sudah dating keperusahaan dan
Yudi Eko Windarto, Marfuah: Perancangan User Interface Human Resource Cloud Management Software Berbasis Android
melakukan  absensi. Check  Out digunakan  sebagai  waktu  ketika  pegawai  tersebut  akan  pulang  dan melakukan absensi. Action Edit digunakan admin sebagai perubahan data absensi pegawai dan Action Delete digunakan admin untuk menghapus data absensi pegawai tersebut. Pada  Gambar  25  menunjukkan  tampilan  ketika admin memilih  fitur Edit. Apabila admin memilih fitur tersebut maka akan muncul informasi detail pegawai saat melakukan absensi dan admin dapat  mengubah  data Check  In dan Check  Out pegawai  tersebut.  Halaman Attendance  “Part  Time” sebagaimana Gambar 26.
Gambar 26. Tampilan Halaman Attendance “Part Time”
Gambar 27. Tampilan Halaman Salary “Full Time” Gambar 28.  Tampilan Halaman Update Salary Ketika Memilih Edit Gambar 29. Tampilan Halaman Add New Salary
Gambar  26  menunjukkan  tampilan  ketika user memilih  fitur Attendance bagian “Part  Time” . Apabila user memilih  fitur  tersebut  maka  dapat  melihat  daftar  –  daftar  nama  pegawai  yang  bekerja paruh  waktu  dan  kehadiran  pegawai. Date digunakan  sebagai  waktu  yang  tertera  pada  kalender. Check In digunakan sebagai waktu ketika pegawai tersebut sudah dating keperusahaan dan melakukan absensi. Check  Out digunakan  sebagai  waktu  ketika  pegawai  tersebut  akan  pulang  dan  melakukan
Yudi Eko Windarto, Marfuah: Perancangan User Interface Human Resource Cloud Management Software Berbasis Android
absensi. Action  Edit digunakan admin sebagai  perubahan  data  absensi  pegawai  dan Action  Delete digunakan admin untuk menghapus data absensi pegawai tersebut. Halaman Salary  “Full  Time” pada  Gambar  27  menunjukkan  tampilan  ketika user memilih  fitur Salary bagian  “ Full  Time ”.  Apabila user memilih  fitur  tersebut  maka  dapat  melihat  daftar  –  daftar nama pegawai  yang bekerja penuh waktu. Salary digunakan untuk melihat gaji pegawai yang sudah ditambahkan. Duration of  Work digunakan untuk melihat pegawai  yang bekerja secara penuh. Action Edit digunakan admin sebagai perubahan data gaji pegawai dan Action Delete digunakan admin untuk menghapus  data  pegawai  tersebut.  Pada  Gambar  28  menunjukkan  tampilan  ketika  admin  memilih fitur  Edit.  Apabila  admin  memilih  fitur  tersebut  maka  akan  muncul  informasi  detail  nama  pegawai dan jumlah gaji karyawan. Gambar 29  menunjukkan tampilan ketika admin  memilih fitur Add New Salary.  Apabila  admin  memilih  fitur  tersebut  maka  akan  muncul  Employee  Name  dan  Salary  yang dapat diisi. Halaman Salary “Part Time” sebagaimana Gambar 30.
Gambar 30. Tampilan Halaman Salary “Part Time” Gambar 31. Tampilan Halaman Report Gambar 32. Tampilan Halaman Detail
Employee Ketika Memilih View Detail Gambar 33. Tampilan Halaman Add New Report
Gambar 30 menunjukkan tampilan ketika user memilih fitur Salary bagian “Part Time” . Apabila user memilih  fitur  tersebut  maka  dapat  melihat  daftar  –  daftar  nama  pegawai  yang  bekerja  paruh waktu. Halaman Report Gambar 31 menunjukkan tampilan ketika user memilih fitur Report . Apabila
Yudi Eko Windarto, Marfuah: Perancangan User Interface Human Resource Cloud Management Software Berbasis Android
user memilih fitur tersebut maka dapat melihat daftar  – daftar nama pegawai yang dilaporkan . Start Date digunakan untuk melihat waktu ketika pegawai di laporkan. Salary digunakan untuk melihat gaji pegawai  yang  dilaporkan .  View  Detail digunakan  sebagai  melihat  informasi  secara  detail  pegawai yang dilaporkan dan Action Delete digunakan admin untuk menghapus data pegawai tersebut . Pada Gambar 32 menunjukkan tampilan ketika admin memilih fitur View Detail. Apabila admin memilih fitur tersebut maka akan muncul informasi detail nama pegawai yang dilaporkan. Gambar 33 menunjukkan  tampilan  ketika admin memilih  fitur Add  New  Report .  Apabila admin memilih  fitur tersebut  maka  akan  muncul Name , Start  Date ,  dan Salary yang  dapat  diisi.  Halaman Employee sebagaimana Gambar 34.
Gambar 34. Tampilan Halaman Employee Gambar 35. Tampilan Halaman Detail Employee Ketika Memilih View
Gambar 36. Tampilan Halaman Edit Employee Ketika Memilih Edit
Gambar 37. Tampilan Halaman Welfare “Polling”
Pada  Gambar  34  menunjukkan  tampilan  ketika user memilih  fitur Employee. Apabila user memilih  fitur  tersebut  maka  dapat  melihat  daftar  –  daftar  nama  pegawai. Employee  ID digunakan untuk    mengetahui  nomor  identitas  pegawai. Gender digunakan  untuk  mengetahui  jenis  kelamin pegawai. Position digunakan  untuk  mengetahui  posisi  pegawai  dalam  perusahaan. Birth digunakan untuk  mengetahui  tanggal  lahir  pegawai. Start  Date digunakan  untuk  mengetahui  pertama  kali
Yudi Eko Windarto, Marfuah: Perancangan User Interface Human Resource Cloud Management Software Berbasis Android
pegawai bekerja dalam perusahaan. Salary digunakan untuk  mengetahui gaji yang diterima pegawai dan Action digunakan admin untuk  bertindak.  Gambar  35  menunjukkan  tampilan  ketika admin memilih fitur View. Apabila admin memilih fitur tersebut maka akan muncul informasi detail pegawai yang  dipilih.  Gambar  36  menunjukkan  tampilan  ketika admin memilih  fitur Edit. Apabila admin memilih  fitur  tersebut  maka  akan  muncul  informasi  detail  pegawai  dan admin dapat  merubah  data pegawai yang dipilih.
Halaman Welfare  “Polling” Gambar  37  menunjukkan  tampilan  ketika user memilih  fitur Welfare “Polling”. Apabila user memilih fitur tersebut maka  dapat melihat hasil Votes yang telah dilakukan selama  7  hari  terakhir  dan  dapat  melihat  daftar Polls yang  sudah  pernah  dilakukan .  View  Poll digunakan untuk melihat detail polling yang dilakukan dan Edit Poll digunakan untuk mengubah data polling yang dilakukan . Halaman Welfare “Survey ” sebagaimana Gambar 38.
Gambar 38. Tampilan Halaman Welfare “Survey” Gambar 39. Tampilan Halaman Welfare “Feedback”
Pada  Gambar  38  menunjukkan  tampilan  ketika user memilih  fitur Welfare  “Survey”. Apabila user memilih fitur tersebut maka dapat melihat hasil Survey yang telah dilakukan dan dapat melihat daftar Surveys yang sudah pernah dilakukan. View Survey digunakan untuk melihat detail survey yang dilakukan. Edit  Survey digunakan  untuk  mengubah  data survey yang  dilakukan  dan Delete  Survey digunakan  untuk  menghapus survey yang  dipilih.  Pada  Gambar  39  menunjukkan  halaman Welfare “Feedback ”. Apabila user memilih  fitur tersebut  maka  dapat  melihat  status  pegawai  maupun admin dan dapat membalas maupun menyukai status yang dipilih . Halaman Bonus sebagaimana terlihat pada Gambar 40.
Yudi Eko Windarto, Marfuah: Perancangan User Interface Human Resource Cloud Management Software Berbasis Android
Gambar 40. Tampilan Halaman Bonus Gambar 41. Tampilan Halaman Payment
Pada Gambar 40 menunjukkan tampilan ketika user memilih fitur Bonus. Apabila user memilih fitur  tersebut  maka  dapat  memberikan  upah  tambahan  diluar  gaji  yang  dibayarkan  kepada  pegawai. Pada  Gambar  41  menunjukkan  tampilan  ketika user memilih  fitur Payment. Apabila user memilih fitur  tersebut  maka  dapat  melihat  kegiatan  keuangan  dalam  perusahaan  tersebut,  baik  pada pembayaran keluar maupun dalam perusahaan. Halaman News sebagaimana Gambar 42.
Gambar 42. Tampilan Halaman News Gambar 43. Tampilan Halaman Profile
Yudi Eko Windarto, Marfuah: Perancangan User Interface Human Resource Cloud Management Software Berbasis Android
Gambar 44. Tampilan Halaman Pop Up Edit Profile Gambar 45. Tampilan Halaman Data Manage “Position List”
Pada  Gambar  42  menunjukkan  tampilan  ketika user memilih  fitur Payment. Apabila user memilih fitur tersebut maka dapat membuat berita atau pengumuman di perusahan agar dapatdilihat oleh seluruh karyawan di dalam perusahaan yang akan tampil pada halaman dashboard atau halaman utama  dalam  aplikasi. Gambar  43  menunjukkan  tampilan  ketika user memilih  fitur Profile. Apabila user memilih fitur tersebut makadapat melihat data akun yang sudah diisi saat membuat akun. Pada fitur ini user dapat  melakukan Logout . Gambar  44  menunjukkan  tampilan  ketika user memilih fitur Edit  Profile maka  akan  muncul pop  up apabila user ingin  merubah  data. Halaman Data  Manage “Position  List” sebagaimana  Gambar  45 . Apabila user memilih  fitur  tersebut  maka  dapat  melihat daftar  posisi  pekerjaan  yang  dibutuhkan  oleh  perusahaan. Add  New  Position digunakan  untuk menambahkan  posisi  pekerjaan  yang  dibutuhkan. Edit digunakan  untuk  merubah  nama  posisi pekerjaan  yang  sudah  ada. Delete digunakan  untuk  menghapus  data  nama  posisi  yang  ada  dalam daftar. Tampilan halaman Add New Position sebagaimana Gambar 46.
Gambar 46. Tampilan Halaman Add New
Position
Gambar 47. Tampilan Halaman Update Position
Yudi Eko Windarto, Marfuah: Perancangan User Interface Human Resource Cloud Management Software Berbasis Android
Pada Gambar 46 menunjukkan tampilan ketika admin memilih fitur Add New Position. Apabila admin memilih fitur tersebut maka akan muncul Position Name yang akan ditambahkan. Gambar 47 menunjukkan  tampilan  ketik  a admin memilih  fitur Edit .  Apabila admin memilih  fitur tersebut  maka akan  muncul  halaman Update  Position yang  dimana  berisikan Position  Name yang  dapat  dirubah. Halaman Data Manage “Allowance List” sebagaimana Gambar 48.
Gambar 48. Tampilan Halaman Data Manage “Allowance List” Gambar 49. Tampilan Halaman Data Manage “User List” Gambar 50. Tampilan Halaman Add New User
Gambar 51. Tampilan Halaman Edit User
Gambar  48.  menunjukkan  tampilan  ketika user memilih  fitur Data Manage  “Allowance  List”. Apabila user memilih  fitur  tersebut  maka  dapat  melihat  daftar  tunjangan  yang  didapatkan  pegawai dari perusahaan. Add New Allowance digunakan untuk menambahkan tunjangan baru. Edit digunakan untuk  merubah  nama  tunjangan  yang  sudah  ada. Delete digunakan  untuk  menghapus  data  nama tunjangan yang ada dalam daftar.
Pada  Gambar  49  menunjukkan  tampilan  ketika user memilih  fitur Data  Manage  “User  List”. Apabila user memilih  fitur  tersebut  maka  dapat  melihat  daftar  data admin yang  sudah  terdaftar. Username digunakan  untuk  nama  singkat  yang  diinginkan. Email digunakan  untuk  mengirimkan
Yudi Eko Windarto, Marfuah: Perancangan User Interface Human Resource Cloud Management Software Berbasis Android
pesan  kepada  seluruh  akun  pegawai  yang  sudah  terdaftar. Add  New  User digunakan  untuk menambahkan  data admin baru. Edit digunakan  untuk  merubah  data admin yang  sudah  ada. Delete digunakan  untuk  menghapus  akun admin yang  ada  dalam  daftar. Gambar  50  menunjukkan  tampilan ketika admin memilih fitur Add New User. Apabila admin memilih fitur tersebut maka akan muncul informasi yang dapat diisi oleh admin yang ingin ditambahkan. Gambar 51 menunjukkan tampilan ketika admin memilih fitur Edit. Apabila admin memilih  fitur  tersebut  maka  akan  muncul  halaman Edit  User yang  berisikan  data lengkap admin yang dipilih dan admin lainnya dapat merubah data admin.

## 5 KESIMPULAN
Adapun  kesimpulan  dalam  penelitian  ini  diantaranya,  pembangunun user  interface aplikasi pemantauan data pegawai menggunakan HRCMS menggambarkan secara jelas mengenai fitur sistem. Pembangunan user  interface menggunakan  HRCMS  membantu  dalam  pemenuhan  kebutuhan pengguna  secara  detil. User  interface pemantauan  data  pegawai  yang  dibangun  menggunakan HRCMS  sebagai  pendukung  dalam  pembangunan  aplikasi  yang  nantinya  dapat  digunakan  sebagai acuan. User Interface yang sederhana berdasarkan prinsip User Interface Design dapat memudahkan para pegawai dalam penggunaan aplikasi seperti melakukan pengajuan cuti dengan mudah.

## REFERENSI
[1]  Tri-Niche  Inspiring  Social  Awareness  Throught  IT.  [Online]  Available  at  : https://www.tri- niche.com/id/tentang-kami/ [Diakses 15 8 2020].
[2]  A.  Nurlifa,  S.  Kusumadewi,  dan  Kariyam.,  "Analisis  Pengaruh User  Interface Terhadap Kemudahan Pengunaan Sistem Pendukung Keputusan Seorang Dokter". Prosiding SNATIF (1). 333-340, 2014.
[3]  Y.  Adhipratama,  T.  Sagirani  and  P.  Kartikasari.,  "Perancangan  Antarmuka  Pengguna  Dengan Metode  Lean  Ux  Pada  Website  Hello  Work  Dinas Tenaga  Kerja Kabupaten  Pasuruan," JSIKA , vol. 7, 2018.
[4]  Alomari, H. W., Ramasamy, V., Kiper, J. D., & Potvin, G. (2020). A User Interface (UI) and User eXperience (UX) evaluation framework for cyberlearning environments. Holiyon. 1-18.
[5]  A.  A.  Pratama,  P.  Sudarmaningtyas,  S.  H.  E.  Wulandari.,  "User  Interface/User  Experience Dengan Metode Google Design Sprint Dan A/B Testing Pada Website Startup Qtaaruf," JSIKA Vol. 7, No. 4, 2018
[6]  W.  Wibawanto  and  R.  Nugrahani.,  "Desain  Antarmuka  (User  Interface)  Pada  Game  Edukasi," Jurnal Imajinasi, p. 60, 2018.
[7]  I. Santosa., Interaksi Manusia dan Komputer, Yogyakarta: Andi , 2004.
[8]    A.  Mursyidah,  I.  Aknuranda  and  H.  M.  Az-Zahra.,  "Perancangan  Antarmuka  Pengguna  Sistem Informasi  Prosedur  Pelayanan  Umum  Menggunakan  Metode  Design  Thinking  (Studi  Kasus: Fakultas  Ilmu  Komputer  Universitas  Brawijaya)," Jurnal  Pengembangan  Teknologi  Informasi dan Ilmu Komputer , vol. 3, pp. 3931-3938, 2019
[9]  R.  Layona,  dan  B.  Yulianto,.  "Aplikasi  pencarian  informasi  dan  lokasi  tempat  makan  pada perangkat mobile berbasis android". Jurnal Teknologi dan Sistem Informasi , 2(2), 9-16, 2016.
[10] F.  A.  Handiman,  dan  G.G.  Sembada.,  "Perancangan  User  Interface  Aplikasi  Mobile  Pasar Kampus". eProceedings of Art & Design, 2016.
[11] T.  Chandra.,  "Evaluasi  User  Interface  Desain  Sistem  Informasi  Perpustakaan  Pada  Perguruan Husni Thamrin Medan". Jurnal TIMES, 2015.
[12] B.  Shneiderman  and  C.  Plasant,  Designing  User  Interface,  United  States  of  America:  Pearson Education Inc., 2005.
[13] J.  Preece,  Y.  Rogers  dan  H.  Sharp,  Interaction  Design:  Beyond  Human-Computer  Interaction, Chichester, UK: John Wiley & Sons , 2015.
[14] The U.S. Department of Health and Human Services; The U.S. General Services Administration, Research-Based  Web  Design  &  Usability  Guidelines,  Washington  DC: U.S.  Government Printing Office , 2006.
[15] A. Assila, K. M. d. Oliveira dan H. Ezzedine, “Standardized Usability Questionnaires: Features and Quality Focus,” Electronic Journal of Computer Science and Information Technology, vol. 6,
Yudi Eko Windarto, Marfuah: Perancangan User Interface Human Resource Cloud Management Software Berbasis Android
no. 1, pp. 15-31, 2016.
[16] D.  Chasanidou,  A.  A.  Gasparini  and  E.  Lee,  "Design  Thinking  Methods  and  Tools  for Innovation," in HCI International , Los Angeles, 2015.
[17] G.  Pandusarani,  A.  H.  Brata  dan  E.  M.  A.  Jonemaro,  “Analisis  User  Experience  Pada  Game CS:GO  dengan  Menggunakan  Metode  Cognitive  Walkthrough  dan  Metode  Heuristic Evaluation,” Jurnal  Pengembangan  Teknologi  Informasi  dan  Ilmu  Komputer, vol.  2,  pp.  940- 950, 2018
[18]  Karim,  N.  A.,  Shukur,  Z.,  &  AL-banna  AbedElkarim  M.  (2020). UIPA:  User  authentication method based on user interface preferences for account recovery. Journal of Information Security and Applications. 52, pp 1-14.