Comments 18
Это полезно.
Плюсую. А вот ещё бы написать для разрабов, например, расширение такое для браузера, чтобы он на своём localhost-е мог во всплывающей панельке попереключать эти фильтры, так, чтобы всё это менялось в UI конкретно его проекта… Знаю-знаю. «Вот и займись». Но сейчас занят другим. Да и не писал ни разу расширения.
Очень правильный и показательный проект!
С дальтонизмом все несколько сложнее, их несколько видов, не только красно-зеленый.
Как способ "вправить мозги" - очень здорово сделано, спасибо!
Хорошая статья. Посоветовал бы ещё добавить фичу- поле для заполнения плюс 5% яркости и обведенное -2% яркости 1пиксельной рамочкой. На такое смотрю 90% времени на работе и посылаю лучи добра разрабу. Ибо в нашем бюджетном учреждении в наличие у меня моник с полудохлой подсветкой. И, дабы разглядеть эти потуги на дезигн- ложусь башкой на стол. Иначе нифига не видно. Респект. Уважуха. /s
Спасибо, очень наглядно. Вот только "имитация дальтонизма" как-то не очень корректно отрабатывает. Красный становится жёлто-зелёным (код цвета #c0c93f), а зелёный как раз таки почти серым становится (#6b617b), т.е. визуально очень отличаются цвета. Думал, что у меня что-то с цветовосприятием и позвал жену, она подтвердила. На всякий случай даже глянул по кодам цветов.
Довольно познавательно, полезно для общего понимания. Инструмент, способный делать такое с любым URL или экраном приложения, имел бы неплохой коммерческий потенциал.
Вот скажите, что не так? Доступные интерфейсы делать надо? Вроде надо. Проверить доступность как-то надо? Ну вроде бы надо. Альтернативы: искать тестировщиков с особенностями специально под эту задачу или купить подписку на подобный сервис, который покажет, как выглядит ваш сайт или приложение для людей с определёнными ограничениями восприятия. Второй путь, как мне видится, менее тернист.
Хорошая статья и интересный проект.
Я совсем не дизайнер интерфейсов и не владею понятийным апаратом в этой области. Но мне чудится некое несоответствие понятия "доступность" с ограниченными возможностями человека по тем или иным причинам. В ОСях это решается путём введения раздела настроек вроде "Специальные возможности". Вероятно, меня сбивает палкой определение доступности в автоматизированных системах, где рассматривается обезличенный оператор системы, по умолчанию умеющий пользоваться условным пультом управления системой при наличии инструкции по эксплуатации.
Про дизайн же и сочетаемость цветов у меня в голове только одна фраза некого известного дизайнера: "Красный и зелёный цвета не сочетаются? Посмотрите на грядку с клубникой." Хотя для дальтоников всё не так однозначно...
Странно, что на синюю кнопку "Добавить в корзину" все эффекты (кроме тремора) не действуют. То, что вы пишете в заголовке -- не видно кнопку -- этого как раз не происходит от эффектов.
В некоторых программах такое уже есть, например, в QGIS этот эффект можно включить и увидеть, как воспринимают визуализацию на цветовой шкале.
Не перестану таскать свою пасту в подобные статьи. Это лечится не плагинами, а вторым монитором для дизайнера за тысячу рублей из 2007 года с TN матрицей. Пару месяцев работы с таким монитором и на всю жизнь будет понятен выбор "безболезненных приемов" в виде размерностей текста и кнопок, толщин линий, оттенков, яркости, эффектов и так далее. А когда дизайнер рождается сразу с золотой ложкой макбуком в жопе, с эталонным экраном и идеальным зрением, решать эту проблему придется радикальней.
P.S. Все эти танцы дизайнеров вокруг важности WCAG и ее заветной галочкой дабл АА, кажутся порой довольно преувеличенными. Автоматизация подбора цветовых контрастов на уровне плагинов и макетов в фигме, всё это очень условно и не дает ни каких гарантий, что на пользовательской стороне все будет читаемым. На WCAG хватает достаточно объективной критики, если углубиться в интернеты. Пока работает текущая версия стандарта, где-то за кулисами разрабатывается уже другая, заделывая дыры и ошибки предыдущей.
Сама идея этого довольно утопична, пытаться решить это только програмно. Это должно быть устройство по типу калибратора монитора, которая будет анализировать яркость и контрастность экрана пользователя, уровень освещенности помещения, площадь цветовых заливок (сюда же и масштаб интерфейса), особенности зрения конкретного человека, потом все эти данные передавать прямо в видеокарту и корректировать програмно значения выводимых на экран цветов. Вот тогда да, вот тут можно быть уверенным, что заданные дизайнеров "веса" контраста по типу WCAG точно сработают, как и задумывалось.
Даже не надо ждать катаракты. Большинство в 40+ имеет "+" по зрению. А еще часть имеют "-" с молодости, который (если повезет) компенсируется с годами "+"ом, а если не повезет - привет, астигматизм.
И тем удивительнее наблюдать дизайнеров, которые делают мелкие серые буквы. Ребят, вы с другой планеты? Вы никогда не встречали людей в очках? Или думаете, что все смотрят на ваш продукт на больших дизайнерских калиброванных мониторах?
Дизайнеры, не надо "серить". Если это неважно - не пишите вовсе. Если всё-таки важно - напишите большими четкими буквами, а если не помещается - сделайте всплывашками.
Плюс немножко разный бывает. Есть плюс, что нужно очки надеть, и все время носить, или хрусталик не дожимается, или он стал ближе к сетчатке, ну это если со стороны оптики рассуждать, и потому плюс нужен всегда. И эта проблема не у всех. А вот что бывает у многих, это когда все время видим нормально, но чтобы посмотреть на близкий предмет, мы не может дожать хрусталик. Мышцы слабее, хрусталик не такой гибкий. И мы все видим, а когда предмет слишком близко, вынуждены надеть очки для чтения.
А вот серые буквы, или другие объекты на сером фоне… Пытался по старинке пользоваться навигатором, чтобы ходить по нему куда надо, это очень не удобно. Объекты не контрастные. Серозеленые на таком же фоне почти. А там смысл как раз в том, чтобы я не ходил как раньше. Чтобы я нашел, и навигатор меня повел, а я кроме стрелки больше ничего и не видел. Купил бумажную карту, в 21 веке, и по ней получается находить все намного быстрее. С учетом определенных проблем с GPS, которые давали преимущество электронной карте с малоконтрастными объектами, бумажная стала удобнее. Поиск вручную на электронной карте возможен только на местности, которую я хорошо знаю. А там она и не нужна.
Еще интересно будет выглядеть астигматизм. Когда одна строчка наползает на другую. Легкий астигматизм у меня был как только узнал, что имеет место быть сухой глаз, и нужно периодически его увлажнять, но постепенно прошел. Но когда это повторяющаяся вертикальная или горизонтальная линия, это одно. Хотя не совсем ясно как это происходит, ведь нет в глазе призм способных проявить такие аберрации… а вот когда он не совсем линейный в результате нарушения структуру хрусталики, и исправляется только специальной, индивидуально сконструированной линзой, это явление уже интереснее. Думаю что в таком случае человеку будет сложно читать большие тексты. Но все индивидуально.
Помимо всего этого отдельно можно добавить кнопку "тёмная тема". Во многих браузерах есть такая фича, а где нет - есть расширение. И несмотря на то, что пользователей этой фичи довольно много, я регулярно вижу как сайты к ней не адаптированы.
Симулятор восприятия: три секунды побыть тем, кто не видит вашу кнопку