Webflow курс: навчання розробці сайтів без коду з нуля | SKVOT (СКВОТ)

Створюй сайти професійного рівня без програмування

WEBFLOW
З НУЛЯ

Лектор: Саша Кім
Співпрацював з L’Officiel, Casio, Subaru, 1+1, Credit Agricole Bank, Metro Cash & Carry, Welltech, Work.ua
читати далі
дата
26 березня — 19 травня
тривалість
15 занять
бонус
курс Figma в записі

Це практичний курс по Webflow для тих, хто хоче робити сайти самостійно і без коду.

Ти навчишся збирати сайти, не залучаючи програмістів. Опануєш Webflow: від створення структури сторінок — до налаштування анімації та керування контентом. Зрозумієш, як створювати адаптивний дизайн, що однаково добре виглядає і на ноутбуці, і на смартфоні.

 

Як результат — запустиш власний сайт і матимеш покроковий план, щоб заробляти на розробці сайтів: де шукати клієнтів, як продавати свої послуги та працювати на фрилансі.

Для кого

  • UX/UI-, Web- та Product-дизайнери

    навчишся самостійно запускати проєкти «під ключ» без допомоги розробників, зможеш тестувати ідеї на реальних сайтах і суттєво підвищиш свій чек на фрилансі

  • верстальники та Frontend-розробники

    перейдеш на міжнародну платформу, щоб збирати сайти в кілька разів швидше, легко керувати складними CMS та вийти на замовлення з глобального ринку

  • маркетологи, PM та власники бізнесу

    отримаєш інструмент для швидкого тестування гіпотез та запуску лендингів, зможеш самостійно створювати сайти для власних продуктів, оновлювати контент і перестанеш залежати від технічної команди

Після курсу

  • • працюєш із CMS Webflow та створюєш динамічні сторінки

  • • вмієш самостійно доводити сайт від ідеї до запуску без залучення розробників

  • • вмієш додавати базові анімації, налаштовувати форми та інтеграції

  • • збираєш повноцінний сайт як кейс для портфоліо

  • • розумієш подальші сценарії розвитку у фрилансі, роботі з клієнтами або інтеграції Webflow у свою спеціалізацію

Лектор

САША КІМ

  • 12+ років у професії

  • Ex-Product Design Lead at Welltech

  • Має досвід в UX/UI-, web- і product-дизайні та експертизу у повному циклі створення цифрових продуктів

  • Працював із L’Officiel, Casio, Subaru, 1+1, Credit Agricole Bank, Allo, Metro Cash & Carry, Welltech, Work.ua

  • У портфоліо: мобільні застосунки з аудиторією понад 100 млн користувачів, рішення для AI-стартапів та складних продуктів у e-commerce, wellness, освіті й фінансах

Програма курсу

  • 00

    Знайомство: хто є хто?

  • 01

    Як працює веб і Webflow

    • HTML та CSS: роль і різниця, Normal flow контенту і Box model
    • Webflow UI: Canvas, Navigator, Style Panel

    ДЗ № 1. Створи перший проєкт і налаштуй відступи.

  • 02

    Структура сторінки та логіка wrappers

    • архітектура: Header, Main, Footer і каркас сторінки
    • правильна вкладеність елементів: Sections vs Divs

    ДЗ № 2. Побудуй логічний каркас сторінки з осмисленими класами.

  • 03

    Система стилів: класи, одиниці, змінні

    • Global та Combo classes, робота з одиницями rem та em
    • налаштування Variables: кольори, шрифти й створення Style guide

    ДЗ № 3. Налаштуй системи стилів та застосуй змінні.

  • 04

    Layout-системи: Flex та Grid

    • Flexbox: напрям, вирівнювання та gap
    • Grid як система та побудова Bento-структур

    ДЗ № 4. Створи Hero-секції на Flex та сітки карток на Grid.

  • 05

    Q&A-сесія

    • розбираємо запитання та складні моменти у прямому ефірі
  • 06

    Компоненти й позиціювання

    • робота з компонентами (Nav / Footer) і станами (Hover)
    • позиціювання: Relative, Absolute, Sticky та Card overlays

    ДЗ № 5. Створи компоненти й налаштуй sticky та absolute елементи.

  • 07

    Homepage і статичні сторінки

    • збірка головної сторінки та робота з шаблонами (About page)
    • логіка переходів та налаштування фонів

    ДЗ № 6. Фіналізуй сторінки Home та About із загальною навігацією.

  • 08

    Анімації та складні секції

    • типи анімацій: Hover interactions, Infinite marquee та Horizontal scroll
    • робота з тригерами без шкоди для адаптивності

    Д/З №7. Додай живу анімацію та перевір на мобільних пристроях.

  • 09

    CMS: базова логіка

    • концепція колекцій, створення Template pages та CMS slider
    • динамічний вивід контенту через Collection List

    ДЗ № 8.Створи бази даних у межах webflow курсу та виведи динамічний список проєктів.

  • 10

    Форми та взаємодія

    • налаштування форм, Success messages та FAQ-акордеонів

    ДЗ № 9. Додай робочої форми та інтерактивний блок запитань.

  • 11

    Q&A-сесія

    • розбираємо запитання та складні моменти у прямому ефірі
  • 12

    Навігація для великих сайтів

    • Custom menu, Hamburger та Mega nav для різних брейкпойнтів

    ДЗ № 10. Створи адаптивне мобільне меню.

  • 13

    Масштабування та запуск

    • інтеграції з Airtable/Zapier і технічна підготовка (SEO, Alt-теги)
    • публікація на хостинг і налаштування OG preview

    ДЗ № 11. Повний запуск сайту .

  • 14

    Презентація проєктів

  • 15

    Підсумок. Подальші кроки

    • портфоліо, позиціювання і стратегія пошуку клієнтів
    • ціноутворення та розвиток після завершення курсу Webflow
    • вихід на фриланс-платформи (Upwork / Fiverr)

Записатися

Наші курси недоступні громадянам росії та білорусі

Обов’язкове поле
Обов’язкове поле
Обов’язкове поле
Реєструючись і натискаючи кнопку “Зареєструватися”, ви погоджуєтеся з умовами договору-оферти і політикою конфіденційності