Майоров про сайты | ex Webflow Pro

Текстуры для 3D

Как делать анимации GSAP в Webflow | 2 часть. Используем нейросети с помощью Cursor Проект из урока Видео на Youtube

Как находить логотипы в SVG

Всем привет! Для проекта собрал квиз, в котором кнопка «Далее» активируется только после выбора варианта. Делюсь бесплатно — можно забрать по ссылке: https://try.webflow.com/quiz

Новое видео на канале. Урок по анимации карточек в Webflow через GSAP Editor. Разберем, как задать плавное движение и как сделать так, чтобы последняя карточка не анимировалась — всё с помощью кастомного CSS-селектора .card:not(:last-child) Ссылка на YouTube Ссылка на VK Видео

GSAP-анимация круглой маски в Webflow Видео на Youtube Результат Проект для клонирования

Как сделать лайтбокс для изображений внутри Rich Text в Webflow Библиотека Lightbox3 Код из видео <!-- Lightbox --> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/lightbox3.min.js"></script> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/lightbox3.min.css"> <script> (() => { const ALT_PREFIX = 'lb:' const isLbImg = (img) => { if (!img || img.tagName !== 'IMG') return false return (img.getAttribute('alt') || '').startsWith(ALT_PREFIX) } const findLbImg = (node) => { const img = node?.closest?.('img') return isLbImg(img) ? img : null } const getLightboxCtor = () => { const w = window if (!w) return null if (w.Lightbox && typeof w.Lightbox.init === 'function') return w.Lightbox if (w.Lightbox3 && w.Lightbox3.Lightbox && typeof w.Lightbox3.Lightbox.init === 'function') { return w.Lightbox3.Lightbox } return null } const getLightbox = () => { const ctor = getLightboxCtor() if (!ctor) return null if (!window.__lb3Singleton) window.__lb3Singleton = ctor.init() return window.__lb3Singleton } const getImgSrc = (img) => { if (!img) return '' return img.currentSrc || img.src || img.getAttribute('src') || '' } document.addEventListener( 'click', (e) => { const img = findLbImg(e.target) if (!img) return const lb = getLightbox() const src = getImgSrc(img) if (!lb || !src) return e.preventDefault() e.stopPropagation() lb.open(src, img) }, true ) const hintCursor = () => { document.querySelectorAll(`img[alt^="${ALT_PREFIX}"]`).forEach((img) => { img.style.cursor = 'zoom-in' }) } if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', hintCursor, { once: true }) } else { hintCursor() } })() </script>

Привет! Рассказываю о проекте на Webflow, который создал с помощью AI-агентов и MCP-сервера Webflow. Видео на YouTube Сайт из видео — https://blumberger-dev.webflow.io/ Описание кейса — https://item.team/blumberger Скачать скилл — https://github.com/IvanMayorov/figma-to-webflow

Как меняется работа веб-дизайнера с приходом AI? Поговорили с Сашей Рассоловым о том, как мы делаем сайты, какие задачи отдаём нейросетям и за что теперь платят заказчики. Обсудили Figma, Webflow, Instatic, Astro, Claude и Codex. Разобрали процесс от идеи до готового сайта, работу с анимацией, стоимость проектов и навыки, которые помогают оставаться востребованным. Хотите научиться делать сайты с AI? Подробнее о курсе — https://mayorov.team/education/ А как нейросети изменили вашу работу? Расскажите в комментариях. YouTube VK видео

Показываю, как использую нейросети в работе над реальными проектами: от дизайна и адаптивной вёрстки до анимаций, интернет-магазинов и прототипов для клиентов. В видео — примеры сайтов, созданных с помощью Codex и Claude, перенос готовой страницы в Figma для правок, редизайн шаблонного AI-сайта и магазин на Medusa с доставкой СДЭК и оплатой через Т-Банк. Главный принцип: человек думает, а нейросеть делает. Разбираю, где нужен дизайнерский взгляд и почему одного промпта недостаточно для решения задач бизнеса. 🎓 Про обучение Мастермайнд по AI-дизайну: 3 месяца, два созвона в неделю по два часа, группа до 8 человек, 6 работ в портфолио. Записанных уроков нет — в AI-инструментах слишком многое меняется, поэтому всё разбираем вживую и на актуальных версиях. Вопросы в личку: @ivanmayorov Смотреть в 4k на Youtube