Daftar Isi:

Dudukan Botol Berinteraksi Musik Dengan Lampu yang Dapat Disesuaikan: 14 Langkah
Dudukan Botol Berinteraksi Musik Dengan Lampu yang Dapat Disesuaikan: 14 Langkah

Video: Dudukan Botol Berinteraksi Musik Dengan Lampu yang Dapat Disesuaikan: 14 Langkah

Video: Dudukan Botol Berinteraksi Musik Dengan Lampu yang Dapat Disesuaikan: 14 Langkah
Video: Memakai layar sentuh tanpa perlu menyentuh - CLICK | BBC News Indonesia 2024, Juli
Anonim
Image
Image
Stand Botol Interaksi Musik Dengan Lampu yang Dapat Disesuaikan
Stand Botol Interaksi Musik Dengan Lampu yang Dapat Disesuaikan
Stand Botol Interaksi Musik Dengan Lampu yang Dapat Disesuaikan
Stand Botol Interaksi Musik Dengan Lampu yang Dapat Disesuaikan

Beberapa waktu yang lalu, seorang teman saya memesan cincin LED 16 Bit untuk bermain-main, dan saat melakukannya dia mendapat ide untuk meletakkan botol di atasnya. Ketika saya melihatnya, saya terpesona oleh tampilan cahaya yang menerangi labu dan teringat proyek mengagumkan "Mc Lighting" oleh pengguna Hackaday Tobias Blum:

hackaday.io/project/122568-mc-lighting

Salah satu aspek dari proyeknya adalah mengontrol LED WS2812 melalui antarmuka web yang ditulis sendiri tanpa menggunakan layanan eksternal apa pun. Terinspirasi oleh pendekatannya dalam mengendalikan cincin LED, saya memutuskan untuk menggabungkan kedua ide tersebut dan membawanya ke tingkat berikutnya. Dalam pikiran saya, saya memiliki dudukan botol hingga tiga botol, dapat dikontrol melalui halaman web lokal, menampilkan beberapa petir mode termasuk yang berinteraksi dengan musik ambient. Untuk membuat perangkat portabel, perangkat ini didukung oleh sel baterai Li-Ion.

Dalam instruksi ini saya akan melalui proses pembangunan dan mengajari Anda tentang fungsi dasarnya. Setelah itu Anda harus dapat membuat versi Anda sendiri dan memiliki ide tentang cara menambahkan kontrol web ke proyek tanpa menggunakan layanan eksternal apa pun.

Langkah 1: Opsi Bangunan

Ketika datang ke elektronik proyek ini, Anda dapat menggunakan papan NodeMCU, yang mudah digunakan dan cukup murah, atau Anda dapat membuat papan Anda sendiri seperti saya. Tidak ada manfaat khusus dalam melakukannya, saya hanya memiliki chip ESP8226-12E yang tergeletak di sekitar dan memutuskan untuk menggunakannya sehingga saya dapat menyimpan papan NodeMCU untuk pembuatan prototipe cepat. Hanya ada satu perbedaan utama: Anda memerlukan USB 3.3V ke papan Serial untuk memprogram papan pengontrol buatan sendiri. Meskipun demikian, tidak ada bedanya jenis apa yang Anda pilih, hanya perlu diingat ketika datang ke bagian yang diperlukan.

Ada opsi yang cukup membuat perbedaan: mode musik. Jika Anda memutuskan untuk memasukkannya, dudukan botol dapat digunakan sebagai VU-meter dan selanjutnya dapat mengubah warna LED setiap kali bass musik mencapai ambang batas tertentu. Ini membutuhkan beberapa perangkat keras tambahan. Anda harus membangun amplifier yang memperkuat output dari kapsul mikrofon kondensor dan filter lowpass untuk frekuensi bass. Meskipun ini mungkin terdengar sulit, sebenarnya tidak. Itu tidak memerlukan bagian khusus dan saya sangat menyarankan untuk menyertakan sirkuit ini karena ini meningkatkan perangkat cukup banyak.

Langkah 2: Suku Cadang dan Bahan yang Diperlukan

Bagian dan Bahan yang Diperlukan
Bagian dan Bahan yang Diperlukan

Kasus:

Mungkin bagian tersulit dari proyek ini adalah kasusnya. Karena saya ingin mencoba sesuatu yang baru, saya memutuskan untuk menggunakan pelat MDF dengan ketebalan 18 mm dan mengecatnya. Dibandingkan dengan jenis kayu/bahan lain, MDF memiliki kelebihan yaitu permukaannya dapat diampelas dengan sangat halus sehingga cat di atasnya dapat terlihat sangat mengkilap. Selain itu, Anda memerlukan beberapa kaca akrilik dengan ketebalan 4 mm sebagai penutup cincin LED.

Kasing memiliki panjang 33 cm dan lebar 9 cm, jadi saya merekomendasikan piring dengan dimensi berikut:

Pelat MDF 400 x 250 x 18 mm

Penutup cincin LED memiliki diameter sekitar 70 mm, jadi pelat kaca akrilik Anda setidaknya harus memiliki dimensi berikut:

Plat akrilik 250 x 100 x 4 mm

Untuk mengecatnya saya mendapatkan 125ml cat akrilik putih dan 125ml clearcoat glossy. Selanjutnya saya sarankan Anda untuk menggunakan roller busa karena ini memungkinkan Anda untuk mengaplikasikan cat lebih merata. Untuk bagian pengamplasan saya menggunakan lembaran amplas dengan grit 180, satu dengan 320 dan satu dengan 600.

Elektronik:

Untuk elektronik, Anda memerlukan tiga cincin LED WS2812 16 Bit. Berhati-hatilah karena saya menemukan dua jenis cincin LED 16 Bit, Anda memerlukan cincin dengan diameter lebih besar (sekitar 70 mm), dan oleh karena itu jarak antara LED lebih besar.

Untuk catu daya, Anda memerlukan sel baterai Li-Ion, pengisi daya yang sesuai, dan sakelar. Selain itu, Anda memerlukan pengatur tegangan 3,3 V dengan tegangan putus rendah (LDO) dan dua kapasitor untuk memberi daya pada mikrokontroler. Saya menjelaskan mengapa Anda memerlukan regulator LDO pada langkah 7.

Jika Anda memutuskan untuk membangun penguat musik dan rangkaian filter opsional, Anda memerlukan Op-Amp dan beberapa komponen pasif. Dan jika Anda memilih untuk membuat unit kontrol Anda sendiri, Anda memerlukan chip ESP, papan breakout, beberapa resistor, tombol, dan beberapa pin.

Dan saya sangat merekomendasikan sepotong perfboard untuk menyolder semua yang ada di atasnya.

cincin LED

Sel Li-Ion 3.7V (Saya menyelamatkan salah satu jenis TW18650 dari baterai yang tidak digunakan)

Pengisi Daya Li-Ion

Switch (Tidak ada yang istimewa, saya menggunakan yang lama yang saya selamatkan dari set speaker yang rusak)

Regulator tegangan LDO (tambahan kapasitor yang disebutkan dalam lembar data: kapasitor keramik 2 x 1uF)

papan perf

Sirkuit musik (opsional):

Menurut skema

Mikrokontroler:

NodeMCU

ESP8266 12E (pelat adaptor, tombol, resistor dan pin sesuai skema)

USB to Serial (diperlukan untuk memprogram papan pengontrol buatan sendiri, jika Anda sudah memilikinya, tidak perlu mendapatkan yang lain)

Langkah 3: Penggilingan Kasus

Penggilingan Kasus
Penggilingan Kasus
Penggilingan Kasus
Penggilingan Kasus
Penggilingan Kasus
Penggilingan Kasus

Seorang teman saya membuat sendiri MP-CNC dan sangat baik untuk menggiling saya dua bagian MDF dan tiga cincin akrilik. Bagian kayu adalah bagian atas dan bawah kotak berbentuk pil. Di atas kotak, ada tiga tempat untuk cincin LED dan penutup akriliknya. Karena pendalaman ini dirancang untuk menjadi hanya sebagian kecil lebih besar dari PCB, mereka pas dan duduk di tempatnya tanpa perlu lem atau sekrup. Hal yang sama berlaku untuk penutup akrilik. Karena mereka memiliki diameter yang lebih besar dari cincin LED, mereka ditempatkan di tepi di atas LED (lihat gambar).

Langkah 4: Selesaikan Kasusnya

Selesaikan Kasusnya
Selesaikan Kasusnya
Selesaikan Kasusnya
Selesaikan Kasusnya
Selesaikan Kasusnya
Selesaikan Kasusnya
Selesaikan Kasusnya
Selesaikan Kasusnya

Anda mungkin telah memperhatikan bahwa saat ini, ada beberapa hal yang hilang pada kasus yang digiling. Hal-hal seperti lubang untuk kabel cincin, lubang untuk soket USB dan saku untuk baterai. Selain itu, jika Anda memilih untuk menyertakan sirkuit musik, lubang untuk mikrofon juga diperlukan. Selain itu, saya menyarankan Anda untuk mengebor lubang di bawah Cincin LED sehingga Anda dapat mendorongnya keluar dari casing. Saya menggunakan alat gerinda putar untuk menambahkan lubang yang dijelaskan di atas.

Pada gambar ketiga, Anda dapat melihat "pemeliharaan" dan lubang kabel untuk cincin. Seperti yang mungkin sudah Anda perhatikan, saya membuat dua lubang kabel. Ini tidak sengaja. Ini pada tahap awal di mana saya pikir sudut cincin akan menjadi tidak penting, tetapi ternyata tidak. Pasang ketiganya dengan kabel di sisi yang sama. Saya akhirnya memasangnya ke sisi depan.

Penting: Selalu kenakan masker debu saat menggergaji, mengebor, atau menggiling ke dalam MDF. Sama berlaku untuk pengamplasan itu.

Langkah 5: Menyelesaikan Kasus

Menyelesaikan Kasus
Menyelesaikan Kasus
Menyelesaikan Kasus
Menyelesaikan Kasus
Menyelesaikan Kasus
Menyelesaikan Kasus

Sekarang kasingnya dicat. Sebelum Anda melakukan ini, saya sarankan Anda menonton atau membaca tutorial tentang ini, karena ini terbukti lebih sulit daripada yang saya kira. Yang ini mencakup semua yang perlu Anda ketahui tentang topik tersebut.

Pertama, amplas bagian luar MDF secara menyeluruh. Saya menggunakan kertas grit 160 untuk ini. Setelah itu, banyak tutorial merekomendasikan untuk menyegel permukaan, terutama di tepinya, dengan primer MDF khusus. Saya melewatkan bagian ini karena primernya cukup mahal dan, meskipun hasilnya tidak sebagus yang seharusnya, saya akan melakukannya lagi.

Setelah itu, Anda dapat mulai mengecat permukaan dengan warna yang Anda inginkan. Saya memutuskan untuk mengecat milik saya dengan warna putih bersih. Tunggu hingga warna mengering, lalu amplas dengan amplas halus (saya menggunakan grit 320), bersihkan dan aplikasikan lapisan warna berikutnya. Ulangi proses ini sampai Anda puas dengan opacity pewarnaan. Saya menerapkan empat lapisan warna.

Setelah lapisan warna terakhir, amplas dengan amplas yang lebih halus dari sebelumnya (dalam kasus saya grit 600) dan bersihkan semua debu yang tersisa di permukaan. Setelah itu Anda bisa mengaplikasikan lapisan pertama dari clearcoat glossy. Seperti halnya warna, aplikasikan lapisan sebanyak yang dibutuhkan untuk memuaskan Anda. Saya menggunakan tiga untuk bagian atas dan samping, dan dua untuk bagian bawah. Anda dapat melihat hasilnya di salah satu gambar. Meskipun permukaannya bisa lebih halus (lebih banyak pengamplasan dan primer MDF), saya senang dengan efek kilap yang dicapai.

Langkah 6: Mempersiapkan Cincin

Mempersiapkan Cincin
Mempersiapkan Cincin
Mempersiapkan Cincin
Mempersiapkan Cincin

Sejajar dengan proses pengeringan lapisan warna pertama, Anda dapat mengampelas cincin kaca akrilik. Setelah itu cincin-cincin ini menyebarkan cahaya yang dipancarkan oleh Cincin-LED. Omong-omong, saya mengalami PCB cincin ini memiliki beberapa tepi yang tidak diinginkan yang tersisa dari proses produksi, jadi Anda mungkin perlu men-debug mereka. Jika tidak, mereka tidak akan cocok dengan kasing.

Setelah itu, beberapa kabel perlu disolder ke cincin. Saya sarankan Anda menggunakan kabel fleksibel. Saya menggunakan yang kaku dan memiliki masalah bahwa mereka mendorong dua bagian kasing terpisah, yang membutuhkan pembengkokan yang buruk. Selain itu, kawat kaku lebih cenderung putus yang menghasilkan proses penyolderan yang buruk karena Anda harus mengeluarkan cincin yang sesuai dan papan pengontrol dari kasing.

Langkah 7: Catu Daya

Sumber Daya listrik
Sumber Daya listrik

Satu sel baterai Li-Ion digunakan sebagai sumber daya. Itu diisi melalui sirkuit pengisi daya. Sirkuit ini memiliki fitur over discharge dan over current protection. Untuk mematikan perangkat, sebuah sakelar, yang mengganggu keluaran positif papan pengisi daya, terpasang di dalamnya.

Karena tegangan maksimum sel baterai adalah 4.2V, ESP8266 tidak dapat diberi daya secara langsung. Tegangan terlalu tinggi untuk mikrokontroler 3.3V karena hanya bertahan tegangan antara 3.0V - 3.6V. Low dropout voltage regulator (LDO) adalah pengatur tegangan yang bekerja walaupun tegangan input mendekati tegangan output yang ditentukan. Jadi, tegangan putus 200 mV untuk 3.3V LDO berarti, bahwa output 3.3V selama tegangan input di atas 3.5V. Ketika undershoots nilai ini, tegangan output mulai menurun. Karena ESP8266 bekerja dengan voltase turun ke 3.0V, jadi ia bekerja sampai voltase input LDO turun ke sekitar 3.3V (penurunannya tidak linier). Ini memungkinkan kita untuk menyalakan pengontrol melalui sel baterai sampai benar-benar habis.

Langkah 8: Papan Mikrokontroler

Papan Mikrokontroler
Papan Mikrokontroler

Jika Anda menggunakan papan NodeMCU, langkah ini cukup sederhana. Cukup sambungkan output 3.3V dan ground catu daya ke salah satu pin papan 3V dan G. Selain itu, saya sarankan menyolder papan ke sepotong papan berlubang, karena ini memudahkan untuk menghubungkan semuanya.

Jika Anda memutuskan untuk membuat papan pengontrol sendiri, langkah pertama adalah menyolder chip ESP ke pelat adaptor. Setelah itu, tambahkan semua komponen dan koneksi seperti yang ditunjukkan pada skema. Kedua tombol diperlukan untuk mengatur ulang dan mem-flash pengontrol. Anda mungkin memperhatikan pada gambar berikut bahwa saya hanya menggunakan satu tombol. Alasannya karena saya baru saja menemukan satu yang tergeletak di sekitar, jadi alih-alih tombol untuk GPIO0, saya menggunakan dua pin dan jumper.

Anda dapat melihat rangkaian saya yang sudah selesai di langkah berikutnya.

Langkah 9: Sirkuit Musik (opsional)

Sirkuit Musik (opsional)
Sirkuit Musik (opsional)
Sirkuit Musik (opsional)
Sirkuit Musik (opsional)
Sirkuit Musik (opsional)
Sirkuit Musik (opsional)

Sebagai masukan untuk musik digunakan kapsul mikrofon kondensor sederhana. Ini didukung melalui resistor pembatas arus yang terhubung ke rel daya 3.3V. Singkatnya, kapsul bekerja seperti kapasitor, jadi ketika gelombang suara mengenai diafragmanya, kapasitasnya, dan analog dengan tegangannya, berubah. Tegangan ini sangat rendah sehingga kami hampir tidak dapat mengukurnya dengan ESP analog to digital converter (ADC). Untuk mengubah ini, kami memperkuat sinyal dengan Op-Amp. Tegangan keluaran yang diperkuat kemudian disaring oleh filter lowpass pasif orde pertama dengan frekuensi cut-off sekitar 70Hz.

Jika Anda memutuskan untuk menggunakan papan NodeMCU, Anda dapat menghubungkan output dari rangkaian yang dijelaskan di atas ke pin A0 papan. Jika Anda ingin membuat papan pengontrol sendiri, Anda harus menambahkan pembagi tegangan ke sirkuit. Alasannya adalah ESP onboard ADC yang memiliki tegangan input maksimum 1V. NodeMCU memiliki pembagi tegangan ini sudah terpasang, jadi agar kode dan amplifier berfungsi di kedua papan, yang dibuat sendiri juga membutuhkannya.

Langkah 10: Selesai dan Pasang Elektronik

Selesai dan Pasang Elektronik
Selesai dan Pasang Elektronik
Selesai dan Pasang Elektronik
Selesai dan Pasang Elektronik
Selesai dan Pasang Elektronik
Selesai dan Pasang Elektronik

Pertama, masukkan cincin LED ke lubang yang ditentukan di bagian atas kasing. Setelah itu, sambungkan catu daya, mikrokontroler, cincin dan, jika Anda membuatnya, rangkaian penguat sesuai dengan skema.

Peringatan: Sebelum Anda melakukannya, periksa kembali apakah Anda mematikan daya menggunakan sakelar. Saya lupa melakukannya dan menggoreng regulator LDO saat menyolder. Setelah itu, Anda siap memasang elektronik di dalam casing.

Saya mulai dengan menempelkan sel baterai ke kasing dengan lem panas. Setelah itu saya memposisikan sirkuit pengisi daya dan memeriksa apakah saya bisa mencolokkan kabel USB atau tidak. Karena saya tidak mempercayai lem panas untuk menahan kekuatan mendorong kabel beberapa kali, saya dengan hati-hati memalu paku tipis melalui bantalan solder pengisi daya untuk tegangan input. Setelah pengisi daya, saya menempelkan kapsul mikrofon di tempatnya.

Setelah itu saya menggunakan beberapa pin kawat bengkok untuk memperbaiki mikrokontroler. Metode ini memungkinkan saya mengeluarkan pengontrol dari kasing untuk diperbaiki kapan pun saya perlu tanpa perlu memotong lem panas dan merusak MDF.

Sekarang, saya menggunakan beberapa ikatan kabel dan pin kawat bengkok untuk memasang kabel. Hal terakhir yang harus dilakukan adalah memasukkan cincin penutup akrilik. Berhati-hatilah saat melakukannya, sehingga Anda tidak merusak cat karena ini cukup ketat. Anda bahkan mungkin telah mengurangi diameter bagian dalam dan/atau luar cincin akrilik karena papan MDF menyerap beberapa cat sehingga bagian dalamnya menjadi sedikit lebih kecil.

Langkah 11: Mem-flash Mikrokontroler

Mem-flash Mikrokontroler
Mem-flash Mikrokontroler

Setelah menyelesaikan pembuatan perangkat keras, yang tersisa hanyalah mem-flash perangkat lunak. Saya menggunakan Arduino IDE untuk itu. Tetapi sebelum Anda dapat memprogram pengontrol, Anda perlu menambahkan beberapa perpustakaan dan memilih papan yang tepat.

Perpustakaan

Anda dapat menggunakan Manajer Perpustakaan IDE (Sketsa -> Sertakan Perpustakaan -> Perpustakaan Kudis) untuk menambahkannya, atau Anda mengunduh dan memindahkannya ke folder perpustakaan IDE Anda. Saya merekomendasikan manajer karena lebih nyaman, dan Anda dapat menemukan semua perpustakaan yang diperlukan di sana.

DNSServer oleh Kristijan Novoselic (diperlukan untuk WiFiManager)

WiFiManager oleh tzapu dan tablatronix (membuka AP tempat Anda dapat memasukkan kredensial WiFi lokal Anda)

WebSockets oleh Markus Sattler (diperlukan untuk komunikasi antara perangkat pengguna dan bottlestand)

Adafruit NeoPixel oleh Adafruit (diperlukan untuk mengontrol cincin LED)

Papan

Apa pun jenis papan pengontrol yang Anda pilih untuk digunakan, di bawah Tools -> Board pilih NodeMCU 1.0 (ESP-12E Module). Pastikan ukuran flash diatur ke 4M (1M SPIFFS) dan kecepatan unggah ke 115200.

Berkedip

Untuk mem-flash papan NodeMCU cukup sambungkan ke komputer Anda, pilih port yang benar dan unggah program. Mem-flash papan pengontrol buatan sendiri sedikit lebih rumit. Hubungkan konverter USB ke Serial Anda ke tiga pin papan. Hubungkan GND dan GND, RX dan TX, dan TX dan RX. Untuk masuk ke mode lampu kilat pengontrol, mulai ulang dengan tombol RST dan sambil terus menekan tombol GPIO0. Setelah itu pastikan papan konverter Anda diatur ke 3.3V. Selesaikan proses dengan mengunggah program.

Penting: Nyalakan perangkat Anda sebelum melakukan flashing.

Langkah 12: Unggah Halaman Web

Unggah Halaman Web
Unggah Halaman Web
Unggah Halaman Web
Unggah Halaman Web
Unggah Halaman Web
Unggah Halaman Web

File yang diperlukan untuk halaman web disimpan di memori flash mikrokontroler. Sebelum penggunaan pertama, Anda harus mengunggahnya secara manual. Untuk melakukannya, hidupkan perangkat (mungkin Anda harus mengisi dayanya terlebih dahulu). LED harus bersinar merah (karena kamera saya ini terlihat seperti oranye pada gambar), yang berarti dudukan botol tidak terhubung ke jaringan. Setelah beberapa saat, titik akses WiFi bernama "bottleStandAP" akan terbuka. Kata sandi default adalah "12345678", Anda dapat mengubahnya di file ino. Hubungkan smartphone/tablet/laptop Anda ke sana. Pemberitahuan akan muncul dan meneruskan Anda ke halaman web. Jika hal seperti ini tidak terjadi, cukup buka browser Anda dan ketik 192.168.4.1. Di halaman ini, klik Konfigurasikan WiFi dan masukkan kredensial jaringan Anda. Setelah itu, titik akses akan ditutup dan LED berubah warna menjadi biru muda. Ini berarti perangkat telah berhasil terhubung ke jaringan Anda.

Sekarang Anda harus menentukan alamat IP perangkat. Untuk melakukannya, Anda dapat menghubungkannya ke komputer Anda, buka Serial Monitor Arduino IDE (baud rate 115200) dan restart perangkat. Atau Anda dapat membuka halaman web router WiFi Anda. Setelah Anda mengetahui IP perangkat, buka browser Anda dan ketik xxx.xxx.xxx.xxx/upload (di mana xs adalah singkatan dari IP bottlestands). Ekstrak file dari.rar dan unggah semuanya. Setelah itu ketikkan saja IP perangkat Anda dan halaman kontrol akan terbuka. Dan dengan itu, Anda telah selesai membangun tempat botol Anda sendiri. Selamat!

Langkah 13: Halaman Web

Halaman Web
Halaman Web
Halaman Web
Halaman Web

Halaman web memungkinkan Anda untuk mengontrol dudukan botol Anda. Saat Anda membuka halaman utama, Anda dapat melihat tiga lingkaran biru di bagian tengah atas. Ini memungkinkan Anda untuk memilih pengaturan dering mana yang ingin Anda ubah. Roda warna mengubah warna cincin yang dipilih saat Anda mengkliknya. Bidang di bawah ini menunjukkan warna yang Anda pilih. Dengan menekan tombol acak, cincin yang dipilih diatur ke mode warna acak. Ini berarti bahwa warna berubah setiap kali siklus mode nafas selesai.

Pada halaman kedua Anda dapat memilih mode yang berbeda. Warna tetap dan kecerahan tetap melakukan persis seperti namanya. Mode nafas menciptakan efek "nafas", yang berarti kecerahan cincin meningkat selama waktu khusus hingga maksimum, lalu menurun ke minimum. Mode siklus hanya menyalakan satu LED untuk waktu tertentu, lalu menyalakan berikutnya, lalu berikutnya dan seterusnya. Mode ambang batas musik mengubah warna setiap kali mikrofon mendeteksi sinyal lebih tinggi dari ambang batas yang ditetapkan khusus. Tidak hanya musik yang bisa memicu hal ini, tepuk tangan misalnya juga bisa. Dalam mode VU meter, jumlah LED yang menyala tergantung pada volume bass musik.

Catatan: Anda dapat menggunakan penggaris tanpa mengaktifkan mode yang sesuai. Misalnya: Jika Anda menggunakan mode siklus dan mengubah kecerahan melalui penggaris kecerahan tetap, cincin akan tetap berada dalam mode siklus tetapi mengubah kecerahannya sesuai dengan yang Anda atur.

Langkah 14: Bagaimana Semua Ini Bekerja?

Prinsip fungsional cukup mudah dipahami. Setiap kali Anda membuka halaman web, ESP8266 mengirimkan file web ke perangkat Anda. Kemudian, ketika Anda mengubah sesuatu di halaman, karakter khusus, sebagian besar diikuti oleh nilai integer, dikirim ke mikrokontroler melalui koneksi websocket. Pengontrol kemudian memproses data ini dan mengubah lampu sesuai dengan itu.

Komponen web ditulis dalam html, css dan javascript. Untuk mempermudah tugas ini, saya membuat kerangka kerja Materialize CSS dan jQuery. Jika Anda ingin mengubah tampilan situs web, lihat dokumentasi kerangka kerja. Atau, Anda cukup menulis halaman Anda sendiri dan mengunggahnya. Anda hanya perlu membuat koneksi websocket dan mengirim data yang sama.

Direkomendasikan: