Cover (20 Files Merged)

APLIKASI MONITORING AKTIVITAS DENGAN
MENGGUNAKAN IP CAMERA BERBASIS WEB
TUGAS AKHIR
Ditulis untuk Memenuhi Persyaratan untuk Mendapatkan Gelar Sarjana Teknik

pada Program Studi Teknik Informatika
Disusun oleh:
Jacqueline R. M. Solang
10013018
PROGRAM STUDI TEKNIK INFORMATIKA

FAKULTAS TEKNIK
UNIVERSITAS KATOLIK DE LA SALLE
MANADO
2014
APLIKASI MONITORING AKTIVITAS DENGAN
MENGGUNAKAN IP CAMERA BERBASIS WEB
TUGAS AKHIR
Disusun oleh:
Jacqueline R. M. Solang
10013018
PROGRAM STUDI TEKNIK INFORMATIKA

FAKULTAS TEKNIK
UNIVERSITAS KATOLIK DE LA SALLE
MANADO
2014
ABSTRACT
In this era, is familiar for us to hear or talk about technology. It because

of the development of technology so fast and it touches every aspect of human life.
The use of technology such as cameras image capture is a real form of
technological development. Various types of cameras can be found in a variety of
human activities, such as the use of security cameras as a supporting tool.
The type of camera that is often used as a means of supporting the security
is an IP camera and CCTV cameras. Type of camera used biased tailored to user
needs.
In this final project will be built Activity Monitoring applications using
Web-based IP cameras. This application aims to facilitate the user in monitoring
the object by using an IP camera.
The methodology used in this final project is prototyping with modeling
tools using UML. For programming applications using Web programming
language.
The tests result is the application can run properly and accordance with
the purpose of development of this application, which monitors activity using an
IP camera.
Keywords: IP Camera, security, activities.
iv
ABSTRAK
Pada zaman sekarang ini, sudah tidak asing bagi kita untuk mendengar
atau membicarakan teknologi. Hal ini disebabkan oleh perkembangan dari
teknologi yang begitu pesat sehingga menyentuh setiap aspek kehidupan manusia.
Penggunaan teknologi penangkap citra seperti kamera adalah bentuk nyata
perkembangan teknologi. Berbagai jenis kamera dapat ditemui dalam berbagai
aktivitas manusia, seperti penggunaan kamera sebagai alat penunjang keamanan.
Adapun jenis kamera yang sering digunakan sebagai alat penunjang
keamanan adalah IP Camera dan kamera CCTV. Jenis kamera yang digunakan
bias disesuaikan dengan kebutuhan pengguna.
Pada Tugas akhir ini akan dibangun aplikasi Monitoring Aktivitas dengan
menggunakan IP Camera berbasis Web. Aplikasi ini bertujuan untuk
mempermudah pengguna dalam melakukan pemantauan objek dengan
menggunakan IP Camera.
Metodologi yang digunakan adalah metodologi prototyping dengan kakas
pemodelan menggunakan UML. Untuk pemrograman, aplikasi menggunakan
bahasa pemrograman Web.
Hasil pengujian yang dilakukan membuktikan bahwa aplikasi yang
dibangun dapat berjalan dengan baik dan sesuai dengan tujuan pembangunan
aplikasi ini, yaitu melakukan pemantauan aktivitas menggunakan IP Camera.
Kata kunci : IP Camera, keamanan, aktivitas.
v
KATA PENGANTAR
Puji dan syukur penulis panjatkan kehadirat Tuhan Yang Maha Esa karena
atas pertolongan dan tuntunan-Nya, sehingga penulis dapat menyelesaikan
Tugas Akhir ini.
Penulis banyak mendapat bantuan dalam proses penyusunan laporan ini,
untuk itu penulis ingin mengucapkan terima kasih kepada:
1. Pastor Revi R. H. M. Tanod, SS., SE., MA. selaku Rektor Universitas
Katolik De La Salle Manado.
2. Ibu Debby Paseru, ST., MMSI., M.Ed. selaku Dekan Fakultas Teknik
Universitas Katolik De La Salle Manado.
3. Ibu Angreine Kewo, ST., M.Sc. selaku Ketua Program Studi Teknik
Informatika Fakultas Teknik Universitas Katolik De La Salle Manado.
4. Bapak Dr. Ir. Rila Mandala, M.Eng. selaku Dosen Pembimbing I Tugas
Akhir yang telah memberikan bimbingan dan arahan yang sangat
bermanfaat bagi penulis.
5. Bapak Rubby Padang, S.Kom selaku dosen pembimbing 2 yang
memberikan tuntunan dan saran selama pembuatan Tugas Akhir.
6. Bapak dan Ibu Dosen dalam lingkup Fakultas Teknik Universitas Katolik
De La Salle Manado.
7. Orang Tua, Adik dan seluruh keluarga untuk doa, dukungan dan waktu
yang diberikan kepada penulis.
8. Teman- teman Fakultas Teknik untuk bimbingan, semangat dan motivasi.
9. Teman- teman Program Studi Teknik Informatika angkatan 2010, untuk
kebersamaan, tuntunan, bantuan, kritikan, masukan, semangat dan
motivasi kepada penulis dalam menyelesaikan Tugas Akhir ini.
10. Teman- teman terbaik: Fictor, Nia, Ebe, Tika, Titi, Brammy, Ray, Dimas,
Sandy, Usi Melinda, Debo, Ate dan Gandy, untuk dukungan, waktu dan
ketulusan yang diberikan.
11. Pihak- pihak lain yang tidak dapat disebutkan satu per satu. Tuhan pasti
memberkati.
Penulis menyadari bahwa laporan ini masih belum sempurna, oleh karena
itu penulis mohon maaf jika ada kesalahan dalam laporan ini. Semua kritikan
dan saran yang membangun akan penulis terima untuk menyempurnakan laporan
ini. Semoga laporan ini dapat bermanfaat bagi kita semua.
Manado, Juni 2014

Penulis
vi
DAFTAR ISI
Judul Laporan ........................................................................................................... i

Lembar Pernyataan.................................................................................................. ii
Lembar Pengesahaan .............................................................................................. iii
Abstract .................................................................................................................. iv
Abstrak .................................................................................................................... v
Kata Pengantar ....................................................................................................... vi
Daftar Isi................................................................................................................ vii
Daftar Tabel ........................................................................................................... ix
Daftar Gambar ........................................................................................................ x
Daftar Lampiran ..................................................................................................... xi
BAB I PENDAHULUAN
1.1 Latar Belakang ....................................................................................... 1
1.2 Perumusan Masalah ................................................................................ 2
1.3 Tujuan Tugas Akhir................................................................................ 2
1.4 Ruang Lingkup dan Batasan Masalah .................................................... 2
1.5 Manfaat Tugas Akhir.............................................................................. 3
1.6 Metodologi Penelitian ............................................................................ 3
1.7 Sistematika Penulisan ............................................................................. 4
BAB II STUDI PUSTAKA

2.1 IP Camera ............................................................................................... 5
2.2 Monitoring .............................................................................................. 8
2.3 Jaringan .................................................................................................. 8
2.3.1 Jaringan Kabel LAN dan Wireless ................................................ 8
2.3.2 IP Address ...................................................................................... 9
2.4 Aplikasi Web .......................................................................................... 9
2.5 CSS 3 ...................................................................................................... 9
2.6 Pemrograman Web ................................................................................. 9
2.6.1 HTML 5 ...................................................................................... 10
2.6.2 Javascript .................................................................................... 10
2.7 Metodologi Pengambangan Sistem ...................................................... 11
2.7.1 Tahapan Pembangunan Aplikasi ................................................. 12
2.7.2 Kakas yang Digunakan ................................................................ 13
2.8 Prosedur Pengumpulan, Pengolahan dan Penyimpanan Data .............. 14
2.8.1 Sumber Data ................................................................................ 14
2.8.2 Teknik Pengumpulan Data .......................................................... 14
2.8.3 Cara Mengolah dan Menyimpan Data ......................................... 14
2.8.4 Media Penyimpanan Data ........................................................... 15
BAB III ANALISIS

3.1 Process Overview ................................................................................. 16
3.1.1 Definisi Aplikasi yang Sudah Ada Sebelumnya ....................... 16
3.1.2 Definisi Aplikasi yang Akan Dibangun .................................... 18
3.2 Spesifikasi Kebutuhan .......................................................................... 18
vii
3.3 Identifikasi Spesifikasi Sistem ............................................................. 18
3.4 Identifikasi Spesifikasi Pengguna ........................................................ 19
3.5 Analisis Kebutuhan .............................................................................. 20
BAB IV PERANCANGAN
4.1 Perancangan Antarmuka Aplikasi ........................................................ 21
4.2 Perancangan Aplikasi ........................................................................... 27
4.2.1 Use Case Diagram .................................................................... 27
4.2.1 Activity Diagram ....................................................................... 33
4.3 Basis Data ............................................................................................. 35
BAB V IMPLEMENTASI
5.1 Lingkungan Implementasi .................................................................... 36
5.1.1 Spesifikasi Perangkat Keras ..................................................... 36
5.2.1 Spesifikasi Perangkat Lunak..................................................... 36
5.2 Implementasi Antarmuka ...................................................................... 37
5.3 Implementasi Basis Data ...................................................................... 42
5.4 Kode Program ....................................................................................... 42
BAB VI PENGUJIAN
6.1 Tujuan Kegiatan Pengujian................................................................... 53
6.2 Kriteria Pengujian ................................................................................. 53
6.3 Kegiatan Pengujian ............................................................................... 54
6.4 Pembahasan Pengujian ......................................................................... 58
BAB VII KESIMPULAN DAN SARAN

7.1 Kesimpulan ........................................................................................... 59
7.2 Saran ..................................................................................................... 59
DAFTAR PUSTAKA ........................................................................................... 61
LAMPIRAN
viii
DAFTAR TABEL
Tabel 3.1 Kebutuhan Hardware dan Software Dalam Aplikasi .............................. 20

Tabel 4.1 Scene 1 Halaman Utama Aplikasi ........................................................... 21
Tabel 4.2 Scene 2 Halaman Setting ......................................................................... 22
Tabel 4.3 Scene 3 Halaman Monitoring .................................................................. 23
Tabel 4.4 Scene 4 Halaman Detail Monitoring ....................................................... 23
Tabel 4.5 Scene 5 Halaman Gallery Snapshot ........................................................ 24
Tabel 4.6 Scene 6 Halaman Hak Akses ................................................................... 25
Tabel 4.7 Scene 7 Halaman Setting Capture ........................................................... 26
Tabel 4.8 Deskripsi Use Case ................................................................................ 27
Tabel 4.9 Use Case 1 Melakukan Pengaturan Alamat IP Camera ......................... 28
Tabel 4.10 Use Case 2 Monitoring Data IP Camera ................................................ 30
Tabel 4.11 Use Case 3 Monitoring Data Lebih Detail .............................................. 31
Tabel 4.12 Use Case 4 Melihat Gambar Tersimpan ................................................. 32
Tabel 4.13 Use Case 5 Melakukan Pengolahan Hak Akses...................................... 33
Tabel 5.1 Spesifikasi Perangkat Keras .................................................................... 36
Tabel 5.2 Spesifikasi Perangkat Lunak ................................................................... 36
Tabel 5.3 Scene 1 Halaman Utama Aplikasi ........................................................... 37
Tabel 5.4 Halaman Setting ...................................................................................... 38
Tabel 5.5 Halaman Monitoring ............................................................................... 38
Tabel 5.6 Halaman Detail Monitoring .................................................................... 39
Tabel 5.7 Halaman Gallery Snapshot...................................................................... 40
Tabel 5.8 Halaman Hak Akses ................................................................................ 41
Tabel 5.9 Kode Program Pengaturan IP Camera .................................................... 42
Tabel 5.10 Kode Program Monitoring ...................................................................... 44
Tabel 5.11 Kode Program Capture ........................................................................... 45
Tabel 5.12 Kode Program Detail Monitoring ........................................................... 46
Tabel 6.1 Kegiatan Pengujian ................................................................................. 54
ix
DAFTAR GAMBAR
Gambar 2.1 IP Network Infrastructur .................................................................5

Gambar 2.2 Contoh Kamera Analog ...................................................................6
Gambar 2.3 Contoh IP Camera ...........................................................................6
Gambar 3.1 Navigasi Aplikasi Bawaan Ip Camera ..........................................17
Gambar 3.2 Pengaturan Revolusi Gambar ........................................................17
Gambar 3.3 Pengaturan Tingkat Kecerahan dan Kontras Gambar ...................17
Gambar 4.1 Interface Halaman Utama..............................................................21
Gambar 4.2 Interface Halaman Setting .............................................................22
Gambar 4.3 Interface Halaman Monitoring .......................................................23
Gambar 4.4 Interface Halaman Monitoring Data Lebih Detail .........................24
Gambar 4.5 Interface Halaman Gallery Snapshot .............................................25
Gambar 4.6 Interface Halaman Hak Akses ........................................................26
Gambar 4.7 Interface Halaman Setting Capture ................................................26
Gambar 4.8 Use Case Diagram ..........................................................................28
Gambar 4.9 Activity Diagram Proses Pengaturan IP Camera ............................34
Gambar 4.10 Activity Diagram Proses Pengaturan Hak Akses ............................34
Gambar 4.11 Activity Diagram Proses Pemantauan Objek ..................................35
Gambar 4.12 Class Diagram ................................................................................35
Gambar 5.1 Antarmuka Halaman Utama ...........................................................37
Gambar 5.2 Antarmuka Halaman Setting...........................................................38
Gambar 5.3 Antarmuka Halaman Monitoring ...................................................39
Gambar 5.4 Antarmuka Halaman Detail Monitoring .........................................40
Gambar 5.5 Antarmuka Halaman Gallery Snapshot ..........................................41
Gambar 5.6 Antarmuka Halaman Hak Akses ....................................................41
Gambar 5.7 Tabel IP Camera.............................................................................42
Gambar 5.8 Tabel Gambar .................................................................................42
Gambar 5.9 Tabel Pengguna ..............................................................................42
Gambar 6.1 Tampilan Gambar 2 IP Camera .....................................................54
Gambar 6.2 Tampilan Halaman Setting .............................................................55
Gambar 6.3 Tampilan Gambar IP Camera yang Terdaftar ................................55
Gambar 6.4 Tampilan Fungsi Navigasi ..............................................................56
Gambar 6.5 Tampilan Capture Gambar .............................................................56
Gambar 6.6 Tampilan Gallery Snapshot ............................................................57
Gambar 6.7 Tampilan Pengaturan Hak Akses ...................................................58
x
DAFTAR LAMPIRAN
Lampiran A. User Acceptance Test .................................................................... A-1
xi
DAFTAR PUSTAKA
1. Haryanto, E.V. (2012). Jaringan Komputer. Yogyakarta : C.V.Andi

Offset.
2. Iqbal M. (2012). Sistem Implementasi Klien SIP Berbasis Web
Menggunakan HTML5 dan Node.js. Jurnal Teknik ITS. Vol.1, Hal. 243
3. Jaringan-komputer.org. (2014). LAN dan WLAN. Tersedia di
http://www.jaringankomputer.org/wifi-adalah-wireless-lan-carakerja-
sejarah-wifi/. [Akses 5 Mei 2014].
4. Kadir, A. (2009). Membuat Aplikasi Web dengan PHP+Database
MySQL. Yogyakarta:CV. Andi Offset.
5. Kamus Besar Bahasa Indonesia. (2014.) Pemantauan. Tersedia di
https://kbbi.web.id/pantau-2 [Akses 5 Maret 2014].
6. Myonlinecctv.com (2014). Perbedaan Camera Analog dan IP Camera
Digital CCTV Tersedia di http://www.myonlinecctv.com/2-system-
camera-cctv/95-perbedaan-camera-analog-dan-ip-camera [Diakses 5 Mei
2014].
7. Pendopo Vmeet. (2014). Apa itu IP Camera?. Tersedia di
http://in.vmeetsolutions.com/ [Diakses 5 Mei 2014].
8. Rosa, A.S. dan Shalahudin, M. (2011). Modul Pembelajaran Rekayasa
Perangkat Lunak. Bandung : Modula.
9. Sidik, B. (2011). Java Script. Bandung: Informatika Bandung.
10. Sutabri, T. (2012). Konsep Sistem Informasi. Yogyakarta : C.V.Andi
Offset.
11. Uml-diagrams.org. (2014). The Unified Modeling Language. Tersedia
di http://www.uml-diagrams.org/uml-25-diagrams.html. [Akses 5 Mei
2014].
12. Wahana Komputer. (2013). Teknik Singkat dan Cepat Menguasai CSS3.
Semarang: CV. Andi Offset.
61
LAMPIRAN A
USER ACCEPTANCE TEST
Pengujian aplikasi monitoring aktivitas dengan menggunakan IP Camera

berbasis web akan dilakukan pada beberapa orang dengan daftar pertanyaan
pengujian sebagai berkut:
Tabel A.1 Hasil Pengujian
No. Pengujian Tanggapan Komentar
Ya Tidak
1. Apakah data objek dari IP
Camera dapat diakses?
2. Apakah informasi IP
Camera dapat diinput dan
diupdate?
3. Apakah dapat melihat input
beberapa objek dari
beberapa IP Camera secara
bersamaan?
4. Apakah navigasi
pengontrolan alat dapat
berjalan?
5. Apakah dapat melakukan
capture objek?
6. Apakah data objek yang
direkam dan dicapture dapat
tersimpan secara otomatis
dan dapat dilihat?
Saran:_______________________________________________________
_____________________________________________________________
Responden
__________________
A-1
Ya Tidak
Camera dapat di input dan
di update?
beberapa objek dari
bersamaan?
4. Apakah navigasi
berjalan?
capture objek?
direkam dan di capture
dapat tersimpan secara
otomatis dan dapat dilihat?
Saran:_______________________________________________________
_____________________________________________________________
Responden
__________________
A-2
Ya Tidak
di update?
beberapa objek dari
bersamaan?
4. Apakah navigasi
berjalan?
capture objek?
Saran:_______________________________________________________
_____________________________________________________________
Responden
__________________
A-3
Ya Tidak
di update?
beberapa objek dari
bersamaan?
4. Apakah navigasi
berjalan?
capture objek?
Saran:_______________________________________________________
_____________________________________________________________
Responden
__________________
A-4
Ya Tidak
di update?
beberapa objek dari
bersamaan?
4. Apakah navigasi
berjalan?
capture objek?
Saran:_______________________________________________________
_____________________________________________________________
Responden
__________________
A-5
BAB I
PENDAHULUAN
1.1 Latar Belakang

Seiring dengan perkembangan ilmu pengetahuan dan teknologi (IPTEK)
penggunaan perangkat elektronik sebagai alat penunjang kebutuhan manusia
tidak terbendung lagi. Salah satu perangkat elektronik yang mengalami
perkembangan signifikan adalah kamera. Kamera yang awalnya digunakan untuk
mencitrakan suatu objek yang ingin disimpan untuk ditampilkan, kini hadir dalam
berbagai bentuk dan fungsi yang unik. Seperti penggunaan kamera sebagai alat
komunikasi, hiburan dan bahkan sebagai alat keamanan.
Penggunaan kamera sebagai alat keamanan dapat ditemui berbagai aspek
kehidupan, seperti dalam dunia pendidikan digunakan untuk pengawasan ujian,
bisnis untuk kontrol kinerja karyawan, pengontrolan barang, lalu lintas jalan serta
keamanan pribadi (rumah). Kamera yang sering digunakan sebagai kamera
pengintai yaitu Internet Protokol Camera (IP Camera), Web Camera, dan kamera
CCTV (Closed Circuit Television). Perbedaan dari ketiga jenis kamera di atas
adalah IP Camera memiliki harga yang lebih mahal namun lebih efisien
dibandingkan dengan Web Camera dan kamera CCTV karena memiliki
kemampuan komunikasi langsung dengan jaringan Internet dengan mengakses
alamat IP Camera Web Camera merupakan bawaan perangkat komputer dengan
media penggubung USB (Universal Serial Bus) sehingga membuat akses kamera
terbatas pada perangkat komputer tersebut namun jika berbicara harga Web
Camera dapat menjadi pilihan, dan kamera CCTV memiliki harga menengah dan
cara akses terbatas pada perangkat televisi.
Adapun setiap IP Camera telah dilengkapi dengan aplikasi bawaan yang
menunjang kinerja sistem dan terdapat perbedaan antar aplikasi bawaan IP
Camera yang satu dengan yang lainnya. Hal ini disebabkan oleh perbedaan
kualitas IP Camera yang didasarkan pada merek, fungsi, dan harga jual yang
ditawarkan. Namun kegiatan monitoring akan lebih baik jika kegiatan tersebut
1
2
dapat dilakukan terhadap objek yang ditangkap dalam beberapa kamera secara
bersamaan kapan saja dan di mana saja.
Berdasarkan uraian masalah di atas, dapat dilihat adanya kesempatan
pembangunan sebuah aplikasi Monitoring Aktivitas dengan Menggunakan IP
Camera berbasis web yang menampilkan objek berupa gambar digital dan bersifat
real time serta menjamin keamanan objek yang dipantau.
1.2 Perumusan Masalah

Bagaimana merancang, membuat dan mengimplementasikan aplikasi
Monitoring Aktivitas dengan Menggunakan IP Camera berbasis web?
1.3 Tujuan Tugas Akhir

Untuk merancang, membuat dan mengimplementasikan aplikasi Monitoring
Aktivitas dengan Menggunakan IP Camera berbasis web.
1.4 Ruang Lingkup dan Batasan Masalah

Adapun ruang lingkup yang akan dibahas dari aplikasi ini adalah:
1. Melakukan pengumpulan dan pemrosesan data yang terkait dengan
pembangunan aplikasi.
2. Melakukan analisis kebutuhan dan perbandingan aplikasi serupa dengan
aplikasi yang akan dibangun.
3. Membuat perancangan antarmuka, basis data dan proses untuk aplikasi
yang dibangun.
4. Melakukan pemrograman aplikasi.
5. Daftar fitur- fitur dalam aplikasi yang akan dibangun:
a. Melakukan pengaturan IP Camera yang akan diakses.
b. Melakukan monitoring banyak objek dari banyak IP Camera yang
telah diatur sebelumnya.
c. Melakukan monitoring objek lebih detail per- kamera.
d. Melingkupi fungsi navigasi kontrol IP Camera (putar ke kiri, kanan,
atas dan bawah khusus untuk IP Camera dengan roda pemutar).
e. Melakukan capture gambar objek yang ditangkap IP Camera.
f. Melingkupi penyimpanan otomatis hasil capture gambar objek.
3
g. Penyimpanan gambar dinamai dengan menyertakan fungsi date and

time.
Adapun yang menjadi batasan masalah dalan pembangunan aplikasi adalah
aplikasi yang dibangun tidak melingkupi fungsi rekam video.
1.5 Manfaat Tugas Akhir

Apapun manfaat yang didapat dalam pembangunan aplikasi monitoring
aktivitas dengan menggunakan IP Camera berbasis web adalah sebagai berikut:
1. Mendapatkan pengetahuan tambahan tentang IP Camera, koneksi
jaringan dan fungsi IP Camera dalam kehidupan masyarakat.
2. Mendapatkan pengetahuan yang berhubungan dengan pembangunan
aplikasi.
3. Memenuhi kebutuhan monitoring suatu objek.
1.6 Metodologi Penelitian

1. Fase 1 Process Overview, pada tahap ini akan dijelaskan bagaimana ide
pembangunan perangkat lunak diangkat dengan melihat pada masalah
yang didefinisikan.
2. Fase 2 Requirements, merupakan tahap identifikasi segala atribut,
persyaratan pengguna dan tujuan pembangunan perangkat lunak.
3. Fase 3 Information and Planning, Fase ini akan membahas bagaimana
menyelidiki perangkat lunak yang dibangun apakah akan dirilis dengan
hak paten tertentu.
4. Fase 4 Design, menjelaskan bagaimana perangkat lunak akan dibangun
dan memiliki bentuk seperti apa saat akan digunakan.
5. Fase 5 Prototypes, tahapan prototypes menjelaskan dengan lebih
terperinci bagaimana hasil akhir dari perangkat lunak yang dibangun
walaupun dengan bentuk yang masih prototype.
6. Fase 6 Production, merupakan tahap perangkat lunak siap untuk
dibangun setelah menyelesaikan 5 tahap sebelumnya. Dalam tahap ini
juga bertujuan untuk merangkum seluruh dokumen yang diperlukan
untuk merilis aplikasi sesuai dengan kebutuhan pasar.
4
1.7 Sistematika Penulisan

Berikut adalah sistematika penulisan laporan yang menggambarkan secara
ringkas setiap bab yang ada didalamnya:
1. BAB I PENDAHULUAN
Bab ini berisikan latar belakang masalah yang diangkat, perumusan
masalah yang disimpulkan, tujuan tugas akhir yang didapat, ruang
lingkup serta batasan masalah, metodologi penelitian yang digunakan,
serta sistematika penulisan laporan tugas akhir.
2. BAB II TINJAUAN PUSTAKA
Bab ini menjelaskan teori yang digunakan sebagai bahan pembelajaran
dalam pembangunan aplikasi dengan menggunakan metodologi
prototype. Teori- teori tersebut dapat dipelajari dari buku- buku, internet
dan jurnal.
3. BAB III ANALISIS
Bab ini berisikan analisis persyaratan berdasarkan identifikasi masalah
yang dilakukan sehubungan dengan pembangunan aplikasi.
4. BAB IV PERANCANGAN
Bab ini berisikan perancangan antarmuka, beserta script aplikasi yang
dibangun.
5. BAB V IMPLEMENTASI
Bab ini menjelaskan implementasi aplikasi yang telah dirancang.
6. BAB VI PENGUJIAN
Bab pengujian akan dilakukan evaluasi dan uji coba aplikasi yang
dibangun.
7. BAB VII KESIMPULAN DAN SARAN
Bab ini akan mempresentasikan hasil berupa kesimpulan dan saran
pengembangan sistem untuk penggunaan aplikasi yang lebih baik lagi.
BAB II
STUDI PUSTAKA
Untuk mencapai tujuan dan menyelesaikan permasalahan, penulis

melakukan berbagai studi pustaka yang berhubungan dengan pembangunan
perangkat lunak. Adapun studi pustaka diambil dari beberapa sumber seperti,
buku- buku (e-books), jurnal, dan artikel edukatif di Internet.
2.1 IP Camera
Pendopo Vmeet (2014) menjelaskan pengertian IP Camera atau IP
Network Camera yaitu suatu kamera yang dalam, pengiriman kontrol signal dan
data image menggunakan IP (Internet Protocol). IP Camera sering terhubung
dengan DVR (Digital Video Recorder) atau NVR (Network Video Recorder).
Penggunaan DVR dan NVR akan sering ditemui dalam video security atau untuk
surveillance dengan tujuan membantu dalam keamanan. Alat- alat tersebut dapat
dikoneksikan pada jaringan komputer dan hasil video nantinya dapat dikendalikan
dan dilihat darimana saja. Untuk mengakses IP Camera dapat menggunakan Web
Browser. Untuk setiap IP Camera mempunyai alamat network yang unik. Ada
berbagai jenis protocol yaitu, HTTP dan TCP/IP.
Gambar 2.1 IP Network Infrastructure (Pendopo Vmeet 2014)
5
6
Adapun analog kamera yang dapat dibandingkan dengan IP Camera

adalah kamera CCTV biasa yang memakai kabel Coaxial. Berikut contoh kamera
CCTV, dan IP Camera:
Gambar 2.2 Contoh Kamera Analog (Myonlinecctv.com)
Gambar 2.3 Contoh IP Camera (Myonlinecctv.com)

7
Berikut kelebihan dan kekurangan sistem kamera CCTV, adalah:

a. Kelebihan
1. Harga kamera CCTV lebih murah dibandingkan IP Camera.
2. Dalam melakukan konfigurasi peralatan dan pengaturan lebih
mudah.
3. Kualitas gambar baik dengan gerakan objek tampak nyata.
b. Kekurangan
1. Instalasi kabel sedikit lebih "berat" daripada IP Cam.
2. Harga kabel coaxial dan connector BNC lebih mahal ketimbang
kabel UTP dan RJ-45.
3. Memerlukan kabel yang lebih banyak untuk power, data dan video.
4. Lebih mudah dipengaruhi noise dan interferensi.
5. Peralatan yang diperlukan untuk mengintegrasikan sistem bisa lebih
banyak.
Adapun kelebihan dan kekurangan IP Camera, adalah:

a. Kelebihan
1. Instalasi kabel lebih sedikit dan ringkas.
2. Biaya kabel, connector dan material bantu lainnya bisa lebih murah.
3. Lebih tahan terhadap noise dan interferensi.
4. Jika akan ditransmisikan lewat udara (wireless), maka wireless IP
Camera lebih aman dari penyadapan ketimbang analog.
5. Peralatan yang diperlukan untuk mengintegrasikan sistem lebih
sedikit.
6. Teknologi TCP/IP terus berkembang pesat, sehingga feature-nya
bisa lebih baik untuk masa datang.
b. Kekurangan
1. Diperlukan pemahaman yang mantap terhadap dasar-dasar jaringan
LAN dan Internet.
2. Setting lebih rumit.
3. Panjang kabel UTP dibatasi oleh angka, yaitu hanya 100m saja.
4. Harga kameranya lebih mahal, demikian pula dengan harga adaptor
PoE (Power over Ethernet).
8
5. DVR stand alone yang langsung support IP Camera (disebut dengan

NVR atau Network Video Recorder) masih sedikit dan sangat mahal.
6. Software NVR masih berharga mahal.
7. Bandwidth menjadi isu penting.
8. Dibanding analog, gerakan objek pada IP Camera umumnya
mengalami perlambatan/ seperti gerakan astronot di bulan
(moonwalk), kecuali pada produk- produk yang termasuk high-end.
2.2 Monitoring
Monitoring atau pemantauan yang dilihat dari Kamus Besar Bahasa
Indonesia (Kamus Besar Bahasa Indonesia 2014) merupakan suatu proses atau
perbuatan memantau suatu objek.
Dalam kesempatan lain, monitoring juga didefinisikan sebagai langkah
untuk mengkaji apakah kegiatan yang dilaksanakan telah sesuai dengan rencana,
mengidentifikasi masalah yang timbul agar langsung dapat diatasi, melakukan
penilaian apakah pola kerja dan manajemen yang digunakan sudah tepat untuk
mencapai tujuan, mengetahui kaitan antara kegiatan dengan tujuan untuk
memperoleh ukuran kemajuan (Sutabri 2012).
2.3 Jaringan
2.3.1 Jaringan Kabel LAN dan Wireless
Menurut Haryanto (2012), LAN adalah singkatan dari Local Area
Network. LAN terdiri dari beberapa komputer yang terhubung dalam suatu
jaringan. Pada jaringan ini, setiap komputer dapat mengakses data dari komputer
lain. Selain itu komputer yang terhubung dalam LAN juga dapat menjalankan
hardware seperti printer dari komputer lain. Jumlah komputer yang terhubung
dalam LAN relatif kecil, misalnya komputer-komputer di rumah, warnet, kos dan
beberapa tempat lain yang komputernya termasuk di dalam LAN, yang berada
dalam satu bangunan. Setiap komputer yang terhubung pada LAN mempunyai IP
Address yang berbeda.
Komputer di dalam LAN terhubung melalui Ethernet atau juga dapat
terhubung dengan wireless teknologi berkecepatan antara 10-100 Mbps. LAN
yang menggunakan teknologi wireless biasanya disebut dengan wireless LAN.
9
Wireless LAN hanya digunakan jika pada tempat tersebut tidak memungkinkan
dipasangi kabel.
2.3.2 IP Address
IP address atau alamat Internet Protocol adalah identifikasi numerik pada
alamat dasar dari sebuah komputer ketika berada pada bagian jaringan komputer.
IP Address dibagi menjadi 2 bagian yaitu network ID dan host ID. Network ID
akan menetukan alamat dalam jaringan (Network Address), sedangkan host ID
menentukan alamat dari peralatan jaringan yang digunakan. Setiap komputer yang
terkoneksi ke internet diberi alamat IP yang berbeda-beda (Haryanto 2012).
2.4 Aplikasi Web

Kadir (2009) menjelaskan pengertian dari aplikasi web adalah jenis
aplikasi yang diakses melalui browser, misalnya Mozilla Firefox atau Internet
Explorer. Dengan menggunakan aplikasi web, aplikasi hanya perlu ditempatkan
dalam sebuah server dengan sendirinya aplikasi tersebut dapat diakses dari
manapun, sepanjang pemakai dapat mengakses web server-nya.
2.5 CSS 3
Cascading Style Sheet (CSS) bukan merupakan bahasa pemrograman, CSS
merupakan aturan untuk mengendalikan beberapa komponen dalam sebuah web
sehingga akan lebih terstruktur dan seragam. CSS dapat mengendalikan ukuran
gambar, warna bagian tubuh pada teks, warna tabel, ukuran border, warna border,
warna hyperlink, warna mouse over, spasi antar paragraf, spasi antar teks, margin
kiri, kanan, atas, bawah, dan parameter lainnya (Wahana Komputer 2013).
Pada dasarnya sintaks CSS terdiri dari tiga bagian, yaitu selector, property,dan
value. Berikut contoh penggunaan selector, property, dan value.
body {
Font-family: Arial, sans-serif }
2.6 Pemrograman Web

Untuk membangun dan mengembangkan suatu Aplikasi berbasis Web,
diperlukan beberapa bahasa pemrograman yang dapat membantu dalam
10
membangun dan mengembangkan aplikasi. Berikut dijelaskan secara singkat

beberapa bahasa pemrograman yang akan digunakan:
2.6.1 HTML5
HTML5 (Hypertext Markup Language version 5) adalah sebuah bahasa
markah yang menstrukturkan isi dari World Wide Web, sebuah teknologi utama
pada internet. Standar HTML5 menyempurnakan elemen-elemen lama yang
terdapat pada standar sebelumnya, menambahkan elemen-elemen yang lebih
semantik dan menambahkan fitur-fitur baru untuk mendukung pembuatan aplikasi
web yang lebih kompleks. Fitur-fitur yang disematkan pada HTML5 adalah
Video, Websocket dan WebRTC. HTML5 Video adalah elemen baru pada HTML5
yang bertujuan untuk menampilkan dan memainkan berkas video. Websocket
adalah implementasi koneksi soket yang berjalan di atas protokol HTTP yang
menyediakan aliran data secara real-time antara klien dan server. WebRTC (Web
Real-Time Communication) adalah sebuah antarmuka pemrograman perangkat
lunak yang menelusuri kemungkinan komunikasi data audio dan video antar
pengguna melalui perambah (Iqbal 2012).
2.6.2 Javascript
Sidik (2011) mengatakan, JavaScript merupakan bahasa yang digunakan
untuk membuat program yang menggunakan dokumen HTML yang ditampilkan
dalam browser menjadi lebih interaktif. Javascript dapat berupa bahasa script,
yang tidak memerlukan compiler untuk menjalankannya, cukup dengan
interpreter. Jika browser web yang telah memiliki interpreter JavaScript, maka
program JavaScript ini akan dijalankan.
Adapun hasil eksekusi JavaScript umumnya berupa elemen dokumen
HTML, sehingga hasil dari program ditampilkan sebagai satu kesatuan dengan
dokumen HTML. Cara kerja JavaScript yaitu, program JavaScript disisipkan
kedalam dokumen HTML dengan ditandai tag yang diawali <script….> dan
diakhiri dengan </script>.
JavaScript berbeda dengan Java. Java merupakan bahasa pemrograman
yang membutuhkan proses kompilasi terlebih dahulu agar bisa dijalankan.
11
Program yang dibuat dengan Java hasilnya berupa applet dan aplikasi yang
berdiri sendiri.
2.7 Metodologi Pengembangan Sistem

Metodologi pengembangan sistem yang digunakan adalah metodologi
prototype. Menurut Rosa dan Shalahuddin (2011) metodologi prototype akan
dimulai dengan pengumpulan kebutuhan terhadap perangkat lunak. Untuk
mencapai kebutuhan terhadap perangkat lunak tersebut maka dilakukan
pemrograman untuk memberikan informasi hasil akhir yang diinginkan. Program
yang dibangun akan menyediakan informasi yang menjelaskan bagaimana
tampilan dalam bentuk simulasi alur perangkat lunak yang dibangun dan
menyerupai perangkat lunak yang dimaksudkan. Program yang dibangun akan
terus dievaluasi untuk menetapkan bahwa program telah sesuai dengan spesifikasi
dan kebutuhan pengguna.
Berikut dijelaskan tahapan dari model prototype berdasarkan Rosa dan
Shalahuddin (2011):
1. Mendengarkan Pelanggan
Pada tahap ini akan didaftarkan kebutuhan berdasarkan keinginan pelanggan.
Sebagai contoh keinginan pelanggan yaitu mendefinisikan tujuan dari pembuatan
sistem, gambaran bagaimana sistem akan dibangun dan sebagainya. Harus
diperhatikan bahwa kebutuhan yang diberikan oleh pelanggan biasanya adalah
kebutuhan yang sifatnya umum. Untuk memperjelas kebutuhan yang didefinisikan
pelanggan, maka dilakukan pemrograman yang terus dievaluasi pada pelanggan.
2. Membangun atau memperbaiki mock-up
Pada tahap ini dimulai dengan membangun prototype secara cepat sesuai
dengan kebutuhan dan keinginan pelanggan.
3. Pelanggan melihat dan menguji mock-up
Pada tahap ini dilakukan pengujian terhadap prototype yang telah dibuat
sebelumnya. Setelah melakukan pengujian maka akan dievaluasi kembali untuk
menjelaskan perubahan perubahan apa saja yang akan dilakukan hingga keinginan
pelanggan dapat terpenuhi.
12
Adapun beberapa kelebihan dan kekurangan prototype:

a. Kelebihan:
1. Pengembangan dapat bekerja lebih baik dalam menentukan kebutuhan
pelanggan
2. Pelanggan berperan aktif dalam pengembangan sistem
3. Akan terciptanya komunikasi yang baik antara pengembang dan
pelanggan
4. Menghemat waktu pengembangan.
b. Kekurangan:
1. Proses analisis dan perancangan terlalu singkat.
2. Sering terjadi perubahan, penambahan dan pengurangan spesifikasi
kebutuhan karena seringnya dilakukan evaluasi
3. Pengembang terkadang membuat implementasi sembarangan karena
ingin bekerja dengan cepat dan hanya memikirkan bayaran.
Model prototype dirancang agar dapat menerima perubahan-perubahan

dalam rangka menyempurnakan protitype yang sudah ada sehingga pada akhirnya
dapat menghasilkan perangkat lunak yang dapat diterima dan perubahan-
perubahan yang terjadi dapat dianggap merupakan bagian dari proses
pengembangan itu sendiri. Model ini lebih cocok digunakan untuk proyek jangka
pendek.
2.7.1 Tahapan Pembangunan Aplikasi

Terdapat 6 langkah dalam melakukan pembangunan perangkat lunak
dengan pendekatan prototyping berdasarkan Rosa dan Shalahuddin (2011), yaitu:
1. Fase 1 Process Overview, pada tahap ini akan dijelaskan bagaimana
ide pembangunan perangkat lunak diangkat dengan melihat pada
masalah yang didefinisikan.
2. Fase 2 Requirements, merupakan tahap identifikasi segala atribut,
persyaratan pengguna dan tujuan pembangunan perangkat lunak.
3. Fase 3 Information and Planning, Fase ini akan membahas bagaimana
menyelidiki perangkat lunak yang dibangun apakah akan dirilis
dengan hak paten tertentu.
13
4. Fase 4 Design, menjelaskan bagaimana perangkat lunak akan

dibangun dan memiliki bentuk seperti apa saat akan digunakan.
5. Fase 5 Prototypes, hapan prototypes menjelaskan dengan lebih
terperinci bagaimana hasil akhir dari perangkat lunak yang dibangun
walaupun dengan bentuk yang masih prototype.
6. Fase 6 Production, merupakan tahap perangkat lunak siap untuk
dibangun setelah menyelesaikan 5 tahap sebelumnya. Dalam tahap ini
juga bertujuan untuk merangkum seluruh dokumen yang diperlukan
untuk merilis aplikasi sesuai dengan kebutuhan pasar.
2.7.2 Kakas yang Digunakan

Kakas pemodelan yang digunakan dalam pembangunan perangkat lunak
adalah Unified Modelling Language (UML). UML adalah bahasa pemodelan
standar yang dimaksudkan untuk melakukan pemodelan proses, analisis, desain
dan implementasi pengembangan perangkat lunak. Tujuan dari UML adalah untuk
menyediakan kosakata umum pemrograman berorientasi objek dan pengembang
berorientasi objek sistem (UML-diagram.org 2014).
Berdasarkan UML versi 2.4.1 teknik diagram UML yang akan digunakan,
adalah:
a) Use Case diagram
Use Case diagram biasanya disebut dengan diagram perilaku yang
digunakan untuk menggambarkan serangkaian tindakan. Setiap Use
Case harus memberikan beberapa hasil yang diamati dan berhaga bagi
pelaku maupun sistem.
b) Activity diagram
Diagram aktivitas adalah UML diagram yang menunjukkan perilaku dan
melingkupi aliran kontrol atau aliran objek dengan penekanan pada
urutan dan kondisi aliran.
c) Class diagram
Class diagram adalah diagram struktur UML yang menunjukkan struktur
dari sistem yang dirancang pada tingkat kelas dan Interface untuk
14
menunjukkan fitur, kendala, dan hubungan asosiatif, generalisasi dan

dependensi.
2.8 Prosedur Pengumpulan, Pengolahan dan Penyimpanan Data

Pengumpulan data dilakukan untuk membantu proses analisis dan
perancangan perangkat lunak agar permasalahan dan kebutuhan dapat diketahui
dengan baik.
2.8.1 Sumber Data

Terdapat dua jenis data yang digunakan, yaitu:
1. Data Primer
Data primer merupakan data yang dikumpulkan secara langsung
melalui observasi.
2. Data Sekunder
Data sekunder merupakan data yang diperoleh dengan melakukan studi
pustaka melalui buku dan artikel di internet.
2.8.2 Teknik Pengumpulan Data

Adapun cara pengumpulan data yang dilakukan, adalah:
1. Melakukan Analisis Sistem
Melakukan analisis sistem adalah mendefinisikan sistem yang akan
dibangun dan melakukan perbandingan dengan aplikasi pembanding
yang telah didefinisikan.
2. Studi Pustaka
Melakukan studi pustaka berdasarkan pada aplikasi yang dibangun,
perangkat lunak yang mendukung, serta metodologi pengembangan
sistem.
2.8.3 Cara Mengolah dan Menyimpan Data

Data yang diperlukan akan dikumpulkan untuk dijadikan satu informasi
untuk penyelesaian masalah yang diangkat. Data yang diperlukan disimpan
dengan menggunakan media penyimpanan elektronik (jika softcopy) dan buku
15
yang dimiliki. Data yang dimiliki akan diakses untuk memenuhi kebutuhan
analisis data, perancangan sistem dan implementasi program.
2.8.4 Media Penyimpanan Data

Setelah melakukan studi pustaka, data yang didapatkan disimpan dalam
media penyimpanan seperti, harddisk, flashdisk, media penyimpanan online
seperti e-mail dan jejaring sosial, serta adapun penyimpanan data dalam bentuk
print out artikel, buku dan buku catatan.
BAB III
ANALISIS
Bab 3 adalah tahap analisis dan dibagi menjadi 2 bagian yang terdiri dari
fase 1 Process Overview dan fase 2 Requirements berdasarkan langkah- langkah
pada metodologi prototyping.
3.1 Process Overview

Pada tahap ini akan dijelaskan bagaimana ide pembangunan perangkat lunak
diangkat dengan melihat pada masalah yang didefinisikan. Masalah yang
didefinisikan adalah hasil analisis aplikasi yang sudah ada sebelumnya (aplikasi
bawaan IP Camera) serta analisis terhadap aplikasi yang akan dibangun.
3.1.1 Definisi Aplikasi yang Sudah Ada Sebelumnya

IP Camera yang digunakan sebagai penunjang pembangunan aplikasi
adalah “IP Camera Sun Bio”. Setiap IP Camera telah dilengkapi dengan aplikasi
bawaan masing- masing IP Camera dan setiap aplikasi bawaan IP Camera hanya
mendefinisikan satu IP Camera. Adapun dijelaskan kelebihan dan kelemahan
aplikasi bawaan IP Camera Sun Bio, yaitu:
a. Kelebihan Aplikasi Bawaan IP Camera Sun Bio:
Aplikasi Bawaan IP Camera Sun Bio memiliki fitur menampilkan objek
yang ditangkap IP Camera secara real time. Beberapa keunggulan yang
dimiliki oleh aplikasi bawaan IP Camera adalah:
1. Dapat menampilkan objek yang ditangkap IP Camera.
2. Memiliki delapan arah rotasi IP Camera yaitu, putaran ke kiri, putaran
ke kanan, putaran tegak lurus ke atas, putaran tegak lurus ke bawah,
putaran 360 derajat ke kiri atas, putaran 360 derajat ke kanan atas,
putaran 360 derajat ke kiri bawah dan putaran 360 derajat ke kanan
bawah.
16
17
Gambar 3.1 Navigasi Aplikasi Bawaan IP Camera

3. Dapat melakukan pengaturan resolusi gambar .
4. Dapat menampilkan objek yang ditangkap IP Camera.
Gambar 3.2 Pengaturan Resolusi Gambar

5. Dapat melakukan pengaturan kecerahan dan kontras gambar.
Gambar 3.3 Pengaturan Tingkat Kecerahan dan Kontras Gambar

6. Dapat melakukan pemilihan mode tampilan.
b. Kekurangan Aplikasi Bawaan IP Camera Sun Bio:

1. Aplikasi bawaan IP Camera hanya dapat melakukan kontrol pada IP
Camera tersebut.
18
3.1.2 Definisi Aplikasi yang Akan Dibangun

Aplikasi yang akan dibangun diberi judul aplikasi monitoring aktivitas
dengan menggunakan IP Camera berbasis web adalah aplikasi yang memberikan
informasi berupa video objek yang ditangkap beberapa IP Camera yang informasi
tersebut dapat digunakan sebagai fungsi pemantauan objek secara real- time.
3.2 Spesifikasi Kebutuhan

1. Aplikasi dapat menampilkan input video real- time dari beberapa IP
Camera.
2. Aplikasi dapat melakukan capture gambar.
3. Aplikasi dapat melakukan kontrol rotasi IP Camera.
3.3 Identifikasi Spesifikasi Sistem

Identifikasi spesifikasi sistem akan menjelaskan kebutuhan dan keinginan
untuk membangun aplikasi monitoring aktivitas dengan menggunakan IP Camera
berbasis web. Spesifikasi sistem akan dijabarkan dalam pendefinisian fitur- fitur
yang terdapat pada aplikasi, sebagai berikut:
1. Melakukan koneksi perangkat keras.
Koneksi perangkat keras harus dapat memenuhi kebutuhan jaringan LAN
dan Wireless.
2. Melakukan pengaturan data IP Camera.
Pengaturan data IP Camera diperlukan untuk mendaftarkan alamat IP
Camera yang akan diakses dengan syarat semua perangkat harus berada
pada jaringan yang sama.
3. Melakukan akses aplikasi berdasarkan jaringan LAN dan Wireless
4. Melakukan monitoring IP Camera yang terdaftar dan dikoneksikan dalam
jaringan.
5. Melakukan monitoring objek secara lebih detail per- kamera.
Pilih satu kamera dan dapat melakukan monitoring lebih luas dengan
fungsi yang tersedia, navigasi roda kamera dan capture objek.
6. Melakukan penyimpanan langsung data gambar hasil capture objek.
19
3.4 Identifikasi Spesifikasi Pengguna

Dalam membangun aplikasi monitoring aktivitas dengan menggunakan IP
Camera berbasis web memerlukan beberapa aspek yang perlu untuk dianalisis
sehingga aplikasi yang dibangun dapat digunakan dan tepat pada sasaran sesuai
dengan keinginan pengguna yang dihadirkan dalam beberapa pertanyaan, sebagai
berikut:
a. Siapa yang akan menggunakan aplikasi?
Target pengguna aplikasi adalah seluruh masyarakat yang dapat
memfasilitasi IP Camera satu buah bahkan lebih.
b. Apa yang dibutuhkan pengguna?
Monitoring objek yang lebih fleksibel dan mudah dalam melakukan view
objek dan file tersimpan.
c. Berapa lama aplikasi dapat digunakan?
Aplikasi dapat digunakan dengan menyesuaikan perkembangan teknologi
IP Camera sehingga pengembangan terus menerus diperlukan.
d. Bagaimana aplikasi tersebut dapat dipakai?
Aplikasi akan berjalan dengan menggunakan aplikasi browser untuk
mengakses aplikasi. Untuk mengakses dengan jaringan LAN, dan jumlah
IP Camera yang akan diakses hanyalah satu maka dapat langsung
dicolokkan pada perangkat komputer. Namun jika terdapat beberapa IP
Camera maka harus menggunakan switch sebagai media penghubung.
Selain itu dapat juga diakses dengan menggunakan jaringan Wireless dan
memerlukan perangkat access point.
e. Apakah perangkat lunak yang dibangun melanggar hak paten?
Tidak, karena aplikasi dibangun dengan menggunakan source code yang
bersifat open- source.
f. Apakah aplikasi fleksibel dengan pengembangan yang lebih lanjut?
Ya, aplikasi akan sangat membutuhkan pengembangan yang
berkelanjutan karena perkembangan teknologi perangkat keras dan lunak
yang terus berkembang.
20
3.5 Analisis Kebutuhan

Pada tahap ini akan dijelaskan kebutuhan (requirement) perangkat keras dan
perangkat lunak yang diperlukan untuk membangun suatu aplikasi. Berikut ini
adalah analisis kebutuhan yang diperlukan untuk membangun aplikasi monitoring
aktivitas dengan menggunakan IP Camera berbasis web.
Tabel 3.1 Kebutuhan Hardware dan software dalam Aplikasi
No. Perangkat Lunak
1. Pemrograman PHP, HTML, Javascript
2. DBMS Mysql version 5.1.41
3. Teks Editor Notepad ++ v6.2.1
4. Browser Google Chrome v29.0
5. Perancangan Antarmuka Adobe Photoshop CS 3
6. Penggambaran Tools Microsoft Visio 2007
7. Sistem Operasi Microsoft Windows 7
No. Perangkat Lunak
1. Komputer/ Laptop - Processor Core i3
- Memory 2 GB
2. Access Point/ switch Kapasitas disesuaikan dengan
banyak IP Camera yang digunakan
3. IP Camera IP Camera Sun Bio
BAB IV
PERANCANGAN
Dalam bab 4 akan dilakukan perancangan aplikasi yang dibangun.

Perancangan aplikasi akan meliputi perancangan antarmuka aplikasi, arsitektur
jaringan, pemodelan Use Case dan activity diagram. Adapun perancangan aplikasi
yang dibangun bertujuan untuk mempermudah proses pembangunan aplikasi.
4.1 Perancangan Anatarmuka Aplikasi

a. Scene 1
Tabel 4.1 Scene 1 Halaman Utama Aplikasi
Name Scene Halaman Utama Aplikasi
Tujuan Scene Untuk menampilkan rancangan menu utama
aplikasi
Halaman Awal -
Halaman Akhir Halaman setting
Gambar 4.1 Interface Halaman Utama

Keterangan - Scene ini mendeskripsikan halaman awal aplikasi.
- Dibagian kiri terdapat navigasi menu untuk
mengakses aplikasi dan akan dijelaskan pada scene
21
22
berikutnya.
- Tombol login dan logout untuk pengontrolan akses
aplikasi
b. Scene 2
Tabel 4.2 Scene 2 Halaman Setting
Name Scene Halaman Setting
Tujuan Scene Untuk menampilkan cara pengaturan IP Camera
yang akan diakses
Halaman Awal Halaman Home
Halaman Akhir Halaman Monitoring
Gambar 4.2 Interface Halaman Setting

Keterangan - Pada scene ini akan didefinisikan IP Camera yang
akan diakses.
- Masukan yang diinginkan meliputi ID, Nama IP
Camera (dapat disesuaikan dengan tempat kamera
ditempatkan), Alamat IP Camera.
- Tombol ADD untuk memproses
- Tombol CANCEL untuk membatalkan aktivitas.
23
c. Scene 3
Tabel 4.3 Scene 3 Halaman Monitoring
Name Scene Halaman Monitoring
Tujuan Scene Menjelaskan bagaimana IP Camera yang telah
didefinisikan dapat dilihat oleh pengguna.
Halaman Awal Halaman Setting
Halaman Akhir Halaman Detail Monitoring
Gambar 4.3 Halaman Monitoring

Keterangan - Scene ini merupakan lanjutan dari Halaman
Setting, dimana akan ditampilkan data gambar
yang diambil oleh kamera yang didefinisikan.
- Pengguna dapat mengklik nama atau gambar
untuk masuk pada Halaman Detail Monitoring
d. Scene 4
Tabel 4.4 Scene 4 Detail Monitoring
Name Scene Halaman Detail Monitoring
Tujuan Scene Pada scene ini akan digambarkan bagaimana
kegiatan monitoring dilakukan
Halaman Awal Halaman Monitoring
Halaman Akhir Halaman Gallery Gambar
24
Gambar 4.4 Halaman Monitoring Data Lebih Detail

Keterangan - Halaman ini ditampilkan data gambar IP
Camera yang dipilih lebih besar dan jelas.
- Disertakan aktivitas monitoring yang dapat
dilakukan oleh pengguna seperti memutar IP
Camera dan capture gambar.
e. Scene 5
Tabel 4.5 Scene 5 Halaman Gallery Snapshot
Name Scene Halaman Gallery Snapshot
Tujuan Scene Menampilkan data gambar yang difoto pengguna
Halaman Awal Halaman detail monitoring
Halaman Akhir -
Gambar 4.5 Halaman Galery Snapshot dapat dilihat dalam pada halaman
25.
25
Gambar 4.5 Halaman Galery Snapshot

Keterangan - Ditampilkan seluruh gambar yang
tersimpan
- Untuk melihat gambar lebih detail dapat
mengklik gambar atau nama gambar.
f. Scene 6
Tabel 4.6 Scene 6 Halaman Hak Akses
Name Scene Halaman Hak Akses
Tujuan Scene Untuk mengatur pengguna yang mengakses
aplikasi
Halaman Akhir -
Gambar 4.6 Halaman Hak Akses dapat dilihat dalam pada halaman 26.
26
Gambar 4.6 Halaman Hak Akses

Keterangan - Memasukkan username dan password
pengguna
g. Scene 7
Tabel 4.7 Scene 7 Halaman Setting Capture
Name Scene Halaman Setting Capture
Tujuan Scene Bertujuan untuk melakukan pengaturan capture
otomatis
Halaman Akhir -
Gambar 4.7 Halaman Setting Capture

27
Keterangan - Pengguna dapat melakukan pengaturan

waktu capture otomatis yang meliputi,
pengaturan waktu awal, pengaturan waktu
akhir dan jeda waktu capture.
4.2 Perancangan Aplikasi

4.2.1 Use Case Diagram
Use Case diagram merupakan pemodelan yang digunakan untuk
menggambarkan proses akses aplikasi yang meliputi kegiatan pengguna dan
tanggapan sistem.
Tabel 4.8 Deskripsi Use Case
No. Use Case Deskripsi
1. Melakukan pengaturan Menjelaskan bagaimana pengguna melakukan
alamat IP Camera pengaturan dengan mendefinisikan IP Camera
yang akan diakses.
2. Monitoring data IP Menjelaskan proses dimana pengguna dapat
Camera melihat/ memonitor data gambar pada semua
IP Camera yang telah didefinisikan.
3. Memonitoring data lebih Menjelaskan aktivitas monitoring yang lebih
detail. mendalam.
4. Melihat gambar Menjelaskan gambar yang dicapture pengguna
tersimpan tersimpan dan dapat dilihat kembali
5. Melakukan pengolahan Menjelaskan bagaimana pengaturan hak akses
hak akses aplikasi.
Pemodelan Use Case diagram dapat dilihat dalam gambar 4.8 halaman 28.
28
USE CASE DIAGRAM

APLIKASI MONITORING AKTIVITAS DENGAN MENGGUNAKAN IP CAMERA BERBASIS WEB
Melakukan Pengaturan
Alamat IP IP Camera
Memonitor Data IP
Camera <<extend>>
Memonitor Data
Lebih Detail
Melihat Gambar
Pengguna Tersimpan
Melakukan
Pengolahan Hak Akses
Gambar 4.8 Use Case Diagram
Pemodelan Use Case Aplikasi Monitoring Aktivitas dengan Menggunakan

IP Camera berbasis Web menjelaskan proses yang terjadi dalam aplikasi. Terdapat
5 proses yaitu melakukan pengaturan alamat IP Camera, monitoring data IP
Camera, melihat gambar tersimpan, melakukan pengolahan hak akses dan
memonitor data lebih detail.
Tabel 4.9 Use Case 1 Melakukan Pengaturan Alamat IP Camera

Nama Use Case Melakukan pengaturan alamat IP Camera
Pengguna Pengguna
Deskripsi Use Case ini akan menjelaskan bagaimana pengguna
melakukan pengaturan dengan mendefinisikan IP
Camera yang akan diakses
Pre- condition Masuk pada aplikasi monitoring aktifitas dengan
menggunakan IP Camera berbasis web
Normal Course Kegiatan Pengguna Respons Sistem
1. Pengguna mengatur
29
koneksi alamat IP
Camera dalam jaringan
Kabel LAN maupun
koneksi Wi-Fi
(dipengaruhi perangkat
IP Camera yang
dimiliki).
2. IP Camera terkoneksi
3. Memasukkan Username
dan Password pengguna
4. Aplikasi
menampilkan
halaman utama
5. Pengguna memilih menu
“ Setting”
6. Aplikasi
menampilkan menu
pengaturan
7. Pengguna memasukkan
data IP Camera Baru
yang meliputi ID, Nama
IP Camera, Alamat IP,
Keterangan.
8. Aplikasi menyimpan
data IP Camera baru
yang dimasukkan.
9. Pengguna melakukan edit
data IP Camera pada
table
10. Aplikasi
menampilkan data
IP Camera yang
30
dipilih.
11. Pengguna mengganti
data IP Camera yang
dipilih
data baru.
Alternate Course -
Post- condition Use Case Monitoring Data IP Camera
Keluar dari aplikasi
Tabel 4.10 Use Case 2 Monitoring Data IP Camera

Nama Use Case Monitoring Data IP Camera
Pengguna Pengguna
Deskripsi Use Case ini akan menjelaskan proses dimana
pengguna dapat melihat/memonitor data gambar pada
semua IP Camera yang telah didefinisikan.
Pre- condition Use Case Melakukan Pengaturan Alamat IP Camera
“monitoring”
2. Aplikasi
menampilkan menu
“monitoring”
3. Pengguna melakukan
monitoring data gambar
sesuai dengan informasi
kamera yang didefinisikan
pada Use Case Melakukan
Pengaturan Alamat IP
Camera.
Alternate Course Pengguna belum melakukan beberapa pengaturan IP
Camera dan kembali pada Use Case Melakukan
31
Pengaturan Alamat IP Camera.

Post- condition Use Case Monitoring data lebih detail
Tabel 4.11 Use Case 3 Monitoring Data Lebih Detail

Nama Use Case Monitoring Data Lebih Detail
Pengguna Pengguna
Deskripsi Use Case ini akan menjelaskan proses dimana
pengguna melakukan fungsi monitoring IP Camera
secara lebih detail.
Pre- condition Use Case Memonitoring Data IP Camera
1. Pengguna memilih
menu “monitoring”
2. Aplikasi
membuka menu
“monitoring” dan
menampilkan data
IP Camera yang
tersimpan.
3. Pengguna memilih
kamera yang akan
dilihat.
4. Aplikasi
menampilkann
data IP lebih
detail
aksi memutar kamera
dan menangkap objek
dalam kamera.
6. Aplikasi
32
mengeksekusi
aksi yang
dimasukkan.
Alternate Course Pengguna melihat objek yang ditangkap
Post- condition Use Case Melihat Gambar Tersimpan
Tabel 4.12 Use Case 4 Melihat Gambar Tersimpan

Nama Use Case Melihat Gambar Tersimpan
Pengguna Pengguna
Deskripsi Use Case ini akan menjelaskan gambar yang dicapture
pengguna tersimpan dan dapat dilihat kembali
Pre- condition Use Case Monitoring Data IP Camera
Use Case Me- monitoring Data Lebih Detail
“gallery snapshot”
2. Aplikasi
menampilkan
gambar yang
tersimpan hasil
capture.
3. Pengguna melihat gambar
yang tersimpan.
Alternate Course -
Post- condition Use Case Melakukan Pengaturan Alamat IP Camera
Use Case Monitoring Data IP Camera
Use Case Monitoring Data Lebih Detail
Use Case Melakukan Pengolahan Hak Akses
33
Tabel 4.13 Use Case 5 Melakukan Pengolahan Hak Akses

Nama Use Case Melakukan Pengolahan Hak Akses
Pengguna Pengguna
Deskripsi Use Case ini akan menjelaskan bagaimana pengaturan
hak akses pengguna aplikasi
Pre- condition Masuk pada aplikasi
“hak akses”
2. Aplikasi
menampilkan menu
hak akses.
3. Pengguna memasukkan
username dan password
baru.
data yang
dimasukkan.
update data hak akses.
hasil dari update
data.
Alternate Course -
Post- condition Use Case Melakukan Pengaturan Alamat IP Camera
Use Case Monitoring Data IP Camera
Use Case Melihat Gambar Tersimpan
Use Case Memonitoring Data Lebih Detail
34
4.1.2 Activity Diagram

a. Activity Diagram Proses Pengaturan IP Camera
PROSES PENGATURAN IP CAMERA
Memilih Menu Pengaturan
IP Camera Baru
Memasukkan Alamat IP Camera Baru
Ubah Data IP
Camera
Memasukkan Data Baru IP Camera
Menyimpan Data Baru IP Camera
Gambar 4.9 Activity Diagram Proses Pengaturan IP Camera
b. Activity Diagram Proses Pengaturan IP Camera
PROSES PENGATURAN HAK AKSES
Memilih Menu Hak Akses
Hak Akses
Baru
Memasukkan Username dan Password Baru
Ubah Data
Hak Akses
Malakukan Perubahan Data Hak Akses
Menyimpan Data Baru Hak Akses
Gambar 4.10 Activity Diagram Proses Pengaturan Hak Akses

35
c. Activity Diagram Proses Pemantauan Objek
PROSES PEMANTAUAN OBJEK
Menampilkan Menu Monitoring
Menampilkan Data Objek Real Time IP Camera Terdaftar
Menampilkan Data IP Camera Lebih Detail
Detail Objek
Menangkap Detail Objek
Navigasi
Kamera
Menyimpan Detail Objek Melakukan Pemantauan Detail Objek dengan Navigasi Kamera
Detail
Kembali Objek
Pemantauan
Objek
Keluar
Aplikasi
Gambar 4.11 Activity Diagram Proses Pemantauan Objek
4.3 Basis Data

Dalam pemodelan Class Diagram akan digambarkan proses data untuk
menjamin fungsi yang dilakukan dalam aplikasi dengan menyertakan berbagai
atribut yang menunjang.
IP_Camera
Pengguna
-ID_IP_Cam : string Gambar
-ID_Pengguna : string 1..1 1..* 1..1 1..*
-ID_Pengguna : string -ID_Gambar : string
-Nama_Pengguna : string
-Nama_IP_Cam : string -ID_IP_Cam : string
-User_Name : string
-Alamat_IP_Cam : string -Gambar : string
-Password : string
-Keterangan : string +tambah()
+tambah()
+tambah() +lihat()
+ubah()
+ubah()
Gambar 4.12 Class Diagram.

BAB V
IMPLEMENTASI
Pada bab 5 akan dilakukan implementasi aplikasi yang telah dibangun

dengan meliputi daftar kebutuhan implementasi program, implementasi
antarmuka, serta kode program yang dibangun.
5.1 Lingkungan Implementasi

Daftar kebutuhan implementasi dimaksudkan untuk menjelaskan secara
spesifik kebutuhan perangkat keras dan perangkat lunak pengembang aplikasi.
5.1.1 Spesifikasi Perangkat Keras

Tabel 5.1 Spesifikasi Perangkat Keras
Spesifikasi Perangkat Keras
Perangkat Keras Rekomendasi
Processor Intel Core i3 (2.1 Ghz) atau versi lebih tinggi
Memory (RAM) 2 GB atau lebih tinggi
Harddisk Kapasitas 320 GB free space atau lebih tinggi
IP Camera Digunakan IP Camera New Function Wi- Fi, dapat
juga dengan tipe lain.
Keyboard, mouse, Standar
speaker
Mobile Phone Sistem Operasi Android dan Support Browser
5.1.2 Spesifikasi Perangkat Lunak

Tabel 5.2 Spesifikasi Perangkat Lunak
Spesifikasi Perangkat Lunak
Fungsi Rekomendasi
Melakukan Pemrograman Notepad ++ v6.2.1 untuk editor PHP,HTML,dll
DBMS MySQL version 5.1.41
Desain Storyboard dan Adobe Photoshop CS3
antarmuka Paint
36
37
Spesifikasi Perangkat Lunak

Fungsi Rekomendasi
Penggambaran Tools Microsoft Office Visio 2007
Pembuatan Laporan Microsoft Office Word 2007
Running Aplikasi Aplikasi Browser seperti Google Chrome,
Mozilla dll
Sistem Operasi Windows 7 31- bit
5.2 Implementasi Antarmuka Aplikasi

Berikut implementasi antarmuka aplikasi yang dibangun:
a. Scene 1
Tabel 5.3 Scene 1 Halaman Utama Aplikasi
Name Scene Halaman Utama Aplikasi
Tujuan Scene Untuk menampilkan rancangan menu utama aplikasi
Halaman Awal -
Halaman Akhir Scene 2 Halaman Setting
Gambar 5.1 Antarmuka Halaman Utama

Keterangan - Scene ini mendeskripsikan halaman awal aplikasi.
- Dibagian kiri terdapat navigasi menu untuk mengakses
aplikasi dan akan dijelaskan pada scene berikutnya.
- Tombol login dan logout untuk pengontrolan akses
aplikasi
38
b. Scene 2
Tabel 5.4 Halaman Setting
Name Scene Halaman Setting
Tujuan Scene Untuk melakukan pengaturan IP Camera yang akan
diakses.
Halaman Awal Halaman Utama
Halaman Akhir Scene 3 Monitoring
Gambar 5.2 Antarmuka Halaman Setting

Keterangan - Menampilkan menu input IP Camera baru
- Melakukan input IP Camera baru dengan
mendaftarkan alamat IP Camera dan nama IP
Camera.
c. Scene 3
Tabel 5.5 Halaman Monitoring
Name Scene Halaman Monitoring
Tujuan Scene Melihat objek yang direkam pada IP Camera yang
didefinisikan.
Halaman Awal Halaman Utama
Halam Akhir Scene 4 Detail Monitoring
39
Gambar 5.3 Antarmuka Halaman Monitoring

Keterangan - Menampilkan objek yang direkam IP Camera
- Dapat memilih IP Camera yang akan dilihat lebih
detail.
d. Scene 4
Tabel 5.6 Halaman Detail Monitoring
Name Scene Halaman Detail Monitoring
Tujuan Scene Menunjukkan gambar objek lebih detail per kamera
dan memfasilitasi navigasi roda pada kamera serta
capture gambar.
Halaman Awal Halaman Monitoring
Halam Akhir Scene 5 Gallery Snapshot
Antarmuka Halaman detail Monitoring dapat dilihat pada gambar 5.4 halaman
40 .
40
Gambar 5.4 Antarmuka Halaman Detail Monitoring

Keterangan - Menampilkan objek yang direkam IP Camera secara
lebih detail.
- Memfasilitasi pengguna dengan navigasi kiri, kanan,
atas dan bawah.
- Menyediakan tombol capture gambar
e. Scene 5
Tabel 5.7 Halaman Gallery Snapshot
Name Scene Halaman Gallery Snapshot
Tujuan Scene Memperlihatkan gambar yang tersimpan hasil
capture.
Halaman Awal Halaman Detail Monitoring
Halam Akhir -
Antarmuka Halaman Gallery Snapshot dapat dilihat pada gambar 5.5 halaman
41 .
41
Gambar 5.5 Antarmuka Halaman Gallery Snapshot

Keterangan - Semua gambar yang ditangkap akan tersimpan dan
dapat dilihat pada halaman Gallery Snapshot.
f. Scene 6
Tabel 5.8 Halaman Hak Akses
Name Scene Halaman Hak Akses
Tujuan Scene Melakukan pengaturan hak akses pengguna.
Halaman Awal Halaman Menu Utama
Halam Akhir -
Gambar 5.6 Antarmuka Halaman Hak Akses

Keterangan - Untuk menambah pengguna dengan memberikan
username dan password baru.
42
5.3 Impementasi Basis Data
Gambar 5.7 Tabel IP Camera
Gambar 5.8 Tabel Gambar
Gambar 5.9 Tabel Pengguna
5.4 Kode Program

Pada bagian ini akan ditampilkan dan dijelaskan kode program aplikasi
yang dibangun.
a. Pengaturan IP Camera
Tabel 5.9 Kode Program Pengaturan IP Camera
Nama Kode Program Pengaturan IP Camera
Tujuan Untuk melakukan input IP Camera yang akan
diakses
<?php
echo'
<div id="acct-password-row" class="span7">
<fieldset>
<legend>Input Setting IP Camera</legend>
<form method="POST" action="input_setting.php">
<div class="control-group ">
<label class="control-label">ID IP Camera</label>
<div class="controls">
<input id="new-pass-control" name="id_ipcamera"
class="span4" type="text" value="'.generate_id('ip_camera', 'C', 5) .'" readonly
autocomplete="false"> &nbsp <span><font color="red">*</font></span>
</div>
</div>
43

<label class="control-label">Nama IP Camera</label>
<input id="new-pass-control" name="nama_ip"
class="span4" type="text" value="" autocomplete="false"> &nbsp <span><font
color="red">*</font></span>
</div>
</div>
<label class="control-label">Alamat IP Camera</label>
<input id="new-pass-control" name="alamat_ip"
color="red">* (Exp : 192.168.1.254)</font></span>
</div>
</div>
<label class="control-label">Nama Folder Snapshot</label>
<input id="new-pass-control" name="folder"
color="red">*</font></span>
</div>
</div>
<label class="control-label">Keterangan</label>
<textarea name="ket" class="span4" type="text"
value=""> </textarea>&nbsp <span><font color="red">*</font></span>
</div>
</div>
<footer class="form-actions">
<button type="submit" class="btn btn-primary"
>ADD</button>
<button type="cancel" class="btn" >CANCEL</button>
</footer>
</form>
</fieldset>
</div>
<div id="acct-verify-row" class="span9">
<fieldset>
<legend>Setting Yang Sudah Ada</legend>
<div id="Person-1" class="box">
<div class="box-header">
<i class="icon-table"></i>
<h5>
Daftar Setingg
</h5>
</div>
44
<div class="box-content box-table">

<table class="table table-hover
tablesorter">
<thead>
<th>ID Cabang</th>
<th>Nama IP Cam</th>
<th>Alamat IP</th>
<th>Folder Snapshot</th>
</thead>';
$query=mysql_query("SELECT * FROM
ip_camera");
while($r = mysql_fetch_array($query))
{
echo'
<tr>
<td><a
href="beranda.php?modul=edit_setting&kode_camera='.$r["id_ipcamera"].'">'.$r["i
d_ipcamera"].'</a></td>
<td><a
href="beranda.php?modul=edit_setting&kode_camera='.$r["id_ipcamera"].'">'.$r["
nama_ipcamera"].'</a></td>
<td><a
alamat_ipcamera"].'</a></td>
<td><a
folder_simpan"].'</a></td>
</tr>';
}
echo'
</table> </div></div>
</fieldset>
</div>
';
?>
b. Monitoring
Tabel 5.10 Kode Program Monitoring
Nama Kode Program Monitoring
Tujuan Untuk melakukan melihat objek yang ditangkap
seluruh IP Camera yang didefinisikan.
<?php
echo'
<fieldset>
<legend>Monitoring Camera</legend>';
45
$query=mysql_query("SELECT * FROM ip_camera");

while($r = mysql_fetch_array($query))
{
echo'
<div class="span5">
<div class="box pattern pattern-sandstone">
<i class="icon-bookmark"></i>
<h5><a
href="beranda.php?modul=detail_camera&id='.$r["id_ipcamera"].'">'.$r["nama_ipc
amera"].'</a></h5>
</div>e
<div class="box-content">
<table class="table table-hover tablesorter">
<tbody>
<tr>
<td width="100" height="50" ><a
href="beranda.php?modul=detail_camera&id='.$r["id_ipcamera"].'"><img
src="http://'.$r["alamat_ipcamera"].'/videostream.cgi?rate=32&user=admin&pwd=
" /></a></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
';
}
echo'
</fieldset>';
?>
c. Capture
Tabel 5.11 Kode Program Capture
Nama Kode Program Capture
Tujuan Untuk melakukan capture objek yang
ditampilkan.
<?php
include"koneksi.php";
$id=$_GET['id'];
$time=date("h.i.s(d-m-Y)");
$url = 'http://192.168.1.254/snapshot.cgi?user=admin&pwd= name=';
$nama=''.$time.'.jpg';
$img = 'my/'.$time.'.jpg';
$ok=file_put_contents($img, file_get_contents($url));
mysql_query("INSERT into gambar (id_gambar,nama) values('','$nama')");
46
if($ok)
{
echo"<script>alert('Gambar Telah Di Ambil')
location.replace('beranda.php?modul=detail_camera&id=$id')</script>";
}
?>
d. Capture
Tabel 5.12 Kode Program Detail Monitoring
Nama Kode Program Detail Monitoring
Tujuan Melihat objek yang ditangkap kamera dan
melakukan aktivitas navigasi kamera.
<script type="text/javascript">
var R320_240=8;
var R640_480=32;
var ptz_type=0;
if(top.client_minor==4) ptz_type=1;
if(top.client_minor==5) ptz_type=2;
var PTZ_STOP=1;
var TILT_UP=0;
var TILT_UP_STOP=1;
var TILT_DOWN=2;
var TILT_DOWN_STOP=3;
var PAN_LEFT=4;
var PAN_LEFT_STOP=5;
var PAN_RIGHT=6;
var PAN_RIGHT_STOP=7;
var PTZ_LEFT_UP=90;
var PTZ_RIGHT_UP=91;
var PTZ_LEFT_DOWN=92;
var PTZ_RIGHT_DOWN=93;
var PTZ_CENTER=25;
var PTZ_VPATROL=26;
var PTZ_VPATROL_STOP=27;
var PTZ_HPATROL=28;
var PTZ_HPATROL_STOP=29;
var PTZ_PELCO_D_HPATROL=20;
var PTZ_PELCO_D_HPATROL_STOP=21;
var PTZ_ZOOM_WIDE=16;
var PTZ_ZOOM_WIDE_STOP=17;
var PTZ_ZOOM_TELE=18;
var PTZ_ZOOM_TELE_STOP=19;
var LED_ON=1;
var LED_OFF=2;
var IO_ON=94;
47
var IO_OFF=95;
function decoder_control(command)
{
action_zone.location='http://192.168.1.254/decoder_control.cgi?command
='+command+'&user=admin&pwd='+top.pwd;
}
function set_misc(led_mode)
{
action_zone.location='http://192.168.1.254/set_misc.cgi?led_mode='+led_
mode+'&user=admin&pwd='+top.pwd;
}
function camera_control(param,value)
{
location='http://192.168.1.254/camera_control.cgi?param='+param+'&valu
e='+value+'&user=admin&pwd='+top.pwd;
}
function set_flip()
{
if (image_reversal.checked)
flip|=1;
else
flip&=2;
if (image_mirror.checked)
flip|=2;
else
flip&=1;
camera_control(5,flip);
}
function up_onmousedown()
{
(flip&0x01)?decoder_control(TILT_DOWN):decoder_control(TILT_UP);
}
function up_onmouseup()
{
setTimeout("up_temp()",100);
}
function up_temp()
{
if (!ptz_type)
decoder_control(PTZ_STOP);
else if (flip&0x01)
decoder_control(TILT_DOWN_STOP);
else
decoder_control(TILT_UP_STOP);
}
function down_onmousedown()
{
(flip&0x01)?decoder_control(TILT_UP):decoder_control(TILT_DOWN);
48
}
function down_onmouseup()
{
setTimeout("down_temp()",100);
}
function down_temp()
{ if (!ptz_type)
else if (flip&0x01)
decoder_control(TILT_UP_STOP);
else
decoder_control(TILT_DOWN_STOP);
}function left_onmousedown()
{(flip&0x02)?decoder_control(PAN_RIGHT):decoder_control(PAN_LEFT);}
function left_onmouseup()
{
setTimeout("left_temp()",100);
}
function left_temp()
{ if (!ptz_type)
else if (flip&0x02)
decoder_control(PAN_RIGHT_STOP);
else
decoder_control(PAN_LEFT_STOP);
}
function right_onmousedown()
} (flip&0x02)?decoder_control(PAN_LEFT):decoder_control(PAN_RIGHT); }
function right_onmouseup()
{ setTimeout("right_temp()",100); }
function right_temp()
{ if (!ptz_type)
else if (flip&0x02)
decoder_control(PAN_LEFT_STOP);
else
decoder_control(PAN_RIGHT_STOP);
}
function leftup_onmousedown()
{ if (ptz_type)
return;
if ((flip&0x03)==0x03)
decoder_control(PTZ_RIGHT_DOWN);
else if (flip&0x02)
decoder_control(PTZ_RIGHT_UP);
else if (flip&0x01)
decoder_control(PTZ_LEFT_DOWN);
else
decoder_control(PTZ_LEFT_UP); }
49
function leftup_onmouseup()
{ setTimeout("ptz_temp()",100); }
function ptz_temp()
{ if (!ptz_type) decoder_control(PTZ_STOP); }
function rightup_onmousedown()
{if (ptz_type) return;
if ((flip&0x03)==0x03)
else if (flip&0x02)
decoder_control(PTZ_LEFT_UP);
else if (flip&0x01)
else
} function rightup_onmouseup()
{ setTimeout("ptz_temp()",100);
}function leftdown_onmousedown()
{ if (ptz_type)
return;
if ((flip&0x03)==0x03)
else if (flip&0x02)
else if (flip&0x01)
else decoder_control(PTZ_LEFT_DOWN);
}
function leftdown_onmouseup()
{
setTimeout("ptz_temp()",100);
}
function rightdown_onmousedown()
{
if (ptz_type)
return;
if ((flip&0x03)==0x03)
else if (flip&0x02)
else if (flip&0x01)
else
}
function rightdown_onmouseup()
{
setTimeout("ptz_temp()",100);
}
function center_onclick()
50
{
if (!ptz_type) decoder_control(PTZ_CENTER);
}
function vpatrol_onclick()
{
if (!ptz_type) decoder_control(PTZ_VPATROL);
}
function vpatrolstop_onclick()
{
if (!ptz_type) decoder_control(PTZ_VPATROL_STOP);
}
function hpatrol_onclick()
{
(ptz_type==1)?decoder_control(PTZ_PELCO_D_HPATROL):decoder_control(
PTZ_HPATROL);
}
function hpatrolstop_onclick()
{
(ptz_type==1)?decoder_control(PTZ_PELCO_D_HPATROL_STOP):decoder_c
ontrol(PTZ_HPATROL_STOP);
}
function zoom_plus()
{
decoder_control(PTZ_ZOOM_WIDE);
}
function zoom_plus_stop()
{ decoder_control(PTZ_ZOOM_WIDE_STOP);
}
function zoom_minus()
{ decoder_control(PTZ_ZOOM_TELE);
}
function zoom_minus_stop()
{ decoder_control(PTZ_ZOOM_TELE_STOP);
}
function body_onload()
{
gocenter.title=top.str_center;
preset_1_set.title = top.str_go;
preset_1_go.title = top.str_set2;
vpatrol.title=top.str_vertical_patrol;
vpatrolstop.title=top.str_stop_vertical_patrol;
51
hpatrol.title=top.str_horizon_patrol;
hpatrolstop.title=top.str_stop_horizon_patrol;
switchon.title=top.str_switchon;
switchoff.title=top.str_switchoff;
resolution_sel.value=resolution;
mode_sel.value=mode;
brightness_input.value=Math.round(brightness / 16);
contrast_input.value=contrast;
image_reversal.checked=(flip&0x01)?true:false;
image_mirror.checked=(flip&0x02)?true:false;
}
</script>
<?php
echo'
<fieldset>
<legend>Monitoring Camera</legend>';
$query=mysql_query("SELECT * FROM ip_camera WHERE
id_ipcamera='$_GET[id]'");
$r = mysql_fetch_array($query);
{
echo'
<div class="span12">
<div class="box pattern pattern-sandstone">
<h5><a
href="beranda.php?modul=detail_camera&id='.$r["id_ipcamera"].'">'.$r["nama_ipc
amera"].'</a></h5>
</div>
<tbody>
<tr>
<td><a href="beranda.php?modul=detail_camera&id='.$r["id_ipcamera"].'"><img
src="http://'.$r["alamat_ipcamera"].'/videostream.cgi?rate=32&user=admin&pwd=
" /></a></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="span4"> <div class="box pattern pattern-sandstone">
<h5>Kontrol Video</h5>
</div>
52
<tbody>
<tr>
<td><button><a
href="capture.php?id='.$r["id_ipcamera"].'">CAPTURE</a></button></td>
</tr>
<tr><body onload="body_onload()">
<iframe name="action_zone" style="display:none"></iframe>
</tr>
<tr>
<td>
<div><img id="vpatrol" style="margin-left:50px"
src="images/atas.png" onclick="vpatrol_onclick()" title="vertical patrol">
<div><img id="hpatrol" style="margin-left:5px"
src="images/kiri.png" onclick="hpatrol_onclick()" title="horizon patrol"><img
id="hpatrol" style="margin-left:45px"src="images/kanan.png"
onclick="hpatrol_onclick()" title="horizon patrol"></div>
<div><img id="vpatrol" style="margin-
left:50px"src="images/bawah.png" onclick="vpatrol_onclick()" title="vertical
patrol"></div>
<br>
<img id="hpatrolstop" src="images/stop.png"
onclick="hpatrolstop_onclick()" title="stop horizon patrol">Stop Horisontal</div>
<img id="vpatrolstop" src="images/stop.png"
onclick="vpatrolstop_onclick()" title="stop vertical patrol">Stop Vertikal</div>
</td>
</tr>
</body>
</tr>
</tbody>
</table>
</div>
</div>
</div>
';
}
echo'
</fieldset>';
?>
BAB VI
PENGUJIAN
Pada tahap ini akan dilakukan pengujian terhadap aplikasi monitoring

aktivitas dengan menggunakan IP Camera berbasis web yang dibangun. Adapun
pengujian dilakukan untuk melihat apakah aplikasi yang dibangun sudah berjalan
sesuai dengan fungsi yang diharapkan dan dapat memenuhi semua kebutuhan
yang telah didefinisikan.
6.1 Tujuan Kegiatan Pengujian

Tujuan kegiatan pengujian antara lain:
1. Dengan melakukan pengujian kita mampu menentukan seberapa besar
keberhasilan aplikasi yang dibangun.
2. Kegiatan pengujian akan memperjelas fungsi aplikasi sehingga kita dapat
mengetahui apakah semua fungsi dalam aplikasi telah berjalan dengan
baik dan sesuai dengan harapan.
3. Kegiatan pengujian akan membuat kita melihat kembali spesifikasi
kebutuhan yang kita definisikan, apakah kebutuhan telah terpenuhi atau
tidak.
4. Dengan kegiatan pengujian dapat melihat fungsi yang error atau berjalan
tidak semestinya.
5. Mengetes aplikasi dan melihat seberapa mudah aplikasi untuk digunakan.
6.2 Kriteria Pengujian

Ada beberapakriteria yang akandilakukansaatpengujianaplikasi:
1. Koneksi IP Camera, perangkatkomputer, danperangkatmobile.
2. IP Camera yang didefinisikandapatdiaksesdalamaplikasi.
3. Capturegambardapatdilakukan.
4. Dapatmenghadirkannavigasiuntukmenggerakkan IP Camera
5. Objek yang dicapturedapatdisimpan.
6. Gambar yang disimpandapatditampilkan
53
54
6.3 KegiatanPengujian
Tabel 6.1 KegiatanPengujian
No. KegiatanPengujian Hasil yang Diharapkan HasilAktual
Koneksi
1. Mengujikoneksideng Aplikasimampumengaksessemu Terpenuhi
anmenggunakankabe a IP Camera yang
l LAN. dikoneksikandenganmenggunak
ankabel LAN.
2. Mengujikoneksideng Aplikasimampumengaksessemu Terpenuhi
anmenggunakanjarin a IP Camera yang
gan Wi-Fi dikoneksikandenganmenggunak
anjaringanWi- Fi
Gambar 6.1 TampilanGambar 2 IP Camera

Fiturdanfungsiaplikasi
1. Pengaturandaninput Halamansettingpadaaplikasidapa Terpenuhi
data IP tdiaksesdanpenggunadapatmend
Cameradenganmem ata IPCamera yang
perhatikanapakah IP meliputinamadanalamat IP
Cameratelahterkone Camera.
ksi.
55
Gambar 6.2 TampilanHalamanSetting

2. Monitoring IP Halamanmonitoringpadaaplikasi Terpenuhi
Camera yang dapatdiaksesdanpenggunadapat
terdaftar. melihat data yang
ditangkapolehsemua IP Camera
yang terdaftar.
Gambar 6.3 TampilanGambarIP Camera yang Terdaftar

3. Navigasiuntukmeng Dapatmenggerakkankeatas, Terpenuhi
gerakkanperangkatk bawah, kiridankanan.
eras IP Camera.
56
Gambar 6.4 TampilanFungsiNavigasi

4. Capturegambar. Aplikasidapatmeng-
capturegambar yang
diinginkanpengguna.
Gambar 6.5 TampilanCapture Gambar

57

5. Lihatgambar Halamangallerysnapshotdapatdi Terpenuhi
aksesdandapatmenampilkangam
bar yang tersimpan.
Gambar 6.6 TampilanGallery Snapshot

6. Pengaturanhakakses Halamanpengaturanhakaksesdap Terpenuhi
atberjalandenganbaiksehinggaak
tivitascreatenewakundapatberhas
il.
7. Aksesdenganmobile Denganberbasiswebmakakemun Terpenuhi
phone gkinandapatdiaksessecara
systemoperasiAndroi universal sangatlahmungkin.
datau yang support
browser.
6.4 PembahasanKegiatanPengujian
Studipengembanganaplikasidilakukandenganmenggunakanmetodologiproto
typing. Dalam proses pengembangandialamiberbagaikendalaseperti IP Camera
yang tidakdapatdiakses, deteksigerak yang
tidakdapatmendukungdenganpemrograman yang dilakukandanperangkat IP
58
Camera yang tidakmendukungperekamanobjek. Hal

inimenyebabkanperalihanfitur yang dikembangkan.
Adapunfitur yang berhasildikembangkanadalahakses IP Camera,
Captureobjek, pergerakkanroda, penyimpananhasilcapture,
danpemantauandaribeberapaperangkat. Denganfitur-
fiturdiatasperancanganaplikasimonitoringaktivitasdenganmenggunakan IP
Cameraberbasiswebtelahdapatterpenuhi.
BAB VII
KESIMPULAN DAN SARAN
7.1 Kesimpulan
Berdasarkan Tugas Akhir yang dilakukan dalam pembangunan aplikasi
monitoring aktivitas dengan menggunakan IP Camera berbasis web, dapat
disimpulkan bahwa aplikasi ini dapat berguna dalam memenuhi kebutuhan
monitoring objek guna menjamin keamanan yang diinginkan. Aplikasi telah
melingkupi akses banyak IP Camera dengan fasilitas monitoring objek/ ruangan
secara bersamaan, capture objek, penggerakkan roda perangkat keras IP Camera,
penyimpanan data langsung serta akses data yang tersimpan.
7.2 Saran
Beberapa saran yang dapat dikembangkan dalam aplikasi untuk
kedepannya, yaitu:
1. Pembangunan aplikasi tidak melingkupi fungsi rekam video karena IP
Camera yang digunakan dalam pembangunan aplikasi tidak mendukung
fungsi rekam video. Namun disadari fungsi rekam sangat penting dalam
sebuah perangkat kamera, untuk itu diperlukan pengembangan
selanjutnya dalam memenuhi fungsi rekam video.
2. Aplikasi berbasis web untuk itu penting untuk dilakukan pengembangan
sistem multi- platform.
3. IP Camera dalam teknologinya telah memiliki banyak sekali fitur
pendukung seperti deteksi gerak, deteksi wajah, dan alarm, untuk itu
diperlukan pengembangan yang lebih lanjut untuk memenuhi teknologi
tersebut.
4. Teknologi perekaman berdasarkan deteksi gerak merupakan teknologi
terkini untuk itu sebagai saran pengembangan aplikasi dapat
dikembangkan sampai memenuhi kebutuhan pengontrolan memori
rekam yaitu jika terdeteksi adanya pergerakan.
59
60
5. Penelitian tentang suatu objek atau gambar untuk memenuhi

perkembangan teknologi kamera juga sangat dibutuhkan, untuk itu
kedepannya pengembangan aplikasi dapat dilakukan dengan
menerapkan metode untuk image processing.
CURICULUM VITAE
Data Pribadi :
Nama Lengkap : Jacqueline R. M. Solang

Alamat : Kelurahan Molas Lingkungan II
No Telepon : 08114322016
Alamat Email : eqnsolang@gmail.com
Tanggal Lahir : 30 Januari 1993
Tempat Lahir : Manado
Jenis Kelamin : Perempuan
Agama : Kristen Protestan
Status : Belum Menikah
Pendidikian Formal :
Jenis Pendidikan Nama Sekolah Periode
Perguruan Tinggi Universitas Katolik De La Salle Manado, 2010 - 2014
Jurusan Teknik Informatika
SMA/SMK SMA Kristen Eben Haezar Manado 2007 - 2010
SMP SMP Negeri 3 Manado 2004 - 2007
SD SD Katolik Rk. 9 Manado 1999 - 2004
TK TK Katolik Rk. 9 Manado 1997 - 1999
Pengalaman Kerja :
Pengalaman Kerja Lokasi Tahun
Pelaksanaan
Praktek Kerja Lapangan Dinas Perindustrian dan 2013
Mahasiswa Perdagangan Kota Manado
Lomba, Training, Seminar , dan Workshop :

Kemapuan dalam bidang Komputer Level/Pengetahuan
Jaringan Komputer Menengah
Pemprograman Komputer Menengah
Keamanan Komputer dan Jaringan Menengah

Cover (20 Files Merged)

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Cover (20 Files Merged)

Uploaded by

Copyright:

Available Formats

APLIKASI MONITORING AKTIVITAS DENGAN

MENGGUNAKAN IP CAMERA BERBASIS WEB

Ditulis untuk Memenuhi Persyaratan untuk Mendapatkan Gelar Sarjana Teknik

PROGRAM STUDI TEKNIK INFORMATIKA

PROGRAM STUDI TEKNIK INFORMATIKA

In this era, is familiar for us to hear or talk about technology. It because

Keywords: IP Camera, security, activities.

Kata kunci : IP Camera, keamanan, aktivitas.

Manado, Juni 2014

Judul Laporan ........................................................................................................... i

BAB II STUDI PUSTAKA

BAB III ANALISIS

BAB VII KESIMPULAN DAN SARAN

DAFTAR PUSTAKA ........................................................................................... 61

Tabel 3.1 Kebutuhan Hardware dan Software Dalam Aplikasi .............................. 20

Gambar 2.1 IP Network Infrastructur .................................................................5

Lampiran A. User Acceptance Test .................................................................... A-1

1. Haryanto, E.V. (2012). Jaringan Komputer. Yogyakarta : C.V.Andi

Pengujian aplikasi monitoring aktivitas dengan menggunakan IP Camera

1.1 Latar Belakang

1.2 Perumusan Masalah

1.3 Tujuan Tugas Akhir

1.4 Ruang Lingkup dan Batasan Masalah

g. Penyimpanan gambar dinamai dengan menyertakan fungsi date and

1.5 Manfaat Tugas Akhir

1.6 Metodologi Penelitian

1.7 Sistematika Penulisan

Untuk mencapai tujuan dan menyelesaikan permasalahan, penulis

Gambar 2.1 IP Network Infrastructure (Pendopo Vmeet 2014)

Adapun analog kamera yang dapat dibandingkan dengan IP Camera

Gambar 2.2 Contoh Kamera Analog (Myonlinecctv.com)

Gambar 2.3 Contoh IP Camera (Myonlinecctv.com)

Berikut kelebihan dan kekurangan sistem kamera CCTV, adalah:

Adapun kelebihan dan kekurangan IP Camera, adalah:

5. DVR stand alone yang langsung support IP Camera (disebut dengan

2.4 Aplikasi Web

2.6 Pemrograman Web

membangun dan mengembangkan aplikasi. Berikut dijelaskan secara singkat

2.7 Metodologi Pengembangan Sistem

Adapun beberapa kelebihan dan kekurangan prototype:

Model prototype dirancang agar dapat menerima perubahan-perubahan

2.7.1 Tahapan Pembangunan Aplikasi

4. Fase 4 Design, menjelaskan bagaimana perangkat lunak akan

2.7.2 Kakas yang Digunakan

menunjukkan fitur, kendala, dan hubungan asosiatif, generalisasi dan

2.8 Prosedur Pengumpulan, Pengolahan dan Penyimpanan Data

2.8.1 Sumber Data

2.8.2 Teknik Pengumpulan Data

2.8.3 Cara Mengolah dan Menyimpan Data

2.8.4 Media Penyimpanan Data

3.1 Process Overview

3.1.1 Definisi Aplikasi yang Sudah Ada Sebelumnya

Gambar 3.1 Navigasi Aplikasi Bawaan IP Camera

Gambar 3.2 Pengaturan Resolusi Gambar

Gambar 3.3 Pengaturan Tingkat Kecerahan dan Kontras Gambar

b. Kekurangan Aplikasi Bawaan IP Camera Sun Bio:

3.1.2 Definisi Aplikasi yang Akan Dibangun

3.2 Spesifikasi Kebutuhan

3.3 Identifikasi Spesifikasi Sistem

3.4 Identifikasi Spesifikasi Pengguna

3.5 Analisis Kebutuhan

Dalam bab 4 akan dilakukan perancangan aplikasi yang dibangun.

4.1 Perancangan Anatarmuka Aplikasi