Perancangan Sistem Informasi Arsip Salatiga Berbasis

Web dengan Codelgniter dan

Materialize
(Studi Kasus: Perpustakaan dan Arsip Daerah Kota
Salatiga)

Artikel Ilmiah

Peneliti:
Yosephin Dwi Tatalia (672012123)
Nina Setiyawati, S.Kom., M.Cs.

Program Studi Teknik

Informatika Fakultas Teknologi
Informasi Universitas Kristen
Satya Wacana Salatiga
Juli 2016
Perancangan Sistem Informasi Arsip Salatiga Berbasis
Web dengan Codelgniter dan
Materialize
(Studi Kasus: Perpustakaan dan Arsip Daerah Kota
Salatiga)

Artikel Ilmiah
Diajukan kepada
Fakultas Teknologi lnformasi
untuk Memperoleh Gelar Sarjana Komputer

Peneliti:
Yosephin Dwi Tatalia (672012123)
Nina Setiyawati, S.Kom., M.Cs.

Program Studi Teknik Informatika

Fakultas Teknologi Informasi
Universitas Kristen Satya Wacana
Salatiga
Juli 2016
 PR P U S T A AN UNIERSIT45
UNIVFRSIT AS KRISTE SATY4 ' AC A+
pi [veges ' ' at s
us enan then
el 0mos 1' "
Emal bbere tr aits el hap re ask re la

PERNYATAAN PERSETUJUAN AKSES

Saya yang bertanda tangan di bawah ini:

Nama
NIM Email
Fakultas Te»oloi [nfcrmasi Program Studi Tekoi [rEro@fig
Judul tugas akhir eranconogn Sirfem [ncocoogi _Arsip__ Sala+a Ber~avg_'cg
den9on Cdelgnifer dan_ [la[ec@a[i2e

Dengan ini saya menyerahkan hak non-eksklusif kepada Perpustakaan Universitas -- Universitas Knsten Sary
a Wacana untuk menyimpan, mengatur akses serta melakukan pengelolaan terhadap karya saya ini
dengan mengacu pada ketentuan akses tugas akhir elektronik sebagai berikut (beri tanda pada kotak yang
sesus):

] a. Saya mengijinkan karya tersebut diunggah ke dalam aplikasi Repositori Perpustakaan Universitsa
,
dan/atau portal GARUDA
[]b. Saya tidak mengijinkan karya tersebut diunggah ke dalam aplikasi Repositori Perpustakaan
Univ ersitas. dan/atau portal GARUDA

• lak yang tidak terbatas hanya bagi satu pihak saja. Pengajar, peneliti, dan mahasiswa yang menyerahkan hal non-
ekshsifkepeda
Repositori Perpustakaan Universitas saat mengumpulkan hasil karya mereka masih memiliki hak copyright atas karya
tersebat
•• Hamya akan menamp ilkan halaman judul dan abstrak Pilihan ini harus dilampiri dengan penjelasan! alasan tertulis dri pembunbeg
T4 dan diketahuui oleh pimpinanfakultas (dekankap rodi).

Demikian pernyataan ini saya buat dengan sebenamya.

Salatiga, 33 Sep'eler !%

Mengetahui, T
• anda tangan

F-LIB-081
Tanda tangan & nama terang pembmmbmg l
na
• ma terurg mhcow
 PERPUSTAKAAN UNIVERSITAS
UNIVERSITAS KRISTEN SATYA WACANA
Jl. Diponegor 52 60 Slatiga 50711
JawaTengah, Indonesia
Telp. 0298 321212, Fax. 0298 321433
Email: library@adm.uksw.edu ; http://library.uksw.edu

PERNYATAAN TIDAK PLAGIAT

Saya yang bertanda tangan di bawah

ini: Nama

NIM c1200223 Email (o72012\23@uden.ukrt.ed

Fakultas Program Studi Tekn; (nrormoika

Judul tugas akhir

(S+di Kasas : erpulakaan dan Aoip Daeroh oto Sal@+i9a_)

Pembimbing

2.

Dengan ini menyatakan

bahwa:

1. Hasil karya yang saya serahkan ini adalah asli dan belum pernah diajukan untuk mendapatkan
gelar kesarjanaan baik di Universitas Kristen Satya Wacana maupun di institusi pendidikan lainnya.

2. Hasil karya saya ini bukan saduran/terjemahan melainkan merupakan gagasan, rumusan, dan
hasil pelaksanaan penelitian/implementasi saya sendiri, tanpa bantuan pihak lain., kecuali arahan
pembimbing akademik dan narasumber penelitian.

3. Hasil karya saya ini merupakan hasil revisi terakhir setelah diujikan yang telah diketahui dan disetujui
oleh pembimbing.

4. Dalam karya saya ini tidak terdapat karya atau pendapat yang telah ditulis atau dipublikasikan orang
lain, kecuali yang digunakan sebagai acuan dalam naskah dengan menyebutkan nama pengarang dan
dicantumkan dalam daftar pustaka.

Pernyataan ini saya buat dengan sesungguhnya. Apabila di kemudian hari terbukti ada penyimpangan dan
ketidakbenaran dalam pemyataan ini maka saya bersedia menerima sanksi akademik berupa pencabutan
gelar yang telah diperoleh karena karya saya ini, serta sanksi lain yang sesuai dengan ketentuan yang
berlaku di Universitas Kristen Satya Wacana.

Salati

Tanda tangan & nama terang mahasiswa

F-LIB-080
Perancangan Si stem Informasi Arsip Salatiga Ber basis Web
dengan
Codelgniter dan
Materialize
(Stu di Kasus: Perpustakaan dan Arsip Daerah Kota Salatiga)

Oleh,

Yosephin Dwi Tatalia

NIM: 672012123

ARTIKEL ILMIAH

Diajukan Kepada Program Studi Teknik Informatika guna memenuhi sebagian

dari persyaratan untuk mencapai gelar Sarjana Komputer

Disetujui oleh,

Nina Setiyawati, S Kom,

M.Cs, Pembimbing

e
Dwiketahui
oleh

FAKULTAS TEKNOLOGI INFORMASI

UNIVERSITAS KRISTEN SATYA
WACANA SALATIGA
2016
 Lembar Pengesahan
Judul Tugas Akhir : Perancangan Sistem Informasi Arsip Salatiga Berbasis
Web dengan Code/gniter dan Materialize (Studi Kasus:
Perpustakaan dan Arsip Daerah Kota Salatiga)
Nama Mahasiswa : Yosephin Dwi Tatalia
NIM : 672012123
Program Studi : Teknik Informatika
Fakultas : Teknologi Informasi

Nina Setiyawati, S.Kom.,

M.Cs.
Pembimbing

Dr. D
a Program Studi

Dinyatakan Lulus tanggal: 9 September 2016

Reviewer:

• Suprihadi, S.Si., M.Kom.

 FAKULTAS TEKNOLOGI INFORMASI
UNIVERSITAS KRISTEN SATYA
WACANA Jalan Diponegoro 52 - 60
Phone. (0298) 321212 (Hunting)
Fax. (0298) 321433
E-mail: fti@uksw.edu
Salatiga 50711 -- INDONESIA

LEMBAR PERSETUJUAN PUBLISH

JURNAL

Dengan mempertimbangkan isi dari jumal mahasiswa

: Nama Mahasiswa : osephin Doi Ta€a\i

NIM : G7200203

Makajurnal ini
dinyatakan:

s 4

LAYAK TERBIT/ TIDAK LAYAK

TERBIT

• Pembimbing l Pembimbing 2

Mengetahui,

Reviewer
Perancangan Sistem Informasi Arsip Salatiga Berbasis
Web dengan Codelgniter dan
Materialize
(Studi Kasus: Perpustakaan dan Arsip Daerah
Kota
Salatiga)
I) Yosephin Dwi Tatalia, Nina Setiyawati
Fakultas Teknologi Informasi Universitas
Kristen Satya Wacana
Jl. Diponegoro 52-60, Salatiga 50711, Indonesia
Email: '672012123@student.uksw.edu,
"nina.setiyawati@staff.uksw.edu

Abstract
The library and archive of Salatiga City Area provides information about
the
collections of the archives about Salatiga City in the form of photo archives,
textual archives, book archives and documentaryfilm archives. Storage ofthe
information on the Archive collection ofSalatiga has not been centralized and are still
separated so that the process of management and the rediscovery of the archival
experience difficulties as well as information generated less rapidly and appropriately.
Information archive of Salatiga is only accessible in the scope of the library only
cause limited access spaces for people to get information about the archives of
Salatiga. Based on those problems then made design of web-based information
system for archives of Salatiga. A method of designing system using Prototype
Model. The system is built using Codelgniter framework with architectural pattern
MVC and Materialize CSS for building web responsive. The result is a web-based
information system that is able to manage archives and providing information the
collections ofthe archives ofSalatiga to society.

Keyword : Archive, Information Systems, Web, Codelgniter,

Materialize.

Abstrak
Perpustakaan dan Arsip Daerah Kota Salatiga menyediakan informasi mengenai
koleksi arsip tentang Kota Salatiga dalam bentuk arsip foto, arsip tekstual, arsip buku dan
arsip film dokumenter. Penyimpanan informasi mengenai koleksi arsip Salatiga belum
terpusat dan masih terpisah sehingga proses pengelolaan dan penemuan kembali arsip
mengalami kesulitan serta informasi yang dihasilkan kurang cepat dan tepat.
Informasi arsip Salatiga hanya dapat diakses di ruang lingkup perpustakaan saja
menyebabkan terbatasnya ruang akses bagi masyarakat untuk mendapatkan informasi
mengenai arsip Salatiga. Berdasarkan masalah tersebut maka dilakukan perancangan
sistem informasi berbasis web untuk arsip Salatiga. Metode perancangan sistem
menggunakan Prototype Model. Sistem dibangun menggunakan framework
Codelgniter dengan pola arsiktektur MVC serta Materialize CSS untuk membangun
web responsive. Hasil yang diperoleh adalah sebuah sistem informasi berbasis web
yang mampu mengelola arsip dan memberikan informasi mengenai koleksi arsip
Salatiga kepada masyarakat.

Kata Kunci : Arsip, Sistem Informasi, Web, Codelgniter,

Materialize.
t) Mahasiswa Fakultas Teknologi Informasi Jurusan Teknik Informatika, Universitas
Kristen
Satya Wacana Salatiga
) Staff Pengajar Fakultas Teknologi Informasi, Universitas Kristen Satya Wacana
Salatiga.
1. Pendahuluan
Perpustakaan dan Arsip Daerah Kota Salatiga merupakan tempat untuk
mencari ilmu dan mencari beberapa referensi buku untuk dibaca maupun
dipinjam. Perpustakaan dan Arsip Daerah Kota Salatiga juga menyediakan
informasi mengenai koleksi arsip tentang Kota Salatiga. Arsip adalah segala
kertas naskah, buku, foto, film, mikrofilm, rekaman suara, gambar peta, bagan,
atau dokumen-dokumen lain dalam segala macam bentuk dan sifatnya, aslinya
atau salinannya, serta dengan segala cara penciptaannya, dan yang dihasilkan atau
diterima oleh suatu badan, sebagai bukti atas tujuan, organisasi, fungsi-fungsi,
kebijaksanaan-kebijaksanaan, keputusan-keputusan, prosedur-prosedur,
pekerjaan-pekerjaan, atau kegiatan-kegiatan pemerintah yang lain, atau karena
pentingnya informasi yang terkandung di dalamnya [1]. Arsip Salatiga berisi
informasi mengenai makanan khas Salatiga, tradisi khas Salatiga, orang-orang
temama yang berasal dari Salatiga serta Salatiga tempo dulu.
Koleksi arsip Salatiga yang ada meliputi arsip foto, arsip tekstual, arsip
buku dan arsip film dokumenter. Arsip buku dan arsip film dokumenter disimpan
dalam rak. Beberapa arsip foto dan arsip tekstual telah dialih media ke bentuk
arsip elektronik kemudian disimpan dalam harddisk. Penyimpanan arsip Salatiga
masih terpisah dan pendeskripsian arsip tersebut disimpan dalam buku atau
bentuk dokumen word atau excel. Hal tersebut menyebabkan proses pengelolaan
dan penemuan kembali arsip mengalami kesulitan serta informasi yang dihasilkan
kurang cepat dan tepat. Koleksi arsip mengenai Kota Salatiga tempo dulu yang
merupakan arsip kuno merupakan berkas yang dijaga kelestariannya karena
jumlahnya yang terbatas dan nilai sejarah yang terkandung didalamnya.
Informasi arsip Salatiga tersebut hanya dapat diakses di ruang lingkup
perpustakaan saja. Tidak semua arsip boleh dipinjamkan untuk dibawa ke luar
wilayah perpustakaan kecuali dengan surat izin, hanya beberapa arsip seperti arsip
buku saja yang boleh dipinjam. Hal tersebut menyebabkan terbatasnya ruang
akses bagi masyarakat untuk mendapatkan informasi mengenai arsip Salatiga.
Berdasarkan latar belakang masalah yang ada, maka dirancanglah sebuah
sistem informasi kearsipan berbasis web untuk arsip Salatiga sehingga
mempermudah layanan penyajian arsip, pengelolaan arsip, pengelompokan arsip
dan pencetakan laporan, serta mempercepat proses pencarian dan penemuan
kembali arsip ketika dibutuhkan. Sistem informasi tersebut bisa diakses kapan
saja dan dimana saja melalui web sehingga memudahkan masyarakat
untuk memperoleh informasi mengenai koleksi arsip-arsip tersebut tanpa harus
datang langsung ke perpustakaan. Dengan adanya sistem informasi arsip Salatiga
ruang akses bagi masyarakat untuk mendapatkan informasi mengenai koleksi
arsip tersebut menjadi lebih luas sehingga fungsinya mampu menggantikan fisik
arsip. Hal tersebut dapat menghindari hilangnya arsip serta mengurangi
tingkat kerusakan arsip.
Sistem informasi arsip Salatiga dibangun menggunakan
framework Codelgniter dengan pola arsiktektur model view controller
(MVC). Dengan Codelgniter perancangan sistem dapat berjalan lebih cepat
dan lebih terstruktur serta efisien dalam mengelola data yang banyak. Sistem
informasi arsip Salatiga juga dibangun dengan menerapkan Responsive Web
Design yang merupakan suatu
konsep perancangan tampilan web yang akan meyesuaikan layar browser untuk
menampilkan website [2]. Pembuatan antarmuka sistem
menggunakanframework Materialize CSS untuk membangun web responsive.
Materialize menggunakan sistem grid 12 fluid kolom, sehingga web memiliki
kemampuan merespon ukuran halaman sesuai dengan lebar layar device
yang digunakan dan dapat menyesuaikan tampilan dari berbagai device tanpa
merusak tampilan web. Materialize menyediakan beberapa class untuk
kustomisasi tampilan serta menyediakan JavaScript API

2. Kajian
Pustaka
Pada penelitian dengan judul "Sistem Informasi Kearsipan" bahwa sistem
dibangun menggunakan basisdata MySQL untuk menyimpan data arsip sehingga
dapat digunakan kapan saja dan dirancang agar dapat membeikan informasi
kearsipan dengan lengkap. Adanya Sistem Informasi Kearsipan memudahkan
dalam melakukan update (edit, hapus dan cari) data yang diperlukan dengan
cepat, khususnya untuk arsip masuk dan keluar [3].
Pada penelitian lain dengan judul "Pembuatan Sistem Informasi Berbasis
Website pada SD Masjid Syuhada Yogyakarta Menggunakan Framework
Codelgniter dan Bootstrap" bahwa pengembangan sistem yang dibuat dengan
framework Codelgniter akan lebih mudah terkait dengan penulisan kode
yang lebih terstruktur. Dengan menggunakan Bootstrap, sistem dapat tampil
sesuai dengan ukuran media perambahnya baik menggunakan PC desktop
maupun device baik dari smartphone, tablet, dan laptop [4].
Berdasarkan penelitian terdahulu tersebut, maka dilakukan penelitian yang
menghasilkan sebuah sistem informasi arsip Salatiga berbasis web yang dibangun
dengan Codelgniter dan Materialize. Sistem tersebut diharapkan dapat
mempercepat proses penemuan kembali arsip serta memberikan kemudahan
dalam mengelola arsip dan mengakses informasi mengenai arsip Salatiga melalui
berbagai device.
Arsip adalah rekaman kegiatan atau peristiwa dalam berbagai bentuk dan
media sesuai dengan perkembangan teknologi informasi dan komunikasi yang
dibuat dan diterima oleh lembaga negara, pemerintahan daerah, lembaga
pendidikan, perusahaan, organisasi politik, organiasi kemasyarakatan, dan
perseorangan dalam pelaksanaan kehidupan bermasyarakat, berbangsa, dan
bemegara Undang-Undang Nomor 43 Tahun 2009 pasal 1 [5]. Arsip adalah suatu
kumpulan dokumen yang disimpan secara sistematis karena mempunyai suatu
kegunaan agar setiap kali diperlukan dapat secara cepat ditemukan kembali [6].
Sistem informasi adalah suatu sistem disuatu organisasi yang
mempertemukan kebutuhan pengolahan transaksi harian, mendukung operasi,
bersifat menejerial dan kegiatan strategi dari suatu organisasi dan menyediakan
pihak luar tertentu dengan laporan-laporan yang diperlukan [7].
Secara umum, Sistem Informasi Kearsipan adalah suatu sistem informasi
yang mengelola data yang menyangkut pengumpulan, pengelolaan,
pemusnahan,
pencetakan laporan dan pencarian kembali arsip yang berbasis komputer sehingga
mampu mengelola arsip dengan lebih efektif dan efesien dan pada akhimya
dapat
memberi masukan informasi secara aktual dan akurat tentang perumusan

2
kebijakan, strategi dan program pembangunan [8]. Sistem lnformasi Kearsipan
merupakan perangkat-perangkat yang saling berinteraksi dalam pengolahan data
kearsipan untuk mencapai tujuan dari fungsi kearsipan, yaitu penyimpanan,
penataan, pengelompokan, pengendalian dan pemeliharaan kearsipan [9].
Codelgniter adalah aplikasi open source yang berupa framework
dengan
model MVC untuk membangun website dinamis dengan PHP.
Codelgniter
tergolong framework dengan ukuran kecil dan cukup mudah untuk
dikuasai. Codelgniter juga datang dengan manual tergolong lengkap. Proses data
mengalir pada sistem yang menggunakan Codelgniter dapat diilustrasikan
pada gambar
berikut [10] :

-+EH EI • <EH
<> EE

•
♦ Application <+ El
<EE < View
Controller
<+ I
< LEE7
<+
Gambar 1 Alur Proses Data pada Codelgniter
[10]

Keterangan :
• Index.php berfungsi sebagai pengendali awal, menginisialisasi sumber
daya utama yang dibutuhkan Codelgniter.
• Router memeriksa paket HTTP request untuk menentukan aksi apa yang
harus dilakukan oleh sistem.
• Jika tersedia, maka halaman langsung dikirim ke browser, eksekusi sistem
yang normal akan dilewati.
• Security. Sebelum Application Controller dieksekusi, paket HTTP
request dan semua data yang dikirirnkan pengguna akan disaring
terlebih dahulu oleh Security Class.
• Application Controller menginisialisasi model, library utama, helpers dan
semua sumber daya yang dibutuhkan untuk setiap request.
• Antarmuka aplikasi (view) yang sudah disiapkan dikirimkan ke browser.
Jika caching diaktifkan, maka view akan disimpan sementara untuk
request
yang sama berikutnya.
Materialize adalah sebuah responsive CSS framework yang
dibangun
berdasarkan konsep material design, yaitu penggabungan prinsip-prinsip desain
klasik yang dipadukan dengan inovasi dan teknologi [11]. Materialize CSS telah
dibuat berbagai macam plugin yang dikemas menjadi suatuframework yang
baik secara tampilan dan fungsi. Framework responsive ini menggunakan
system grid
12 fluid kolom dan menyediakan beberapa class untuk kustomisasi tampilan
tabel, button, pre-loaders dan lain-lain serta menyediakan JavaScript API untuk
menampilkan drop downs, modals, parallax dan tabbed navigation.
3
3. Metode dan Perancangan Sistem
Dalam merancang sistem informasi arsip Salatiga melalui tahapan
penelitian yang terbagi dalam empat tahapan, yaitu: 1) Identifikasi masalah, 2)
Perancangan sistem, 3) Implementasi sistem, dan 4) Pengujian sistem dan analisis
hasil pengun1an.

ldentifikasi Masalah

Perancangan Sistem

lmplementasi Sistem

Pengujian Sistem dan Analisis Hasil Pengujian

Gambar 2 Tahapan Penelitian

Tahapan penelitian pada Gambar 2 dapat dijelaskan sebagai berikut:

1) Tahap pertama: Identifikasi Masalah, pada tahap ini dilakukan
identifikasi terhadap permasalahan yang ada dengan melakukan wawancara,
mendapatkan data dan literatur yang terkait dengan sistem kearsipan,
framework Codelgniter dan Materialize CSS serta mengamati proses bisnis
terkait proses pengarsipan arsip Salatiga. 2) Tahap kedua, Perancangan
Sistem, tahap ini dilakukan perancangan sistem yang meliputi perancangan
proses menggunakan diagram Unified Modelling Language (UML) dan
perancangan database. Perancangan proses menggunakan UML meliputi use
case diagram, activity diagram, dan class diagram. 3) Tahap ketiga: Implementasi
Sistem, yaitu membuat sistem informasi berbasis web menggunakan framework
Codelgniter dan Materialize CSS sesuai perancangan proses pada tahap kedua.
4) Tahap keempat: Pengujian sistem dan Analisis Hasil Pengujian, selanjutnya
dari hasil implementasi akan dilakukan pengujian untuk melihat apakah sistem
yang telah dibuat sudah sesuai dengan yang diharapkan atau tidak ada error,
jika belum sesuai maka akan dilakukan perbaikan.
Pada tahap pengidentifikasi masalah, wawancara dilakukan dengan
cara
tanya jawab dengan Seksi Bina Perpustakaan dan Kearsipan di Perpustakaan
dan Arsip Daerah Kota Salatiga. Berdasarkan hasil wawancara permasalahan
yang ada didefinisikan sebagai berikut: 1) Dibutuhkannya sistem untuk
mengelola arsip Salatiga meliputi arsip foto, arsip tekstual, arsip buku dan
arsip film dokumenter.
2) Dibutuhkannya sistem yang mempermudah layanan penyajian,
pengelompokan dan pencetakan laporan arsip Salatiga, serta mempercepat
proses pencarian dan penemuan kembali arsip ketika dibutuhkan. 3) Belum
adanya sistem informasi yang memudahkan masyarakat untuk memperoleh
informasi mengenai koleksi arsip-arsip Salatiga yang bisa diakses kapan saja
dan dimana saja melalui web. Selain itu dari hasil wawancara didapatkan
proses bisnis terkait proses pengarispan arsip Salatiga sebagai berikut:

4
 Mulai

Arsiparis mengklasifikasi dan

mengidentifikasi arsip

Hasil dicatat dan disimpan dalam buku

atau dokumen office

Arsip disimpan dalam rak

Tidak
atau filling cabinet

Ya

Scanning arsip

Arsip disimpan dalam

harddisk atau DVD

Selesai

Gambar 3 Flowchart Proses Pengarsipan Arsip

Salatiga

Pengarsipan dilakukan oleh arsiparis yaitu seseorang yang memiliki

kompetensi di bidang kearsipan yang mempunyai fungsi, tugas dan tanggung
jawab melaksanakan kegiatan kearsipan. Arsiparis melakukan pengklasifikasian
dan pengidentifikasian terhadap suatu arsip. Sebelum dibuat sistem informasi
kearsipan, hasil identifikasi mengenai arsip tersebut dicatat dalam buku atau
dalam dokumen office (word atau excel). Beberapa arsip terkait arsip Salatiga
tempo dulu seperti arsip foto dan arsip textual dialih mediakan dari arsip
konvesional menjadi arsip eletronik agar kerusakan terhadap arsip dapat
diminimalkan ketika digunakan kembali. Metode yang digunakan dalam mengalih
mediakan arsip tersebut dengan metode scanning. Alih media dengan
scanning atau memindai dokumen akan menghasilkan data gambar yang dapat
disimpan di komputer. Arsip yang sudah diklasifikasikan dan diidentifikasi
disimpan dalam tempat penyimpanan seperti rak atau filling cabinet untuk
arsip konvesional, sedangkan untuk arsip elektronik disimpan dalam harddisk atau
DVD.
Metode yang akan digunakan untuk perancangan Sistem Informasi Arsip
Salatiga berbasis web adalah Prototype Model dimana suatu prototype
suatu bentuk perkiraan awal dari suatu sistem dibangun, diuji, lalu dikerjakan
ulang sesuai kebutuhan hingga akhimya tercapai suatu prototype yang dapat
diterima. Prototype Model adalah metode yang digunakan untuk
mendefinisikan serangkaian sasaran umum bagi perangkat lunak serta
mengidentifikasi kebutuhan input, pemrosesan, ataupun output detail [12].

5
 build/revise
mock-up

Gambar 4 Prototype Model

[12]

Tahap-tahap yang ada pada Gambar 4 adalah listen to customer. Pada tahap
m1 dilakukan wawancara dengan Seksi Bina Perpustakaan dan Kearsipan di
Perpustakaan dan Arsip Daerah Kota Salatiga untuk mengumpulkan kebutuhan
yang diperlukan dalam pembuatan sistem yaitu kebutuhan input sistem berupa
atribut-atribut data tiap bentuk arsip. Berdasarkan data dan kebutuhan sistem yang
telah dikumpulkan lalu dilakukan tahap yang kedua yaitu build/revise mock-
up. Pada tahap ini dilakukan proses perancangan sistem sesuai dengan
kebutuhan pengguna. Perancangan sistem meliputi perancangan proses dan
perancangan database. Perancangan proses dalam sistem menggunakan diagram
Unified Modelling Language (UML). Kemudian dilakukan proses pembuatan
prototype sesuai dengan hasil perancangan yang telah dibuat. Pada tahap
selanjutnya hasil dari prototype kemudian dilakukan customer test-drives
mock-up, yaitu sistem akan diberikan kepada pihak yang bersangkutan untuk
dilakukan pengujian apakah sistem sudah sesuai dengan yang dibutuhkan. Hasil
dari customer test• drive mock-up akan digunakan untuk pengembangan
prototype selanjutnya. Tiga tahapan prototype dilakukan terns berulang
sampai prototype yang dibangun sudah sesuai dengan kebutuhan pengguna.
Tahapan pada metode prototype berakhir jika prototype yang dibangun sudah
sesuai dengan kebutuhan pengguna dan siap untuk diimplementasikan.
Dalam pembangunan sistem, proses ini dilakukan sampai prototype 3 yaitu:
1) Prototype I berupa sistem yang dapat mengelola arsip (insert, update
dan
delete) serta melakukan pencarian arsip. Prototype I kemudian diserahkan
kepada pengguna untuk diuji. Atas permintaan pengguna dilakukan perbaikan
pada pengungahan file gambar dengan memberi watermark secara otomatis
pada gambar saat diunggah. 2) Pada prototype 2 dilakukan penambahan fitur
publish dimana arsip yang ada pada sistem dapat diakses oleh masyarakat
atau tidak melalui web. 3) Pada prototype 3 dilakukan penambahan fasilitas
cetak report dan statistik hit pembaca tiap bentuk arsip yang diakses masyarakat
melalui web. Pada prototype 3 sistem yang dibangun sudah sesuai dengan
kebutuhan pengguna.
Perancangan proses menggunakan UML bertujuan untuk menggambarkan
secara jelas alur yang ada pada sistem yang akan dibangun. Perancangan
menggunakan UML meliputi use case diagram, activity diagram dan class
diagram. Use case diagram menampilkan aktor, use case, dan hubungan
antara use case. Perancangan use case diagram dibuat berdasarkan aktivitas yang
dilakukan oleh admin dan masyarakat.
6
 •
Update arsip foto

<<extend>>
Delete arsip foto

c<tend»>>

lnsertars1pfoto Menge101aars1pfoto Melihatarsipfoto

0
~2ra,~~hhatsarao~ / C)
o
Insert arsip film

<<exlend>>

~oggaotipm~~------c>( <<extend>>

_
a.
~ M mm\

.%
Me nge101aars1pf i

. % ..
lm Me lihatarsipfilm
Mas yarakat

Update arsip fim Delete arsip film

<<extend>> «<<extend>>

Insert arsip buku Menge/ola arsip buku Mel ihat arsip buku Insert arsip tekstual Mengelola arsip tekstual Melihat arsip teks tual

•
«exl/,> «M/,>>
»
<~eod»

Update arsip buku Del ete arsip buku

0
Update arsip teks tual Delete arsip teks tual

Gambar 5 Use Case Diagram

Sistem

Gambar 5 menunjukkan use case diagram dari sistem informasi

arsip Salatiga. Use case diagram tersebut mempunyai dua aktor yaitu admin dan
masyarakat. Aktor admin dapat melakukan aktivitas ganti password, tambah
admin, melihat saran pengguna aplikasi Arsip Salatiga Mobile, mencetak laporan
serta dapat mengelola data seperti menambah, mengubah data, menghapus
data dan melihat data. Sedangkan aktor masyarakat hanya dapat melihat koleksi
arsip foto, arsip tekstual, arsip buku dan arsip film dokumenter yang ditampilkan
dalam sistem informasi arsip Salatiga.
Activity diagram merupakan teknik untuk menggambarkan logika prosedur,
proses bisnis, dan jalur kerja [13]. Pada tahap ini perancangan activity diagram
dibuat berdasarkan aktifitas yang dilakukan oleh masyarakat dan admin.
asyarakt System

Mengakses Halam Web + Menampilkan Halaman Utama g

-.
rrrhntf 4l

s ip Foto si p e l (sip film )

Men ampillan D ata

•-------+-------'
End

Gambar 7 Activity Diagram Masyarakat

7
 Gambar 7 menunjukkan aktivitas-aktivitas yang dapat dilakukan masyarakat
pada sistem. Masyarakat mengakses halaman web kemudian sistem menampilkan
halaman utama yang berisi menu informasi koleksi arsip foto, arsip tekstual, arsip
buku dan arsip film. Masyarakat memilih informasi arsip yang ada kemudian
sistem menampilkan informasi yang diminta oleh masyarakat.

e morose$Login ]t
Cek Username
dan
Passwo
rd

erilih Ale nu Ad min kl l

Menambah dmin )Menampillan Form Tambah Ad min)}t

Simpan [

)]g-Menampilkan Form Ganti Password

Mehihat Saran ls, enampiilan Saran

Mencetak Laporan )hf CetakKepofl

logout

Tdi ak

Gambar 6 Activity Diagram Admin

Gambar 6 menunjukkan aktivitas-aktivitas yang dapat dilakukan admin

pada sistem. Admin mulai masuk ke dalam sistem dengan memasukkan username
dan password kemudian diproses. Jika valid maka sistem akan menampilkan
halaman utama aplikasi, jika salah akan dikembalikan ke halaman login
hingga valid. Setelah masuk, aplikasi sistem akan menampilkan halaman menu
admin. Admin dapat melihat dan mengelola arsip meliputi tambah, ubah dan hapus
data yang kemudian disimpan dalam database. Admin juga dapat
menambah admin, mengganti password, melihat saran dari pengguna aplikasi
Arsip Salatiga Mobile serta mencetak laporan. Admin dapat melanjutkan
aktifitas lagi atau keluar dari sistem.
Class diagram merupakan diagram yang digunakan untuk menampilkan
kelas yang ada dalam suatu sistem serta menggambarkan relasi antar kelas
tersebut. Class diagram sistem yang terdapat pada rancangan sistem
informasi arsip Salatiga ditunjukkan pada Gambar 8.

8
 [uim] UL_ArsipTekstual_ad min Teks tual UI_Kategoni_admin Foto UI ArsipFoto_user UI Saran ad min I
id_teks id_foto
J,, d
J, udul_teks
@id_ate gor J,, udul_foto
id_ate go
KategoniController FotoControllerUser
SaranController/ TekstualC ontr ollerAd min &tahun_teks @tahun_foto
desripsi_teks tdesnipsi_foto
insert0
sumber_teks
fun_imgte ks
insert
up date0
sumber_foto
un_to to
iew) ie w0 I
update0
f3 eurt_waterm ark delete0 urt_watermark ~
FotoControllerAd min l
elete0 Saran
4ew() eid_saran
J@» wist bility 4nit
isibitity
&input_date J,,
Kategon input_date
insert0

Teid_admin
nama
A update0

Te ks tuaIC ontrolleruser] last_update 1.~ id_ategon last_update 4saran

delete0
username 1 fate g or 1 iew()
yew
4ewp
t
#password insert0 insert0
update0 nsert0 update0
4gmbahAdmin0
gantiP assword0 1 etete0
iew(
update0 etete0
iew) UI_rsipF oto_admin ]

L
UI_ArsipTekstual, us er] etete0
1 gin0
1o gout
UI_ArsipFim_admin] Film 1.°
Buku Pengarang PengarangControlle
id_fim I_sip Buku_admin /Seid_buku eid_pengarang
ju dut_tim dnama_p engar at.

t fwd_ategor insert
@ta nun_fim insert0 up date0
FimnC ontrollerAdm in BukuControllerAdmin etete(
bentuk &id_penerbit 1
update0
insert0 deskripsi_fum
tun_coverim
knpsi_buu
insert0
tahun_ter bit
&des
delete0
t
update0 bunt_cover uI_ Pengarang_admin
kunt_video update0
delete0 ------- -;. tunt_lampiran

-
@is_video etete0
iewt) wisibity iew0 tis_lamp iran

elete0

T update0 f insert0

BukuControllerU serf

@nit wist bility Penerbit PenerbitC ontroller

1
FilmControllerUseY fin put_d ate hit Seid_penerbt
last_up date 'input_date nama_penerbit insert0
wew0
insert0
[ ew() I last_update xota pate0
d
update0 insert0
delete() update0
UI_ArsipFlm_user] UI_ArsipBuku_user]
iew0
delete 0 4
UI Penerbit admin
iew0

Gambar 8 Class Diagram Sistem

Terdapat relasi yang terjadi antara kelas view terhubung ke kelas

controller.
Sedangkan kelas controller dalam mengakses database harus melalui kelas
model.
Relasi antar tabel yang terdapat di dalam database sistem yang dibuat
memiliki fungsi menyusun sebuah struktur database. Gambar 9
menunjukkan relasi antar tabel untuk sistem informasi arsip Salatiga.

• id_pengarang
Tb Pengarang
s i
d buku
Tb Buku
id film
Tb Film
id_saran
Tb Saran

nama_pengarang]' judul_buku
id_kategori
id_pengarang
...
n n
judut_fim
id_kategori
tahun film
nama
saran
tanggal

, id_penerbit bentuk
Tb..Penerbit [ tahun terbit deskripsi_film
id_penerbit deskripsi_buku url coverfilm Tb Admin
nama_penerbit url cover urt video id_admin
kota urt_lampiran visibility
username
visibility vis video
password vis_lampiran input_date

Tb_Foto input_dat last_updat

e e hit Tb Tekstual
id foto last_upda id teks
judut_foto te hit judul_te
id_kategori 1 ks
id_kategori
tahun foto n I 1 I Tb Kategori I I n tahun teks
]«_ategor
kategori
deskripsi_foto
sumber_foto I deskripsi_tek
s
url foto sumber
url watermark teks un!
_imgteks
visibility url
input_date watermark
last_update visibility
hit input_date
Gambar 9 Relasi Antar Tabel
 Tabel yang digunakan pada sistem adalah tabel pengarang, tabel penerbit,
tabel film, tabel foto, tabel tekstual, tabel kategori, tabel admin dan tabel
saran. Tabel pengarang memiliki relasi dengan tabel buku dengan jenis relasi
one to many. Tabel penerbit memiliki relasi dengan tabel buku dengan jenis
relasi one to many. Tabel kategori memiliki relasi dengan tabel buku, tabel film,
tabel foto dan

9
tabel tekstual dengan jenis relasi one to many. Tabel saran dan tabel admin
tidak memiliki relasi antar tabel.

4. Hasil dan Pembahasan

Hasil implementasi sistem berdasarkan perancangan yang telah dibuat
dijelaskan sebagai berikut. Terdapat dua pengguna sistem, yaitu admin dan
masyarakat. Admin terlebih dahulu harus melakukan login untuk masuk ke
halaman admin.

Koleksi Arsip Salatiga

Halaman Khusus Administrator

i I! #! 5
Arsip Buku Arsip Foto Arsip Film Arsip
Dokumenter Tekstual

-
Cetak
" Repo
II!
Statistik

rt
Garnbar 10 Halaman Beranda Admin

Gambar 10 menunjukkan halaman beranda. Admin memiliki hak akses

penuh terhadap sistem yaitu melihat serta mengelola arsip (menambah, mengubah
dan menghapus). Informasi mengenai arsip Salatiga yang sebelumnya terpisah
menjadi terpusat karena disimpan dalam database server. Arsip disimpan dan
dikelompokkan berdasarkan bentuk dan kategori arsip. Admin juga dapat melihat
saran pengguna yang dikirim melalui aplikasi Arsip Salatiga Mobile, mencetak
laporan, melihat statistik hit pembaca mengubah password serta menambah
admin.

Menu
Kat«gori » Semua
Tambah Kategori

Tamba h Arsip
Judul Foto Tahun Publish Aksi
Cetak Report

G
Statistik Pembaca
Alm. Marsek al Muda Udara Anumerta Agustinus Adisoetjipto 1936 Ya
0o
Categories
w Gedung Kepatihan 1860 Ya
00
Semua 12

@ Gedung Manege 1900 Ya

0o
Gambar 11 Halaman Arsip Foto

10
 Gambar 11 menunjukkan halaman arsip foto. Di dalam halaman tersebut
terdapat button untuk mengubah dan menghapus data. Admin dapat melihat
koleksi arsip per kategori. Selain itu admin juga dapat melakukan pencarian arsip
secara spesifik.

Tambah Foto

12

EiHMi·E

NO
IM AGE
AVAILABLE

Size toto max 2MB

Gambar 13 Halaman Tambah Arsip Foto

Gambar 13 menunjukkan halaman untuk menambah arsip foto, admin akan

memasukkan judul foto, kategori, tahun foto, sumber foto, deskripsi foto,file foto
serta memberi perintah untuk menampilkan atau tidak menampilkan arsip kepada
masyarakat. Perintah yang digunakan untuk menambah arsip foto dapat dilihat
pada Kode Program 1.

Kode Program 1 Perintah untuk Menambah Arsip pada Controller C_Foto

01 function insert() {
02 if ($this->session->userdata('logged_in') == true)
03 $this->load->library('upload');
04 Sconfig['upload_path'] = './userfile/foto/';
05 Sconfig['allowed types'] = 'jpglpnglJPEG';
06 Sconfig['file_name'] = url_title($this->input->post('gambar'));
07 $this->upload->initialize($config);
08 if ( ! $this->upload->do upload ( 'gambar')) {
09 echo "<script>alert ( "' . $this->upload->display errors () . ");
10 </script>";
11 redirect('admin/C_Foto/tambah');
12 else {
13 $tp = $this->upload->data();
14 $ori = $tp['raw_name'] $tp['file_ext'];
15 $tnd = $tp ['raw name'] . ' water' . $tp ['file ext'];

11
 16 $mr = $tp['full_path'] . Stp['file_name'l;
17 Stn = $tp ['file path'] . $tnd;
18 Subah = Sthis->ubahUkuranFoto(Stp['full_path');
19 Smark = Sthis->watermarking(Stn);
20 $imgOri = $ori;
21 SimgWater = $tnd;
22 $judul = addslashes($this->input->post('judul'));
23 $tahun = $this->input->post('tahun');
24 $kategori = Sthis->input->post('kategori');
25 Sdesk = nl2br(Sthis->input->post('deskripsi'));
26 Sdeskripsi = addslashes($desk);
27 $sumber = addslashes($this->input->post('sumber'));
28 $visibility= $this->input->post('visibility');
29 $hasil = $this->M_Foto->insert($judul, $kategori, $tahun,
30 Sdeskripsi, Ssumber, $imgOri, $imgWater, $visibility);
31 if ($hasil) {
32 echo "<script>alert ('Data berhasil ditambahkan! ') ;
33 window.location.href = , base url().
34 "index.php/admin/C_Foto/viewAll'</script>";
35 else {
36 echo "<script>alert ('Data gagal ditambahkan! ');
37 window.location.href = '". base url().
38 "index.php/admin/C_Foto/tambah'</script>";
39
40
41 else {
42 redirect ( 'C Login/ index', 'refresh') ;
43
44

Library upload digunakan untuk mengunggah file foto ke direktori

./userfile/foto/ di server. Atribut-atribut data yang dikirim dari form dengan
method post kemudian disimpan ke dalam variabel-variabel. Kemudian variabel•
variabel tersebut dikirimkan sebagai parameter fungsi insert() di model M_Foto.
Kode Program 2 Perintah untuk Insert Foto pada Model
M_Foto
01 function insert($jdl, SidKat, Sthn, Sdesc, $smbr, $imgOri, $imgWater, $vis) {
02 $query= $this->db->set('judul foto', $jdl)
03 ->set('id_kategori', SidKat)
04 ->set('tahun foto', $thn)
05 ->set('deskripsi_foto', Sdesc)
06 ->set('sumber_foto', $smbr)
07 ->set('url_foto', SimgOri)
08 ->set('url watermark', SimgWater)
09 ->set('visibility', Svis)
10 ->set('input_date', 'NOW()', FALSE)
11 ->insert('tb_foto');
12 return $query;
13

Pada Kode Program 2 fungsi insert() berfungsi untuk melakukan insert

data ke dalam Tabel Foto. Setelah proses insert data selesai akan muncul
peringatan bahwa data berhasil disimpan atau gagal disimpan.
Sebelum data di-input ke database, file foto yang telah diunggah akan
diubah ukurannya terlebih dahulu. Perintah yang digunakan untuk
mengubah
ukuranfile foto dapat dilihat pada Kode Program 3.

Kode Program 3 Perintah untuk Mengubah Ukuran Foto pada Controller C_Foto
01 function ubahUkuranFoto(Stp) {
02 $config ['image_library'] = 'gd2';
03 $config ['source_image'] $tp;
04 $config ['create thumb'] = TRUE;

12
 05 $config['thumb_marker'] = '_water';
06 $config ['maintain ratio'] = TRUE;
07 Sconfig ('width'] =1028;
08 $config ['height'] = 780;
09 $this->load->library('image lib', $config);
10 return $this->image_lib->resize0;
11

Pada Kode Program 3 fungsi ubahUkuranFoto() pada controller C_Foto

dipanggil di fungsi insert() dengan parameter file foto yang akan diubah ukuran.
Library image_lib akan memanggil fungsi resize() untuk mengubah ukuran
file foto tersebut.

Z fv} ll
=1

Gambar 14 menunjukkanfile foto yang diunggah ke direktori

./userfile/foto/ di server telah diberi watermark. Perintah yang digunakan untuk
memberi watermark padafile foto dapat dilihat pada Kode Program 4.

Kode Program 4 Perintah untuk Memberi Watermark pada Controller C_Foto

01 function watermarking($gb) {
02 $config['source_image'] = $gb;
03 $config['wm type'] = 'overlay';
04 Sconfig['wm_overlay_path'] = './assets/images/watermark.png';
05 $config['wm_font_color'] = '00000';
06 $config['wm vrt alignment'] 'middle';
07 Sconfig['wm_hor_alignment'] = 'center';
08 $config['wm_padding'] = 5;
09 $config['wm_x_transp'] = 0;
10 $config['wm y transp'] = 5;
11 Sconfig['thumb_marker'] = '';
12 $config['wm_opacity'] = 25;
13 $this->image_lib->initialize($config);
14 $this->image_lib->watermark();
15

File foto yang yang diunggah diberi watermark berupa gambar dengan tipe
.png. Fungsi watermarking() pada controller C_Foto dipanggil di fungsi insert()
dengan parameter file foto yang akan diberi watermark. Library image_lib akan
memanggil fungsi watermarkO untuk memberi watermarkfile tersebut.

13
 Statistik Pembaca
Menu

Statistik Hit Pembaea Arsip Salatiga

Tambah Kategori

Tamba h Peng arang Koleksi Arsip

ArsipFot03/3

Tamba h Pene rbit

•
Tamba h Arsip Buku

Tambah Arsip Foto

Tambah Arsip Film Dokumenter

Tamba h Arsip Tek stual

A rsip 6u lu a Arip rote Ar sip Film pokumen ter A rsi p Tektu al

Cetak Report

Gambar 15 Grafik Hit Pembaca

Gambar 15 menunjukkan grafik hit pembaca tiap bentuk arsip. Dalam

membuat grafik hit pembaca digunakan plugin Highchart. Perintah yang
digunakan untuk menampilkan grafik hit pembaca dapat dilihat pada Kode
Program 5.

Kode Program 5 Perintah untuk Menampilkan Grafik Hit Pembaca

01 <script type="text/javascript">
02 $ (document) . ready ( function () {
03 $('#container') .highcharts({
04 chart: { type: 'column',
06 options3d: { enabled: true, alpha: 15, beta: 15,
07 viewDistance: 25, depth: 40 } },
08 title: text: 'Statistik Hit Pembaca Arsip Salatiga'},
09 xAxis: categories: [ 'Koleksi Ar sip'] ,
10 yAxis: allowDecimals: false, min: 0,
11 19 title: { text: 'Jumlah Hit' }
,
12 tooltip: { headerFormat: '<b>{point.key}</b><br>',
13 pointFormat: span style="color:{series.color}">\u25CF</span>
14 {series. name} : (point.y} / {point. stackTotal} ' } ,
15 plotOptions: { column: { stacking: 'normal', depth:20 } },
16 series: [{ name: 'Arsip Buku', data: [<?php echo $jBuku; ?>],
17 stack: 'Arsip Buku' },
18 { name: 'Arsip Foto', data: [<?php echo $jFoto; ?>],
19 stack: 'Arsip Foto' },
20 { name: 'Arsip Film Dokumenter', data: [<?php echo 2>],
21 $jFilm;
22 stack: 'Arsip Film Dokumenter' },
23 { name: 'Arsip Tektual', data: [<?php echo SjTeks;
24 }) ; 2>], stack: 'Ar sip Tektual' , ]
25 }) ;
26 </script>

Pada Kode Program 5 scriptjavascript untuk menampilkan grafik

pembaca diletakkan di view chart.php. Untuk mendapatkan data series fungsi
view() pada controller C_Chart memanggil fungsi jmlHit() pada model
M_Foto, M_Buku, M_Film dan M_Teks sehingga didapatkan jumlah hit
pembaca tiap bentuk arsip yang kemudian ditampilkan pada halaman view.

14
 Semua 11
Koleksi Arsip Foto
Kategori » Semua
Bangunan

Monumen

Prasasti
Gedung Kepatihan

Ketika Salatiga menjadi kota

Kepatihan, maka Salatiga dipimpin
oleh seorang Patih pribumi. Sang
Patih tinggal di bekas rumah
Bupati, yang dibangun pada tahun
1860, dan berada di sebelah barat
aloon-al0on yang sekarang ipakai
Gedung Manege Hotel Kalirtama
oleh Pores Kota Salatiga. Kompleks ini terdiri dari pend0po
1900

Gambar 16 Tampilan Halaman Arsip

Foto

Gambar 16 menunjukkan tampilan halaman arsip foto pada sisi masyarakat.

Masyarakat dapat mengakses koleksi arsip melalui halaman tersebut. Masyarakat
hanya bisa mengakses koleksi arsip tertentu saja karena admin memiliki
wewenang untuk menampilkan atau menyembunyikan arsip. Masyarakat juga
dapat melihat detail informasi tiap arsip.

Gambar 17 Hasil Pencarian

Arsip

Gambar 17 menunjukkan hasil pencarian arsip. Sistem dilengkapi dengan

fasilitas pencarian arsip. Sistem akan menampilkan hasil pencarian sesuai dengan
kata kunci yang di-input oleh pengguna. Dengan adanya fasilitas pencarian
mempermudah proses temu kembali arsip. Informasi yang dihasilkan lebih cepat,
tepat dan lengkap tanpa hams melakukan pencarian langsung pada tempat
penyimpanan fisik arsip.

15
 th Beranda
Kategori » Ser a
@ Koleksi Arsip

Koleksi Arsip
A Peta Perpustakaan
Salatiga
-• Masuk Admin

Gambar 18 Tampilan Sistem pada Smartphone

Gambar 18 menunjukkan tampilan sistem bila diakses pada

smartphone. Pembuatan antarmuka sistem menggunakan Materialize CSS untuk
membangun web responsive sehingga web dapat menyesuaikan tampilan dari
berbagai device sesuai dengan lebar layar device yang digunakan tanpa merusak
tampilan web. Materialize menggunakan sistem grid 12 kolom. Pada lebar
kurang dari sama dengan 992px yaitu pada lebar layar smartphone/tablet,
kolom akan otomatis menjadi fluid yang mengisi seluruh lebar viewport
dan kolom akan tersusun menumpuk secara vertikal.
Pengujian sistem dilakukan untuk menguji fungsi-fungsi sistem
hasil
implementasi. Pengujian yang dilakukan terdiri dari pengujian blackbox dan
pengujian responden. Pengujian blackbox yaitu pengujian validasi sistem tanpa
memperhatikan struktur logika internal perangkat lunak untuk mengetahui apakah
perangkat lunak berfungsi dengan benar [14]. Hasil dari pengujian blackbox
ditampilkan pada Tabel 1.

Tabel 1 Hasil Pengujian

Blackbox
Fungsi yang diuji Output Output dari Sistem Status
yang Pengujian
diharapkan
Login admin Login berhasil Sistem akan memberikan Valid
peringatan apabila tidak mengisi
username atau password.
Apabila username dan password
salah, maka gaga! login. Apabila
benar, maka sukses login dan
dapat mengakses halaman utama
Mengubah Password Jika input salah satu dari Valid
password berhasil diubah di password lama, password
dalam database baru atau konfirmasi password
baru salah, maka akan muncul
pesan update password gaga!.
Apabila benar, maka update
password sukses

16
Menambah admin Admin berhasil Admin baru berhasil ditambahkan ke Valid
baru ditambahkan ke dalam database
dalam database

Melihat saran Saran berhasil Sistem berhasil menampilkan Valid

pengguna aplikasi ditampilkan saran pengguna aplikasi Arsip
Arsip Salatiga Salatiga Mobile
Mobile
Menambah koleksi Data berhasil Koleksi arsip berhasil ditambahkan ke Valid
arsip buku, arsip foto, ditambahkan ke dalam database.
arsip film dan dalam database
arsip tekstual
Mengubah koleksi Data berhasil diubah di Koleksi arsip berhasil diubah ke Valid
arsip buku, arsip dalam database dalam database
foto, arsip film dan
arsip tekstual

Menghapus koleksi Data berhasil Koleksi arsip berhasil dihapus di Valid

arsip buku, arsip foto, dihapus di dalam dalam database
arsip film dan database
arsip tekstual

Pencarian koleksi Data hasil pencarian Sistem berhasil menampilkan Valid

arsip (temu kembali berhasil ditampilkan koleksi arsip sesuai dengan kata
arsip) kunci pencarian

Pencetakan laporan Data ditampilkan Sistem berhasil menghasilkan Valid

pada laporan laporan koleksi arsip dalam
bentuk file .pdf
Melihat statistik hit Chart hit pembaca Sistem berhasil menampilkan Valid
pembaca berhasil ditampilkan chart hit pembaca. Chart berubah
apabila hit pembaca bertambah
User melihat Data berhasil Sistem berhasil menampilkan Valid
koleksi arsip buku, ditampilkan daftar koleksi arsip baik semua
arsip foto, arsip film maupun per kategori dan
dan arsip tekstual menampilkan informasi koleksi
arsip secara detail

Berdasarkan hasil pengujian blackbox pada Tabel 1, disimpulkan bahwa

fungsi-fungsi pada sistem yang diakses merespon dengan baik dan menghasilkan
output yang sesuai harapan. Hasil tersebut memperlihatkan bahwa antara proses
perancangan sistem dengan implementasi sistem tidak terdapat perbedaan dan
sesuai dengan harapan.
Pengujian berikutnya adalah pengujian responden. Pengujian dilakukan
dengan mengajukan kuesioner yang berisi 5 pertanyaan kepada 30 responden
yang menggunakan web Sistem lnformasi Arsip Salatiga pada sisi masyarakat.
Responden berada pada usia 15 tahun sampai 31 tahun. Responden terdiri dari
pelajar SMP, SMA, mahasiswa dan umum. Hal yang diuji dan hasil pengisian
kuesioner dapat dilihat pada Tabel 2.

17
 Tabel 2. Hasil Pengisian Kuesioner untuk Pengujian
Responden
No Pertanyaan Sangat Tidak Cukup Setuju Sangat
Tidak Setuju Setuju Setuju
Setuju
1. Sistem Informasi Arsip Salatiga 0 0 0 4
26
mudah digunakan
2. Sistem mampu memberikan 0 0 2 18 10
informasi mengenai koleksi Arsip
Salatiga
3. Pencarian koleksi arsip pada sistem 0 0 0 7
23
berjalan dengan baik
4. Sistem memberikan kemudahan 0 0 0 5
25
dalam akses informasi mengena1
Arsip Salatiga
5. Tampilan web Sistem Informasi 0 0 0 2
28
Arsip Salatiga menarik

Hasil analisis pengujian untuk pertanyaan 1 menunjukkan sebanyak

13,33% responden menjawab setuju dan 86,67% responden menjawab sangat
setuju. Jadi disimpulkan bahwa sistem mudah untuk digunakan.
Hasil analisis pengujian untuk pertanyaan 2 menunjukkan sebanyak 6,67%
responden menjawab cukup setuju, 60,00% responden menjawab setuju
dan
33,33% menjawab sangat setuju. Jadi disimpulkan bahwa sistem mampu
memberikan informasi mengenai koleksi Arsip Salatiga.
Hasil analisis pengujian untuk pertanyaan 3 menunjukkan sebanyak 23,33%
responden menjawab setuju dan 76,67% responden menjawab sangat setuju.
Jadi
disimpulkan bahwa fungsi pencarian koleksi arsip pada sistem berjalan dengan
baik.
Hasil analisis pengujian untuk pertanyaan 4 menunjukkan sebanyak 16,67%
responden menjawab setuju dan 83,33% responden menjawab sangat setuju. Jadi
disimpulkan bahwa sistem memberikan kemudahan dalam mengakses informasi
mengenai arsip Salatiga.
Hasil analisis pengujian untuk pertanyaan 5 menunjukkan sebanyak 6,67%
responden menjawab setuju dan 93,33% responden menjawab sangat setuju. Jadi
disimpulkan bahwa sistem memiliki tampilan yang menarik.
Selain melakukan pengujian black box dan pengujian responden,
juga dilakukan pengujian sistem melalui wawancara dengan arsiparis di
Perpustakaan dan Arsip Daerah Kota Salatiga. Adapun hasil atas pengujian
berdasarkan wawancara yang dilakukan didapatkan bahwa sistem memberi
kemudahaan dalam pengelolaan arsip Salatiga. Sistem dapat digunakan sebagai
media untuk penyimpanan data arsip Salatiga yang sebelumnya masih
terpisah. Proses pencarian arsip menjadi lebih cepat dan tepat dari
sebelum dibuat sistem. Kerusakan arsip terlebih untuk arsip yang bersifat kuno
dapat berkurang karena arsip dapat dilihat dan diakses melalui web dalam waktu
yang bersamaan.
18
5. Simpulan
Berdasarkan uraian di atas, dapat ditarik kesimpulan bahwa
Sistem Informasi Arsip Salatiga berbasis web dibangun menggunakan
framework Codelgniter dengan menerapkan pola arsiktektur model view
controller (MVC) sehingga sistem yang dibangun lebih terstruktur dan
mudah dalam melakukan proses pengkodean. Antarmuka sistem dibangun
menggunakan framework Materialize CSS sehingga menghasilkan tampilan web
yang responsive (dapat menyesuaikan tampilan berdasarkan ukuran browser).
Sistem mampu memberikan kemudahan dalam proses pengelolaan arsip
(insert, update dan delete). Penyimpanan informasi mengenai koleksi arsip
lebih terpusat dan tidak terpisah karena karena tersimpan dalam satu database.
Adanya fasilitas pencarian arsip membuat proses temu kembali arsip lebih cepat
dan tepat. Sistem yang telah dibangun juga dapat memberikan kemudahan
dalam mengakses informasi mengenai koleksi arsip Salatiga yang ada di
Perpustakaan dan Arsip Daerah Kota Salatiga. Akses informasi mengenai Arsip
Salatiga dapat dilakukan oleh lebih dari satu pengguna dalam waktu yang
bersamaan. Saran untuk pengembangan sistem selanjutnya adalah adanya
sistem backup secara berkala dan secara otomatis yang dilakukan oleh sistem
serta perlindungan terhadap segala bentuk penghapusan data dengan earn
membuat sebuah tempat penampungan arsip yang sudah dihapus.

6. Pustaka
[1] Ageng, Fanny Rochmad. 2009. Prosedur Pelaksanaan Penyimpanan Arsip
Pada PT. Bank Panin Tbk Kantor Cabang Pembantu Solo.
Surakarta: Fakultas Ilmu Sosial Dan Ilmu Politik, Universitas Sebelas Maret.
[2] Pranata, Rudy, & Wahyono, Teguh. 2013. Penerapan Responsive Web
Design pada Sistem Informasi Penilaian Akademik Siswa (Studi Kasus:
SMP Kristen Satya Wacana). Salatiga: Fakultas Teknologi Informasi,
Universitas Kristen Satya Wacana.
[3] Irmawati, Dessy, & Indrihapsari, Yuniar. 2012. Sistem Informasi
Kearsipan.
Fakultas Teknik, Universitas Negeri
Yogyakarta.
[4] Utomo, Sigit Prasetyo Karisma. 2014. Pembuatan Sistem Informasi
Berbasis
Website pada SD Masjid Syuhada Yogyakarta Menggunakan Framework
Codelgniter dan Bootstrap. Yogyakarta: Jurusan Teknik Informatika,
STMIK AMIKOM.
[5] Undang-undang Republik Indonesia Nomor 43 Tahun 2009
Tentang
Kearsipan.
[6] Gie, The Liang. 2000. Administrasi Perkantoran Modern.
Yogyakarta:
Liberty.
[7] Jogiyanto, H. M. 2005. Analisis dan Desain Sistem Informasi. Yogyakarta:
Andi.
[8] Nurulita, Annisa. 2015. Sistem Pengelolaan Arsip Dinamis
Pada
Administrasi Perkantoran Di Biro Umum Sekretariat Jenderal
Kementerian
Pekerjaan Umum Republik Indonesia. Jakarta: Fakultas Adab
Dan
Humaniora, Universitas Islam Negeri Syarif
Hidayatullah.

19
[9] Wardana, Tartib. 2013. Analisis Dan Perancangan Sistem Informasi
Kearsipan SMA N 11 Purworejo. Yogyakarta: STMIK AMIKOM.
[10] Codelgniter. 2014. Application Flow
Chart.
http://www. codeigniter. com/user_guide/overview/appflow.html diakses
pada
1 Maret 2016
[11] Materialize CSS. 2014. Material
Design.
http://materializecss.com/about.html diakses pada 1 Maret 2016
[12] Pressman, Roger, 2001. Software Engineering a Practitioner's
Approach.
New York: McGraw-Hill Higher Education.
[13] Patty, Menly, Pakereng, M. A. Ineke, Bezaleel, Michael. 2013.
Perancangan
dan Implementasi Sistem Informasi Kebudayaan Maluku Berbasis
Web.
Salatiga: Fakultas Teknologi Informasi, Universitas Kristen Satya Wacana.
[14]Nandiwardhana, Indrayasa, Yulianto J. P., Sri, Prestiliano, Jasson.
2011.
Pengembangan Physics Game "FIX and FIT" Berbasis Android
Smartphone
Menggunakan ActionScript 3.0 dan QuickBox2D. AITI: FTI Jumal
Teknologi
Informasi. 8(2) 117-132.
20