37
BAB III PERANCANGAN DAN PEMBUATAN ALAT 3.1. Block Diagram dari Konfigurasi System
Button Verifikasi
Gambar.3.1. Block Diagram System Dari Block Diagram System yang telah dirancang, Ada beberapa bagian utama dalam perancangan system ini yaitu: 1. Perancangan System Device 2. Perancangan System Webserver 3. Perancangan System Database Sebagaimana 3 system ini terlebih dahulu dirancang satu – persatu agar mempermudah dalam pembuatan alat dan system.
38
3.2. Persiapan Perancangan Alat Perancanagan Alat ini membutuhkan alat – alat pendukung sebagai berikut: Tabel 3.1. NO 1 2 3 4 6 7 8 9 10 11 12 13 14 15 16 17
Tabel Komponen Hardware
Sisi Hardware Arduino UnoR3 + kabel data Module Ethernet Arduino Shield Kabel LAN (RJ45) Led Hijau Resitor 10 kohm – ¼ watt Tansistor BC547 Dioda 1N4148 PCB Polos Ferit Clorit Plastik transparan Fan 12 Volt MQ-2 Sensor Asap Switch Magnetic LM35DZ Sensor Suhu Relay 5 pin, 5 volt Pin header 20 pin
Tabel 3.2. Bahan- bahan Sisi Software NO 1 2 3 4 5 6
Sisi Software Arduino IDE software Visual Basic 6 Xampp 1.7.7 Adobe Dreamweaver CS5 PHP Designer Wireshark 1.10.2
3.3.Perancangan System Device Pada perancangan system device ini terdapat 2 bagian utama yaitu: 1. Perancangan System Device Bagian Hardware 2. Perancangan System Device Bagaian Software
Quatity 1 1 1 Meter 1 4 2 2 1 1 1 1 1 1 4 2 5
39
Dari point diatas, maka akan dapat dirancang system device dari sisi hardware dan bagian softwarenya. 3.3.1. Perancangan System Device Bagian Hardware Untuk Pembuatan system device bagian hadrware maka yang perlu dilakukan adalah a. Perancangan dan pembuatan Rangkaian Sensor Suhu dan Sensor Asap b. Perancangan dan pembuatan Rangkaian Sensor Pintu c. Perancangan dan pembuatan Rangkaian Controller Fan d. Perancangan dan pembuatan Rangkaian Buzzer Alarm dan Button Verifikasi Dari uraian diatas dapat dirancang simulasi dan pembuatan Wiring Diagramnya menggunakan Proteus :
Gambar.3.2. Wiring Diagram Dengan membuat simulasi rangkaian diatas dengan proteus ini akan menghemat efisiensi perancangan sehingga lebih fleksibel dan efektif. Yang mana
40
rangkaian yang dismulasi nanti-nya akan diterapkan dengan pembuatan alatnya. Yaitu pada design circuit untuk dapat diterapkan, simulasi akan dijalankan sesuai program arduino yang diinginkan, dan setelah mendapatkan hasil yang baik dengan simulasi maka akan dilakukan penerapan simulasi ke design-an circuit alat, berikut adalah design circuit Pcb eguard arduino shield menggunakan Eagle yang kompatibel dengan Arduino Uno :
Gambar.3.3. Sirkuit Eguard Arduino Shield Dari circuit diatas dihasilkan layout nya sebagai berikut:
41
Gambar.3.4. Layout tampak bawah
Gambar.3.5. Print out Layout Eguard Arduino Shield
Gambar.3.6. Tata Letak Komponen Eguard Arduino Shield Proses layout gambar ke pcb:
42
Hasil design layout eagle yang telah dibuat, diprint dengan kertas plastik transparant dan menggunakan printer laser jet. Berikut gambar nya:
Gambar.3.7. Hasil Layout pada transfer paper Teknik yang digunakan yaitu teknik sablon ke PCB dengan langkah sebagai berikut: Hasil print disablon dengan menggunakan strika. Setelah beberapa lama distrika hasil layout tinta hitamnya akan pindah ke PCB. Dan melakukan koreksi terhadap jalur yang putus. Proses selanjutnya Etching PCB yaitu melarutkan tembaga yang tidak tertutup tinta toner dengan ferit cloride (FeCl3). Mencampurkan ferit cloride dengan air dan masukan pcb yang sudah disablon, aduk secara menyearah sampai tembaga yang tidak tertutup tinta menghilang (habis). Hasil Setelah Proses etching pcb dapat diihat seperti gambar dibawah ini: Langkah selanjutnya pengeboran PCB dengan mini drill dengan mata bor 0.8mm Setelah proses pengeboran maka komponen dapat dipasang dan disolder sesuai dengan gambar layout yang didesain dengan eagle. 3.3.2. Perancangan System Device Bagian Software
43
Untuk pembuatan program arduino maka akan digunakan softrware Arduino IDE 1.0.5. berikut flowchart program yang akan dibuat:
Gambar.3.8. Flowchart I
44
Gambar.3.9. Flowchart II
Gambar.3.10. Flowchart III
45
Gambar.3.11. Flowchart IV Pembuatan Source Code Eguard arduino ada beberapa bagian penting yaitu: 1. Source code untuk sensor suhu detektor Berikut adalah potongan Source code fungsi check_suhu:
Funsi ini merupakan hasil kalkulasi ouput data analog LM35 dikonvert ke data celcius (˚C).
Jika temperatur naik diatas 35.0 ˚C maka alarm akan bunyi, fan akan nyala dan mengirimkan udp message suhu ke Server dan apabila suhu sudah normal kembali maka alarm off, fan off dan kirim udp message suhu sudah normal ke server
2. Source code untuk sensor Smoke detektor Berikut adalah potongan Source code fungsi check_asap:
46
Kalkulasi output data analog MQ-2 ke Intesitas udara (volume air)
If vol > 0.9 yang artinya ada asap, maka fan nyala,dan kirim udp message ke server
If vol < 0.8 yang artinya udara sudah normal, maka fan mati,dan kirim udp message ke server
3. Source code untuk sensor Pintu detektor dengan Fungsi check_pintu
Jika Pintu dibuka maka kirim data udp message. Dan Loop hingga tombol_verify == Low (tidak ditekan) dan bunyi kan alarm. Counter++ hingga 50 maka kirim Udp message Alarm ke server
47
4. Source code untuk sensor Fan dengan fungsi fan_controller
Cara memanggil fungsi ini dengan cara:
48
Menyalakan Fan dengan syntax :
Mematikan Fan dengan syntax :
5. Source code untuk kirim data message ke Server dengan fungsi udp_sendmessage:
Cara memanggil fungsi ini dengan sintax:
ID Perangkat
Kode sensor
Message Sensor
Status Confirm
Dari format udp message diatas, akan diterima server dengan data array (device_id, kode_sensor, message, status confirm). Berikut contoh bentuk data pengiriman via udp dari e-guard ke server udp menggunakan software “WireShark”.
49
Gambar.3.12. Capture wireshark paket UDP Perancangan System UDP Message Server Dalam perancangan system UDP message server ini menggunakan bahasa pemprograman VB 6, dengan menggunakan fitur winsock yangtelah tersedia pada VB. Berikut Design Form nya:
Gambar.3.13. Form UDP Receive
50
Configurasi koneksi ke Mysql :
51
3.4. Perancangan System Webserver Dalam perancangan webserver yaitu menggunakan Xampp 1.7.7 untuk windows xp, pembuatan webserver dengan Xampp sebagai berikut: Menginstal xampp versi 1.7.7 menjalankan xampp dengan cara :
Gambar.3.14. Running program Xampp 1.7.7 Maka akan muncul tampilan sebagai berikut:
52
Gambar.3.15. Running program Xampp 1.7.7 memastikan Apache running dan SVC nya dichecklist, dan setelah itu buka pada browser dengan mengketik “localhost”. Maka akan muncul tampilan sebagai berikut:
Gambar.3.16. Tampilan Xampp Jika ini sudah berhasil apache server nya sudah running dengan Normal. 3.5. Perancangan System Database Pada perancangan System database dilakukan perancangan system yang dapat terintergrasi dengan perangkat yaitu antara arduino, webserver dan database. Berikut blok alur pengiriman paket dari perangkat hingga sampai masuk kedalam database.
53
Paket UDP dikirim dari Arduino
UDP Server menerima paket nya dengan status mode “Listen” pada Port:420
Koneksi aplikasi dengan database
Jika paket yang dikirim berisi data status “C”
Lakukan verifikasi
Verifikasi ID device yang terdapat dalam paket UDP
Tidak valid
Abaikan
Query “insert” data message sensor pada tabel log_monitoring
Check data status sensor If(status==“O”)
Data paket udp telah disimpan didatabase
No
yes
Abaikan
Data status sensor yang telah ada pada database diupdate menjadi “C”
Query “Update” data status jadi “C”
Gambar.3.17. Blok Diagram Perancangan System Database Dari alur yang telah dirancang maka diperlukan perancangan data diagram database yang akan dibuat yaitu relasi antar tabel berikut diagram tabel nya: Master BTS PK
no_id alamat mac_address ip_address
log_monitoring PK,FK1
datetime message status sensor ip_address log_info
login PK
no_id
id
log_alarm PK,FK1,FK2 no_id datetime message status ip_address log_info
log_fan PK,FK1,FK2 no_id datetime message status ip_address log_info
user_name password level log_asap PK,FK1,FK2 no_id datetime message status ip_address log_info
log_dor PK,FK1,FK2 no_id datetime message status ip_address log_info
Gambar.3.18. Data Diagram Database System
log_suhu PK,FK1,FK2 no_id datetime message status ip_address log_info
54
Pada pembuatan database mysql, dapat menggunakan Tool untuk mempermudah pengerjaan yaitu menggunakan Navicat for MySQL, berikut Tampilan awal nya:
Gambar.3.19. Tampilan Awal Navicat for Mysql Untuk membuat database sesuai dengan System yang akan dibuat yaitu dengan cara berikut:
Settingan connection sebagai berikut:
Gambar.3.20. Setting Connection
Test koneksi dengan cara click “Test Connection” untuk men- test koneksi dengan mysql, jika koneksi sukses, tekan “OK”
55
Membuat database baru dengan mengclick kanan connection yang telah dibuat tadi seperti gambar berikut:
Gambar.3.21. Create New Database
Maka akan muncul window “Create New Database” dan Isi field sebagai berikut:
Gambar.3.22. Enter Database name
Lalu tekan “OK”
Setelah membuat new database maka langkah selanjutnya membuat tabel cara nya sebagai berikut:
56
Gambar.3.23. Create Table Berikut tabel-tabel system eguard berserta nama kolom,type data, panjang dan indexnya : a. Tabel “log_alarm”,”log_asap”,”log_bateray”,”log_dor”,”log_suhu”,”log_power” dan “log_fan”
Gambar.3.24. log semua sensor
57
b. Tabel “log_monitoring”
Gambar.3.25. Log monitoring c. Table “master_bts”
Gambar.3.26. Master BTS d. Table “login”
Gambar.3.27. Login
3.6.
Pembuatan Design Web a. Form Login
58
Gambar.3.28. Tampilan Awal Web Berikut diatas adalah form login user yang akan mengakses eguard system, user yang telah teregistrasi maka akan dapat melewati form ini dengan menekan tombol “GO”, untuk database login nya sebagai berikut: Nama table : login Field – field nya sebagai berikut:
Gambar.3.29. Field setting Agar koneksi php dengan mysql dapat terhubung maka akan dibuat script koneksi dengan nama file config.php, berikut scriptnya:
59
Untuk script login.php nya sebagai berikut:
60
b. Form Master Site:
Gambar.3.30. Halaman Master Site Form Master site berfungsi sebagai data entry untuk Master data pada eguard yang terpasang di setiap site. Untuk bagian database table diberi nama: “master_bts” dan field – fieldnya sebagai berikut:
Gambar.3.31. Field Master Site
61
Gambar.3.32. Halaman Home
Gambar.3.33. Halaman Monitoring View
62
Form Monitoring View
berfungsi untuk menampilkan data monitoring yang
bermasalah untuk disetiap site. Yang mana flowchart nya sebagai berikut :
Gambar.3.34. Flowchart Monitoring view Dari flowchart dapat dimengerti alur dari kerja monitoring view , javascript akan melakukan timer 1 s dengan mengeksekusi check_query.php yang mana berfungsi untuk mendapatkan hasil banyak row yang statusnya “O” dalam Table Log_monitoring, jika session($data_rec) tidak sama (sintaxnya: != ) dengan $data yang isi nya hasil dari query sql “Count” (sintaks menghitung banyak record) pada table “log_monitoring” yang status nya : “O”. Maka akan dilakukan reload page jika ($dat_rec != $data). Berikut Potongan source check_query.php:
63
Check_query.php ini berfungsi sebagai pencari didatabase table log_monitoring yang berstatus “O” (Open), jika ada yang berstatus OPEN maka akan dilakukan reload page monitoring view.. dan data yang terupdate akan muncul dimonitoring view.
