Penerapan Responsif Desain Menggunakan Metode CSS Grid Layout dan Flexbox Studi Kasus Website Pendaftaran Kerjasama Media Online Dinas Kominfo Medan
Keywords:
Desain responsif, CSS Grid Layout, Flexbox, sistem pendaftaran, media onlineAbstract
Pemanfaatan teknologi informasi dalam pelayanan publik menjadi salah satu upaya untuk meningkatkan efektivitas dan efisiensi kerja instansi pemerintahan. Dinas Komunikasi dan Informatika Kota Medan dalam proses pendaftaran kerjasama media online masih menerapkan sistem manual, sehingga berpotensi menimbulkan kendala seperti lamanya proses pendaftaran, risiko kehilangan dokumen, serta kurang optimalnya pengelolaan data. Oleh karena itu, penelitian ini dilakukan untuk merancang dan membangun sistem pendaftaran kerjasama media online berbasis website dengan menerapkan desain responsif menggunakan metode CSS Grid Layout dan Flexbox. Metode penelitian yang digunakan meliputi observasi, wawancara, sampling dokumen, dan studi literatur. Sistem dikembangkan menggunakan PHP sebagai bahasa pemrograman backend, MySQL sebagai basis data, serta penerapan CSS Grid Layout dan Flexbox pada sisi antarmuka pengguna. Perancangan sistem dilakukan dengan menggunakan Unified Modeling Language (UML), sedangkan pengujian sistem dilakukan menggunakan metode blackbox testing. Hasil dari penelitian ini menunjukkan bahwa sistem yang dibangun dapat membantu proses pendaftaran kerjasama media online menjadi lebih terstruktur dan terorganisir. Selain itu, penerapan desain responsif menggunakan CSS Grid Layout dan Flexbox menghasilkan tampilan website yang dapat menyesuaikan dengan berbagai ukuran perangkat, sehingga diharapkan dapat memudahkan pengguna dalam mengakses dan menggunakan sistem
References
[1] Wahyono, E. B. 2019. Sistem pendaftaran kerjasama online. Fakultas Teknologi Informasi, Universitas Kristen Satya Wacana, Salatiga.
[2] Robbins, S. P. (2021). Prinsip-prinsip perilaku organisasi (edisi 18). Jakarta: Salemba Empat.
[3] Hasibuan, M. S. P. (2022). Manajemen: Dasar, pengertian, dan masalah (edisi revisi). Jakarta: Bumi Aksara.
[4] Wahyudi, & Prasetya. (2022). Perancangan sistem kerjasama berbasis online untuk optimalisasi kolaborasi tim di era transformasi digital. Jurnal Teknologi Informasi dan Komunikasi.
[5] Rainer, R. K., & Prince, B. (2021). Introduction to information systems: Enabling and transforming business (8th ed.). Hoboken, NJ: Wiley.
[6] Nasrullah. (2021). Media online: Perspektif komunikasi digital di era informasi. Jakarta: Prenadamedia Group.
[7] Lestari, D., & Nugroho, A. (2021). Media online sebagai sarana komunikasi digital: Interaktivitas dan partisipasi pengguna. Yogyakarta: Deepublish.
[8] Fitrih, A. (2024). Pemrograman PHP untuk pengembangan website dinamis. Jakarta: Elex Media Komputindo.
[9] Handoko. (2020). Pengaruh kerjasama berbasis online terhadap kinerja organisasi. Jurnal Manajemen dan Teknologi Informasi.
[10] Andrew, R. (2022). The new CSS layout. A Book Apart.
[11] Raharjo. (2021). Sistem pendaftaran sebagai bagian dari pelayanan publik: Identifikasi, verifikasi, dan pengelolaan data pengguna. Jurnal Administrasi Publik, 9(1), 22–35.
[12] Kurniawan, B., & Hidayat, R. (2022). Pemrograman basis data MySQL untuk aplikasi web. Yogyakarta: Andi Publisher.
[13] Janis, J. W. (2020). Unified Modeling Language (UML) untuk pengembangan perangkat lunak berbasis objek. Jakarta: Elex Media Komputindo.
[14] Wahyono, A. (2019). Sistem pendaftaran kerjasama berbasis informasi: Pendaftaran mitra dan pengarsipan perjanjian secara online. Surabaya: Andi Publisher.
https://kti.potensi-utama.org/|redaksijurnalupu@gmail.com
[15] Sutanto, R., & Wijaya, A. (2020). Penerapan CSS Grid dan Flexbox dalam desain antarmuka web: Optimalisasi tata letak dua dan satu dimensi. Jakarta: Elex Media Komputindo.
[16] Alwi, M., & Hasan, R. (2020). Pengaruh desain responsif terhadap kinerja website. Jakarta: Andi Publisher.
[17] Pratiwi, N. I., & Prabowo, A. (2025). Analisis servicescape, hedonic lifestyle dan promotion intention terhadap keputusan pembelian konsumen pada Suara Coffee & Space. RIGGS: Journal of Artificial Intelligence and Digital Business, 4(3), 4547–4555. https://doi.org/10.31004/riggs.v4i3.2656
[18] Riska, A., & Prabowo, A. (2025). Analisis social media marketing, servicescape, dan harga terhadap keputusan pembelian konsumen di Romansa Kopi. RIGGS: Journal of Artificial Intelligence and Digital Business, 4(3), 4917–4925. https://doi.org/10.31004/riggs.v4i3.2710
[19] Arini, D. P., & Prabowo, A. (2025). Analisis customer experience dan customer trust terhadap keputusan pasien berkunjung kembali pada Klinik Alternatif Akupuntur Serumpun Bambu. ANALISIS, 15(2), 310–328. https://doi.org/10.37478/als.v15i02.6497
[20] Prabowo, A., Adam, A. A., Subhan, Z. N., Tanjung, Y., Parhusip, A. A., Deviana, A., & Irwansyah. (2025). Sustainable business practices in coffee shops: The role of marketing innovation, digital marketing, and branding innovation through market development. International Journal of Accounting and Economics Studies, 12(6), 43–50. https://doi.org/10.14419/p0k0pc78
[21] Akila, F., & Prabowo, A. (2025). Pengaruh customer experience, perceived product quality dan brand trust terhadap keputusan pembelian konsumen Dunkin Donuts Gatot Subroto. ProBisnis: Jurnal Manajemen, 16(5), 1157–1165. https://ejournal.joninstitute.org/index.php/ProBisnis/article/view/1158
[22] Kurniawan, D., & Prabowo, A. (2025). Analisis customer relationship marketing, marketing communications dan service quality personal trainer terhadap tingkat kepuasan member pada Vizta Gym Cemara Asri Medan. VALUE: Jurnal Ilmiah Akuntansi, Keuangan dan Bisnis, 6(2), 392–407. https://doi.org/10.36490/value.v6i2.2160
[23] Prabowo, A., Tanjung, Y., Enzelia, E. L., Bangun, R., Simarmata, H. M. P., & Wahyuni, E. S. (2025). Eksplorasi promosi berbasis social media marketing dan brand image: Identifikasi impulsive buying behaviour melalui customer engagement pada konsumen brand fashion ZARA di Kota Medan. Jurnal Dunia Pendidikan, 6(3), 727–747. https://doi.org/10.55081/jurdip.v6i3.4431
[24] Prabowo, A., & Tarigan, T. D. (2025). Analisis servicescape, social media marketing dan customer experience terhadap minat berkunjung kembali konsumen Fore Coffee Citraland Helvetia Medan. Jurnal Dunia Pendidikan, 6(3), 996–1010. https://doi.org/10.55081/jurdip.v6i3.4581
[25] Prabowo, A., Siburian, P., & Bangun, R. (2025). Repurchase intention among millennial coffee shop customers: Exploring key determinants. International Journal of Accounting and Economics Studies, 12(8), 761–769. https://doi.org/10.14419/j7ch0q39
[26] Tanjung, S., & Prabowo, A. (2025). Analisis social media marketing dan customer relationship marketing terhadap kepuasan konsumen Sikologi Coffee. Economic and Education Journal (Ecoducation), 7(3), 975–989. https://doi.org/10.33503/ecoducation.v7i3.2345
[27] Rizki, S., Prabowo, A., & Pasaribu, E. S. (2025). Optimalisasi kinerja karyawan pada kawasan industri di Sumatera Utara: Peran work engagement dan employee experience melalui safety knowledge. Economic and Education Journal (Ecoducation), 7(3), 1022–1038. https://doi.org/10.33503/ecoducation.v7i3.2386
[28] Tarigan, R. R. M. T., Wahyuni, E. S., Prabowo, A., & Mauliza, P. (2026). Pengaruh pemasaran digital terhadap keputusan pembelian dengan citra merek sebagai variabel mediasi. MARAS: Jurnal Penelitian Multidisiplin, 4(1), 110–119. https://doi.org/10.60126/maras.v4i1.1503
[29] Mahlia, M., & Prabowo, A. (2026). Analisis experiental marketing, word of mouth, dan online customer review terhadap keputusan pembelian pada PT. Alfa Scorpii. RIGGS: Journal of Artificial Intelligence and Digital Business, 5(1), 14596–14606. https://doi.org/10.31004/riggs.v5i1.8083
[30] Dalimunthe, S. M., & Pohan, Y. A. (2025). Pengaruh budaya digital, pengembangan sumber daya manusia (SDM) dan lingkungan kerja fisik terhadap kinerja pegawai Dinas Ketenagakerjaan Kota Medan. RIGGS: Journal of Artificial Intelligence and Digital Business, 4(3), 7004–7014. https://doi.org/10.31004/riggs.v4i3.3050
[31] Tambunan, A. M., & Pohan, Y. A. (2025). Pengaruh inovasi produk, free layanan after sales dan kualitas informasi produk di website terhadap keputusaan pembelian mesin Inkjet PT. Megasatria Hiticher. RIGGS: Journal of Artificial Intelligence and Digital Business, 4(3), 7412–7422. https://doi.org/10.31004/riggs.v4i3.3107
[32] Delvin, S., & Pohan, Y. A. (2025). Pengaruh komitmen afektif, komitmen berkelanjutan dan komitmen normatif terhadap kinerja karyawan PT Navya Retail Indonesia. RIGGS: Journal of Artificial Intelligence and Digital Business, 4(3), 7540–7550. https://doi.org/10.31004/riggs.v4i3.3134
[33] Zai, S., & Pohan, Y. A. (2025). Pengaruh sanksi keterlambatan, biaya administrasi dan tarif jasa simpan terhadap kepuasan nasabah dalam menggunakan jasa gadai pada PT. Sentral Gadai Persada. RIGGS: Journal of Artificial Intelligence and Digital Business, 4(3). https://doi.org/10.31004/riggs.v4i3.3284
[34] Devini, S. Z., & Pohan, Y. A. (2025). Pengaruh kualitas pelayanan, kualitas produk dan fasilitas terhadap kepuasan pelanggan Lazatto Chicken & Burger cabang UMSU. Jurnal Daya Saing, 11(3), 899–905. https://doi.org/10.35446/dayasaing.v11i3.2504
[35] Zulnawati, S. E., & Pohan, Y. A. (2026). Pengaruh perceived ease of use, brand trust dan customer experience terhadap minat pengguna Maxim di Kota Medan. Jurnal Akutansi Manajemen Ekonomi Kewirausahaan (JAMEK), 6(1), 112–120. https://doi.org/10.47065/jamek.v6i1.2285
[36] Rezzaini, H., Kadariah, S., & Riski, B. (2025). Pengaruh pembiayaan murabahah dan literasi keuangan terhadap kesejahteraan nasabah UMKM. Jurnal Riset Perbankan Syariah, 4(2), 143–152. https://doi.org/10.29313/jrps.v4i2.8726
[37] Nazli, P., Kadariah, S., & Sari, S. P. (2026). Model peningkatan minat menabung generasi Z di bank syariah melalui media sosial dan edukasi digital untuk penguatan ekosistem keuangan. Journal of Science and Social Research, 9(3), 4999–5005. https://doi.org/10.54314/jssr.v9i3.6723
[38] Sipahutar, E., Asshidiq, H., Kadariah, S., Murtani, A., Nazli, P., & Trihapsari, M. (2026). Integrasi pengetahuan, religiusitas, promosi dan minat dalam keputusan menabung berbasis perilaku individu: Pendekatan multidisiplin (MSDM, psikologi, perbankan syariah, dan akuntansi). Jurnal Ilmiah Edunomika, 10(2). https://doi.org/10.29040/jie.v10i2.19873
[39] Reza, F., & Nazli, P. (2025). SWOT analysis in the marketing strategy of IB Mudarabah Deposit products at PT. Bank Sumut KCP Syariah Karya Medan. Digital Business: Tren Bisnis Masa Depan, 16(4), 171–178. https://ejournal.cria.or.id/index.php/db/article/view/357
[40] Andira, M. F., & Ridwan, M. (2025). The influence of service quality, transparency, and religiosity on PT Bank Mandiri employees’ interest in donation to Ziswaf at The Mandiri Amal Insani Zakat (LAZ) Institution Medan Representative. BISEI: Jurnal Bisnis dan Ekonomi Islam, 10(2), 117–130. https://doi.org/10.33752/bisei.v10i2.10758
[41] Ainayah, D., Hutagalung, M. K., Riski, B., & Arafah, S. (2025). Pengaruh perceived value dan perceived quality terhadap loyalitas nasabah pembiayaan KPR IB Griya pada PT Bank Sumut Syariah KCPSY Hamparan Perak. RIGGS: Journal of Artificial Intelligence and Digital Business, 4(4), 2015–2021. https://doi.org/10.31004/riggs.v4i4.3561
[42] Daulay, Z., Riski, B., & Hutagalung, M. K. (2025). Analisis implementasi metode pemasaran direct selling pada produk talangan umroh di PT. Bank Sumut Syariah Kantor Cabang Pembantu Hamparan Perak. RIGGS: Journal of Artificial Intelligence and Digital Business, 4(4), 2133–2143. https://doi.org/10.31004/riggs.v4i4.3551
[43] Rahman, R. J., Miko, J., & Rizki, B. (2025). The impact of mobile banking services on customer satisfaction in the digital era at PT. Bank Sumut Syariah KCP Hamparan Perak. RIGGS: Journal of Artificial Intelligence and Digital Business, 4(4), 5940–5946. https://doi.org/10.31004/riggs.v4i4.4135
[44] Rezzaini, H., Kadariah, S., & Riski, B. (2025). Pengaruh pembiayaan murabahah dan literasi keuangan terhadap kesejahteraan nasabah UMKM. Jurnal Riset Perbankan Syariah, 4(2), 143–152. https://doi.org/10.29313/jrps.v4i2.8726
[45] Daulay, Z., Riski, B., & Hutagalung, M. K. (2025). Analisis implementasi metode pemasaran direct selling pada produk talangan umroh di PT. Bank Sumut Syariah Kantor Cabang Pembantu Hamparan Perak. RIGGS: Journal of Artificial Intelligence and Digital Business, 4(4), 2133–2143. https://doi.org/10.31004/riggs.v4i4.3551
[46] Alfinsyah, R., & Murtani, A. (2025). Analysis of the use of QRIS as financial technology among millennials: A case study at Warkop Kita 2 and Warkop Agam. Digital Business: Tren Bisnis Masa Depan, 16(4), 164–170. https://doi.org/10.59651/digital.v16i4.355
[47] Eka Putra, S., Nurmala Sari, T., Simatupang, J., Murtani, A., & Tanjung, Y. (2025). Analysis of the benefits of the 7P marketing mix strategy on the brand image of Butong Tea at PT Perkebunan Nusantara IV Bah Butong. Jurnal Ilmiah Sosio-Ekonomika Bisnis, 28(2), 30–37. https://doi.org/10.22437/jiseb.v28i02.41506