Учебный план
О курсе
Онлайн курс «Анимация интерфейсов на CSS и JavaScript» — это программа профессиональной переподготовки, направленная на освоение принципов создания плавных, понятных и функциональных анимаций для веб-интерфейсов с использованием CSS transitions, CSS animations, transform, opacity, JavaScript-событий и базовых сценариев управления состояниями элементов.
В рамках курса Вы изучите, зачем нужна анимация в интерфейсе, как она помогает пользователю понимать изменения на странице, какие эффекты улучшают взаимодействие, а какие перегружают сайт и ухудшают удобство.
Курс включает практическую работу с типовыми элементами: hover-эффектами, кнопками, меню, карточками, модальными окнами, вкладками, аккордеонами, уведомлениями, слайдерами, появлением блоков, плавной прокруткой, анимацией загрузки и микровзаимодействиями.
Отдельный блок посвящён CSS-анимациям. Вы рассмотрите transition, animation, keyframes, transform, translate, scale, rotate, opacity, timing functions, delay, duration, hover, focus, active и правила создания плавных эффектов без лишней нагрузки.
Особое внимание уделяется JavaScript-управлению анимациями. Вы изучите обработку событий, добавление и удаление классов, управление состояниями, запуск анимаций при клике, скролле, открытии окна, отправке формы и изменении интерфейса.
Практический блок программы направлен на создание набора анимированных интерфейсных компонентов. Вы сможете реализовать анимации для кнопок, меню, карточек, модальных окон, уведомлений и защитить итоговый проект.
В ходе программы Вы освоите:
• основы анимации веб-интерфейсов;
• CSS transitions и CSS animations;
• keyframes, transform, opacity и timing functions;
• hover, focus, active и состояния элементов;
• JavaScript-события для управления анимациями;
• анимацию меню, модальных окон, карточек, уведомлений и форм;
• принципы умеренной, полезной и доступной анимации;
• создание итогового набора анимированных UI-компонентов.
Программа подойдёт frontend-разработчикам начального уровня, web-разработчикам, верстальщикам, веб-дизайнерам, студентам, специалистам по интерфейсам и всем, кто хочет делать сайты более живыми и удобными.
Цели и задачи курса
Цель программы — сформировать у слушателей практические навыки создания интерфейсных анимаций на CSS и JavaScript.
В рамках курса Вы освоите:
• движение через transitions, keyframes, transform, opacity и timing functions;
• состояния через hover, focus, active, классы и пользовательские действия;
• интерфейс через меню, карточки, модальные окна, вкладки, уведомления и формы;
• JavaScript через события, управление классами и запуск анимаций;
• качество через производительность, доступность, плавность и умеренность эффектов;
• практику через итоговый проект с анимированными UI-компонентами.
Программа даст ответы на следующие вопросы:
• Зачем нужна анимация в интерфейсе?
• Как работают CSS transitions и keyframes?
• Как анимировать кнопки, меню, карточки и модальные окна?
• Как запускать анимацию через JavaScript?
• Как управлять состояниями элементов?
• Как сделать анимацию плавной и не перегрузить интерфейс?
• Как создать набор анимированных компонентов для сайта?
По окончании обучения Вы получите
Диплом о профессиональной переподготовке, подтверждающий освоение программы «Анимация интерфейсов на CSS и JavaScript» и компетенции в области создания анимированных веб-интерфейсов.
Учебный план курса
• Введение в анимацию интерфейсов
• Роль анимации в UX
• Микровзаимодействия
• Когда анимация помогает пользователю
• Когда анимация мешает интерфейсу
• CSS transitions
• Transition properties
• Duration и delay
• Timing functions
• Hover-эффекты
• Focus и active states
• Transform
• Translate
• Scale
• Rotate
• Opacity
• CSS animations
• Keyframes
• Animation duration
• Animation iteration
• Animation direction
• Анимация кнопок
• Анимация карточек
• Анимация меню
• Анимация модального окна
• Анимация вкладок
• Аккордеон
• Уведомления
• Loader на CSS
• Плавная прокрутка
• JavaScript-события
• Добавление и удаление классов
• Управление состояниями элементов
• Анимации при клике
• Анимации при скролле на базовом уровне
• Производительность анимаций
• Доступность и reduced motion
• Итоговый проект: набор анимированных UI-компонентов
• Итоговая аттестация — тестирование и защита проекта
Что нужно для поступления на программу:
Для поступления Вам необходимо прислать скан-копии или фотографии документов об образовании, паспортные данные и удаленно заключить договор. Гражданам Российской Федерации потребуются:
• Паспорт или другой документ, удостоверяющий личность или гражданство;
• Страховой номер индивидуального лицевого счета (СНИЛС);
• Документ об образовании и квалификации (фотография или скан-копия);
• Справка об обучении в организации высшего или среднего профессионального образования, если Вы в настоящее время являетесь студентом (фотография или скан-копия);
• Документ, подтверждающий факт изменения фамилии, имени или отчества (при необходимости) (фотография или скан-копия).
Гражданам иностранных государств и лицам без гражданства следует уточнить список необходимых сведений и документов в отделе организации приема по телефону или через форму заявки на консультацию.
Выгоды и скидки, варианты оплаты, рассрочка платежа:
• Вы сможете вернуть 13% от стоимости обучения в виде социального налогового вычета, обратившись в налоговую службу по месту постоянной регистрации.
• Чтобы запросить документы для получения налогового вычета, необходимо обратиться в методический отдел, написав нам на электронную почту mcnokurs@yandex.ru.
• Проверка документов после подачи в ФНС осуществляется в течение трех месяцев. Если ответ положительный, средства возвращаются.
• Обратите внимание, что декларация и заявление заполняются и подаются слушателем самостоятельно.
• (Нормативное обоснование получения налогового вычета регламентировано статьями 78, 80, 83, 88, 219 Налогового кодекса РФ).
• Беспроцентная рассрочка
• Вы можете получить беспроцентную рассрочку на программы профессиональной переподготовки.
Для получения дополнительной информации о рассрочке на конкретную программу обратитесь к специалисту приемной комиссии
