Syntax Literate: Jurnal Ilmiah Indonesia p�ISSN: 2541-0849 e-ISSN: 2548-1398
Vol. 7, No. 9, September 2022
PERANCANGAN
UI SISTEM INFORMASI AKADEMIK SEKOLAH SMA BINA JAYA PALEMBANG MENGGUNAKAN FIGMA
Rangga Saputra, Dedy Syamsuar
Universitas
Bina Darma Palembang, Indonesia
Email:
[email protected], [email protected]
Abstrak:
Penelitian ini bertujuan untuk
merancang website sistem informasi akademik di SMA Bina Jaya
Palembang dengan menggunakan
Figma sebagai alat perancangan. Perkembangan teknologi informasi telah� mengharuskan
beberapa lembaga pendidikan untuk menyesuaikan dengan zaman sekarang, aktifitas yang sebelumnya dilakukan secara manual harus dilakukan otomatisasi untuk memudahkan prosesnya. Perancangan sistem informasi akademik ini dilakukan
dengan menyediakan rancangan untuk menjadi gambaran sistem yang akan dibuat dan referensi bagi peneliti selanjutnya
yang akan membuat website sistem informasi akademik tersebut. Hasil dari penelitian ini berupa website sistem informasi akademik sekolah berasal dari rancangan
yang telah dibuat di Figma.
Maka dari itu penelitian ini diharapkan dapat membantu SMA Bina Jaya Palembang dalam
proses pengembangan teknologi
nya dengan cara perancangan website sistem informasi akademik tersebut.
Kata
Kunci: sistem informasi, perancangan UI, figma
Abstract
This study aims to design
an academic information system at SMA Bina Jaya Palembang by using Figma as a
design tool. The development of information technology has required several
educational institutions to adapt to today's times, activities carried out
manually must be done automatically to facilitate the process. The design of
this academic information system is done by providing a design to be a
description of the system that will be made and a reference for researchers who
will then create the academic information system site. The results of this
study are in the form of a school academic information system website derived
from a design that has been made at Figma. Therefore, this research is expected
to help SMA Bina Jaya Palembang in the process of developing its technology by
designing an academic information system.
Keywords: information systems, UI design, figma
Pendahuluan
SMA Bina Jaya Palembang adalah salah satu sekolah swasta yang terletak di Kota Palembang. Sekolah
tersebut telah menerapkan beberapa teknologi informasi didalamnya seperti website sekolah yang terdapat fitur seperti pendaftaran
siswa baru, pengumuman kelulusan siswa baru dan artikel mengenai berita terbaru di sekolah.
Namun website
tersebut di rasa masih dapat dilakukan banyak perbaikan dari segi tampilan
hingga fungsi-fungsi didalamnya agar dapat menambah efektifitas dan efisiensi pada proses didalamnya.
Didalam website
tersebut teridentifikasi
beberapa masalah seperti, pada tampilan bagi pengguna yang dinilai tidak terlalu
menarik dan memanjakan mata pengguna, disini peneliti beranggapan bahwa dapat dilakukan perbaikan dari segi pemilihan font, penempatan konten dan fitur, serta pemilihan
warna keseluruhan.
Maka dari itu peneliti berinisiatif
untuk membuat rancangan UI website sistem
informasi akademik SMA Bina
Jaya Palembang untuk menjadi
saran untuk perbaikan website
dan referensi bagi peneliti lain kedepannya yang berencana untuk mengembangkan website lebih
lanjut.
Hasil akhir yang
dibuat nantinya berupa rancangan UI website sistem informasi akademik yang akan dikonversi menjadi website akademik yang dibuat berdasarkan hasil analisa peneliti dan masukan dari pihak
sekolah itu sendiri untuk kemudian
jadi pengembangan teknologi di sekolah.
Metode
Penelitian
Penelitian ini dilaksanakan selama 4 bulan dengan SMA Bina Jaya Palembang yang berlokasi
di Lorong Ngabehi No.733, Kemas Rindo,
Kec. Kertapati, Kota
Palembang, Sumatera Selatan 30258. Penelitian Terapan adalah penelitian yang mempunyai alasan praktis, keinginan untuk mengetahui, bertujuan agar dapat melakukan sesuatu yang jauh lebih baik, lebih
efektif dan efisien. Penelitian terapan atau applied research dilakukan berkenaan dengan kenyataan-kenyataan praktis penerapan dan pengembangan ilmu pengetahuan yang dihasilkan oleh penelitian dasar dalam kehidupan
nyata.
Seperti pembuatan rancangan user interface
sistem informasi akademik ini, dalam
pembuatannya diharapkan dapat memecahkan masalah sehari-hari di sekolah dalam bidang
teknologi yang menyangkut efektifitas dan efisiensi.
Hasil
dan Pembahasan
Analisa Kebutuhan
Pengguna dan Sistem
Analisa
kebutuhan digunakan untuk mengidentifikasi akan kebutuhan pengguna terhadap sistem yang hendak dirancang. kebutuhan tersebut terdiri dari kebutuhan fungsional dan kebutuhan non-fungsional. Adapun beberapa kebutuhan yang diperlukan untuk pengembangan sistem sebagai berikut:
a. Kebutuhan Fungsional
Kebutuhan fungsional merupakan kebutuhan yang berkaitan dengan layanan yang diperlukan di dalam sistem yang akan dikembangkan. Adapun kebutuhan fungsional yang dibutuhkan pada sistem ini sebagai
berikut :
1. Sistem mampu memfasilitasi administrasi dan akademik sekolah.
2. Sistem mampu menampilkan form pendaftaran siswa.
3. Sistem mampu menampilkan hasil tes siswa.
4. Sistem mampu menampilkan jadwal mengajar guru.
b. Kebutuhan
Non-Fungsional
Kebutuhan
non-fungsional merupakan kebutuhan yang dapat dilakukan sistem, bisa berupa kehandalan
sistem, perilaku sistem, maupun standarisasi sistem. Adapun kebutuhan non-fungsional sistem sebagai berikut:
1. Sistem mampu menampilkan nilai ujian yang diisi guru kepada calon siswa.
2. Sistem mampu memberikan informasi mengenai Jadwal kepada siswa maupun
guru.
c. Perancangan Sistem
1. Menentukan Pengguna Sistem
Peneliti telah menganalisis pengguna yang terlibat didalam sistem dengan cara mempelajari
proses yang dilakukan sebelumnya
dan akan dijadikan aktor untuk dimasukkan
kedalam pemodelan dan fungsi dari sistem
yang akan dibuat.
1. Calon
Siswa: Calon Siswa dapat melakukan proses seperti:
� Mengisi
form pendaftaran siswa baru.
� Melihat hasil tes.
2. Siswa:
� Melihat jadwal pelajaran.
� Melihat kalender akademik.
� Melihat mading.
3. Guru:
� Mengisi hasil tes calon
siswa.
� Melihat
Jadwal mengajar.
d. Menentukan Fungsi dan Diagram Use case
Dalam menentukan
use case, kebutuhan fungsional
dari sistem yang hendak dibangun teridentifikasi. Use case merupakan
fungsi-fungsi layanan yang telah didefinisikan untuk digunakan pada sistem yang akan dibangun. Adapun use case yang akan
digunakan di sistem ini sebagai berikut:
Gambar 1
Use Case Diagram
Deskripsi
Use Case Diagram:
1. Mengisi
Form: Calon Siswa mengisi
form pendaftaran untuk mendaftar jadi siswa baru di sekolah.
2. Daftar:
Proses yang mengakomodir pendaftaran
siswa baru.
3. Nilai
Tes: Guru mengisi hasil tes calon
siswa untuk selanjutnya dilihat oleh calon siswa.
4. Username
dan Password: Setelah calon
siswa dinyatakan lulus dan menjadi siswa baru
maka akan mendapatkan username dan password untuk
login kedalam sistem.
Setelah use
case didefinisikan, maka
proses selanjutnya adalah membuat activity
diagram. Activity Diagram
adalah diagram untuk menggambarkan aliran kontrol di dalam suatu sistem yang merujuk pada aktor yang terlibat di dalam use case.
Adapun penjelasan terkait diagram
aktifitas pada setiap use
case yang hendak dibangun
di sistem ini sebagai berikut:
1.
Activity
Diagram Pendaftaran
Gambar
2
Activity
Diagram Calon Siswa
Activity
diagram diatas menjelaskan
proses calon siswa melakukan proses pendaftaran untuk menjadi siswa
baru. Diawali dengan calon siswa
membuka website sekolah, lalu membuka tab pendaftaran dan sistem akan menampilkan form pendaftaran yang selanjutnya akan diisi oleh calon siswa sebagai
data mereka untuk mengikuti tes selanjutnya.
Jika formular telah selesai
diisi dengan data yang benar maka calon
siswa akan mendapatkan nomor dan Jadwal tes.
2. Activity
Diagram Hasil Tes
Gambar 3
Activity Diagram
Hasil Tes
Activity
Diagram diatas menjelaskan
proses calon siswa melihat pengumuman hasil tes mereka.
Diawali dengan calon siswa mengakses
website sekolah lalu membuka tab pengumuman kelulusan, calon siswa memasukkan nomor tes mereka
untuk selanjutnya di cek hasilnya. Jika calon siswa dinyatakan
lulus maka akan mendapatkan username dan password untuk
mengakses website sebagai siswa.
3. Activity
Diagram Input Nilai Tes
Gambar 4
Activity Diagram
Input Nilai Tes
Activity
Diagram diatas menjelaskan
proses guru menginput nilai
hasil tes calon siswa, diawali
dengan guru mengakses
website lalu membuka tab nilai untuk selanjutnya
menginput nilai calon siswa sesuai
dengan hasil tes mereka, dengan
ketentuan jika nilainya dibawah 60 maka dinyatakan tidak lulus.
4. Activity
Diagram View Jadwal
Gambar 5
Activity Diagram
View Jadwal
Activity
Diagram diatas menjelaskan
proses siswa melihat Jadwal
pelajaran. Diawali dengan siswa mengakses
website lalu Jadwal akan langsung terlihat di Halaman depan siswa.
5. Activity
Diagram Admin
�Activity
Diagram Admin
Activity
Diagram diatas menjelaskan
proses admin mengolah data guru di Halaman Admin. Diawali dengan admin login kedalam website lalu website akan otomatis menampilkan
Halaman admin lalu admin langsung
membuka tab olah data untuk mengedit data guru.
6. Activity
Diagram Olah Data Mading
Gambar 7
Activity Diagram
Olah Data Mading
Activity
Diagram diatas menjelaskan
proses admin mengolah data mading,
diawali dengan admin login kedalam website lalu membuka tab �olah data mading� kemudian admin langsung dapat mengedit data untuk mading.
7. Class
Diagram
Hasil data sistem ini terdiri
atas kumpulan file (table)
yang saling berhubungan dalam sebuah basis data disebuah sistem komputer yang memungkinkan untuk mengakses dan memanifulasi file-file (table-table) tersebut. Class Diagram merupakan
diagram untuk menampilkan hubungan antar setiap table tersebut.
Gambar
8
Class
Diagram
�
1)
Rancangan
Halaman Home
Gambar 9
Rancangan Halaman Home
Rancangan
diatas berisi Halaman home
yang diakses seluruh aktor untuk masuk
kedalam website sebelum melakukan proses login.
2)
Rancangan
Halaman Beranda Siswa
Gambar
10
Rancangan
Halaman Beranda Siswa
8. Rancangan
Halaman Pendaftaran
Gambar 11
Rancangan Halaman Pendaftaran
Rancangan
Halaman Pendaftaran berisi
form pendaftaran yang akan diisi calon siswa
yang ingin mendaftarkan diri menjadi siswa
baru di sekolah.
9. Rancangan Halaman Pengumuman
Gambar
12
Rancangan
Halaman Pengumuman
Rancangan
Halaman Pengumuman berfungsi
untuk calon siswa melihat pengumuman
hasil tes mereka. Disini disediakan kolom untuk calon siswa
memasukkan nomor tes mereka untuk
di cek hasilnya.
10. Rancangan Halaman Kalender Akademik
Gambar
13
Rancangan Halaman Kalender Akademik
Rancangan
Halaman Kalender Akademik berisi informasi
mengenai kalender akademik sekolah yang telah disusun oleh struktur di sekolah
Kesimpulan
Berdasarkan penelitian yang telah dilaksanakan maka peneliti dapat berkesimpulan bahwa:
1. Untuk memfasilitas proses akademik disekolah maka dapat digunakan Website Sistem Informasi Akademik sekolah.
2. Website
Sistem Informasi Akademik sekolah dapat mengakomodir
proses seperti pendaftaran
online, pengecekan pengumuman
kelulusan dan Jadwal sekolah.
3. Website
Sistem Informasi Akademik
juga dapat mengefisiensi
proses yang sebelumnya dilakukan
secara manual.
BIBLIOGRAFI
Hakim, A. R., Harefa, K., & Widodo, B. J. S.-J. T. I. d. K. (2019). Pengembangan Sistem Informasi Akademik Berbasis Android Menggunakan
Flutter Di Politeknik.
14(3), 27-32.
Pusparini, E. S., Najoan, M. E., & Najoan, X.
B. J. J. T. E. d. K. (2017). Sistem InformasiAkademik
Berbasis Mobile Web menggunakan
Pendekatan Metodologi RAD
(Studi Kasus: Universitas Sam ratulangi).
6(4), 182-193.
Sarbini, R. N., Yuliana,
D. E., & WK, D. A. J. J. D. (2018). Rancang Bangun Sistem Informasi
Akademik Berbasis Android. 15.
Christian, L.,
Ellen, E., Ratih, R., & Yulia, Y. (2015). Perancangan
Sistem Informasi Akuntansi Penjualan dan Piutang dengan Metode Object
Oriented Analysis And Design dan Unified Modelling
Language pada Perusahaan Distributor. Paper presented at the Seminar Nasional Informatika (SEMNASIF).
Maryati, K., & Suryawati, J. (2001). Sosiologi: Jilid 3: ESIS.
Hidayat, Dudi;
Rianto, Yan; Hutabarat, Lambue;
Halomoan, UB; Fatony,
Achmad; Surya, Tri; Pariyaman, Pariyo;
Prasetyas, Vetty Rina dan Agusalim.
2003 Studi Adopsi TIK oleh IKM dalam
Proyek TATP: Faktor-Faktor yang Berpengaruh
terhadap Keberhasilan Adopsi TIK oleh IKM.
Chen, Shih-Chih.
2011. Understanding The Effects of Technology
Readiness, Satisfaction and Electronic Wordof-Mouth
on Loyalty in 3C Products. Australian Journal of Business and Management Research,
Volume 1, Nomor 3.
Nana dan Ahmad.
2001. Teknologi Pengajaran.
Bandung: Sinar Baru Algensindo.
Firman, F. and S. J. I.
J. o. E. S. Rahayu (2020). "Pembelajaran Online
di Tengah Pandemi Covid-19."� 2(2): 81-89.�
Syakti, F. J. J. B. K.
(2019). "METODE PENGEMBANGAN PERANGKAT LUNAK BERBASIS MOBILE: A
REVIEW."� 1(2): 82-89.
Tarigan, R. J. Analisis Perbandingan Brand
Equity Sistem Operasi
Android dengan Sistem Operasi iOS pada Smartphone (Studi Kasus
pada Anggota Forum Kaskus
Bagian Handphone & Tablet Subforum Android dan iOS) (Bachelor's thesis,
Jakarta: Fakultas Ekonomi dan Bisnis
UIN Syarif Hidayatullah Jakarta).
Nugraha, A. K., Satoto, K. I., & Kridalukmana,
R. (2014). Perancangan Permainan
Gelembung Huruf (Tokoh Wayang) Berbasis Sistem Operasi IOS Menggunakan Gamesalad (Doctoral
dissertation, Diponegoro University).
|
Rangga Saputra (2022) |
|
First publication right: Syntax Literate: Jurnal Ilmiah Indonesia |
|
This article is licensed under:
|
