Программа и содержание
Сайт: Сайт автора
Научитесь создавать современные сайты без кода и станьте Webflow-специалистом, которого готовы нанимать IT-компании или клиенты на фрилансе.
Кто такой Webflow Developer:
Webflow Developer — это специалист, который создает сайты без кода, используя платформу Webflow.
Он собирает лендинги, многостраничные сайты, портфолио, блоги, интернет-магазины — всё, что нужно бизнесу или клиенту.
Если представить, что дизайнер рисует макет, то Webflow Developer оживляет его: делает сайты интерактивными, адаптивными, анимированными и готовыми к публикации.
Это тот, кто превращает идею в работающий, современный и функциональный продукт.
Профессия Webflow Developer открывает вам множество возможностей:
Совмещайте креативность с современными инструментами — создавайте анимированные, стильные и живые сайты
Работайте удаленно из любой точки мира: в digital-агентстве, стартапе или как фрилансер
Публикуйте свои работы на Behance, Dribbble, стройте узнаваемость и привлекайте внимание клиентов
Помогайте бизнесам запускаться и масштабироваться благодаря качественному веб-продукту
Этот курс точно для вас, если вы:
Новичок и хотите попасть в IT без умения писать код
Дизайнер или маркетолог, которому нужно тестировать гипотезы и быстро создавать сайты
Фрилансер и ищете новую нишу для заработка
Ваш результат после курса:
2 готовых сайта в портфолио
Вы создадите два полноценных проекта: базовый и продвинутый — с анимациями, CMS и адаптацией. Это сразу выделит вас среди новичков.
Понимание логики Webflow и современной верстки
Вы будете уверенно работать с Layout, Flex, Grid, позиционированием, адаптивностью, стилями и компонентами — как настоящий веб-разработчик.
Умение оживлять сайты анимациями
Освоите триггерные анимации Webflow и GSAP — сможете делать современные, плавные, стильные эффекты, которые любят клиенты и студии.
Умение работать с динамическим контентом (CMS)
Собирать блоги, портфолио, каталоги товаров и любые контентные структуры — то, что сейчас больше всего ценят бизнесы.
Знание полного цикла работы над проектом
От настройки структуры до SEO, передачи клиенту и публикации. Вы будете знать, как вести заказ от начала до финала.
Готовность брать реальные заказы
У вас будет портфолио, технические навыки и понимание процессов — этого достаточно, чтобы стартовать как фрилансер или претендовать на позиции Webflow Developer.
Программа:
Модуль 1. Базовые по Webflow. Первые шаги
Урок 1. Принципы построения сайтов
Урок 2. Блочная верстка. Правильное мышление и почему именно Webflow
Урок 3. Обзор внутреннего кабинета
Урок 4. Обзор режима Designer
Урок 5. Основные принципы верстки
Урок 6. Display Block — стандартное состояние элемента
Урок 7. Display Flex как наиболее популярный Layout
Урок 8. Grid — когда стоит использовать сетку
Урок 9. Display Inline + None
Урок 10. Отступы и настройки Position
Урок 11. Единицы измерения — когда применять пиксели, а когда другие значения
Урок 12. Настройка размеров и Overflow. Использование Ratio и Fit
Урок 13. Background, Gradients, Clipping, Borders
Урок 14. Тени и 3D-эффекты в Webflow
Результат модуля:
Вы будете уметь создавать любые макеты, работать со всеми типами Layout, настраивать стили элементов и будете понимать, когда и какие инструменты использовать.
Модуль 2. Строим ваш первый сайт
Урок 15. С чего начать построение сайта. Шрифты, переменные, теги
Урок 16. Tabs — как и для чего строить табы
Урок 17. Slider — особенности создания слайдеров
Урок 18. Lightbox — учимся создавать галерею
Урок 19. Форма в Webflow — все особенности форм
Урок 20. Navbar как базовый элемент для построения навигации
Урок 21. Адаптация сайта
Результат модуля:
У вас будет первый готовый сайт в портфолио — многосекционный, адаптивный, со всеми необходимыми элементами для реального проекта.
Модуль 3. Анимации в Webflow
Урок 22. Понятия и принципы работы триггерной анимации. Виды анимаций в Webflow
Урок 23. Разница между состоянием элемента и анимацией
Урок 24. Создаем FAQ с помощью анимации
Урок 25. Анимация типа While moving over element
Урок 26. Анимация типа While scrolling in View
Урок 27. Какие существуют встроенные анимации в Webflow
Урок 28. Смотрим отличия анимации типа Page Trigger
Результат модуля:
Ваши сайты оживут! Вы будете уметь создавать любые анимации: при наведении, при скролле, при загрузке страницы — и будете знать, когда какую использовать.
Модуль 4. Завершение работы над сайтом
Урок 29. Проверка сайта, настройка SEO, передача сайта
Результат модуля:
Вы будете знать полный цикл работы над проектом — от начала до финальной передачи клиенту. Ваш первый сайт будет полностью готов к публикации.
Модуль 5. CMS (Content Management System)
Урок 30. Что такое динамический контент и как он используется
Урок 31. Как создать коллекцию и какие настройки можно добавить
Урок 32. Как отображать данные из коллекции на странице. Фильтрация данных
Урок 33. Как работать с внутренней страницей коллекции
Урок 34. Создаем статьи блога на практике
Результат модуля:
Вы будете уметь создавать блоги, портфолио, каталоги товаров, команды сотрудников — любой контент, который нужно легко обновлять.
Модуль 6. Особенности использования резиновой верстки. Продвинутая анимация GSAP
Урок 35. Разница между адаптивной версткой и резиновой версткой
Урок 36. Как и когда правильно использовать резиновую верстку. Fluid Calculator
Урок 37. Применяем подход Fluid верстки на предварительно созданном сайте
Урок 38. Изучаем встроенные GSAP-анимации. Исследуем их особенность
Урок 39. Применяем GSAP-анимации на предыдущем сайте. Делаем стильную анимацию для наших текстов
Результат модуля:
Ваши сайты будут выглядеть идеально на любом размере экрана, а анимации выйдут на уровень топовых веб-студий.
Модуль 7. Практическое создание сайта (продвинутый уровень)
Урок 40. Учимся создавать правильную структуру сайта. Более сложные настройки Variables
Урок 41. Верстаем сайт с применением новых знаний
Урок 42. Учимся создавать компоненты из наших элементов для удобства клиента
Урок 43. Применяем CMS на практике для создания реальных блоков
Урок 44. Адаптируем сайт на все устройства с использованием новых знаний
Урок 45. Финальные советы о том, как правильно завершить работу над сайтом
Результат модуля:
У вас будет второй профессиональный сайт в портфолио — более сложный, с CMS, компонентами и продвинутыми анимациями. Вы будете готовы брать реальные заказы!