UX/UI [by Uprock]

Claude уже важнее для дизайнера, чем Figma 📍

Вот наглядный пример из разработки нашей ИИ-платформы Utopy.ai. Дизайнер рисует на бумаге наброски, потом отдает Клоду с комментариями — а тот уже знает нашу дизайн-систему и по ней создает макеты в Фигме. Получается колоссальная экономия времени.

Точно так же нейросеть может: → собирать всю аналитику по проекту и рынку → организовать работу с клиентом → создавать дизайн на основе ваших примеров и прототипов → генерировать визуал: 3D, иллюстрации, графика, фото, видео → программировать сайты и приложения любой сложности Раньше это требовало либо огромного количества времени, либо команды аутсорсеров. Сейчас со всем справится один AI Fullstack-дизайнер с развитым мышлением, вкусом, эмпатией, стратегическим видением и, конечно, системой AI-агентов. 💡 Теперь вы можете прийти к этому с нуля и по отточенному алгоритму — на новом курсе AI FULLSTACK DESIGNER Занятия начнутся 12 ноября. Это самый комплексный курс по нейросетям с упором на практику и реальные результаты: сможете запускать свои сайты, приложения и даже полноценные стартапы. До завтра включительно действует повышенная скидка: 🏷️ 30 000 руб. на любой тариф для студентов и выпускников UPROCK. 🏷️ 20 000 руб. на любой тариф для тех, кто еще не учился у нас. Цена начинается от 49 000 ₽ / 2 875 ₽ в мес. в рассрочку. ➡️ Чтобы уточнить детали или забронировать место, заполните форму по ссылке

Все молчат, а мы расскажем: о фильтрах в корпоративных приложениях🤫 Фильтр в приложении напоминает поиск нужной вещи в шкафу. Если все разложено по полочкам, то найдёшь за секунду, а если нет — будешь копаться час. В бизнес-приложениях с этим часто проблема. И самое удивительное, что в на просторах Интернета об этом почти не говорят. Поэтому мы решили восполнить этот пробел👇

➡️ Читать статью: “Шаблоны и передовые практики проектирования фильтров для мобильных приложений”

Из посетителя 👉 в покупателя Почему одни интерфейсы ведут пользователя к действию, а другие — к кнопке "покинуть страницу"? Дело в том, что один из них просто красивый, а другой продающий (иначе говоря, конверсионный). Это подход к дизайну, который объединяет юзабилити, поведенческую психологию и проектирование интерфейсов. Его задача — сделать взаимодействие с продуктом интуитивным, понятным и убедительным. В новом лонгриде мы подробно разбираем: что такое конверсия, как она связана с UX/UI и какие принципы помогают превращать пользователей в клиентов👇

▶️ Читать лонгрид: "Все о конверсии".

Путешествие в карьеру UX-дизайнера: что взять с собой в дорогу 🛤️ Мы живем в мире, где технологии решают всё: от заказа пиццы до управления умным домом. Но за каждым удобным приложением стоит человек, который сделал сложное простым. UX-дизайн — это не просто картинки, это мост между стремительно развивающимися технологиями и комфортом пользователя. Если вы давно присматриваетесь к этой профессии, но не знаете, с чего начать путь, сегодняшняя статья станет вашим путеводителем📱👇

➡️ Читать статью: Путь к карьере в сфере UX-дизайна: основные выводы

Текст-невидимка, от которого зависит судьба вашего интерфейса🫥 Мы привыкли судить об интерфейсе по картинке: красивые кнопки, удобные формы, стильные иконки. Но непонятная подпись на кнопке или слишком сухое уведомление могут разрушить даже самый гениальный дизайн. И наоборот — точная фраза способна спасти даже неудачный визуал. Этот "невидимый" текст, который сопровождает пользователя повсюду (от подсказок в полях до сообщений об ошибках) называется микрокопией. В новой статье разбираем, как работать с этим, на первый взгляд, крошечным по объему, но супер-мощным по влиянию инструментом👇

➡️ Читать лонгрид: "Микрокопия в интерфейсах".

Ваш интерфейс молчит, поэтому ему не доверяют🤐 В реальной жизни вы считываете состояние человека мгновенно, еще до того как он заговорит — по взгляду, мимике и позе. Это дает ощущение контроля над ситуацией. С интерфейсом та же логика. Когда пользователь видит, чем сейчас занята система, он чувствует, что все под контролем. Когда этого не происходит, начинает гадать, нервничать и автоматически теряет то, за что борется каждый дизайнер — доверие. Казалось бы, в чем сложность показать видимость системы? Но именно на этом этапе многие интерфейсы ломаются. Особенно в корпоративных продуктах, где логика специфична, а цена ошибки высока.

💬 В статье "Как визуализировать состояния системы" расставим все точки над "и".

Как убедить пользователя подписаться на рассылку? 📩 Что вы сделаете, увидев "Подпишитесь и получайте новости первыми!"? Правильно, начнете искать иконку с крестиком, чтобы поскорее закрыть этот попап. Почему так происходит? Потому что пользователю не объяснили ценность. В погоне за базой email-адресов компании часто забывают о здравом смысле и начинают давить на пользователя. Но как сделать форму подписки, которая не бесит, а помогает?👇

➡️ Разбираем в новом лонгриде: "Форма подписки на рассылку: как привлечь пользователя".

Секретное оружие вашего дизайна🤫 Попробуйте вспомнить шрифт на кнопке "Купить" или в меню сайтов, которые вы открываете каждый день. Сложно, правда? Мы не замечаем хорошую типографику, но именно она управляет нашим восприятием информации. Шрифты помогают передать индивидуальность бренда и повысить читабельность. Многие новички используют стандартные Arial или Times New Roman, потому что так безопаснее. И в итоге их сайты выглядят так же, как тысячи других. Как этого не допустить?👇

➡️ Читайте в новой статье: "24 лучших шрифта для веб-сайтов. Подборка от Figma".

Вечная классика: почему ар-деко снова в моде? 💎 Роскошь, элегантность и геометрия — синонимы ар-деко. Стиль, который родился в начале XX века, но до сих пор диктует правила в интерьерах, графике и веб-дизайне. Насыщенные цвета, симметрия и дорогие материалы — его визитная карточка. Как использовать принципы ар-деко в своих проектах, чтобы они выглядели дорого и современно?👇

↗️ Узнаете в новом лонгриде: "Ар-деко в дизайне".

Красиво ≠ Правдиво 📊 Мы живем в мире, где информации больше, чем когда-либо, но доверия к ней все меньше. И часто виноваты в этом дизайнеры. Когда мы выбираем "красивую картинку" вместо точности, визуализация превращается в инструмент манипуляции. Как не стать тем самым дизайнером, чьи работы вводят в заблуждение? Разбираем типичные ошибки и правила честной визуализации в новой статье👇

👉 Читать статью: "Цифры не должны обманывать: обзор типичных ошибок при визуализации данных".

Красивый интерфейс ≠ удобный интерфейс🙅‍♂️ Мы все на это попадались: сайт выглядит как произведение искусства, эффектные анимации, красивая типографика, а потом 5 минут ищешь кнопку оформления заказа. Красивый визуал продаёт первое впечатление. Но удерживает пользователя на сайте совсем другое👇👇

➡️ Читайте в новом лонгриде: "Почему «красивый» UI-дизайн может быть плохим и не наступайте на грабли, которые уже прошли другие".

Завтра в 19:00 МСК собираемся на вебинаре по вайбкодингу Соберем сайт (прикрепили пример выше☝️) без опыта работы с кодом — только Claude Code и правильные задачи для нейросети. В прямом эфире пройдем весь процесс от идеи до публикации вместе с Евгением 👋 и Артемом 👋 (продуктовый дизайнер, 6+ лет в Альфа-банке). Разберем:

• как использовать Claude Code для верстки и топовых анимаций • что такое «скиллы» и как они упрощают работу с нейросетями • как выстроить работающую связку Figma → Claude Code • что учитывать в макете для быстрой публикации в вебе • и с чего начинать дизайнеру, который только слышал о вайбкодинге.

Вебинар по этой теме у нас не первый, так что все вопросы и опасения нам знакомы. На все ответим простым языком с примерами из практики. 🎁 И, по традиции, всем участников эфира подарим токены для старта практики в ИИ, так что обязательно будем ждать каждого. 🔜Регистрация здесь

И сайт красивый, и анимации эффектные, но люди уходят. Почему так происходит? ❓ Потому что красиво — не значит понятно. Пользователь заходит и не понимает: куда смотреть и где нажать, чтобы быстро получить то, за чем пришел. Мозгу нужно всего пару секунд на расшифровку, и если за это время не успел разобраться, то просто покидает сайт. Если так происходит, значит вы нарушили законы визуальной иерархии. Это не вкусовщина и не мимолетный тренд, а психология восприятия. Поэтому знать их должен каждый дизайнер.

👉 Читать статью: "Основы дизайна: руководство по визуальной иерархии (с инфографикой)".

Как потерять пользователя раз и навсегда🙅‍♂️ Коллеги, а вы сталкивались с приложениями, где кнопку "Отписаться" возможно найти только через поддержку? Или нажимаешь "Попробовать бесплатно", а через пару дней списание. Оказывается, галочка "Продлить автоматически" стояла по умолчанию. Это не ошибка и не случайность. Это манипулятивный дизайн — когда интерфейс намеренно подталкивает человека к действиям, которые ему не выгодны. Тёмные паттерны работают в краткосроке: конверсия и метрики растут. Но в долгую — это медленная смерть продукта. Пользователь не жалуется, он просто уходит навсегда. Как этого не допустить?👇

➡️ Узнаете в новом лонгриде "Манипулятивный дизайн".

🔵Сегодня в 19:00 мск встречаемся на бесплатном вебинаре по Claude Code Будем разбираться, как дизайнеру собирать сайты в Claude Code без полноценного погружения во фронтенд. Подробно рассмотрим на практике, как устроены такие сайты, как грамотно составлять задачу для Claude и создавать сложные эффекты и анимации. Отдельно разберем, что важно понимать самому, а что можно делегировать нейронке. Покажу не просто возможности инструмента, а сам процесс работы. Если давно хотели разобраться, как это работает, то самое время подключиться. ⏰ Уже сегодня в 19:00 по МСК 🤠 Зарегистрироваться на вебинар

⚙ Как собирать сайты в Claude Code Совсем недавно для создания сайта со сложными анимациями и эффектами нельзя было обойтись без разработчика. Сейчас все стало гораздо проще: дизайнеру уже не обязательно осваивать фронтенд целиком. Достаточно разобраться, как работать с Claude Code, и можно самостоятельно собирать и верстать такие проекты. 🔵 17 сентября в 19:00 по МСК проведу открытый вебинар и покажу вам на практике, как это работает в Claude Code.

Что разберем: 🔵как устроены такие сайты внутри; 🔵как правильно ставить задачи Claude Code; 🔵как собирать сложные анимации и визуальные эффекты; 🔵как двигаться от идеи к готовому проекту шаг за шагом.

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

Рецепт создания объёмной графики: 6 шагов, 0 страданий👩‍🍳 Объёмная графика придает интерфейсу глубину, выделяет CTA и повышает вовлечённость. Крупные фигурные иконки, разборные схемы, визуализации продукта — всё это объясняет пользователю быстрее и доступнее, чем текст. Но есть нюанс. Обычно за такой картинкой стоят долгие часы рутинной работы: сетки, углы, выравнивание каждой грани. Именно на этом этапе многие сдаются. Хорошая новость в том, что сегодня мы готовы поделиться способом, как создавать объемные иллюстрации гораздо проще и быстрее👇

✨ Читайте в статье: "Как освоить новое измерение: туториал по созданию изометрических иллюстраций".

Вкус — это врожденный талант 🚫 Спойлер: это миф, в который верят почти все новички. Правда в том, что насмотренность — это всего лишь навык, такой же тренируемый, как и любой другой. И его можно прокачать с нуля, даже если вы раньше не имели ничего общего ни с дизайном, ни с творчеством. С приходом ИИ порог входа в профессию падает: освоить Figma и другие инструменты теперь может каждый. А вот умение принимать визуальные решения и видеть, что реально работает — то, что отличает высококлассного специалиста, и это нужно тренировать. Как это сделать?👇

Узнаете в новом лонгриде: "Как развивать насмотренность в UX/UI-дизайне".

Коллеги, давно у нас не было вебинаров в теплой ламповой обстановке Хочу завтра поделиться новыми методиками UPROCK и прямо по шагам рассказать, как создавать топовые сайты, которые получают награды. В конце расскажу про новый-старый курс «ULTRA UI: Завоевываем AWWWARDS». А основую часть посвящу мякотке: как создаются раскадровки анимаций, прорабатываются идеи и референсы, как строится работа с ИИ.

Разбор проведем на примере проекта студентки Марьяны (приложил к посту)

↗Все будет завтра в 19:00 по МСК, регистрация на мероприятие в этом боте Ставьте – 🤗, если тоже соскучились по нашим милым встречам