T1 672009061 Full text

PERANCANGAN DAN PEMBUATAN ABSENSI
ONLINE SMAK YOS SOEDARSO PATI BERBASIS
WEB
(Studi kasus : SMAK Yos Soedarso Pati)
Artikel Ilmiah
Diajukan kepada
Fakultas Teknologi Informasi
untuk Memperoleh Gelar Sarjana Komputer

Peneliti:
Elia Lugastio (672009061)
Christine Dewi, S.Kom., M.Cs.

Program Studi Teknik Informatika
Fakultas Teknologi Informasi
Universitas Kristen Satya Wacana
Salatiga
2016

PERANCANGAN DAN PEMBUATAN ABSENSI
ONLINE SMAK YOS SOEDARSO PATI BERBASIS

WEB
(Studi kasus : SMAK Yos Soedaso Pati)
1)

Elia Lugastio, 2) Christine Dewi
Fakultas Teknologi Informasi
Universitas Kristen Satya Wacana
Jl. Diponegoro 52-60, Salatiga 50711, Indonesia
Email: 1) [email protected], 2)[email protected]

Abstract
In this globalization era, internet is used widely such as in educational
institutions. Schools take advantage of internet as information and communication media.
It was found that one of schools in Pati Regency, SMAK Yos Soedarso, still used a
manual attendance list. This caused the inefficiency of paper usage for the attendance
lists. Besides, the recapitulation of students absence was also done manually and took so
much time. The school itself didn t have a database for the entire students absence. To
solve this problem, an online based attendance list is needed. This study generates a
website-based attendance list which uses PHP with MySQL as the database. This online
system is used to input students attendance daily and automatically calculate the

integrated recapitulation which later can be used to take certain follow-up action by the
school.
Keywords: Online-based attendance list, Website-based attendance list, PHP, MySql.

Abstrak
Pada era globalisasi ini, internet dipergunakan secara luas termasuk oleh lembaga
pendidikan. Sekolah-sekolah memanfaatkan internet sebagai media informasi dan
komunikasi. Salah satu sekolah di Kabupaten Pati yaitu SMAK Yos Soedarso ditemukan
masih menggunakan absensi yang dilakukan secara manual. Hal ini menyebabkan
pemakaian kertas untuk daftar absensi kurang efisien. Selain itu, penghitungan
rekapitulasi absensi siswa juga dilakukan secara manual dan memakan waktu yang lama.
Bahkan sekolah tidak memiliki database rekapitulasi absensi seluruh siswa. Untuk
mengatasi masalah tersebut, dibutuhkan sistem absensi online. Penelitian ini
menghasilkan websiteabsensi yang menggunakan PHP dengan database MySQL. Sistem
absensi online ini berguna untuk menginput absensi siswa secara harian dan menghitung
rekapitulasi absensi setiap siswa secara otomatis dan terintegrasi yang kemudian dapat
dijadikan database bagi sekolah untuk mengambil tindak lanjut yang diperlukan.
Kata Kunci: Absensi online, Website absensi, PHP, MySql

1


Mahasiswa Fakultas Teknologi Informasi Jurusan Teknik Informatika, Universitas Kristen Satya
Wacana Salatiga
2
Staff Pengajar Fakultas Teknologi Informasi, Universitas Kristen Satya Wacana Salatiga.

1.

Pendahuluan

Internet pada jaman globalisasi kini telah memegang peran yang penting
sebagai media komunikasi dan informasi. Meskipun pemaanfaatan teknologi
internet tersebut bukan hal yang baru dan kita tidak dapat memungkiri
kebermaanfaatannya dalam komunikasi dan informasi bagi lembaga pendidikan
dasar dan menengah. [1]
Media komunikasi dan informasi efektif bagi lembaga pendidikan adalah
website. Bahkan telah ada banyak sekolah yang melakukan pendaftaran calon
siswa baru secara online. Meskipun demikian, masih ditemukan sekolah-sekolah
yang menggunakan sistem manual dalam mengerjakan suatu kegiatan, misalnya
absensi siswa. Kehadiran dan ketidakhadiran siswa dimasukan dan dihitung secara

manual pada daftar absensi kelas. Salah satu sekolah yang masih menggunakan
absensi manual tersebut adalah SMAK Yos Soedarso.
Sistem absensi manual memiliki beberapa kelemahan. Pertama, untuk
mendapatkan rekapitulasi absensi siswa, para wali kelas menghitung sendiri
ketidakhadiran siswa setiap minggu, bulan, akhir semester, dan akhir tahun
pelajaran.Hal ini tentu memakan waktu yang tidak sedikit.Selain itu, kekurangan
dari metode ini adalah daftar absensi tersebut menumpuk di meja guru dan
menghabiskan cukup banyak kertas.Bahkan terkadang data rekapitulasi absensi
tersebut hanya dimiliki dan disimpan oleh wali kelas saja yang kemudian
dimasukkan ke dalam raport siswa setiap akhir semester. Hal ini berarti sekolah
tidak memiliki rekapitulasi absensi siswa secara keseluruhan. Padahal data
rekapitulasi tersebut bisa dijadikan dasar untuk mengambil tindakan yang
diperlukan oleh guru BK atau wali kelas terhadap siswa-siswa yang mungkin
bermasalah atau kurang jumlah kehadirannya.
Atas dasar permasalahan tersebut, penulis memiliki ide untuk membuat
absensi online untuk SMAK Yos Soedarso.Absensi online diperlukan karena
memiliki beberapa keuntungan. Setiap hari wali kelas atau admin menginput data
absensi dari kelas ke dalam sistem absensi online dan dilakukan 2 kali dalam
sehari. Absensi online ini bisa menghitung secara otomatis jumlah kehadiran dan
ketidakhadiran para siswa di kelas sehingga wali kelas tidak perlu menghitung

rekapitulasi secara manual. Data rekapitulasi yang telah terintegrasi dapat dicek
selama periode waktu tertentu sehingga guru BK atau wali kelas dapat
menggunakannya untuk mengatasi atau mengambil tindakan terhadap siswa yang
tidak hadir tanpa pemberitahuan. Data rekapitulasi tersebut dapat pula dijadikan
database bagi sekolah untuk evaluasi akhir semester dan akhir tahun pelajaran.
Berdasarkan pemaparan tersebut penulis menjadikan masalah tersebut sebagai
latar belakang penelitian dengan judul Perancangan dan Pembuatan Website
Absensi SMAYos SoedarsoPatiMenggunakan PHP .

2.

Kajian Pustaka

Dalam penelitian pembuatan website ini, penulis menggunakan beberapa
tinjauan pustaka berupa penelitian sejenis yang telah sebelumnya
dilakukan.Tinjauan yang pertama berjudul Pembuatan Website Profil Sekolah
Menengah Pertama Negeri 2 Kerjo Kabupaten Karanganyar dari Dwi Sutanti
(2013). Pembuatan Website Profil SMP N 2 Kerjo dapat memberikan manfaat
bagi warga sekolah maupun masyarakat luas yang ingin mendapatkan informasiinformasi yang berhubungan dengan SMP N 2 Kerjo. Metode yang digunakan
adalah kepustakaan, observasi, wawancara, analisis, perancangan, ujicoba dan

implementasi. Bahasa pemrograman yang digunakan dalam penelitian adalah PHP
dan databaseMySQL. [2]
Tinjauan kedua dengan judul Pembuatan Website Sekolah Dasar Negeri
Sragen Empat Belas ditulis oleh Isa Budi Kahono (2013). Penelitian ini
menggunakan metode kepustakaan, observasi, wawancara, perancangan, ujicoba
dan implementasi. Perancangan website ini mampu mencakup semua kebutuhan
untuk memberikan informasi dengan cepat dan akurat. Perancangan website
tersebut menggunakan PHP, MySQL, dan CMS Lokomedia. [3]
Berdasarkan penelitian-penitian yang telah dilakukan terkait pengembangan
website sebagai media komunikasi dan informasi sekokah dengan pihak luar,
maka dilakukan penelitian yang membahas tentang perancangan dan
pengimplementasian absensi onlinedi SMAK Yos Soedarso Pati menggunakan
PHP dan dengan database MySQL. Absensi online ini dimanfaatkan oleh intern
sekolah. Sistem absensi online terdiri dari beberapa bagian seperti halaman
pengguna admin, halaman menu berisi menu kelas, siswa, absensi, dan rekap.
Dimana admin dapat mengisikan absensi tiap kelas dan secara otomatis
mendapatkan rekapitulasi absensi yang dapat dimanfaatka oleh pihak terkait demi
kemajuan sekolah.
Website (situs web) adalah merupakan alamat (URL) yang berfungsi sebagai
tempat penyimpanan data dan informasi dengan berdasarkan topik dan sub topik

tertentu. [4]
PHP merupakan singkatan dari Hypertext Preprocessor. PHP adalah bahasa
pemrograman script server-side yang didesain untuk pengembangan web. PHP
disebut sebagai bahasa pemrograman server side karena PHP diproses pada
komputer server. [5]
MySQL sebenarnya merupakan turunan salah satu konsep utama dalam
database sejak lama, yaitu SQL (Structured Query Language). SQL adalah sebuah
konsep pengoperasian database, terutama untuk pemilihan atau seleksi dan
pemasukan data, yang memungkinkan pengoperasian data dikerjakan dengan
mudah secara otomatis. [6]
Absensi adalah buku daftar ketidakhadiran siswa [16].

3.

Metode Penelitian
Pada perancangan aplikasi menggunakan tahapan penelitian yang terdiri dari
4 tahapan penelitian, yaitu: 1) Identifikasi Masalah. 2) Perancangan Sistem. 3)
Pembuatan Aplikasi. 4) Implementasi dan Pengujian Sistem serta Analisis Hasil
Pengujian.
Identifikasi Masalah


Perancangan Sistem

Pembuatan Aplikasi

Implementasi dan Pengujian Sistem
serta
Analisis Hasil Pengujian

Gambar 1Tahap Penelitian

Tahapan penelitian pada Gambar 1 dapat dijelaskan sebagai berikut: 1) Tahap
pertama: Identifikasi Masalah, pada tahap ini yang dilakukan adalah meneliti dan
mengamati proses absensi di SMAK Yos Soedarso Pati dengan tanya jawab
dengan guru TIK. 2) Tahap kedua: Perancangan Sistem, perancangan sistem
dilakukan dengan menggunakan diagram Unified Modelling Language (UML).
Perancangan sistem berupa diagram meliputi use case diagram, class diagram,
sequence diagram dan deployment diagram. 3) Tahap ketiga: Pembuatan Aplikasi,
pada tahap ini dilakukan pembuatan aplikasi sesuai dengan perancangan sistem
yang telah dibuat. Pembuatan aplikasiini berbasis websiteabsensi

onlinedenganbahasa pemrograman PHP. 4) Tahap keempat: Implementasi dan
Pengujian Sistem serta Analisis Hasil Pengujian, pada tahap ini website absensi
online akan diimplementasikan pada web browser, kemudian dilakukan pengujian
/ testing untuk mengetahui apakah aplikasi telah sesuai dengan perancangan yang
dilakukan dan sudah tidak ditemukan kesalahan / bug pada website. Pengujian
website dilakukan pada objek penelitian yaitu di SMAK Yos Soedarso Pati.
Metode perancangan sistem yang digunakan pada pembangunan website
absensi online pada SMAKYos Soedarso Pati adalah model prototype. Model
prototype merupakan sebuah teknik pengumpulan data atau informasi tertentu
mengenai kebutuhan-kebutuhan informasi pengguna secara cepat. Dengan metode
prototype ini, pengembang dan pihak SMAKYos Soedarso Pati, yaitu
administrator dan guru, dapat saling berinteraksi selama proses pembuatan
website absensionline. Secara lengkap, alur model prototype digambarkan seperti
pada Gambar 2[15].

Gambar 2 Metode Prototype

Gambar 2 merupakan gambaran tahapan umum dari prototypemodel.
Berikut adalah penjelasan dari tahap-tahap prototypemodel. Pada tahapan
pertama, yaitu listen to customer atau information gathering tentang kebutuhan

aplikasi absensi onlineyang akan dibangun. Pada tahap ini dilakukan wawancara
dengan beberapa perwakilan dari SMAK Yos Soedarso Pati, antara lain seorang
admin sekolah dan guru. Aktor admin atau administrator sekolah yang dipilih
merupakan guru TIK, yang bertugassebagai pengelola website. Pada tahap
wawancara dengan guru TIK, diperoleh informasi yaitu kebutuhan tentang
aplikasi berbasis web absensi online.
Tahapan selanjutnya dalam metode prototype yaitu build/revise mock-up
atau membangun aplikasi secara cepat. Pada tahap ini dilakukan pembuatan
aplikasi absensionline berbasis web, aplikasi absensi online berbasis websesuai
dengan kebutuhan umum yang diketahui pada tahap pertama.
Pada tahap pengidentifikikasian masalah, proses penelitian sistem absensi
dilakukan wawancara yang dilakukan dengan Guru TIK SMAK Yos Soedarso,
didapatkan proses aplikasi absensi online berbasis web sebagai berikut:

Guru
memanggil
Siswa / Siswi

Siswa / Siswi
angkat tangan

hadir

Serahkan data
absensi ke
admin

Admin
menerima data
absensi

Guru catat
absensi

Gambar 3 Proses Absensi Online

Penjelasan proses absensi pada Gambar 3Guru memanggil nama siswa dan
siswi di kelas, siswa mengangkat tangan tanda kehadiran lalu guru mencatat
kehadiran dan ketidakhadiran siswa, setelah absen selesai, guru menyerahkan data
absensi kepada admin. Setelah admin menerima data absensi, admin menginput
data absensi secara online.
Pada tahap perancangan sistem menggunakan diagram UML yang berfungsi
untuk menggambarkan prosedur dan proses kerja dari aplikasi. Diagram UML
yang digunakan antara lain Usecase diagram, Classdiagram dan Deployment
diagram. Usecase diagram adalah gambaran graphical dari beberapa atau semua
aktor, usecase dan interaksi di antara komponen-komponen tersebut yang
memperkenalkan suatu sistem yang akan dibangun [13]. Usecase. Usecase yang
pertama mempunyai 1 aktor yaitu Admin, yang dapat dilihat pada Gambar 4.

Gambar 4Use CaseDiagram

Gambar 4use case diagram yang mempunyai 1 aktor yaitu
adminmenunjukkan bahwa pada sistem absensi online, admin dapat melakukan
kelola data siswa, kelola data kelas dan kelola data absensi. Pada kelola data
siswa, admin dapat melakukan lihat data, tambah data, ubah data. Pada kelola data
kelas, kegiatan yang dilakukan meliputi lihat data, ubah data dan hapus data.
Yang terakhir, pada kelola data absen, admin dapat melakukan kegiatan, seperti
lihat data (ijin, sakit, dan alfa).

Gambar 5Activity Diagram absensi

Pada gambar 5 menggambarkan aktivitasadmin ketika login dan akan
melakukan absensi. Pada tampilan utama yaitu tampilan masuk, pengguna akan
memasukkan nama pengguna dan kata sandi yang kemudian sistem akan
melakukan pengecekan nama pengguna dan kata sandi pada database. Apabila
nama pengguna dan kata sandi sesuai yang terdapat pada database maka sistem
akan menampilkan menu utama. Pada menu utama ini pengguna memilih menu
absensi yang menampilkan form absensi. Setelah absensi ditambah, maka data
akan dikirim ke database.

Gambar 6Class Diagram

Pada gambar 6 ditunjukkan suatu Class diagram yang menggambarkan
struktur dan deskripsi class, package dan objek beserta hubungan satu sama lain
seperti containment, pewarisan, asosiasi dan lain-lain[14].

Gambar 7Deployment Diagram

Gambar 7 menggambarkan deployment diagram dari sistem absensi online.
Pada deployment diagram terdapat perangkat lunak yaitu aplikasi absensi online.
Aplikasi absensi onlineterhubung dengan webservice, dan webservice berfungsi
sebagai penghubung antara aplikasidengan database. Webservice dibangun
dengan menggunakan bahasa pemrograman web yaitu PHP. Webservice ini juga
terhubung dengan database pada server.
4.

Hasil dan Pembahasan

Penelitian ini menghasilkan aplikasi absensi online berbasis web yang
ditujukan agar digunakan oleh para staf di SMAK Yos Soedarso. Adminwebsite
absensi ini adalah staffTata Usaha di sekolah tersebut.
Pengguna website absensi ini dapat melakukan kelola data siswa, data kelas,
dan data absen. Admin dapat menginput data absensi yang dikumpulkan oleh para
guru di tiap-tiap kelas, mengubah data apabila diperlukan, dan melihat
rekapitulasi kehadiran dan ketidakhadiran yang secara otomatis dihitung oleh
sistem website ini.

Gambar 8Tampilan Login Admin

Penjelasan pada gambar 8,Pertama, admin membuka alamat
websitelocalhost/absensikelas pada internet explorer atau sejenisnya. Gambar 8
merupakan tampilan login untuk admin. Admin dapat login dengan memasukkan
username dan password yang penulis buat.

Gambar 9Tampilan Halaman Utama

Jika berhasil login dengan id admin, admin akan melihat tampilan halaman
utama absensi online seperti yang ditampilkan pada Gambar 9, yang berisi menu
Home, Kelas, Siswa,Absensi dan Rekap.

Kode program 1Menu
1.
2.
3.
4. MENU UTAMA
5.
6. Home
7. Kelas
8. Siswa
9. Absensi
10.
Rekap
11.

12.

13.


Berikut ini adalahKode Program 1 yaitu kode pemrograman untuk menu
halaman utama pada website absensi ini. Kode ini merupakan fungsi pada menu
halaman utama dimana admin dapat memilih pilihan menu yang ada.

Gambar 10Tampilan Menu kelas

Gambar 10 merupakan tampilan menu kelas, dimana admin bisa menambah
kelas sesuai kelas yang dibuka, misalnya terdapat 3 kelas X, 4 kelas XI dan XII
yang terbagi menjadi Ipa dan Ips.

Gambar 11 Tampilan Menu Siswa

Gambar 11merupakan tampilan menu menambah siswa. Pada bagian ini
admin dapat menambah data siswa dan membagi siswa perkelas. Dengan data
Nama, tanggal lahir, alamat dan kelas.
Kode Program 2 Kode Input Kelas
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.

$nama=mysql_escape_string($_POST['nama']);
$tempat_lahir=mysql_escape_string
($_POST['tempat_lahir']);
$tanggal_lahir=switch_tanggal_ke_ymd
($tanggal_lahir);
$jenis_kelamin=switch_jenis_kelamin_ke_pendek
($_POST['jenis_kelamin']);
$agama=switch_agama_ke_pendek
($_POST['agama']);
$alamat=mysql_escape_string
($_POST['alamat']);
$nomor_telepon=$_POST['nomor_telepon'];
$status=switch_status_siswa_ke_pendek
($_POST['status']);
//echo $status;
if ($_POST['aksi']=='Simpan Input Data Siswa')

Kode program 2 merupakan kode untuk menyimpan data siswa perkelas yang
telah dibagi admin dan di inputkan ke tabel databasesiswa

Gambar 12 Tampilan Menu Absensi

Gambar 12 merupakan tampilan untuk menu aksi absensi yang berisi tabel
nama kelas, jumlah siswa dan keterangan, pada kolom keterangan bisa dilihat
gambar 13.
Kode Program 3 Menu Absensi
1.
2.
3.
4.
5.
6.
7.
8.

$pesan_error=array();
$tanggal=mysql_escape_string($_POST['tanggal']);
$status=switch_status_absensi_ke_pendek($_POST['status']);
$keterangan=mysql_escape_string($_POST['keterangan']);
$sqlperintah_02="SELECT nis FROM absensi_siswa
WHERE nis='$nis' AND kode_periode='$periode_tampil'
AND tanggal='$tanggal_absensi'";
$sqlhasil_02=mysql_db_query($dbase,$sqlperintah_02,

Kode Program 3 adalah kode database untuk menampilkan nama kelas,
jumlah kelas dan keterangan dengan mengambil data dari tabel database kelas
berdasarkan nama kelas.

Gambar 13 Keterangan Absensi

Gambar 13Pada bagian ini admin mempunyai hak untuk melakukan aksi
absensi. Pada gambar tersebut, dapat mengisi status absensi, apakah hadir, sakit,
ijin atau alfa.
Kode program 4 Keterangan Absensi
1.
2.
3.
4.
5.
6.
7.
8.

9.