ABSTRAK
Nama : Asfiolitha Wilmarani
Program Studi : Ilmu Komputer
Judul : Pengembangan Variasi, Restrukturisasi, dan Kustomisasi
Antarmuka untuk Front-End Software Product Line pada
Adaptive Information System for Charity Organization
(AISCO)
Pembimbing : Dr. Ade Azurat, S.Kom.
Suci Fadhilah, S.Kom., M.A.
Software Product Line Engineering merupakan paradigma untuk memproduksi perangkat
lunak dengan waktu, usaha, dan biaya yang minimal. Adaptive Information System for
Charity Organization (AISCO) adalah perangkat yang dikembangkan dengan pendekatan
SPLE untuk menghasilkan aplikasi web bagi organisasi sosial. Proses memproduksi apli-
kasi melibatkan sebuah kerangka pengembangan yang bernama Prices-IDE, yaitu sebuah
development framework yang mendukung SPLE. Penelitian terdahulu telah mengem-
bangkan UI Generator yang dapat mentransformasikan diagram IFML (Interaction Flow
Modeling Language) menjadi source code sebuah aplikasi React. Akan tetapi, antarmuka
yang dihasilkan masih sangat sederhana, belum menimbang prinsip desain antarmuka
pengguna, dan belum menggunakan pendekatan SPLE. Terlebih, fitur kustomisasi antar-
muka yang sudah ada belum terintegrasi dengan Prices-IDE. Penelitian ini mengusulkan
variasi komponen antarmuka yang telah diperbarui, serta metode untuk melakukan kus-
tomisasi antarmuka saat runtime. Proses pengembangan melibatkan pembuatan prototipe
dan penyesuaian terhadap UI Generator berdasarkan rancangan yang diusulkan. Aplikasi
yang dihasilkan kemudian dianalisis dan dites dengan functional testing secara manual
oleh penulis menggunakan 16 skenario tes. Audit performa menggunakan Lighthouse
juga dilakukan terhadap aplikasi dari UI Generator versi sebelum dan setelah diperbarui.
Berdasarkan tes dan analisis tersebut, disimpulkan bahwa UI Generator yang diperbarui
dapat menghasilkan aplikasi React yang mempertahankan fungsionalitas yang sudah ada,
mengalami peningkatan dalam performa sebanyak 14%, dan kini memiliki tambahan fitur
kustomisasi UI.
Kata kunci:
Software Product Line Engineering, User Interface Generator, Kustomisasi, Interaction
Flow Modeling Language, Acceleo, ReactJS
|
|