Implementasi Desain Responsif untuk Website UMKM dengan Bootstrap 5.0 (Studi Kasus: Chovan Seserahan)
DOI:
https://doi.org/10.35870/jtik.v10i1.5176Keywords:
Responsive Design, Bootstrap 5.0, Digital MSMEsAbstract
Micro, Small, and Medium Enterprises (MSMEs) play a crucial role in driving digital economic growth in Indonesia. However, many MSME actors have yet to fully utilize website technology as a medium for promotion and customer interaction. Chovan Seserahan, an MSME engaged in wedding gift decoration services, faces challenges related to its website's lack of responsiveness across different devices. This study aims to design a responsive landing page by implementing the Bootstrap framework version 5.0. The research adopts the Research and Development (R&D) method, which includes stages of needs analysis, interface design, implementation, and evaluation through heuristic testing and user trials. Bootstrap was chosen due to its mobile-first approach and its provision of adaptive and efficient user interface components. The evaluation results show significant improvements in navigation comfort, page loading speed, and visual consistency across multiple devices. Heuristic testing conducted by three validators yielded a feasibility score of 95.76%, indicating that the design quality and user experience are in the “highly feasible” category. In addition, user feedback revealed a positive shift in content accessibility and presentation. These findings demonstrate that implementing a Bootstrap-based responsive design is effective in enhancing user interface quality and strengthening the digital presence of MSMEs. Therefore, this approach offers a strategic solution to support the sustainable digital transformation of MSMEs.
Downloads
References
Adeleke, A. G., Sanyaolu, T. O., Efunniyi, C. P., Akwawa, L. A., & Azubuko, C. F. (2024, August). Leveraging UX design and prototyping in agile development: A business analyst’s perspective. Engineering Science & Technology Journal, 5(8), 2670–2693. https://doi.org/10.51594/estj.v5i8.1518.
Adfiansyah, F., Yuana, H., & Kirom, S. (2024, January). Rancang bangun aplikasi rekomendasi smartphone menggunakan teknologi responsive web design dengan framework Bootstrap. JATI (Jurnal Mahasiswa Teknik Informatika), 7(5), 3744–3751. https://doi.org/10.36040/jati.v7i5.7823.
Frayoga, A., Nilawati, N., & Sany, E. (2024, February). Penerapan design thinking pada perancangan UI/UX website Bootchin Coffee. Jurnal Manajemen Informatika Jayakarta, 4(1), 126. https://doi.org/10.52362/jmijayakarta.v4i1.1314.
Ji, K., Soebandhi, S., Trimarjono, A., & Imron, M. A. (2023, December). Adaptive digital marketing approaches for MSMEs amidst the COVID-19 pandemic. Kaav International Journal of Economics, Commerce & Business Management. https://doi.org/10.52458/23484969.2023.v10.iss4.kp.a5.
Kaur, J. (2024, April). The future of responsive web design: Challenges and opportunities in multi-device compatibility. International Journal of Research in Applied Science and Engineering Technology, 12(4), 3973–3975. https://doi.org/10.22214/ijraset.2024.60818.
Kholik, A., Soegiarto, A., & Sari, W. P. (2024, November). Strategi komunikasi visual dalam user interface (UI) dan user experience (UX) untuk membangun kepuasan pengguna. TUTURAN: Jurnal Ilmu Komunikasi, Sosial dan Humaniora, 2(4), 335–344. https://doi.org/10.47861/tuturan.v2i4.1358.
Kurnia, S., & Nawaningtyas, N. (2024, October). Analisis interaksi pengguna dalam desain user interface dan user experience yang lebih baik menggunakan metode heuristik. Jurnal Teknik Mesin, Industri, Elektro dan Informatika, 3(4), 113–119. https://doi.org/10.55606/jtmei.v3i4.4433.
Maria, V., Aziz, A. F., & Rahmawati, D. (2024, June). Meningkatkan daya saing UMKM lokal melalui strategi pemasaran digital di era digital. OPTIMAL: Jurnal Ekonomi dan Manajemen, 4(2), 208–220. https://doi.org/10.55606/optimal.v4i2.3471.
Nicholas, B. (2024, December). Utilization of website and interface to help raise the brand identity of micro, small and medium enterprises owners. VCD, 9(2), 349–360. https://doi.org/10.37715/vcd.v9i2.5302.
Perdana, C., Wijaya, M. A., & Subang, P. N. (2024). Implementasi framework Bootstrap 5 pada perancangan front-end website MC BRO di PT X. Jurnal Sistem Informasi Galuh, 2(1). Retrieved from
Salsabilla, S., Adzani, P. I., Riyanto, W. T., Suryana, Y., & Perkasa, R. J. A. (2024, May). Analisis usability testing menggunakan metode SUS (System Usability Scale) terhadap kepuasan pengguna dalam mengakses website Tokopedia. El-Mujtama: Jurnal Pengabdian Masyarakat, 4(3). https://doi.org/10.47467/elmujtama.v4i3.2759
Widiantoro, A. D. (2024, March). Implementation of the user centered design (UCD) method for MSME e-commerce. SISFORMA, 10(2). https://doi.org/10.24167/sisforma.v10i2.10842
Zaelani, N., Suarna, N., & Prihartono, W. (2024, February). Desain user interface website pemesanan online produk makanan Kripdunk dengan metode user centered design. JATI (Jurnal Mahasiswa Teknik Informatika), 7(6), 3414–3426. https://doi.org/10.36040/jati.v7i6.8203.
Downloads
Published
Issue
Section
License
Copyright (c) 2026 Salma Eka Febriyan, Dewi Handayani Untari Ningsih
This work is licensed under a Creative Commons Attribution 4.0 International License.
Authors who publish with this journal agree to the following terms:
1. Copyright Retention and Open Access License
Authors retain copyright of their work and grant the journal non-exclusive right of first publication under the Creative Commons Attribution 4.0 International License (CC BY 4.0).
This license allows unrestricted use, distribution, and reproduction in any medium, provided the original work is properly cited.
2. Rights Granted Under CC BY 4.0
Under this license, readers are free to:
- Share — copy and redistribute the material in any medium or format
- Adapt — remix, transform, and build upon the material for any purpose, including commercial use
- No additional restrictions — the licensor cannot revoke these freedoms as long as license terms are followed
3. Attribution Requirements
All uses must include:
- Proper citation of the original work
- Link to the Creative Commons license
- Indication if changes were made to the original work
- No suggestion that the licensor endorses the user or their use
4. Additional Distribution Rights
Authors may:
- Deposit the published version in institutional repositories
- Share through academic social networks
- Include in books, monographs, or other publications
- Post on personal or institutional websites
Requirement: All additional distributions must maintain the CC BY 4.0 license and proper attribution.
5. Self-Archiving and Pre-Print Sharing
Authors are encouraged to:
- Share pre-prints and post-prints online
- Deposit in subject-specific repositories (e.g., arXiv, bioRxiv)
- Engage in scholarly communication throughout the publication process
6. Open Access Commitment
This journal provides immediate open access to all content, supporting the global exchange of knowledge without financial, legal, or technical barriers.
