Implementasi IOT Mengontrol LED berbasis WEB Chapter III V

BAB 3
ANALISIS DAN PERANCANGAN SISTEM

3.1 Analisa

Tahapan analisa sistem dimulai karena adanya permintaan dan keinginan terhadap
sistem baru

atau penyempurnaan

sistem lama,

beberapa

faktor yang

mempengaruhi analisa sistem antara lain adanya masalah pada suatu sistem yang
telah di terapkan atau menemukan adanya peluang baru. Tujuan analisa sistem
untuk menentukan hal-hal detail tentang akan dikerjakan oleh sistem yang di
usulkan (dan bukan bagaimana caranya).


Perancangan untuk Pengontrol LED berbasis IoT di gambarkan oleh
penulis menggunakan UML (Unified Modelling Language) yang meliputi Desain
Sistem, Desain Alat dan Rangakan Elektronik, Desain Program. Adapun fitur dari
Sistem Pengontrol LED berbasis IoT ini adalah :

a) Mengontrol kecerahan LED
b) Mengontrol waktu tunda mati/hidup LED
c) Mengontrol nilai warna pada LED RGB

Universitas Sumatera Utara

22

3.2 Desain Sistem

3.2.1

Analisa Flowchart

Gambar 3.1 Analisa Flowchart


Gambar di atas menginformasikan bagan alur dari Sistem Pengontrol Led berbasis
IoT secara garis besar, dimana user mengakses halaman control panel led dan
mengontrol led berdasarkan tiga pilihan yaitu kecerahan led, waktu tunda mati
hidup led, rgb led.

Universitas Sumatera Utara

23

3.2.2

Analisa Use Case Diagram

Use Case Diagram adalah sebuah diagram yang menggambarkan fungsionalitas
yang di harapkan dari sebuah sistem , yang ditekankan adalah “apa” bukan
“bagaimana”.

Gambar 3.2 Analisa Use Case Diagram


Gambar di atas menunjukan fungsi dari aplikasi yang akan di buat, pada gambar
di beri contoh ada user 1 dan user 2 masing-masing dari user atau pengguna dapat
menggunakan aplikasi sistem IoT mengontrol led untuk melakukan kontrol pada
beberapa led.

3.2.3

Analisa Sequence Diagram

Sequence Diagram adalah sebuah diagram yang memperlihatkan interaksi antara
objek di dalam dan di sekitar sistem yang di gambarkan terhadap waktu. Untuk
Sequence Diagram penulis menggunakan IP lokal.

Universitas Sumatera Utara

24

Gambar 3.3 Analisa Squence Diagram

Gambar di atas adalah gambaran dari aplikasi IoT mengontrol led yang akan di

buat. Ketiga node terhubung pada jaringan lokal yang sama menggunakan
wireless access point. Client request halaman control panel led. ESP8266
membuat socket koneksi ke gateway begitu juga dengan client.

3.3

Desain Alat dan Elektronika

3.3.1

ESP8266 Dimmer dan Blinking Led

Universitas Sumatera Utara

25

Gambar 3.4 Rangkaian ESP8266 Dimmer dan Blinking LED

Gambar di atas adalah gambar rangkaian ESP8266 dimmer LED dan ESP8266
blinking LED, dimana gambar tersebut menggambarkan tegangan dari usb yang

diturunkan dari 5v ke 3.3v berhubung karena ESP8266 beroperasi pada tegangan
3.3v. Dan juga terdapat led yang terhubung ke GPIO0. Adapun komponen yang
digunakan selain ESP8266 pada rangkaian ini adalah :

Tabel 3.1 Komponen ESP8266 Dimmer dan Blinking LED
No

Nama Komponen

Jumlah

1

ESP8266 v1

2

2

USB type B


2

3

Capasitor 10uF

2

4

Capasitor non polar 104

2

5

AMS1117 3.3

2


6

LED Putih

1

7

LED Biru

1

8

Resistor 220

2

Universitas Sumatera Utara


26

3.3.2

ESP8266 RGB LED

Gambar 3.5 Rangkaian ESP8266 RGB LED

Gambar di atas adalah gambar rangkaian ESP8266 RGB LED, dimana gambar
tersebut menggambarkan tegangan dari usb yang diturunkan dari 5v ke 3.3v
berhubung karena ESP8266 beroperasi pada tegangan 3.3v. Dan juga terdapat
RGB LED yang terhubung ke GPIO0, GPIO2 dan GPIO1/UTXD. Adapun
komponen yang digunakan selain ESP8266 pada rangkaian ini adalah :

Tabel 3.2 Komponen ESP8266 RGB LED
No

Nama Komponen


Jumlah

1

ESP8266 v1

1

2

Mini USB

1

3

Capasitor 10uF

1


4

Capasitor non polar 104

1

5

AMS1117 3.3

1

6

RGB LED Katoda 4 kaki

1

7


Resistor 10k

2

8

Resistor 220

1

Universitas Sumatera Utara

27

3.3.3

ESP8266 Downloader Modul

Gambar 3.6 Rangkaian Downloader ESP8266 v1

Gambar diatas merupakan rangkaian downloader untuk ESP8266 v1. ESP8266
mempunyai 3 mode seperti digambar berikut ini :

Gambar 3.7 ESP8266 Opsi Booting

Terdapat dua switch yang berada dirangkaian yaitu switch reset dan switch
mode. Jika switch mode ditekan maka saat booting ESP8266 akan masuk mode
UART ( Universal Asynchronous Receiver/Transmiter ), namun jika switch tidak
ditekan makan ESP8266 dalam mode flash.

Universitas Sumatera Utara

28

3.4

Desain Program

Agar user tidak kesulitan mengakses aplikasi perlu interface yang user friendly,
maka dari itu penulis merencanakan sebuah tampilan halaman web dan mobile
yang sederhana tetapi tepat sasaran agar pengguna dapat menggunakan nya
dengan nyaman.

Gambar 3.8 Desain Halaman Dashboard

Gambar diatas adalah rancangan tamilan dashboard dimana user dapat
mengkontrol led secara realtime.

Universitas Sumatera Utara

BAB 4
IMPLEMENTASI SISTEM

4.1

Pembahasan Sistem Pengontrol Led

Implementasi IoT mengontrol led berbasis web ini adalah sebuah konsep dimana
konsep ini dapat digunakan dalam pembuatan banyak sistem di industri maupun
smart home.

Pada sistem yang dibuat, penulis menggunakan konsep jaringan start
dimana semua titik terhubung pada 1 jaringan/access point yang sama agar dapat
berhubungan 1 sama lain. Namun penguhubung antara titik-titik led yang dibuat
terdapat gateway yang menjembatani antara client dan ESP8266. Gateway hanya
bisa diakses oleh local network. Keuntungan menggunakan gateway ialah dalam
pemrograman di sisi client yang tidak perlu tahu bagaimana caranya ke setiap titik
ESP8266 namun hanya dengan berhubungan dengan gateway maka client bisa
memberi perintah kepada ESPP8266.

4.2

Implementasi Program

Implementasi ini dilakukan agar pemakai sistem dapat mengerti tentang
bagaimana cara bekerja dari sistem ini. Berikut adalah implementasi IoT
mengontrol led berbasis.

Universitas Sumatera Utara

30

4.2.1

Halaman Kontrol Panel LED

Berikut adalah halaman kontrol panel led yang diakses oleh client/user
menggunakan web browser pada laptop dan mobile.

Gambar 4.1 Halaman kontrol panel dari laptop

Gambar 4.2 Halaman kontrol panel dari mobile

Universitas Sumatera Utara

31

4.2.2

Infrastruktur Jaringan Sistem

Gambar 4.3 Infrastruktur jaringan

Gambar diatas menunjukkan infrastruktur jaringan yang dibuat pada sistem IoT
pengontrol led berbasis web. Penulis menggunakan konsep jaringan bintang
namun client hanya bisa berhubungan melalui gateway seperti tertera pada
gambar diatas.

Sistem pada gambar diatas hanya dilakukan pada jaringan lokal atau LAN
(Local Area Network) seperti yang dijelaskan sebelumnya. User dapat terhubung
ke access point dan gateway sebanyak ip yang tersedia di jaringan lokal.

Universitas Sumatera Utara

32

4.3

Uji Coba

Uji coba ini dilakukan untuk melihat perkembangan terakhir aplikasi yang telah
dibuat. Uji coba juga dilakukan sebagai sarana evaluasi sehingga dapat diketahui
letak kekurangan dan kesalahan yang mungkin terdapat didalamnya.

4.3.1

Persiapan

Dalam setiap sistem pada awal dihidupkan mempunya alur masing-masing.
Adapun alur persiapan yang harus dilakukan pada sistem IoT pengontrol led
berbasis web sebagai berikut :
a. Pastikan laptop yang merupakan gateway server sudah terkoneksi ke
access point dan selanjutnya jalankan gateway server.
b. Pastikan ketiga ESP8266 telah terhubung ke access point dan telah
melakukan handshaking koneksi socket kepada gateway.
c. Adapun cara mengetahui bahwa ESP8266 telah melakukang handshaking
koneksi socket kepada gateway dengan cara melihat log pada terminal
gateway yang sedang berjalan.
d. User dapat mengakses halaman kontrol panel led dan pastikan user telah
melakukan handshaking koneksi gateway.
e. Adapun cara mengetahuinya sama dengan poin c.

Universitas Sumatera Utara

33

4.3.1.1 Persiapan Gateway

Gambar 4.4 Koneksi Gateway

Pada gambar diatas kita dapat melihat bahwa gateway telah terkoneksi ke
access point. Pada interface wlp2s0 terdapat ip 192.168.43.82 sebagai ip gateway.

Gambar 4.5 Program gateway berjalan

Pada gambar diatas dilihat bahwa program gateway server telah berjalan dengan
indikator bahwa webserver sudah berjalan pada port 8080 sedangkat websocket
server berjalan pada port 8888.

Universitas Sumatera Utara

34

4.3.1.2 Persiapan ESP8266

Gambar 4.6 Handshaking ESP8266

Terlihat pada gambar diatas bahwa ketiga ESP8266 telah berhasil melakukan
handshaking koneksi socket ke gateway server.

4.3.1.3 Persiapan Client/User

Gambar 4.7 Handshaking Client

Terlihat pada gambar diatas bahwa client/user telah berhasil melakukan
handshaking koneksi socket ke gateway server.

Universitas Sumatera Utara

35

4.3.2

Uji Sistem

4.3.2.1 ESP8266 Dimmer

Gambar 4.8 LED redup

Gambar 4.9 Nilai led redup

Pada gambar 4.8 terlihat bahwa led redup setelah diberikan perintah
dengan nilai 10, seperti terlihat pada gambar 4.9.

Universitas Sumatera Utara

36

Gambar 4.10 LED terang

Gambar 4.11 Nilai led terang

Pada gambar 4.10 terlihat bahwa led menjadi terang setelah diberikan
perintah dengan nilai 87, seperti terlihat pada gambar 4.11. Ambang nilai yang
dapat diberikan kepada ESP8266 led dimmer ialah skala 1 – 100.

Universitas Sumatera Utara

37

4.3.2.2 ESP8266 Blinking

Gambar 4.12 Led blinking

Gambar 4.13 Nilai led blinking

Terlihat pada gambar 4.13 nilai waktu tunda untuk ESP8266 led blinking yaitu
200ms, yang secara default saat awal hidup yaitu 1000ms (1s).

Universitas Sumatera Utara

38

4.3.2.3 ESP8266 RGB LED

Gambar 4.14 LED merah

Gambar 4.15 Nilai range merah

Gambar 4.16 LED hijau

Universitas Sumatera Utara

39

Gambar 4.17 Nilai range hijau

Gambar 4.18 LED biru

Gambar 4.19 Nilai range biru

Universitas Sumatera Utara

40

Pada gambar 4.14 led merah hidup terang sebab pada kontrol panel led
untuk mengontrol led rgb, pada range merah diberikan nilai maksimal seperti pada
gambar 4.15. Sama seperti gambar 4.16 maupun gambar 4.18, led mendapatkan
nilai dari range input pada client.

Client mengirim nilai ambang 0 – 1023 ( 10 bit) tetapi terlihat 8 bit dalam
bentuk hexadecimal yang tampil pada user interface. Tampilan warna di user
interface yang seharusnya terjadi pada ESP8266 banyak tidak sesuai nya jika
digabungkan.

Universitas Sumatera Utara

BAB 5
KESIMPULAN DAN SARAN

5.1 Kesimpulan

Aplikasi Pengontrol LED berbasis Web merupakan sebuah sistem dimana konsep
yang digunakan ialah IoT (Internet of Things). Konsep internet of things
merupakan sebuah konsep yang memungkinkan kendali sebuah device melalui
internet. Tampilan aplikasi yang penulis buat telah memenuhi standart aplikasi
web desk yang baik : Keindahan, Komposisi, Simple, Fokus dan Konsisten.
Adapun Hasil dari implementasi sistem pengontrol led dengan Konsep Internet of
Things adalah :
a. Seseorang dapat mengetahui konsep Internet Of Things dengan lebih
interaktif melalui keluaran asli.
b. Menjadi bahan pertimbangan yang baik sekali bagi seseorang yang ingin
mengembangkan konsep internet of things pada industri, smart home,
maupun smart city.

5.2 Saran

Sistem pengontrol led berbasis web yang menggunakan konsep internet of things
ini masih jauh dari kata sempurna. Berikut ini ialah saran dari penulis untuk
pengembangan sistem pengontrol sesuatu berbasis web menggunakan konsep
IoT :

Universitas Sumatera Utara

42

a. Konsep Internet of Things seharusnya dapat diakses dari publik.
b. Penghidupan gateway server masih manual. Jadi jika ada mati listrik harus
dijalankan ulang secara manual.
c. Tidak adanya acknowledge apakah data yang dikirimkan client ke
gateway, gateway ke ESP8266 sampai dan telah dieksekusi.
d. Belum adanya sistem keamanan.

Universitas Sumatera Utara