Хотите познакомить школьника с классическим, а не блочным программированием и сделать обучение синтаксису языка программирования простым и понятным? Программирование станет доступнее, если изучать его на примерах, близких к сфере интересов подростка. Начните с программирования сайтов. Язык HTML позволяет легко перейти от конструирования к текстовому кодированию. Изучаемые технологии помогут школьнику создать свой сайт ярким и интересным, а освоение языка JavaScript позволит школьнику запрограммировать на своем сайте интерактивную онлайн-игру.
Это курс, обучающий школьников кодированию и программированию на примере реализации собственного сайта и разработки своей компьютерной игры. Изучая язык HTML, школьник научится кодировать объекты веб-страницы в наборы символов и знаков. Переходя к программированию онлайн игр, ребенок освоит не только запись команд на языке JavaScript, но и научиться построению игровых алгоритмов. Такой подход позволяет более плавно погрузиться в классическое программирование, где главное – синтаксические правила и логика.
Предварительная подготовка
Наличие уверенных навыков работы за компьютером и высокий уровень логического мышления. Проверить уровень подготовленности можно, пройдя Тестирование.
Основы веб-дизайна и программирования
Графика для сайта и игры
Основы языка программирования JavaScript
Разработка собственной онлайн игры
Инди-разработка компьютерных игр
Конструирование и публикация сайта
Подробная программа…
Основы веб-дизайна и программирования
- Базовые понятия веб-программирования. Структура html-документа. Атрибуты html-тегов. Текстовые теги. Основные атрибуты-обработчики событий.
Проект «Клад»
- Физическая структура веб-страницы. «Дерево» файловой структуры веб-страницы. Тег img и его атрибуты. Изменение текстовой части тега.
Проект «Взрыв»
- Объектная модель документа. Изменение атрибутов элементов DOM. Полная и сокращённая запись изменения атрибутов.
Проект «Радуга»
- Работа с таблицами. Тег table и его структура. Правила построения таблиц.
Проекты «Крестики-нолики» и «Мороженое»
- Понятие и генерация случайных чисел
Проекты «Однорукий бандит» и «Колесо фортуны»
- Приёмы быстрого набора кода. Использование сниппетов. Управление окном веб-страницы
Проект «Выбери игру»
- Навигация по сайту. Тег гиперссылки и его атрибуты
Проект «Навигация по сайту игр»
Практическая работа по модулю «Основы веб-дизайна»
Графика для сайта и игры
- Основные понятия веб-графики. Интерфейс графического редактора. Обработка графики. Добавление текста.
Проекты «Логотип», «Изображения-обложки»
- Быстрые команды. Создание фона из выделения. Использование стилей слоя. Создание макета.
Проекты «Рамки»
Практическая работа по модулю «Графика для сайта и игры»
Модуль «Основы языка программирования JavaScript»
- Структура программы на языке JavaScript. Внедрённый и внешний JavaScript-код. Переменные в JavaScript. Операции с числовыми и текстовыми переменными.
Проекты «Решение задач с использованием переменных разных типов»
- Логические переменные. Логические выражения и операции сравнения. Условный оператор
Проект «Пароль»
- Функции. Вызов функции из другой функции. Рекурсия. Сложный условный оператор.
Проекты «Однорукий бандит», «Колесо фортуны»
- Работа с таймером. Абсолютное позиционирование.
Проект «Тараканьи бега»
Практическая работа «Найди картинку»
- Массивы. Работа с текстовым массивом.
Проекты «Дразнилки», «Викторина»
- Массивы. Работа с числовым массивом.
Проект «Спортлото»
- Цикл со счётчиком.
Проект «Спасти принцессу»
- События клавиатуры. Цикл с условием. Оператор выбора. Работа с несколькими таймерами
Проект «Марио»
Практическая работа «Арканоид»
Итоговый проект «Разработка собственной компьютерной игры»
Изучаемые программы и технологии
HTML, CSS, веб-графика, JavaScript, верстка сайта, хостинг, публикация, клиентское программирование, алгоритмы онлайн-игр, разработка игр в Unity3D.
Если учитывать возраст обучающихся и цель курса – обучение программированию, то создания онлайн игры требуется создать не только программный код, который будет управлять персонажами, но и самих персонажей и «декорации» игрового уровня. Юному разработчику придется все создавать самому, а для этого надо изучить HTML, чтобы сделать разметку игрового уровня, разместить персонажей, CSS – для более яркого оформления игрового уровня и без графики будет не обойтись. Кроме того, вызов JavaScript-кода выполняется также средствами HTML.
Сейчас существует огромное количество конструкторов игр, которые помогли бы юным программистам справится с реализацией онлайн-игр гораздо быстрее и эффектнее. Но конструкторы скрывают за своим интерфейсом логику написания программ и синтаксис реального языка программирования. JavaScript был, пожалуй, самым первым языком, предназначенным для программирования на веб-страницах. С тех пор произошла революция в сфере его использования и сейчас это полноценный язык с неограниченными возможностями по созданию игр. Конечно, изучить все его возможности в рамках одного курса просто невозможно и, учитывая еще и возраст обучающихся, но своими руками создать игровое приложение, которым можно еще и поделиться со всем миром – не это ли отличное начало для ориентированных на программирование школьников. Кроме того, Javascript имеет C-подобный синтаксис, который лежит в основе очень многих современных языков C#, Java и др.
Добившись определенных результатов, школьнику очень хочется поделиться своим игровым проектом с друзьями, родителями и такими же разработчиками. Для размещения игры в сети идеально подходит портал Github. Это открытое международное сообщество будущих и нынешних разработчиков на всех существующих языках. С момента публикации своего проекта школьник становится часть огромного мира разработчиков, где он может черпать новые идеи, искать решения и находить поддержку. Ссылкой на опубликованный проект можно делиться с кем хочется.
Как проходят занятия
Так как курс направлен на изучение программирования и учитывая возраст обучающихся, занятия строятся по принципу постепенного перехода от визуального конструирования к написанию кода на конкретном языке. Без сложных алгоритмов и с «умной» поддержкой визуальной среды программирование превращается в захватывающий процесс, доступный каждому. Большое внимание уделяется практическому применению получаемых знаний и достижению конкретных результатов после каждого занятия.
Для ведения занятий используется мультимедийное и сетевое оборудование. Обучение сопровождается презентационными и раздаточными материалами. Материалы занятия, включая домашние задания, публикуются в Личном кабинете. Для контроля знаний и отработки навыков проводятся практические работы и творческие проекты. За посещаемостью и успеваемостью можно следить в электронном журнале.
Предлагаем вашему вниманию видеофрагмент презентационных материалов, используемых в занятиях.
Результат обучения
К концу курса школьник освоит язык HTML для верстки сайтов, научится использовать CSS для оформления сайта в визуальном редакторе, сможет самостоятельно сконструировать и опубликовать сайт в интернете, включая подготовку веб-графики, изучит динамические свойства веб-страниц для создания интерактивного сайта, овладеет языком JavaScript и алгоритмами разработки игровых приложений.
В завершении обучения школьник самостоятельно разработает и опубликует собственную онлайн-игру, а разработанный веб-сайт станет платформой для ее размещения в интернете.
Кроме того, ребенок почувствует себя настоящим программистом, поймет нравится ли ему эта профессия, разовьет навыки самообразования и ведения проектно-исследовательской деятельности, станет явным интеллектуальным лидером в классе.
По окончанию курса школьник получит Сертификат Учебного центра вычислительной техники установленного образца.
Примеры работ