JNATIA Volume 2, Nomor 1, November 2023

Jurnal Nasional Teknologi Informasi dan Aplikasinya

p-ISSN: 2986-3929

Perancangan UI/UX Aplikasi SISAKTI-NG Layanan Sistem Informasi Point SKP Universitas Udayana

Ananda Putraa1, I Wayan Santiyasaa2

aProgram Studi Informatika, Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Udayana, Bali

Jln. Raya Kampus UNUD, Bukit Jimbaran, Kuta Selatan, Badung, 08261, Bali, Indonesia 1[email protected] 2[email protected]

Abstract

SISAKTI-NG is an information system for managing SKP (Satuan Kredit Partisipasi) at Udayana University. Currently, SISAKTI-NG is only available as a web-based application and does not have a mobile version. Based on a survey conducted among several Udayana University students, the author concluded that the website's interface of SISAKTI-NG is unattractive and dull. Therefore, the author is interested in designing the User Interface (UI) and User Experience (UX) for the SISAKTI-NG information system. Through this research, it is hoped that the SISAKTI-NG application can be improved in terms of its visual appearance to become more appealing and modern, meeting the needs and providing a comfortable user experience for Udayana University students. This research adopts prototyping and modeling methods. Based on the survey conducted, the calculation of the usability value of the UI/UX design of the SISAKTI-NG application which was tested using the SUS (System Usability Scale) method obtained an average SUS score of 77.25, NPS value with passive results, Acceptable, adjective value with results good, and the grade gets a B. This research has received positive reviews from SISAKTI-NG users when compared to the previous interface design.

Keywords: System, Information, Udayana, University, UI/UX

  • 1.    Pendahuluan

Universitas Udayana merupakan salah satu perguruan tinggi negeri di Bali yang telah menerapkan sistem teknologi informasi. Universitas Udayana berdiri pada tahun 1962. Salah satu layanan sistem informasi yang ada di Universitas Udayana adalah SISAKTI-NG. Sistem informasi SISAKTI-NG digunakan oleh mahasiswa Universitas Udayana untuk melakukan verfikasi point SKP (Satuan Kredit Partisipasi). Mahasiswa wajib mengumpulkan sejumlah point SKP sebagai syarat lulus dari Universitas Udayana. Dengan adanya SISAKTI-NG mahasiswa dapat mengetahui, mengelola dan memverifikasi point SKP.

SISAKTI-NG saat ini hanya tersedia berbasis web, tidak ada versi mobile. Berdasarkan hasil survey dari beberapa mahasiswa Universitas Udayana penulis menyimpulkan bahwa tampilan dari website SISAKTI-NG kurang menarik dan membosankan. Oleh karena itu penulis tertarik merancang User Interface dan User Experience sistem informasi SISAKTI-NG. Dengan penelitian ini, diharapkan aplikasi SISAKTI-NG dapat diperbaiki dari segi tampilan menjadi lebih menarik dan modern sesuai dengan kebutuhan serta nyaman digunakan oleh mahasiswa Universitas Udayana.

  • 2.    Metode Penelitian

Penelitian ini menggunakan metode Prototyping dan Modeling. Metode ini baik digunakan untuk menyelesaikan masalah yang terjadi antara pengguna serta mampu menganalis masalah yang muncul dari pengguna yang kurang sesuai dengan kebutuhan mereka.

  • 2.1    Prototyping

Model prototype adalah sebuah metode yang mengharuskan pengembang perangkat lunak membuat sebuah mockup berupa model aplikasi, sangat cocok pada kondisi dimana pengguna tidak bisa menyajikan informasi secara jelas mengenai kebutuhan yang sesuai dengan keinginannya [3]. Hasil dari model prototype berupa mockup yang akan menjadi rujukan model desain yang akan digunakan saat melatih, presentasi, penilaian sebuah desain, promosi atau keperluan lain [1].

  • Gambar 1. Metode Protoyping

  • a)    Requirements

Proses prototyping dimulai dengan melakukan pengumpulan data dan analisis terhadap kebutuhan sistem. Tahap ini bertujuan untuk mendefinisikan secara rinci kebutuhan sistem yang akan dikembangkan. Dalam proses pendefinisian ini, dilakukan wawancara terhadap calon pengguna sistem guna memahami kebutuhan dan harapan mereka terhadap sistem yang akan dibuat.

  • b)    Quick Design

Tahap kedua dalam metode prototyping adalah quick design, di mana desain sederhana sistem yang akan dikembangkan dibuat sebagai langkah awal. Namun, desain yang dihasilkan dalam tahap ini tidak mencakup keseluruhan sistem. Tujuan dari tahap ini adalah untuk menggambarkan visualisasi awal dari ide sistem yang akan dieksekusi.

  • c)    Build Prototype

Pada tahap ini, prototipe dibuat secara langsung berdasarkan data dan informasi yang diperoleh dari quick design sebelumnya. Tahap ini melibatkan pembuatan bagian-bagian kecil dari model sistem yang direpresentasikan dalam bentuk prototipe.

  • d)    User Evaluation

Pada tahap ini, prototipe sistem yang telah dibuat disajikan kepada klien untuk dievaluasi. Evaluasi ini penting karena dapat mengidentifikasi kekuatan dan kelemahan dari model prototipe tersebut. Klien memberikan komentar dan saran sebagai hasil dari evaluasi yang akan didiskusikan oleh pengembang sistem.

  • e)    Refining Prototype

Pada tahap penyempurnaan prototipe, apabila pengguna tidak puas atau sistem yang dibuat tidak memenuhi harapan mereka, prototipe akan direvisi sesuai dengan umpan balik dan saran dari pengguna. Tahap ini akan berulang secara iteratif sampai kebutuhan pengguna terpenuhi. Setelah prototipe memenuhi kebutuhan pengguna, sebuah sistem final akan dibangun berdasarkan prototipe yang telah disempurnakan sebelumnya.

  • f)    Implementation and Maintain

Setelah sistem final dibuat berdasarkan prototipe sebelumnya, tahap pengujian akan dilakukan sebelum sistem tersebut dikirim untuk diproduksi. Pengujian bertujuan untuk memastikan bahwa sistem berfungsi dengan baik dan sesuai dengan spesifikasi yang telah ditetapkan. Setelah sistem lulus pengujian, langkah produksi akan dilakukan untuk menghasilkan sistem secara massal. Setelah sistem berada dalam pengoperasian,

perawatan rutin akan dilakukan untuk meminimalkan risiko kegagalan sistem. Perawatan ini melibatkan pemantauan, pemeliharaan, dan pembaruan yang berkala. Dengan menjalankan perawatan rutin yang tepat, sistem dapat beroperasi secara optimal dan mengurangi kemungkinan terjadinya masalah atau kegagalan dalam jangka panjang.

  • 2.2 Modeling

Metode modeling yang digunakan pada penelitian ini adalah UML (Unified Modeling Language). UML adalah suatu metode untuk memvisualisasikan dan mendokumentasikan hasil analisa dan desain dalam memodelkan suatu sistem secara visual [2]. UML dapat memberikan gambaran visual yang memudahkan developer untuk membuat blueprint dalam sebuah bentuk gambaran yang simpel & mudah dipahami sehingga sangat efektif dalam mengomunikasikan desain tersebut.

  • Gambar 2. Use Case Diagram

Pada use case diagram diatas dapat dijelaskan bahwa, ketika login maka otomatis role akan terpilih sesuai dengan yang sudah di daftarkan di sistem, pengguna dapat melakukan penambahan, update, hapus dan mengunduh SKP. Kemudian admin dapat mengakses menu yang dapat memvalidasi SKP pengguna.

  • 2.3 SUS (System Usability Scale)

System Usability Scale (SUS) adalah metode pengukuran kepuasan pengguna terhadap usability suatu sistem. Metode ini digunakan untuk menguji tingkat usability pada sistem dan dilakukan dengan melibatkan pengguna akhir. SUS terdiri dari 10 pertanyaan yang dijawab dengan skala likert 5 poin. Nilai SUS berkisar antara 0-100 dan semakin tinggi nilai SUS maka semakin baik usability suatu sistem[4].

  • a.    Kuesioner SUS

Dalam metode System Usability Scale, terdapat 10 buah pertanyaan. Pertanyaan yang akan diberikan ditampilkan pada tabel. Kuesioner System Usability Scale menggunakan 5-point dengan skala likert. Responden akan memberikan penilaian terhadap pertanyaan berdasarkan skala 1 hingga 5. Skala 5 berarti sangat setuju, sedangkan skala 1 berarti sangat tidak setuju. Pertanyaan yang digunakan pada metode System Usability Scale merupakan pertanyaan yang sudah diatur oleh metode ini sendiri (pertanyaan default).

Tabel 1. Pertanyaan Kuesioner SUS

No

Pertanyaan

1

Saya pikir saya akan sering menggunakan aplikasi ini

2

Saya rasa aplikasi ini seharusnya tidak serumit ini

3

Saya pikir aplikasi ini mudah untuk digunakan

4

Saya pikir saya akan membutuhkan bantuan dari orang teknis untuk dapat menggunakan aplikasi ini

5

Saya menemukan bahwa berbagai fungsi di aplikasi ini terintegrasi dengan baik

6

Saya pikir terlalu banyak inkonsistensi di dalam aplikasi ini

7

Saya rasa kebanyakan orang akan belajar menggunakan aplikasi ini dengan sangat cepat

8

Saya menemukan aplikasi ini sangat susah untuk digunakan

9

Saya merasa sangat percaya diri / nyaman dalam menggunakan aplikasi ini

10

Saya perlu mempelajari banyak hal sebelum saya dapat menggunakan aplikasi ini

  • b.    Menghitung Skor SUS

Berikut merupakan cara untuk menghitung skor System Usability Scale:

  • 1.    Nilai setiap pertanyaan untuk masing – masing responden dihitung dengan mengurangi skor setiap jawaban yang diberikan. Jika tipe pertanyaan tergolong positif, maka skor akan dikurangi dengan angka 1. Jika tipe pertanyaan tergolong negatif, maka skor akan dikurangi dengan angka 5.

  • 2.    Jumlahkan seluruh skor pertanyaan untuk setiap responden.

  • 3.    Total skor dikalikan dengan 2,5 untuk setiap responden.

  • 4.    Skor SUS dari seluruh responden didapat dari rata – rata skor SUS setiap responden.

∑F = 1       ≡r                                                                  (1)

Keterangan:

xi = nilai score responden

n = jumlah responden

  • c.    Interpretasi Skor SUS

Ada lima cara yang dapat digunakan dalam mengintepretasi hasil skor SUS yaitu berdasarkan pada perbandingan peringkat persentil, peringkat, sifat, tingkat penerimaan dan NPS.

Detractor                        Passive Promoter

Acceptable:

Adjective:

Grade:

SUS Score:


Not Acceptable                     Marginal              Acceptable

Worst Imaginable            Poor               OK Good Excellent Best Imaginable

IniiiiiHnmiiiiiIIIiiHir

F    DCBA

I___________________________I___________________________I_____________1_____________I_____________1_____________I_____________1_____________I_____________I_____________I_____________I_____________I___________________________I___________________________I_____________1_____________I

O 10    20    30    40    50    60    70    80    90    100

  • Gambar 3. Skala intepretasi skor SUS

  • 1.    NPS (Net Promoter Score)

Nilai NPS menunjukkan seberapa mungkin pengguna merekomendasikan produk yang diuji. NPS memiliki 3 kategori yakni detractor, passive, dan promoter. Bila bernilai detractor user tidak akan merekomendasikan produk yang diuji malah akan menjelekkan produk yang diuji ke orang lain, bila bernilai passive user tidak akan merekomendasikan produk yang diuji maupun menjelekkan produk yang diuji ke orang lain, bila bernilai promoter user akan merekomendasikan produk yang diuji ke orang lain.

  • 2.    Acceptable

Nilai acceptable menunjukkan seberapa diterima produk yang telah diuji oleh pengguna.

  • 3.    Adjective

Nilai adjective menunjukkan nilai dari sifat produk yang telah diuji oleh pengguna yang terdiri dari worst imaginable, poor, ok, good, excellent dan best imaginable.

  • 4.    Grade

Nilai grade menunjukkan nilai dari sebuah aplikasi yang telah diuji oleh pengguna, direpresentasikan dengan huruf A hingga F.

  • 3.    Hasil dan Pembahasan

Gambar 4. Splashscreen & Login Page

  • 3.1.    Tampilan Splashscreen

Interface yagn menampilkan halaman splashscreen yang muncul ketika user baru membuka aplikasi. Selanjutnya user akan diarahkan pada halaman login.

  • 3.2.    Tampilan Login Page

Pada menu ini, user akan diarahkan untuk login dengan menggunakan akun IMISSU, tahap ini bertujuan untuk mengambil data mahasiswa yang tercatat sebagai mahasiswa aktif di Universitas Udayana.

  • 3.3.    Tampilan User Dashboard

Menu ini berisi data mahasiswa yaitu nama, status dan NIM. Pada menu ini terdapat status PKKMB dan Student day dari mahasiswa tersebut, akan bertuliskan “VALID” jika mahasiswa tersebut sudah memverifikasi sertifikat PKMMB. Terdapat button kelola SKP yang akan mengarahkan mahasiswa ke page kelola SKP.

  • 3.4.    Tampilan Kelola SKP

Menu ini berisi seluruh data SKP yang telah diinput oleh mahasiswa. Terdapat tombol search pada bagian atas yang berfungsi untuk mencari data SKP berdasarkan parameter nama. Tombol sort and filter pada bagian kanan berfungsi untuk mengurutkan data berdasaran parameter yang dipilih. Tombol download pada blok SKP berfungsi untuk mengunduh sertifikat yang telah di input. Tombol delete berfungsi untuk menghapus data SKP yang telah di input. Tombol add berfungsi untuk menambahkan data SKP.



Gambar 5. Dashboard User & Kelola SKP



Gambar 6. Kelola SKP Admin

  • 3.5.    Tampilan Kelola SKP Admin

Menu ini berisi seluruh data SKP yang telah diinput oleh mahasiswa. Terdapat daftar NIM mahasiswa yang telah mengisi form input SKP. Terdapat tombol search pada bagian atas yang berfungsi untuk mencari data SKP berdasarkan parameter nama. Tombol sort and filter pada bagian kanan berfungsi untuk mengurutkan data berdasaran parameter yang dipilih. Tombol download pada blok SKP berfungsi untuk mengunduh sertifikat yang telah di input. Tombol delete berfungsi untuk menghapus data SKP yang telah di input. Tombol add berfungsi untuk menambahkan data SKP. Tombol centang dan silang yang berfungsi untuk memverifikasi SKP.

  • 3.6.    Perhitungan Data Dengan Metode SUS

Setelah menyebarkan kuesioner dan mendapatkan data dari responden maka data tersebut dikumpulkan untuk didapatkan hasil analisis yang setelahnya akan di hitung menggunakan metode SUS. Berikut merupakan contoh dari perhitungan SUS Score:

SUS Score R1 = ((Q1 – 1) + (5 – Q2) + (Q3 – 1) + (5 – Q4) + (Q5 – 1) + (5 – Q6) + (Q7 – 1)

+ (5 – Q8) + (Q9 – 1) + (5 – Q10)) * 2.5

SUS Score R1 = ((4 – 1) + (5 – 3) + (4 – 1) + (5 – 2) + (4 – 1) + (5 – 2) + (5 – 1)

+ (5 – 2) + (4 – 1) + (5 – 2)) * 2.5

SUS Score R1 = 75

Tabel 2. Data responden dan perhitungan SUS Score

Reponden

Q1

Q1

Q1

Q1

Q1

Q1

Q1

Q1

Q1

Q1

SUS Score

R1

4

3

4

2

4

2

5

2

4

2

75

R2

5

1

5

1

5

2

4

2

5

1

92.5

R3

5

2

5

2

5

2

5

2

5

2

87.5

R4

5

2

4

2

4

1

5

1

4

2

85

R5

4

3

4

2

4

2

5

2

4

2

75

R6

3

3

4

2

4

2

4

2

4

4

65

R7

4

3

4

1

3

3

5

2

4

2

72.5

R8

4

1

4

1

4

1

4

1

4

2

85

R9

5

2

4

2

4

2

4

2

3

4

70

R10

4

2

4

3

4

2

4

4

4

3

65

Nilai rata – rata skor SUS                                           77.25

  • 3.7.    Intepretasi Nilai Skor SUS

Tabel 3. Intepretasi nilai skor SUS

Nilai rata – rata skor SUS

NPS   Acceptable Adjective

Grade

77.25

Passive Acceptable Good

B

Berdasarkan intepreatasi nilai skor SUS tersebut maka:

  • a.    NPS = Passive

Nilai NPS bernilai passive maka user tidak akan merekomendasikan aplikasi ini ke orang lain tetapi juga tidak menjelekkan aplikasi ini ke orang lain.

  • b.    Acceptable = Acceptable

Pengguna dapat menerima aplikasi ini.

  • c.    Adjective = Good

Aplikasi ini memiliki sifat yang bernilai baik.

  • d.    Grade = B

Aplikasi ini memiliki nilai B.

  • 4.    Kesimpulan

Berdasarkan pembahasan sebelumnya, penelitian ini menggunakan metode prototyping dimana dalam proses pengembangannya, user akan berperan penuh dalam penentuan desain akhir dari aplikasi ini. Hasil dari penelitian yang dilakukan, perhitungan nilai usability dari rancangan UI/UX aplikasi SISAKTI-NG yang diuji dengan metode SUS (System Usability Scale) mendapatkan nilai rata – rata skor SUS sebesar 77.25, nilai NPS dengan hasil passive, Acceptable, nilai adjective dengan hasil good, serta grade mendapatkan nilai B, sehingga dapat disimpulkan bahwa dengan adanya desain aplikasi ini penulis berharap tampilan SISAKTI-NG dapat diperbarui menjadi lebih modern dan memberikan kemudahan terhadap mahasiswa Universitas Udayana.

Daftar Pustaka

  • [1]    AS, Rosa, and M. Shalahuddin. "Rekayasa Perangkat Lunak Terstruktur dan Berorientasi Objek. Bandung: Informatika." Jurnal Pilar Nusa Mandiri (2015): 28.

  • [2]    Haviluddin, 2011. “Memahami Penggunaan UML (Unified Modeling Language)”. Samarinda: Vol 6 No 1. Februari 2011.

  • [3]   Yurindra. (2017). Software Engineering. Yogyakarta: Deeppublish.

  • [4]    Kaban, E., Brata, K. C. dan Brata, A. H. (2020) “Evaluasi Usability Menggunakan Metode

System Usability Scale (SUS) Dan Discovery Prototyping Pada Aplikasi PLN Mobile (Studi Kasus Pt. PLN)”, Jurnal Pengembangan Teknologi Informasi dan Ilmu Komputer, 4(10), hlm. 3281–3290. Tersedia pada: https://j-ptiik.ub.ac.id/index.php/j-ptiik/article/view/7941.

158