⚙️ Иллюстратор Джанмарко Маньяни совмещает печать и диджитал. Привычный нам статичный плакат получает небольшие анимационные элементы, которые привлекают внимание, но не утомляют взгляд. Пользователь успевает дочитать основное и затем насладиться деталями. Такие изображения можно добавлять в статьи или в мобильные приложения.

⚙️ Глаза отдыхают и при взгляде на постеры иллюстратора Волай Шарма. Этнические композиции, приятные цвета, разнообразные формы и какая-то загадочность…🤖

⚙️ Стремительно уносимся в выходные с подборкой плакатов и постеров, которые не просто попали в историю искусства, а вошли в историю человечества. Целых 50 постеров, потрясших мир вполне хватит, чтобы зарядить свои батарейки, красотой, энергией и вдохновением.

Хороших выходных! 🤖

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

⚙️ Для начала вспомним основные принципы инклюзивного дизайна, которые учат созданию понятных, отзывчивых и удобных функций и интерфейсов.

⚙️ После этого изучим стандарт доступности web-контента — WCAG от Консорциума всемирной паутины. В нём прописаны важные критерии доступности интернет-среды. Сухая на первый взгляд теория станет твёрдой опорой для понимания основ инклюзивного дизайна.

⚙️ Ну а теперь заглянем на GitHub и изучим: примеры доступных интерфейсов, чек-лист по проектированию инклюзивного дизайна и другие полезные вещи. Если хочется сразу приступить к делу — откройте чек-лист.

⚙️ Как распознать возникновение проблем у пользователя с инклюзией и как их решить — описано в гайде от Microsoft. В нём собраны полезные инструменты для дизайн-исследований. И обязательно посмотрите видео, как команда Xbox проводила интервью среди пользователей с инклюзией.

⚙️ Google публикует свои рекомендации по созданию доступной среды с примерами, как делать не нужно. Ссылки на полезные инструменты для проведения тестирования пользователей или оценки контраста прилагаются. У Apple также есть свой гайд по доступности, в пример приводятся продукты компании.

⚙️ Гайдлайн по цифровой доступности есть у «Сбербанка». Его подготовила Валерии Курмак — специалист по практике Human Experience. В 2016 году она провела одно из самых больших исследований по инвалидности в России, результаты которого и легли в основу гайда. Также Валерия запустила образовательный курс про цифровую доступность.

Объединяем теорию с практикой — ловите инструменты для проверки доступности дизайна 👁

Для начала изучим правила контрастности, которые основаны на стандарте WCAG, после чего можно почитать подробный гайд для создания доступных продуктов от правительства США. В нём описано, какими должны быть цвета, изображения, заголовки, фреймы и другие элементы.

После теории перейдём к практике. Есть платные программы для проверки контрастности цветов на macOS и бесплатные, например, Stark. Это плагин для Figma, с помощью которого можно проверить контрастность и воспользоваться симулятором дальтонизма, чтобы посмотреть, как видят ваш дизайн люди с этим зрительным расстройством. Так же можно заценить ещё один плагин, и полезный сервис по теме.

Пятница — самое время добавить несколько ссылок в закладки, чтобы прочесть на выходных.

📕 Интересно, чей сайт доступнее — Пенсионного фонда или Общества инвалидов? Почитайте статью железного QA-инженера Максима Осадчего с разбором этих и других сервисов для проверки доступности дизайна. Спойлер: и тем, и другим есть над чем поработать.

📕 Статья «Как сделать сайт доступным для незрячих и слабовидящих» объединяет гайды и инструменты в инструкцию.

📕 Подписывайтесь на Telegram-канал «Не исключение». Новости, последние технологии и инструменты, лучшие кейсы из мира инклюзивного дизайна. Например, как разработчики сделали игру The Last of Us Part II доступной в том числе и для слабовидящих игроков. Если надоело читать или вы аудиал — у автора есть подкаст по теме.

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

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

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

Привет! На этой неделе поговорим про ясность, функциональность и простоту, потому что мы посвящаем её иконкам — универсальному инструменту в дизайне. А начнём с полезных библиотек:

◼️На сайте Nucleo вы найдёте больше 30 тысяч иконок. Например, тут есть набор по теме инклюзивного дизайна. Примерно столько же иконок опубликовано на сайте Streamline Icons. Там можно скачать плагин для Figma для быстрого поиска по иконкам и NPM (менеджер пакетов), чтобы легко скопировать и вставить код значка в проекты React, Angular или Vue.js из приложения Streamline.

◽️Для самых взыскательных дизайнеров — хранилище IconFinder с почти 5 млн иконок: от пиксель-арта до плоского дизайна. Что особенно приятно — много бесплатных наборов для использования в коммерческих проектах.

#icons

◾️ Добавляем к себе в закладки еще один крутой блог. Дизайнер Елена Чжан пишет про основы иконографики, рассказывает про сетки и правильное построение иконок. Для старта можно изучить статью о семи принципах дизайна иконок — есть как на языке оригинала, так и в переводе.

◽️ А если жажда знаний еще не утолена — советуем прочитать большое и подробное руководство по созданию иконок от дизайнера из Сан-Франциско, с отдельным разбором того, как использовать их в системе дизайна. В переводе 🤓

#icons