Сегодня около 4% населения мира страдают нарушениями зрения. Такие задачи, как простая навигация по комнате или прогулка по улице, представляют собой реальные опасности, с которыми им приходится сталкиваться каждый день. Текущие технологические решения слишком недоступны или сложны в использовании.

В рамках университетского задания мы (я, Луи и Том) разработали и внедрили новое решение. Мы использовали настраиваемые шейдеры WebGL, чтобы дополнить видеопоток окружения пользователя в режиме реального времени. Мы визуализировали результат в формате AR / VR с такими эффектами, как обнаружение краев и корректировка цвета. Позже мы также добавили моделирование дальтонизма для дизайнеров. Мы также добавили несколько экспериментов с ИИ.

Мы сделали более глубокий обзор литературы в нашей оригинальной исследовательской статье. ACM опубликовал более короткую, двухстраничную версию здесь. В этой статье больше внимания уделяется используемым технологиям, а также некоторым дальнейшим применениям и экспериментам, таким как интеграция ИИ.

Популярным подходом, который мы обнаружили в наших исследованиях существующих решений, было использование обнаружения краев для обнаружения препятствий в окружающей среде. Большинство решений не хватало с точки зрения удобства использования или доступности и переносимости оборудования.

Наиболее интуитивно понятный подход, который мы могли представить как обратную связь с пользователем, заключался в использовании гарнитуры VR. Хотя это означало, что система не будет полезна для людей с очень серьезными нарушениями зрения, она будет гораздо более интуитивно понятной для людей с частичным зрением, особенно для людей с нечетким зрением.

Обнаружение края

Обнаружение признаков, таких как края, лучше всего выполнять с помощью двумерных сверток и даже в глубоком обучении (сверточные нейронные сети). Проще говоря, это точечные произведения сетки данных изображения (пикселей) против весов в ядре / фильтре. При обнаружении краев вывод становится выше (больше белого), когда значения пикселей совпадают со значениями фильтра, представляющими край.

Есть несколько доступных вариантов фильтров обнаружения края. В качестве конфигураций мы включили Frei-chen, а также варианты Sobel 3x3 и 5x5. Все они достигли одной и той же цели, но с небольшими различиями. Например, фильтр Собела 3x3 был резче, чем фильтр 5x5, но содержал больше шума от таких текстур, как ткань:

Веб-платформа

Основной причиной, по которой мы выбрали Интернет в качестве платформы, была его широкая доступность и совместимость практически со всеми мобильными устройствами. Он также имеет более легкий доступ по сравнению с собственными приложениями. Однако этот компромисс привел к нескольким проблемам, в основном с точки зрения необходимых шагов настройки, которые должен был бы предпринять пользователь:

  1. Обеспечьте сетевое подключение
  2. Перейти на веб-страницу
  3. Переведите устройство в альбомный режим
  4. Настроить эффект
  5. Включить режим VR
  6. Активировать полноэкранный режим (касанием экрана)
  7. Вставьте телефон в гарнитуру VR

Чтобы не вводить в заблуждение нетехнического пользователя, мы создали веб-сайт как PWA (прогрессивное веб-приложение), позволяя пользователю сохранять его на своем домашнем экране Android. Это гарантирует, что оно всегда запускается на правильной странице, принудительно включается альбомный режим, приложение всегда работает в полноэкранном режиме и не зависит от сетевого подключения.

Представление

Ранние прототипы JavaScript не могли приблизиться к нашей цели 60 кадров в секунду из-за очень дорогих операций свертки. Мы подозревали, что узким местом был сам JavaScript. Мы попробовали версию WebAssembly. Получившийся прототип работал еще медленнее. Скорее всего, это было связано с накладными расходами при передаче данных видеокадра в код WebAssembly и обратно.

Вместо этого мы обратились к шейдерам WebGL. Шейдеры хороши тем, что они чрезвычайно распараллеливают фрагмент кода (шейдер) по пикселям текстуры (видео). Для поддержания высокой производительности при сохранении высокого уровня настройки код шейдера необходимо было объединить и повторно компилировать во время выполнения по мере изменения конфигурации, но при этом нам удалось остаться в рамках бюджета кадра в 16,7 мс, необходимого для 60 кадров в секунду.

Обратная связь

Мы провели небольшое пользовательское тестирование. Мы протестировали некоторые базовые задачи, такие как навигация, и собрали качественные отзывы. Это включало корректировки пользовательского интерфейса, предложение добавить возможность настройки цветов краев и поверхностей и замечание о том, что поле обзора (FoV) было слишком низким.

Оба предложения по улучшению программного обеспечения были применены. Поле зрения нельзя было исправить с помощью программного обеспечения из-за аппаратных ограничений камеры. Однако нам удалось найти решение этой проблемы в виде недорогих объективов типа «рыбий глаз» для телефонных камер. Линзы увеличивали поле зрения оптически, а не в цифровом виде.

В остальном система превзошла первоначальные ожидания, но не справилась с чтением текста. Это произошло из-за того, что для каждого символа было два набора ребер. Работа при слабом освещении также была полезной, несмотря на введение большего количества шума.

Некоторые другие конфигурации, которые мы включили, - это радиус эффекта, его интенсивность и инверсия цвета.

Другие варианты использования

У нас была идея добавить шейдерные эффекты для имитации различных типов дальтонизма, чтобы дизайнеры могли легко выявлять проблемы доступности, связанные с дальтонизмом, в своих продуктах, будь то программное обеспечение или что-то еще.

Используя значения соотношения RGB, найденные здесь, и отключив обнаружение краев, мы смогли добавить базовое моделирование всех основных типов цветовой слепоты с помощью дополнительных переключаемых компонентов в шейдерах.

ИИ и будущая работа

Хотя это эксперимент, который все еще находится на очень ранней стадии, обнаружение объектов более высокого уровня может быть выполнено с помощью tensorflowjs и tfjs-yolo-tiny, тензорного порта tiny-yolo, уменьшенной и быстрой версии YOLO. модель обнаружения объекта.

Следующим шагом будет заставить работать сегментацию экземпляров в браузере с чем-то похожим на mask rcnn (хотя, возможно, он должен быть меньше, например, tiny-yolo), и добавить его в WebSight, чтобы выделить элементы с помощью цветовой маски. , вместо коробок с этикетками.

Репозиторий GitHub находится здесь, а живую демонстрацию можно найти на https://websight.danruta.co.uk. Обратите внимание, что до тех пор, пока Apple не предоставит поддержку API камеры в браузерах, он может не работать на телефонах Apple.

Конечно, я тоже немного повеселился. Возможность редактировать то, что вы видите вокруг себя в режиме реального времени, открывает целый мир возможностей.

Например, используя Матричный шейдер, можно почувствовать себя The One.

А может, вам просто нравится смотреть, как мир горит.

Вы можете написать мне в Твиттере другие идеи шейдеров здесь: @DanRuta