Олния! Рограмма!

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

Iconduck — Один из лучших плагинов для поиска бесплатных иконок с открытым исходным кодом в векторных форматах. В плагине 150+ наборов иконок, иллюстраций и эмодзи

Install

Продолжаем баловаться в Claude: делаем интерактивную 3D на сайте☺️

В видео я рассказала пошагово цепочку действий – посмотрите для начала его!📹 Благодаря моей инструкции Claude сможет быстрее сообразить как сделать такую 3D 🔠 (это не отдельно загруженная 3D-модель, все эти буквы описаны прямо в коде, соответственно, вы сможете поменять их на свои) → 1. Инструкцию нужно складывать в ту же папку, где у вас лежат все файлы по сайту (в данном проекте шрифты + те файлы, что вы будете делать по инструкции)/либо прикреплять её к чату с ссылкой на макет и другие материалы (но я советую работать из папки) 2. Также важно повторять все те действия, что описаны в ней – так как там пошагово сказано как и что делать не только с точки зрения дизайна, но и как подготовить материалы ⚠️Я постаралась сделать эту инструкцию еще легче и понятнее, чем предыдущую – никакие дополнительные материалы/файлы, кроме макета в Figma + шрифтов, вам не понадобятся (все остальные файлы вы делаете сами по инструкции) Ссылка на инструкцию🔗 *Выше я делала инструкцию как скачать/зайти/установить Claude #полезное #клод

Принесли вам забавный сервис, который превращает обычные штрих-коды в красивые SVG-версии, которые всё ещё сканируются.

Выбираете дизайн (банан, акула, пальма), и он генерирует штрих-код, который реально сканируется на настоящей упаковке. Попробовать здесь 😍
⌛ Прелоадер для Тильды с прогрессом загрузки
👋 Всем привет, возвращаюсь в канал после небольшого перерыва с новой модификацией ) Сделала для себя вот такой простенький прелоадер для Тильды с помощью ChatGPT (в демонстрации мой ученический проект с курса Тильды Про, кстати 🤭) Фишка данного прогресс бара в том, что он имитирует реальную загрузку страницы, а не просто делает определенную паузу на экране загрузки. Сделать прямо таки настоящий прогресс бар загрузки для Тильды нельзя по утверждению нейронки, поэтому она сделала имитацию, очень близкую к реальному процессу загрузки сайта. По моим тестам все очень даже правдоподобно выглядит и совпадает с реальным временем загрузки. ⭐️ Код прелоадера в файле в комментариях к посту. ✨ В начале кода вынесены все основные настройки, которые вам могут понадобится для стилизации под дизайн вашего сайта (обратите внимание, что есть ряд настроек отдельно и для мобильной версии) — все подписано комментариями. ❤️ Если у вас есть вопросы по редактированию кода — дайте знать в комментариях 😊 #тильда #модификации #прелоадер
Создавайте музейный мерч сами, а не залипайте на него в Pinterest!
«Дизайн-цех» от АКИ открывает десятый сезон, и это тот редкий бриф, где у вас есть выбор сразу из пяти сильных «клиентов»: Московского музея современного искусства, музея-заповедника «Царицыно», Московского планетария, Государственного Дарвиновского музея и Государственного музея А.С.Пушкина. Задача — не «нарисовать красивый принт», а вскрыть ДНК музея и перевести её в сувенир, который хочется носить, дарить, забирать с выставки вместо магнита на холодильник. Почему это круто для карьеры: живой диалог с кураторами и командами заказчиков, а не абстрактное ТЗ, а ещё работа с разными медиумами (текстиль, объекты, упаковка, типографика, иллюстрация). «Дизайн-цех» также позволит потренировать насмотренность на музейном материале, попробовать себя в арт-дирекшене линейки и целого визуального кода, подумать не только об айдентике, но и о производстве и себестоимости. Кидайте заявки до 14 мая здесь ⬅ Интенсив пройдёт с 23 по 24 мая в Московском кластере видеоигр и анимации Агентства креативных индустрий при Департаменте культуры города Москвы и в деловом пространстве «МосХаб.Сколково» Департамента информационных технологий города Москвы. [Фабрика Дизайна]
Честно говоря, я наверное скоро начну ИИкать от количества постов про ИИ. Тоже постоянно использую нейронки, хотя особо не пишу об этом.
Недавно завайбкодил небольшой лендос с помощью 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-копирайтинг особенно на этапе концептов, когда нужно сосредоточиться на идее и смысле, а также при работе с иллюстрациями — быстрая генерация идеи для ускорения синхронизации с командой или заказчиком. Основная ценность по-прежнему остаётся за дизайнером — его опытом, насмотренностью и способностью принимать решения. 🌊🌊
Юбилей «Хохломской росписи», неожиданные коллаборации, место силы для мастеров в Казани и другие новости из мира дизайна
🔶 Как отмечают юбилей фабрики «Хохломская роспись». Фабрика «Хохломская роспись» отмечает 110‑летие — уже больше века мастера из Семёнова хранят русские традиции и создают золотую хохлому, узнаваемую во всём мире. К этой большой дате бренд «Хохлома» подготовил серию видео о том, как рождаются знаменитые изделия — от первой деревянной заготовки до сияющей росписи и финального блеска лака. 🔶 Вышел мерч от tak.sebe.prazdnik и Государственного музея Л.Н. Толстого. Бренд бумажных гирлянд tak.sebe.prazdnik выпустил коллекцию со старейшим литературным музеем страны, используя цитаты из дневников писателя. Проект переносит архивные материалы в формат современного поп-культурного объекта, создавая нетривиальный контекст для классического наследия. 🔶 В Казани открылось новое пространство для ремесленников, горожан и туристов. В Центре уникального мастерства десятки открытых мастерских превращают креативный процесс в часть интерактивной программы для посетителей. Здесь производство, образование и ритейл объединены в единую экосистему. Архитектурное решение сохраняет историческую канву здания, используя нейтральную палитру интерьеров как фон для экспозиции живых ремёсел. Проект демонстрирует полностью локализованный подход: мебель и текстиль произведены в Татарстане. 🔶 Разработана система крепления без шурупов. Omnibite от миланского дизайнера Эудженио Коста — это трёхосевое соединение, позволяющее использовать необработанные ветки как полноценные конструктивные элементы. Автор смещает фокус с готовых материалов на этап их выбора и подготовки, исследуя локальные породы древесины и их свойства. Система адаптируется к разным формам и диаметрам веток, обеспечивая гибкость сборки без стандартизации материала. 🔶 Коллаборация Iittala и Pokémon. Финский бренд Iittala в партнёрстве с Pokémon выпустил капсульную коллекцию посуды к 30-летию франшизы. В проекте использовали культовую серию 1999 года Origo с её характерными полосками как канву для изображений Пикачу. Дизайн сохраняет функциональность и геометрию оригинала, интегрируя персонажа в структуру полос через минималистичную графику и яркие жёлтые акценты. 🔶 Новое переосмысление люстры Zenith от Baccarat 1824 года. Дизайнер Бетан Лаура Вуд превратила объект в модульную систему из колец, формирующих динамичный «вихрь» света. Конструкция сочетает классические элементы оригинала с фирменными приёмами дизайнера и позволяет варьировать композицию за счёт гибкого размещения модулей. Объект дополняют яркие цветовые решения и отсылки к барочной эстетике, создавая диалог между историей и современным дизайном. 🔶 «Самокат» регистрирует фирменный цвет. Сервис доставки «Самокат» подал в Роспатент заявку на регистрацию кораллово-розового цвета Pantone 191С как товарного знака. В компании пояснили, что этот «вдохновляющий коралловый» оттенок стал узнаваемым визуальным кодом бренда, поэтому оформление этого цвета в качестве знака — логичное продолжение многолетней работы с айдентикой. [Фабрика Дизайна]
Инструкция по работе с Claude и Claude Code 🥹
Сегодня я написала для вас целую инструкцию по настройке среды для дальнейшей работы с Claude❗️ Я очень часто в роликах и историях говорю: не получится сделать сайт нажав лишь одну кнопочку в строке запросов у Claude какой бы у вас подробный промпт не был! Так что сегодня как раз про все, что вы должны знать для начала работы → так что выделите себе 2-3 часа свободного времени, чтобы во всем разобраться, это не так просто☺️ 🔗Ссылка на инструкцию (статья лежит в Notion, так что, возможно, вам понадобится VPN) Возможно, вы сейчас увидите инструкцию и испугаетесь… Или скажете «так я вообще ничего не понимаю в разработке»🥲 На самом деле, самый муторный этап это «вкатиться» в это все и понять что к чему, дальше – легче. Вам не нужно писать код для создания сайтов, не нужно разбираться в разработке – этот процесс не про это!😳 Как я уже говорила – я не представляю профессию дизайнера будущего без этого навыка, он очень оптимизирует и ускоряет твою работу. Согласитесь, собрать за день 1 презентацию и целых 10 таких же – это большая разница?✅ В общем, приятного чтения, если что будет непонятно – спрашивайте. И, конечно, буду рада вашим реакциям✨ #полезное #клод
Обновление: RenameItems v2.0
1. Переработал весь интерфейс и кодовую базу. Переименование и поиск с заменой разделил на две вкладки. 2. В поиск опционально добавил: регулярные выражения (RegEx), точный поиск по регистру строки (Match Case) и отдельных слов (Whole Word). Например, с RegEx шаблоном \scopy.* можно стирать копии из имён слоёв. Логика запуска осталась прежней: • выбраны объекты — переименование объектов или родительских слоёв, • ничего не выбрано — переименование слоёв и артбордов Подробнее о скрипте #illustrator #item
SXL Studio — новый бесплатный набор инструментов для дизайнеров дизайн-систем, альтернатива Token Studio, быстрее и функциональнее. Поддерживает:
→ Database — маппинг слоев в фигме с backend данными из JSON, CSV, вставка картинок по https// ссылкам. → Tokens — применение, экспорт, поддержка более 35 типов токенов: number, sizing, spacing, dimenstion, typography, transition, image, color, fill, shadow, glass и другие. → Генерация component и componentSet из JSON (через ИИ можно конвертировать любой компонент (VUE3, React) в JSON и на основе этого кода сгенерировать в Figma точно такой же компонент) → Интеграция дизайна в Storybook → Экспорт переменных из JSON в CSS, Swift, Kotlin прямо из плагина → Поддержка GitHub и GitLab → Поддержка Dev Mode для Frontend разработчиков → Восстановление связей с master компонентом или подключение открепленных инстансов к мастер компоненту → Поддержка Remote соединения с Agent AI Install plugin
‼️Почему ваш магазин не продает?
Взгляд ритейл-дизайнера сквозь цифры и психологию 👉🏼 ☝🏻Когда владелец бизнеса заказывает дизайн, он часто думает об эстетике. Но эстетика — это лишь верхушка айсберга. 👉🏼 Моя работа как ритейл-дизайнера начинается там, где заканчивается просто «красиво» и начинается бизнес-аналитика. 1️⃣ Проектирование прибыли, а не мебели. Я не просто расставляю оборудование. Под каждый продукт я проектирую оборудование индивидуально, учитываю эргономику, материалы и принципы визуального мерчандайзинга. ✔️Если у вас премиальный шелк — оборудование должно подчеркивать его легкость, а не «задавливать» металлом. ✔️Модульность позволяет вам менять экспозицию без лишних вложений, адаптируясь под новые коллекции. 2️⃣Навигация и «горячие точки» Дизайнер — это сценарист пути покупателя. Я проектирую зонирование так, чтобы у клиента не было шанса пропустить важные категории товаров. ✔️Я минимизирую «холодные зоны», используя свет, формы оборудования и композиционные акценты. ✔️Покупатель не просто гуляет — он идет по заданному маршруту к кассе. 3️⃣Инфраструктура комфорта Примерочная — это «сердце» конверсии. Если там плохой свет или тесно, покупка не состоится. ✔️Я создаю зоны примерки и сервиса так, чтобы они работали на лояльность. ✔️А грамотно спланированный склад позволяет продавцам не тратить время на поиски, а клиентам — не ждать. 4️⃣ Код узнаваемости Уникальность дизайна — это не самовыражение художника. Это упаковка ценностей вашего бренда. ✔️Продающий дизайн создает узнаваемость, которую невозможно скопировать, потому что она зашита в формах, тактильных ощущениях и эмоции, которую дарит пространство. ‼️Мой проект — это инвестиция в бизнес-модель, где каждый квадратный метр работает на увеличение среднего чека. 👉🏼Ваш магазин готов к масштабированию или требует «реанимации»? Запишитесь на аудит пространства. _______________ #обомне #fashionретейл #ритейлдизайн #продажи
В аэропорту в Риме парень сыграл трек из подземелий Марио.
Вот так японская мелодия Кодзи Кондо облетела весь мир.
😮 Почему дизайнеру все еще нужно разбираться в вёрстке, даже в 2026
Оля из Альфа-Банка очень правильно ставит акцент: вёрстка для дизайнера это не про «стать фронтендером», а про умение передавать свою идею в разработку без потерь. Пока дизайнер думает только картинкой, а не платформой, паттернами навигации, типами элементов и ограничениями технологии, на выходе почти всегда появляется один и тот же вопрос: «Что это вообще такое?» Самое ценное в статье не спор про ответственность, а список конкретных уровней, на которых всё ломается. Разметка экрана, Push и Present навигация, типы элементов, особенности серверной и комбинированной вёрстки. Если это не учитывать в макете, разработчик начинает додумывать за дизайнера, а дизайн-ревью превращается в попытку спасти то, что уже поехало. Внутри: – Почему вёрстка это не только код, но и качество ready-to-dev макета; – Как дизайнер теряет контроль над интерфейсом, если не думает про платформу; – Чем опасно путать паттерны навигации вроде Push и Present; – Почему типы элементов тоже влияют на итоговую вёрстку; – Как технология реализации экрана меняет ограничения для дизайна; – Что даёт команде более внимательное отношение к вёрстке уже на этапе макета; – Какие простые шаги помогают дизайнеру быстрее подтянуть матчасть; – Почему нормальная коммуникация между дизайном и разработкой экономит кучу времени и нервов. ➡️ Читать статью ——— 💻 Курс по поиску работы 😍 Про дизайн 🔥 Вакансии дизайнерам 🎨 Референсы
⭐️ Новый кейс: браузерная игра
В этот понедельник состоялся релиз проекта, разработка которого была для меня моим самым необычным опытом — это браузерная игра «Как стать светским человеком» по заказу тгк «Антиглянец». Механика игры очень проста: вам выдается один из трех случайных персонажей со своими стартовыми характеристиками, и вы отвечаете «Да» и «Нет» на 36 вопросов подряд. Ушли в минус — проиграли, ответили на все вопросы — выиграли. Игра определяет, сможешь ли ты выжить в светском обществе Москвы, и если да, то какой ценой? Остроумные, саркастичные и довольно точные вопросы составлены людьми, которые как рыбы в воде плавают в водах светских тусовок столицы. Игру уже успело оценить более 40 тысяч пользователей, среди которых есть даже такие знаменитости, как Ксения Собчак, Андрей Малахов и Ляйсан Утяшева ✨ ☕️ Разработкой кода игры занимался Владимир, я была в роли ПМа, проектировщика и дизайнера. ❤️ По любым вопросам пишите в комментариях #кейс #портфолио
если собираетесь на наш бесплатный воркшоп по вайбкодингу во вторник, вот вам способ изучить базу: продуктовый лид ⚪️ лёва сделал видео на ютуб, где за несколько шагов с помощью вайбкодинга собирает эффект для сайта.
на практике показал путь от макета в Figma до готового для шера с друзьями эффекта на Netlify — это без единой строчки кода вручную. пайплайн такой: макет в Figma → спека через Claude → план в Cursor → генерация кода → паблишинг на Netlify. <<< смотреть видос >>>
Все уже попробовали Claude Design?
А пока я загружаю дизайн-систему туда, напишу про заявленную доступность Claude: • Аудит компонентов на соответствие WCAG 2.1 / 2.2 (A, AA, AAA) — контрастность, фокус, таб-порядок, размеры тач-таргетов • Проверка и генерация корректной ARIA-разметки (roles, states, properties, live regions) • Проверка работы с клавиатурой и фокуса • Анализ семантики HTML, heading hierarchy, landmark-регионов • Проверка alt-текстов • Генерация A11y-документации для компонентов дизайн-системы (do's/don'ts, примеры использования) Есть набор Accessibility Agents — специализированных агентов для Claude Code, GitHub Copilot и Claude Desktop, которые проверяют код на соответствие WCAG 2.2 AA, покрывают i18n/RTL, дата-визуализации, email, медиа, web components Пока сама не тестировала, попробую попозже )
Vector Drawable — плагин копирует и экспортирует векторный рисованный код из любых слоев, кроме Slice и Image.
100 анимаций текста с кодом
У нас продолжаются блиц-интервью про AI и доступность. Задаем одинаковые вопросы и получаем разные ответы )
Дима Бороухин @dmboro — в прошлом дизайнер и веб-разработчик. После потери зрения объединил свои технические знания с личным опытом и стал консультантом по цифровой доступности. — Ты пробовал использовать Claude или ChatGPT со скринридером или с клавиатуры — как это работает на практике? Я пробовал ChatGPT, однако по удобству взаимодействия мне больше понравился Gemini. Его интерфейс вполне доступен: элементы управления имеют корректные роли, имена и состояния, что позволяет скринридеру считывать структуру страницы. В своей работе я активно применяю AI для подготовки HTML-страниц для презентаций — чтобы показывать командам типичные проблемы доступности. Грамотный промпт позволяет сгенерировать страницу, где один элемент оформлен эталонным кодом, а остальные имеют аналогичный дизайн, но содержат критические ошибки — например, невозможность установить фокус. Визуально всё выглядит одинаково, но при взаимодействии через клавиатуру или скринридер различия становятся очевидными. Также я использую AI для подбора цветовых схем и помощи в написании CSS-кода. — Ты знаешь кейсы, где AI улучшил доступность продукта? или хотя бы часть? Комплексных кейсов, где AI улучшил доступность продукта, в моей практике не встречалось. Вижу нейросети лишь в точечных задачах — как в примере с описанием изображений, о котором расскажу дальше. — Есть ли риск, что AI-инструменты для доступности обучены на данных, которые не отражают реальный опыт людей с ограниченными по здоровью? Риск, безусловно, есть. AI может отлично знать теорию и стандарты, но их всегда нужно проверять на практике. Реальные сценарии взаимодействия со вспомогательными технологиями часто сложнее, чем их описывают в документации. Пример из жизни: недавно я просил AI создать примеры недоступных кнопок. Модель предположила, что «поломанная» кнопка будет полностью неработоспособна для скринридера. Однако на практике скринридер NVDA умеет эмулировать нажатие даже там, где код реагирует только на клик мыши. В итоге для пользователя скринридера кнопка может сработать, а для человека, использующего только клавиатуру, она останется недоступной. Я не разработчик нейросетей, но как консультант по цифровой доступности могу сказать: чтобы ситуация изменилась, в данные для обучения моделей нужно включать больше примеров реального поведения ассистивных технологий. Важно, чтобы AI видел не только идеальный код, но и понимал нюансы взаимодействия разных групп пользователей с интерфейсом. — 70% новых приложений создаётся на low-code и no-code платформах. Люди без технической базы делают продукты для миллионов. AI научит их паттернам доступности? Теоретически — может, но на практике всё зависит от того, как сформулирован запрос. Если создатель продукта не осведомлен о принципах доступности, он просто не включит эти требования в задачу для AI. А без явного запроса модель проигнорирует эти нюансы ради скорости разработки. Важно помнить: доступность — это не только формальное соответствие ГОСТу или WCAG. Прежде всего это про пользовательский опыт. Можно создать приложение, которое формально пройдет все автоматизированные тесты, но при реальном использовании окажется неудобным. — В России активно пользуются технологиями с Ai — зарубежные скринридеры, программы по типу Open your eyes, есть ли надежда, что подобные сервисы будут разрабатываться российскими разработчиками? Это уже реальность. Я постоянно пользуюсь отечественными решениями. Например, «Умная камера» Яндекса — незаменимая вещь в быту: она помогает отличить бутылку молока от кефира в холодильнике, когда упаковки идентичны. Недавно я показывал зарубежным коллегам функцию описания изображений в Яндекс Браузере. В одном онлайн-магазине одежды вместо внятных alt-текстов были маркетинговые названия коллекций. Нейросеть Яндекса точно описала суть: состав комплекта, цвета, фасон. Это тот случай, когда AI исправляет ошибки контента «на лету». Так что — большой респект и спасибо команде инклюзии Яндекса за их работу!