Rancang Bangun Sistem Informasi Administ

RANCANG BANGUN SISTEM INFORMASI ADMINISTRASI
AKADEMIK BERBASIS WEB DENGAN MENGGUNAKAN xHTML
(STUDI KASUS PADA SMAN 8 SURABAYA)
1)

Awad Achmad Hansyi 2)Titik Lusiani 3)Teguh Sutanto

S1 / Sistem Informasi. Sekolah Tinggi Manajemen Informatika & Teknik Komputer Surabaya
Email :1) Awad_realmadrid@yahoo.com 2)lusiani@stikom.edu 3) teguh@stikom.edu
Abstract: Academic administration student information system is a web based system that can provide periodic
reports students' online activity, whether it be information on grades, attendance, finances, and scores of
students who are concerned violations. Along with the increased number of students from year to year, SMAN 8
has disadvantages in terms of student academic information delivery activities to parents.
One solution of the problem is the construction of an information system with a web-based academic
administration using xHTML for students who can be accessed through mobile devices. This system was built
based on web using HTML programming language, xHTML, PHP and Javascript and uses MySQL database.
This application can assist the academic functions in terms of student data storage to deliver
information on academic activities for students and parents or guardians. This system was built as a means of
improving the quality of education in schools as well as easy solutions for the SMAN 8. This system can
perform maintenance and management of process data into information useful in disseminating information on
student academic activities to parents

.Keywords : SMAN 8, Academic Information System, PHP, xHTML.

bagi

sistem informasi akademik yang dapat

dari

mengelola data yang terjadi di SMAN 8

kemajuan suatu bangsa terlihat pada

Surabaya. Selain itu terdapat kurangnya

kualitas

Di

komunikasi antara pihak sekolah dengan


Indonesia sekolah merupakan sarana untuk

wali murid. Selama ini komunikasi yang

meningkatkan kualitas pendidikan. Dalam

terjadi antara wali murid dengan pihak

pelaksanaan

sedikit

sekolah hanya terjadi pada saat acara

Teknologi

penerimaan rapot, yang diadakan dua kali

Informasi (TI) sehingga terdapat kendala


setiap semester. Karena itu wali murid

yang dihadapi yaitu berkaitan dengan

kurang mendapatkan informasi mengenai

pengawasan

wali

kegiatan akademik anaknya diantaranya

pendidikan

akademik

Pendidikan
kemajuan

sekolah


bangsa,

penting
karena

pendidikan

itu

pendidikan

yang

kunci

sendiri.

masih


menerapkan

murid

terhadap

anaknya.

Salah

satunya yang terjadi di SMAN 8 Surabaya.

nilai akademik dan kegiatan siswa di
sekolah.

Permasalahan yang terjadi di

Dengan adanya permasalahan yang

SMAN 8 Surabaya adalah belum adanya


ada di SMAN 8 surabaya, maka perlu
1

adanya suatu sistem informasi administrasi

dari suatu sistem adalah untuk mencapai

akademik

suatu

berbasis

web

dengan

tujuan


(goal)

dan

untuk

mencapai

menggunakan xHTML. Pemilihan aplikasi

menyebutkan

berbasis

sasaran (objectives).

web

dengan


menggunakan

ada

yang
suatu

xHTML karena dapat diakses melalui
perangkat

handphone

yang

dapat

digunakan

dimana


saja,

serta

Informasi
Menurut

Jogiyanto

(2005:8),

membutuhkan biaya yang murah. Hal

Informasi adalah data yang diolah menjadi

tersebut dapat mempermudah wali murid

bentuk yang lebih berguna dan lebih

mendapatkan informasi mengenai kegiatan


berarti bagi yang menerimanya. Sumber

akademik anaknya.

dari informasi adalah data. Data adalah

Dengan adanya penerapan sistem
administrasi
dengan

akademik

menggunakan

membantu

pihak

Surabaya


untuk

berbasis
xHTML

sekolah

web

kejadian-kejadian dan kesatuan nyata.

dapat

Kejadian-kejadian (event) adalah sesuatu

SMAN

mengolah

kenyataan yang menggambarkan suatu

8

yang terjadi pada saat tertentu.

data

administrasi akademik siswa menjadi suatu

Sistem Informasi

informasi yang dapat disampaikan kepada

Menurut Herlambang (2005:121),

wali murid dengan lebih cepat dan lebih

data adalah fakta-fakta atau kejadian-

baik. Dari informasi tersebut diharapkan

kejadian yang dapat berupa angka-angka

dapat membantu wali murid

dalam

atau kode-kode tertentu. Data masih belum

memantau kegiatan akademik anaknya di

mempunyai arti bagi penggunanya. Untuk

sekolah

dapat

agar

menjadi

siswa

yang

mempunyai

arti

data

diolah

sedemikian rupa sehingga dapat digunakan

berprestasi.

oleh penggunanya. Hasil pengolahan data
LANDASAN TEORI

inilah yang disebut sebagai informasi.

Sistem

Secara ringkas, Informasi adalah data yang
(2005:2),

telah diolah dan mempunyai arti bagi

Sistem adalah kumpulan dari elemen-

penggunanya. Sehingga sistem informasi

elemen yang berinteraksi untuk mencapai

dapat

suatu tujuan tertentu.

prosedur yang digunakan untuk mengolah

Menurut

Jogiyanto

Suatu sistem mempunyai maksud
tertentu. Ada yang menyebutkan maksud

data

didefinisikan

sehingga

dapat

sebagai

prosedur-

digunakan

oleh

penggunanya.
2

teks, dan komunikasi data. Pada tahun
1994,

sebuah

California

Sistem Informasi Akademik

perusahaan

bernama

kecil

Unwired

di

Planet,

Menurut Satoto (2009) Sistem

memulai penelitian untuk mengirim paket

Informasi Akademik adalah perangkat

data ke peralatan yang terhubung jaringan

lunak yang digunakan untuk menyajikan

wireless digital. Unwired Planet kemudian

informasi dan menata administrasi yang

memutuskan untuk membangun suatu

berhubungan dengan kegiatan akademis.

sistem yang mampu mengirimkan halaman

Dengan menggunakan perangkat lunak

informasi dari bahasa pengkodean ke

seperti

kegiatan

browser mobile dengan memanfaatkan

dikelola

protokol HTTP.

ini

administrasi

diharapkan
akademis

dapat

Pada tahun 1997, operator jaringan

dengan baik dan informasi yang diperlukan
dapat diperoleh dengan mudah dan cepat.

Omnipoint menawarkan servis informasi
data mobile dan mengundang perusahaan
untuk merealisasikannya. Hal ini direspon

World Wide Web (WWW)
Menurut Sidik dan Pohan (2007:1)

oleh

Nokia,

Ericson,

Unwired

dengan web, merupakan salah satu layanan

membentuk

yang didapat oleh pemakai komputer yang

gabungan

terhubung ke internet.

tersebut mengumumkan spesifikasi standar

informasi

dalam

internet,

dengan

yang

WAP

bekerja

dan

World Wide Web (WWW), lebih dikenal

Web pada awalnya adalah ruang

Planet,

Motorola,

Forum.

sama

Akhirnya

perusahaan-perusahaan

besar

Wireless Application Protocol (WAP)
versi 1.0.

menggunakan teknologi hypertext, yang
digunakan untuk menemukan informasi

xHTML MP

dengan mengikuti link yang disediakan
dalam dokumen web yang ditampilan
dalam browser web.

Menurut Jusak (2008) Extensible
Hypertext

Markup

Language

Mobile

Profile (xHTML MP) merupakan sebuah
bahasa markup yang didefinisikan dalam

Komunikasi Data Mobile

Wireless Application Protocol (WAP) 2.0.

Menurut Prasetyo (2005:3) Untuk
meningkatkan
telekomunikasi

fitur-fitur
digital,

sistem
ditambahkan

layanan-layanan seperti keamanan, pesan

yaitu sebuah protocol komunikasi untuk
aplikasi-aplikasi nirkabel yang dibuat oleh
WAP

forum.

gabungan

antara

xHTML
Hypertext

merupakan
Markup
3

Language
sebagai

(HTML)
bahasa

membuat

yang

digunakan

pemrograman

situs-situs

untuk

internet

dan

tentang cara manusia dan komputer saling
bekerjasama sehingga manusia merasa
puas dengan cara yang paling efektif.

Extensible Markup Language (XML).
Penambahan istilah Mobile Profile berarti

ANALISA PERANCANGAN SISTEM

xHTML

Sistem Flow Kehadiran

MP

merupakan

bahasa

Sistem

pemrograman yang dikhususkan untuk

flow

proses

kehadiran

membangun aplikasi-aplikasi yang dapat

melibatkan dua entitas yaitu TU dan guru.

dibaca

Proses dimulai pada saat guru menerima

melalui

perangkat-perangkat

mobile, seperti: telepon seluler(ponsel),

form

PDA ataupun smartphone. Jadi xHTML

melakukan

MP merupakan bagian dari xHTML.

menghasilkan

Karena itu sintaks dan aturan-aturan dalam

selanjutnya

menulis aplikasi dengan menggunakan

terabsensi ke TU. Setelah menerima form

xHTML MP mengikuti sintaks dan aturan

terabsensi dari guru, TU melakukan input

sebagaimana

data kehadiran yang akan menyimpan

mobile

pada

yang

xHTML.

dibangun

Aplikasi

menggunakan

absensi

dari
proses

kemudian

absensi

form
guru

TU,

yang

terabsensi

dan

menyerahkan

form

kedalam database transaksi kehadiran.

xHTML MP, selain dapat dibaca melalui
browser yang ada di dalam ponsel, juga
dapat dibaca melalui internet browser.

Interaksi Manusia dan komputer
Menurut Rizky (2007:3) Interaksi
Manusia

dan

Komputer

(IMK)

dideskripsikan sebagai sebuah disiplin
ilmu yang mempelajari desain, evaluasi,
implementasi

dan

sistem

komputer

interaktif untuk dipakai oleh manusia,
beserta studi tentang faktor- faktor utama

Gambar 1 Sistem Flow Proses Kehadiran

dalam lingkungan interaksinya. Deskripsi
IMK

menurut

Galitz

(2002)

dalam

Rizky(2007:3) adalah suatu ilmu yang
mempelajari

perencanaan

dan

desain
4

Context Diagram
Context diagram dari sistem informasi ini

Conceptual Data Model

seperti digambarkan pada gambar di

menggambarkan

bawah ini.

konsep struktur basis data yang dirancang

Sebuah

Conceptual

Data

secara

Model

keseluruhan

Process Model
Project: Tugas Akhir

untuk suatu program atau aplikasi.

Model : Sistem Informasi Administrasi Akademik
Author: Awad Achmad Hansyi Version 13/04/2011

Laporan Nilai
Rekap Pelanggaran

Guru

Laporan Kehadiran

BP

kelas
kd_kelas
nama_kelas
daya_tampung
tingkat

0

kd_guru
nama_g uru
inisial_g uru
sk
nuptk
jabatan
ag ama
jenkel
alamat
tempat_lahir
tang g al_lahir
telp_g uru
hp_g uru
status

kode kelas

transaksi_penilaian

Data Nilai

Data Pelanggaran

Data Guru

Jenis Pelanggaran

Data Kehadiran

Mata Pelajaran

guru

mata_pelajaran
kd_mata_pelajaran
nama_mata_pelajaran
tingkat

kode mata pelajaran

Sistem Informasi Administrasi
Akademik

Data Keuangan

Data Siswa

Data Kelas
Data Pembayaran

+
Laporan Pelanggaran
Siswa

Laporan Nilai

Bagian Kurikulum

Laporan Keuangan
Laporan Kehadiran

Gambar 2 Context Diagram

Dari context diagram diatas maka di break
down ke level 0 untuk melihat proses lebih

siswa
kd_siswa
nama_siswa
password
jenkel
alamat
ag ama
tempat_lahir
tang g al_lahir
tang g al_masuk
telp_siswa
status_keluarga
anak_ke
jml_saudara
asal_smp
no_sttb
tahun_sttb
nama_ayah
nama_ibu
pkj_ayah
pkj_ibu
alamat_ortu
telp_ortu
nama_wali
pkj_wali
alamat_wali
telp_wali
status

kd_siswa

kd_transaksi_penilaian
tahun
tug as
ulangan
uts
uas
nilai_akhir

kode guru

transaksi_kehadiran
kode siswa

kd_transaksi_kehadiran
tang gal

transaksi_pembayaran

kode siswa

kode siswa

kd_transaksi_spp
bulan
tahun
tang g al_bayar
status_bayar

transaksi_pelangg aran
kd_transaksi_pelang g aran
tangg al
keterang an

kode pelanggaran

jenis_pelangg aran
kd_pelangg aran
jenis_pelangg aran
point

detail lagi seperti gambar dibawah ini :
Data Keuangan

Gambar 4 CDM
Mata Pelajaran
Bagian Kurikulum

Simpan Data Kelas
Data Kelas

11Data Kelas

Simpan Mata Pelajaran

Guru

10
Mata pelajaran

Hasil dan Pembahasan

1
Data Guru

9 Data Guru
BP

Jenis Pelanggaran

Pengolahan Data Simpan Data Guru
1 Data Siswa

Siswa

+

Data Siswa

Simpan Data Siswa

Sebelum
kehadiran,

melakukan

proses

admin

terlebih

transaksi
dahulu

Jenis
2
Pelanggaran
Simpan jenis pelanggaran
2

melakukan proses login untuk melakukan

7Transaksi Kehadiran
Modul Kehadiran
Simpan Kehadiran Siswa

Data Kehadiran

validasi hak akses ke dalam sistem

3

Laporan Nilai siswa

Penilaian

T
5 ransaksi Penilaian

Data Nilai
Simpan Nilai Siswa
4

Data Pembayaran

Pembayaran
Transaksi
8
Pembayaran
Simpan Data Pembayaran

5

Modul Pelanggaran
Transaksi
6
Pelanggaran Siswa
Simpan Pelanggaran Siswa

Data Pelanggaran

6

7Transaksi Kehadiran

Laporan Keuangan

Laporan Kehadiran

Laporan Nilai
5Transaksi Penilaian

Laporan Kehadiran
Laporan Pelanggaran

Laporan Nilai Siswa

Laporan

Transaksi
6
Pelanggaran S
Laporan Pelanggaran Siswa

Rekap Pelanggaran
Laporan Nilai
poran Kehadiran

Gambar 5 Tampilan Form Login Admin

+
Laporan Pembayaran

Transaksi
8
Pembayara

Setelah proses login selesai, admin
melakukan proses transaksi kehadiran
dengan
memilih
menu
Transaksi

Gambar 3 DFD Level 0

5

Kehadiran sehingga
seperti Gambar 6

muncul

tampilan

Gambar 6 Tampilan halaman transaksi
kehadiran
Seteah proses kehadiran selesai, wali
murid atau siswa dapat melihat informasi
kehadiran siswa melalui mobile web
dengan cara melakukan proses login pada
halaman mobile web terlebih dahulu.

Gambar 8 Tampilan Menu Utama mobile
web
Setelah memilih Informasi kehadiran maka
akan muncul tampilan seperti pada Gambar
9

Gambar 7 Tampilan Halaman Login
mobile web
Jika siswa atau wali murid berhasil

Gambar 9 Tampilan Informasi Kehadiran

melakukan login, maka akan muncul menu
utama untuk memilih informasi mengenai
kehadiran,

keuangan,

pelanggaran, dan komunitas.

Kesimpulan
Kesimpulan yang dapat diambil

penilaian,
dari

hasil

evaluasi

Sistem

Informasi

Administrasi Akademik Siswa berbasis
web dengan menggunakan xHTML adalah
Sistem Informasi Administrasi Akademik
Siswa berbasis web ini telah dapat
6

memberikan informasi akademik mengenai
perkembangan dan aktivitas siswa bagi
siswa dan orangtua/wali.

Saran
Saran

untuk

pengembangan

sistem adalah sebagai berikut:
a. Menambahkan

proses

pendaftaran

Teknik Universitas
Diponegoro, Seminar
Nasional Aplikasi Sains dan
Teknologi, Yogyakarta.
Sidik, Betha dan Husni Iskandar
Pohan, 2007, Pemrograman
Web dengan HTML Disertai
lebih dari 200 contoh
program beserta tampilan
grafisnya, Informatika,
Bandung.

hingga proses raport dan prestasi siswa
pada sistem untuk halaman admin.
b. Menambahkan

proses

perizinan

kehadiran untuk halaman mobile web.

Daftar Pustaka
Davis,

G.B., 1974, Management
Information
System:
Conseptual
Foundations,
Structure and Development,
McGrew-Hill.

Effendy, Onong Uchjana, 1989,
Sistem Informasi Manajemen,
Tanpa Penerbit.
Herlambang, Soendoro, dan Haryanto
Tanuwijaya, 2005, Sistem
Informasi: konsep, teknologi,
dan manajemen, Graha Ilmu,
Yogyakarta.
Jusak, 2008, Kreasi Situs Mobile
Internet dengan xHTML MP,
Prestasi Pustaka.
Prasetyo, Didik Dwi, 2005, Aplikasi
Web Mobile Menggunakan
ASP.NET, Elex Media
Komputindo, Bandung.
Satoto, 2009, Analisis Keamanan
Sistem Informasi Akademik
Berbasis Web Di Fakultas
7