Станьте высокооплачиваемым разработчиком на Webflow, создавайте сайты международного уровня и трудоустраивайтесь в лучшие компании
записаться на курс
Было очень интересно и познавательно, узнала новое и о дизайне, и о Webflow. Каба - хороший и очень терпеливый ментор, выдержал 10 месяцев, что мы делали проект)
Внутренней осознанности по разработке фестивального сайта прибавилось.
Вы можете воспользоваться беспроцентной рассрочкой без первого взноса с возможностью досрочного погашения от наших партнеров: Яндекс.Касса, Халва и Тинькофф Банк.
Оставьте заявку для получения более подробной информации.
Вы можете воспользоваться беспроцентной рассрочкой, без первого взноса с возможностью досрочного погашения, от наших партнеров: Яндекс.Касса, Халва и Тинькофф Банк.
Оставьте заявку для подробностей.
Курс разбит на последовательные и логические этапы реальной разработки проекта. Таким образом вы легко усвоите материал и научитесь систематизировать свои рабочие процессы.
Процесс подготовки на 80% состоит из практической работы, что позволяет максимально оттачивать навыки и наработать опыт.
По окончании вы будете обладать достаточным опытом и навыками, чтобы выполнить любой проект самостоятельно.
Вас ждут максимально подробные консультации от наших специалистов в формате видеоразборов на всех этапах работы над проектом, а также закрытые вебинары с разбором проектов, ответами на вопросы и консультацией по трудоустройству.
Наши специалисты обладают не только профессиональным опытом, но и способностью доходчиво доносить свою мысль.
У нас есть уникальная механика контроля качества предоставления консультаций.
Последовательные и логические этапы реальной разработки проекта. Систематизация рабочих процессов.
Вас ждут максимально подробные консультации от наших специалистов.
Наша техподдержка отвечает в течение 5 минут по всем организационным вопросам.
Вы можете оплатить полную сумму или воспользоваться беспроцентной рассрочкой
В этом уроке вы узнаете о курсе и о том, как будет проходить обучение. Познакомитесь с возможностями и назначениями бесплатного и платных тарифов Webflow. Также вы узнаете, как построить работу над проектом от анализа до запуска.
О чем этот курс
Как проходит курс
Планы и тарифы
Site Plans (Сайт планы)
Account Plans (Аккаунт Планы)
Обзор и Анализ макета
Чек-лист приемки макета
План работы
Подготовка макета к верстке
Экспорт и оптимизация изображений
Подготовка других файлов
В этом уроке вы познакомитесь с основными элементами веб‑страницы и принципами блочной верстки, на основе которых работает сервис Webflow. Базовые знания помогут вам разобраться в основной терминологии веб‑разработки. Вы узнаете, что такое иерархия веб-страницы и из чего она состоит. Рассмотрите панель Навигатор, чтобы понять, как создается и отображается структура элементов в сервисе Webflow.
Блочная верстка и основы HTML и CSS
Иерархия элементов сайта
Панель Навигатор
Практика: Планирование структуры сайта
В этом уроке вы узнаете, как зарегистрироваться на сайте Webflow и создать проект, изучите ограничения по количеству проектов и страниц в проекте. Вы поймете, какие существуют режимы работы в сервисе Webflow. А также научитесь активировать аккаунт и публиковать сайт, используя выпадающую панель Publish.
Регистрация и создание проекта
Публикация сайта
Поделиться проектом (Share project)
Клонирование проекта
Клонирование специального шаблона
Вы познакомитесь с основными настройками проекта в режиме Project Settings.В результате настроите проект, загрузите изображения по папкам и сверстаете UI Kit.
Настройки проекта
Подключение своего домена
Файлы сайта
Общие настройки проекта
Настройка основных стилей
Загрузка изображений
UI Kit основных элементов
В этом уроке вы узнаете о способах добавления элементов на страницу сайта и о том, какие элементы не могут находится внутри себе подобных. Изучите, какие основные элементы существуют для создания сайта, и каково их предназначение. В заключение создадите структуру сайта и добавите контент в элементы.
Добавление элементов
Обзор основных элементов
Обзор функциональных элементов
Персональные настройки элементов
Практика: Создание основной структуры сайта
Практика: Добавляем элементы и классы
Вы познакомитесь с такими понятиями, как Классы и Комбо Классы, и узнаете об их назначении. По итогу добавите классы Секциям, Контейнерам, Изображениям, Текстам.
Общие принципы
Обзор простых разделов панели Style (Стиль)
Обзор панели Style Manager (Управление стилями)
Состояния элементов
Практика: Добавление контента элементам
Вы изучите состав панели Style и разберете раздел Layout, который служит для настройки расположения элементов относительно друг друг.
Панель Style: Раздел Layout
Практика: Детальная верстка 1 и 2 секций
Вы продолжите изучение состава панели Style и изучите элемент Grid, отвечающий за способ расположения элементов, который идеально подходит для создания различных макетов со сложной сеткой, включая таблицы, которые можно легко преобразовать в карточки на мобильных экранах.
Панель Style: Элемент Grid
Практика: Детальная верстка 3 и 4 секций
Вы продолжите изучение состава панели Style и изучите раздел Size, который позволяет определить размер элемента, установить минимальные и максимальные значения ширины и высоты, а также настроить поведение дочерних элементов, выходящих за границы родительского элемента.
Панель Style: Раздел Size
Практика: Детальная верстка 5 и 6 секций
Мы рассмотрим панель Pages (Страницы). Узнаем, какие типы страниц существуют и как их настраивать. В результате вы сверстаете 7-8 секции сайта.
Страницы сайта
Практика: Детальная верстка 7 и 8 секций
Вы узнаете о дополнительных функциях, которые помогают в процессе работы над проектом, а также в поиске обучающих материалов. В результате вы сверстаете 9-10 секции сайта.
Вспомогательные функции в режиме Designer
Практика. Детальная верстка 9 и 10 секций
Узнаете, как в Webflow создавать Символы из элементов или группы элементов для управления повторяющимися блоками и контентом. По итогу сверстаете меню навигации, Navbar, настроите якорные ссылки и создадите символы для Меню и Footer.
Обзор панели Symbols
Обзор готовых макетов Layouts
Создание Символов
Практика
В этом уроке вы изучите основы адаптивной верстки, познакомитесь с понятием «Брейкпоинты». В результате создадите адаптив планшетной и мобильной версии, адаптив для больших экранов и адаптив меню.
Основы адаптивной верстки
Брейкпоинты
Проверка адаптивности
Адаптация сайта под мобильные экраны
Адаптация сайта под большие экраны
Тестируем адаптивность
Вы изучите общие принципы анимации, узнаете, как создавать анимацию кнопок ссылок и других элементов при наведении, анимируете первый экран.
Общие принципы анимации
Триггеры
Настройка триггеров
Анимируем элементы при наведении
Якорные ссылки
Вы узнаете, что такое глобальная анимация. В результате научитесь ее создавать.
Глобальная анимация
Анимация компонентов
Анимация при загрузке и прокрутке страницы
Вы поймете, зачем нужно вставлять сторонний код. Познакомитесь с компонентом Embed. Узнаете, как можно интегрировать сторонний код, например, подключить сервисы комментариев или виджет карты. На практике научитесь вставлять код карты.
Компонент Embed
Вставка кода в настройках страницы
Вставка кода в настройках проекта
Вставка кода в настройках элемента (Custom Attributes)
Вставляем карту на сайт
Узнаете, что такое веб‑аналитика и SEO и для чего они нужны. Поймете, как подключить Аналитику и настроить SEO страницы.
Подключение Аналитики
Подключаем Яндекс Метрику и Google Analytics
Настройка SEO в настройках страницы
Еще раз пройдетесь по всем этапам создания сайта. Разберетесь, как утверждать и передавать сайт клиенту. Научитесь подключать сайт к домену на хостинге Webflow, выгружать сайт и устанавливать его на своем хостинге.
Чек‑лист проверки сайта
Утверждение и Передача проекта клиенту
Подключение сайта к домену на хостинге Webflow
Выгрузка сайта и установка на своем хостинге
Дипломный проект
Вы можете воспользоваться беспроцентной рассрочкой без первого взноса с возможностью досрочного погашения от наших партнеров: Яндекс.Касса, Халва и Тинькофф Банк.
Оставьте заявку для получения более подробной информации.
Вы можете воспользоваться беспроцентной рассрочкой, без первого взноса с возможностью досрочного погашения, от наших партнеров: Яндекс.Касса, Халва и Тинькофф Банк.
Оставьте заявку для подробностей.
В договоре есть сложный пункт про основную и дополнительную услугу и базовую цену. Основная услуга — это доступ к платформе со всеми видео. Дополнительная услуга — это обратная связь от дизайнеров студии. В стоимость консультации, т.е. в Базовую цену, входит всё вместе, доплачивать не нужно. Просто внутренние пропорции Базовой цены изменяются в зависимости от количества видео, просмотренных клиентом, и полученных видеоразборов от дизайнеров студии.
Такая разбивка была придумана для возможности возврата средств, если клиент выразит такое пожелание. Суть этих пунктов в том, что я смогу вернуть 70% оплаченных средств в первые две недели после покупки, если покупатель вдруг захочет расторгнуть договор после просмотра вводной консультации. 30% вернуть не сможем в любом случае, т.к. они удерживаются с нас нашими финансовыми партнерами, налогами, платформой и т.п. После просмотра дальнейших консультаций и получения разборов от ведущих дизайнеров услуга уже считается оказанной в полном объёме, и деньги вернуть мы не сможем. Так мы хотели предусмотреть возможность хотя бы частичного возврата средств.
Вы можете оплатить полную сумму или воспользоваться беспроцентной рассрочкой без первого взноса с возможностью досрочного погашения от наших партнеров: Яндекс.Касса, Халва и Тинькофф Банк.
Да, мы рисуем проекты в Figma. Это наиболее удобный на сегодняшний день инструмент, который используют большинство студий.
Помогаем правильно составить резюме и оформить портфолио. Консультируем при прохождении собеседования и выполнении тестового задания. Регулярно получаем заявки от работодателей и напрямую трудоустраиваем в компании. Также предлагаем проекты на фриланс и берем на работу в UPROCK.
Консультация проходит в онлайн‑режиме в удобное для вас время. Вы изучаете видеоразборы, вносите правки и отправляете проекты на проверку. Ваш консультант проверяет задание в течение 24 часов и дает вам обратную связь в видеоформате.
.png)
