code design
RU EN
~/wiki /ux-i-interfeisy/

UX и интерфейсы

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

Как пользоваться разделом

Эта страница - короткий маршрут по одной теме. Здесь собраны только публичные индексируемые материалы, чтобы перейти от обзора к действию без поиска по всей вики.
16 материалов
01
Начните с самого свежего материала, если нужен контекст по инструменту или релизу.
02
Откройте самый практический гайд первым, если решаете конкретную задачу проекта.
03
Используйте Glossary для терминов и Jobs для проверки спроса вокруг этой темы.

$ ls ./sections

Разделы направления

Основы VibeDesign/

Как устроен VibeDesign: бриф, процесс, роли, насмотренность, критерии качества и работа с ИИ как с дизайн-партнером.
0 статьи

Новости/

Новости и важные обновления из мира ИИ и разработки: релизы инструментов, изменения платформ и их практическое влияние на работу.
0 статьи

UX и интерфейсы/

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

Исследования и UX-методы/

Интервью, CJM, Jobs To Be Done, быстрые UX-проверки, гипотезы, пользовательские боли и способы принимать дизайн-решения на фактах.
0 статьи

Figma и макеты/

Wireframe, auto-layout, компоненты, сетки, подготовка экранов, аккуратная структура файла и практическая работа с Figma через ИИ.
0 статьи

AI-инструменты дизайна/

Claude Design, Open Design, Google Stitch, Pencil.dev и другие инструменты: где они ускоряют работу, а где требуют контроля дизайнера.
0 статьи

Дизайн-система и компоненты/

Токены, цвета, типографика, UI-kit, состояния компонентов, паттерны интерфейса и единый визуальный язык продукта.
0 статьи

Брендинг и айдентика/

Позиционирование, визуальный стиль, логотипы, тон коммуникации, бренд-система и упаковка продукта для узнаваемости и доверия.
0 статьи

Motion и анимация/

Микроанимации, переходы, интерактивные состояния, motion-принципы и анимация, которая помогает интерфейсу, а не отвлекает.
0 статьи

Прототипы и handoff/

Кликабельные прототипы, сценарии, спецификации, handoff в разработку, контроль реализации и приемка интерфейса после сборки.
0 статьи

Редизайн и аудит/

UX-аудит, визуальная диагностика, обновление сайта или продукта, сохранение SEO и план релиза без поломки текущих сценариев.
0 статьи

Доступность/

Контраст, фокус, клавиатурная навигация, читаемость, aria-паттерны и интерфейсы, которыми удобно пользоваться разным людям.
0 статьи

Портфолио и кейсы/

Разборы работ, кейсы редизайна, оформление портфолио, структура результата и упаковка дизайн-проекта для клиента или работодателя.
0 статьи

Новости дизайна/

Релизы AI-дизайн инструментов, обновления Figma, Claude, Stitch и других сервисов, свежие подходы и практические разборы новинок.
0 статьи
UX и интерфейсы
20.06.2026 19 мин

AI-генерированный интерфейс vs человеческий: где пользователь чувствует разницу

Возьмите два экрана checkout: один сгенерирован LLM по короткому промпту, другой собран продуктовым дизайнером за два спринта. На скриншоте — разница на...
VibeDesignUX и интерфейсы
UX и интерфейсы
19.06.2026 18 мин

70% удаляют приложение после первого экрана. Как сделать онбординг который оставляет

Пользователь скачал приложение, открыл, посмотрел первый экран — и удалил. Не потому что продукт плохой. Потому что за первые 30 секунд он не понял, зачем...
VibeDesignUX и интерфейсы
UX и интерфейсы
18.06.2026 18 мин

Аудит сайта через PageSpeed, Lighthouse и Core Web Vitals: пошаговый разбор

Google в 2021 году официально включил Core Web Vitals в алгоритм ранжирования. С тех пор скорость сайта — не только UX-показатель, но и SEO-фактор. Медленный сайт теряет позиции в поиске и конверсию одновременно. Проблема в том, что большинство команд запускают PageSpeed раз в полгода, видят оценку «47», пожимают плечами и закрывают вкладку. Потому что непонятно: что конкретно исправить, в каком порядке, и как это вообще влияет на реальных пользователей. Эта статья — практический алгоритм. Как читать отчёты, что означает каждая метрика, где искать проблемы и как их чинить. Без воды, с конкретикой.
производительностьPageSpeedLighthouseCore Web Vitals
UX и интерфейсы
18.06.2026 19 мин

Agentic UX: как проектировать интерфейсы когда AI действует за пользователя

Пользователь нажимает «Забронируй мне перелёт в Лиссабон на следующие выходные подешевле» — и уходит наливать кофе. Возвращается через минуту, а агент уже...
VibeDesignUX и интерфейсы
UX и интерфейсы
14.06.2026 19 мин

Как измерить качество UX в цифрах: SUS, HEART и PURE без занудства

«Дизайн хороший» — это не аргумент. «Дизайн хороший, потому что SUS = 78, task completion rate = 87%, и ни один пользователь из восьми не сделал critical error» — это уже разговор.
VibeDesignМетрики и аналитика дизайна
UX и интерфейсы
14.06.2026 19 мин

Retention Rate и дизайн: какие UI-решения роняют удержание — а какие растят

Retention — самая честная метрика. Её невозможно накрутить пуш-уведомлениями надолго. Невозможно «купить» скидками на второй месяц без реального продукта. Retention растёт только тогда, когда пользователь находит в продукте достаточно...
VibeDesignМетрики и аналитика дизайна
UX и интерфейсы
14.06.2026 19 мин

Иерархия метрик продукта: как связать UX-решения с бизнес-показателями

Дизайнер переделал онбординг. Пользователи стали проходить его быстрее. Дизайнер доволен. Продакт смотрит на выручку — она не выросла. «Зачем вы вообще это делали?»
VibeDesignМетрики и аналитика дизайна
UX и интерфейсы
12.06.2026 15 мин

Шесть проверок AI-интерфейса перед показом заказчику: чеклист из реальных ошибок

Lovable сгенерировал экраны за час. Выглядит хорошо. Кажется, можно показывать. Именно в этот момент большинство и ошибается. AI отлично делает happy path — тот сценарий где пользователь всё делает правильно, данных достаточно, ошибок нет. Но продукт живёт не в happy path. Он живёт в ситуациях которые не описали в промпте: пустой список в первый день, зависший запрос, текст который не помещается в карточку, кнопка которая выглядит одинаково на трёх разных экранах. Шесть проверок ниже — это не теория. Это конкретные места где AI-интерфейс ломается чаще всего.
VibeDesignAI-дизайнUXчеклист
UX и интерфейсы
12.06.2026 9 мин

AGENTS.md, CLAUDE.md, .cursorrules: какой формат читает ваш AI и как это настроить

Ты открываешь Cursor, Lovable или Claude Code и описываешь задачу. AI начинает работать. Но откуда он знает что твои кнопки называются Button/Primary, а не btn-main? Что у тебя запрещён Inter? Что в папку src/lib/billing/ заходить нельзя? Не знает — если ты не сказал. И каждый раз объяснять это заново в промпте — это не воркфлоу, это потеря времени. Для этого существуют steering-файлы: markdown-документы в репозитории которые AI читает автоматически до того как начать работу. В 2024–2025 каждый инструмент придумал свой формат. В 2026 появился стандарт — но старые форматы никуда не делись.
VibeDesignDESIGN.mdCLAUDE.mdAGENTS.md
UX и интерфейсы
10.06.2026 9 мин

Почему пользователи уходят через 3 секунды — и как это исправить

Пользователь открывает страницу. У него нет задачи разобраться — он просто оценивает: это то, что мне нужно? Это займёт много времени? Это вообще понятно? Если ответы не приходят быстро — он уходит. Не потому что плохой дизайн. Потому что мозг принимает решение «слишком сложно» раньше, чем человек успевает это осознать. Три секунды — не красивая цифра для заголовка. При загрузке страницы дольше трёх секунд показатель отказов начинает резко расти. При загрузке до пяти секунд около 38% пользователей уже ушли. Это данные по скорости загрузки — но та же логика работает и для восприятия контента: если за первые секунды интерфейс не ответил на вопрос «куда я попал и зачем», человек закрывает. В этой статье — конкретные причины, по которым это происходит, и что с каждой из них делать.
UXUIVibeDesignиерархия
UX и интерфейсы
04.03.2026 6 мин

Как сделать читаемый интерфейс без дизайнера: типографика и отступы

Как разработчику сделать читаемый интерфейс без помощи дизайнера. Разбираем практические правила типографики, отступов и иерархии текста, которые реально улучшают UX.
ДизайнТипографикаИнтерфейс