🧠 В Фотошопе поняли, что проблема не в генерации, а в разрыве между намерением и результатом

Generative Fill уже умел менять изображение по текстовому запросу. Но когда в Фотошоп добавили Reference Image, быстро выяснилось, что пользователи ожидают от него не «примерное вдохновение», а гораздо более управляемый результат. То есть проблема была не в самой идее, а в том, как люди понимали влияние референса и насколько могли контролировать итог. Самое интересное в кейсе Adobe не финальный интерфейс, а сам путь. Команда прошла через несколько раундов исследований, пробовала разные сценарии, даже собрала отдельный Protoshop, чтобы тестировать гипотезы быстрее, чем через десктопный Фотошоп. В процессе отвалились лишние настройки, поменялась логика взаимодействия, а главный вывод оказался довольно приземленным: пользователю важнее не количество контролов, а понятный способ заранее выразить намерение. Внутри: – Почему первый интерфейс с референсом не совпал с ожиданиями пользователей; – Какие непонимания вскрылись между промптом и референсным изображением; – Почему людям было важно управлять степенью влияния референса; – Зачем команда пробовала drag-and-drop и почему этот путь не сработал; – Как отдельный Фотошоп ускорил цикл тестирования и переделок; – Почему пришлось адаптировать технологию под поведение людей, а не наоборот; – Как в финальной версии упростили сценарий и убрали лишнюю сложность; – Что этот кейс говорит о дизайне AI-функций в целом: контроль важнее магии. ➡️ Читать статью ——— 💻 Курс по поиску работы 😍 Про дизайн 🔥 Вакансии дизайнерам 🎨 Референсы

Продолжаем делать концепты и тестировать Claude Code: делаем интерактивный слайдер на сайте☺️

→ Higgsfield + Figma MCP + Claude Code Благодаря инструкции Claude сможет быстрее сообразить как сделать такой слайдер 💻 1. Инструкцию нужно складывать в ту же папку, где у вас лежат все файлы по сайту (шрифты + те файлы, что вы будете делать по инструкции)/либо загружать её в чат с Claude с ссылкой на макет и другие материалы 2. Важно повторять все те действия, что описаны в ней – там пошагово сказано как и что делать не только с точки зрения верстки, но и как подготовить материалы ⚠️Обратите внимание, что помимо инструкции Claude нужно дать макет в Figma (с включенным MCP и загруженными фотографиями) + фото, видео 360° для каждой модели при ховере (всех моделей + видео я генерировала в Higgsfield, используя Nana Banana Pro и Kling) Ссылка на инструкцию🔗 *Выше я делала инструкцию как скачать/зайти/установить Claude #полезное #клод

♿️ Accessibility в приложении нужна не только людям, но и AI-агентам

Обычно AI-агенты работают с интерфейсом как человек: делают скриншот, пытаются понять по пикселям, где кнопка, и тыкают по координатам. Это медленно, дорого по токенам и довольно хрупко. Автор показывает более умный путь: использовать accessibility tree, который уже есть внутри iOS-приложения и который читают VoiceOver и XCTest. Если у элементов нормально заполнены identifier, label, hint, value и traits, агенту не нужно гадать по картинке. Он может детерминированно находить элемент, понимать, что он делает, и нажимать точно в цель. Плюс это полезно не только для AI: вы одновременно улучшаете доступность для людей и делаете приложение гораздо удобнее для автоматизации, тестов и агентной навигации. Внутри: – Почему навигация по скриншотам для AI дорогая, медленная и хрупкая; – Что такое accessibility tree и какие пять свойств в нем важны; – Какие SwiftUI-модификаторы стоит добавлять на кнопки, строки списков и экраны; – Зачем отслеживать координаты элементов, если у них уже есть identifier; – Почему строгий нейминг accessibility-id сильно помогает агентам; – Как populated accessibility tree меняет экономику токенов и скорость работы; – Почему AI-навигация полезна не только для тестов, но и прямо во время разработки; – Как accessibility и AI support здесь работают как одна и та же инвестиция. ➡️ Читать статью ——— 💻 Курс по поиску работы 😍 Про дизайн 🔥 Вакансии дизайнерам 🎨 Референсы

💗 Напоминаем, что уже сегодня стартует наш бесплатный интенсив по нейросетям для дизайнеров

На интенсиве разберем, как использовать ИИ для реальных продуктовых задач: интерфейсов, структуры экранов и работы с UX. Будем тестировать новый инструмент Stitch от Google, смотреть на качество генераций и учиться выстраивать работу с нейросетями как полноценный дизайн-процесс. 💙 Присоединяйтесь в боте На эфире подарим токены для дополнительных генераций в Utopy.ai, а также вы получите практику и домашние задания
Как я пытаюсь выстроить связку Figma + Claude (часть 1)
Мечта любой команды разработки сейчас — автоматизировать сборку дизайна с помощью LLM, чтобы ускорить delivery-процесс. Я видел несколько разных подходов, но в итоге пришёл к чему-то, что, как мне кажется, должно сработать удобно Рассказываю на примере проекта, где я на фрилансе (oversecured.com) Дано: - legacy-архитектура фронта, которую сложно масштабировать с LLM-кой - отсутствие части макетов в Figma + неактуальность макетов Что хотим: - заиметь макеты в Figma, которые выступают как источник правды - можно дать ссылку на макет, и LLM (Codex/Claude) его соберёт - UI-kit/дизайн-система, которая полностью совпадает в Figma/code Как мы решили это сделать: 1. Подключаем для кода open-source библиотеку компонентов shadcn (https://ui.shadcn.com/create). Компонентов там достаточно много + они гибкие (можно внутрь прокидывать много свойств). Это наша база, из которой мы будем собирать весь фронт 2. Берём для этой же библиотеки какой-то из Figma-файлов (вот здесь (https://ui.shadcn.com/docs/figma) есть несколько ссылок на файлы community, на них ссылается сам shadcn). Это наша вторая база, из которой мы будем собирать все макеты в Figma Мы пока не придумываем дизайн и не собираем компоненты с нуля, чтобы ускориться на старте, — просто берём готовое решение. 3. Начинаем собирать макеты в Figma из компонентов, которые мы взяли в community. На скрине — дизайн 4. Дальше через Figma MCP мы можем отдавать нашему AI-агенту ссылку на макет и просить собрать дизайн с помощью компонентов shadcn (можно также использовать shadcn MCP (https://ui.shadcn.com/docs/mcp)) Для тех, кто еще не знает: MCP — это протокол, через который LLM общается с внешними тулами вроде Figma. Важно здесь отловить одну вещь: AI-агент должен вытаскивать из Figma не скриншот макета, а структуру страницы (для этого используются разные методы). И всё — это работает. Простые страницы уже собираются верно на 95–100%, страницы посложнее пока тестируем Первая задача — актуализировать весь фронт на новых гибких компонентах. Во второй части (когда я к ней подойду) я хочу иметь возможность стилизовать компонент в Figma и стащить дизайн на фронт, чтобы в коде он тоже стилизовался В теории, проблемы тут быть не должно, потому что мы взяли в коде и в Figma одинаковую семантику токенов (и там и там shadcn) — то есть цвет в коде и цвет в Figma называются одинаково, например surface-default-100 Я уже предвижу некоторую сложность со стилизацией и со сборкой сложных экранов, так как в Figma компонент не всегда соответствует по пропсам тому, что есть на фронте в библиотеке shadcn (часть свойств может отсутствовать, часть — называться иначе). Тут потребуется немного ручной настройки и тюнинга компонентов в Figma Часть 2 напишу, когда подойду к ней!
🆕 Вайб-блок — новый способ создания блоков
Теперь, когда вам потребуется добавить на сайт сложную анимацию, интерактивный калькулятор, слайдер, инфографику или форму со сложной логикой, не придётся разбираться в коде. Просто опишите, что хотите получить — и ИИ сам создаст нужный блок прямо в редакторе. Подробнее о Вайб-блоке рассказываем в блоге 👉 https://blog.tilda.cc/vibe-block Где найти: Библиотека блоков → Другое → Вайб-блок Ещё не тестили Вайб-блок? Попробуйте его в действии! #tildaupdates
«Если вы используете ИИ — вы дизайнер не очень»
Интересно, что раньше примерно так же говорили про фотошоп, иллюстратор и даже про цифровые эскизы 😄 Почему-то никто не считает плохим дизайнером человека, который использует: — графический планшет — компьютер — профессиональные программы — автоматизацию Хотя всё это тоже когда-то называли «не настоящим творчеством». ➡️ ИИ не работает вместо дизайнера. Он ускоряет рутину, помогает тестировать идеи, визуализировать, искать варианты и усиливать подачу. Но вкус, насмотренность, понимание конструкции, композиции и работы с продуктом - всё равно остаётся за человеком. Проблема не в ИИ. Проблема - когда человеку нечего показать без него. А использовать новые инструменты в своей работе - это нормально. Так индустрия развивалась всегда 👀 Если вы до сих пор не забрали мою подборку из 50 нейросетей, которые реально пригодятся в работе дизайнеру - то сейчас самое время это сделать👌🏻 ЗАБРАТЬ ПО ССЫЛКЕ 👈🏻
⌛ Прелоадер для Тильды с прогрессом загрузки
👋 Всем привет, возвращаюсь в канал после небольшого перерыва с новой модификацией ) Сделала для себя вот такой простенький прелоадер для Тильды с помощью ChatGPT (в демонстрации мой ученический проект с курса Тильды Про, кстати 🤭) Фишка данного прогресс бара в том, что он имитирует реальную загрузку страницы, а не просто делает определенную паузу на экране загрузки. Сделать прямо таки настоящий прогресс бар загрузки для Тильды нельзя по утверждению нейронки, поэтому она сделала имитацию, очень близкую к реальному процессу загрузки сайта. По моим тестам все очень даже правдоподобно выглядит и совпадает с реальным временем загрузки. ⭐️ Код прелоадера в файле в комментариях к посту. ✨ В начале кода вынесены все основные настройки, которые вам могут понадобится для стилизации под дизайн вашего сайта (обратите внимание, что есть ряд настроек отдельно и для мобильной версии) — все подписано комментариями. ❤️ Если у вас есть вопросы по редактированию кода — дайте знать в комментариях 😊 #тильда #модификации #прелоадер
Я к вам с новой (для меня) инфой, а вернее инструментом, которым я пользуюсь и не нарадуюсь — Notebook LM.
Почему-то про него мало нашла информации, а штука неимоверно крутая! ✨Коротко: это созданный вами информационный вакуум. Вы подгружаете свои источники информации (видео, статьи, книги, документы) и в чате общаетесь с ИИ только по ним, не примешивая весь интернет с многообразием его экспертных мнений. ✨На моем примере: я создала блокнот по здоровью (по конкретной теме). Закинула в него около 15 YT видео, 3 электронных книги и результаты своих анализов. Исходя из этих источников откапываю интересные инсайты и получаю рекомендации. Помимо прочего здесь есть много удобных инструментов — он может сам составить конспект, отчет, таблицу данных, мантальную карту, сделать вполне приятную инфографику, а еще тесты для самопроверки составить и даже ПОДКАСТ для вас склипать из всего впитанного. Вот тут девушка подробно описывает, как можно использовать его для изучения английского языка. В общем, как по мне отличное применение ИИ! Для учебы и погружения в какую-то тему самое-то 🐈 ну и да — это бесплатно, а в один блокнот можно загрузить до 50 источников.
🏥 Экран «Вы записаны» может быть не формальностью, а точкой роста продукта
Обычно после записи к врачу пользователь видит простой экран подтверждения и идет дальше. В СберЗдоровье решили пересобрать этот момент иначе: не просто сказать, что запись оформлена, а сразу помочь с тем, что делать дальше. Маршрут, календарь, подготовка к приему, а уже после этого аккуратные офферы и переходы в другие сценарии. Самое важное в этом кейсе то, что команда не превратила чувствительный медицинский экран в рекламную витрину. Сначала провели исследования, убрали лишнее, вынесли ключевые действия на первый уровень и переписали коммуникацию с языка скидок на язык пользы и контроля. В итоге выросли и продуктовые метрики, и ценность для пользователя: кросс-переходы +34%, установки приложения +28%, а сам экран потом еще и превратили в модульный компонент для других продуктов. Внутри: – Почему старый экран подтверждения перестал справляться с задачами продукта; – Как команда искала баланс между бизнес-целями и доверием пользователя; – Что показали глубинные интервью и юзабилити-тесты; – Какие элементы пользователи действительно хотели видеть сразу после записи; – Почему CTA на установку приложения лучше работает через пользу, а не через скидку; – Какие метрики выросли после запуска нового экрана; – Как из одного решения сделали универсальный компонент для дизайн-системы; – Почему экран завершения сценария тоже может быть сильной продуктовой точкой роста. ➡️ Читать статью ——— 💻 Курс по поиску работы 😍 Про дизайн 🔥 Вакансии дизайнерам 🎨 Референсы
Сегодня открываем тестовый доступ к сервису
Возьмем еще 10 человек на тест напишите в комментах кто хочет протестировать сервис в числе первых. Первые 10 добавим в закрытый чат с полным доступом😉
🆕 📱 Эффект вышивки в Бета тесте фотошопа
Честно говоря, я наверное скоро начну ИИкать от количества постов про ИИ. Тоже постоянно использую нейронки, хотя особо не пишу об этом.
Недавно завайбкодил небольшой лендос с помощью Cursor, собрал ТГ-бота в n8n, не говоря уже о Nano Banana, приколах в Sora, Suno и каждодневном использовании GPT. Для продукта в GPT генерю гипотезы, анализирую конкурентов, дипсёрчу источники в Perplexity, иногда прошу GPT провести ревью флоу/экрана. Экспериментировал в Figma Make, но результат оставил желать лучшего. Чтобы узнать, как у других, поспрашивал ребят из разных компаний о том, как AI-инструменты поменяли их дизайн-процесс и поменяли ли. 👱‍♂️ Юрий Ветров ⏺️ Дизайн-директор в Точка Банк Сам дизайн-процесс не поменяли, потому что он больше завязан на совмещение целей пользователей и бизнеса, а не конкретные инструменты. Но какие-то части процесса — да. Где-то это бытовуха — вроде перегнать данные из одного формата в другой. Где-то — автоматизация этапа процесса (например, написать свой плагин для Фигмы). Где-то — возможность делать графические элементы на потоке (например, нодовые инструменты генерации). В хобби-проекте вечерами пишу учебную платформу и дизайн-систему на React в формате парного программирования. 🥷 Стефан Васадзе 🏧 Руководитель дизайн-группы в EMCD, ex.Яндекс, ex.VK В дизайне пока только внедряем и учимся, из живого: — Сделали агента, который собирает сам задачу под шаблон опрашивая продакта, далее хотим прикрутить этап первичного discovery; — Сделали плагин где маркетинговые материалы самогенерятся на основе инпута (KV + текста + ресайзы); — Собрали за день свой инструмент для assessment и perfomance review дизайн команды + аналитика и всякие приколдесы; — Делаем пересборку дизайн-системы и компонентов в сторибуке прямой связкой через Figma API, далее хотим автоматизировать пуш изменений и начать работать не с макетами, а с прототипами в коде; — Работаем над проектированием агентов под точечные задачи, в идеале скинуть на них всю операционку где можно без человека; — Собираем лендосы для тестов; — Ищем инфу по корп инструментам/анализируем исследования/копаем в инсайты из чатов/делаем выводы из аналитики и тд. 🙎‍♂️ Марк Борзенков 📦 Дизайн-менеджер в Avito Мы уже больше года генерим картинки, даже сложные 3д персонажи получаются на отлично. Текста и орфография — тоже на отлично. Но это база, как у всех. А что из интересного, смогли на прод завайбодить улучшение. Разобрались с репозиториями, прошли ревью и смержили. Дальше — больше! 🤵‍♂️ Александр Дудинский 💾 Дизайн-лид в EPAM У меня ИИ пока значительно помогает только в быстрых прототипах. Связка Figma Make + Claude Code помогают собирать быстрые прототипы для обсуждения с командой и продактом на стороне клиента. Если раньше мы иногда тратили несколько дней на первый полноценный прототип, то сейчас в течении пары часов собираем весь флоу, включая корнер кейсы. И понятное дело, что все это с анимациями, различными состояниями и т.д., но финальный дизайн всё равно собирает дизайнер. Пока не получилось отдавать готовый код разработчикам и полностью автоматизировать всё это, к сожалению. Про мелочи вроде «быстро сгенерировать сочную иконку» писать не буду, мне кажется это уже база сейчас, а не ускорение работы. 👩‍💼 Дарья Кан 🧿 Дизайн-лид в Оzon У нас в Ozon дизайн-процесс не поменялся. Ключевые этапы, такие как исследование, проработка концепций, дизайн и проверка решений, остаются прежними. Но постепенно ИИ становится вспомогательным инструментом. Мы используем ИИ, чтобы сформулировать UX-копирайтинг особенно на этапе концептов, когда нужно сосредоточиться на идее и смысле, а также при работе с иллюстрациями — быстрая генерация идеи для ускорения синхронизации с командой или заказчиком. Основная ценность по-прежнему остаётся за дизайнером — его опытом, насмотренностью и способностью принимать решения. 🌊🌊
пользователь на UX тестировании.
Ахаха 🤣
100% Обожаю тех, кто помнит меня еще со второго декрета, когда я спала по четыре часа и делала свои первые ошибки в эфирах ) Когда на первом платном вебинаре в эфир пошел не живой поток, а дневной тест, на котором я чуть ли не в одних трусах с грязной головой молча ем бургер. Я чуть не сдохла тогда от страха 😆 Было же время!
Что умеет Claude (Design / Code) на практике🤖
мой опыт и опыт других дизайнеров/разработчиков 📎 Генерировать UI-концепты и макеты по промпту загружая их напрямую в браузер или в саму Figma 📎 Справляется с созданием адаптивов Хорошо продумывает адаптив, даже если задать ограничения и сценарии 📎 Генерировать дизайн-системы Может собрать дизайн-систему и описать правила (однако полноценные системы требует доработки) 📎 Верстать интерфейсы Подходит для лендингов, MVP и даже сложных интерфейсов, но почти всегда требует ручной доработки и ревью, хорошо обучается на загруженных библиотеках и твоих спецификациях 📎 Делать интерактивные прототипы Может собирать прототипы в браузере/Figma 📎 Помогать с деплоем Может объяснить и сгенерировать шаги для хостинга, домена и настройки проекта 📎 Интеграция с бэкендом и админками Может предложить архитектуру, API-структуру, варианты CMS (пока не тестила работу на бэке, на ютубе видеоа много уроков) 📎 Проводить исследования Это не замена полноценным UX-исследованиям с пользователями, однако с данными на основе реальных пользователей тоже отлично справится → просто чтобы вы понимали на какой функционал можете рассчитывать, а я пока готовлю большую инструкцию установке Claude правильно со всеми необходимыми библиотеками и приложениями😇 #полезное #клод
МАЙ В КЛУБЕ — САМ СЕБЕ ВИРТУАЛЬНЫЙ СТИЛИСТ
➡️ Если вы дизайнер, швея или работаете в хендмейде - в мае будем учиться самим собирать себе образы, примерять идеи, тестировать одежду, прически и луки с помощью ИИ. ❕ Без стилистов, долгих съемок и бесконечных примерок. Вы сами сможете видеть, как может выглядеть вещь, образ или новая подача именно на вас или на вашей модели. Внутри месяца: виртуальная примерка, Nano Banana, Leonardo, промпты для ракурсов и фигур, прически, Pinterest-борды и сборка готовых луков. Это месяц для тех, кто хочет использовать ИИ не ради красивой игрушки, а для работы, контента, вдохновения и своего визуального стиля. В мае становимся сами себе виртуальными стилистами. ВСТУПАЙТЕ В КЛУБ ПО ССЫЛКЕ
Делаем кое-что нереально крутое для фрилансеров😍
Давненько не писал тут, много работы по школе и сложностей с этими всеми блокировками и тп. Честно говоря сам чуть выгорел от всего, и энтузиазма не было на посты. Но месяц назад загорелся одной идеей - сделать сервис для наших ребят и не только, который бы 24/7 помогал по фрилансу, типа как компаньон/коуч. Загорелся и благодаря нейросетям сделал прототип, а потом вместе с другом разработчиком доделали до рабочей версии, которую скоро будем давать на тест. Собрали фокус-группу, и на следующей неделе хотим дать триал период. Если интересно был бы попробовать такой сервис и хотели бы тут узнать подробности запуска, да и просто блин поддержать), накидайте 🔥
Ок) Первый кринж пошел. Смотреть только со звуком!
Надеюсь, вы также угараете с этого видео как я)) Когда у меня плохое настроение, я его пересматриваю) Это первые тесты сиданс и сетки персонажа. Еще поделиться следующими кринж-видео? 🔥- да 🤗 - реально смешно)
🐶 Как обещали, собрали самые важные ссылки со шрифтового митапа Paratype и ВКПБ, делимся!
Но перед этим хотим сказать, что для нас самое важное — это вы! Все, кто читает наши каналы и рассылки, кто пришёл на митап, слушал, шутил и задавал вопросы. Для нас это очень много значит. И, конечно, отдельное спасибо ВКПБ — студиям Deza и Lovemedo, которые всё это организовали. Кстати, на митапе волшебным образом у нас случилась 105% явка. Вот такая шрифтовая магия получается •ᴗ• А теперь сами материалы! Пойдём в порядке лекций: 🐶 Лично от Дениса Васильева: 🌞Большая коллекция бесплатных шрифтов 🌞«Что делать, если нет бюджета на шрифты»  🌞Статья о том, как бесплатно попробовать шрифты 🌞Большая статья о шрифтовых лицензиях 🐶 Красота от Томы Стрельцовой: 🌞О двух техниках древнерусской каллиграфии 🌞Декоративный шрифт Red Klin 🌞Шрифт на основе кириллических букв Сергея Чехонина Список книг, который Тома обещала: 🌞Книга про буквы от Аа до Яя, Юрий Гордон 🌞Designing type, Karen Chang 🌞Основа стиля в типографике, Роберт Брингхерст 🌞Живая типографика, Александра Королькова 🌞The stroke theory of writing, Gerrit Noordzij 🌞Про леттеринг, Джессика Хиш 🌞Искусство каллиграфии, Дэвид Харрис 🌞The origin of the serif, Edward Katich 🐶 Шрифтовая магия от Саши Корольковой: Для начала красивая мысль, с которой Саша начала свою лекцию. Любая достаточно развитая технология неотличима от магии — Артур Кларк 🐶 Глава 1: Нестандартная вариативность 🌞«Тёмная сторона шрифта» — суперлонгрид о технической стороне шрифта (иногда нужен VPN) 🌞Вариативные гротески: Pragmatica Next Circe Contrast 🐶 Глава 2: Оптические размеры Шрифт наполовину состоит из оптических иллюзий 🌞Шрифты с оптическими размерами: Bodoni PT Simon Kudry (с бесплатным начертанием Kudry Weird Headline Stapel Stem PT Sans (бесплатный) PT Serif (бесплатный) 🌞Волшебные слова: Caption — до 12 пт Text — 12-18 Subhead — 18-48 Headline — 48-72 Display — 60+ Poster — 96+ 🐶 Глава 3: Шрифт переодевается 🌞Деликатный геометрический гротеск с большим набором стилистических сетов: Hint Включить сет Grotesque Round в CSS: font-feature-settings: "ss03"; 🌞Статья о Хинте и его стилистических сетах 🐶 Глава 4: внимание к деталям 🌞Шрифт с пропорциональными и моноширинными маюскульными и минускульными цифрами: Bodoni PT Как включить поднятие регистрозависимой пунктуации на all caps в CSS: font-feature-settings: "case"; 🌞Статья о том, как включать стилистические сеты в Фигме и CSS 🐶 Глава 5: странные вещи, которые может шрифт 🌞Шрифт Mojito, который может имитировать почерк и содержит ~1400 знаков 🌞#player">Первая в мире видеоигра в шрифте 🐶 Глава 6: Микротипограф — «что-нибудь полезное» 🌞Микротипограф в шрифте — что это такое и как он работает 🌞Плагин-типограф для Фигмы 🌞Типограф студии Лебедева 🐶 Глава 7: шрифт и нейросети 🌞В шрифт встроили нейросеть 🐶 И на всякий эсэмэмщица напоминает: 🌞«Как разобраться в кириллице» — статья 🌞«Как разобраться в кириллице» — бесплатный курс 🌞Используйте ТЕСТОВЫЕ ВЕРСИИ Главный хайлайт встречи — Саша разрешила произносить Circe как Цирце 👀 Пересматривайте, перечитывайте, пробуйте. А мы всегда на связи: тут в канале или по почте fonts@paratype.com P.S. В комментариях ещё опубликуем несколько фотографий с митапа