Bingkai Foto OSD Face Aware: 11 Langkah (dengan Gambar)

2024 Pengarang: John Day | [email protected]. Diubah suai terakhir: 2024-01-30 11:07

Instructables ini menunjukkan cara membuat bingkai foto dengan Paparan Skrin (OSD) yang berwajah peka.

OSD dapat menunjukkan masa, cuaca atau maklumat internet lain yang anda mahukan.

Langkah 1: Mengapa Bingkai Foto OSD?

Saya mempunyai 2 projek jam foto di Instructables sebelum ini:

www.instructables.com/id/ESP32-Foto-Clock…

www.instructables.com/id/Arduino-BiJin-ToK…

Kedua-duanya mengambil foto dengan keindahan dan papan waktu dari Internet setiap minit dan dipaparkan di LCD.

Menampilkan keindahan itu bagus, tetapi semuanya asing bagi saya. Bagaimana dengan menggunakan gambar kegemaran peribadi dan menambah masa terkini dan maklumat segera di atasnya?

Projek ini meneroka cara membuatnya.

Langkah 2: Mengapa Wajah Sedar?

Mari kita periksa cara menambahkan maklumat segera OSD ke foto terlebih dahulu:

1. Pilih foto secara rawak dari folder tertentu
2. Dapatkan semula masa
3. Dapatkan maklumat segera dari Internet
4. lukiskan masa dan maklumat segera pada foto

Langkah 1-3 adalah lurus ke hadapan; Langkah 4 juga kelihatan mudah, tetapi tentukan tempat menggambar teks tidak begitu mudah.

Sekiranya saiz teks terlalu kecil, sukar dibaca dalam jarak yang munasabah; Sekiranya ukuran teks terlalu besar, kemungkinan besar akan merangkumi objek foto. Terutama jika ia adalah gambar potret, teks yang ditutupi wajah tidak disukai.

Oleh kerana kedudukan wajah untuk setiap foto tidak sama, untuk mengelakkan wajah yang dilindungi OSD, kita memerlukan proses pengesanan wajah terlebih dahulu. Kemudian kita dapat mencari kawasan tanpa muka untuk menarik teks.

Langkah 3: Reka bentuk 2 peringkat

Proses pengesanan wajah memerlukan kekuatan pemprosesan, sebaliknya, bingkai foto boleh menjadi sangat ringan. Oleh itu, saya membahagikannya kepada 2 peringkat:

Pelayan

Mesin foto yang berwajah adalah pelayan aplikasi Node.js. Untuk setiap permintaan HTTP, ia akan:

1. Pilih foto dari folder foto secara rawak
2. Pengesanan wajah
3. tentukan kawasan muka atau muka yang paling tidak
4. Pada masa yang sama, dapatkan cuaca atau maklumat segera berguna lain dari Internet pada setiap jangka masa tertentu
5. Lukiskan masa dan maklumat segera pada foto
6. Kembalikan foto dengan OSD dalam format JPEG sebagai respons

Pelanggan

Pelanggan boleh menjadi penyemak imbas web, applet atau peranti IoT.

Cth. ESP32 dev boasrd dengan LCD 2-4 inci sangat sesuai untuk meletakkan di desktop sebagai bingkai foto kecil.

Langkah 4: Tetapkan Pilihan Pelayan Foto 1: Imej Docker

Untuk kemudahan, saya telah membina imej Docker untuk pelayan aplikasi OSD Node.js foto yang berwajah.

Sekiranya anda belum menyediakan Docker, ikuti panduan Docker Bermula:

www.docker.com/get-started

Kemudian jalankan arahan berikut: (ganti / jalan / ke / foto ke jalur foto anda sendiri)

docker run -p 8080: 8080 -v / path / to / photo: / app / photo moononournation / face-sedar-photo-osd: 1.0.1

Uji dengan melayari https:// localhost: 8080 /

Anda mungkin mendapati waktu memaparkan tidak berada di zon waktu anda:

docker run -p 8080: 8080 -e TZ = Asia / Hong_Kong -v / path / to / photo: / app / photo moononournation / face-sedar-photo-osd: 1.0.1

Sekiranya anda tinggal di Hong Kong seperti saya, anda boleh menambah maklumat cuaca Hong Kong:

docker run -p 8080: 8080 -e TZ = Asia / Hong_Kong -e OSD = HK_Weather -v / path / to / photo: / app / photo moononournation / face-sedar-photo-osd: 1.0.1

Sekiranya anda ingin mengembangkan maklumat OSD anda sendiri:

mkdir -p ~ / git

cd ~ / git git clone https://github.com/moononournation/face-aware-photo-osd.git docker run -it -p 8080: 8080 -e TZ = Asia / Hong_Kong -e OSD = HK_Weather -e DEBUG = Y -v / jalan / ke / foto: / aplikasi / foto -v ~ / git / wajah-sedar-foto-osd / aplikasi.js: /app/app.js moononournation / wajah-sedar-foto-osd: 1.0. 1

Ubah fungsi update_osd () di app.js untuk menyesuaikan maklumat OSD anda sendiri. Selepas pembangunan, hapus persekitaran DEBUG = Y dari perintah docker.

Langkah 5: Tetapkan Pilihan Pelayan Foto 2: Bina Dari Sumber

Sekiranya anda biasa menggunakan Node.js, anda boleh membina pelayan aplikasi dari sumber.

Dapatkan sumbernya:

git klon

Pasang pakej:

cd muka-sedar-foto-osd

pasang npm

Buat folder foto dan salin foto anda sendiri ke folder.

Jalankan pelayan aplikasi:

aplikasi nod.js

Langkah 6: Pilihan Pelanggan 1: Penyemak Imbas Web

Cukup penyemak imbas ke https:// localhost: 8080 /

Halaman itu ditulis secara automatik memuatkan gambar ukuran halaman yang sesuai setiap minit.

P. S. Sekiranya anda menyemak imbas dari mesin lain yang tidak menjalankan pelayan aplikasi, ingatlah ubah localhost ke nama hos pelayan aplikasi atau alamat IP.

Langkah 7: Pilihan Pelanggan 2: ESP32 + LCD

Pelanggan bingkai foto semudah papan dev ESP32 dan LCD.

Berikut adalah perkakasan yang diperlukan:

Papan Dev ESP ESP32

Mana-mana papan dev ESP32 pasti baik, kali ini saya menggunakan papan yang dipanggil MH-ET LIVE.

Paparan LCD

Sebarang LCD Arduino_GFX yang disokong, anda mungkin dapati paparan yang disokong pada GitHub readme:

github.com/moononournation/Arduino_GFX

Kawat Jumper

Beberapa Jumper Wires, bergantung pada susunan papan dev dan pin LCD. Dalam kebanyakan kes, 6-9 wayar pelompat wanita ke wanita sudah cukup.

Papan LCD

Beberapa sokongan membantu LCD berdiri tegak, kali ini saya menggunakan pemegang kad.

Langkah 8: Pemasangan LCD ESP32 +

ESP32 dengan pin header di bahagian atas lebih disukai. Sekiranya header pin di bahagian bawah, letakkan papan terbalik;>

Sambungkan ESP32 dan LCD dengan wayar pelompat, kemudian pasangkannya ke dudukan.

Berikut adalah contoh ringkasan sambungan:

ESP32 -> LCD

Vcc -> Vcc GND -> GND GPIO 5 -> CS GPIO 27 -> DC (jika ada) GPIO 33 -> RST GPIO 18 -> SCK GPIO 19 -> MISO (pilihan) GPIO 22 -> LED (jika ada) GPIO 23 -> MOSI / SDA

Langkah 9: Perisian ESP32 + LCD

Arduino IDE

Muat turun dan pasang Arduino IDE jika anda belum melakukannya:

www.arduino.cc/en/main/software

Sokongan ESP32

Ikuti Arahan Pemasangan untuk menambahkan sokongan ESP32 jika anda belum melakukannya:

github.com/espressif/arduino-esp32

Perpustakaan Arduino_GFX

Muat turun perpustakaan Arduino_GFX terkini: (tekan "Klon atau Muat turun" -> "Muat turun ZIP")

github.com/moononournation/Arduino_GFX

Import perpustakaan di Arduino IDE. (Arduino IDE "Sketch" Menu -> "Include Library" -> "Add. ZIP Library" -> pilih fail ZIP yang dimuat turun)

Susun & Muat Naik

1. Buka Arduino IDE
2. Buka kod contoh ESP32PhotoFrame ("File" -> "Contoh" -> "Perpustakaan GFX untuk Arduino" -> "WiFiPhotoFrame")
3. Isi tetapan AP WiFi anda ke SSID_NAME dan SSID_PASSWORD
4. Ganti nama host pelayan atau IP dan port anda dalam HTTP_HOST dan
5. Tekan butang "Muat naik" IDE Arduino
6. Sekiranya anda mendapati orientasi tidak betul, ubah nilai "putaran" (0-3) dalam kod kelas baru

Langkah 10: Nikmati Foto

Sudah tiba masanya untuk meletakkan bingkai foto IoT di desktop anda dan nikmati!

Langkah 11: Apa Seterusnya?

• Tambahkan maklumat segera anda sendiri
• Selaraskan ukuran foto sumber untuk ketepatan pengesanan wajah yang lebih baik
• Tugas automatik untuk meletakkan foto terkini ke folder foto pelayan
• Ambil lebih banyak gambar;>