HALAMAN SAMPUL

DIGITAL RAIN CLIMATE MEASUREMENT

PIRANTI CERDAS, SISTEM BENAM DAN IOT

DELTRO BOYS

Anggota 1 Andi Ray Hutauruk 012005_14S15013

Anggota 2 Alfonso Parningotan Gultom 012005_14S15030

Anggota 3 Pangeran Aritonang 012005_14S15053

 LATAR BELAKANG
Negara Indonesia merupakan negara agraris yang berarti negara yang mengandalkan sektor
pertanian baik sebagai mata pencaharian maupun sebagai penopang pembangunan. Pertanian
merupakan salah satu sektor yang sangat dominan dalam pendapatan masyarakat di Indonesia karena
mayoritas penduduk Indonesia bekerja sebagai petani. Pembangunan pertanian di Indonesia di
anggap penting dari keseluruhan pembangunan nasional. Beberapa hal yang mendasari pembangunan
pertanian di Indonesia mempunyai peranan penting, antara lain; potensi sumber daya alam yang besar
dan beragam, potensi terhadap pendapatan nasional yang cukup besar, potensi terhadap ekspor
nasinal, besarnya penduduk Indonesia yang menggantungkan hidupnya pada sektor ini, perannya
dalam penyediaan pangan masyarakat dan menjadi basis pertumbuhan di pedesaan.
Potensi pertanian Indonesia yang besar namun pemberdayaannya masih kurang diperhatikan oleh
pemerintah. Hal ini dapat dilihat dari masih kurangnya sarana dan prasana yang disediakan. Salah
satu hal yang perlu diperhatikan adalah persiapan dan kesiapan para petani akan kondisi iklim dan
cuaca di Indonesia. Kondisi cuaca terkadang sulit untuk diprediksi membuat para petani mengalami
kesulitan untuk menentukan masa tanam dan masa panen tanamannya.
Hujan memainkan peranan penting dalam siklus hidrologi. Hujan merupakan suatu bentuk
peristiwa uap air yang berasal dari awan yang ada di atmosfer. Lembaban dari laut menguap, berubah
menjadi awan, terkumpul menjadi awan mendung, lalu turun kembali ke bumi dan akhirnya kembali
ke laut. Curah hujan sangat penting diketahui dalam sector pertanian karena curah hujan dapat
menentukan ketersediaan air bagi tanaman di suatu daerah. Oleh sebab itu, diperlukannya sebagian
alat ukur curah hujan yang akurat agar petani dapat menentukan masa tanam dan masa panen
tanamannya.
Pengukuran curah hujan secara luas digunakan untuk perkiraan cuaca, konservasi air dan
mengetahui informasi kualitas tanah serta wilayah yang akan dilanda hujan. Data pengukuran dapat
digunakan oleh petani sebagai salah satu referensi untuk melakukan tindakan pencegahan ataupun
tindakan persiapan terhadap tanaman. Berdasarkan data yang didapat, tingginya intensitas curah
hujan berdampak pada banjir, tanah longsor maupun gagal panen.
Oleh karena itu diperlukan sebuah alat atau perangkat yang mampu memberikan informasi tentang
keadaan iklim dan cuaca, seperti data hasil pengukuran curah hujan, pengukuran pH, pengukuran
suhu dan kelembaban. Dengan bantuan pengukuran alat ukur ini, diharapkan dapat menghitung dan
memperkirakan berbagai parameter yang dapat meningkatkan keuntungan di sektor meteorologi
maupun di sektor pertanian. Seperti yang diketahui, saat ini sudah terdapat banyak alat untuk
mengukur curah hujan, contohnya seperti tipe tipping bucket, tipe yang menggunakan pelampung dan
sebagainya.
 Namun, untuk hal ini akan dibuat sebuah alat atau perangkat yang mampu untuk menyediakan
informasi tentang pengukuran tersebut secara otomatis dan digital. Untuk perangkatnya sendiri
menggunakan sensor ultrasonik sebagai alat ukur pengukuran curah hujan dan menggunakan sensor
pH, kelembaban dan suhu sebagai fitur tambahan dari alat atau perangkat. Selain itu, perangkat ini
juga dilengkapi dengan modul GPS yang digunakan untuk memetakan wilayah, sehingga alat dapat
di-monitoring keadaan beserta lokasi pengukurannya (penggunaan modul GPS ini opsional pada
sistem). Untuk sistem pengiriman data-nya perangkat ini menggunakan jaringan WiFi kemudian data
atau informasi dikirimkan secara langsung dari perangkat ke sebuah halaman internet (website)
maupun aplikasi mobile. Data atau informasi akan tersimpan secara otomatis, sehingga memudahkan
pengguna mendapatkan data yang dibutuhkan. Diharapkan pengembangan alat ini kedapannya dapat
memicu minat terhadap ilmu instrumentasi, sistem kendali, pengolahan data, dan robotika.
 TUJUAN DAN MANFAAT
A. Tujuan
Adapun tujuan dari proposal ini adalah:
1. Tidak hanya digunakan untuk mengukur tingkat curah hujan, tetapi dapat juga digunakan
untuk mengukur suhu dan kelembaban serta pengukuruan tingkat kualitas air hujan
2. Mengolah data yang didapat oleh sensor dalam bentuk digital sehingga hasil pengukuran
yang didapatkan dengan mudah ditampilkan/dikirim ke pengguna
3. Menggunakan metode pengumpulan daya secara real time, sehingga pengukuran dan
pengamatan dapat dilakukan secara terus-menerus
4. Menampilkan data hasil pengukuran melalui halaman web dan aplikasi mobile untuk
memantau atau mengukur keadaan yang terjadi di lingkungan sekitar dan memiliki
database online untuk menyimpan data hasil pengukuran setiap hari
5. Memiliki antarmuka pengguna yang interaktif dan intuitif sehingga pengguna dapat
dengan mudah membaca dan menganalisa hasil pengukuran dari produk ini.
B. Manfaat
Adapun manfaat dari proposal ini adalah:
1. Memudahkan petani untuk mengetahui curah hujan
2. Memudahkan petani untuk mengetahui masa tanam dan masa panen
3. Membantu Badan Meteorologi dan Geofisika (BMG) untuk melakukan pengukuran untur-
unsur cuaca/iklim
4. Membantu memberikan informasi mengenai kondisi dan parameter dalam penerbangan
5. Memprediksi dan memberi peringatan dini kepada warga mengenai gejala alam.
 METODE DAN DESAIN
A. Metode
1. Prosedur pengujian
Cara menverifikasi modul sensor ultrasonik sebagai alat pengukur ketinggian air
adalah dengan memberikan input masukan sensor ultrasonik secara berubah-ubah, jika
didapatkan hasil yang berubah maka dipastikan sensor telah terverifikasi.
Cara menverifikasi modul sensor pH adalah dengan memberikan larutan aquades ke
sensor tersebut, jika respon sensor menampilkan pH = 7 maka, sensor pH telah
terverifikasi.
Cara memverifikasi modul pengukuran temperatur dan kelembaban adalah dengan
dengan memberikan suhu dan kelembaban yang berubah-ubah, jika didapatkan hasil
pengukuran sensor mengalami perubahan sesuai dengan perubahan masukan pada sensor,
maka dapat dipastikan sensor temperatur dan kelembaban telah terverifikasi.
Proses verifikasi modul GPS pada produk adalah dengan memberikan perubahan
posisi terhadap modul GPS tersebut, jika didapatkan hasil pemetaan mengalami
perubahan maka dapat dipastikan bahwa modul GPS tersebut telah terverifikasi.
Proses verifikasi modul antarmuka pengguna adalah dengan melakukan refresh
tampilan pada webpage. Jika didapatkan perubahan hasil pengukuran untuk setiap sensor,
maka dapat dipastikan bahwa verifikasi modul antar muka pengguna telah selesai.
2. Analisis Toleransi
Analisis toleransi dapat dilakukan dengan memberikan kondisi sedikit di luar dari
spesifikasi kondisi yang dimiliki oleh sistem. Dengan demikian, akan dihasilkan respon
sistem yang dapat dianalisis seberapa jauh sistem memiliki toleransi terhadap kondisi yang
tidak sesuai dengan spesifikasinya.
3. Pelaksanan Pengujian
Pengujian dilakukan pada wilayah yang memungkinkan semua fitur pada produk ini
diuji. Pengujian dilakukan berulang-ulang pada waktu yang berbeda. Semua hasil
pengujian kemudian dianalisis.
B. Desain
1. Defini Sistem dan Subsistem
Sistem Digital Rain Climate Measurement ini terdiri atas tiga subsistem utama yang
akan dijelaskan kemudian. Sistem memiliki input yang berasal dari sensor dan posisi.
Sistem ini memiliki output berupa data hasil pengukuran yang akan di transmisikan
ke dalam website setiap saat kemudian data dilanjutkan ke media penyimpanan (database)
dan kemudian ditampilkan hasil pengukuran secara real time.
 Berikut ini diagram konteks sistem atau disebut juga data flow diagram tingkat nol
dari sistem.

Parameter Keterangan
Input • Konfigurasi yang diberikan oleh pengguna untuk mengoperasikan sistem.
• Pengukuran curah hujan dan kualitas air serta posisi dari sensor yang
diakuisisi ke dalam sistem.
Output • Hasil pengukuran sensor, status dari posisi, dan pengukuran yang telah
diukur ditampilkan pada pengguna.
• Hasil pengukuran dapat disimpan ke media penyimpan online (database).
• Hasil pengolahan data dari sistem akan ditransmisikan tanpa kabel melalui
platform cloud computing sebelum ditampilkan ke pengguna.
Fungsi • Menampilkan menu berupa graphical user interface kepada pengguna
sehingga pengguna dapat melakukan konfigurasi terhadap sistem, memeriksa
status sistem, dan melihat hasil akuisisi dan hasil pengolahan sensor yang
dilakukan oleh sistem.
• Melakukan akuisisi sensor ultrasonik dengan objek air dengan ketinggian
yang berbeda dan mengirimkan hasil yang telah diolah oleh sistem kepada
pengguna.
• Melakukan pengolahan sensor pH dengan metode Analog to Digital
Converter sehingga mendapatkan nilai digital yang bertujuan untuk
mempermudah pengguna dalam menampilkan hasil pengukuran sensor.
• Melakukan transmisi data dari sistem ke pengguna dengan jaringan tanpa
kabel (wireless).
• Membantu pengguna menghitung nilai rataan curah dan kualitas hujan
berdasarkan sensor yang terintegrasi dengan sistem.
 Sistem ini dapat dibagi menjadi tiga subsistem utama yang dijabarkan sebagai berikut.
Diagram aliran data tingkat satu diberikan pada gambar selanjutnya.
1. Subsistem Sensor dan Posisi

2. Subsistem Komunikasi

3. Subsistem Antarmuka Pengguna

Setiap subsistem tersebut memiliki keterhubungan satu dengan yang lainnya. Sistem
mikrokontroler memegang peran penting dalam melakukan koordinasi semua subsistem
yang ada. Bahkan, bila sistem mikrokontroler yang dipilih memiliki kemampuan yang
baik, beberapa subsistem dapat terintegrasi dengan baik pada sistem mikrokontroler
tersebut sehingga ukuran sistem menjadi lebih kecil dan lebih ringkas.
2. Diagram Sistem
 ANALISIS
A. Analisis Umum
Hasil dari proyek Digital Rain Climate Measurement yang akan dikembangkan akan
memiliki dampak yang cukup signifikan dalam beberapa aspek, baik dalam aspek
instrumentasi terhadap pemanfaatan sensor, aspek informatika serta aspek kontrol dalam
mengolah data. Dengan proyek ini, diharapkan pengukuran curah hujan lebih akurat dan
presisi, menggunakan metode pengukuran terbaru, pengolahan data pengukuran dengan
pemanfaatan layanan komputasi awan, tampilan antar muka pengguna baik secara website
maupun mobile dan pengukuran kualitas air hujan dengan mengukur tingkat keasaman air
hujan. Sehingga, hasil pengukuran dapat digunakan sebagai referensi pada bidang
transportasi, pariwisata dan pertanian pada suatu wilayah pengukuran tingkat curah hujan.
Untuk aspek sosial, dengan adanya alat ini diharapkan mempermudah pekerja di bidang
pertanian untuk mengetahui tingkat kualitas air hujan di suatu wilayah dikarenakan akses hasil
data pengukuran akan diberikan ke pengguna yang sebelumnya telah terdaftar sebagai
pengguna.
B. Karakteristik Produk
Produk yang akan dikembangkan adalah Digital Rain Climate Measurement. Produk
ini merupakan sistem yang menggunakan sensor ultrasonik, sensor pH, temperatur dan
kelembaban serta modul GPS (opsional) yang digunakan untuk mengetahui keadaan iklim
dan cuaca dengan memanfaatkan pengukuran tingkat curah hujan yang dapat dipantau melalui
aplikasi web maupun mobile. Sensor ultrasonik digunakan untuk mengukur tingkat curah
hujan dengan menggunakan prinsip mengukur volume air yang ditampung kemudian
dikalkulasikan kembali untuk mengetahui tingkat curah hujan. Hasil pengukuran ditampilkan
melalui aplikasi web maupun mobile tanpa melakukan pengukuran secara langsung pada
sistem.
 Fitur Utama Digital Rain Climate Measurement:
Digital Rain Climate Measurement adalah alat pengukuran tingkat curah hujan di
suatu wilayah yang memiliki kemampuan untuk mengukur curah hujan, pH, temperatur
dan kelembaban secara digital dan otomatis. Alat ini menggunakan sensor ultrasonik,
dimana pengukuran dilakukan dengan mengirimkan gelombang ultrasonik oleh TX ke
permukaan air kemudian menghitung waktu pantul oleh RX. Untuk mengukur tingkat
kualitas air hujan dilakukan dengan menghitung tingkat keasaman air hujan pada air hujan
yang sebelumnya ditampung pada tangki. Kemudian hasil pengukuran akan diproses oleh
mikrokontroler dan ditransmisikan melalui konektivitas WiFi yang akan dikirim ke server
kemudian hasil pengukuran akan disimpan pada database online untuk kemudian
 ditampilkan hasil pengukuran untuk per satuan waktu ke pengguna melalui aplikasi web
maupun mobile, sehingga data bisa diakses oleh pengguna.
 Fitur Dasar Digital Rain Climate Measurement:

o Sensor Ultrasonik

o Sensor Suhu dan Kelembaban

o Sensor pH

o Modul GPS (Opsional)

o Mikrokontroler Wemos D1 WiFi Uno

o Antarmuka link I/O

o Antarmuka Mobile Android

o Komunikasi Jaringan

o Cloud Computing menggunakan ThingSpeak Platform

 Sifat solusi yang diharapkan dari Digital Rain Climate Measurement:

o Mudah digunakan dalam melakukan pengukuran

o Dapat terintegrasi dengan database
o Bekerja secara kontinu dengan jeda waktu yang minim
C. Spesifikasi Sistem
Dari sisi performansi, secara umum sistem ini harus memenuhi kebutuhan-kebutuhan
sebagai berikut.
1. Akurasi
Sistem ini diharapkan memiliki akurasi yang sangat tinggi khususnya pada subsistem
sensor ultrasonik sebagai pengukuran tingkat curah hujan dan juga penggunaan sensor
posisi. Diharapkan subsistem tersebut dapat merepresentasikan pengukuran yang
sebenarnya dengan tipe yang telah ada dengan toleransi 0,2 mm/menit atau lebih kecil
melalui pengulangan konfigurasi dengan subsistem sensor ultrasonik sebagai standar
pengukuran yang sama tanpa mengalami perbedaan signifikan (repeateability). Selain itu,
sensor posisi juga harus dapat memetakan tempat yang akan di-monitoring sehingga
diharapkan dapat mengetahui lokasi dengan toleransi 5%. Dengan presisi dan akurasi yang
cukup tinggi ini, pengguna dimudahkan dengan menggunakan fitur pengulangan secara
 otomatis terhadap perubahan-perubahan status dari sensor sehingga data didapat dengan
real time.
2. Dimensi Produk
Produk ini terdiri atas dua buah modul utama yaitu modul statis dan modul
pengguna. Dimensi modul statis akan sangat dipengaruhi dari ukuran rangka aluminium
dan lokasi penempatan dari setiap komponen elektronik. Pada spesifikasi awal, rangka
aluminium berbentuk balok dengan panjang ±50 cm, lebar ±30 cm dan tinggi ±25 cm.
sistem ini dilengkapi dengan kaki penyangga dengan tinggi ±15 cm dengan corong pada
bagian atas dari rangka aluminium sebagai aliran masuknya air hujan. Modul pengguna
terdiri atas dua modul yang dapat digunakan sesuai kebutuhan yaitu sebuah perangkat
komputer yang digunakan untuk menampilkan halaman web dan aplikasi ponsel pintar
berbasis android (mobile).
3. Konsumsi Daya
Konsumsi daya akan sangat dipengaruhi oleh perangkat-perangkat elektronik yang
digunakan. Dalam hal ini pemakaian AC Adapter sudah mewakili pemakaian daya
keseluruhan sekitar 10 Watt dikarenakan sistem mikrokontroler mengambil daya sebesar
5 Watt (dinamis) sedangkan untuk sensor pH dan modul GPS mengambil daya sebesar 5
Watt.
Sistem ini akan menerima sumber daya dari luar berupa tegangan DC yang telah stabil
pada angka 5V dan dengan arus yang cukup. Dengan demikian, sistem ini memerlukan
AC Adapter untuk mengubah tegangan AC menjadi tegangan DC sekaligus menurunkan
tegangan suplai daya. Di dalam sistem ini akan terdapat regulator tegangan tambahan agar
tegangan dapat didistribusikan sesuai dengan kebutuhan pada masing-masing
komponen/sensor.
4. Kemudahan Pengoperasian
Produk ini memiliki tujuan utama untuk memberikan informasi berupa tingkat
pengukuran curah hujan, pengukuran pH, suhu dan kelembaban dan posisi secara real
time. Dengan demikian, kemudahan pengoperasian alat menjadi suatu keharusan. Hal ini
terlihat dari penggunaan perangkat komputer (website) maupun smartphone (mobile
android app). Pemilihan dari dua modul ini, diharapkan pengguna dapat dengan mudah
mengoperasikan sistem dengan diberikannya 2 opsi dalam me-monitoring data hasil
pengukuran sehingga memudahkan dalam monitoring sistem ini. Selain itu, pengguna
disajikan dengan graphical user interface (GUI) yang intuitif dan interaktif sehingga
pengguna dapat dengan mudah mempelajari fitur-fitur yang dimiliki dari aplikasi ini.
5. Kekuatan, respon, dan kestabilan sistem
Khusus pada subsistem sensor dan posisi serta subsistem komunikasi, sistem ini
diharapkan dapat memiliki respon yang tinggi terhadap perubahan cuaca yang mendadak,
dikarenakan menggunakan konektivitas WiFi dalam hal pengiriman data hasil pengukuran
dan hal tersebut dapat mengakibatkan attenuasi dari sinyal yang dikirimkan serta sensor
ultrasonik yang tidak tahan terhadap perubahan suhu yang signifikan dan tidak tahan jika
terkena rembesan air.
 IMPLEMENTASI
1. Subsistem Sensor
a. Implementasi Sensor Ultrasonik
Implementasi sensor ultrasonik dilakukan dengan menghubungkan ke-4 pin dari
sensor ultrasonik dengan ke-4 pin yang tersedia pada Wemos yaitu pin trigger pada pin
Digital Input 2 mikrokontroler, pin echo pada pin Digital Input 3 mikrokontroler serta
VCC dan GND pada sensor ultrasonik pada pin 5 V dan GND mikrokontroler untuk
keterangan lebih lanjut dapat dilihat pada Gambar 1 serta hasil implementasi perangkat
pada Gambar 2.

Gambar 1. Sensor Ultrasonik

Gambar 2. Implementasi Perangkat

 Implementasi sensor ultrasonik pada mikrokontroler dapat dilakukan dengan
mengunggah kode program berikut ini:

#define pingPin 5 // Trigger Pin of Ultrasonic Sensor

#define echoPin 16 // Echo Pin of Ultrasonic Sensor
void setup(){
Serial.begin(115200); // Starting Serial Terminal
}
void loop(){
long duration, inches, cm;
pinMode(pingPin, OUTPUT);
digitalWrite(pingPin, LOW);
delayMicroseconds(2);
digitalWrite(pingPin, HIGH);
delayMicroseconds(10);
digitalWrite(pingPin, LOW);
pinMode(echoPin, INPUT);
duration = pulseIn(echoPin, HIGH);
inches = microsecondsToInches(duration);
cm = microsecondsToCentimeters(duration);
Serial.print(inches);
Serial.print("in, ");
Serial.print(cm);
Serial.print("cm");
Serial.println();
delay(100);
}

long microsecondsToInches(long microseconds){

return microseconds / 74 / 2;
}
long microsecondsToCentimeters(long microseconds){
return microseconds / 29 / 2;
}
b. Implementasi Sensor pH
Implementasi sensor pH dilakukan dengan menghubungkan 3 pin dari sensor pH
dengan 3 pin yang tersedia pada mikrokontroler yaitu pin data pada sensor dihubungkan
pada pin A0 di mikrokontroler serta VCC dan GND sensor pH dihubungkan pada pin 5 V
dan GND mikrokontroler, untuk keterangan lebih lanjut dapat dilihat pada Gambar 3 serta
hasil implementasi perangkat pada Gambar 4.

Gambar 3. Desain Rangkaian Sensor pH

Gambar 4. Implementasi Sensor pH

 Implementasi sensor pH dapat dilakukan dengan mengunggah kode program berikut ini.

#define SensorPin A0 //pH meter Analog output to Arduino Analog Input 1

#define Offset -0.50 //deviation compensate -0.50
#define LED 13
#define samplingInterval 20
#define printInterval 800
#define ArrayLenth 40 //times of collection

int pHArray[ArrayLenth]; //Store the average value of the sensor feedback

int pHArrayIndex=0;

void setup(void)
{
pinMode(LED,OUTPUT);
Serial.begin(9600);
Serial.println("pH meter experiment!"); //Test the serial monitor
}
void loop(void)
{
static unsigned long samplingTime = millis();
static unsigned long printTime = millis();
static float pHValue,voltage;
if(millis()-samplingTime > samplingInterval)
{
pHArray[pHArrayIndex++]=analogRead(SensorPin);
if(pHArrayIndex==ArrayLenth)pHArrayIndex=0;
voltage = avergearray(pHArray, ArrayLenth)*5.0/1024;
pHValue = 3.5*voltage+Offset;
samplingTime=millis();
}
if(millis() - printTime > printInterval) //Every 800 milliseconds, print a
numerical, convert the state of the LED indicator
{
Serial.print("Voltage:");
 Serial.print(voltage,2);
Serial.print(" pH value: ");
Serial.println(pHValue,2);
digitalWrite(LED,digitalRead(LED)^1);
printTime=millis();
}
}
double avergearray(int* arr, int number){
int i;
int max,min;
double avg;
long amount=0;
if(number<=0){
Serial.println("Error number for the array to avraging!/n");
return 0;
}
if(number<5){ //less than 5, calculated directly statistics
for(i=0;i<number;i++){
amount+=arr[i];
}
avg = amount/number;
return avg;
}else{
if(arr[0]<arr[1]){
min = arr[0];max=arr[1];
}
else{
min=arr[1];max=arr[0];
}
for(i=2;i<number;i++){
if(arr[i]<min){
amount+=min; //arr<min
min=arr[i];
}else{
if(arr[i]>max){
 amount+=max; //arr>max
max=arr[i];
}else{
amount+=arr[i]; //min<=arr<=max
}
}//if
}//for
avg = (double)amount/(number-2);
}//if
return avg;
}

c. Implementasi Sensor Suhu dan Kelembaban

Implementasi sensor suhu dan kelembaban dilakukan dengan menghubungkan 3 pin

dari sensor suhu dan kelembaban dengan 3 pin yang tersedia dengan mikrokontroler yaitu
pin data pada sensor dihubungkan pada pin 4 mikrokontroler serta VCC dan GND pada
sensor dihubungkan pada pin 5 V dan GND mikrokontroler untuk keterangan lebih lanjut
dapat dilihat pada Gambar 5 serta hasil implementasi perangkat pada Gambar 6.

Gambar 5. Desain Rangkaian Sensor Suhu dan Kelembaban

 Gambar 6. Implementasi Sensor Suhu dan Kelembaban

Implementasi sensor suhu dan kelembaban dapat dilakukan dengan mengunggah kode
program berikut ini.

#include "DHT.h"

#define DHTPIN 2 // what digital pin we're connected to

#define DHTTYPE DHT11 // DHT 11

DHT dht(DHTPIN, DHTTYPE);

float h = dht.readHumidity();
float t = dht.readTemperature();

2. Subsistem Komunikasi
Pengujian subsistem komunikasi sebelumnya dilakukan dengan memastikan seluruh
pin pada board mikrokontroler tersambung beserta dengan kabel catu dayanya. Hasil
pembacaaan konektivitas dari board dan platform dapat dilihat dengan melalui serial monitor
maupun dengan memastikan data pengujian dapat diterima oleh platform aplikasi IoT
ThingSpeak. Pengujian subsistem komunikasi dapat dilakukan dengan mengunggah kode
program berikut ini.

#include <DHT.h>
#include <ESP8266WiFi.h>
// replace with your channel’s thingspeak API key and your SSID and password
String apiKey = "SL8SXSAWU9NI2CQV"; //write api key thingspeak
const char* ssid = "Fouriel"; // SSID name
const char* password = "nainggolan21"; // SSID Password
const char* server = "api.thingspeak.com";

#define DHTPIN 4
#define DHTTYPE DHT11
#define trigPin 16
#define echoPin 5
long duration,c;

DHT dht(DHTPIN, DHTTYPE);

WiFiClient client;

void setup()
{
Serial.begin(115200);
delay(10);
dht.begin();
WiFi.begin(ssid, password);
Serial.println();
Serial.println();
Serial.print("Connecting to ");
Serial.println(ssid);
WiFi.begin(ssid, password);
while (WiFi.status() != WL_CONNECTED)
{
delay(500);
Serial.print(".");
}
Serial.println("");
Serial.println("WiFi connected");
pinMode(trigPin, OUTPUT);
pinMode(echoPin, INPUT);
}
void loop()
{
float h = dht.readHumidity();
float t = dht.readTemperature();
if (isnan(h) || isnan(t))
{
Serial.println("Failed to read from DHT sensor!");
return;
}
digitalWrite(trigPin, LOW);
delayMicroseconds(2);
digitalWrite(trigPin, HIGH);
delayMicroseconds(10);
digitalWrite(trigPin, LOW);
//pinMode(echoPin, INPUT);
duration = pulseIn(echoPin, HIGH);
c = (duration/2) / 29.1;
delay(100);
if (isnan(c))
{
Serial.println("Failed to read from Ultrasonic sensor!");
return;
}
if (client.connect(server,80)) {
String postStr = apiKey;
postStr +="&field1=";
postStr += String(c);
postStr +="&field2=";
postStr += String(t);
postStr +="&field3=";
postStr += String(h);
postStr += "\r\n";
client.print("POST /update HTTP/1.1\n");
client.print("Host: api.thingspeak.com\n");
client.print("Connection: close\n");
client.print("X-THINGSPEAKAPIKEY: "+apiKey+"\n");
client.print("Content-Type:application/x-www-form-urlencoded\n");
client.print("Content-Length: ");
 client.print(postStr.length());
client.print("\r\n\r\n");
client.print(postStr);
Serial.print("Distance : ");
Serial.print(c);
Serial.print("\nTemperature: ");
Serial.print(t);
Serial.print(" \ndegrees Celsius Humidity: ");
Serial.print(h);
Serial.println("\nSending data to Thingspeak");
}
client.stop();
Serial.println("Waiting 20 secs");
// thingspeak needs at least a 15 sec delay between updates
// 20 seconds to be safe
delay(3000);
}

Jika pada pengujian kode program pengiriman data ke ThingSpeak dapat berjalan serta
pada serial monitor ditampilkan seperti pada Gambar 2.15, maka dapat dipastikan jika board
telah terkoneksi dengan SSID online yang ditentukan pada kode program serta terkoneksi ke
server platform ThingSpeak.

Gambar 2.1 Proses Konektivitas ke Access Point

 Untuk memastikan data yang ditampilkan pada Gambar 2.15 dapat diterima pada platform,
maka dilakukan perbandingan data yang dikirimkan dengan data yang diterima.

3. Subsistem Antarmuka Pengguna

Kode program untuk mengatur tampilan umum website (Font, Border, Colour, position,
dan lainnya) dalam file ekstensi .css
<!-- Layout -->
<script src="image/js/jquery.min.js" charset="utf-8"></script>
<script src="image/js/jquery-3.1.1.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-
easing/1.3/jquery.easing.min.js"></script>
<script src="image/js/bootstrap.min.js"></script>
<!-- CSS -->
<!-- <link href="./css/bootstrap.min.css" rel="stylesheet" > -->
<link rel="stylesheet" href="image/css/w3.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Raleway">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato">
<!-- End of CSS -->
<!-- Meta tag -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- End of Meta tag -->
<!-- Gambar tab browser -->
<link rel="shortcut icon" href="image/img/rain.ico"/>
<!-- End of Gambar tab browser -->
<!-- Bootstrap CSS -->
<link href="image/css/bootstrap.min.css" rel="stylesheet" >
<link href="image/css/bootstrap.css" rel="stylesheet" >
<link href="image/css/bootstrap-theme.css" rel="stylesheet">
<link href="image/vendor/font-awesome/css/font-awesome.min.css"
rel="stylesheet" type="text/css">
<link href="image/css/stylelogin.css" rel="stylesheet">
<style>
body,h1,h2,h3,h4,h5,h6 {
 font-family: "Lato", sans-serif;
}
body, html {
height: 100%;
color: #777;
line-height: 1.8;
}
.bgimg-1, .bgimg-2, .bgimg-3 {
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.bgimg-1 {
background-image: url("image/img/danau.jpg");
min-height: 100%;
}
/* Second image (Portfolio) */
.bgimg-2 {
background-image: url("image/img/arduino.jpg");
min-height: 400px;
}
.bgimg-3 {
background-image: url("image/img/ehe.jpg");
min-height: 400px;
}
.w3-wide {
letter-spacing: 10px;
}
.w3-hover-opacity {
cursor: pointer;
}
#map {
width: 100%;
height: 400px;
 background-color: grey;
}
@media only screen and (max-device-width: 1024px) {
.bgimg-1, .bgimg-2 {
background-attachment: scroll;
}
}
.overlay {
height: 100%;
width: 0;
position: fixed;
z-index: 1;
top: 0;
left: 0;
background-color: rgb(0,0,0);
background-color: rgba(0,0,0, 0.9);
overflow-x: hidden;
transition: 0.2s;
}
.overlay-content {
position: relative;
top: 25%;
width: 100%;
text-align: center;
margin-top: 30px;
}
.overlay a {
padding: 8px;
text-decoration: none;
font-size: 36px;
color: #818181;
display: block;
transition: 0.3s;
}
.overlay a:hover, .overlay a:focus {
 color: #f1f1f1;
}
.overlay .closebtn {
position: absolute;
top: 20px;
right: 45px;
font-size: 60px;
}
@media screen and (max-height: 450px) {
.overlay a {font-size: 20px}
.overlay .closebtn {
font-size: 40px;
top: 15px;
right: 35px;
}
}
</style>

Pada tabel kode program untuk mengatur tampilan umum website, ditunjukkan beberapa kode
fungsi untuk mengatur dan menentukan jenis font, ukuran font yang digunakan, bentuk border,
warna pada tulisan, spasi setiap kalimat dan fungsi lainnya yang akan ditampilkan pada website.
Kode program ini dibutuhkan apabila user menginginkan tampilan yang interaktif dan menarik
pada website.

<script>

function initMap() {

var myLatLng = {lat: 2.385886, lng: 99.146849};

var map = new google.maps.Map(document.getElementById('map'), {

center: new google.maps.LatLng(2.385886, 99.146849),

zoom: 17,

mapTypeControl: true,

styles: [
{elementType: 'geometry', stylers: [{color: '#242f3e'}]},

{elementType: 'labels.text.stroke', stylers: [{color: '#242f3e'}]},

{elementType: 'labels.text.fill', stylers: [{color: '#746855'}]},

featureType: 'administrative.locality',

elementType: 'labels.text.fill',

stylers: [{color: '#d59563'}]

},

featureType: 'poi',

elementType: 'labels.text.fill',

stylers: [{color: '#d59563'}]

},

featureType: 'poi.park',

elementType: 'geometry',

stylers: [{color: '#263c3f'}]

},

featureType: 'poi.park',

elementType: 'labels.text.fill',

stylers: [{color: '#6b9a76'}]

},

featureType: 'road',

elementType: 'geometry',

stylers: [{color: '#38414e'}]

},

featureType: 'road',

elementType: 'geometry.stroke',

stylers: [{color: '#212a37'}]

},

featureType: 'road',

elementType: 'labels.text.fill',

stylers: [{color: '#9ca5b3'}]

},

featureType: 'road.highway',

elementType: 'geometry',

stylers: [{color: '#746855'}]

},

featureType: 'road.highway',

elementType: 'geometry.stroke',

stylers: [{color: '#1f2835'}]

},

featureType: 'road.highway',

elementType: 'labels.text.fill',

stylers: [{color: '#f3d19c'}]

},

{
 featureType: 'transit',

elementType: 'geometry',

stylers: [{color: '#2f3948'}]

},

featureType: 'transit.station',

elementType: 'labels.text.fill',

stylers: [{color: '#d59563'}]

},

featureType: 'water',

elementType: 'geometry',

stylers: [{color: '#17263c'}]

},

featureType: 'water',

elementType: 'labels.text.fill',

stylers: [{color: '#515c6d'}]

},

featureType: 'water',

elementType: 'labels.text.stroke',

stylers: [{color: '#17263c'}]

});

var marker = new google.maps.Marker({

 position: myLatLng,

map: map,

});

</script>

<script async defer

src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCYgyvn5LfGBeuod-
nRy0CE97gBzP9rZVA&callback=initMap">

</script>

</div>

</div>

Pada tabel kode program untuk fungsi lokasi, digunakan untuk menampilkan lokasi tetap
(statis) pengukuran, untuk memasukan lokasi tersebut digunakan dengan bantuan google maps
untuk menentukan titik lintang dan ketinggian dari lokasi yang akan di-set.

Lokasi yang akan ditampilkan berupa keterangan serta gambar serta dapat diubah untuk melihat
lokasi penempatan perangkat, baik berupa citra peta maupun dalam citra satelit.

<div class="w3-row w3-center w3-dark-grey w3-padding-16">

<h2 class="w3-center">Features</h2>
<div class="w3-quarter w3-section">
<span class="w3-xlarge">
<img src="image/img/digi.png" width="128px" height="128px"
style="margin-bottom:10px;">
</span><br>
<h4>Digital Graphic Measurement</h4>
</div>
<div class="w3-quarter w3-section">
 <span class="w3-xlarge">
<img src="image/img/temper.png" width="128px" height="128px"
style="margin-bottom:10px;">
</span><br>
<h4>Temperature Analytics</h4>
</div>
<div class="w3-quarter w3-section">
<span class="w3-xlarge">
<img src="image/img/humis.png" width="128px" height="128px"
style="margin-bottom:10px;">
</span><br>
<h4>Humidity Analytics</h4>
</div>
<div class="w3-quarter w3-section">
<span class="w3-xlarge">
<img src="image/img/ph1.png" width="128px" height="128px"
style="margin-bottom:10px;">
</span><br>
<h4>PH Meter Measurement</h4>
</div>
<div class="w3-quarter w3-section">
<span class="w3-xlarge">
<img src="image/img/rain.png" width="128px" height="128px"
style="margin-bottom:10px;">
</span><br>
<h4>Rain Gauge Measurement</h4>
</div>
<div class="w3-quarter w3-section">
<span class="w3-xlarge">
<img src="image/img/gps.png" width="128px" height="128px"
style="margin-bottom:10px;">
</span><br>
<h4>GPS</h4>
</div>
<div class="w3-quarter w3-section">
 <span class="w3-xlarge">
<img src="image/img/datab.png" width="128px" height="128px"
style="margin-bottom:10px;">
</span><br>
<h4>Database Stored</h4>
</div>
<div class="w3-quarter w3-section">
<span class="w3-xlarge">
<img src="image/img/clou.png" width="128px" height="128px"
style="margin-bottom:10px;">
</span><br>
<h4>Cloud Computing Based</h4>
</div>
</div>

Pada tabel kode program fungsi untuk menampilkan fitur, berfungsi untuk menampilkan fitur
serta kelebihan website pada perangkat yang digunakan. Dengan begitu, pengguna yang baru saja
mengunjungi website dapat lebih mudah dalam memahami berbagai fitur yang ditawarkan oleh
layanan website yang digunakan.

Fungsi menampilkan animasi grafik temperatur dari platform ThingSpeak ke laman home
pada website

<div class="col-lg-6">
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title"><i class="fa fa-long-arrow-
right"></i>Temperature</h3>
</div>
<div class="panel-body">
<div id="morris-donut-chart"></div>
<iframe width="500" height="335" style="border: 1px solid #cccccc;"
src="https://thingspeak.com/channels/505181/widgets/4879?bgcolor=%230a1925&color=%
237ebd35&dynamic=true&results=60&title=&type=spline&width=1080&height=300&xaxi
s=Time&yaxis=Temperature+in+Celcius"></iframe>
<div class="text-right">
<a href="#">Hari <i class="fa fa-arrow-circle-right"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-6">
<div class="panel panel-red">
<div class="panel-heading">
<h3 class="panel-title"><i class="fa fa-long-arrow-
right"></i>Temperature</h3>
</div>
<div class="panel-body">
<div id="morris-line-chart"></div>
<iframe width="500" height="335" style="border: 1px solid #cccccc;"
src="https://thingspeak.com/channels/505158/widgets/4878?bgcolor=%230a1925&color=%
237ebd35&dynamic=true&results=60&title=&type=spline&width=3&height=3&xaxis=Tim
e&yaxis=Temperature+in+Celcius"></iframe>
<div class="text-right">
<a href="#">Jam <i class="fa fa-arrow-circle-right"></i></a>
</div>
</div>
</div>
</div>

Pada tabel kode program fungsi pengambilan data dari Thingspeak ke dalam website, hasil
pengukuran yang pada platform ThingSpeak yang ditampilkan pada website diambil dengan cara
mengambil data grafik pada ThingSpeak untuk kembali ditampilkan pada website.

Fungsi Sign up serta penyimpanan data user ke dalam database

<?php
include 'db.php';
 if (@$_POST['simpan']) {

$username = @$_POST['username'];
$passwordold = @$_POST['password'];

$password = md5($passwordold);

mysqli_query($connect, "INSERT INTO user(username,password) VALUES

('$username', '$password')");

?>

<script type="text/javascript">
alert("SIMPAN berhasil");
window.location.href="index.php"

</script>

<?php }
?>

Pada tabel kode program fungsi penyimpanan akun data user, kode program membuat data
user yang telah didaftarkan sebelumnya akan dikirimkan pada database untuk kemudian
disimpan. Jika proses penyimpanan telah selesai dilakukan, maka akan muncul notifikasi pada
website yang akan mengonfirmasi apabila data user telah sukses didaftarkan atau tidak.

Fungsi Login serta fungsi pengambilan data dari database

<?php
include 'db.php';

$username = (htmlentities($_POST['username']));
$password = (htmlentities(md5($_POST['password'])));

$query = "SELECT * FROM user WHERE username = '$username' AND password =

'$password'";
 $runquery = $connect->query($query);

if($runquery->num_rows > 0){

session_start();
$_SESSION['username'] = $username;
header("Location: home.php");
} else {
echo '<h1>Username atau Kata Sandi Salah!</h1>';
}

?>

Pada tabel kode program fungsi login ke dalam website, kode program tersebut akan
memastikan bahwa akun yang akan masuk ke dalam website adalah akun yang sudah terdaftar
pada database. Apabila akun tersebut sudah terdaftar, maka user akan dapat masuk ke dalam
laman selanjutnya tetapi apabila akun belum terdaftar, fungsi akan memberi perintah pada website
untuk memberikan notifikasi bahwa username atau kata sandi salah.

Fungsi memasukkan data hasil pengukuran temperatur dari ThingSpeak ke dalam tabel
database

<?php
include_once("db.php");
$sql = "SET temp.tanggal TIME_ZONE = 'ASIA/JAKARTA'";
//read the json file contents
$jsondata =
file_get_contents('https://thingspeak.com/channels/399019/feed/last.json');

//convert json object to php associative array

$data = json_decode($jsondata, true);

//get the employee details

$tanggal = $data['created_at'];
$hasil = $data['field2'];

//insert into mysql table

$sql = "INSERT INTO temp(id, tanggal, hasil)
 VALUES('$id','$tanggal', '$hasil')";
if (mysqli_query($connect, $sql)) {
} else {
echo "Fail: " . $sql . "<br>" . mysqli_error($connect);
}
mysqli_close($connect);
?>

Pada tabel kode program fungsi memasukkan data dari ThingSpeak ke database, data
yang diambil dari Thingspeak akan mengalami proses konversi dari data file yang berekstensi
JSON ke dalam bentuk PHP Array sehingga akan lebih mudah untuk mengolah data tersebut
pada database. Dan untuk pengenalan data hasil pengukuran dilakukan dengan menentukan
field yang akan dipakai untuk kemudian diolah pada PHP database. Field yang akan diolah
adalah id, tanggal pengukuran dan hasil pengukuran. Dengan demikian data yang akan masuk
ke dalam tabel akan sesuai dengan hasil pengukuran.

4. Subsistem Perangkat Keras Pendukung

Tabel 2.1 Desain Subsistem Perangkat Keras Pendukung

No Desain Hasil Implementasi

1 Panjang jari-jari corong = 7 cm Panjang jari-jari corong = 10 cm
2 Penggunaan 2 tangki penampungan Penggunaan 1 tangki penampungan
3 Dimensi luas tangki = 56 cm2 Dimensi luas tangki = 49 cm2
4 Maksimum pengukuran tingkat curah Maksimum pengukuran tingkat curah
hujan berada pada 101 mm hujan berada pada 25 mm, dikarenakan
pengukuran lebih difokuskan untuk
penambahan tingkat curah hujan
5 Tidak menggunakan kipas DC pada Menggunakan kipas DC pada tempat
tempat penyimpanan komponen penyimpanan komponen elektronik
elektronik
6 Catu daya adaptor 5 V Catu daya adaptor yang digunakan 12 V
a. Ukuran keseluruhan tangki penampungan

Gambar 7. Desain Dimensi Tangki Penampungan

Hasil desain dimensi untuk tangki penampungan air hujan ditujukkan pada Gambar 7.
Pada saat implementasi pembuatan alat, terdapat 1 tangki yang digunakan untuk menampung
air hujan dan digunakan sebagai referensi dalam pengukuran tingkat curah hujan. Tangki
memiliki dimensi, yaitu sebagai berikut:

Panjang = 7 cm

Lebar = 7 cm

Tinggi = 20 cm

Corong memiliki dimensi, yaitu sebagai berikut:

Jari-jari = 10 cm

Serta sebuah pipa penghubung digunakan untuk menghubungkan tangki dengan

corong pengumpul air hujan sehingga ketinggian air pada selang sama dengan ketinggian air
pada tangki penampungan air hujan serta harus dalam posisi seimbang pada saat proses
implementasi dilakukan. Adapun hasil implementasi dimensi tangki penampungan air seperti
pada Gambar 8.
 Gambar 8. Tangki Penampungan Air Hujan

b. Kipas DC

Gambar 9. Desain Penempatan komponen elektronik

Pada Gambar 9, komponen kipas dan atap tidak digunakan pada desain, namun pada
hasil implementasi perangkat, kipas digunakan sebagai pengatur sirkulasi udara pada bagian
komponen perangkat khususnya pada mikrokontroler. Hal ini dimaksudkan agar pada saat
pengoperasiannya mikrokontroler dapat bekerja optimal dikarenakan suhu mikrokontroler
yang stabil dikarenakan sirkulasi udara yang dijaga baik oleh kipas pengatur sirkulasi udara.
 Atap digunakan agar rembesan air hujan tidak mengenai kipas serta tidak masuk ke dalam
komponen. Implementasi kipas DC pada perangkat diaplikasikan seperti pada Gambar 10.

Gambar 10. Peletakan Kipas DC dan Atap

c. Subsistem pembuangan air

Gambar 11. Desain Subsistem Pembuangan Air

Desain subsistem pembuangan air untuk tangki penampungan ditunjukkan pada

Gambar 11 yang dilengkapi dengan lubang pembuangan jika subsistem pembuangan air tidak
bekerja, namum pada hasil implementasi perangkat, subsistem pembuangan air menggunakan
metode siphon yang memanfaatkan gaya gravitasi dalam menyedot air pada tangki pada
ketinggian maksimum untuk pengukuran. Metode ini akan bekerja menguras air pada bak
penampungan ketika ketinggian maksimum tersebut. Selang digunakan sebagai penyalur air
untuk membuang air yang sudah ditampung pada tangki. Hasil implementasi diaplikasikan
seperti pada Gambar 12, terlihat bahwa lubang pengeluaran air pada bagian atas subsistem
 pembuangan air tidak dibutuhkan dikarenakan setelah dilakukan pengetesan beberapa kali
dapat dipastikan bahwa subsistem pembuangan air ini dapat selalu bekerja dengan optimal.

Gambar 12. Mekanisme Pembuangan Air

d. Subsistem Catu Daya

Pada implementasi perangkat, subsistem catu daya digunakan sebagai sumber daya
untuk mengoperasikan mikrokontroler serta perangkat pendukung lainnya. Perangkat catu
daya yang digunakan haruslah dapat memenuhi kebutuhan dari setiap komponen yang
digunakan dan memiliki tegangan keluaran yang stabil agar tingkat ketahanan dari komponen
perangkat dapat lebih tinggi.

5. Subsistem Perangkat Lunak Pendukung

Tabel 2.2 Perubahan Desain Subsistem Perangkat Lunak Pendukung

No Desain Hasil Implementasi

1 Menggunakan aplikasi web tidak di- Menggunakan aplikasi web di-hosting secara
hosting secara online online dengan menggunakan layanan web
hosting dari https://id.000webhost.com/
2 Menggunakan database online yang Menggunakan database online yang telah
digunakan untuk menyimpan hasil tersedia pada https://id.000webhost.com
pengukuran yaitu dengan menggunakan
layanan aplikasi database online dari
www.freesqldatabase.com
a. Sistem Manajemen Data pada Komputasi Awan

Pada implementasi untuk manajemen data, digunakan platform ThingSpeak sebagai perantara
untuk menyimpan setiap hasil pengukuran ke database online. Pada platform ThingSpeak
terdapat fitur untuk file export, namun hasil file export pada ThingSpeak menghasilkan data
file yang memiliki file ekstensi JSON. Dikarenakan operasi database MySQL menggunakan
file data yang berekstensi PHP array maka dilakukan konversi file data JSON ke PHP array
agar lebih mudah digunakan untuk perintah query pada database online. Adapun prosedur
konversi data ditunjukkan pada kode program sebagai berikut:

//read the json file contents

$jsondata=file_get_contents('https://thingspeak.com/channels/399019/feed/last.json');

//convert json object to PHP associative array

$data = json_decode($jsondata, true);

Konversi file ekstensi dilakukan agar mempermudah proses manajemen data yang dilakukan
dengan menggunakan MySQL untuk tampilan antarmuka pengguna pada sisi manajemen
data.

b. Sistem Kontrol Database dari Hasil Pengukuran

Database yang digunakan adalah database yang telah disediakan oleh aplikasi web hosting
000webhost.com, perubahan dilakukan dikarenakan pada penyedia database sebelumnya
memiliki masa berlaku database selama 7 hari serta memiliki kapasitas penyimpanan data
yang sedikit.

Sebelum melakukan implementasi ke database, file koneksi database MySQL ke PHP terlebih
dahulu diimplementasikan hal ini dimaksudkan untuk menentukan database yang digunakan
dalam melakukan kontrol data untuk subsistem ini. Berikut file koneksi untuk
menghubungkan MySQL dengan PHP yang digunakan pada subsistem.

<?php
// nama host, username mysql, dan password mysql
$host = mysql_connect("localhost","root","xxx");

if($host){
echo "koneksi host berhasil.<br/>";
}else{
echo "koneksi gagal.<br/>";
}
// nama database yang akan dihubungkan
$db = mysql_select_db("namadatabase");

if($db){
echo "koneksi database berhasil.";
}else{
echo "koneksi database gagal.";
}
?>

Pada implementasi untuk kontrol alur data pada sistem keseluruhan, membutuhkan
query yang sesuai dengan kebutuhan untuk menyimpan data hasil pengukuran untuk setiap
sensor yang diaplikasikan pada perangkat. Kode program untuk kontrol alur database
diaplikasikan untuk setiap sensor pengukuran pada subsistem antarmuka pengguna.

<?PHP

include_once("db.PHP");

$sql = "INSERT INTO TABLE(id, tanggal, hasil)

VALUES('$id','$tanggal','$hasil')";

if (mysqli_query($connect, $sql)) {

} else {

echo "Fail: " . $sql . "<br>" . mysqli_error($connect);

mysqli_close($connect);

?>

Kode program diatas digunakan untuk menambahkan data hasil pengukuran ke

database, dimana data hasil pengukuran diperoleh dari platform ThingSpeak dalam file
ekstensi. JSON kemudian diubah ke dalam bentuk array PHP agar lebih mudah diolah pada
MySQL.
 <?PHP

// Create database connection using config file

include_once("db.PHP");

// Fetch all users data from database

$result = mysqli_query($mysqli, "SELECT * FROM TABLE");

?>

Setelah data hasil pengukuran telah selesai dilakukan, maka diperlukan kode program
untuk menampilkan data hasil pengukuran yang disimpan sebelumnya. Kode program diatas
merupakan query yang bertugas untuk menampilkan data pada table dengan memanggil
keseluruhan data yang tersimpan pada table di database. Pemanggilan data yang tersimpan
dilakukan sebanyak satu kali pada saat halaman di-request pada server hosting aplikasi
website.

Dikarenakan dalam menambahkan data hasil pengukuran ke database harus dalam

periode setiap 15 menit, maka dibutuhkan fungsi website division auto refresh dengan
menggunakan AJAX. Penggunaan fungsi ini memungkinkan query untuk menambahkan data
hasil pengukuran dapat berjalan sesuai dengan rentang waktu yang telah ditentukan yaitu
sebesar 15 menit tanpa harus melakukan refresh ulang seluruh halaman website dikarenakan
akan membuat memori perangkat yang membuka halaman website bekerja berat serta
membutuhkan data yang besar juga dalam me-reload halaman website. Berikut hasil
implementasi kode program untuk subsistem kontrol database.

<script type="text/javascript">
function dis()
{
xmlhttp=new XMLHttpRequest();
xmlhttp.open("GET","QUERY.php",false);
xmlhttp.send(null);
document.getElementById("getData").innerHTML=xmlhttp.responseText;
}
dis();
setInterval(function(){
dis();
 DESAIN MOCK-UP DAN DOKUMENTASI
Deskripsi fisik suatu sistem yang akan dibuat memberi gambaran secara fisik terhadap bentuk
sistem secara keseluruhan dan bentuk setiap komponen sistem tersebut. Berikut ini diberikan
pemodelan kasar dari sistem dalam bentuk tiga dimensi.

Gambar 13. Sketsa 3D

Gambar 14. Tampak Dari Jauh

Komponen utama yang menetukan dimensi dari alat adalah kedua tangki penampungan air
hujan. Ukuran tangki penampungan air hujan haruslah memenuhi spesifikasi volume air yang
sebelumnya telah dijelaskan. Ukuran dari volume tangka air yang ditampung telah memenuhi syarat
ambang batas pengukuran tingkat air hujan yaitu sebesar 100 mm. Bentuk balok pada tangki
penampung air dimaksudkan agar memudahkan dalam mendesain volume tangki air agar sesuai
dengan volume air yang diukur dan juga untuk memudahkan dalam peletakan dari setiap komponen
elektronik pada bagian bodi alat. Lingkaran corong diatur agar memiliki ketinggian yang lebih dari
badan sistem, hal ini dimaksudkan agar air hujan yang diukur dapat masuk ke dalam corong tanpa
gangguan pada sekitar bodi alat.
 Alat ini juga dilengkapi dengan kaki penyangga, hal ini dimaksudkan agar meningkatkan
kehandalan alat dalam melewati setiap keadaan cuaca pada saat melakukan pengukuran dan juga
dimaksudkan agar alat terhindar dari gangguan pada sekitar alat seperti tananan hama maupun
gangguan lainnya.

Gambar 15. Tampak Dekat

Gambar 16. Tampak Dekat

Pada bagian dalam dari salah satu tangki penampungan, terdapat peletakan sensor
ultrasonik dan sensor pH. Untuk sensor pH, diusahakan agar tidak mengenai permukaan air
yang akan diukur dan memiliki ketinggian batas atas air yang akan diukur sebesar ±4 cm.
Untuk sistem pembuangan air hujan pada tangki, digunakan metode siphon dimana metode
ini memanfaatkan gaya gravitasi untuk mengeluarkan air pada tangki. Pada bagian atas selang
siphon, alat dilengkapi dengan lubang cut-off pada tangki penampungan, hal ini dimaksudkan
untuk menantisipasi jika air hujan volume air masuk jauh melebihi dari volume air yang keluar
melalui selang siphon. Untuk peletakan sensor pH pada tangki dilakukan dengan secara
 otomatis dapat mengikuti ketinggian air pada tangki air. Sensor akan dibuat secara otomatis
mengapung pada jalur dengan menggunakan bantuan pipa dan gabus.

Gambar 17. Tampak Atas

Gambar 18. Tangki Sistem

Peletakan komponen elektronik dari alat dilakukan pada bagian atas dari tangki penampungan.
Hal ini dimaksudkan agar menghemat dimensi desain dari alat, selain itu peletakan pada bagian atas
tangki merupakan salah tempat strategis yang dapat dilakukan dikarenakan dalam
memancarkan/mentransmisikan data hasil pengukuran, ketinggian dari peletakan antenna dapat
mempengaruhi radius pengiriman data/gelombang WiFi. Pada sensor suhu dan kelembaban,
peletakan juga dilakukan pada bagian atas dari tangki, hal ini dimaksudkan agar pengukuran suhu
dan kelembaban dapat dengan maksimal dilakukan tanpa gangguan dikarenakan ketinggian
mempengaruhi tingkat temperatur dan kelembaban.
 Gambar 19. Tampak Samping Sistem Mikrokontroller

Gambar 20. Tampak Atas Sistem Mikrokontroller

Peletakan modul GPS dan adaptor sumber daya juga dilakukan pada bagian atas tangki
penampungan, seperti pada gambar 2. 10. Pada bagian ini, direncanakan akan diisolasi agar
tidak terkena air dan untuk memastikan sinyal WiFi dapat terpancarkan, alat ini juga
dilengkapi dengan pemancar/antenna tambahan agar sinyal WiFi dapat terjangkau pada
access point.
 DAFTAR PUSTAKA
1. Kodali, Ravi Kishore. 2016. IoT Based Weather Station. India. National Institute of
Technology.
2. M. Pujar, Prasad. 2016. Wireless Sensor Network Based Water Monitoring Systems: A Survey.
India. Visvesvaraya Technological University.
3. Zheng, Guilin. February 2013. An Innovative Principle in Self-Calibration by Dual Ultrasonic
Sensor and Application in Rain Gauge. China. Wuhan University.
4. Nawale, Balasaheb, K Lakshman, Navalkrushna Allurwar. 2016. Temperature/Humidity
Monitoring Webserver. India. NIELIT.
5. Ome, Nerella, G. Someswara Rao. October 2016. Internet of Things (IoT) based Sensors to
Cloud system using ESP8266 and Arduino Due. India. Institute of Engineering and
Technology Hyderabad.
6. http://iotmonk.com/courses/read-gps-data-thingspeak-show-map-using-esp12e-nodemcu-
gps-neo-6m-module/ (diakses pada 7 januari 2018)
7. https://www.codeproject.com/Articles/841766/Stage-Live-Weather-Station-With-Arduino-
and-ThingS (diakses pada 7 januari 2018)
8. https://www.codepolitan.com/tutorial/membuat-aplikasi-android-berbasis-html5-cordova
(diakses pada 7 januari 2018)
9. https://medium.com/@18214030_IMKA/final-project-progress-we-did-it-bfc972f35bbe
(diakses pada 7 januari 2018)
10. thingspeak.com (diakses pada 7 januari 2018)