Серия видеоуроков по HTML5 Canvas

Для начала вам объяснят, зачем нужен Canvas и что будет изучаться в рамках этого курса. Видео носит больше поучительный характер, и если вы хотя бы немного знакомы с данным инструментом, то можете смело переходить к следующему видео.

Здесь вам расскажут о нескольких известных проектах, где используется рассматриваемая нами технология. Среди этих проектов Pirates love Daisies – браузерная видеоигра, Raphael – библиотека js для создания графиков и диаграмм, и т. д.

Установка необходимого ПО – первый шаг. Следующий урок представляет собой краткий обзор изучаемых операций, и в третьем видео вы создадите ваш первый элемент Canvas.

Проводится сравнительная характеристика двух наиболее распространённых технологий, предназначенных для рисования в браузере 2D изображений, – Canvas и SVG.

Вас научат, как изменять свойства тегов Canvas.

  • Основы рисования;
  • Настройка отображения;
  • Встроенные геометрические фигуры (прямоугольники и линии);
  • Состояние рисования;
  • Дуги и контуры;
  • Кривые Безье и квадратичные кривые;
  • Рисование текста.

На этих занятиях речь пойдёт о более сложных техниках рисования. Разбираются такие вещи, как техника создания теней, использование паттернов, создание градиентов и секущих контуров.

На данном уроке нам покажут, как с помощью Canvas можно упростить встраивание изображений и видео в веб-страницу.

В первом видео речь пойдёт о том, что такое трансформации и как применять к созданным элементам трансформацию перемещения. На следующих двух уроках вам также расскажут о трансформациях масштабирования и перемещения, и под конец объяснят, как определять свои собственные трансформации.

Видеоурок, посвящённый работе с глобальными настройками отображения элементов в браузере.

Изучаем одну из самых мощных возможностей Canvas – рисование сырыми пикселями.

Учимся создавать слайд-шоу и делать более плавные переходы между слайдами.

В данном разделе мы научимся основам создания анимации и познакомимся с таким методом, как двойная буферизация.

Завершающий раздел нашего обучения. Здесь мы применим все полученные знания на практике и посмотрим, чему мы научились за этот курс.