i
PENGEMBANGAN SISTEM INFORMASI PADA
PT JAMSOSTEK SURAKARTA
BERBASIS WEB MENGGUNAKAN HTML5
SKRIPSI
Disusun sebagai salah satu syarat menyelesaikan Program Studi Strata I
pada Program Studi Teknik Informatika Fakultas Komunikasi dan Informatika
Universitas Muhammadiyah Surakarta
Oleh :
RUSMONO
NIM : L200090141
PROGRAM STUDI TEKNIK INFORMATIKA
FAKULTAS KOMUNIKASI DAN INFORMATIKA
UNIVERSITAS MUHAMMADIYAH SURAKARTA
iv
DAFTAR KONTRIBUSI
Dengan ini saya menyatakan bahwa skripsi ini tidak terdapat karya yang
pernah diajukan untuk memperoleh gelar kesarjanaan di suatu Perguruan Tinggi,
dan sepanjang pengetahuan saya juga tidak terdapat karya atau pendapat yang
pernah ditulis atau diterbitkan oleh orang lain kecuali yang secara tertulis diacu
dalam naskah ini dan disebutkan dalam daftar pustaka.
Berikut saya sampaikan daftar kontribusi dalam penyusunan skripsi :
1. Perancangan program aplikasi website ini dengan bantuan internet dan buku
yang dilampirkan pada daftar pustaka.
2. Program aplikasi yang saya gunakan untuk membuat Aplikasi ini ialah
Macromedia Dreamweaver 8.0 yang di dalamnya sudah termasuk
komponen-komponen penting yang digunakan untuk membuat aplikasi web. Komponen
tersebut dapat dibagi dalam beberapa bagian yaitu:
a. Panel insert
b. Konversi script html5
c. Design Notes
d. Check browser compability
e. Revert ( Mengembalikan kondisi website seperti semula )
3. Saya menggunakan laptop dengan spesifikasi :
a. Prosesor Pentium(R) Dual-Core CPU T440 @ 2.20GHz
b. Hardisk 320 GB
vi
MOTTO DAN PERSEMBAHAN
MOTTO :
“ Jika kita melakukan sesuatu seperti hari terahir kita dapat melakukanya, kita
akan menciptakan sesuatu yang benar-benar besar akhirnya“
( Penulis)
“Sesungguhnya setelah kesusahan itu ada kemudahan, maka apabila kamu telah
selesai (dari suatu urusan) kerjakanlah dengan sungguh-sungguh (urusan) yang
lain dan hanya kepada Tuhanmu lah hendaknya kamu menggantungkan
pengharapan”
(Qs. Insyiroh 6-8)
PERSEMBAHAN :
Sebagai rasa syukur dan teriman kasih saya persembahkan karyaku ini kepada :
1. Kedua orang tuaku tercinta, Bapak Gimin Sugiyarto dan Ibu Siti Rokhayah
untuk kasih sayang yang tidak terbatas, untuk setiap petuah, setiap doa
yang dipanjatkan untuk kesuksesanku, serta dukungan moril dan
materiilnya yang tak akan pernah terbalaskan.
2. Kakak-kakakku khususnya Setya Waty yang telah memberikan dukungan
baik secara moril dan materiil yang tak akan pernah terbalaskan.
3. Thanks to My Red Roses Vera Andiana Sudarma yang selalu
vii
suasana, memberikan dukungan serta menjadi penyemangat bagi saya
selama ini.
4. Buat Budi Prasetya yang selalu bersedia meluangkan waktu untuk bertukar
ilmu.
5. Teman-teman Matikep, Punokawan, San Siro, Kumis Jaya teman
mengarungi suka duka menjadi mahasiswa selama kurang lebih 3,5 tahun.
6. Teman-teman kontrakan Karangasem yang selalu ada disaat suka maupun
duka, serta teman satu perjuangan ketika harus memikul beban untuk
membayar tunggakan listrik dan air berbulan-bulan.
7. Semua pihak yang selalu ada di sekelilingku yang tidak bisa kusebutkan
satu persatu.
viii
KATA PENGANTAR
Alhamdulillah, kami panjatkan syukur kehadirat Allah SWT yang telah
melimpahkan rahmat dan hidayah-Nya sehingga penulis dapat menyelesaikan
skripsi ini dengan judul “Sistem Informasi Kepegawaian PT Jamsostek Surakarta
Menggunakan HTML5 Berbasis Web”.
Skripsi ini disusun untuk memenuhi kurikulum pada Program Studi
Teknik Informatika Universitas Muhammadiyah Surakarta, sebagai kewajiban
mahasiswa dalam rangka menyelesaikan program sarjana.
Penulis menyadari bahwa skripsi ini masih jauh dari kesempurnaan, oleh
karena itu kritik saran yang membangun dari berbagai pihak sangat penulis
harapkan demi perbaikan-perbaikan ke depan.
Terwujudnya skripsi ini tidak lepas dari bantuan berbagai pihak. Oleh
karena itu dalam kesempatan ini penulis ingin mengucapkan terima kasih yang
sebesar-besarnya kepada :
1. Bapak Husni Thamrin, S.T, MT., Ph.D. selaku Dekan Fakultas
Komunikasi dan Informatika Universitas Muhammadiayah Surakarta.
2. Bapak Dr. Heru Supriyono, S.T., M.Sc. selaku Ketua Jurusan Teknik
Informatika Universitas Muhammadiayah Surakarta.
3. Ibu Endah Sudarmilah, S.T, M.Eng selaku pembimbing akademik selama
ix
4. Ibu Umi Fadlillah, S.T., M.Eng selaku pembimbing I yang telah
memberikan, bimbingan, dan pengarahan kepada penulis sehingga dapat
menyelesaikan tugas akhir ini.
5. Ibu Irma Yuliana, S.T., M.M selaku pembimbing II yang telah
memberikan, bimbingan, dan pengarahan kepada penulis sehingga dapat
menyelesaikan tugas akhir ini.
6. Segenap dosen dan karyawan prodi Teknik Informatika atas bantuan dan
ilmu yang diberikan kepada penulis selama masa perkuliahan hingga
dinyatakan mendapat gelar Strata 1.
7. Kepada orang tua yang selalu memberikan do’a, semangat dan motivasi
dengan tiada hentinya kepada penulis.
8. Semua pihak yang tidak bisa disebutkan satu-persatu yang telah membantu
hingga terselesainya skripsi ini.
Akhirnya penulis berharap semoga skripsi ini berguna bagi semua pihak
dan bermanfaat bagi penulis khususnya dan pembaca pada umumnya dalam
menambah pengetahuan dan wawasan ilmu. Amin.
Surakarta, Januari 2013
x DAFTAR ISI
Halaman Judul ... i
Halaman Persetujuan ... ii
Halaman Pengesahan ... iii
Daftar Kontribusi ... iv
Motto dan Persembahan ... vi
Kata Pengantar ... vii
Daftar Isi ... x
Daftar Tabel ... xiv
Daftar Gambar ... xv
Abstraksi ... xviii
BAB I PENDAHULUAN ... 1
1.1. Latar Belakang Masalah ... 1
1.2. Rumusan Masalah ... 2
1.3. Batasan Masalah ... 2
1.4. Tujuan Penelitian ... 3
1.5. Manfaat Penelitian ... 3
1.6. Sistematika Penulisan ... 4
BAB II TINJAUAN PUSTAKA ... 6
2.1. Telaah Penelitian ... 6
2.2. Landasan Teori ... 7
xi
2. Fungsi dan Tujuan Sistem Informasi ... 8
3. Desain Sistem Informasi ... 8
4. Proses Sistem Informasi ... 9
5. HTML5 ... 9
6. Jamsostek ... 10
7. Web Browser ... 10
8. Dreamweaver ... 11
2.3. Penggunaan Notasi ... 11
2.4. Penilaian Kuisioner ... 12
BAB III METODE PENELITIAN ... 14
3.1. Waktu dan Tempat ... 14
3.2 Peralatan Utama dan Pendukung ... 15
A. Perancangan dan Pembuatan ... 15
1. Software ... 15
2. Hardware ... 15
B. Pengujian ... 15
3.3 Alur Penelitian ... 16
3.4 Perancangan Aplikasi ... 18
A. Metode Pengumpulan Data ... 18
1. Metode Dokumentasi ... 18
2. Metode Studi Pusataka ... 18
B. Desain Secara Umum ... 18
xii
2. Desain Database ... 21
3. Entity Relationship Diagram ( ERD ) ... 27
4. Use Case Diagram ... 29
3.5. Desain Secara Terperinci ... 31
A. Halaman Menu Awal ... 31
1. Halaman Profil ... 31
2. Halaman Peserta ... 32
3. Halaman user ... 33
4. Halaman Program ... 34
5. Halaman Pegawai ... 35
6. Halaman Gallery ... 35
B. Halaman Menu Admin ... 36
1. Halaman Menu Login ... 36
2. Halaman Menu ... 37
3. Halaman Menu Berita ... 37
4. Halaman Menu Agenda ... 37
5. Halaman Menu Upload ... 38
6. Halaman Menu Jabatan ... 38
7. Halaman Menu Pegawai ... 38
8. Halaman Menu Peserta ... 38
xiii
BAB IV HASIL DAN PEMBAHASAN ... 40
4.1. Hasil Penelitian ... 40
4.2. Halaman Menu Utama ... 40
A. Halaman Home ... 40
B. Halaman Profil ... 42
C. Halaman Peserta ... 43
D. Halaman User ... 44
E. Halaman Program ... 45
F. Halaman Pegawai ... 47
G. Halaman Gallery ... 48
4.3. Halaman Menu Admin ... 49
A. Halaman Login ... 49
B. Halaman Menu Admin ... 49
C. Halaman Menu Berita ... 50
D. Halaman Menu Agenda ... 51
E. Halaman Menu Upload ... 52
F. Halaman Menu Jabatan ... 53
G. Halaman Menu Pegawai ... 55
H. Halaman Buku Tamu ... 56
I. Halaman Menu Peserta ... 57
4.4. Pengujian Aplikasi ... 59
4.5. Analisis dan Pembahasan ... 75
xiv
Kekurangan ... 76
BAB V PENUTUP ... 78
5.1. Kesimpulan ... 78
5.2. Saran ... 78
DAFTAR PUSTAKA ... 80
LAMPIRAN DAFTAR TABEL Tabel 2.1 : Simbol Data Flow Diagram (DFD) ... 12
Tabel 3.1 : Tabel User ... 21
Tabel 3.2 : Tabel Berita ... 22
Tabel 3.3 : Tabel Agenda ... 23
Tabel 3.4 : Tabel Upload ... 24
Tabel 3.5 : Tabel Pegawai ... 24
Tabel 3.6 : Tabel Jabatan ... 25
Tabel 3.6 : Tabel Peserta ... 26
Tabel 3.6 : Tabel Buku Tamu ... 27
Tabel 4.1 : Tabel hasil pengisian angket user ... 60
Tabel 4.2 : Tabel jumlah skoring user ... 62
Tabel 4.3 : Tabel hasil pengisian angket admin ... 68
xv
DAFTAR GAMBAR
Gambar 3.1 : Flowchart Penelitian ... 17
Gambar 3.2 : Data Flow Diagram Level 0 Aplikasi ... 19
Gambar 3.3 : Data Flow Diagram Level 1 Aplikasi ... 20
Gambar 3.4 : Entity Relationship Diagram ( ERD ) ... 28
Gambar 3.5 : Use Case Diagram ... 30
Gambar 3.6 : Perancangan Menu Awal ... 31
Gambar 3.7 : Perancangan Halaman Profil Perusahaan ... 32
Gambar 3.8 : Perancangan Halaman Struktur Organisasi ... 32
Gambar 3.9 : Perancangan Halaman Peserta ... 33
Gambar 3.10 : Perancangan Halaman Download ... 33
Gambar 3.11 : Perancangan Halaman Kotak Saran ... 34
Gambar 3.12 : Perancangan Halaman JHT, JPK, JKK, dan JK ... 34
Gambar 3.13 : Perancangan Halaman Tabel Pegawai dan Tabel Agenda ... 35
Gambar 3.14 : Perancangan Halaman Gallery ... 36
Gambar 3.15 : Perancangan Halaman Login ... 36
Gambar 3.16 : Perancangan Halaman Menu ... 37
Gambar 3.17 : Perancangan Halaman Menu Berita, Menu Agenda, Menu Upload, Menu Jabatan, Menu Pegawai, Menu Peserta, dan Menu Buku Tamu ... 39
Gambar 4.1 : Halaman Home ... 40
Gambar 4.2 : Kolom Berita ... 41
xvi
Gambar 4.4: Halaman Profil Perusahaan ... 42
Gambar 4.5 : Struktur Organisasi ... 43
Gambar 4.6 : Halaman Peserta ... 43
Gambar 4.7 : Halaman Download ... 44
Gambar 4.8 : Halaman Buku Tamu ... 44
Gambar 4.9 : Halaman Jaminan Hari Tua ... 45
Gambar 4.10 : Halaman Jaminan Pemeliharaan Kesehatan ... 45
Gambar 4.11 : Halaman Jaminan Kecelakaan Kerja ... 46
Gambar 4.12 : Halaman Jaminan Kematian ... 46
Gambar 4.13 : Halaman Tabel Pegawai ... 47
Gambar 4.14 : Halaman Tabel Agenda ... 47
Gambar 4.15 : Halaman Gallery ... 48
Gambar 4.16 : Halaman Slide Foto ... 48
Gambar 4.17 : Halaman Login ... 49
Gambar 4.18 : Halaman Menu Admin ... 49
Gambar 4.19 : Halaman Daftar Berita ... 50
Gambar 4.20 : Halaman Tambah Berita ... 50
Gambar 4.21 : Halaman Edit Berita ... 51
Gambar 4.22 : Halaman Daftar Agenda ... 51
Gambar 4.23 : Halaman Tambah Agenda ... 52
Gambar 4.24 : Halaman Daftar Upload ... 52
Gambar 4.25 : Halaman Tambah Upload ... 53
xvii
Gambar 4.27 : Halaman Tambah Jabatan ... 54
Gambar 4.28 : Halaman Edit Jabatan ... 54
Gambar 4.29 : Halaman Daftar Pegawai ... 55
Gambar 4.30 : Halaman Tambah Pegawai ... 56
Gambar 4.31 : Halaman Edit Pegawai ... 56
Gambar 4.32 : Halaman Daftar Buku Tamu ... 57
Gambar 4.33 : Halaman Balas Buku Tamu ... 57
Gambar 4.34 : Halaman Tambah Peserta ... 58
Gambar 4.35 : Halaman Perbaharui Data Peserta ... 58
Gambar 4.36 : Halaman List Peserta ... 59
Gambar 4.37 : Prosentase Kelompok Responden user ... 63
xviii ABSTRAKSI
Kantor Jamsostek Surakarta (persero) merupakan salah satu instansi yang
bergerak dibidang jaminan sosial ketenagakerjaan yang memberikan pelayanan kepada
pegawai. Sistem informasi merupakan hal yang sangat pokok pada kegiatan financial
sebuah instansi, karena hal tersebut sangat berpengaruh terhadap kinerja para pegawai.
Tujuan dibuatnya sistem informasi kepegawaian berbasis web ini adalah untuk dapat
menghasilkan suatu sumber informasi yang cepat, akurat, tepat guna juga efektif dan
efisien sesuai dengan perkembangan teknologi saat ini.
Peneliti menggunakan metode research & development dalam melakukan
penelitian. Metode research & development yaitu metode penelitian yang digunakan
untuk menghasilkan produk tertentu, dan menguji keefektifan produk. Perancangan &
pembangunan sistem dilakukan dengan proses pembuatan DFD, flowchart dan
diimplementasikan menggunakan aplikasi Dreamweaver8. Hasil yang didapat dalam
penilaian melalui kuisioner yang telah diujikan di PT Jamsostek (persero) Surakarta, Jawa
Tengah didapat kesimpulan lebih dari 80% user dan admin menjawab sangat setuju
bahwa sistem informasi berbasis web ini dapat dijadikan sebagai media memperoleh
informasi yang cepat dan akurat.
