для детей 12—15 лет
Начальный уровень

Создание сайтов

Научимся создавать сайты, работать с изображениями, элементами дизайна и графики. Совместим интерес к творчеству с программированием.

Бесплатный урок
Что за курс
Курс поможет ребятам получить навыки в сфере web-дизайна и верстки сайтов. Они смогут создавать сайты средней сложности: от идеи и структуры до реализации и размещения в сети.

Чему научатся дети

На курсе «Создание сайтов» мы научим ребят

Создавать макеты сайта с помощью специальных инструментов
Создавать HTML документы
Работать с CSS стилями
Применять базовые элементы JavaScript
Дисциплине, проектной работе в команде, выступлениям
В конце курса ребята будут презентовать сайт, полностью сделанный ими. На нём они смогут продемонстрировать свои навыки.

План обучения и проекты

1 модуль

Введение в HTML

Введение в язык HTML. Понимаем внутреннюю организацию веб-страницы

1) Введение в язык HTML. Понимаем внутреннюю организацию веб-страницы

2) Оформляем текст средствами HTML

3) Знакомимся с секционными элементами HTML5

4) Изучаем базовый синтаксис CSS, селектор тега и основные правила для оформления текста

Результат: дети понимают роль CSS в веб-разработке, разделение ролей между HTML и CSS, умеют пользоваться правилами для оформления текста и цвета фона; понимают модель RGB, знают типы шрифтов и умеют подключать внешние шрифты из Google Fonts

+
-
2 модуль

Основы CSS

Селекторы класса и идентификатора. Учимся применять CSS-правила точечно к конкретным элементам

1. Селекторы класса и идентификатора. Учимся применять CSS-правила точечно к конкретным элементам

2. Изучаем блочную модель элемента и рассматриваем ее составляющие

3. Учимся работать с расширенными настройками фона. Создаем простой эффект параллакс

4. Позиционирование элементов страницы

Результат: дети знают особенности типов позиционирования, понимают понятие поток документа, умеют применять разные типы позиционирования в зависимости от задачи

+
-
3 модуль

Прототипирование и основы UX / UI

UX/UI. Введение в дизайн. Понимаем, что такое UX дизайн и как его нужно разрабатывать.

1. UX/UI. Введение в дизайн. Понимаем, что такое UX дизайн и как его нужно разрабатывать.

2. Основы прототипирования в Figma. Учимся использовать его базовые инструменты.

3. Знакомство с законами UI, основанных на психологии человека. 

4. Разработка первого профессионального макета

Результат: дети учатся создавать структуру сайта, правильно организовывать пространство для макетирования, создавать модульную и колоночную сетку для экранов макетирования; ребята самостоятельно работают над макетом своей первой главной страницы.

+
-
4 модуль

Верстка макета

Изучаем Flexbox и Grid позиционирование на основе блочной и модульной сетки.

1. Изучаем Flexbox и Grid позиционирование на основе блочной и модульной сетки.

2. Знакомимся с float, fixed, sticky и мультиколоночной версткой

3. Применяем фреймворки для быстрой и удобной верстки. Изучаем самый популярный фреймворк для верстки макетов Bootstrap.

4. Верстка первого проекта

Результат: готовый проект на основе созданного в третьем модуле макета на выбранную тему. Ребята презентуют полученный результат и выкладывают в HUB.

+
-
5 модуль

Углубленный CSS

Знакомимся с селекторами в CSS

1. Знакомимся с селекторами в CSS

2. Стилизация блоков в CSS. Осваиваем основные команды CSS для стилизации блоков.

3. Изучаем основные команды, отвечающие за эффекты в оформлении элементов в CSS.

4. Правила организации вашего CSS. Практическая работа

Результат: Дети научатся правильно писать CSS-документы, комментировать блоки. Ребята организуют работу со своим проектом. 

+
-
6 модуль

Адаптивная верстка и анимация в CSS

Принципы адаптивной верстки, медиазапросы. Адаптация сайта под разные экраны.

1. Принципы адаптивной верстки, медиазапросы. Адаптация сайта под разные экраны.

2. Анимация в CSS. Создание анимированных элементов. 

3. Препроцессор SASS, что это такое и зачем он нужен. 

4. Формы в языке HTML. Знакомство с тегом Form и элементами формы.

Результат: дети научатся использовать свойства CSS для «резиновой» верстки, создадут несколько анимированных элементов и напишут CSS используя синтаксис SСSS.

+
-
7 модуль

Введение в JavaScript

Введение в JavaScript. Знакомство с библиотекой jQuery

1. Введение в JavaScript. Знакомство с библиотекой jQuery

2. Методы и условия в jQuery. Учимся использовать методы и условия в jQuery.

3. Эффекты анимации и события jQuery

4. Массивы и циклы в jQuery. Используем циклы для решения некоторых задач.

Результат: дети научатся пользоваться циклами и напишут программы, позволяющие обрабатывать информацию введенную пользователем.

+
-
Финал

Продвинутые инструменты JS и презентация проекта

jQuery UI. Библиотека с типовыми решениями для Web-разработчиков

1. jQuery UI. Библиотека с типовыми решениями для Web-разработчиков

2. Drag and Drop. Создаем мини-игру

3. Встраиваем аналитику и другие полезные сервисы на сайт

4. Финальное занятие. Разбираем тем, которые мы изучили, отвечаем на вопросы детей, смотрим их проектные работы.

Результат: довольные дети, готовые собственные проекты

+
-

Работы учеников

Мы уверены, что учитьcя на практике эффективнее. Поэтому у нас нет скучных лекций, и на занятиях дети создают реальные игры и программы.

Марат
Ремушев
13 лет
Flappy bird
PYTHON

Flappy Bird — мой первый игровой проект на PyGame! Нажимайте «пробел» и прыгайте!

Елена
Дорошко
12 лет
Сайт про животных
WEB

Собрала 17 фактов о животных на сайте. Нажимайте Пуск и читайте :)

Иван
Баюшкин
14 лет
Fishing Simulator
PYTHON

Игра где вы сможете побыть рыбаком на причале или на лодке. На причале есть 5 видов рыб

Артем
Гончаров
11 лет
Майнкрафт
SCRATCH

Привет! ты попал в Minecraft 2D

Хотите посмотреть больше работ на нашей обучающей платформе?
Смотреть ещё

Преподаватели

Преподаватель Python

Александр Хархота

Навыки
Python
WEB
Chat Bot
Образование
Сибирский государственный университет телекоммуникаций и информатики

Достижения
Преподаватель федерального проекта Кампус-2019 и Кампус-2020; Автор программы по созданию чат-ботов и искусственного интеллекта для детей
Преподаватель WEB Design

Панфилов Алексей

Навыки
Python
Robotics
WEB
Образование
Петрозаводский Государственный Университет. Физический факультет, автоматизированные системы обработки информации и управления.
Достижения
Организатор и главный судья международных робототехнических соревнований Roboskills, член национального методического комитета Innopolis Open по направлению Future Engineers
Преподаватель unity

Константин Кламбоцкий

Навыки
Python
Unity
Computer Science
Образование
Механико-математический факультет Новосибирского государственного университета

Достижения
Второе место по России в конкурсе "разработка мобильных приложений в дополненной реальности" от Epson
Преподаватель Python

Вершинина Ксения

Навыки
Python
Computer Science
WEB
Образование
НТИ Уральского федерального университета имени первого Президента России Б.Н. Ельцина
Достижения
Автор публикации в сборнике «Advances in science and technology XXVIII” и e-library
<>

Что должен уметь ребёнок

Чтобы приступить к занятиям ученику должен иметь базовые навыки:

Владеть мышкой
Уметь читать и писать на русском
Владеть базовыми знаниями английского
Иметь минимальный опыт взаимодействия с компьютером

Как проходят уроки

1
Повторяем тему прошлого урока и разбираем домашнее задание.
2
Разбираем новую тему и группа под контролем преподавателя решает первые задачи.
3
Ученики самостоятельно решают усложненные задачи и в конце часто идут игровые задания.
4
В конце урока преподаватель с группой подводят итоги, повторяют все что успели пройти и готовятся к следующему уроку.
32
урока в курсе
90
минут урок идёт
12
человек в группе

Запишитесь на пробный урок

За 40 минут пробного урока ребёнок и родители смогут понять: подойдут ли занятия программированием, а методист поможет подобрать направление подходящее для студента.






Ваша заявка отправлена!
Oops! Something went wrong while submitting the form.