SISTEM MANAJEMEN PROTEKSI KEBAKARAN TERPADU BERBASIS WEB DENGAN MENGGUNAKAN FRAMEWORK YII.

93 

Loading.... (view fulltext now)

Loading....

Loading....

Loading....

Loading....

Teks penuh

(1)

BERBASIS WEB DENGAN MENGGUNAKAN FRAMEWORK YII

SKRIPSI

Disusun Oleh :

INDRA WAHYU KURNIAWAN NPM. 0934010046

PROGRAM STUDI TEKNIK INFORMATIKA

FAKULTAS TEKNOLOGI INDUSTRI

UNIVERSITAS PEMBANGUNAN NASIONAL “VETERAN”

J AWA TIMUR

(2)

Diajukan Untuk Memenuhi Per syaratan Dalam Memperoleh Gelar Sar jana Komputer

Pr ogram Studi Teknik Infor matika

Disusun Oleh :

INDRA WAHYU KURNIAWAN NPM. 0934010046

PROGRAM STUDI TEKNIK INFORMATIKA

FAKULTAS TEKNOLOGI INDUSTRI

UNIVERSITAS PEMBANGUNAN NASIONAL “VETERAN”

J AWA TIMUR

(3)

SKRIPSI

SISTEM MANAJ EMEN PROTEKSI KEBAKARAN TERPADU

BERBASIS WEB DENGAN MENGGUNAKAN FRAMEWORK YII

Disusun Oeh :

INDRA WAHYU KURNIAWAN NPM : 0934010046

Telah Dipertahankan Dihadapan dan Diterima Oleh Tim Penguji Skripsi Program Studi Teknik Informatika Fakultas Teknologi Industri

Universitas Pembangunan Nasional “Veteran” Jawa Timur Pada Tanggal : 20 Desember 2013

Pembimbing : Tim Penguji :

1.

Rizky Par lika, S.Kom, M.Kom NIP . 3 8405 07 0219 1

1.

Dr. Ir. Ni Ketut Sar i, MT NIP. 19650731 199203 2 001 2.

M. Syahr ul Munir, S.Kom NIP. 3 8912 13 342 1

2.

I Made Sutarna, S.Kom, M.Kom NIP.

Universitas Pembangunan Nasional “Veteran” Jawa Timur

(4)

LEMBAR PENGESAHAN

SISTEM MANAJ EMEN PROTEKSI KEBAKARAN TERPADU

BERBASIS WEB DENGAN MENGGUNAKAN FRAMEWORK YII

Disusun Oeh :

INDRA WAHYU KURNIAWAN NPM : 0934010046

Telah disetujui mengikuti Ujian Negara Lisan Gelombang V Tahun Akademik 2012/2013.

Menyetujui, Pembimbing Utama

Rizky Par lika, S.Kom, M.Kom NIP . 3 8405 07 0219 1

Pembimbing Pendamping

M. Syahr ul Munir, S.Kom NIP. 3 8912 13 342 1

Mengetahui,

Ketua Program Studi Teknik Informatika Fakultas Teknologi Industri

Universitas Pembangunan Nasional “Veteran” Jawa Timur

(5)

FAKULTAS TEKNOLOGI INDUSTRI

Jl. Rungkut Madya Gunung Anyar Surabaya 60294 Tlp. (031) 8706369 Fax. (031)8706372 Website. www.upnjatim.ac.id

KETERANGAN BEBAS REVISI

Kami yang bertanda tangan di bawah ini menyatakan bahwa mahasiswa berikut : Nama : Indra Wahyu Kurniawan

NPM : 0934010046 Program studi : Teknik Informatika

Telah mengerjakan REVISI SKRIPSI Ujian Lisan Gelombang V TA 2012/2013 , dengan judul:

“ SISTEM MANAJ EMEN PROTEKSI KEBAKARAN TERPADU

BERBASIS WEB DENGAN MENGGUNAKAN FRAMEWORK YII

Surabaya, Januari 2014 Dosen Penguji yang memeriksa revisi

1. Dr. Ir. Ni Ketut Sar i, MT

Rizky Par lika, S.Kom, M.Kom NIP . 3 8405 07 0219 1

Pembimbing Pendamping

(6)
(7)

Assalamu’alaikum Wr. Wb.

Syukur Alhamdulillah atas segala limpahan karunia dan kasih sayang Allah SWT, sehingga dengan segala keterbatasan waktu, tenaga dan pikiran yang dimiliki oleh penulis, akhirnya skripsi yang berjudul “SISTEM MANAJ EMEN PROTEKSI KEBAKARAN TERPADU BERBASIS WEB Dengan MENGGUNAKAN FRAMEWORK YII “ dapat terselesaikan sesuai dengan waktu yang telah ditetapkan.

Melalui skripsi ini, penulis merasa mendapat kesempatan besar untuk memperdalam ilmu pengetahuan yang diperoleh selama di perkuliahan, terutama dengan implementasi teknologi informasi dalam kehidupan sehari-hari. Namun demikian penulis menyadari bahwa skripsi ini masih memiliki banyak kelemahan dan kekurangan. Oleh karena itu, kritik dan saran yang bersifat membangun sangatlah diharapkan dari berbagai pihak agar skripsi ini bisa lebih baik lagi, sehingga dapat memberikan manfaat bagi semua pihak yang membutuhkannya.

Pada penyusunan skripsi ini, banyak pihak yang telah memberikan bantuan baik materiil maupun spiritual ini, sehingga pada kesempatan ini penulis mengucapkan rasa terima kasih yang sebesar-besarnya kepada:

1. ALLAH SWT dan RASUL-Nya. Alhamdulillah atas segala kelancaran dan kemudahan yang selalu engkau limpahkan kepada penulis.

(8)

yang sangat bermanfaat kepada penulis.

4. Teman-teman MENOER 09’, terimakasih selalu meramaikan dan memberi hiburan serta membantu memberikan motivasi untuk menyelesaikan skripsi dan penyusunan laporan.

5. Bapak Setia Budi NurCahya yang hanya mau dipanggil dengan Mas Budi selaku direktur dari CV. Inti Keselamatan. Terima kasih atas kepercayaannya yang diberikan kepada saya untuk mengerjakan aplikasi Sistem Manajemen Proteksi Kebakaran Terpadu ini.

6. The last and the best, terima kasih kepada ibu, ayah, nenek, kakak yang selalu

menjadi motivasi untuk cepat lulus kuliah.

Serta pihak-pihak lain yang ikut memberikan informasi dan data-data di dalam menyelesaikan laporan skripsi ini, penulis mengucapkan terima kasih.

Akhir kata penulis harap agar skripsi yang disusun sesuai dengan kemampuan dan pengetahuan yang sangat terbatas ini dapat bermanfaat bagi semua pihak yang membutuhkan.

Wassalamu’alaikum Wr. Wb

Surabaya, November 2013

(9)

Kata Pengantar ... ii 2.1 Sekilas Tentang CV. INTI KESELAMATAN... 7

2.2 Visi dan Misi CV. INTI KESELAMATAN ... 7

2.2.1 Visi CV. INTI KESELAMATAN... 8

2.2.2 Misi CV. INTI KESELAMATAN... 8

2.3 Sistem Informasi... 8

2.4 Framework Yii ... 10

2.4.1 Model-View-Controller ... 10

(10)

2.7 ERD (Entity Relationship Diagram) ... 16

2.8 Uji Validitas... 18

2.8.1 Tujuan Validitas ... 19

2.8.2 Validitas Korelasi Pearson... 19

BAB III Analisis dan Perancangan Sistem 3.1 Analisis Sistem ... 20

3.2 Perancangan Sistem ... 21

3.3 Alur Aplikasi ... 24

3.3.1 Pengembangan UML... 24

3.3.1.1 Pengembangan Use Case... 24

3.3.1.2 Pengembangan Activity Diagram... 26

3.3.1.3 Pengembangan Sequence & Collaboration Diagram.... 35

3.3.1.4 Pengembangan Class Diagram... 41

3.3.1.5 Pengembangan Statechart Diagram... 42

BAB IV Hasil dan Pembahasan 4.1 Kebutuhan sistem ... 44

4.2 Kebutuhan Database ... 46

4.3 Pembuatan Interface (Antar Muka)... 46

4.4 Impementasi Interface (Antar Muka) ... 48

4.4.1 Halaman Utama (Beranda)... 49

4.4.2 Halaman Layanan... 51

4.4.3 Halaman Galeri... 51

(11)

4.4.6 Form Halaman Registrasi Member... 54

4.4.7 Halaman Login Member... 55

4.4.8 Halaman Beranda ( Member )... 56

4.4.9 Form Halaman Maintenance ( Perawatan )... 58

4.4.10 Form Halaman Kendala ( Forum Tanya Jawab )... 59

4.4.11 Halaman Data Setiap Member... 59

4.4.12 Halaman Cetak Data Setiap Member... 60

4.4.13 Halaman Login Admin... 61

4.4.14 Halaman Kelola Member... 62

4.4.15 Halaman Kelola Data Dan Hasil... 63

4.4.16 Halaman Kelola Data Kendala... 65

4.4.17 Halaman Data Pesan Pengunjung... 66

4.4.18 Halaman Login Pimpinan... 67

4.4.19 Halaman Beranda Pimpinan... 68

4.4.20 Tampilan Diagram Laporan... 69

4.5 Skenario Uji Coba... 70

4.5.1 Form Registrasi Member... 70

4.5.2 Uji Coba Maintenance... 72

4.5.3 Uji Coba Kendala... 74

4.5.4 Uji Coba Pesan ( Pengunjung )... 75

4.5.5 Uji Coba Icon Hapus ( admin )... 76

(12)

5.1 Kesimpulan ... 80 5.2 Saran ... 80 Daftar Pustaka

(13)

ABSTRAK

Tujuan dari tugas akhir ini untuk menyelidiki efektivitas dan untuk menentukan kehandalan sistem proteksi bahaya kebakaran pada bangunan gedung melalui suatu perawatan rutin, sehingga sistem proteksi kebakaran akan berfungsi dengan baik dan maksimal apabila sewaktu-waktu dibutuhkan dalam kondisi darurat kebakaran. Perawatan sistem proteksi kebakaran dilakukan dengan cara pengisian form pada suatu website yang akan dibuat oleh peneliti.

Di dalam pembuatan website sistem manajemen proteksi kebakaran terpadu, peneliti menggunakan PHP FRAMEWORK YII sebagai bahasa pemrogaman dan MYSQL sebagai sistem database. Kemudian untuk perancangan dalam pembuatan sistem manajemen berbasis

web ini menggunakan CDM, PDM dan UML ( use case, activity diagram, squence diagram,

collaboration diagram dan statechart diagram).

Hasil yang diharapkan dari pembuatan tugas akhir ini berupa aplikasi sistem manajemen proteksi kebakaran terpadu berbasis web yang dapat membantu dalam proses pengawasan terhadap perawatan alat proteksi kebakaran. Perawatan yang dilakukan oleh pengelola gedung berupa pengiriman data perawatan ke dalam sistem aplikasi, sehingga dapat dipantau langsung oleh lembaga Fire Protection Engineering (FPE) untuk diberikan hasil kelayakan pakai bagi alat proteksi kebakaran tersebut.

(14)

BAB I

PENDAHULUAN

1.1 Latar Belakang

Menurut peraturan menteri pekerjaan umum No.26/PRT/M/2008 tentang persyaratan teknis sistem proteksi kebakaran pada bangunan gedung dan lingkungan disebutkan bahwa pengelolaan proteksi kebakaran adalah upaya mencegah terjadinya kebakaran atau meluasnya kebakaran ke ruangan-ruangan ataupun lantai-lantai bangunan termasuk ke bangunan lainnya melalui eliminasi ataupun meminimalisasi resiko bahaya kebakaran. Perencanaan juga diperlukan untuk pengaturan zona-zona yang berpotensi menimbulkan kebakaran, serta kesiapan dan kesiagaan sistem proteksi aktif maupun pasif. (Widi Hartono:2012)

(15)

Dari uraian di atas dapat diambil kesimpulan bahwa tingkat kehandalan alat proteksi kebakaran harus melalui uji perawatan terlebih dahulu. Penilaian tingkat kehandalan itu sendiri berupa mesin yang dapat berfungsi secara normal, kondisi alat yang tidak berkarat, tangki bahan bakar terisi penuh walaupun tidak digunakan, serta pengisian jenis bahan pemadam yang sesuai dengan standar internasional.

Pada penelitian sebelumnya, untuk perawatan kehandalan sistem proteksi kebakaran masih secara manual dilakukan oleh pengelola gedung dengan sistem penilaian dasar tanpa mengikuti standar internasional. Seiring dengan kemajuan teknologi informasi, perawatan untuk tingkat kehandalan alat proteksi kebakaran dapat dilakukan melalui sebuah aplikasi website. Dalam tugas akhir ini akan dibuat aplikasi sistem manajemen proteksi kebakaran terpadu yang nantinya dapat dipantau oleh lembaga Fire

Protection Engineering (FPE)

Dalam pembuatan sistem manajemen proteksi kebakaran terpadu yang berbasis web, peniliti menggunakan bahasa pemrograman PHP

(Hypertext Prepocessor) yang dapat menjalankan perintah-perintah sistem.

Pada bahasa pemrograman PHP nantinya peneliti juga menggunakan sebuah bingkai kerja yaitu Framework Yii untuk memaksimalkan kinerja dari web tersebut.

1.2 RUMUSAN MASALAH

(16)

sistem manajemen proteksi kebakaran terpadu berbasis web dengan menggunakan framework Yii yang dapat mengirimkan data perawatan semua jenis alat proteksi kebakaran sehingga mendapatkan hasil berupa tingkat kehandalan untuk kelayakan pakai.

1.3 BATASAN MASALAH

Pada pembuatan aplikasi ini perlu didefinisikan batasan masalah mengenai sejauh mana pembuatan aplikasi ini akan dikerjakan. Beberapa batasan masalah tersebut antara lain :

a. Aplikasi yang dirancang ini menggunakan bahasa pemrograman PHP dengan Framework Yii.

b. Aplikasi yang dirancang ini menggunakan database MySQL. c. Aplikasi yang menggunakan aktivasi member untuk user yang

terdaftar.

d. Form maintenance yang digunakan dalam aktivitas user diperoleh

dari lembaga Fire Protection Engineering (FPE).

1.4 TUJ UAN

Tujuan dari tugas akhir ini adalah merancang dan membuat sistem manajemen berbasis WEB yang dapat digunakan oleh lembaga Fire

Protection Engineering (FPE) untuk memantau pelaksanaan maintenance

(17)

dan maksimal apabila sewaktu-waktu dibutuhkan dalam kondisi darurat kebakaran.

1.5 MANFAAT

Manfaat dari pembuatan aplikasi ini adalah :

a. Sebagai alat pemantau dari hasil perawatan alat-alat perlindungan bahaya kebakaran.

b. Menurunkan tingkat resiko dan kerugian yang disebabkan oleh kebakaran.

c. Fire Protection maintenance yang bagus akan meningkatkan klaim

asuransi bagi pengelola atau pemilik gedung.

1.6 METODE PENELITIAN

Langkah-langkah pengumpulan data sebagai dasar penyusunan tugas akhir ini antara lain:

b. Pengumpulan dan Analisa Data

Pengumpulan data dilakukan dengan cara observasi, identifikasi dan klasifikasi melalui studi literatur.

(18)

Melakukan analisa awal tentang sistem yang akan dibuat yaitu suatu pemecahan masalah yang dilakukan untuk perancangan dan pembuatan Aplikasi menggunakan diagram-diagram yang menjelaskan alur program yang akan dibuat.

d. Pembuatan Web

Membuat web system manajemen yang sesuai dengan analisa dan perancangan yang telah dibuat menggunakan PHP

dengan framework YII.

e. UjiCoba

Melakukan uji coba web yang telah dibuat secara keseluruhan untuk mengetahui kekurangan dan kelebihan maupun kesalahan yang nantinya dapat dilakukan perbaikan.

1.7 Sistematika Penulisan

Secara garis besar penyusunan laporan ini, terdiri dari enam bab utama dengan beberapa sub bab didalamnya. Adapun sistematika penulisan laporan tugas akhir ini adalah sebagai berikut :

BAB I : PENDAHULUAN

(19)

BAB II : TINJAUAN PUSTAKA

Pada bab ini dijelaskan tentang teori-teori serta penjelasan-penjelasan yang dibutuhkan dalam aplikasi media pembelajaran pembuatan Sistem Manajemen terpadu berbasis web.

BAB III : METODOLOGI PENELITIAN

Bab ini berisi tentang analisis perancangan sistem, perancangan database dan perancangan desain interface dalam pembuatan sistem manajemen Proteksi Kebakaran Terpadu menggunakan Framework Yii.

BAB IV : HASIL DAN PEMBAHASAN

Bab ini berisi tentang penjelasan hasil, pembahasan dan uji coba sistem Manajemen Proteksi Kebakaran Terpadu menggunakan Framework Yii.

BAB V : KESIMPULAN

Bab ini berisi kesimpulan dan saran dari penulis untuk pengembangan sistem..

DAFTAR PUSTAKA

(20)

2.1 Sekilas Tentang CV. INTI KESELAMATAN

CV. INTI KESELAMATAN didirikan pada tahun 2008, adalah suatu perusahaan yang secara khusus bergerak pada bidang jasa engineering, inspection

& testing, perawatan (maintenance), dan sistem manajemen proteksi kebakaran. Dalam menunjang profesionalitas perusahaan, CV. INTI KESELAMATAN telah menjadi bagian dari organisasi profesi proteksi kebakaran internasional dengan menjadi member pada National Fire Protection Association (NFPA) semenjak tahun 2008, serta menjadi bagian dari organisasi profesi proteksi kebakaran nasional dengan menjadi member pada Asosiasi Profesi Proteksi Kebakaran Indonesia (MP2KI / IFPA) semenjak tahun 2007.

Dalam tugasnya CV. INTI KESELAMATAN melakukan monitoring

berupa pendataan sebagai upaya perawatan (maintenance) pada setiap alat perlindungan bahaya kebakaran yang terdapat dalam gedung yang sudah menjadi mitra kerjanya.

2.2 Visi dan Misi CV. INTI KESELAMATAN

(21)

2.2.1 Visi CV. INTI KESELAMATAN

Kebakaran merupakan suatu resiko yang dapat dicegah, dengan sistem proteksi kebakaran dan manajemen yang memadai, kita dapat meminimasi resiko dan dampak yang ditimbulkan karena kebakaran.

2.2.2 Misi CV. INTI KESELAMTAN

Membantu masyarakat dalam meminimasi resiko dan dampak kebakaran melalui profesionalisme terhadap sistem proteksi kebakaran yang memadai dan memenuhi standar.

2.3 Sistem Infor masi

Sistem Informasi (SI) adalah kombinasi dari teknologi informasi dan aktivitas orang yang menggunakan teknologi itu untuk mendukung operasi dan manajemen. Dalam arti yang sangat luas, istilah sistem informasi yang sering digunakan merujuk kepada interaksi antara orang, proses algoritmik, data dan teknologi. Dalam pengertian ini, istilah ini digunakan untuk merujuk tidak hanya pada penggunaan organisasi teknologi informasi dan komunikasi (TIK), tetapi juga untuk cara di mana orang berinteraksi dengan teknologi ini dalam mendukung proses bisnis. (Landscape:2009)

(22)

Alter berpendapat untuk sistem informasi sebagai tipe khusus dari sistem kerja. Sistem kerja adalah suatu sistem di mana manusia dan/atau mesin melakukan pekerjaan dengan menggunakan sumber daya untuk memproduksi produk tertentu dan/atau jasa bagi pelanggan. Sistem informasi adalah suatu sistem kerja yang kegiatannya ditujukan untuk pengolahan (menangkap, transmisi, menyimpan, mengambil, memanipulasi dan menampilkan) informasi.

Dengan demikian, sistem informasi antar-berhubungan dengan sistem data di satu sisi dan sistem aktivitas di sisi lain. Sistem informasi adalah suatu bentuk komunikasi sistem di mana data yang mewakili dan diproses sebagai bentuk dari memori sosial. Sistem informasi juga dapat dianggap sebagai bahasa semi formal

yang mendukung manusia dalam pengambilan keputusan dan tindakan. (Alter :1992)

Sistem informasi adalah gabungan yang terorganisasi dari manusia, perangkat lunak, perangkat keras, jaringan komunikasi dan sumber data dalam mengumpulkan, mengubah, dan menyebarkan informasi dalam organisasi. (O’Brien:2007). Sistem informasi adalah suatu sistem di dalam suatu organisasi yang mempertemukan kebutuhan pengolahan transaksi harian, mendukung operasi, bersifat manajerial dan kegiatan strategi dari suatu organisasi dan menyediakan pihak luar tertentu dengan laporan-laporan yang diperlukan.(Jane P: 2007)

SI dapat dikategorikan dalam empat bagian:

(23)

c. Sistem Informasi Eksekutif. d. Sistem Pemrosesan Transaksi.

2.4 Fr amewor k Yii

Yii adalah framework (kerangka kerja) PHP berbasis komponen, berkinerja tinggi untuk pengembangan aplikasi Web berskala besar. Yii menyediakan reusability maksimum dalam pemograman Web dan mampu meningkatkan kecepatan pengembangan secara signifikan. (Sabit Huraira:2012)

Framework Yii pertama kali dikembangkan oleh seorang master bernama Qiang Xue pada januari 2008 dan pada Desember 2008 Yii 1.0 dirilis untuk publik. (Qiang Xue and Xiang Wei Zhuo:2008)

2.4.1 Model-View-Controller

Penerapan konsep MVC dimaksudkan untuk memisahkan logika bisnis dan antar muka pada suatu aplikasi. Dengan MVC, pihak pengembang aplikasi dapat lebih mudah mengubah suatu bagian dalam aplikasi tanpa harus mengubah bagian yang lainnya. Dalam MVC, model menggambarkan informasi atau data beserta aturan bisnisnya (validasi, relasi, dll). View atau tampilan menggambarkan antarmuka yang menjadi penghubung ntara aplikasi dan pengguna (user). sedangkan controller akan menjadi embatan komunikasi antara Model dan View.

a. Model

(24)

model yang disimpan dan dikumpulkan ke dalam database dan model yang setelah dipakai tidak disimpam ke dalam database. Jika kita menggunakan model yang setelah dipakai tidak tersimpan ke dalam database, maka kita dapat menggunakan Form Model untuk mendefinisikannya. Sedangkan untuk model yang disimpan dan dikumpulkan ke dalam database, kita dapat menggunakan Active Record.

b. View

View adalah antarmuka aplikasi yang menjadi jembatan interaksi antar user dan aplikasi. Intinya view adalah tampilan yang akan dilihat oleh user. Membuat tampilan pada Yii Framework sebenarnya tidak ada bedanya dengan membuat form dengan menggunakan script HTML dan PHP, hanya saja pada Yii juga tersedia beberapa kelas pembantu untuk mempermudah membuat tampilan.

c. Contr oller

Controller adalah jembatan yang menghubungkan antara View dan Model. Controller terdiri dari action (aksi) yang akan melakukan request yang di dalamnya biasanya memerlukan Model dan View. Dengan kata lain, kalo anda mau membuat sebuah aksi yang bisa direquest oleh user, anda harus definisikan aksi yang terdapat di dalam sebuah controller.

2.5 UML (Unified Modeling Language)

Unified Modeling Language (UML) adalah standar, bahasa pemodelan

tujuan umum di bidang rekayasa perangkat lunak. Unified Modeling Language

(25)

berorientasi objek sistem perangkat lunak-intensif. Unified Modeling Language

dikembangkan oleh Grady Booch, Ivar Jacobson dan James Rumbaugh di Rational Software pada 1990-an.(Hamilton:1999).Hal ini diadopsi oleh Management Group Object (OMG) pada tahun 1997, dan telah dikelola oleh organisasi ini sejak saat itu. Pada tahun 2000 Unified Modeling Language

diterima oleh International Organization for Standardization (ISO) sebagai standar industri untuk pemodelan sistem perangkat lunak-intensif. Versi saat ini dari UML 2.4.1 diterbitkan oleh OMG pada bulan Agustus 2011.

Unified Modeling Language (UML) menggabungkan teknik dari

pemodelan data (diagram hubungan entitas), pemodelan bisnis (aliran kerja), pemodelan objek, dan pemodelan komponen. Hal ini dapat digunakan dengan semua proses, sepanjang siklus hidup pengembangan perangkat lunak, dan seluruh teknologi implementasi yang berbeda.(Mishra:1997)

Diagram berbentuk grafik yang menunjukkan simbol elemen model yang disusun untuk mengilustrasikan bagian atau aspek tertentu dari sistem. Sebuah diagram merupakan bagian dari suatu view tertentu dan ketika digambarkan biasanya dialokasikan untuk view tertentu. Adapun jenis diagram antara lain :

a) Use Case Diagram adalah abstraksi dari interaksi antara system dan actor. Use case bekerja dengan cara mendeskripsikan tipe interaksi antara user

(26)

Gambar 2.1 Use Case

b) Class Diagram adalah dekripsi kelompok obyek-obyek dengan property, perilaku (operasi) dan relasi yang sama. Sehingga dengan adanya class diagram dapat memberikan pandangan global atas sebuah sistem. Class diagram sangat membantu dalam visualisasi struktur kelas dari suatu sistem. Seperti pada gambar 2.2 di bawah ini.

(27)

c) Sequence Diagram, Sequence Diagram digunakan untuk menggambarkan perilaku pada sebuah skenario. Kegunaannya untuk menunjukkan rangkaian pesan yang dikirim antara object juga interaksi antara object, sesuatu yang terjadi pada titik tertentu dalam eksekusi sistem. Seperti pada gambar 2.3 di bawah ini.

Gambar 2.3 Sequence Diagram

(28)

Gambar 2.4 Collaboration Diagram

e) Activity Diagram, Menggambarkan rangkaian aliran dari aktivitas, digunakan untuk mendeskripsikan aktifitas yang dibentuk dalam suatu operasi sehingga dapat juga digunakan untuk aktifitas lainnya seperti use case atau interaksi. Seperti pada gambar 2.5 di bawah ini.

Gambar 2.5 Activity Diagram

: customer

halaman web

form registrasi

database 1: mas uk halaman

2: mengisi form 3: data tidak valid

(29)

Tujuan Penggunaan UML :

a) Memberikan bahasa pemodelan yang bebas dari berbagai bahasa pemrograman dan proses rekayasa.

b) Menyatukan praktek-praktek terbaik yang terdapat dalam pemodelan. c) Memberikan model yang siap pakai, bahasa pemodelan visual yang

ekspresif untuk mengembangkan dan saling menukar model dengan mudah dan dimengerti secara umum.(Mishra:1997)

2.6 CDM dan PDM

CDM (Conceptual Data Modeling). CDM dipakai untuk menggambarkan secara detail struktur basis data dalam bentuk logik. Struktur ini independen

terhadap semua software maupun struktur data storage tertentu yang digunakan dalam aplikasi ini. CDM terdiri dari objek yang tidak diimplementasikan secara langsung kedalam basis data yang sesungguhnya.

PDM (Physical Data Model). PDM merupakan gambaran secara detail basis data dalam bentuk fisik. Penggambaran rancangan PDM memperlihatkan struktur penyimpanan data yang benar pada basis data yang digunakan sesungguhnya.

2.7 ERD (Entity Relationship Diagram)

(30)

mendesain database secara fisik yaitu pembuatan tabel, index dengan tetap mempertimbangkan performance. Kemudian setelah database selesai dilanjutkan dengan merancang aplikasi yang melibatkan database.

Entitas adalah objek dalam dunia nyata yang dapat dibedakan dengan objek lain, sebagai contoh mahasiswa, dosen, departemen. Entitias terdiri atas beberapa atribut sebagai contoh atribut dari entitas mahasiswa adalah nim, nama, alamat, email, dll. Atribut nim merupakan unik untuk mengidentifikasikan / membedakan mahasiswa yg satu dengan yg lainnya. Pada setiap entitas harus memiliki 1 atribut unik atau yang disebut dengan primary key. Berikut adalah gambar 2.6 contoh ERD.

Gambar 2.6 Contoh Relasi ERD

(31)

Kardinalitas menyatakan jumlah himpunan relasi antar entitas permulaan kardiniliat terdiri dari :

a) one-to-one : sebuah entitas pada A berhubungan dengan entitas B paling banyak 1 contoh diatas relasi pegawai dan departemen dimana setiap pegawai hanya bekerja pada 1 departemen

b) one-to-many : sebuah entitas pada A berhubungan dengan entitas B lebih dari satu contoh diatas adalah 1 departemen memiliki banyak pegawai

c) many-to-many : sebuah entitas pada A berhubungan dengan entitas lebih dari satu dan B berhubungan dengan A lebih dari satu juga contoh di atas adalah relasi mahasiswa dengan mata kuliah.

Berikut adalah metode atau tahap untuk membuat ERD :

a) Menentukan entitas b) Menentukan relasi

c) Menggambar ERD sementara d) Mengisi Kardinalitas

e) Menentukan Kunci Utama f) Menggambar ERD berdasar Key g) Menentukan Atribut

h) Memetakan Atribut

i) Menggambar ERD dengan atribut. 2.8 Uji Validitas

Uji validitas adalah suatu langkah pengujian yang dilakukan terhadap isi

(content) dari suatu instrumen, dengan tujuan untuk mengukur ketepatan

(32)

2.8.1 Tujuan Validitas

Mengetahui sejauh mana ketepatan dan kecermatan suatu instrumen pengukuran dalam melakukan fungsi ukurnya. Sehingga data yang diperoleh bisa relevan/sesuai dengan tujuan diadakannya pengukuran tersebut. (Widiyanto:2010)

2.8.2 Validitas Korelasi Pear son

Korelasi adalah suatu ukuran hubungan linier antar variabel. Cara termudah guna melihat apakah dua variabel berhubungan adalah dengan melihat apakah mereka memiliki covarians. Pemahaman atas covarians

menuntut kita memahami konsep varians. Varians suatu variabel mewakili rata-rata perbedaan data variabel tersebut dengan nilai mean-nya.

(33)

3.1 Analisis Sistem

Analisis sistem sangat dibutuhkan guna menunjang penerapan sistem baru, apakah sistem baru yang akan diterapkan sudah sesuai dengan kebutuhan yang diinginkan atau belum, karena hal tersebut berkaitan dengan tujuan yang ingin dicapai. Fungsi dari sistem baru yang penulis rancang ini adalah untuk membantu mengelola sistem manajemen proteksi kebakaran agar lebih mudah dalam pemantauan perawatan (maintenance) alat perlindungan bahaya kebakaran.

Perencanaan dan implementasi dari sistem ini bertujuan untuk membantu pihak CV. INTI KESELAMATAN dalam monitoring dan pengelolaan data perawatan (maintenance) agar tidak dilakukan secara manual serta dapat menerima data dari wilayah manapun. Tentunya dengan adanya dukungan dari sistem manajemen proteksi kebakaran terpadu ini pihak CV. INTI KESELAMATAN dapat lebih mudah untuk memantau suatu perawatan alat perlindungan bahaya kebakaran yang dilakukan oleh pihak gedung yang sudah menjadi member atau mitra kerjanya.

(34)

3.2 Perancangan Sistem

Pada tahap perancangan sistem ini akan dirancang suatu sistem dalam suatu bagan yang menunjukkan prosedur-prosedur dari sistem tersebut. Pada perancangan dan pembuatan Sistem Manajemen Proteksi Kebakaran Terpadu menggunakan flowchart, yang akan dijelaskan pada gambar 3.1 di bawah ini.

Gambar 3.1 Flowchart Aktivasi Member

(35)

melakukan login sesuai dengan username dan password yang sudah didaftarkan. Setelah sistem mem-validasi akun, kemudian member akan diarahkan pada halaman utama yang mengawali untuk melakukan perawatan alat perlindungan bahaya kebakaran.

Dalam pembuatan aplikasi web harus disediakan juga halaman kerja

admin untuk melakukan insert, update dan delete pada sistem aplikasi, sehingga

semua kegiatan yang berada di dalam sistem aplikasi web tersebut dapat di kontrol baik oleh admin. Alur flowchart pada gambar 3.2 di bawah ini akan dijelaskan suatu kinerja admin untuk mengontrol sistem aplikasi web ini.

(36)

Pada gambar diatas menggambarkan kinerja admin untuk mengontrol sistem, pada dasarnya admin melakukan kelola data member, kelola data

maintenance serta mengelola suatu halaman kendala dalam bentuk pengiriman

balasan dari pertanyaan-pertanyaan member untuk admin.

Gambar 3.3 Flowchart Aktivasi Pimpinan

(37)

merujuk pada informasi kelayakan alat yang diukur dengan persentasi berapa persen (%). Kesimpulannya pada setiap bulan ada berapa perusahaan yang mendapatkan hasil di bawah atau di atas 50% untuk setiap alat perlindungan bahaya kebakaran yang dimiliki oleh setiap member.

3.3 Alur Aplikasi

Dalam perancangan sistem dibutuhkan alur aplikasi yang sistematis dan searah, sehingga dapat terencana dengan baik. Peneliti menggunakan uml yang terdiri dari use case, activity diagram, sequence, collaboration, dan statechart diagram. Tiap-tiap diagram ini nantinya akan menjelaskan secara rinci bagaimana sistem akan dibuat pada halaman customer maupun halaman admin. Mulai dari login, form perawatan, kelola data hingga logout.

3.3.1 Pengembangan UML

Diagram uml digunakan untuk menjelaskan proses keja dari sistem manajmen proteksi kebakaran terpadu.

3.3.1.1 Pengembangan Use Case

Dalam tahap pengembangan use case terdapat gambaran umum sistem serta beberapa aksi aktor yang berinteraksi dengan sistem yang berjalan. Pada tahapan alur use case pada sistem manajemen proteksi kebakaran terpadu ini nantinya menjelaskan bahwa dalam use case diagram memiliki 2 aktor yaitu

member dan admin. Dari alur aplikasi diatas maka diperoleh gambaran use case

(38)

Gambar 3.4 Use Case Diagram Sistem Manajemen Proteksi Kebakaran Terpadu

Pada gambar diatas menjelaskan bahwa setiap aktor akan berinteraksi dengan sistem yang berbeda-beda. Pada aktor member, sistem yang harus dijalankan yaitu registrasi, pengisian maintenance, pengisian kendala, lihat

maintenance dan cetak. Kemudian pada aktor admin. sistem yang harus

dijalankan yaitu lihat member, kelola maintenance dan kelola kendala. Pada umumnya admin hanya dapat insert, update dan delete pada sistem. Sedangkan untuk aktor pimpinan hanya dapat melakukan lihat diagram yang berupa data laporan perbulan.

(39)

3.3.1.2 Pengembangan Activity Diagr am

Pada tahap pengembangan activity diagram member, pada umumnya berisi aktiitas-aktifitas yang dilakukan oleh member terhadap sistem manajemen proteksi kebakaran. Tahapan ini merupakan inti dari jalannya sistem aplikasi, dikarenakan aplikasi yang berupa monitoring ini akan dapat berjalan apabila aktifitas member bisa berjalan. Bisa dilihat pada gambar 3.5 di bawah ini.

aks es web

(40)

Pada gambar diatas merupakan keseluruhan kegiatan member mulai dari melakukan pendaftaran member untuk mendapatkan akun, kemudian melakukan

login setelah itu member dapat mengisi form maintenance sesuai dengan prosedur,

serta member dapat melakukan aktivasi pertanyaan apabila mempunyai kendala dan harus ditanyakan kepada admin pada halaman form kendala.

1. Activity Diagram Untuk Member

Berisi aktifitas-aktifitas yang dilakukan oleh member terhadap sistem manajemen proteksi kebakaran terpadu.

a) Registrasi

Jika user ingin melakukan tahapan maintenance (perawatan) sistem manajemen proteksi kebakaran terpadu pada web, user harus menjadi member

terlebih dahulu dengan melakukan registrasi. Lihat pada gambar 3.6 di bawah ini.

s tart

halaman utama

registras i

input us enam e input pas sword 1 input nama input nama_ perusahaan

mas a registras i no. rekening

input captcha konfirmas i

registrasi

(41)

Pada gambar diatas menjelaskan bahwa user setelah memasuki halaman

website, user diarahkan pada pilihan menu registrasi untuk melakukan pendaftran

dengan menginputkan username, password 1, password 2, nama member, nama perusahaan, alamat, kota, provinsi, kode pos, email, no telp, massa registrasi, no rekening dan mengisi kode captcha. Setelah itu sistem akan memproses, jika berhasil maka akan tampil konfirmasi registrasi, jika gagal akan kembali masuk pada form registrasi.

b) Login

Halaman login hanya dikhususkan pada user yang sudah menjadi member

dari sistem manajemen proteksi kebakaran terpadu, dikarenakan user nantinya akan memasukkan username dan password yang sudah didaftarkan sebelumnya. Lihat pada gambar 3.7 di bawah ini.

s tart

halaman utama

login mem ber input us ernam e

input pass word klik login

(42)

Pada gambar di atas menjelaskan bahwa form login dilakukan hanya dengan memasukkan username dan password, jika berhasil maka member akan masuk pada halaman utama yang berisi form maintenance untuk melakukan aktifitasnya. Apabila gagal sistem akan meminta username atau password dengan benar.

c) Maintenance (Perawatan)

Setelah login, member dapat melakukan aktifitas maintenance dengan cara memilih menu maintenance, kemudian akan diarahkan pada form maintenance

untuk melakukan pengisian kondisi alat proteksi kebakaran sesuai dengan prosedur yang ada. Lihat pada gambar 3.8 di bawah ini.

start

akses web halaman utama login halaman utama

member

(43)

Pada gambar di atas menjelaskan bahwa member diwajibkan untuk melakukan pengisian secara lenkap atau tidak boleh kosong, dikarenakan hal itu merupakan aturan yang sesuai dengan prosedur. Apabila terdapat salah satu pertanyaan yang kosong pada suatu form, maka member akan diberi peringatan “data tidak lenkap” kemudian diarahkan langsung ke halaman sebelumnya. Setelah aktifitas maintenance selesai, member dapat melakukan pengiriman data dengan klik pada tombol “Kirim Data”.

d) Form Kendala

Pada tahapan ini merupakan form berupa pertanyaan dari petugas teknisi gedung sebagai member dari CV. INTI KESELAMATAN tentang kondisi alat proteksi kebakaran setelah melakukan maintenance. Lihat pada gambar 3.9 di bawah ini.

s tart

aks es web

halam an utama login mem ber halam an utama

(44)

Pada gambar di atas menjelaskan bahwa member setelah melakukan aktifitas maintenance, member akan di berikan fasilitas berupa form kendala. Pertanyaannya mungkin dapat berupa tentang kondisi baik atau buruk alat proteksi kebakaran serta keruskan alat pada saat melakukan maintenance yang tidak di ketahui oleh teknisi gedung. Setelah melakukan pengisian data form kendala lengkap, member akan langsung dapat balasan pada halaman form kendala tersebut.

e) Logout Member

Pada tahapan ini hanya berupa sistem logout setelah selesai melakukan aktifitas. Lihat pada gambar 3.10 di bawah ini.

s tart

aks es web

halam an utam a

mem ber seles ai m elakukan maintenance & pengisian form kendala

logout

end

(45)

Pada gambar di atas menjelaskan apabila member telah selesai melakukan seluruh aktifitas pada website seperti pengisian form maintenance dan form kendala, maka member harus melakukan logout agar dapat menjamin tingkat keamanan data member.

2. Activity Diagram Untuk Admin

Pada activity diagram admin, pada umumnya berisi aktifitas-aktifitas yang dilakukan oleh admin terhadap sistem penyimpanan data. Lihat pada gambar 3.11 di bawah ini.

start

akses web halaman login form login benar

[ Tidak ]

Gambar 3.11 Activity Diagram Admin

Pada gambar di atas menjelaskan bahwa admin dapat melakukan insert,

(46)

data kendala. Pada dasarnya admin hanya melakukan monitoring terhadap aktifitas maintenance yang dilakukan oleh member, serta melakukan interaksi dengan member berupa kirim balasan pada form kendala.

a) Login Admin

Login dilakukan dengan memasukkan username dan password, seperti

halnya member, admin juga harus melakukan login untuk dapat melakukan kelola seluruh data. Lihat pada gambar 3.12 di bawah ini.

akses web

halaman utama halaman login input username input password

klik login

Gambar 3.12 Activity Diagram Login Admin

(47)

halaman utama yang berisi kelola seluruh data yang ada pada sistem manajemen proteksi kebakaran terpadu untuk melakukan aktifitasnya berupa monitoring kegiatan maintenance (perawatan) yang sudah dilakukan oleh member. Apabila

login gagal sistem akan meminta username atau password dengan benar.

b) Kelola Data maintenance

Pada dasarnya admin hanya melakukan monitoring data pada penyimpanan form maintenance untuk menilai tingkat kondisi dari alat proteksi kebakaran yang dimiliki oleh setiap member. Lihat pada gambar 3.13 di bawah ini.

s tart

aks es web

halam an utama

login m em ilih tabel data maintenance

(48)

Pada gambar di atas menjelaskan bahwa admin melakukan kelola untuk melihat dan menentukan hasil penilaian pada kondisi dari alat kebakaran yang tidak layak atau diharuskan untuk mengganti, admin secara langsung menghubungi pihak pengelola gedung yang sudah menjadi member, begitu pula sebaliknya apabila kondisi dari alat proteksi kebakaran masih layak pakai, admin

juga secara langsung menghubungi pihak gedung.

3.3.1.3Pengembangan Sequence Diagr am Dan Collaboration Diagram

Pada tahap pengembangan sequence diagram dan collaboration diagram akan dijelaskan interaksi objek yang disusun dalam suatu urutan waktu yang berasosiasi dengan use case serta memperlihatkan tahap demi tahap apa yang seharusnya terjadi untuk menghasilkan sesuatu di dalam use case.

1) Sequence Diagram Dari Use Case Registrasi

Pada sequence diagram registrasi, menunjukkan bahwa nantinya user

harus mengisi form registrasi agar dapat menjadi member. Lihat pada gambar di bawah ini.

(49)

Pada Gambar 3.14 diatas menjelaskan bahwa pada from registrasi tersebut berfungsi sebagai data member yang akan disimpan di dalam database sebagai arsip perusahaan maupun sebagai akun member untuk melakukan login dan melakukan aktifitas maintenance (perawatan) pada sistem manajemen proteksi kebakaran terpadu. Pada saat melakukan registrasi, member diharapkan selalu mengingat username dan password yang nantinya akan didaftarkan saat mengisi form, sehingga pada saat login sesuai dengan akun dan tidak akan terjadi kesalahaan akun.

Berikut gambar 3.15 yaitu collaboration diagram registrasi setelah

digenerate dari sequence diagram registrasi.

: form registrasi

(50)

Pada gambar 3.15 di atas menjelaskan bahwa pada collaboration diagram tersebut dapat dilihat bagaimana langkah-langkah aktor untuk melakukan kegiatan registrasi ke dalam sistem sesuai dengan nomer yang terdapat di dalam gambar.

2) Sequence Diagram Dari Use Case Login

Pada sequence diagram login,menunjukkan bahwa nantinya member harus mengisi form login untuk memasukkan identitas username dan password sesuai dengan akun yang sudah didaftarkan saat melakukan registrasi. Lihat pada gambar 3.16 dibawah ini.

Gambar 3.16 Sequence Diagram Login

Pada gambar di atas menjelaskan bahwa pada aktifitas ini member

(51)

sudah menjadi member sistem akan memvalidasi akun dan sistem akan mengarahkan member pada halaman utama untuk melakukan mainteance

(perawatan) sistem manajemen proteksi kebakaran terpadu.

Berikut gambar 3.17 yaitu collaboration diagram login setelah digenerate

dari sequence diagram login.

: database : member

Gambar 3.17 Collaboration Diagram Login

Pada gambar di atas menjelaskan bahwa collaboration diagram tersebut dapat dilihat, bagaimana langkah-langkah aktor untuk melakukan kegiatan login

ke dalam sistem sesuai dengan nomer yang terdapat di dalam gambar. Pada dasarnya aktor sangat berperan penting dalam melakukan kegiatan pada form

(52)

3) Sequence Diagram Dari Use Case Maintenance

Pada sequence diagram maintenance, menjelaskan untuk kegiatan utama member pada sistem manajemen proteksi kebakaran terpadu yaitu melakukan aktifitas pengisian form maintenance (perawatan). Lihat pada gambar 3.18 sebagai berikut

Gambar 3.18 Sequence Diagram Maintanance

(53)

dapat dilakukan monitoring serta dapat memberikan solusi pada saat membalas pertanyaan dari member pada halaman kelola kendala oleh admin.

Berikut gambar 3.19 yaitu collaboration diagram maintenance setelah

digenerate dari sequence diagram maintenance.

: control

Gambar 3.19 Collaboration Diagram Maintenance

Pada gambar di atas menjelaskan bahwa collaboration diagram

maintenance tersebut dapat dilihat bagaimana langkah-langkah aktor untuk

melakukan kegiatan maintenance (perawatan) alat proteksi kebakaran ke dalam sistem sesuai dengan alur nomer yang terdapat di dalam gambar. Pada dasarnya aktor sangat berperan penting dalam melakukan kegiatan pada form maintenance

(54)

tersebut, sehingga dapat menyimpulkan kelayakan dari alat proteksi kebakaran yang dimiliki oleh pihak member.

3.3.1.4Pengembangan Class Diagram

Menggambarkan pemodelan sistem yang berorientasi objek. Class diagram tersebut menunjukkan antar class yang saling berhubungan dan bagaimana mereka berkolaborasi. Dapat dilihat pada gambar 3.20 sebagai berikut.

regis trasi

Gambar 3.20 Class Diagram Dari Sistem Maintenance

(55)

3.3.1.5Pengembangan Statechart Diagram

Pada tahap pengembangan statechart diagram akan dijelaskan beberapa ringkasan alur sistem yang telah disusun sebelumnya seperti activity diagram, sequence diagram dan collaboration diagram untuk memperlihatkan tahap demi tahap apa yang seharusnya terjadi secara ringkas pada sistem manajemen proteksi kebakaran terpadu.

a) Statechart Diagram Registrasi

Pada statechart diagram registrasi, merupakan ringkasan dari use case

diagram registrasi sebelumnya. Lihat pada gambar 3.20 di bawah ini.

s tart

Gambar 3.21 Statechart Diagram Registrasi

(56)

username dan password untuk dapat login ke dalam sistem maintenance

(perawatan).

b) Statechart Diagram Maintenance dan Kendala

Pada statechart diagram maintenance dan kendala, merupakan ringkasan dari use case diagram maintenance dan kendala sebelumnya. Lihat pada gambar 3.21 di bawah ini.

Gambar 3.22 Statechart Diagram Maintenance dan Kendala

Pada gambar di atas menjelaskan bahwa setelah login dengan akun

username dan password yang sudah didapatkan oleh member, maka member

(57)

Bab ini akan menjelaskan tentang implementasi dan evaluasi sistem manajemen proteksi kebakaran terpadu menggunakan teknologi web based yang membentuk sebuah program yang dapat mempermudah member dalam melakukan perawatan pada alat proteksi kebakaran. Untuk hasil pembuatan aplikasi ini peneliti membuat beberapa hasil diantaranya adalah hasil database, hasil desain dan ujicoba. Untuk lebih jelasnya berikut ulasan dari hasil web sistem manajemen proteksi kebakaran terpadu.

4.1 Uji Coba Sistem

Uji coba web sistem manajemen proteksi kebakaran terpadu ini melalui

browser dengan sistem komputer serta spesifikasi sebagai berikut :

Sistem Operasi : Microsoft Windows 7 Ultimate

Jenis Komputer : Laptop Axioo Neon

Processor : Intel Core 2 Duo CPU T6500 @ 2.10Ghz 2.1Ghz

RAM : 2 GB

VGA : 248 MB

(58)

Sistem manajemen proteksi kebakaran terpadu ini juga bisa diakses melalui browser pada sistem komputer dengan spesifikasi sebagai berikut :

Sistem Operasi : Microsoft Windows XP

Jenis Komputer : PC / desktop

RAM : 512 MB

Hard Disk : 200 GB

Perangkat Lunak yang digunakan untuk membuat sistem manajemen

proteksi kebakaran terpadu ini adalah sebagai berikut :

a. Windows 7 Ultimate 32bit

Sistem Operasi yang digunakan untuk membuat Web portal PRT ini yaitu dengan Windows 7 Ultimate 32bit.

b. Adobe Photoshop CS 8

Adobe Photoshop CS 8 digunakan untuk mengedit dan mendesain gambar pada tampilan website.

c. Xampp

(59)

4.2 Kebutuhan Database

Pada tahap ini akan dibahas mengenai implementasi pembuatan database

dari perancangan yang telah dijelaskan sebelumnya. Untuk menyimpan data, peneliti menggunakan MySQL dikarenakan data yang akan digunakan cukup besar. Berikut tampilan database di phpmyadmin yang digunakan dalam sistem manajemen proteksi kebakaran terpadu.

Gambar 4.1 Database Web

4.3 Pembuatan Inter face (Antar Muka)

Program ini dibuat dengan menggunakan Macromedia Dreamweaver 8 untuk mendesain tampilan web. Dalam sistem manajemen ini terdapat 3 web

(60)

Gambar 4.2 Pembuatan Desain Member

Selain desain untuk member peneliti juga mendesain halaman untuk admin dan pimpinan menggunakan Macromedia Dreamweaver 8.

(61)

4.4 Impementasi Inter face (Antar Muka)

Pada Tahap ini akan dibahas tentang Implementasi antar muka pada Web

sistem manajemen proteksi kebakaran terpadu yang telah dibuat berdasarkan perancangan yang telah dibahas pada bab III.

Berikut ini terdapat beberapa form antar muka yaitu :

a. Halaman Utama (beranda)

b. Halaman Layanan

c. Halaman Galeri

d. Halaman Profil

e. Form Halaman Hubungi Kami

f. Form Halaman Registrasi member

g. Halaman Login member

h. Halaman Beranda member

i. Form Halaman Maintenance

j. Form Halaman Kendala (forum tanya jawab)

k. Halaman Data Setiap Member

l. Halaman Cetak Data Setiap Member

(62)

n. Halaman Kelola Member

o. Halaman Kelola Data dan Hasil Maintenance

p. Halaman Kelola Data Kendala

q. Halaman Kelola Data Pesan Pengunjung

r. Halaman Login Pimpinan

s. Halaman Beranda Pimpinan

t. Halaman Laporan Diagram Setiap Data

4.4.1 Halaman Utama (Beranda)

Form halaman beranda ini menampilkan halaman utama yang terdapat 6 menu. Menu tersebut yaitu beranda, layanan, galeri, profil, hubungi kami dan akun. Pada menu akun terdapat 2 pilihan menu lagi yaitu registrasi dan login.

Pada halaman utama ini hanya menjelaskan profil perusahaan kepada pegunjung website sebagai awal media promosi, sehingga nantinya pengunjung bisa tertarik untuk menjadi bagian dari CV. Inti Keselamatan serta menjadi mitra kerjanya.

Setiap menu pada halaman utama ini dapat diakses oleh semua pengunjung website yang belum menjadi member maupun yang sudah menjadi

(63)

Gambar 4.4 Halaman Utama (Beranda)

Pada halaman utama, seluruh pengunjung website dapat melakukan aktifitas sesuai dengan pilihan menu yang ada. Adapun informasi yang mengenai menu tersebut adalah:

a. Pada menu layanan terdapat informasi tentang semua pelayanan yang akan diberikan oleh pihak CV. Inti Keselamatan.

b. Pada menu galeri terdapat foto dokumentasi kegiatan.

c. Pada menu profil terdapat informasi mengenai profil perusahaan. d. Pada menu hubungi kami terdapat informasi berupa fasilitas kirim

pertanyaan, saran maupun kritik.

(64)

4.4.2 Halaman Layanan

Halaman layanan ini berisikan tentang informasi layanan (customer

service) untuk member. Seperti gambar 4.5 di bawah ini.

Gambar 4.5 Halaman Layanan

Pada halaman layanan ini merupakan media informasi bagi para pengunjung untuk mengetahui layanan apa saja yang diberikan apabila menjadi mitra kerja dari CV. Inti Keselamatan seperti desain tata letak, instalasi, perawatan, tes-pemeriksaan dan perbaikan.

4.4.3 Halaman Galeri

Berikut adalah tampilan pada halaman menu galeri. Semua pengunjung

website akan melihat beberapa foto dokumentasi kegiatan. Dapat dilihat pada

(65)

Gambar 4.6 Halaman Galeri

Pada halaman galeri di atas menampilkan beberapa kegiatan dari pihak CV. Inti Keselamatan pada saat memberikan layanan terhadap para member

dengan berupa foto dukumentasi serta penjelasan kegiatan yang dilakukan, seperti

control valve inspection, fire pump inspections, system flow test, sprinkler system

drining serta banyak lagi yang lainnya .

4.4.4 Halaman Pr ofil

(66)

Gambar 4.7 Halaman Profil

Halaman profil di atas menampilkan profil dari perusahaan CV. Inti Keselamatan sebagai pihak yang menjadi admin untuk sistem manajemen proteksi kebakaran terpadu ini, sehingga dengan memberikan informasi profil perusahaan nantinya pihak CV. Inti Keselamatan berharap para member

mempunyai rasa kepercayaan yang lebih untuk menjadi mitra kerjanya.

4.4.5 Form Halaman Hubungi Kami

(67)

Gambar 4.8 Form Halaman Hubungi Kami

Pada form hubungi kami di atas, apabila pengunjung akan memberikan pertanyaan diharuskan terlebih dahulu mengisikan data berupa nama, email, judul, pesan serta harus mengisi kode capcha dengan benar. Apabila data kurang lengkap sistem akan memberi konfirmasi pengisian ulang, serta data tidak akan tersimpan oleh sistem.

4.4.6 Form Halaman Registrasi Member

Form registrasi ini digunakan untuk mendaftar menjadi member. Apabila pengunjung tidak menjadi member, maka pengunjung tidak dapat melakukan aktivitas perawatan (maintenance) terhadap alat proteksi kebakaran didalam web

(68)

Gambar 4.9 Form Halaman Regsitrasi Member

Pada form registrasi di atas, apabila pengunjung yang akan menjadi member diharuskan terlebih dahulu mengisikan data berupa username, password, nama, nama perusahaan, alamat, kota, provinsi, kode pos, no hp, email serta mengisi kode capcha untuk keamanan sistem. Apabila data kurang lengkap sistem akan memberi konfirmasi pengisian ulang, serta data tidak akan tersimpan oleh sistem.

4.4.7 Halaman Login Member

(69)

Gambar 4.10 Halaman Login Member

Pada halaman login di atas, semua member diwajibkan untuk mengisi kolom username dan password terlebih dahulu sebelum masuk kedalam sistem utama untuk melakukan maintenance ( perawatan ). Apabila member mengisi kolom username dan password tidak sesuai data yang ada, maka secara otomatis siatem akan memberi peringatan bahwa data tidak valid.

4.4.8 Halaman Beranda ( Member )

(70)

Gambar 4.11 Halaman Beranda( member )

Pada halaman beranda ( member ) di atas juga terdapat 4 manu yaitu beranda, maintenance, kendala dan logout. Adapun informasi yang mengenai menu tersebut adalah:

a. Untuk menu beranda sesuai dengan penjelasan diatas

b. Pada menu maintenance terdapat beberapa form untuk melakukan kegiatan inti dari perawatan alat proteksi kebakaran.

c. Pada menu kendala merupakan sebuah halaman tanya jawab untuk member yang mengalami kendala perawatan.

d. Pada menu logout merupakan akhir dari kegiatan member. Disarankan untuk member melakukan logout sistem pada saat selesai melakukan

maintenance alat proteksi kebakaran, sehingga dapat memberikan

(71)

4.4.9 Form Halaman Maintenance ( Perawatan )

Pada form maintenance ini merupakan kegiatan inti dari sistem manajemen proteksi kebakaran terpadu. Dapat dilihat pada gambar 4.12 di bawah ini.

Gambar 4.12 Form Halaman Maintenance ( Perawatan )

Pada halaman maintenance di atas, dimana pada kegiatan ini pihak

member akan mengisi keseluruhan form sesuai dengan komponen setiap alat

proteksi kebakaran yang terdapat pada gedungnya. Sebelum kegiatan maintenance

(72)

4.4.10 Form Halaman Kendala ( Forum Tanya J awab )

Halaman kendala merupakan fasilitas yang disediakan untuk para

member agar dapat memberikan informasi seputar kendala yang dialaminya saat

melakukan kegiatan maintenance yang nantinya dapat dijawab langsung oleh admin website. Dapat dilihat pada gambar 4.13 di bawah ini.

Gambar 4.13 Form Halaman Kendala ( Forum Tanya Jawab )

Pada halaman kendala di atas juga dapat dikatakan sebagai halaman forum para member, dikarenakan pada saat salah satu dari member memberikan informasi pertanyaan seputar kendala, member yang lainnya dapat memberikan jawaban ataupun saran kepada member tersebut.

4.4.11 Halaman Data Setiap Member

(73)

Gambar 4.14 Halaman Data Setiap Member

Data yang terdapat pada halaman ini yaitu seluruh data perawatan yang dimiliki oleh setiap member. Pada halaman ini terdapat kolom status pada tabel data yang artinya jika pada kolom status tertera tulisan “proses” maka data yang telah dikirim oleh member belum di berikan hasil oleh admin (pihak CV. Inti Keselamtan) dan apabila pada kolom status tertera tulisan “sudah ada hasil”, maka data yan sudah dikirim oleh member sudah diberi hasil oleh admin.

4.4.12 Halaman Cetak Data Setiap Member

(74)

Gambar 4.15 Halaman Cetak Data Setiap Member

Pada halaman cetak data di atas merupakan hasil maintenance yang dilakukan oleh member. Pada dasarnya data yang terdapat pada halaman tersebut sudah tertera nama perusahaan, alamat serta tanggal kegiatan maintenance Yang dilakukan oleh member tersebut.

Apabila member memerlukan data yang berupa hardcopy, maka member

dapat memilih menu yang terdapat pada kanan pojok yang tertuliskan “cetak”. Setelah memilih cetak, member akan diarahkan oleh sistem untuk mencetak atau menyimpan data dalam bentuk pdf sesuai dengan keinginan. Data yang akan dicetak sama dengan tampilan pada halaman cetak data setiap member.

4.4.13 Halaman Login Admin

(75)

Gambar 4.16 Halaman Login Admin

Pada halaman login admin diatas dijelaskan bahwa halaman yang ditujukan untuk seorang admin website, apabila akun username dan password

yang diisikan merupakan akun dari member secara otomatis sistem akan memberi peringatan berupa hak authentikasi yang artinya pada halaman setelah login tidak dapat diakses oleh user yang tidak mempunyai akun sebagai admin.

4.4.14 Halaman Kelola Member

Pada dasarnya halaman ini dikhususkan untuk kegiatan admin, dimana pada halaman kelola member admin nantinya dapat melihat profil dari member

(76)

Gambar 4.17 Halaman Kelola Member

Pada halaman kelola member diatas terdapat kolom yang memberikan informasi rahasia kepada admin yaitu pada kolom password, sehingga apabila terjadi hal yang tidak memungkinkan data tersebut masih cukup aman. Pada halaman kelola member admin dapat melakukan hapus untuk data member yang sudah tidak lagi aktif pada sistem manajemen proteksi kebakaran terpadu.

4.4.15 Halaman Kelola Data dan Hasil Maintenance

(77)

Gambar 4.18 Halaman Kelola Data Maintenance

Pada halaman kelola member admin dapat melakukan hapus untuk data

maintenance member yang sudah lama. Apabila admin akan melakukan hapus

data, sistem akan secara otomatis memberikan informasi “apakah yakin mengahapus data” atau tidak.

Pada halaman ini juga terdapat pilihan cetak pada setiap data yang dipilh oleh admin. Apabila terdapat data baru yang masuk pada halaman ini, secara otomatis data akan tertera pada tabel tersebut, sehinnga nantinya admin dapat melakukan melakukan pengisian dari hasil maintenance yang dilakukan oleh

member.

(78)

contoh halaman pengisian hasil dapat dilihat pada gambar 4.19 di bawah ini.

Gambar 4.19 Halaman Kelola Data dan Hasil Maintenance

Pada gambar di atas, admin dapat memberikan hasil maintenance pada kolom “hasil perawatan, bulan perawatan dan catatan”. Khusus untuk kolom bulan perawatan nantinya tidak akan ditampilkan pada halaman member

dikarenakan kolom tersebut hanya sebagai data untuk pengisian laporan diagram pimpinan.

4.4.16 Halaman Kelola Data Kendala

(79)

Gambar 4.20 Halaman Kelola Data Kendala

Pada gambar 4.18 menjelaskan bahwa admin dapat melihat informasi data pertanyaan yang terdapat dalam database serta member yang melakukan pertanyaan, sehingga nantinya admin dapat memberikan solusi terhadap kendala yang dialami oleh member tersebut.

Pada menu kendala juga terdapat halaman untuk menjawab pertanyaan dari member. Pada halaman jawaban terdapat semua list pertanyaan, apabila admin ingin menjawab pertanyaan diharuskan terlebih dahulu untuk memilih menu detail, sehingga admin dapat melihat seluruh jawaban dari petanyaan tersebut serta dapat menuliskan jawabannya pada pilhan “jawab”.

4.4.17 Halaman Kelola Data Pesan Pengunjung

(80)

Dapat dilihat pada gambar 4.21 di bawah ini.

Gambar 4.21 Halaman Kelola Data Pesan Pengunjung

Pada halaman data pesan di atas, admin juga dapat melakukan balasan dari pertanyaan pengunjung ke email yang terdapat pada data pesan pengunjung serta admin juga dapat melakukan hapus data.

4.4.18 Halaman Login Pimpinan

(81)

Gambar 4.22 Halaman Login Pimpinan

Kesimpulan dari gambar di atas yaitu setiap user yang akan masuk ke dalam sistem yang dituju harus mempunyai akun username dan password yang berbeda-beda seperti pada halaman login pimpinan tersebut. Username dan

password yang didapat oleh pimpinan merupakan hasil registrasi dengan hak

akses level pertama yang diterapkan oleh sistem.

4.4.19 Halaman Beranda Pimpinan

(82)

dilihat oleh pimpinan. Dapat dilihat pada gambar 4.23 sebagai berikut.

Gambar 4.23 Halaman Beranda Pimpinan

4.4.20 Tampilan Diagram Laporan Maintenance

Dalam halaman diagram laporan, hak akses hanya diberikan kepada pimpinan saja. Pada halaman ini keseluruhan data dari para member berbentuk diagram batang yang perhitungannya berdasarkan jumlah perawatan per bulannya.

Data diagram merujuk pada informasi kelayakan alat yang diukur dengan persentasi berapa persen (%). Kesimpulannya pada setiap bulan ada berapa perusahaan yang mendapatkan hasil di bawah 50% untuk setiap alat perlindungan bahaya kebakaran yang dimilikinya.

(83)

Gambar 4.24 Tampilan Diagram Laporan Maintenance

4.5 Skenario Uji Coba

Uji coba perlu dilakukan untuk mengetahui kelebihan, kekurangan, serta menguji apakah semua sistem yang dibuat telah berfungsi.

4.5.1 Form Registrasi Member

(84)

Member harus mengisi form dengan data yang benar dan tidak boleh ada yang kosong, serta mengisi capcha lalu klik daftar. Berikut ini gambar jika sukses melakukan pendaftaran.

Gambar 4.26 Uji Coba Jika Registrasi Berhasil

Sedangkan jika sebelumnya username sudah pernah didaftarkan atau sama dengan member lain, maka akan keluar peringatan seperti gambar di bawah ini.

(85)

Pada uji coba registrasi gagal di atas, secara otomatis sistem akan memberikan peringatan serta data yang sudah terisi tidak akan tersimpan ke dalam database.

4.5.2 Uji Coba Maintenance

Setelah masuk pada halaman beranda ( member ), kemudian

member akan melakukan maintenance ( perawatan ) pada sistem proteksi.

Pada form maintenance setiap data harus diisi oleh member, sehingga sesuai dengan prosedur perawatan yang ada. Setelah selesai klik kirim agar tersimpan dalam sistem database. Dapat dilihat pada gambar 4.28 di bawah ini.

Gambar 4.28 Uji Coba Maintenance

(86)

diarahkan secara otomatis pada form maintenance yang lainnya sampai pada halaman form maintenance yang terakhir.

Sedangkan pada saat pengisian form maintenance data tidak lengkap maka akan muncul peringatan “data harus diisi”, dikarenakan data pada form tersebut merupakan data yang wajib diisi sesuai dengan prosedur yang ada. Apabila terdapat data yang tidak lengkap sistem tidak akan menyimpan data ke dalam database serta member di haruskan mengisi data kembali mulai dari awal. Data yang diisikan secara benar oleh member, nantinya akan diproses dan dapat memberikan informasi terhadap admin untuk dilakukannya pengakjian untuk kehandalan alat proteksi kebakaran. Dapat dilihat pada gambar 4.29 di bawah ini.

(87)

4.5.3 Uji Coba Kendala

Pada tahap ini member akan melakukan pengisian pada Cleditor sebelum mengirimkan pertanyaan kendala yang mereka alami, kemudian klik “create” untuk mengirim pertanyaan atau “kembali” untuk ke halaman sebelumnya. Pada halaman ini member diberikan fasilitas yang seperti microsoft office untuk menulis pertanyaannya, dimana pada lembar kerja ini bisa membuat suatu tulisan berhuruf tebal, huruf miring dll.

Pada halaman tulis pertanyaan ini pada dasarnya sama dengan halaman untuk tulis jawaban. Maka dari itu penulis hanya menjelaskan dan menampilkan halaman tulis pertanyaan ini. Dapat dilihat pada gambar 4.30 di bawah ini.

(88)

Apabila data pertanyaan member terkirim, secara otomatis pertanyaan tersebut muncul pada halaman utama kendala. Pada halaman kendala setiap pertanyaan terdapat menu detail, apabila menu detail tersebut diklik oleh member secara otomatis sistem akan langsung mengarahkan pada halaman jawaban yang sudah terdapat beberapa jawaban dari member lain maupun dari admin sistem manajemen proteksi kebakaran terpadu ini. Fasilitas detail diberikan pada setiap pertanyaan, sehingga member tidak kesulitan untuk membaca pertanyaan maupun jawaban yang ada. Dapat dilihat pada gambar 4.31 di bawah ini.

Gambar 4.31 Hasil Pertanyaan ( Kendala )

4.5.4 Uji Coba Pesan ( Pengunjung )

(89)

untuk pengunjung ( bukan member ), dimana halaman ini terdapat kolom yang meminta pengunjung untuk mengisikan nama, email, judul pesan dan isi pesan apabila para pengunjung mempunyai pertanyaan, saran maupun kritikan kepada pihak CV. Inti Keselamatan.

Pada form pesan ini data harus lengkap dikarenakan nantinya admin dapat mengetahui identitas pengirim pesan, sehingga admin dapay membalas pertanyaan berupa pesan dari para pengunjung. Apabila data tidak lengkap secara otomatis sistem tidak akan menyimpan data. Dapat dilihat pada gambar 4.32 di bawah ini.

Gambar 4.32 Uji Coba Pesan ( Pengunjung )

4.5.5 Uji Coba Icon Hapus ( admin )

(90)

dasarnya semua halaman mempunyai icon hapus untuk menghapus data yang hanya dapat dilakukan oleh admin sesuai dengan prosedurnya. Seperti gambar di bawah ini.

Gambar 4.33 Icon Hapus

Apabila admin melakukan kegiatan hapus, sistem secara otomatis akan mengirim ulang berupa pertanyaan untuk mengkonfirmasikan lagi apakah data tersebut yakin dihapus atau tidak. Seperti gambar berikut

(91)

4.6 Uji Validitas (Korelasi Pear son)

Subyek = Pada Perusahaan CV. Inti Keselamatan

Obyek = Responden ( Mahasiswa dan Karyawan )

Sampel = 30 Lembar dan 10 Pertanyaan

Teknik pengambilan sampel = Simple Random Sampling

Teknik Penskalaan = Linkert Scale, dengan skor 1 s/d 5 dengan contoh sebagai berikut:

1 = Sangat Tidak Bagus 3 = Bagus

2 = Tidak Bagus 4 = Sangat Bagus

Hasil perhitungan menggunakan R tabel, yaitu membandingkan nilai Pearson Correlation (baris pertama masing-masing indikator) dengan nilai R yang terdapat pada Tabel, di mana nilai R untuk sampel sebanyak 30 pada taraf 5% adalah sebesar 0,361.

Dengan demikian tampak bahwa item2, item3, item5, item9 dan item10

Figur

Gambar 3.1 Flowchart Aktivasi Member
Gambar 3 1 Flowchart Aktivasi Member . View in document p.34
Gambar 3.3 Flowchart Aktivasi Pimpinan
Gambar 3 3 Flowchart Aktivasi Pimpinan . View in document p.36
Gambar 3.4 Use Case Diagram Sistem Manajemen Proteksi Kebakaran Terpadu
Gambar 3 4 Use Case Diagram Sistem Manajemen Proteksi Kebakaran Terpadu . View in document p.38
Gambar 3.5 Activity Diagram Untuk Member
Gambar 3 5 Activity Diagram Untuk Member . View in document p.39
Gambar 3.6 Activity Registrasi Member
Gambar 3 6 Activity Registrasi Member . View in document p.40
tabel data
tabel data . View in document p.45
Gambar 4.1 Database Web
Gambar 4 1 Database Web . View in document p.59
Gambar 4.2 Pembuatan Desain Member
Gambar 4 2 Pembuatan Desain Member . View in document p.60
Gambar 4.3 Pembuatan Desain Admin
Gambar 4 3 Pembuatan Desain Admin . View in document p.60
Gambar 4.4 Halaman Utama (Beranda)
Gambar 4 4 Halaman Utama Beranda . View in document p.63
Gambar 4.5 Halaman Layanan
Gambar 4 5 Halaman Layanan . View in document p.64
Gambar 4.6 Halaman Galeri
Gambar 4 6 Halaman Galeri . View in document p.65
Gambar 4.7 Halaman Profil
Gambar 4 7 Halaman Profil . View in document p.66
Gambar 4.8 Form Halaman Hubungi Kami
Gambar 4 8 Form Halaman Hubungi Kami . View in document p.67
Gambar 4.9 Form Halaman Regsitrasi Member
Gambar 4 9 Form Halaman Regsitrasi Member . View in document p.68
Gambar 4.10 Halaman Login Member
Gambar 4 10 Halaman Login Member . View in document p.69
Gambar 4.11 Halaman Beranda( member )
Gambar 4 11 Halaman Beranda member . View in document p.70
Gambar 4.12 Form Halaman Maintenance ( Perawatan )
Gambar 4 12 Form Halaman Maintenance Perawatan . View in document p.71
Gambar 4.14 Halaman Data Setiap Member
Gambar 4 14 Halaman Data Setiap Member . View in document p.73
Gambar 4.15 Halaman Cetak Data Setiap Member
Gambar 4 15 Halaman Cetak Data Setiap Member . View in document p.74
Gambar 4.16 Halaman Login Admin
Gambar 4 16 Halaman Login Admin . View in document p.75
Gambar 4.17 Halaman Kelola Member
Gambar 4 17 Halaman Kelola Member . View in document p.76
Gambar 4.18 Halaman Kelola Data Maintenance
Gambar 4 18 Halaman Kelola Data Maintenance . View in document p.77
Gambar 4.19 Halaman Kelola Data dan Hasil Maintenance
Gambar 4 19 Halaman Kelola Data dan Hasil Maintenance . View in document p.78
Gambar 4.20 Halaman Kelola Data Kendala
Gambar 4 20 Halaman Kelola Data Kendala . View in document p.79
Gambar 4.21 Halaman Kelola Data Pesan Pengunjung
Gambar 4 21 Halaman Kelola Data Pesan Pengunjung . View in document p.80
Gambar 4.22 Halaman Login Pimpinan
Gambar 4 22 Halaman Login Pimpinan . View in document p.81
Gambar 4.23 Halaman Beranda Pimpinan
Gambar 4 23 Halaman Beranda Pimpinan . View in document p.82
Gambar 4.25 Uji Coba Registrasi
Gambar 4 25 Uji Coba Registrasi . View in document p.83
Gambar 4.28 Uji Coba Maintenance
Gambar 4 28 Uji Coba Maintenance . View in document p.85

Referensi

Memperbarui...