Программирование для воссоздания картин: математика и искусство вместе Блог тренера / 24.11.2016 Ставлю проблему: почему так одиноки и разобщены друг с другом два школьных учебных предмета , которым бы, по хорошему, нужно дружить и всячески друг друга поддерживать? Математика и информатика, а конкретнее, отдельный раздел программы по информатике, где изучаются основы программирования.Ну да, на словах-то мы знаем, что хорошего программиста без математической подготовки не бывает. На самом деле, нет таких связей ни при выстраивании программ двух предметов, ни в формулировках заданий и задач. Они идут параллельно, а хотелось бы побольше пересечений и даже переплетений. Покажу, как это можно делать на примере отдельных заданий в среде карандашного программирования (pencilcode). Делать, при помощи третьего - ART- компонента. Среди произведений современной живописи встречаются удивительно удачные объекты, удачные с точки зрения их свойств - симметрии, наличия повторяющихся элементов, возможностей работать с цветом, как с параметром."Создаем картину" на основе картины художника-абстракциониста с помощью "пятен" и "квадратиков". Уже после первого занятия по карандашному программированию, зная всего несколько команд: основные команды рисования (dot, box) и основные команды движения (fw, bk, rt, lt), можно воссоздать картины, состоящие из простых форм - кругов и квадратов.Вот примеры работ учеников, созданные после 1-го занятия:Работа1Работа2Работа3: Фрэнк СтеллаРабота4: Эльсуорт КеллиРабота5: Эльсуорт Келли (использованы абсолютные координаты)Все - в Малевичи! Все - в Мондрианы! Геометрические фигуры в pencilcodeКто бы что ни говорил, но дети, "кодирующие" Малевича после второго занятия карандашным программированием, начинают и про геометрические фигуры лучше понимать, и про координаты, и... про искусство. А как приятно-то работы cмотреть! Круче, чем в музее! Теперь подробнее...Уже на втором уроке, когда мы познакомились с инструментом перо и заливка (pen и fill), можно поставить перед учениками задачу выбора какой-то из супрематических композиций Малевича и воссоздания ее средствами pencilcode.На уроке ученики получают задание-упражнение: нарисовать с помощью черепашки следующие геометрические фигуры: круг, полукруг, квадрат, прямоугольник, ромб, треугольник. Сюда могут быть также добавлены параллелограмм и трапеция.Проблема начинается с рисования ромба, собственно, она в этом и состоит, что ученики пытаются ромб именно нарисовать, а не построить. Ромб разъезжается - углы не те. Приходится вспомнить свойства углов и диагоналей ромба. Но результат - самостоятельно выбранная и воспроизведенная с помощью кода картина - очень радует!Получается такой проект Геометрические фигурыА вот готовые работы 9-классников Малевич 1Малевич 2Малевич 3Малевич 4МондрианДля того, чтобы не ограничивать учеников в выборе инструментов, можно поставить задачу в более свободной формулировке. В PencilCode можно работать в двух системах координат - абсолютной (декартовой) и относительной - "черепашьей", когда все движения и перемещения совершаются относительно черепашки. 1 вариант: использовать черепашью графику, относительную система координат (рисование пером, команды движения, поворота и использование заливки): fw, bk, rt, lt, fill 2 вариант: используется абсолютная - декартова система координат, команды jumpto, moveto Работы учителей-участников дистанционной мастерской:Малевич Автор Васильева Евгения Владимировна (здесь использована черепашья система координат)Малевич Автор Девятова Анастасия Юрьевна (здесь использована и черепашья система координат, и декартова)Малевич/ Крестьянин Автор Горнбергер Ирина РинатовнаКандинский Автор Горнбергер Ирина Ринатовна (в этих работах использована, в основном, не черепашья, относительная система координат, а абсолютная - декартова.Рисуем ВазарелиЕще один из таких объектов - картина Виктора Вазарели/Задача состоит в том, чтобы воспроизвести ее с помощью тех инструментов - команд, которые есть у черепашки.Изначально можно выбрать две разных стратегии ее рисования: первая - только с помощью черепашьих шагов и поворотов, вторая - с использованием координатной сетки и команды jumpto (x, y)Примечание: для облегчения решения вначале не будем вообще думать о цвете (их подбором займемся потом, когда справимся с рисованием и повторением форм).Вся картина представляет собой набор из 16 таких объектов, каждый из которых состоит из большого квадрата (возьмем его сторону равной 100) и либо повернутого на 45 градусов малого квадрата, либо малого круга. Объект квадрат черепашка рисует с помощью команды box, а объект круг - с помощью dot. Для продолжения рисования первого ряда, нам нужно определить координаты каждой пары объектов (в первом ряду это большой и малый квадрат внутри). Объекты в каждом новом столбце отличаются лишь по координате X (она увеличивается на 100 единиц для каждого столбца). Координата Y при этом остается неизменной. Если внимательно рассматривать картину, то можно заметить, что формы фигур четвертого ряда копируют первый, а формы фигур третьего ряда копируют второй ряд. Это позволит скопировать код для рисования первого ряда, нужно будет лишь поменять координату по Y. Аналогично сделаем с кодом для четвертого (скопируем третий, не забыв уменьшить координату по y на 100 единиц.Когда с формой будет покончено, можно будет поменять цвета, подобрав их из этой таблицы цветов.Результат получится такой:Вазарели. Квадраты и круги. Автор Валерия Ланд. Первая стратегия.Вазарели. Квадраты и круги 2. Автор Анна Осипенко. Первая стратегия.Вазарели. Квадраты и круги 2 Автор Наталья Эрте. Вторая стратегия.Рисуем МондрианаПоскольку картин с квадратными формами и прямыми линиями у Пита Мондриана немало, среди них всегда найдется такая, которую было бы удобно воспроизводить, обладая даже малым набором инструментов.Теперь, когда мы научились задавать случайные координаты на холсте, мы можем использовать инструмент box и задать для него три любимых цвета Мондриана: красный, желтый, синий. Ну и добавить черные полоски: вертикальные и горизонтальные.Мондриан: квадраты и полосыПосты по теме Доступны по мере публикации:Карандашное программирование. НачалоКарандашное программирование: чужой код для решения своей задачи...Карандашное программирование: циклыГеометрия и карандашное программированиеКарандашное программирование: холст как координатная плоскостьКарандашное программирование: рисуем пейзажи масштабированиемКарандашное программирование: четыре черепашки и симметричный дизайнКарандашное программирование: несколько черепашек и поворотная симметрияКарандашное программирование: черепашка рисует паркеты и мозаикиКарандашное программирование: черепашка и оптические иллюзииО творческих домашних заданиях, или Могут ли все ученики быть успешными?Программирование для воссоздания картин: математика и искусство вместеВ начале была цифра?Пляшущие черепашкиИскусство создания снежинки, или Как скоротать зиму...Карандашное программирование: паркеты и жывёлыКарандашное программирование: рекурсияЁлка в коде. МКЁлка в коде. Этап 2. Шарики цветныеСвязанные проектыКакая математика бывает на картинах?Математика и искусство — переплетение возможно!Математика в стиле "мондриан" и "клее"Математика и абстрактное искусство в STREAM-проектеИдеи в духе STEAM: геометрический конструктор на основе рисунков GoogleИдеи в духе STEAM: PicassoHead как конструкторПостер как форма упаковки информации в STREAM-проекте: Колдер и ВазарелиSTEAM-проект: генератор Кандинского и другие интерактивные апплеты в GeoGebraSTEAM-проект: черный квадрат Малевича в Desmos и GeoGebraSTEAM-проект: треугольник в GeoGebra, как получить картину?STEAM-проект: мозаики Эшера в GeoGebraSTEAM-проект: задачи на картинахМК "Другая математика с Desmos": измени апплет и научись!Цифровые артефакты для организации учебной деятельностиАРТ-математика: воплощаются ли идеи?По следам мастер-класса АРТ-математика: идеи и воплощенияБогатая математика - бедная математикаРисуем мандалы в GeoGebra, или Чудо поворотной симметрииУрок виртуальной кройки: клетка, полоска, узор...Геометрия лоскутного одеяла: новые идеи...Спирали и спирографы: джазовые импровизации в GeoGebraКривые Безье и воспроизведение картин оп-арта в GeoGebraЧто общего между снежинкой и оп-артом?"Случайная" красота в GeoGebraС тегом Art в GeoGebraНациональный узор и математикаПрекрасная геометрия на бумаге и не только...Cмотри в зеркало, или Задачи на осевую симметрию в GeogebraКонструкторы узоров для текстиля. Часть первая: рисунки Сони Делоне"Угадать" ситчик! Ткани Варвары Степановой и Любови ПоповойВесенняя тема: создаем банданы и образцы ткани с "огурцами"Бумага и цифра вместе...Математика и искусство — переплетение возможно!АРТ-математика: воплощаются ли идеи?Ловим рыбку в море, или Игры, пазлы, мультики в GeoGebraСуха теория, мой друг, а древо жизни вечно зеленеет...Русский авангард и другие художники в DesmosКак привести солнце в движение, или Послесловие к виртуальной выставке"Полярные" витражи, или Крути калейдоскоп в Desmos! STEAM pencilcode блочное программирование искусство математика программирование проект