Хуяк. Утопия пишет код.

В пятницу доверстал статичную версию сайта, поправил косяки по вёрстке, немного доработал скилл, чтобы нейронка точнее забирала макеты и не выдумывала отсебятину, а то она любит. Затраты по времени: 5 часов План на сегодня: Подготовить раскладку макетов для описания анимации для скилла. Буду делать посекционно и наблюдать, как скилл справляется Ссылка на сайт Это статус от Артема, разработчика. Пилим эталонный проект для курса "Завоевываем AWWWARDS" (Промо-дизайн + Claude Code). Больше информации в этом посте. Старт 21 сентября. Хочу делиться с вами процессом разработки. Поставьте 🔥, если интересно. Также пишите, пожалуйста, вопросы по Клоду и промосайтам.

дизайнер 🤡 Pragmatica  🤡 миша навайбкодил секси-сайт по итогам ивента 2026. внутри — часы в клоде контента со спикерами (выдаем постепенно, сорри, ставьте колокольчик 🤡), результаты опросов, толпы нетворкающих дизов на фотках и видео и все под хаусец того утра. 🤡 самые уверенные уже могут забрать ерли тикеты на тусу следующего года. остальные — просто кайфуйте, жизнь одна, как говорил классик.

• Раздел "Создание музыки и звуков" (дальше добавим создание голосов и озвучка) • Стили для фотогенераций (несколько тысяч стилей на любой вкус, аля Миджорней) • Фоторедактор (большое обновление и исправление мелких багов) • Академия (новый дизайн + 2 новых курса по фото и видео) • Холст (как у рекрафта, свободное пространство, где можете генерировать все что угодно) • Загрузка всех типов файлов в Клод и ЧатГПТ (для анализа и создания новых файлов) • Видеоредактор-первая версия (Максим + Алексей) • Добавить новые ИИ (все до чего не доходили руки из-за обновлений утопии, сейчас будем добавлять ) • Мелочовки (перманентно что-то улучшаем в интерфейсе) В видео пробежался по основным новым фичам. Для вас это прекрасная возможность посмотреть, как создаются реальные проекты, которыми уже пользуются тысячи людей и крупные бренды, например, зеленый банк и синяя соц сеть. Вы же не сомневаетесь, что я в итоге захвачу мир?😉

Сейчас отовсюду кричат про AI, про необходимость дизайнеру проникаться этими технологиями. Кричат не зря, наверное это уже база, чтобы быть конкурентноспособными (да че говорить, если я сам помогаю делать дизайн раздела образования через клод). Уже начали появляться курсы и интенсивы, которые дают неплохой старт, для того что бы дизайнер встал на новые ai-рельсы. Пару месяцев назад, к нам пришел Сережа Попков (да-да, тот самый король вебинаров, батлов (олды тут?) и конечно же просто офигенный профессионал, которые сделал агентство AIC). Я удивился, потому что последние месяцев шесть, его не было в инфополе. Оказывается все это время он в соло копил ману и сам лично погружался в ai инструменты. Так приосполнился, что подготовил свой продукт, который презентовал нам. Прикиньте, как надо любить дизайн, чтобы будучи в таком статусе, добившись уже всего, сидеть и покорять для себя новые высоты и новые инструменты. Я сам лично знаю как это сложно, убрать себя из зоны комфорта. https://ai-nation.ru/?utm_source=dsgners&utm_medium=TG&utm_campaign=retrofigma">AI Native Designer - по сути новая профессия, которая появится на рынке уже очень скоро, а самые быстрые уже себя так презентуют. В программе полный фарш, каждый этап дизайнера пропитан ai и магией. От исследования до готового сайта с нереальным эффектами. Конечно же мы решили вписаться в этот замес и вместе провести первый поток где будет всего 50 мест. Только лайвы, без записей. Кучу готовых сайтов и брендов. CGI, 3D и тд. Раньше, когда у меня была студия для этого нужно было человек 5 разных, сейчас это может делать один дизайнер. Ценник дешевле чем практически любой курс сейчас (которые морально устарели), потому что это первый поток, на котором Сережа попробует сделать из дизайнера -> AI Native Designer дизайнера, показать тот путь который он сам прошел за полгода, когда не знал ничего. Для джунов и мидлов — это спасение на нашем рынке сейчас, новый способ вернуться в игру. Дизайнерс, поможет подстветить работы участников прямо на сайте, чтобы помочь им раскрутиться и возможно уже получать заказы. Даже планируем добавить их в рейтинг на сайте. А, ну и конечно никуда без фирменных батлов, от нас будут крутое жюри и вебинары. Записаться на буткэмп: https://ai-nation.ru/?utm_source=dsgners&utm_medium=TG&utm_campaign=retrofigma">https://ai-nation.ru/ Мы будем лично следить за первым потоком, чтобы все прошло максимально комфортно и продуктивно. Ну что погнали?)

Я каждый день смотрю вакансии и вижу, что старый сценарий работает всё хуже. Раньше можно было раз в пару лет перейти в другую компанию, получить следующий грейд и заметно вырасти по зарплате. Сейчас поиск занимает месяцы, вилки часто стоят на месте, а где-то на новом месте вообще предлагают меньше. При этом требования стали сильно шире. Рядом с Фигмой и исследованиями всё чаще стоят AI-агенты, вайбкодинг и рабочие прототипы. Компаниям нужны дизайнеры, которые могут быстрее проверить идею, собрать живой сценарий и положить его пользователям или команде без долгого ожидания разработки. Я сам каждый день работаю с AI и вижу, насколько сильно это ускоряет путь от идеи до реализации каких-то фич (иногда буквально 5 минут). Но просто открыть Клода или Кодекс и попросить его «сделать красиво» недостаточно. Нужен нормальный процесс, чтобы агент понимал задачу, работал с интерфейсом и помогал довести результат до чего-то живого. 😎 Даниил Шишко из Pixel Perfect собрал такой процесс в бесплатный спринт из 4 уроков. На занятиях разберёте работу с AI-агентом и завайбкодите свой продукт или отдельную фичу. В итоге останется готовая работа, которую можно показать в портфолио или докрутить под свой проект. Работать будете в OpenCode. Агент бесплатный, поэтому покупать ещё одну подписку ради обучения не придётся. 🔠 Запустить бесплатный спринт 🔠 Запустить бесплатный спринт 🔠 Запустить бесплатный спринт

Несколько месяцев выкладываю разные проекты, что я верстаю сама, короче занимаюсь вайбкодингом. То есть, дизайн я делаю сама полностью как обычно, а верстку, анимации и поведение интерфейса задаю через Claude Code с Figma MCP. И к чему мне сейчас другие специалисты на большинство проектов? Да, сложные проекты пока без разрабов я не потяну. Но думаю, что когда-то мы сможем прийти и к этому…🤥 Честно? Никогда бы не подумала , что дизайнер и правда сможет отвечать за любой этап в проекте, даже если это верстка не на конструкторах🎈 Готовлю целый модуль сейчас по вайбкодингу на свое обучение, ура, ответственно заявляю, что теперь могу🔜 #мысли #клод

→ Figma MCP + Claude Code + Higgsfield Дизайн делала сама полностью – от идеи до финального визуала. Все генерации (пухосос, лужесос и другие сцены) делала в Higgsfield. Верстку, анимации и поведение интерфейса задавала через Claude Code. На все ушел всего один вечер…😲 Все больше приходит ощущение, что как дизайнеру мне все реже придется привлекать разработчиков для простых лендингов и многостраничников – я это уже все могу и сама…💡 Обратите внимание на ненавязчивые анимации, ховерочки и т.д. #полезное #клод #кейсы

→ CapCut + Figma MCP + Claude Code В этот раз собирала дизайн и монтировала видео в Figma + CapCut, верстку полностью отдала Claude Code – просто попутно объясняя, что я хочу видеть. У меня это заняло 1-2 рабочих дня на все-превсе. А потом говорят «да че там, пару кнопок нажал и готово»😑 В этот раз без инструкции для клодика, так как верстка слишком кастомная, только запутаю всех… #полезное #клод #кейсы

Waymo разрабатывает технологию полностью беспилотных такси. Увидела статью в New York Times и пошла с Клодом проверять, а что же по доступности? А они-то молодцы! Начали ей заниматься давно. Причем как физической, так и цифровой! Клод сделал интерактивный отчёт со всеми WCAG-критериями, user journey и рекомендациями → https://anzhelikagerman.github.io/enable/">https://anzhelikagerman.github.io/enable/">https://anzhelikagerman.github.io/enable/">https://anzhelikagerman.github.io/enable/ А тут давайте тут расскажу, что мне очень понравилось. Заказать поездку можно только через мобильное приложение Waymo One. После вызова к вам приезжает полностью пустой электромобиль и всё взаимодействие от посадки до климат-контроля и музыки идёт через приложение. И вот его-то и разберем. · Приложение работает с VoiceOver (iOS) и TalkBack (Android). Во время поездки информация дублируется голосом, включая статусы («машина приехала», «можно отстегнуть ремень»). · Audio guidance («Голосовые подсказки»): при приближении к автомобилю приложение через динамик телефона проговаривает расстояние и направление. · Honk to find («Посигналить для поиска»): кнопка в приложении удалённо подаёт звуковой сигнал автомобиля. · Световые сигналы фар: визуальный аналог гудка для глухих и слабослышащих. · Extra time to board: пассажир может заранее выбрать увеличенное время на посадку, чтобы водительский автомобиль дольше ждал. · Braille-надписи на кнопке двери и поручнях. · Текстовые субтитры всех голосовых объявлений на экране в салоне. · Приложение минималистично. Основной экран — это карта с минимумом элементов. Как же это важно! · Фирменная анимация «радара». При поиске машины над кнопкой появляется вращающаяся дуга, напоминающая лидар-сканер. Такой индикатор активности системы. · Микро-взаимодействия и тактильная отдача. Когда машина подъезжает, телефон даёт характерную вибрацию. Анимация подсказывает, с какой стороны и на каком расстоянии автомобиль. · Инициалы на крыше. При заказе пассажир может включить отображение своих инициалов на куполе автомобиля. Приложение подсказывает: «Ищите свои буквы». Ну гениально же ) · Waymo проводит регулярные юзабилити-сессии с участием людей с нарушениями зрения, слуха, подвижности и когнитивными особенностями. Недоработки тоже есть и они в отчете → https://anzhelikagerman.github.io/enable/">https://anzhelikagerman.github.io/enable/">https://anzhelikagerman.github.io/enable/">https://anzhelikagerman.github.io/enable/

Я никогда не любил работать с ДС и компонентами, особенно, когда АИ ещё не было в целом. Дизайн-система это такая штука, которая никогда не заканчивается. Сегодня добавили новый компонент, завтра поменяли состояние, потом где-то в продукте уже уехала версия, а в библиотеке всё ещё живёт старый вариант. И начинается обычная рутина. Проверить состояния. Сверить компоненты. Понять, что отстало от продакшна. Поправить в нескольких местах. Убедиться, что дизайнеры не разнесли всё по разным файлам. Работа важная, но максимально не самая весёлая) И вот это как раз очень похоже на задачу, которую можно отдавать AI-агенту. Не творческую часть, где надо думать головой, а именно поддержку порядка: сверять, находить расхождения, подтягивать правила, дополнять состояния, помогать не превращать ДС в свалку. Даниил из Pixel Perfect 3 июня в 18:00 мск покажет, как это работает на практике. Будет не учебный кейс, а живой AI SaaS-стартап для голосовых агентов. Он соберёт дизайн-систему через Claude Code и Figma MCP, а потом на её базе сверстает экраны продукта. 😎 Что будет полезного Покажет, как собирать ДС через Claude Code и Figma MCP, даст 4 скилла для Claude Code под сборку и поддержку своей дизайн-системы, и разберёт, какую рутину реально можно отдать агенту. Если работаете с дизайн-системами или просто устали руками вылавливать одни и те же расхождения залетайте посмотреть. Ща отставать уже не модно, нужно быть в трендах инструментов и снимать с себя кучу рутины ✨ Эфир пройдёт в канале, приходите Кстати, кто уже занимается ДС через клод, какой у вас пайплайн? Как работаете? 🔠 Подписаться на канал Даниила 🔠 Подписаться на канал Даниила 🔠 Подписаться на канал Даниила

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

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

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

Сегодня я написала для вас целую инструкцию по настройке среды для дальнейшей работы с Claude❗️ Я очень часто в роликах и историях говорю: не получится сделать сайт нажав лишь одну кнопочку в строке запросов у Claude какой бы у вас подробный промпт не был! Так что сегодня как раз про все, что вы должны знать для начала работы → так что выделите себе 2-3 часа свободного времени, чтобы во всем разобраться, это не так просто☺️ 🔗Ссылка на инструкцию (статья лежит в Notion, так что, возможно, вам понадобится VPN) Возможно, вы сейчас увидите инструкцию и испугаетесь… Или скажете «так я вообще ничего не понимаю в разработке»🥲 На самом деле, самый муторный этап это «вкатиться» в это все и понять что к чему, дальше – легче. Вам не нужно писать код для создания сайтов, не нужно разбираться в разработке – этот процесс не про это!😳 Как я уже говорила – я не представляю профессию дизайнера будущего без этого навыка, он очень оптимизирует и ускоряет твою работу. Согласитесь, собрать за день 1 презентацию и целых 10 таких же – это большая разница?✅ В общем, приятного чтения, если что будет непонятно – спрашивайте. И, конечно, буду рада вашим реакциям✨ #полезное #клод