Что если навигация не просит читать, а показывает цветом? В нашем эксперименте каждый раздел сайта получает свой оттенок, а переход между ними ощущается как смена освещения — без единого пункта меню.
Работает ли это без подписей? Спорно. Но заставляет задуматься: почему мы проектируем навигацию только словами, когда визуальная система может передавать смысл быстрее? Цвет — один из самых сильных сигналов восприятия, и мы почти не используем его как навигационный инструмент.
Работает ли это без подписей? Спорно. Но заставляет задуматься: почему мы проектируем навигацию только словами, когда визуальная система может передавать смысл быстрее? Цвет — один из самых сильных сигналов восприятия, и мы почти не используем его как навигационный инструмент.
У каждой задачи в студии есть «свежие глаза» — дизайнер, который не работал над проектом. Он видит то, что не замечает автор после трёх дней правок. Сдвинутый акцент, перегруженная секция, лишний элемент.
Это не контроль. Это страховка от привычности. Чем дольше смотришь на свой экран, тем меньше замечаешь его слабые места. Второй взгляд видит то, что глаз автора «сгладил».
Поэтому каждый макет перед сдачей проходит внутреннюю критику. Короткую, конкретную и без вежливости. Экран становится сильнее не потому, что его долго правили, а потому что кто-то вовремя заметил слепую зону.
Это не контроль. Это страховка от привычности. Чем дольше смотришь на свой экран, тем меньше замечаешь его слабые места. Второй взгляд видит то, что глаз автора «сгладил».
Поэтому каждый макет перед сдачей проходит внутреннюю критику. Короткую, конкретную и без вежливости. Экран становится сильнее не потому, что его долго правили, а потому что кто-то вовремя заметил слепую зону.
Ramp Aviation — компания, которая продаёт сложное оборудование для воздушных судов. Их новый сайт должен был не просто показывать каталог, а передавать компетентность и надёжность.
Мы переработали структуру: на первом плане — специализация, услуги и понятный путь к запросу. Акцент на визуальной подаче техники и премиальном интерфейсе. Никакой лишней информации между клиентом и заявкой.
Сайт работает как витрина экспертизы: если продукт сложный, значит, интерфейс должен быть максимально прозрачным.
Источник: https://verstalabs.ru/portfolio/rampaviation/
Мы переработали структуру: на первом плане — специализация, услуги и понятный путь к запросу. Акцент на визуальной подаче техники и премиальном интерфейсе. Никакой лишней информации между клиентом и заявкой.
Сайт работает как витрина экспертизы: если продукт сложный, значит, интерфейс должен быть максимально прозрачным.
Источник: https://verstalabs.ru/portfolio/rampaviation/
Figma добавила Skills в своего агента — теперь дизайнер может «научить» AI своим паттернам, библиотекам компонентов и типовым решениям. Агент запоминает, как команда работает, и предлагает релевантные варианты без лишних промптов.
Важный сдвиг: AI-ассистент перестаёт быть «чёрным ящиком» и становится настраиваемым инструментом, который перенимает культуру команды. Не абстрактная генерация, а предсказуемые, проверенные решения.
Ключевой вопрос не в том, умеет ли AI генерировать варианты, а в том, может ли он научиться вашему вкусу.
Источник: https://www.figma.com/blog/got-skills-make-the-figma-agent-a-better-collaborator/
Важный сдвиг: AI-ассистент перестаёт быть «чёрным ящиком» и становится настраиваемым инструментом, который перенимает культуру команды. Не абстрактная генерация, а предсказуемые, проверенные решения.
Ключевой вопрос не в том, умеет ли AI генерировать варианты, а в том, может ли он научиться вашему вкусу.
Источник: https://www.figma.com/blog/got-skills-make-the-figma-agent-a-better-collaborator/
Canvas-интерфейсы (Figma, Miro) дают дизайнеру полную свободу, но забирают доступность, которую браузер даёт «из коробки». Текст не читается скринридером, фокус не переключается tab'ом, пользователь теряет контекст.
Решение: каждый интерактивный элемент на canvas должен иметь программную альтернативу — aria-роли, управление с клавиатуры, описания для скринридеров. Чем нестандартнее интерфейс, тем важнее эти механизмы.
Доступность — не про «сделать для всех». Это про то, что любой пользователь может выполнить задачу, независимо от устройства или способа взаимодействия.
Решение: каждый интерактивный элемент на canvas должен иметь программную альтернативу — aria-роли, управление с клавиатуры, описания для скринридеров. Чем нестандартнее интерфейс, тем важнее эти механизмы.
Доступность — не про «сделать для всех». Это про то, что любой пользователь может выполнить задачу, независимо от устройства или способа взаимодействия.
«Узнать больше», «Подробнее», «Читать далее» — эти ссылки ничего не говорят о том, куда они ведут. Пользователь должен гадать: это описание услуги? Цена? Форма заявки? Или ещё одна статья?
Правило простое: текст ссылки должен описывать результат перехода. Вместо «Подробнее» → «Посмотреть стоимость разработки». Вместо «Узнать больше» → «Прочитать кейс AJP CRM».
Ссылка с конкретным текстом работает вдвойне: она помогает понять контент до клика и улучшает доступность для скринридеров.
Правило простое: текст ссылки должен описывать результат перехода. Вместо «Подробнее» → «Посмотреть стоимость разработки». Вместо «Узнать больше» → «Прочитать кейс AJP CRM».
Ссылка с конкретным текстом работает вдвойне: она помогает понять контент до клика и улучшает доступность для скринридеров.
Пустой список, первый запуск, страница без результатов поиска — это не ошибка. Это первый контакт пользователя с интерфейсом. И он чаще всего разочаровывает серым прямоугольником и надписью «Нет данных».
Хорошее пустое состояние показывает, что делать дальше: «Добавьте первый проект», «Настройте уведомления», «Попробуйте изменить фильтр». Оно не констатирует проблему — оно предлагает решение.
Пустое состояние стоит проектировать раньше, чем наполненное. Потому что именно в этот момент пользователь решает, стоит ли остаться.
Хорошее пустое состояние показывает, что делать дальше: «Добавьте первый проект», «Настройте уведомления», «Попробуйте изменить фильтр». Оно не констатирует проблему — оно предлагает решение.
Пустое состояние стоит проектировать раньше, чем наполненное. Потому что именно в этот момент пользователь решает, стоит ли остаться.
Vercel v0, Replit Agent, Bolt.new — инструменты, которые генерируют рабочий код интерфейса по текстовому описанию. За минуту можно получить не картинку, а кликабельный прототип с реальной вёрсткой.
Важный нюанс: AI отлично собирает типовые страницы — лендинги, дашборды, админки. Но чем специфичнее задача, тем больше правок требует результат. AI не знает контекста бизнеса, не видит пользовательских сценариев и не понимает, почему выбран именно этот паттерн навигации.
Поэтому подход меняется: AI берёт на себя рутину — сетки, формы, типовые секции — а дизайнер фокусируется на структуре, смысле и качестве. Скорость черновика растёт, а время на продумывание архитектуры — нет. И это хорошо.
Источник: https://vercel.com/blog/ai-and-the-future-of-design-engineering
Важный нюанс: AI отлично собирает типовые страницы — лендинги, дашборды, админки. Но чем специфичнее задача, тем больше правок требует результат. AI не знает контекста бизнеса, не видит пользовательских сценариев и не понимает, почему выбран именно этот паттерн навигации.
Поэтому подход меняется: AI берёт на себя рутину — сетки, формы, типовые секции — а дизайнер фокусируется на структуре, смысле и качестве. Скорость черновика растёт, а время на продумывание архитектуры — нет. И это хорошо.
Источник: https://vercel.com/blog/ai-and-the-future-of-design-engineering
Figma добавила Draw — инструмент для быстрых набросков и графических эскизов прямо внутри дизайн-среды. В отличие от полноценного векторного редактирования, Draw работает как цифровой скетчбук: штрихи, заливки, растушёвка — без возни со слоями и кривыми Безье.
Интересен не сам инструмент, а сигнал: Figma двигается в сторону более свободного, «бумажного» режима работы. Набросок становится частью рабочего процесса, а не предварительным этапом в отдельном приложении.
Важно не то, насколько хорош Draw сейчас. Важно, куда движется культура инструментов.
Источник: https://www.figma.com/blog/introducing-figma-draw/
Интересен не сам инструмент, а сигнал: Figma двигается в сторону более свободного, «бумажного» режима работы. Набросок становится частью рабочего процесса, а не предварительным этапом в отдельном приложении.
Важно не то, насколько хорош Draw сейчас. Важно, куда движется культура инструментов.
Источник: https://www.figma.com/blog/introducing-figma-draw/
Собрать визуальный референс для проекта раньше означало часы в Pinterest, Dribbble и архивах. Теперь AI собирает мудборд по описанию за пару минут: «премиальный медицинский центр, светлые тона, минимум текста, акцент на фотографиях» — и получаешь 20 вариантов визуального направления.
Важно: AI-мудборд — это стартовая точка, не финал. Он помогает быстрее сойтись с клиентом на тональности и избежать «я не это представлял» на этапе чистовых макетов. Но настоящая визуальная идентичность рождается в ручной работе: подборе точных оттенков, шрифтовых пар, ритма.
Мы используем AI-мудборды как топливо для обсуждения. Быстрый старт, а качество доводим вручную. Это экономит 2–3 дня на предпроекте.
Важно: AI-мудборд — это стартовая точка, не финал. Он помогает быстрее сойтись с клиентом на тональности и избежать «я не это представлял» на этапе чистовых макетов. Но настоящая визуальная идентичность рождается в ручной работе: подборе точных оттенков, шрифтовых пар, ритма.
Мы используем AI-мудборды как топливо для обсуждения. Быстрый старт, а качество доводим вручную. Это экономит 2–3 дня на предпроекте.
Хороший дизайн начинается не с макета. Он начинается с гипотезы: что именно мешает пользователю, какое решение сработает и как мы это проверим.
В студии мы сначала формулируем вопрос, собираем аргументы — данные аналитики, записи сессий, отзывы клиентов — и только потом открываем Figma. Экран — это ответ на гипотезу, а не упражнение в красоте.
Бывает, что проверка занимает больше времени, чем сам дизайн. И это нормально. Потому что рисование без понимания — просто перекладывание пикселей.
В студии мы сначала формулируем вопрос, собираем аргументы — данные аналитики, записи сессий, отзывы клиентов — и только потом открываем Figma. Экран — это ответ на гипотезу, а не упражнение в красоте.
Бывает, что проверка занимает больше времени, чем сам дизайн. И это нормально. Потому что рисование без понимания — просто перекладывание пикселей.
На Config 2026 Figma показала новое направление: шейдерные заливки, эффекты прямо на холсте и кодовые слои, которые живут внутри дизайн-макета.
Шейдеры позволяют создавать сложную визуальную глубину — градиенты, текстуры, органические формы — без экспорта в отдельный редактор. А кодовые слои делают прототип не просто картинкой, а рабочим элементом с реальной логикой.
Важен не сам факт появления функций. Важен вектор: Figma перестаёт быть «плоским» редактором и становится средой, где дизайн и код сближаются до почти неразличимого состояния.
Источник: https://www.figma.com/blog/config-2026-recap/
Шейдеры позволяют создавать сложную визуальную глубину — градиенты, текстуры, органические формы — без экспорта в отдельный редактор. А кодовые слои делают прототип не просто картинкой, а рабочим элементом с реальной логикой.
Важен не сам факт появления функций. Важен вектор: Figma перестаёт быть «плоским» редактором и становится средой, где дизайн и код сближаются до почти неразличимого состояния.
Источник: https://www.figma.com/blog/config-2026-recap/
Если пользователю нужно больше трёх переходов, чтобы выполнить задачу, вы теряете половину аудитории. Не потому что люди нетерпеливы — потому что каждый дополнительный шаг снижает определённость.
Правило трёх кликов — не догма, а индикатор: если навигация глубже трёх уровней, стоит пересмотреть структуру. Часто третий уровень не нужен — достаточно перегруппировать разделы.
Проверьте свой сайт: сколько кликов до контакта, каталога или самой важной страницы?
Правило трёх кликов — не догма, а индикатор: если навигация глубже трёх уровней, стоит пересмотреть структуру. Часто третий уровень не нужен — достаточно перегруппировать разделы.
Проверьте свой сайт: сколько кликов до контакта, каталога или самой важной страницы?
Сколько стоит разработка сайта в 2026 году: из чего складывается цена
Одну и ту же задачу студии оценивают и в 90 тысяч, и в 400 — и обе цифры бывают честными. Разбираем, из чего складывается смета, что двигает цену и какие вопросы задать подрядчику до оплаты.
Читать на сайте
Бизнес · 8 мин чтения
Одну и ту же задачу студии оценивают и в 90 тысяч, и в 400 — и обе цифры бывают честными. Разбираем, из чего складывается смета, что двигает цену и какие вопросы задать подрядчику до оплаты.
Читать на сайте
Бизнес · 8 мин чтения
Серый текст на белом фоне выглядит «аккуратно», но глазам приходится напрягаться. А если пользователь смотрит на экран на улице или с пониженной яркостью — текст исчезает совсем.
Стандарт WCAG рекомендует контраст не ниже 4.5:1 для обычного текста. Это не про «сделать сайт доступным для всех». Это про то, что любой пользователь в любых условиях сможет прочитать ваш контент.
Проверьте цвета своего сайта на контраст. Если соотношение ниже 4.5:1 для основного текста — увеличивайте разницу, даже если придётся отказаться от «красивого» оттенка.
Стандарт WCAG рекомендует контраст не ниже 4.5:1 для обычного текста. Это не про «сделать сайт доступным для всех». Это про то, что любой пользователь в любых условиях сможет прочитать ваш контент.
Проверьте цвета своего сайта на контраст. Если соотношение ниже 4.5:1 для основного текста — увеличивайте разницу, даже если придётся отказаться от «красивого» оттенка.
В проекте ИВА продукт — вазы премиум-сегмента. Мы могли сделать акцент на тексте, анимации или сложной графике. Но выбрали другое: главным героем стала предметная фотография.
Крупные кадры, естественный свет, минимум текста и одна чёткая кнопка действия. Визуал делает всю работу за слова: покупатель видит продукт, понимает ценность и принимает решение. Каждый лишний элемент на такой странице — просто шум.
Когда продукт красив сам по себе, лучший дизайн — не мешать ему быть увиденным.
Источник: https://verstalabs.ru/portfolio/iva/
Крупные кадры, естественный свет, минимум текста и одна чёткая кнопка действия. Визуал делает всю работу за слова: покупатель видит продукт, понимает ценность и принимает решение. Каждый лишний элемент на такой странице — просто шум.
Когда продукт красив сам по себе, лучший дизайн — не мешать ему быть увиденным.
Источник: https://verstalabs.ru/portfolio/iva/
Слайдер из пяти-семи слайдов, которые автоматически переключаются каждые четыре секунды — одно из самых бесполезных решений на главном экране. Исследования NN Group показали: посетители видят только первый-второй слайд. Остальные прокручиваются впустую.
Хуже того: автоматическая смена отвлекает, сбивает ритм и мешает прочитать информацию до конца. Пользователь чувствует, что не контролирует происходящее.
Решение: или один сильный статичный блок, или управляемый вручную слайдер с чёткими маркерами позиции. Автоматическая прокрутка не продаёт — она раздражает.
Хуже того: автоматическая смена отвлекает, сбивает ритм и мешает прочитать информацию до конца. Пользователь чувствует, что не контролирует происходящее.
Решение: или один сильный статичный блок, или управляемый вручную слайдер с чёткими маркерами позиции. Автоматическая прокрутка не продаёт — она раздражает.
Маленькая зелёная галочка и надпись «Данные сохранены» — это не просто уведомление. Это момент, когда мозг получает подтверждение: действие завершено, можно выдохнуть.
Хорошее сообщение об успехе делает три вещи: показывает, что именно произошло («Заявка отправлена», а не просто «Успешно»), объясняет, что будет дальше («Мы ответим в течение дня»), и предлагает следующий шаг («Посмотреть статус заявки»).
Без этих трёх элементов пользователь остаётся в неуверенности. Даже зелёный цвет не спасает, если нет ясности.
Хорошее сообщение об успехе делает три вещи: показывает, что именно произошло («Заявка отправлена», а не просто «Успешно»), объясняет, что будет дальше («Мы ответим в течение дня»), и предлагает следующий шаг («Посмотреть статус заявки»).
Без этих трёх элементов пользователь остаётся в неуверенности. Даже зелёный цвет не спасает, если нет ясности.
🔥1
Prototip Lab — конструкторское бюро, которое разрабатывает промышленные решения для машиностроения. Их сайт должен был не просто представлять компанию, а работать как инструмент: понятно показывать компетенции, услуги и инженерные решения без лишней «креативной» упаковки.
Мы выбрали строгую модульную сетку, техническую типографику и минимум декора. Каждый блок решает одну задачу: показать специализацию, продемонстрировать опыт и привести к контакту. Никакой анимации ради анимации — только если она помогает объяснить технологический процесс.
Когда продукт — инженерная экспертиза, интерфейс должен быть прозрачным, как чертёж.
Источник: https://verstalabs.ru/portfolio/prototip-lab/
Мы выбрали строгую модульную сетку, техническую типографику и минимум декора. Каждый блок решает одну задачу: показать специализацию, продемонстрировать опыт и привести к контакту. Никакой анимации ради анимации — только если она помогает объяснить технологический процесс.
Когда продукт — инженерная экспертиза, интерфейс должен быть прозрачным, как чертёж.
Источник: https://verstalabs.ru/portfolio/prototip-lab/
🔥1
Хороший первый экран за 3 секунды объясняет, чем вы занимаетесь и почему это важно. Плохой — заставляет гадать, скроллить и в итоге уходить.
Пришлите ссылку на сайт — мы посмотрим на первый экран свежим взглядом и выберем три самые заметные проблемы: неработающая иерархия, слабый призыв, визуальный шум, запутанная навигация. Без презентации и обязательств.
Просто короткий профессиональный взгляд со стороны. Пишите на hello@verstalabs.ru — разберём бесплатно.
Пришлите ссылку на сайт — мы посмотрим на первый экран свежим взглядом и выберем три самые заметные проблемы: неработающая иерархия, слабый призыв, визуальный шум, запутанная навигация. Без презентации и обязательств.
Просто короткий профессиональный взгляд со стороны. Пишите на hello@verstalabs.ru — разберём бесплатно.
AI генерирует макеты за секунды, но результат часто выглядит красиво и бесполезно. Причина — не в качестве модели, а в отсутствии контекста: промпт описывает картинку, а не задачу пользователя.
NN Group предлагают подход UX-context design: передавать генератору не «сделай лендинг», а знания о пользователе, его сценариях и цели. Тогда AI подставляет не случайные паттерны, а решение под конкретную задачу.
Вывод: чем больше UX-контекста получает модель, тем ближе её ответ к работающему продукту. Промпт-инжиниринг — не про красивые описания, а про UX-исследование на новом инструменте.
Источник: https://www.nngroup.com/articles/ux-context-design/
NN Group предлагают подход UX-context design: передавать генератору не «сделай лендинг», а знания о пользователе, его сценариях и цели. Тогда AI подставляет не случайные паттерны, а решение под конкретную задачу.
Вывод: чем больше UX-контекста получает модель, тем ближе её ответ к работающему продукту. Промпт-инжиниринг — не про красивые описания, а про UX-исследование на новом инструменте.
Источник: https://www.nngroup.com/articles/ux-context-design/