UX/UI [by Uprock]

Как убедить пользователя подписаться на рассылку? 📩

Что вы сделаете, увидев "Подпишитесь и получайте новости первыми!"? Правильно, начнете искать иконку с крестиком, чтобы поскорее закрыть этот попап.

Почему так происходит? Потому что пользователю не объяснили ценность. В погоне за базой 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 по МСК, регистрация на мероприятие в этом боте

Ставьте – 🤗, если тоже соскучились по нашим милым встречам

Контекстное меню: инструкция по применению 📐

Коллеги, поднимите руку, кто из вас сталкивался с ситуацией, когда клиент просил спрятать все лишнее, а потом жаловался, что пользователи не находят нужную кнопку? 🙋‍♂️

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

Как использовать этот инструмент правильно?😂

Читай в сегодняшней статье "Проектируем контекстные меню: 10 рекомендаций".

Страница, которую часто рисуют в последнюю очередь ❌

Коллеги, давайте начистоту: когда вы начинаете проектировать сайт, раздел "Помощь" идёт где-то в конце списка задач, да? Но правда в том, что именно эта страница чаще всего определяет, вернётся пользователь или нет.

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

➡️ В новом лонгриде "Дизайн раздела поддержки на сайте", разбираемся, как правильно спроектировать эту страницу.

Чем меньше экран, тем больше ответственность 📲

Частая история: на большом экране макет выглядит как конфетка, а на телефоне превращается в тыкву. Особенно, когда дело касается текста.

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

➖ В статье "Мастерство мобильной типографики: советы по использованию шрифтов и лучшие практики" рассказали 5 базовых принципов: от выбора гарнитуры до расстановки символов.

Сигнал, который пользователь считывает за 0,1 секунды🟩

Мы не читаем уведомления — мы их чувствуем. За долю секунды мозг ставит диагноз: красный = кровь/огонь, зелёный = трава/безопасность. Без текста, без иконок — один только цвет. Так работает наше подсознание

Поэтому, когда дело доходит до системных уведомлений, забудьте про "хочу красиво". Нужно сделать так, чтобы пользователь получил верный сигнал. Как это сделать?👇

➡️ Разбираемся в лонгриде "Как цвет системных уведомлений влияет на ощущение безопасности".

Бесплатный интенсив: коммерческая 3D-графика в нейросетях 🔥

В Utopy.ai стартует серия интенсивов для дизайнеров и всех, кто хочет лучше разобраться в нейросетях. Уже сегодня в 19:00 МСК начинается бесплатный интенсив по созданию коммерческой 3D-графики.

Пошагово разберем весь процесс: от идеи и построения сцены до работы со светом, фонами, текстурами и ракурсами. Также расскажем, как анимировать готовую графику.

Что вас ждет:
✦ Теория и пошаговый алгоритм создания объемных объектов;
✦ Инструменты для генерации 3D;
✦ Полезные приемы и промпты;
✦ Практические задания;
✦ Разбор работ участников;
✦ Бесплатные токены Utopy.ai;
✦ Розыгрыш призов.

➡ Регистрируйтесь по ссылке