22. Juli 2021   Matthias Reichinger

Paint to Webcam – Hand Detection mit Mediapipe

Im Juli 2019 hat Google mediapipe released, eine leichtgewichtige erweiterbare und anpassbare Multi-Platform Lösung für die Verarbeitung von Life-Streaming Videos. Mediapipe wird seither intensiv weiterentwickelt und stellt viele nützliche Module zur Verfügung, wie etwa Gesichtserkennung oder Körper- und Handerkennung. Eine Tabelle der Module und unterstützen Programmiersprachen findet man hier. Rändererkennung, Gesichtserkennung, Haarsegmentierung oder Handerkennung kann man gleich im Browser ausprobieren. Dazu klickt man lediglich auf das Symbol mit der laufenden Figur rechts oben und gibt dem Browser die Berechtigung für die Webcam. Die Verarbeitung des Videos erfolgt direkt im Browser. Es ist nicht notwendig die Daten an einen Server zu schicken.

Diese fertigen Lösungen sind open source und daher leicht anpassbar. Wir haben uns die Hand-Detection Lösung näher angeschaut und einen Prototypen für ein Zeichenprogramm „Paint to Webcam“ erstellt. Das Zeichenprogramm soll erlauben mit den Fingern während eines Video-Calls auf das eigene Video zu malen und das Gemalte mit der Hand auch wieder auszuradieren. Dazu wurde die Python Implementierung von Mediapipe Hand verwendet und angepasst.

Die Zeichnung entsteht indem die Koordinaten der Zeigefingerspitze zwischen zwei Frames gespeichert werden und falls bestimmte Bedingungen erfüllt sind, also der Zeichenmodus aktiviert ist, mit openCV eine Linie zwischen den zwei Punkten gezeichnet wird. Diese Linie kann durch den Radiergummi-Modus gelöscht werden, wenn die Zeigefingerspitze in den Bereich der Koordinaten der gezeichneten Linie kommt. Eine Herausforderung ist es die verschiedenen Modi zu aktivieren oder zu deaktivieren, denn es soll nicht immer gezeichnet oder nicht immer radiert werden, sobald die Hand sichtbar ist.

Dazu wurden Pattern definiert, die möglichst intuitiv und ohne versehentliches Aktivieren von malen oder radieren funktionieren. Der Zeichenmodus wird aktiviert, indem Zeigefingerspitze und Daumenspitze einander nahe kommen. Der Radiergummi wird aktiviert, wenn der Zeigefinger gestreckt und gleichzeitig mindestens Mittelfinger, Ringfinger oder kleiner Finger abgewinkelt ist.

Mediapipe liefert für jeden Frame 21 Orientierungspunkte als 3D Koordinaten (siehe Fig2 (Quelle mediapipe)), mit deren Hilfe das Pattern malen oder radieren unterschieden werden kann. Herausforderungen sind hier, dass die Detection nicht 100% korrekt funktioniert und die Punkte von einem zum nächsten Frame zu einem gewissen Grad „flackern“. Daher werden in der Implementierung stark abweichende unrealistische Orientierungspunkte ignoriert oder andere Techniken eingesetzt um die Zeichnung zu „glätten“.

Alles in allem ist das Mediapipe Framework beeindruckend, wenn es auch in der Natur der Sache liegt, dass selbstverständlich die Detection nicht mehr so gut funktioniert, wenn etwa die Lichtverhältnisse nicht passen oder etwa nicht jede Handposition gleich gut erkannt wird. Mit diesen Fehlern muss eine Implementierung umgehen können, damit die User Experience auch zufriedenstellend ist.

 


 

Code Repository: https://github.com/redlink-gmbh/paint-to-webcam