Дизайн

Промышленный дизайн – точка, где сходятся эстетика, инженерия, бизнес-логика и пользовательский опыт. Промдизайн не только делает вещь красивой: он упрощает взаимодействие человека с ней, повышает эффективность ее использования, усиливает бренд и зачастую определяет успех разработки. О том как роль промдизайнера выходит за рамки «визуала», и он становится соавтором разработки поговорили с Родионом Усаевым, который прошел путь от стажера до арт-директора и руководителя проектов, работая со стартапами, европейскими дизайн-студиями и международными корпорациями. Мы решили поговорить о трендах современного дизайна, как придумать внешний вид и форму вещи, чтобы она стала желанной и манящей. А также как дизайнерам и разработчикам сработать синергично, чтобы реализовать яркие идеи в конечном изделии.

Привет! Меня зовут Даниил Замешаев, я frontend-разработчик в компании МойСклад, и в том числе занимаюсь развитием внутреннего UIKIT компании.

В этой статье я расскажу про подход к анализу дизайнерских требований для frontend-разработчиков. На примере реального кейса я хочу поговорить о двух практических вещах:

- как анализировать дизайнерские требования так, чтобы на выходе получать понятные технические требования, пригодные для реализации;

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

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

В нашу жизнь уже достаточно давно ворвался тренд на дизайн-системы. Пройдя через все стадии принятия, почти все, наверное, уже поняли, что нет того самого идеально-единого-гибкого решения, которое устранит все проблемы, ускорит процесс разработки и исключит изобретение велосипеда (если у кого-то получилось идеально, дайте знать).

Меня зовут Катя Бурлакина, я старший продуктовый дизайнер в VK Tech и занимаюсь развитием дизайн-системы. В этой статье я не буду рассказывать про весь наш путь, а расскажу про его часть — систему дизайн-токенов. Спойлер: при помощи нее у нас получилось устранить некоторые проблемы, ускорить процесс разработки и даже исключить изобретение велосипеда. 

Привет! На связи Мурат — некогда руководитель поддержки, а теперь разнорабочий и Ян — арт-директор продукта. Совсем недавно мы начали разработку нового продукта под кодовым названием «viju tv». Это приложение, которое меняет привычный паттерн поиска и просмотра контента, объединяя в себе лучшие механики прошлого века и завтрашних технологий (надеюсь, это звучит не очень пафосно)

Привет, Хабр! На связи команда виртуализации Astra Cloud. 

Мажорное обновление Astra Cloud Platform будет уже скоро (спойлер: в мае). Мы готовимся к этому основательно, но уже сейчас нам есть, чем поделиться. В частности, в составе платформы серьезно апгрейдился ключевой компонент виртуализации — ПК СВ «Брест».

Если вы администрируете системы виртуализации — этот материал для вас. Будет много про удобство, про мастера, про бэкенд и про то, как мы учитывали пожелания администраторов, когда меняли интерфейс. Готовы?)

Март 2026 года. Не просто временный кризис, а трансформация всей ИТ-индустрии. Конец эпохи количественного найма и переход к стратегии экстремальной плотности талантов.

Люди внезапно стали слишком дорогим и медленным интерфейсом по сравнению с алгоритмами. Корпорации активно соревнуются в том, кто быстрее избавится от человеческого фактора в пользу вычислительных мощностей. Март и начало апреля 2026 года стали настоящей черной полосой для сотрудников среднего звена.

Для Бигтеха это был месяц «великого перехода»: вместо того чтобы платить людям зарплаты, они перенаправили эти миллиарды на закупку чипов и строительство дата-центров. Март 2026-го войдет в историю как момент, когда корпорации окончательно перестали стесняться увольнять сотрудников.

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

Эта подборка поможет увидеть актуальные UX-тренды и найти вдохновение для развития собственного e-commerce-проекта.

Привет! Я Коля Димов, руковожу дизайном и исследованиями продукта в Делимобиле. Хочу поделиться тем, как можно оценивать и помогать сотрудникам расти, чтобы их развитие было неотделимо от рабочих задач.

Привет, Хабр. Меня зовут Глеб Бобыльков. Я ведущий дизайнер команды записи и цифровых продуктов в СберЗдоровье — MedTech-компании №1 в России. В этой статье покажу, как мы переделали финальный экран после записи к врачу на очный приём и превратили его из страницы подтверждения в сценарий «что дальше», набор гибких кросс-офферов и универсальный компонент для дизайн-команды.

Этот кейс про баланс: как добавить бизнес‑ценность и не разрушить доверие на одном из самых чувствительных шагов пользовательского пути — сразу после записи к врачу.  

Если посмотреть на первые эскизы устройства и на то, что в итоге уходит в производство, между ними часто оказывается большая разница. Не только во внешнем дизайне. Гораздо сильнее меняется внутренняя архитектура.

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

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

Это происходит не из-за некомпетентности команды. Это почти неизбежный эффект того, как устроен процесс разработки сложных устройств.

У нашей IT-компании не было логотипа.

Мы делаем дизайн для клиентов — в том числе логотипы. Проектируем айдентику, спорим о кернинге, подбираем цвета по Pantone. А собственный логотип? «Ну, потом.» Годами «потом». Классический сапожник без сапог.

В какой-то момент команда прямо сказала: «Мы — AI Dev Team. Без логотипа. Серьёзно?» Возразить было нечего. Когда отправляешь клиенту презентацию, а в шапке — пустое место, «потом» заканчивается.

Решение было предсказуемым для IT-команды: не «загуглить лучший генератор логотипов», а провести нормальное исследование. Бесплатные тарифы, форматы экспорта, юридические условия, подводные камни. Я дал задание, команда вернулась с разбором 13 сервисов. Делюсь результатами — но начну не с инструментов, а с ловушки, в которую попадают все.

Группа полярников отрезана от Большой земли суровой зимой. К ним на станцию пробирается пришелец, замерзший когда-то в антарктических льдах и разбуженный неосторожными исследователями. Кто доживет до весны, а кто станет жертвой инопланетянина?

Впервые этот рассказ экранизировали в 1951 году. Но, конечно, на слуху у всех ремейк, снятый Джоном Карпентером («Хэллоуин», «Побег из Нью-Йорка») в 1982 году. Карпентер с детства любил оригинальный фильм и хотел его модернизировать, чтобы как следует напугать искушенную аудиторию.

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

Дисклеймер: «Нечто» — фильм ужасов, поэтому в нем полным-полно весьма отвратительных эффектов, крови и жестокости. Самые визуально неприятные моменты в статье под спойлерами, открывайте на свое усмотрение.

Когда обсуждают AI-generated UI, разговор обычно быстро уходит в одну из двух крайностей.

Первая крайность звучит так: можно ли это сразу нести в продакшен?

Вторая так: насколько результат похож на дизайн-языки, от Apple до Material Design.

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

Главная польза AI-generated UI часто лежит не в скорости производства экранов, а в поставке визуальных мутаций.

Но и это, как мне кажется, ещё не самый интересный слой темы.

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

Именно этот сдвиг, по-моему, и заслуживает более внимательного разговора.

Стартовый гайд, для тех, кто хочет на простом примере научиться генерировать из Figma как минимум веб-страницу, которая: сделана по дизайну, адаптивна под разные размеры экрана, учитывает retina и non-retina дисплеи, поддерживает локализацию с динамическим переключением языков и позволяет реализовать другие свои хотелки

Последние несколько лет я усиленно увлекаюсь любительской видеореставрацией: беру старые мультики, прогоняю их через большие пайплайны цифровой обработки, зачастую работаю с аудио и по итогу всё это собираю в MKV-контейнеры. От «Чипа и Дейла» эпохи старого Диснея до чистой цифры в виде «Врат Штейна».

Казалось бы: «Обложка да обложка, какая разница? Главное — видео и звук!» Но вы крупно недооцениваете мою любовь к перфекционизму.

Проблема была даже не в том, что обложек нет, а в том, что ими почти никто не занимается. Ни корпорации-издатели, ни даже базы от энтузиастов вроде TheTvDB зачастую почти не уделяют нормального внимания стародавним релизам, из-за чего лично у меня возникает странный контраст: на диске лежит моя отреставрированная классика в 4К, а медиа-сервер подтягивает размытый скриншот серии с VHS-кассеты начала 2000-х. А иногда та же практика применяется и к новым релизам 0_0 Ужас ведь.

В этой статье я хочу показать свой путь проб и ошибок — от примитивных «ИИ-фильтров» на «Чип и Дейле» и автоматических скриптов для «Розовой пантеры» до освоения цветокоррекции и ручной реставрации на куче обложек для «Тома и Джерри», а затем — до сложного и зачастую ещё более муторного симбиоза ИИ-генерации и ручной доводки при создании уникальных постеров для «Врат Штейна» и других сериалов.

Когда RuStore только запускался, мы строили дизайн на основе UI-кита от VK — удобно, практично, а главное помогло нам быстро вывести продукт на рынок. Но стор рос, интерфейсов становилось больше, дизайнеры — смелее, а требования — сложнее. И вот настал день, когда мы решили добавить тёмную тему. И всё сломалось. 

Именно тёмная тема вскрыла нашу главную проблему — ранняя структура цветовых токенов не готова к масштабируемости. Любое изменение запускало каскад правок и ломало синхронизацию между макетами и кодом. 

Под катом мы — Элина Шевченко, продуктовый дизайнер RuStore, и frontend-разработчик Андрей Едунов — расскажем историю, как мы полностью перестроили систему, не останавливая разработку, аккуратно вынесли всё из Figma в код и почему теперь можем масштабировать дизайн без драмы, даже если завтра понадобится не только тёмная тема, но и ностальгия по 2008-му, где primary — это чистый #000000, а secondary — оттенок тоски.

У продуктовых дизайнеров есть странная ловушка: индустрия производит огромное количество контента про рост в профессии, но сам рост от этого почти не происходит. Можно годами смотреть референсы, читать разборы и ходить по курсам — а потом все равно теряться в работе с живым продуктом, где есть ограничения, метрики, конфликты и цена ошибки. 

Я это видел много раз — и в студии, и в больших командах. Поэтому ниже не советы в духе «потрать 10 000 часов», а разбор того, что реально ускоряет рост и почему стандартные пути часто тормозят и не помогают.

Прилетела как-то ко мне задача: нужно оперативно сделать 4 посадочные страницы для разных чат-ботов, чтобы показать продукты внутри одной компании, то есть, заходя на сайт бренда, можно перейти на промостраницу каждого из них. Сразу поясню – заказчик крупный, мы делаем для него пул задач кастомной разработки. В этот раз он хотел подготовить отдельные промо на каждый вид продукта.

Подобные задачи я делаю на Тильде, которая подходит для небольших проектов. Иногда и сам клиент просит сделать сайт именно на этой платформе, так что опыт работы с ней у меня накопился приличный.

Оценила сроки и выдала: «За 2 недели будет готово». Но у заказчика был конкретный запрос — попробовать собрать лендинги с помощью ИИ и уложиться в более сжатые сроки.

Попробовала прикинуть, как ускориться — например, собрать макеты с помощью AI, перевести в Figma, и можно уложиться в полторы недели. Но и это не совсем подходило. Тогда гендиректор мне подсказал: «А попробуй вайбкодинг». Ну давайте пробовать, что уж там!

Когда разработчик открывает CAD-пакет и начинает разводку многослойной печатной платы, он реализует не только электрическую схему, но и технологическую судьбу изделия. От того, на каких слоях будут проложены сигналы, размещены полигоны питания и «земли», зависит не только помехоустойчивость, но и то, насколько легко плату будет изготовить, проконтролировать и, если потребуется, отремонтировать после пайки.

На нашем производстве мы регулярно сталкиваемся с проектами, где внешние и внутренние слои используются неоптимально. Например, силовые цепи пытаются спрятать внутрь, забывая про теплоотвод, или, наоборот, критичные высокочастотные линии выводят наружу, получая недопустимые наводки. Разберём принципиальные различия между внешними и внутренними слоями — с точки зрения технологии, электрики и эксплуатации.

Внешние слои. Верх и низ (Top и Bottom)

Верхний и нижний слои — это «лицо» печатной платы. Как правило, они покрыты паяльной маской, имеют контактные площадки для компонентов и непосредственно взаимодействуют с окружающей средой. Их трассировка имеет ряд характерных черт.

Технология изготовления

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

Информационный мусор может содержаться: в тексте, в навигационных структурах, в колористике, в формах и в избыточности визуальных метафор (иконок) внутри интерфейса.