Что такое Симулятор цветовой слепоты?
Симулятор цветовой слепоты показывает, как ваши изображения и цветовые палитры выглядят глазами людей с различными типами нарушения цветового зрения. Протестируйте протанопию, дейтеранопию, тританопию и ахроматопсию, чтобы увидеть, какие цвета сливаются при каждом из них.
Симулятор прогоняет каждый пиксель через матрицы из моделей Бреттеля и Мачадо, приближая зрение людей с восемью самыми распространёнными вариантами цветовосприятия. Режим «сравнить все» выкладывает все типы рядом с оригиналом, что быстрее, чем перещёлкивать, когда вы аудитируете макет или график.
Как использовать
- Загрузите изображение или введите цвета, которые хотите протестировать на доступность.
- Выберите тип зрения и перетаскивайте разделитель, плавно переключаясь между оригиналом и симуляцией. Для лёгких форм аномальной трихромазии используйте ползунок степени.
- Сравните все типы симуляции одновременно и скачайте симулированные изображения для документации.
Когда использовать
- Проверить цветовые «пилюли» статуса в дашборде перед UX-ревью.
- Убедиться, что красно-зелёные различия в графике остаются читаемыми.
- Подобрать палитры для публичного отчёта с разной аудиторией.
Результат
UI-дизайнер загрузил скриншот дашборда своего приложения и обнаружил, что красно-зелёные индикаторы статуса неразличимы при дейтеранопии. Он добавил иконки с разными формами в дополнение к цветам, чтобы исправить проблему.
Частые вопросы
- Насколько симуляция близка к реальному зрению?
- Матрицы Бреттеля и Мачадо дают рабочее приближение, не точное совпадение. Реальное восприятие зависит ещё от освещения и индивидуальных особенностей, поэтому используйте режим для поиска явных проблем, а не как медицинский эталон.
- В чём разница между протанопией и протаномалией?
- Протанопия — полное отсутствие красных колбочек, красные сильно темнеют. Протаномалия — ослабленная реакция на красный: картинка похожая, но сдвиг мягче. Та же схема справедлива для дейтера- (зелёный) и трита- (синий).
- Какие типы важнее учитывать в дизайне?
- Дейтераномалия затрагивает около 5% мужчин и самая распространённая красно-зелёная аномалия. Протанопия и дейтеранопия вместе — около 2%. Синие нарушения и ахроматопсия редки. Для широкой доступности приоритет — дейтера-.
- Можно ли проверить отдельные цвета, не загружая изображение?
- Да. Откройте вкладку «Цвета» и введите любые hex-коды — каждый показан рядом с тем, как его воспринимают все семь типов зрения, так что можно проверить палитру бренда или набор токенов интерфейса без скриншота. Для целых изображений кнопка «Дальтонизация» идёт дальше и перекрашивает картинку, чтобы люди с дальтонизмом действительно различали оттенки.
- Загруженные изображения уходят на сервер?
- Нет. Изображение декодируется на canvas внутри вкладки браузера, матрица применяется локально, результат рисуется тут же. Со страницы ничего не отправляется; закрыли вкладку — всё удалилось.
Похожие инструменты
Предпросмотр текста для экранного диктора
Проверьте, как экранный диктор интерпретирует ваш контент
Визуализатор порядка фокуса
Визуализируйте порядок навигации клавишей Tab на любой веб-странице
Тестер размера шрифта
Предпросмотр текста в разных размерах шрифта
Текст для людей с дислексией
Переформатируйте текст для удобного чтения
Помощник по alt-тексту
Составляйте доступные alt-описания для изображений
Режим крупного текста
Увеличьте любой текст для удобного чтения