Stand Out Online Portofolio Design with Flowbite for Beginers

Main Article Content

Hilmi Dzakiyuddin Rohman
Muhammad Thirafi Qaedi Setiawan
Najla Maharani Dewi Tiawa Ginawan
Sitti Nurbaya Ambo
Jumail Jumail
Yana Adharani

Abstract

This community engagement project aimed to enhance digital literacy by providing practical training on building online portfolios using Flowbite and Tailwind CSS. The initiative targeted students and beginners who lacked prior experience in creating web-based portfolios. Through a combination of webinars and hands-on workshops, participants were introduced to the fundamentals of
portfolio design, User-Centered Design (UCD) principles, and modern UI development using Flowbite components. The project implemented a project-based learning approach to ensure both theoretical understanding and technical skills acquisition. The event was held virtually on July 14, 2025, and attended by 33 participants, with 21 actively engaged during the session. A pre-test and post-test were administered to evaluate learning outcomes. The results showed a significant improvement in participants' understanding, with the average score increasing from 73.5 to 87. Additionally, 95% of participants expressed satisfaction with the training format and content. The program successfully equipped participants with the necessary knowledge and skills to develop responsive and aesthetically pleasing online portfolios, contributing to their personal branding efforts in the digital era.

Article Details

Section
Articles

References

Hakim, R. R. (2020). Pencegahan Penularan Covid-19 Berbasis Aplikasi Android . Community Engagement & Emergence Journal, 7-13.

Hidayat, R., Bintang, R. A., Irawan, D., Abean, M. A., Filayati, M. A., Sutrisno, M., . . . Ambo, S. N. (2025). Create Your Digital Identity: Bangun Portofolio Keren. Dedication: Jurnal Pengabdian Masyarakat.

Maharani, P. (2025). Pengembangan Website PT. Rantangin Digital Indonesia Menggunakan. Publikasi Teknik Informatika dan Jaringan , 129-137.

Pratama, A. M., Ramadhani, D. R., Arifiansyah, M. S., & Hapsari, R. K. (2024). Pengembangan Website Profile MI Pers Min Menggunakan. Prosiding Seminar Implementasi Teknologi Informasi dan Komunikasi.

Muis, A., Riadi, I., Umar, R., & Yunus, M. 2023. Digitalisasi Portofolio Siswa Berbasis Website di SMK Informatika Wonosobo. Yogyakarta: Universitas Ahmad Dahlan.

Tresna, I. M. A., Wijayanto, H., & Widanta, I. P. 2024. Rancang Design UI/UX Website Portofolio pada Perusahaan PT. Kresna Karya Menggunakan Figma. Mataram: Universitas Mataram dan PT. Kresna Karya.

Melissa. 2024. Implementasi Pembuatan Website Portofolio Menggunakan Framework Laravel pada Platform Replit . Pa le mbang: Universitas Sriw ija ya.

Candra, A., Andhika, A.D., Chandra, K.W., Nicholas, R., Sasongko, R., & Hartati, E. 2023. Pelatihan Pembuatan Website Portofolio Sederhana. Palembang: Universitas Multi Data Palembang.

Azhariyah, S., & Mukhlis, M. (2023). Framework CSS: Tailwind CSS untuk front-end website store PT. XYZ. Jurnal Informatika, 2(–), –. https://jurnal.uniraya.ac.id/index.php/JI

Hudhayana, F. A., & Saputro, I. A. (2025). Perancangan UI/UX website portofolio Dezzly Creative. Journal of Computer Science and Information Technology (JCSIT), 2(3), 313– 323.