Визуальная среда создания и дизайна объектов OpenGL для обучения программированию в MS Visual Studio C++ "gamebase"
статья ( класс) на тему

Славнейшев Филипп Владимирович

Педагог дополнительного образования

ГБУ ДО ДДЮТ Красногвардейского района

Санкт-Петербурга «На Ленской»

Визуальная среда создания и дизайна объектов OpenGL для обучения программированию в MS Visual Studio C++ "gamebase"

Программирование – это отрасль, без которой невозможно создание и внедрение современных высоких технологий. Труд программиста востребован и в таких высокотехнологичных отраслях, как космическая, и таких бытовых, как, например, оптимизация работы почтовых отделений. Российская IT-отрасль уже многие годы испытывает сильную нехватку кадров. Обучение программированию в школьном возрасте знакомит учащихся с профессией, позволяет повысить их общий навык владения компьютером, дает наглядное практическое применение знаниям по математике и физике, позволяет развить у учащихся инженерное мышление.

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

Библиотеки OpenGL [3] и DirectX [1] позволяют создавать приложения с качественной графикой. Однако они весьма сложны в использовании, требуют глубоких знаний в программировании и линейной алгебре, т.е. из университетской программы. И даже для такого простого действия, как рисование прямоугольника на экране, могут потребоваться сотни строк кода. Обучение программированию на основе этих библиотек в их первозданном виде было бы слишком сложным, медленным и скучным для ребят.

Существуют многочисленные библиотеки, которые упрощают работу с OpenGL и DirectX, но даже они могут быть сложны для ребят. Составим список требований к библиотеке, которую можно было бы использовать при обучении школьников программированию, и сформулируем ряд рекомендаций для упрощения процесса обучения. Эти требования можно предъявлять как уже к существующим библиотекам, так и создаваемым самостоятельно.

Простые правила именования

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

Даже если учащиеся знают используемые слова, у них могут возникнуть проблемы с написанием, поэтому необходимо рассказать им о возможностях MS Visual Studio по автоматическому заполнению и подсказке текущих вариантов при помощи сочетания “Ctrl + Пробел”.

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

Проиллюстрируем эти рекомендации небольшим примером. Пусть в программе есть коллекция объектов, каждый из которых является изображением яблока. Эту коллекцию можно назвать, например, “apples”. Если при добавлении нового яблока в коллекцию приходится создавать временную переменную, то ее можно назвать просто “apple”. Также стоит назвать и элемент этой коллекции при работе с ней в цикле. Используя такую логику, учащимся будет легче придумывать названия для своих собственных переменных. Связь названий коллекции объектов и одного объекта не даст учащимся запутаться при работе с несколькими коллекциями различных объектов.

Оборачивание сложных конструкций

Библиотека должна «оборачивать» все слишком сложные моменты – линейную алгебру, работу с шейдерами, сложные алгоритмы. Например, при работе с OpenGL напрямую часто приходится задавать матрицы трансформации, отображающие точки из одной системы координат в другую. Матрица – это математический объект, с которым учащиеся познакомятся, скорее всего, только на первых курсах университетской программы. Конечно, можно попытаться рассказать им основы линейной алгебры, но это может оказаться слишком сложным для ребят материалом. Можно «скрыть» работу с матрицами внутри библиотеки, а снаружи сделать возможность настраивать намного более понятные школьникам свойства: вектор сдвига, угол поворота, коэффициенты растяжения.

В случае такого сложного языка как C++, у учащихся иногда могут возникнуть трудности с запоминанием синтаксиса. При работе с MS Visual Studio 2015 можно использовать новые возможности языка, которые значительно упрощают написание кода (например, лямбда-выражения, циклы “for” по коллекции [6]). Однако в MS Visual Studio 2010 этих элементов языка еще нет, поэтому часто приходится писать громоздкие и плохо запоминающиеся конструкции. Этого можно избежать, добавив специальные функции-помощники.

Лаконичность кода

Все кажущиеся простыми элементы должны реализовываться в 1-2 строчки кода. Например, то же рисование прямоугольника на экране – это простое действие, которое не должно затрачивать у учащихся особых усилий. Если добавление простого объекта на экран будет затрачивать множество усилий, это может вызвать, по меньшей мере, недоумение у учащихся. Им будет сложно воспроизвести эти действия в дальнейшем при самостоятельной работе. А ведь из таких простых элементов, в конечном счете, и состоит любая программа.

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

Элементы интерфейса

Помимо таких примитивов как изображения и текст, библиотека должна предоставлять возможность легко создавать элементы интерфейса пользователя – кнопки, текстовые поля ввода и т.п. Эти элементы можно видеть практически в любом приложении, имеющем графический интерфейс. Без элементов интерфейса, очевидно, сложно создать интерактивное приложение.

Даже имея возможность легко выводить текст на экран и рисовать другие примитивы, создать простейшее поле ввода – весьма нетривиальная задача. Конечно, можно предложить эту задачу как упражнение. Но если у учащегося будет возможность легко создать и настроить внешний вид поля ввода, которое будет обладать общепринятым функционалом (выделение текста, работа с буфером обмена и т.п.), то качество продукта будет выше, как и оценка продукта со стороны учащегося.

Визуальная среда дизайна

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

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

Программный пакет “gamebase”

Программный пакет “gamebase” разрабатывается, следуя именно этим пяти требованиям. Уже сейчас он позволяет достаточно легко создавать как серьезные приложения, в которых необходима компьютерная графика (например, визуализация физического маятника), так и простые компьютерные игры. На базе библиотеки разработан ряд приложений-примеров, каждое из которых можно написать с нуля вместе с ребятами всего за 2-4 занятия. При этом примеры разработаны так, что позволяют постепенно знакомить ребят с библиотекой, обучают их различным алгоритмам, затрагивают различные области знаний по физике и математике.

Программный пакет состоит из библиотеки, визуальной среды и набора batch-скриптов для установки и настройки пакета. Библиотека и визуальная среда написаны на C++, для работы с графикой используют OpenGL (для стабильной работы достаточно версии OpenGL 2.1 [3]), а также библиотеки freeglut [4] и GLEW (для настройки OpenGL и работы с клавиатурой и мышью). Библиотека рассчитана на использование в MS Visual Studio 2010. Для загрузки изображений используется библиотека ImageMagick [2], что позволяет работать практически с любым форматом изображений. Для вывода текста на экран используются атласы символов, построенные при помощи открытого программного обеспечения, что позволяет добавлять свои собственные шрифты. Разрабатываемый в визуальной среде дизайн сохраняется в формате JSON [7], что позволяет открыть и прочитать его в любом текстовом редакторе.

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

Программный пакет основан только на свободно распространяемом программном обеспечении и доступен для скачивания в сети «Интернет». Разработан ряд batch-скриптов для установки пакета, который позволяет достаточно легко построить и настроить пакет. Текущая версия имеет определенные системные требования: наличие MS Visual Studio 2010 в системе, версия операционной системы не ниже Windows 7.

Планы по дальнейшей разработке

Необходимо еще многое сделать для улучшения библиотеки. Пакет постоянно дорабатывается с учетом возможностей учащихся, но все еще необходимо дальнейшее упрощение интерфейса библиотеки и визуальной среды. Скорее всего, придется полностью отказаться от использования указателей («сырых» и «умных»), т.к. это приводит к серьезной путанице. Также необходимо добавление новых возможностей, оптимизация работы библиотеки, улучшение графической составляющей. Необходимо создать коллекцию различных изображений, которые можно было бы использовать как при разработке программ-примеров на занятиях, так и как основу для будущих проектов учащихся. Также возможно налаживание сотрудничества с кружками, занимающимися компьютерной графикой и дизайном.

Библиотека пока поддерживает только 2D-графику, поэтому необходимо добавить поддержку 3D-объектов. Это подразумевает не только возможность рисовать 3D объекты, но и загружать готовые 3D модели. Пока что нет поддержки звука и работы по сети, шрифтов формата TrueType. Для этого, скорее всего, придется перейти на более продвинутую, чем freeglut, библиотеку SDL [5] или какой-либо ее свободно распространяемый аналог.

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

Список литературы

1. DirectX 9 Graphics: The Definitive Guide to Direct3D. A. Thorn. Wordware Publishing, 2005.
2. The ImageMagick graphics library. A. Avasilcutei, C. Paslariu, L. Ungureanu, V. Mager. Information Technology Group, 2010.
3. The OpenGL Graphics System: A Specification (Version 2.1). M. Segal, K. Akeley. Silicon Graphics, 2006.
4. The OpenGL Utility Toolkit (GLUT) Programming Interface. M.J. Kilgard. Silicon Graphics, 1996.
5. Focus on SDL. E. Pazera. Premier Press, 2003.
6. ISO/IEC 14882:2011, Information technology – Programming languages – C++. ISO, 2011.
7. The JSON Data Interchange Format. Ecma International, 2013.