Хватит сутулиться! Создайте в ... Заметка
DEV Community на русском

Хватит сутулиться! Создайте в реальном времени ИИ-стража осанки с помощью MediaPipe и Vue.js

Инженеры часто приобретают плохую осанку из-за длительного использования компьютера, что приводит к болям в спине и снижению производительности. В этой статье представлен Posture Guardian — браузерный инструмент, использующий компьютерное зрение и оценку позы для обнаружения и оповещения пользователей о сутулости и выдвижении головы вперед. Инструмент использует MediaPipe для оценки позы и Vue.js для пользовательского интерфейса. Архитектура включает захват кадров с веб-камеры, их обработку с помощью MediaPipe для обнаружения ключевых точек скелета и использование тригонометрии для расчета углов, указывающих на плохую осанку. Предварительные требования включают Vue.js 3, MediaPipe Pose, базовые знания JavaScript и веб-камеру. Настройка включает инициализацию модели MediaPipe Pose для идентификации ключевых точек тела. Поза "выдвинутой вперед головы" определяется путем расчета горизонтального расстояния между ушами и плечами. Эта логика интегрирована в компонент Vue, который использует API веб-камеры для подачи видеопотока в модель позы. Компонент отображает статус осанки в реальном времени и запускает браузерные уведомления при обнаружении плохой осанки. Готовность к производству требует учета вариаций освещения, калибровки камеры и предотвращения спама уведомлений. Инструмент может быть расширен такими функциями, как таймеры для упражнений и оценка осанки.