Perbandingan Pengujian Usability pada Penggunaan Thumbnail di Personal Website
Edi Susilo 1 * , Purwandari Nur Tristianingsih 2
1 Teknik Informatika, Fakultas Teknik, Universitas Riau
2 Pengembangan Perangkat Lunak Dan Gim, Fakultas Pendidikan Profesi dan Kompetensi, Universitas Negeri Yogyakarta
1 edi.susilo@lecturer.unri.ac.id *, 2 purwandari.ndari@gmail.com

## Abstract
The personal website is a type of website that can be managed by individuals. In order for a personal website to have an attractive design, it is necessary to consider several factors in its user interface design, one of which is related to thumbnails. Whether thumbnails on content need to be added or not. However, research related to the application of thumbnails, especially on personal websites, has not been found. This study will test personal website designs that use thumbnails on content and personal website designs without using thumbnails. Both are tested using the same tool, namely usability testing. Usability testing uses the SUS questionnaire tool. The SUS questionnaire has 10 questions and will be distributed to 20 respondents for each design. 20 respondents who will test personal website designs that use thumbnails on content and 20 more respondents will test personal website designs without using thumbnails on content. Based on the distribution of questionnaires, the results of testing personal website design by applying thumbnails obtained an average SUS score of 72. While the results of testing personal website design without applying thumbnails obtained an average SUS score of 76. Based on the results of usability testing, the scores obtained are not too different. Both are in the same grade which is C and acceptable. In general, when designing a personal website, you can choose to use thumbnails on the content or not use them. Future research can compare the assessment by testing user experience and both designs. This is to see in terms of attractiveness and aesthetics of personal website design whether there is a difference if applying thumbnails or without thumbnails.
Keywords: comparison, usability testing, SUS, thumbnail, personal website

## Abstrak
Personal website merupakan salah satu jenis website yang bisa dikelola oleh individu. Supaya personal website yang dimiliki bisa  memiliki  desain  yang  menarik,  perlu  mempertimbangan  beberapa  faktor  dalam  desain  antarmuka  penggunanya  salah satunya terkait thumbnail. Apakah thumbnail pada konten perlu ditambahkan atau tidak. Namun penelitian terkait penerapan thumbnail khususnya pada personal website belum ditemukan. Pada penelitian ini akan menguji antara desain personal website yang  menggunakan thumbnail pada  konten  dengan  desain personal  website tanpa  menggunakan thumbnail .  Keduanya dilakukan pengujian menggunakan alat yang sama yaitu pengujian usability . Pengujian usability menggunakan alat kuesioner SUS. Kuesioner SUS memiliki 10 pertanyaan akan dibagikan ke 20 responden untuk setiap desain.  20 responden akan menguji desain personal  website yang  menggunakan thumbnail pada  konten  dan  20  responden  lagi  akan  menguji  desain personal website tanpa  menggunakan thumbnail pada  konten.  Berdasarkan  penyebaran  kuesioner,  hasil  pengujian  desain  personal website dengan menerapkan thumbnail didapatkan skor rata-rata SUS 72. Sedangkan hasil pengujian desain personal website tanpa menerapkan thumbnail didapatkan skor rata-rata SUS 76. Berdasarkan hasil pengujian usability skor yang didapat tidak terlalu berbeda.  Keduanya  berada di grade yang  sama yaitu  C dan dapat  diterima.  Secara  umum, saat  mendesain personal website  bisa  memilih  menggunakan  thumbnail pada  konten  atau  tidak  menggunakannya.  Penelitian  selanjutnya  bisa membanding penilaian dengan menguji user experience dan kedua desain. Hal ini untuk melihat dari sisi daya tarik dan estetik desain website personal apakah ada perbedaan jika menerapkan thumbnail atau tanpa thumbnail.
Kata kunci: perbandingan, pengujian usability , SUS, thumbnail , personal website
©This work is licensed under a Creative Commons Attribution - ShareAlike 4.0 International License

## 1. Pendahuluan
Personal  website merupakan  salah  satu  jenis website yang  bisa  dimliki  dan  dikelola  oleh  individu  yang sifatnya  pribadi  [1].  Konten  yang  disajikan  pada personal  website bisa  beragam,  seperti  kehidupan pribadi maupun terkait profesi yang dijalani, atau bisa juga  menunjukan  portofolio,  pengalaman  kerja, pencapaian/prestasi  dan  lainnya  [2][1]. Personal website sangat  cocok  digunakan  untuk personal branding , yaitu upaya untuk memasarkan diri melalui karya  yang  akan  jadi  nilai  yang  berharga  [3].  Jika dirancang dengan menarik, situs personal website bisa menjadi sumber yang kaya akan  informasi [4].
Supaya personal  website yang  dimiliki  bisa  memiliki desain  yang  menarik,  perlu  mempertimbangan beberapa faktor dalam desain antarmuka penggunanya. Seperti menerapkan Veen’s Design principles , dimana desain wesbite harus  memiliki header ,  navigasi,  dan konten didalamnya [5]. Kemudian saat mendesain bisa juga  meletakkan sidebar pada  sebelah  kanan  untuk mengoptimalkan  desain personal  website .  Pemilihan warna juga perlu mempertimbangan, agar warna yang diterapkan pada personal website menarik dan nyaman saat digunakan pengguna.
Salah  satu  bagian  dari  desain personal  website yang perlu  dipertimbangkan  adalah  penggunaan thumbnail
pada  konten  yang  akan  disajikan. Thumbnail merupakan representasi berupa gambar atau video yang berfungsi sebagai pratijau yang bersifat menarik calon penonton  atau  pengguna  [6].  Penerapan  thumbnail khususnya  untuk  konten video di YouTube menjadi bagian  penting,  tujuannya  agar  menarik  perhatian sebanyak  mungkin  pada video [7].  Namun  penelitian terkait penerapan thumbnail khususnya pada personal website belum  ditemukan.  Apakah  penggunaan thumbnail pada  konten  perlu  dilakukan  atau  tidak terutama jika mempertimbangan penilaian usability .
Usability adalah  atribut  kualitas  yang  bisa  digunakan untuk  membantu  menentukan  efisiensi,  tingkat efektivitas,  dan  kepuasan  pengguna  saat  pengguna berinteraksi  dengan  aplikasi  [5].  Selain  itu usability juga  bisa  dikatakan  sebagai  salah  satu  kunci keberhasilan  atau  bisa  dijadikan  sebagai  syarat penerimaan  pengguna  terhadap  aplikasi  [8].  Hasil penilaian usability dianggap  dapat  mengukur  sejauh mana sebuah aplikasi atau sistem yang sudah dirancang dapat digunakan dengan mudah oleh penggunanya [9]. Mempertimbangan beberapa hal di atas, perlu rasanya melakukan penelitian terkait penerapan thumbnail pada personal  website apakah  berpengaruh  atau  tidak dengan membandingan hasil penilaian usability .
Oleh  karena  itu,  pada  penelitian  ini  penulis  akan menguji antara penggunaan thumbnail pada konten dan tanpa penggunaan thumbnail pada konten di personal website . Keduanya dilakukan pengujian menggunakan alat  yang  sama  yaitu  penilaian usability dan  hasilnya akan  dibandingkan  untuk  melihat  mana  yang  lebih baik.  Hasil  dari  penelitian  ini  harapannya  dapat membantu saat melakukan desain antarmuka pengguna pada personal website .  Apakah  lebih  baik  membuat desain personal website tanpa menggunakan thumbnail pada  konten  atau  memilih  membuat  desain personal website yang menggunakan thumbnail pada konten.

## 2. Metode Penelitian
Pada penelitian ini akan membandingan hasil penilaian usability antara  desain personal  website tanpa menggunakan thumbnail pada  konten  seperti  pada Gambar  1  dan  desain personal website yang menggunakan thumbnail pada  konten  seperti  pada Gambar 2. Pengujian usability akan menggunakan alat uji berbentuk kuesioner atau pertanyaan yang diajukan kepada  pengguna  setelah  menggunakan personal website.
Saat  ini  terdapat  banyak  alat  uji  kuesioner usability yang ada, beberapa yang populer seperti alat uji system usability scale (SUS), questionnaire for user interface satisfaction (QUIS), computer  system  usability questionnaire (CSUQ),  dan adapted from  microsoft’s product  reaction  cards (Words)  [10].  Dari  beberapa alat  uji usability ,  maka  perlu  milih  satu  yang  terbaik. Alat uji usability yang akan digunakan pada penelitian ini adalah SUS. Hal ini mengacu pada penelitian [10],
bahwa  SUS  merupakan  alat  uji usability yang  paling dapat di andalkan dan juga sederhana penggunaannya.
Alat  uji  SUS  dikembangkan  oleh John  Brooke pada tahun  1986  [11].  Alat  uji  SUS  berbentuk  kuesioner yang memiliki 10 pertanyaan seperti pada Tabel 1 [11]. SUS memiliki 5 pilihan jawaban berupaka skala likert yang terdiri dari mulai dari sangat tidak setuju dengan skor  1,  tidak  setuju  dengan  skor  2,  ragu-ragu  dengan skor 3, setuju dengan skor 4 dan sangat setuju dengan skor 5 [12]. SUS memiliki rentang skor minimal 0 dan maksimal 100 [13][12].
Gambar 1. Personal Website tanpa Thumbnail
Gambar 2. Personal Website dengan Thumbnail
Tabel  1. Item pertanyaan kuesioner SUS berbahasa Indonesia [11]
No Item Pertanyaan 1 Saya berpikir akan menggunakan sistem ini lagi 2 Saya merasa sistem ini rumit untuk digunakan.
3 Saya merasa sistem ini mudah digunakan.
4 Saya membutuhkan bantuan dari orang lain atau teknisi dalam menggunakan sistem ini.
5 Saya  merasa  fitur-fitur  sistem  ini  berjalan  dengan semestinya.
6 Saya merasa ada banyak hal yang tidak konsisten (tidak serasi pada sistem ini).
7 Saya  merasa  orang  lain  akan  memahami  cara menggunakan sistem ini dengan cepat. 8 Saya merasa sistem ini membingungkan.
9 Saya  merasa  tidak  ada  hambatan  dalam  menggunakan sistem ini.
10 Saya  perlu  membiasakan  diri  terlebih  dahulu  sebelum menggunakan sistem ini.
Gambar 3. Alur Pengambilan Data SUS
Gambar 4. Dasar Penilaian Skor SUS [12]
Kuesioner SUS nantinya akan dibagikan ke responden atau  pengguna.  Responden  yang  mengisi  kuesioner SUS  diambil  sampel  dari  mahasiswa.  Jumlah responden  adalah  20  mahasiswa  untuk  setiap  desain. Hal  ini  mengacu  berdasarkan  penelitian  [14],  bahwa dengan  20  responden  permasalahan  pengujian  sudah mendekati  peningkatan  tingkat  kepastian  yang  tinggi. 20  responden  akan  menguji  desain personal  website
yang  tanpa  menggunakan thumbnail pada  konten  dan 20  responden  lagi  akan  menguji  desain personal website yang  menggunakan thumbnail pada  konten. Alur  pengambilan  data  SUS  seperti  ditunjukkan pada Gambar 3.
Data hasil pengujian  dari  20 responden yang menguji desain personal website tanpa menggunakan thumbnail pada konten dan hasil data 20 responden yang menguji desain personal website yang menggunakan thumbnail pada  konten  berdasarkan  alur  pada  Gambar  3  akan dihitung  juga  menggunakan  perhitungan  seperti  pada Rumus 1.
𝑥̅ = ∑ 𝑥 𝑛 (1)
Dengan 𝑥̅ merupakan  skor  rata-rata, ∑ 𝑥 merupakan jumlah skor SUS, dan 𝑛 merupakan jumlah responden. Kemudian  hasil 𝑥̅ masing-masing  desain  personal website dicocokkan  dengan  skala  penilaian  skor  SUS seperti  pada  Gambar  4  untuk  melihat  masuk  kategori yang mana.

## 3.   Hasil dan Pembahasan
Hasil  data  pengujian  menggunakan  kuesioner  SUS yang  dibagikan  ke  responden.  kemudian  dihitung dengan  Rumus  1.  Data  hasil  perhitungan  dari  20 responden yang menguji desain personal website yang menggunakan thumbnail pada  konten  ditunjukkan seperti pada Tabel 2. Kemudian data hasil perhitungan dari  20  responden  yang  berbeda  dari  sebelumnya menguji  desain personal  website yang  tanpa menggunakan thumbnail pada  konten  ditunjukkan seperti pada Tabel 3.
Tabel  2. Hasil Penilaian Personal Website dengan Thumbnail
Responden Pekerjaan Skor SUS 1 Mahasiswa 63 2 Mahasiswa 73 3 Mahasiswa 73 4 Mahasiswa 75 5 Mahasiswa 88 6 Mahasiswa 68 7 Mahasiswa 65 8 Mahasiswa 88 9 Mahasiswa 60 10 Mahasiswa 63 11 Mahasiswa 93 12 Mahasiswa 63 13 Mahasiswa 60 14 Mahasiswa 80 15 Mahasiswa 85 16 Mahasiswa 63 17 Mahasiswa 78 18 Mahasiswa 65 19 Mahasiswa 70 20 Mahasiswa 70 Skor rata-rata 72
Tabel 3. Hasil Penilaian Personal Website tanpa Thumbnail Responden Pekerjaan Skor SUS 1 Mahasiswa 85 2 Mahasiswa 68 3 Mahasiswa 85 4 Mahasiswa 73 5 Mahasiswa 83 6 Mahasiswa 75 7 Mahasiswa 85 8 Mahasiswa 93 9 Mahasiswa 65 10 Mahasiswa 70 11 Mahasiswa 65 12 Mahasiswa 78 13 Mahasiswa 75 14 Mahasiswa 70 15 Mahasiswa 75 16 Mahasiswa 75 17 Mahasiswa 55 18 Mahasiswa 80 19 Mahasiswa 73 20 Mahasiswa 88 Skor rata-rata 76
Gambar 5. Grafik Perbandingan Skor SUS 0 5 10 15 20 25 30 35 40 45 50 55 60 65 70 75 80 85 90 95 100 Dengan Thumbnail Tanpa Thumbnail

## Perbandingan Skor SUS
Dengan Thumbnail Tanpa Thumbnail
Dari  Tabel  2  yaitu  menguji personal  website dengan menerapkan thumbnail didapatkan  hasil  pengujian menggunakan  SUS  dengan  skor  rata-rata  72.  Tabel  3 yaitu  menguji personal  website dengan  tanpa menerapkan thumbnail didapatkan  hasil  pengujian menggunakan SUS dengan skor rata-rata 76.
Jika melihat Gambar 3, maka hasil penilaian usability antara personal website dengan menerapkan thumbnail atau tanpa thumbnail berada di gr a de yang sama yaitu C  dan  dapat  diterima. Personal  website tanpa thumbnail ternyata  lebih  unggul  walaupun  hanya  4 poin.  Berdasarkan  hasil  penilaian  skor  SUS,  ternyata antara personal website menggunakan thumbnail dengan personal website tanpa thumbnail tidak memiliki perbedaan yang besar seperti pada Gambar 5. Agar  lebih  jelas  lagi,  perlu  juga  melihat  detail  data perbandingan rata-rata pilihan jawaban kuesioner SUS seperti ditunjukkan pada Gambar 6 dan Tabel 4.
Tabel 4. Data Perbandingan Rata-rata Pilihan Jawaban SUS
No Item Pertanyaan Dengan Thumbnail Tanpa Thumbnail 1 Saya berpikir akan menggunakan sistem ini lagi 4,15 4,15 2 Saya merasa sistem ini rumit untuk digunakan. 2,15 2 3 Saya merasa sistem ini mudah digunakan. 4,15 4,25 4 Saya membutuhkan bantuan dari orang lain atau teknisi dalam menggunakan sistem ini. 2,4 2,05 5 Saya merasa fitur- fitur sistem ini berjalan dengan semestinya. 4,15 4,3 6 Saya merasa ada banyak hal yang tidak konsisten (tidak serasi pada sistem ini). 2,05 2,05 7 Saya merasa orang lain akan memahami cara menggunakan sistem ini dengan cepat. 3,8 4,2 8 Saya merasa sistem ini membingungkan. 1,95 1,85 9 Saya merasa tidak ada hambatan dalam menggunakan sistem ini. 4 3,95 10 Saya perlu membiasakan diri terlebih dahulu
sebelum menggunakan sistem ini. 2,95 2,65
Berdasarkan pada Gambar 5 dan Tabel 4, tenyata rata- rata  pilihan  jawaban  antara personal  website yang desainnya  menggunakan thumbnail dengan personal website tanpa  menggunakan thumbnail memiliki kemiripan.  Secara  sederhana  bisa  disimpulkan  bahwa menggunakan thumbnail atau  tidak  hasilnya  tidak memiliki  perbedaan  jika  melihat  hasil  penilaian usability . Bahkan desain yang menggunakan thumbnail memiliki lebih rendah skor SUS dibanding desain tanpa menggunakan thumbnail .
Kenapa  desain  yang  menggunakan thumbnail atau tanpa thumbnail hasilnya  sama  saja  untuk personal website ?  Hal  ini  bisa  terjadi  jika  dilihat  dari  definisi usability sendiri  merupakan  atribut  kualitas  yang fokusnya untuk menentukan efisiensi, tingkat efektivitas,  dan  kepuasan  pengguna  saat  pengguna berinteraksi  dengan  aplikasi  [5].  Selain  itu  juga  bisa dilihat dari item pertanyaan kuesioner SUS pada Tabel
0 0,5 1 1,5 2 2,5 3 3,5 4 4,5 5 1 2 3 4 5 6 7 8 9 10 R ata -r ata P il ih an J aw aba n Item Pertanyaan Perbandingan Rata-rata Pilihan Jawaban SUS Dengan Thumbnail Tanpa Thumbnail
1,  yang  mana  penilaian usability hanya  menitik beratkan  pada  kemudahan  penggunaan  aplikasi  saja. Daya tarik dan estetik dari desain antarmuka pengguna memang  tidak  ditanyakan  pada  pengujian usability . Selain  itu,  saat  mengakses website yang  perlu diperhatikan  adalah  kecepatan  aksesnya. Personal website yang  tidak  menggunakan thumbnail pada kontennya  seperti  pada  Gambar  1  tentuk  akan  lebih ringan dan cepat saat diakses. Berbeda dengan personal website yang  menggunakan thumbnail di  kontennya seperti  Gambar  2, website butuh  waktu  untuk menampilkan file gambar.  Jadi  jika  melihat  dari kecepatan akses personal website tanpa thumbnail akan lebih cepat diakses dibandingan personal website yang menggunakan thumbnail .

## 4.   Kesimpulan
Berdasarkan  penelitian  ini  didapatkan  kesimpulan, antara lain:
1. Hasil  penilaian usability pada  desain  personal website yang  menggunakan thumbnail dengan desain personal website yang tanpa menggunakan thumbnail pada konten tidak terlalu berbeda.
2. Berdasarkan  penilaian  masing-masing  desain mendapatkan skor SUS 72 dan 76.
3. Berdasarkan  skor  yang  didapatkan  hanya  ada perbedaan 4 poin, dimana desain yang menggunakan thumbnail lebih  rendah  skor  SUS dibanding desain tanpa menggunakan thumbnail .
4. Berdasarkan  Gambar  4,  Skor  rata-rata  keduanya juga berada di grade yang sama yaitu C dan dapat diterima.
5. Dari  hasil  penilaian,  saat  mendesain personal website bisa  saja  menambahkan thumbnail pada konten atau tidak karena tidak ada perbedaan dari keduanya  karena  secara  penialain usability sama saja.
6. Penelitian selanjutnya bisa membanding penilaian dengan menguji user experience dan kedua desain.
Untuk  melihat  dari  sisi  daya  tarik  dan  estetik desain website personal apakah ada perbedaan jika menerapkan thumbnail atau tanpa thumbnail .

## Daftar Rujukan
[1] N. S. Wiratama, “Manfaat Personal Website sebagai Media Pembelajaran  Sejarah,” J.  Mhs.  Sej.  Univ.  Nusant.  PGRI Kediri, Indones. , vol. 7, no. 2, pp. 33–39, 2022, [Online]. Available: http://journal.ummat.ac.id/index.php/historis.
[2] D.  Ridha  Dwiki  Putri,  M.  Reza  Fahlevi, M.  Iqbal  Novan Anshori, and U. Potensi Utama, “Pengembangan Personal Website  Untuk  Meningkatkan  Digital  Profile  Sebagai Personal  Branding  Berbasis  Android  Personal  Website Development  To  Improve  Digital  Profile  As  Android- Based  Personal  Branding,” Publidimas ,  vol.  2,  no.  1,  p. 138, 2022.
[3] N. Guswarni, A. Louis EdwardV, and P. Sistem Informasi -UIN  Sulthan  Thaha  Saifuddin  Jambi,  “Model  Website Personal  Branding  Dosen  Sebagai  Ruang  Karya  Ilmiah Dan Media Pembelajaran Digital,” J. Sist. Inf. Robot. , vol. 6,  no.  1,  pp.  20–25,  2022,  [Online].  Available: https://recursive.id/.
[4] B.  Marcus,  F.  MacHilek,  and  A.  Schütz,  “Personality  in cyberspace:  Personal  Web  sites  as  media  for  personality expressions and impressions,” J. Pers. Soc. Psychol. , vol. 90,  no.  6,  pp.  1014–1031,  2006,  doi:  10.1037/0022- 3514.90.6.1014.
[5] E. Susilo, S. Nasution, and R. R. Andhi, “Pilihan Terbaik Sidebar  Kanan  atau  Sidebar  Kiri  untuk  Personal  Website berdasarkan Usability,” IT J. Res. Dev. , vol. 4, no. 2, 2020.
[6] W.  Widyasari,  “Analisis  Thumbnail  Video  dalam Meningkatkan  Retensi  Pengguna  Youtube  Melalui Pendekatan  Desain  Grafis  yang  Inovatif,” SENIMAN  J. Publ. Desain Komun. Vis. , vol. 1, no. 2, pp. 309–321, 2023, doi: 10.59581/seniman-widyakarya.v1i2.1854.
[7] I. B. K. T. I Made Mardawa Pradnya Ananda , Alit Kumala Dewi, “Desain Thumbnail Pada Konten Video Youtube Di Ricsnt Production,” Amari J. Desain Komun. Vis. , vol. 4, no. 2, pp. 145–153, 2023.
[8] E. Susilo, F. D. Wijaya, and R. Hartanto, “Perancangan dan Evaluasi  User  Interface  Aplikasi  Smart  Grid  Berbasis Mobile Application,” J. Nas. Tek. Elektro dan Teknol. Inf. , vol. 7, no. 2, pp. 150–157, 2018, doi: 10.22146/jnteti.v7i2.416.
[9] Putri Balkis and N. Oktaviani, “Re-Design User Interface Website  PT.  Gozco  Menggunakan  Design  Thinking,” J. Fasilkom ,  vol.  13,  no.  02,  pp.  214–224,  2023,  doi: 10.37859/jf.v13i02.5528.
[10] T.  S.  Tullis  and  J.  N.  Stetson,  “A  Comparison  of Questionnaires for Assessing Website Usability
ABSTRACT : Introduction,” Usability Prof. Assoc. Conf. , pp. 1–12, 2004, [Online]. Available: http://home.comcast.net/~tomtullis/publications/UPA200 4TullisStetson.pdf.
[11] Z. Sharfina and H. B. Santoso, “An Indonesian adaptation of the System Usability Scale (SUS),” 2016 Int. Conf. Adv. Comput. Sci. Inf. Syst. ICACSIS 2016 , pp. 145–148, 2017, doi: 10.1109/ICACSIS.2016.7872776.
[12] A. Bangor, P. Kortum, and J. Miller, “Determining what individual SUS scores mean; adding an adjective rating,” J. usability Stud. , vol. 4, no. 3, pp. 114–23, 2009.
[13] Muhammad  Fiqri  Widiyantoro,  Taufik  Ridwan,  N. Heryana,  A.  Voutama,  and  Siska,  “Perancangan  UI/UX Prototype Aplikasi Dompet Digital Menggunakan Metode Design Thinking,” J.  Fasilkom ,  vol.  13,  no.  02,  pp.  121– 131, 2023, doi: 10.37859/jf.v13i02.5265.
[14] L. Faulkner, “Beyond the five-user assumption: Benefits of increased  sample  sizes  in  usability  testing,” Behav.  Res. Methods,  Instruments,  Comput. ,  vol.  35,  no.  3,  pp.  379– 383, 2003, doi: 10.3758/BF03195514.