Сейчас слушаю Lenny's podcast c head of design Дженни Вен и ее цитата:
Все так, все так
«Самое сложное в создании продукта — это не само создание. Кто-то всё равно должен решить, что важно строить. И кто-то должен нести за это ответственность».
Все так, все так
🔥5❤1👏1
📄 Инструкция настройки базы знаний для UX-исследований по методу Андрея Карпаты
Я сейчас провожу Reddit-исследование на 1250 постах по цифровой доступности. И мне нужно сделать так, чтобы Claude искал только по моей базе, а не во всем интернете.
Недавно Андрей Карпаты (один из основателей OpenAI) выложил в X пост о том, как он хранит информацию как .md файлы (обычные текстовые файлы) и подключает Claude напрямую к этим знаниям.
Почему это лучше, чем просто загружать файлы в чат? Каждая сессия Claude начинается с чистого листа — приходится заново объяснять контекст. Claude Code подключён к папке постоянно через терминал: один раз структурировала знания, и они работают во всех следующих сессиях.
Настроила примерно за час и то, потому что протупила с путями, куда что сохранять. А так оч быстро ) Потом полдня писала эту инструкцию ) Буду рада вашим реакциям )
В будущем хочу попробовать: настроить поиск по смыслу (семантический), а не по точным словам: чтобы Claude находил «усталость», даже если в заметке написано «выгорание». Автоматизировать обработку новых источников — положила файл в папку, он сам превратился в структурированную заметку. И сделать так чтобы Claude знал базу без чтения файлов каждый раз, как это делает Notebook LM. Карпаты об этом тоже писал.
⚡️Написала инструкцию на VC⚡️
___
en<able> - о дизайне в A11y | Наши статьи на VC
Я сейчас провожу Reddit-исследование на 1250 постах по цифровой доступности. И мне нужно сделать так, чтобы Claude искал только по моей базе, а не во всем интернете.
Недавно Андрей Карпаты (один из основателей OpenAI) выложил в X пост о том, как он хранит информацию как .md файлы (обычные текстовые файлы) и подключает Claude напрямую к этим знаниям.
Почему это лучше, чем просто загружать файлы в чат? Каждая сессия Claude начинается с чистого листа — приходится заново объяснять контекст. Claude Code подключён к папке постоянно через терминал: один раз структурировала знания, и они работают во всех следующих сессиях.
Настроила примерно за час и то, потому что протупила с путями, куда что сохранять. А так оч быстро ) Потом полдня писала эту инструкцию ) Буду рада вашим реакциям )
В будущем хочу попробовать: настроить поиск по смыслу (семантический), а не по точным словам: чтобы Claude находил «усталость», даже если в заметке написано «выгорание». Автоматизировать обработку новых источников — положила файл в папку, он сам превратился в структурированную заметку. И сделать так чтобы Claude знал базу без чтения файлов каждый раз, как это делает Notebook LM. Карпаты об этом тоже писал.
⚡️Написала инструкцию на VC⚡️
___
en<able> - о дизайне в A11y | Наши статьи на VC
🔥6❤3❤🔥1👏1
ИИ-агенты помогут с доступностью
У Nielsen Norman Group вышла интересная статья. Сейчас с сайтами взаимодействуют не только люди, но и ИИ-агенты. Это требует переосмысления: «пользователь» больше не синоним «человека».
Агент — это полноценный пользователь, потому что:
• у него есть цель;
• он сталкивается с интерфейсом;
• он пытается достичь цели через этот интерфейс;
• интерфейс либо поддерживает эту попытку, либо нет.
И это очень хорошие новости! Интерфейсы, хорошо сделанные с точки зрения доступности, уже сегодня лучше работают с агентами.
Как агенты взаимодействуют с интерфейсами сегодня
1. через скриншоты — и с помощью визуальной модели интерпретирует увиденное — распознаёт кнопки, поля ввода, элементы навигации, решает, куда кликнуть, и повторяет цикл. Но это дорого, токенов тратится много.
2. парсинг дерева доступности — агент читает структурированное представление страницы, которое браузер генерирует из HTML, — то же самое, чем пользуются скринридеры! Самое важное для нас с вами!
3. прямой доступ к API — полностью обходит визуальный интерфейс: агент обращается напрямую к структурированным данным и действиям через API, без какого-либо взаимодействия с видимым представлением страницы.
Какой вывод? Дааа! Хорошая доступность = хорошая читаемость для агентов, а значит проектируем для человека и для агента с учетом всего того, что мы тут обсуждаем ) И это еще один классный аргумент для бизнеса, почему доступность важна.
Источник тут.
У Nielsen Norman Group вышла интересная статья. Сейчас с сайтами взаимодействуют не только люди, но и ИИ-агенты. Это требует переосмысления: «пользователь» больше не синоним «человека».
Агент — это полноценный пользователь, потому что:
• у него есть цель;
• он сталкивается с интерфейсом;
• он пытается достичь цели через этот интерфейс;
• интерфейс либо поддерживает эту попытку, либо нет.
И это очень хорошие новости! Интерфейсы, хорошо сделанные с точки зрения доступности, уже сегодня лучше работают с агентами.
Как агенты взаимодействуют с интерфейсами сегодня
1. через скриншоты — и с помощью визуальной модели интерпретирует увиденное — распознаёт кнопки, поля ввода, элементы навигации, решает, куда кликнуть, и повторяет цикл. Но это дорого, токенов тратится много.
2. парсинг дерева доступности — агент читает структурированное представление страницы, которое браузер генерирует из HTML, — то же самое, чем пользуются скринридеры! Самое важное для нас с вами!
3. прямой доступ к API — полностью обходит визуальный интерфейс: агент обращается напрямую к структурированным данным и действиям через API, без какого-либо взаимодействия с видимым представлением страницы.
Какой вывод? Дааа! Хорошая доступность = хорошая читаемость для агентов, а значит проектируем для человека и для агента с учетом всего того, что мы тут обсуждаем ) И это еще один классный аргумент для бизнеса, почему доступность важна.
Источник тут.
❤8✍4⚡3🗿1
67% пользователей, которые работают с клавиатурой, сталкиваются с неправильным tab order каждый месяц. 82% пользователей скринридеров — регулярно натыкаются на барьеры на сайтах.
Давайте разбираться, как эти цифры уменьшить )
Reading order отвечает за то, как пользователь понимает страницу. Условно это книга. Порядок идет сверху вниз, слева направо. Читает всё: заголовки, текст, картинки, кнопки. Строит картину страницы последовательно. Именно по нему ориентируются скринридеры.
Reading Order = порядок смысла.
Tab Order же — это оглавление.
Правило простое: всё, что можно нажать — входит в Tab Order. Неважно, как это выглядит визуально: кнопка, ссылка, чекбокс, селект. Если элемент интерактивный, клавиатура до него доберётся.
Tab Order = порядок действий.
В карточках на примере моего любимого Dodo 🧡 показала разницу.
Если порядок и того, и другого определишь не ты, то это сделает за тебя браузер по своей логике. Скринридер может зачитать кнопку раньше, чем название товара. Клавиатурный фокус может уйти в сайдбар посреди основного контента. Пользователь не поймёт, где он. И просто уйдёт.
Как проще всего понять это на практике?
Откройте свой последний проект в браузере. Уберите мышь и нажмите Tab несколько раз. Как ощущения?
И также со скринридером, чтобы понять reading order. Если Mac — пройдитесь скринридером VoiceOver. Если Windows — NVDA, он бесплатный. Это займёт 15 минут. Но вы увидите свой продукт совсем другими глазами.
Как это включить в работу? Аннотировать для разрабов цифрами и стрелочками, ниже дам готовые компоненты для разметки - easy! либо еще easier — плагинами для Figma.
↓
Готовые компоненты для аннотаций от GitHub
Плагин TabA11y
Плагин Stark
___
en<able> - о дизайне в A11y | Наши статьи на VC
Давайте разбираться, как эти цифры уменьшить )
Reading order отвечает за то, как пользователь понимает страницу. Условно это книга. Порядок идет сверху вниз, слева направо. Читает всё: заголовки, текст, картинки, кнопки. Строит картину страницы последовательно. Именно по нему ориентируются скринридеры.
Reading Order = порядок смысла.
Tab Order же — это оглавление.
Правило простое: всё, что можно нажать — входит в Tab Order. Неважно, как это выглядит визуально: кнопка, ссылка, чекбокс, селект. Если элемент интерактивный, клавиатура до него доберётся.
Tab Order = порядок действий.
В карточках на примере моего любимого Dodo 🧡 показала разницу.
Если порядок и того, и другого определишь не ты, то это сделает за тебя браузер по своей логике. Скринридер может зачитать кнопку раньше, чем название товара. Клавиатурный фокус может уйти в сайдбар посреди основного контента. Пользователь не поймёт, где он. И просто уйдёт.
Как проще всего понять это на практике?
Откройте свой последний проект в браузере. Уберите мышь и нажмите Tab несколько раз. Как ощущения?
И также со скринридером, чтобы понять reading order. Если Mac — пройдитесь скринридером VoiceOver. Если Windows — NVDA, он бесплатный. Это займёт 15 минут. Но вы увидите свой продукт совсем другими глазами.
Как это включить в работу? Аннотировать для разрабов цифрами и стрелочками, ниже дам готовые компоненты для разметки - easy! либо еще easier — плагинами для Figma.
↓
Готовые компоненты для аннотаций от GitHub
Плагин TabA11y
Плагин Stark
___
en<able> - о дизайне в A11y | Наши статьи на VC
1❤5🔥4✍3
Проверка проекта в AI
На гитхабе дизайнер создал файл A11y.md — готовый контекст, который загружаешь в Claude (или любую другую нейронку) — и она начинает проверять твои макеты по стандартам WCAG 2.2.
Дима и Миша рассказывали уже о том, что если не спросить нейронку, то она и не расскажет о доступности, так вот md решает данную проблему.
Мне нравится, как этот диз написал: Accessibility is not a feature or an incremental improvement; it is a pre-condition for use. Доступность — это необходимое условие.
Как пользоваться, если ты диз?
1. Открыть файл на GitHub A11Y.md из папки docs/en/
2. Вставить в начало чата с AI «Строго следуй правилам разработки, описанным в файле A11Y.md»
3. Скинуть файл или ссылку на свой проект
4. Готово!
Что внутри репозитория:
⚡ Command Center — главный файл с матрицей приоритетов, правилами поведения для AI и протоколом для сложных компонентов.
📚 Support Library — справочная библиотека с готовыми решениями по контрасту, формам, кнопкам, навигации и модалкам.
🛠️ Templates — шаблоны для финальной проверки перед релизом и структурированный лог для фиксации технического долга.
📝 Examples — реальные ошибки доступности из проекта на Figma Make, с конкретными исправлениями, которые предложил A11Y.md в роли автоматического ревьюера.
Немного того, что важно для дизайнера:
→ Контраст текста должен быть 4.5:1, элементов UI — 3:1
→ Нельзя передавать состояние только цветом — нужны иконка + текст + цвет
→ Минимальный размер кнопки — 44×44px
→ Плейсхолдер не заменяет подпись к полю
→ Графики обязаны различаться без цвета — текстурами или штриховкой
и многое другое
Этот файл не научит доступности с нуля, он действует скорее как быстрый фильтр и сверка с WCAG. Конечно, я за то, чтобы изучать A11y глубже )
На гитхабе дизайнер создал файл A11y.md — готовый контекст, который загружаешь в Claude (или любую другую нейронку) — и она начинает проверять твои макеты по стандартам WCAG 2.2.
Дима и Миша рассказывали уже о том, что если не спросить нейронку, то она и не расскажет о доступности, так вот md решает данную проблему.
Мне нравится, как этот диз написал: Accessibility is not a feature or an incremental improvement; it is a pre-condition for use. Доступность — это необходимое условие.
Как пользоваться, если ты диз?
1. Открыть файл на GitHub A11Y.md из папки docs/en/
2. Вставить в начало чата с AI «Строго следуй правилам разработки, описанным в файле A11Y.md»
3. Скинуть файл или ссылку на свой проект
4. Готово!
Что внутри репозитория:
⚡ Command Center — главный файл с матрицей приоритетов, правилами поведения для AI и протоколом для сложных компонентов.
📚 Support Library — справочная библиотека с готовыми решениями по контрасту, формам, кнопкам, навигации и модалкам.
🛠️ Templates — шаблоны для финальной проверки перед релизом и структурированный лог для фиксации технического долга.
📝 Examples — реальные ошибки доступности из проекта на Figma Make, с конкретными исправлениями, которые предложил A11Y.md в роли автоматического ревьюера.
Немного того, что важно для дизайнера:
→ Контраст текста должен быть 4.5:1, элементов UI — 3:1
→ Нельзя передавать состояние только цветом — нужны иконка + текст + цвет
→ Минимальный размер кнопки — 44×44px
→ Плейсхолдер не заменяет подпись к полю
→ Графики обязаны различаться без цвета — текстурами или штриховкой
и многое другое
Этот файл не научит доступности с нуля, он действует скорее как быстрый фильтр и сверка с WCAG. Конечно, я за то, чтобы изучать A11y глубже )
❤10⚡1🔥1👌1
🏆 Apple Design Awards 2025: категория Inclusivity
Каждый год Apple отмечает лучших разработчиков. И меня радует, что есть целая отдельная категория! Пробежимся по тем, кто в ней )
🎸 Guitar Wiz (Индия, соло-разработчик)
Приложение для гитаристов с полноценной поддержкой VoiceOver — голосовые подсказки по аккордам, ладам и высоте тона. Поддерживает Dynamic Type (!!!) и режим «Различать без цвета». Музыка доступна всем💙
👂 Hearing Buddy (США, соло-разработчик с нарушением слуха)
Субтитры и резюме разговоров в реальном времени прямо на устройстве. Актуально для 466 млн человек с нарушениями слуха по всему миру.
🗓 Structured (Германия)
Планировщик, который ценит отдых не меньше задач. Особенно полюбился нейроотличным пользователям — а это около 15–20% населения планеты. ИИ сам предлагает и заполняет задачи, снижая когнитивную нагрузку. Хочу попробовать, хотя я все же фанат Обсидиана.
Все три приложения сделаны маленькими командами или вообще одним человеком, мощь и выбор каждого разработчика менять жизнь вокруг себя💙
___
en<able> - о дизайне в A11y | Наши статьи на VC
Каждый год Apple отмечает лучших разработчиков. И меня радует, что есть целая отдельная категория! Пробежимся по тем, кто в ней )
🎸 Guitar Wiz (Индия, соло-разработчик)
Приложение для гитаристов с полноценной поддержкой VoiceOver — голосовые подсказки по аккордам, ладам и высоте тона. Поддерживает Dynamic Type (!!!) и режим «Различать без цвета». Музыка доступна всем
👂 Hearing Buddy (США, соло-разработчик с нарушением слуха)
Субтитры и резюме разговоров в реальном времени прямо на устройстве. Актуально для 466 млн человек с нарушениями слуха по всему миру.
🗓 Structured (Германия)
Планировщик, который ценит отдых не меньше задач. Особенно полюбился нейроотличным пользователям — а это около 15–20% населения планеты. ИИ сам предлагает и заполняет задачи, снижая когнитивную нагрузку. Хочу попробовать, хотя я все же фанат Обсидиана.
Все три приложения сделаны маленькими командами или вообще одним человеком, мощь и выбор каждого разработчика менять жизнь вокруг себя
___
en<able> - о дизайне в A11y | Наши статьи на VC
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥10👍3❤🔥1👏1👌1
Юные победители в Apple 💙
У компании есть конкурс Swift Student Challenge, где студенты со всего мира создают мини-приложения. Ребята объединили платформы Apple, Swift и Ai (чаще использовали Claude на радость теперь уже антропическому Андрею Карпатому, как вам новость кстати?)
И знаете, что ребята сделали? Совсем не миниаппы, вы только посмотрите!
Steady Hands — Gayatri Goundadkar (20 лет, Индия). Вдохновлена бабушкой, которая из-за тремора рук перестала заниматься традиционной живописью. Приложение стабилизирует рисование Apple Pencil для людей с тремором: анализирует «сырые» данные движения через фреймворки PencilKit и Accelerate, отделяет намеренные движения от дрожания и убирает «тремор-компонент». Готовые рисунки показываются в персональном 3D-музее — «чтобы пользователи чувствовали себя художниками, а не пациентами».
pitch coach — Anton Baranov (22 года, Германия). Идея родилась за кухонным столом из слов матери-преподавателя о студентах, у которых много слов паразитов. Приложение даёт обратную связь в реальном времени: отслеживает осанку через AirPods, ловит слова-паразиты («um», «like»), генерирует персональные сводки после каждой сессии через Apple Foundation Models. Вышло в App Store в начале марта, уже более 6000 загрузок. Используют не только для презентаций, но и для репетиций рэпа и стендапа.
Asuo — Karen-Happuch Peprah Henneh (Гана). «Asuo» на языке тви означает «текущая вода». Приложение строит безопасные маршруты эвакуации в зонах наводнений в реальном времени. Считает интенсивность дождя и использует алгоритм поиска пути на основе исторических данных о наводнениях. Доступность была заложена с самого начала: VoiceOver-метки на всех элементах, кастомная голосовая система оповещений через AVSpeechSynthesizer. Henneh — дизайнер, поэтому техническую часть (симулятор дождя) делала с помощью Claude. А еще эта умничка ведёт некоммерческую организацию Radiance Girl Africa, поддерживающую женщин в технологиях.
LeViola — Yoonjae Joung (21 год, Южная Корея). Не смог взять свой альт на стажировку в Нью-Йорк и затосковал по инструменту. Приложение позволяет учиться играть на альте без самого инструмента: камера отслеживает позу рук — суставы левой руки определяют зажатые ноты, угол правой руки — выбор струны. Использовал Create ML для обучения собственной модели и Core ML для интеграции. Осваивать Swift помогали Claude, OpenAI Codex и Google Gemini. Планирует расширить идею на другие инструменты.
Юные разработчики вдохновились личными историями, сделали accessibility ядром продукта, а AI tools позволили ускорить процесс создания.
👉 Полная статья: https://www.apple.com/newsroom/2026/05/ai-meets-accessibility-in-this-years-swift-student-challenge/
У компании есть конкурс Swift Student Challenge, где студенты со всего мира создают мини-приложения. Ребята объединили платформы Apple, Swift и Ai (чаще использовали Claude на радость теперь уже антропическому Андрею Карпатому, как вам новость кстати?)
И знаете, что ребята сделали? Совсем не миниаппы, вы только посмотрите!
Steady Hands — Gayatri Goundadkar (20 лет, Индия). Вдохновлена бабушкой, которая из-за тремора рук перестала заниматься традиционной живописью. Приложение стабилизирует рисование Apple Pencil для людей с тремором: анализирует «сырые» данные движения через фреймворки PencilKit и Accelerate, отделяет намеренные движения от дрожания и убирает «тремор-компонент». Готовые рисунки показываются в персональном 3D-музее — «чтобы пользователи чувствовали себя художниками, а не пациентами».
pitch coach — Anton Baranov (22 года, Германия). Идея родилась за кухонным столом из слов матери-преподавателя о студентах, у которых много слов паразитов. Приложение даёт обратную связь в реальном времени: отслеживает осанку через AirPods, ловит слова-паразиты («um», «like»), генерирует персональные сводки после каждой сессии через Apple Foundation Models. Вышло в App Store в начале марта, уже более 6000 загрузок. Используют не только для презентаций, но и для репетиций рэпа и стендапа.
Asuo — Karen-Happuch Peprah Henneh (Гана). «Asuo» на языке тви означает «текущая вода». Приложение строит безопасные маршруты эвакуации в зонах наводнений в реальном времени. Считает интенсивность дождя и использует алгоритм поиска пути на основе исторических данных о наводнениях. Доступность была заложена с самого начала: VoiceOver-метки на всех элементах, кастомная голосовая система оповещений через AVSpeechSynthesizer. Henneh — дизайнер, поэтому техническую часть (симулятор дождя) делала с помощью Claude. А еще эта умничка ведёт некоммерческую организацию Radiance Girl Africa, поддерживающую женщин в технологиях.
LeViola — Yoonjae Joung (21 год, Южная Корея). Не смог взять свой альт на стажировку в Нью-Йорк и затосковал по инструменту. Приложение позволяет учиться играть на альте без самого инструмента: камера отслеживает позу рук — суставы левой руки определяют зажатые ноты, угол правой руки — выбор струны. Использовал Create ML для обучения собственной модели и Core ML для интеграции. Осваивать Swift помогали Claude, OpenAI Codex и Google Gemini. Планирует расширить идею на другие инструменты.
Юные разработчики вдохновились личными историями, сделали accessibility ядром продукта, а AI tools позволили ускорить процесс создания.
👉 Полная статья: https://www.apple.com/newsroom/2026/05/ai-meets-accessibility-in-this-years-swift-student-challenge/
Please open Telegram to view this post
VIEW IN TELEGRAM
❤7🔥6❤🔥1👏1🤩1