Penerapan Tailwind CSS Dalam Pengembangan User Interface Website Di Poltekpar Palembang

Rendy Al  Benz; Gusmelia Testiana

doi:10.31004/riggs.v4i4.4431

Authors

Rendy Al Benz Universitas Islam Negeri Raden Fatah Palembang
Gusmelia Testiana Universitas Islam Negeri Raden Fatah Palembang

DOI:

https://doi.org/10.31004/riggs.v4i4.4431

Keywords:

Frontend, Perancangan Antarmuka, Desain Responsif, User Interface

Abstract

Pengembangan antarmuka pengguna merupakan salah satu aspek krusial dalam pembangunan sistem informasi berbasis web, khususnya pada website institusi pendidikan yang berfungsi sebagai media komunikasi dan penyampaian informasi kepada publik. Website tidak hanya dituntut untuk menampilkan informasi secara lengkap, tetapi juga harus memiliki tampilan yang menarik, konsisten, responsif, serta mudah digunakan oleh berbagai kalangan pengguna. Kegiatan magang ini bertujuan untuk melakukan perancangan dan implementasi antarmuka (frontend) pada website resmi Politeknik Pariwisata Palembang sebagai upaya peningkatan kualitas tampilan dan pengalaman pengguna. Metode yang digunakan dalam kegiatan ini adalah Research and Development (R&D), yang mencakup tahapan analisis kebutuhan, observasi, wawancara, studi literatur, perancangan antarmuka, implementasi sistem, serta evaluasi hasil pengembangan. Observasi dan wawancara dilakukan untuk memahami kebutuhan pengguna serta kendala pada website sebelumnya, sementara studi literatur digunakan untuk memperkuat landasan teoritis terkait pengembangan frontend dan desain antarmuka. Pengembangan frontend dilakukan menggunakan framework Tailwind CSS dengan pendekatan utility-first yang memungkinkan proses desain lebih fleksibel, efisien, dan konsisten. Animate On Scroll (AOS) digunakan untuk menambahkan efek animasi guna meningkatkan interaktivitas visual. Website yang dikembangkan mencakup halaman beranda, profil institusi, program studi, berita, pengumuman, halaman unduhan, serta halaman administrasi pengelolaan konten. Setiap halaman dirancang dengan memperhatikan prinsip desain responsif, keterbacaan, hierarki informasi, dan kesesuaian dengan identitas visual institusi. Hasil kegiatan magang ini berupa implementasi antarmuka website yang lebih modern, terstruktur, dan siap diintegrasikan dengan backend berbasis Laravel. Pengembangan ini diharapkan dapat meningkatkan efektivitas penyampaian informasi, citra institusi, serta pengalaman pengguna secara optimal, sekaligus memberikan pemahaman praktis mengenai alur kerja pengembangan frontend dalam lingkungan profesional.

Downloads

Download data is not yet available.

References

Ade Rahayu. (2025). Metode Penelitian dan Pengembangan (R&D): Pengertian, Jenis dan Tahapan. DIAJAR: Jurnal Pendidikan Dan Pembelajaran, 4(3), 459–470. https://doi.org/10.54259/diajar.v4i3.5092

Azwar, E. (2019). Program pengalaman lapangan (magang) terhadap kepercayaan diri mahasiswa pendidikan jasmani kesehatan dan rekreasi. Jurnal Penjaskesrek, 6(2), 211–221.

Budiarti, R. L., & Juleha, M. (2025). Sistem Informasi Pengelolahan Data Operasional Kegiatan Media Berita Pada Lembaga Radio Republik Indonesia (Rri) Jambi Berbasisi Web: MySql, Laravel, Filament, Tailwind CSS, Visual Studio Code, Radio Republik Indonesia (RRI) Jambi. FORTECH (Journal of Information Technology), 9(1), 9–13.

Fadhallah, R. A. (2021). Wawancara. Unj Press.

Fridayanthie, E. W., Haryanto, H., & Tsabitah, T. (2021). Penerapan Metode Prototype Pada Perancangan Sistem Informasi Penggajian Karyawan (Persis Gawan) Berbasis Web. Paradigma - Jurnal Komputer Dan Informatika, 23(2). https://doi.org/10.31294/p.v23i2.10998

Iqbal, M., Talpu, S. R., Sukkur IBA University, Pakistan, Manzoor, A., Abid, M. M., & International Islamic University, Pakistan. (2020). An Empirical Study Of Popular Content Management System - Wordpress Vs Drupal Vs Joomla. ICTACT Journal on Management Studies, 6(2), 1214–1219. https://doi.org/10.21917/ijms.2020.0168

Laia, E. (2023). Analisis Struktur Teks Laporan Observasi Siswa Kelas X Sma Negeri 2 Susua Tahun Pelajaran 2021/2022. KOHESI : Jurnal Pendidikan Bahasa Dan Sastra Indonesia, 3(2), 13–23. https://doi.org/10.57094/kohesi.v3i2.848

Mardiana, I., Wahyudin, & Junaeti, E. (2024). Pengembangan Learning Management System dengan Framework Laravel dan Tailwind CSS. MULTINETICS, 10(1), 40–49. https://doi.org/10.32722/multinetics.v10i1.6678

Noviantoro, A., Silviana, A. B., Fitriani, R. R., & Permatasari, H. P. (2022). Rancangan dan implementasi aplikasi sewa lapangan badminton wilayah Depok berbasis web. Jurnal Teknik Dan Science, 1(2), 88–103.

Pasaribu, J. S. (2017). Penerapan Framework Yii Pada Pembangunan Sistem Ppdb Smp Bppi Baleendah Kabupaten Bandung. Jurnal Ilmiah Teknologi Infomasi Terapan, 3(2). https://doi.org/10.33197/jitter.vol3.iss2.2017.132

Prayudi, A., Fathirma’ruf, F., Supriyaddin, S., Arifin, A., & Jama’ah, J. (2023). Studi Literatur: Penggunaan Model Analogi dalam Proses Pembelajaran. Ainara Journal (Jurnal Penelitian Dan PKM Bidang Ilmu Pendidikan), 4(1), 22–28.

Pricillia, T. & Zulfachmi. (2021). Perbandingan Metode Pengembangan Perangkat Lunak (Waterfall, Prototype, RAD). Jurnal Bangkit Indonesia, 10(1), 6–12. https://doi.org/10.52771/bangkitindonesia.v10i1.153

Rivaldi, A., Feriawan, F. U., & Nur, M. (2023). Metode pengumpulan data melalui wawancara. Sebuah Tinjauan Pustaka, 1–89.

Suttrisno, S. (2021). Analisis dampak pembelajaran daring terhadap motivasi belajar siswa madrasah ibtidaiyah. Jurnal Riset Madrasah Ibtidaiyah, 1(1), 348380.

Waruwu, M. (2024). Metode Penelitian dan Pengembangan (R&D): Konsep, Jenis, Tahapan dan Kelebihan. Jurnal Ilmiah Profesi Pendidikan, 9(2), 1220–1230. https://doi.org/10.29303/jipp.v9i2.2141

Zulfallah, F. H., & Hidayatuloh, S. (2021). Analisis dan perancangan sistem informasi pendaftaran magang pada Inspektorat Jendral Kementerian Pendidikan dan Kebudayaan. Jurnal Esensi Komputasi IBN, 5(1) .