Fotorámeček OSD Face Aware: 11 kroků (s obrázky)

2024 Autor: John Day | [email protected]. Naposledy změněno: 2024-01-30 08:19

Tento návod ukazuje, jak vytvořit fotorámeček s funkcí OSD (On Screen Display) s rozpoznáváním tváře.

OSD může zobrazovat čas, počasí nebo jiné požadované internetové informace.

Krok 1: Proč OSD fotorámeček?

Mám 2 projekty hodin fotografií na Instructables před:

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

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

Oba každou minutu získají z internetu fotografii s kráskami a časovou tabulkou a zobrazí ji na displeji LCD.

Ukazování krásek je dobré, ale všechny mi jsou cizí. Co takhle použít osobní oblíbené fotografie a přidat k nim aktuální čas a další okamžité informace?

Tento projekt zkoumá, jak to udělat.

Krok 2: Proč Face Aware?

Pojďme se nejprve podívat, jak na fotografii přidat okamžité informace OSD:

1. Náhodně vyberte fotografii z konkrétní složky
2. Načíst čas
3. Načíst okamžité informace z internetu
4. nakreslete čas a okamžité informace na fotografii

Krok 1-3 je přímý; Krok 4 také vypadá jednoduše, ale určit, kam text nakreslit, není tak snadné.

Pokud je velikost textu příliš malá, je těžké ji přečíst v rozumné vzdálenosti; Pokud je velikost textu příliš velká, s největší pravděpodobností pokrývá fotografické objekty. Zvláště pokud se jedná o portrétní fotografii, není upřednostňován text pokrytý obličeji.

Protože pozice tváří pro každou fotografii není stejná, abychom se vyhnuli obličejům pokrytým OSD, potřebujeme nejprve proces detekce obličeje. Poté můžeme najít oblast bez tváře pro nakreslení textu.

Krok 3: 2úrovňový design

Proces detekce obličeje vyžaduje určitý výpočetní výkon, naopak fotorámeček může být velmi lehký. Rozdělil jsem to tedy na 2 úrovně:

Server

Tváří v tvář fotografický engine je aplikační server Node.js. Pro každý požadavek HTTP bude:

1. Vyberte fotografii ze složky fotografií náhodně
2. Detekce obličeje
3. určete oblast bez tváře nebo nejmenších ploch
4. Mezitím v každém určitém období načítejte informace o počasí nebo jiné užitečné okamžité informace z internetu
5. Nakreslete na fotografii čas a okamžité informace
6. Vraťte fotografii s OSD ve formátu JPEG jako odpověď

Klient

Klientem může být webový prohlížeč, applet nebo zařízení IoT.

Např. ESP32 dev boasrd s 2–4 palcovým LCD je velmi vhodný pro umístění na plochu jako malý fotorámeček.

Krok 4: Nastavení serveru fotografií Možnost 1: Docker Image

Pro pohodlí jsem předpřipravil obrázek Dockeru pro aplikační server OSD Node.js s fotografií s vědomím tváře.

V případě, že Docker ještě nenastavujete, postupujte podle průvodce Docker Get Started:

www.docker.com/get-started

Potom spusťte následující příkaz: (replace/path/to/photo to your own photo path)

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

Vyzkoušejte to na adrese https:// localhost: 8080/

Můžete zjistit, že zobrazovaný čas není ve vašem časovém pásmu:

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

Pokud žijete v Hongkongu jako já, můžete přidat informace o počasí v Hongkongu:

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

Pokud byste chtěli vyvinout vlastní informace o OSD:

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/path/to/photo:/app/photo -v ~/git/face-aware-photo-osd/app.js: /app/app.js moononournation/face-aware-photo-osd: 1.0. 1

Upravte funkci update_osd () v souboru app.js a přizpůsobte si tak vlastní informace o OSD. Po vývoji jednoduše odeberte prostředí DEBUG = Y z příkazu docker.

Krok 5: Nastavení serveru fotografií Možnost 2: Sestavení ze zdroje

Pokud znáte Node.js, můžete vytvořit aplikační server ze zdroje.

Získejte zdroj:

klon git

Instalovat balíčky:

cd face-aware-photo-osd

npm instalace

Vytvořte složku s fotografiemi a zkopírujte do ní své vlastní fotografie.

Spustit aplikační server:

uzel app.js

Krok 6: Možnost klienta 1: Webový prohlížeč

Jednoduše prohlížeč na https:// localhost: 8080/

Na stránce se skriptuje automatické načítání obrázku přizpůsobené velikosti stránky každou minutu.

P. S. Pokud procházíte z jiného počítače, na kterém není spuštěn server aplikací, nezapomeňte změnit localhost na název hostitele nebo IP adresu aplikačního serveru.

Krok 7: Možnost klienta 2: ESP32 + LCD

Klient fotorámečku může být stejně jednoduchý jako vývojová deska ESP32 a LCD.

Zde je požadovaný hardware:

Deska pro vývojáře ESP32

Jakákoli deska ESP32 pro vývojáře by měla být v pořádku, tentokrát používám desku s názvem MH-ET LIVE.

LCD displej

Jakýkoli LCD displej podporovaný Arduino_GFX, aktuálně podporovaný displej najdete na readme GitHub:

github.com/moononournation/Arduino_GFX

Propojovací drát

Některé propojovací vodiče závisí na rozvržení desky vývojáře a LCD kolících. Ve většině případů stačí 6–9 propojovacích kabelů mezi ženami a ženami.

LCD stojan

Určitá podpora pomáhá LCD stát rovně, tentokrát používám stojan na držáky karet.

Krok 8: Sestava ESP32 + LCD

Upřednostňuje se ESP32 s konektorem na horní straně. Pokud je kolíková lišta na spodní straně, jednoduše položte desku vzhůru nohama;>

Propojte ESP32 a LCD propojovacími vodiči a poté jej připevněte ke stojanu.

Zde jsou ukázkové souhrny připojení:

ESP32 -> LCD

Vcc -> Vcc GND -> GND GPIO 5 -> CS GPIO 27 -> DC (je -li k dispozici) GPIO 33 -> RST GPIO 18 -> SCK GPIO 19 -> MISO (volitelně) GPIO 22 -> LED (je -li k dispozici) GPIO 23 -> MOSI / SDA

Krok 9: Software ESP32 + LCD

Arduino IDE

Stáhněte a nainstalujte Arduino IDE, pokud to ještě neuděláte:

www.arduino.cc/en/main/software

Podpora ESP32

Pokud jste to ještě neudělali, přidejte podporu ESP32 podle pokynů k instalaci:

github.com/espressif/arduino-esp32

Knihovna Arduino_GFX

Stáhněte si nejnovější knihovny Arduino_GFX: (stiskněte „Klonovat nebo Stáhnout“-> „Stáhnout ZIP“)

github.com/moononournation/Arduino_GFX

Import knihoven v Arduino IDE. (Nabídka „Skica“Arduino IDE -> „Zahrnout knihovnu“-> „Přidat knihovnu. ZIP“-> vyberte stažený soubor ZIP)

Zkompilovat a nahrát

1. Otevřete Arduino IDE
2. Otevřete ukázkový kód ESP32PhotoFrame („Soubor“-> „Příklad“-> „Knihovna GFX pro Arduino“-> „WiFiPhotoFrame“)
3. Vyplňte nastavení WiFi AP do SSID_NAME a SSID_PASSWORD
4. Nahraďte název hostitele nebo IP serveru a port v HTTP_HOST a
5. Stiskněte tlačítko „Nahrát“Arduino IDE
6. Pokud zjistíte, že orientace není správná, změňte v novém kódu třídy hodnotu „otočení“(0-3)

Krok 10: Užijte si fotografii

Je čas dát fotorámeček IoT na plochu a užívat si!

Krok 11: Co bude dál?

• Přidejte své vlastní okamžité informace
• Dolaďte velikost zdrojové fotografie pro lepší přesnost detekce obličeje
• Automatický úkol umístit nejnovější fotografie do složky s fotografiemi na serveru
• Pořiďte více fotografií;>