АННОТАЦИЯ 2
ВВЕДЕНИЕ 4
1 ПОСТАНОВКА ЗАДАЧИ 6
1.1 Описание предметной области 6
1.2 Определение целевой аудитории 7
1.3 Анализ потребностей пользователей 7
1.4 Обзор аналогов 7
1.4.1 Verge3D 8
1.4.2 Blend4web 10
1.5 Необходимые функции и другие требования к приложению 13
1.6 Выводы 16
2 РАЗРАБОТКА ПРИЛОЖЕНИЯ 17
2.1 Математическая модель 17
2.2 Обзор средств реализации 23
2.2.1 WebGL 23
2.2.2 Three.js 27
2.2.3 Vue.js 29
2.2.4 Koa.js 30
2.2.5 Axios.js 31
2.2.6 MongoDB 33
2.3 Разработка диаграммы компонентов приложения 34
2.4 Разработка структуры базы данных 36
2.5 Разработка алгоритма загрузки конфигураций товара 40
2.6 Выводы 41
3 ПРОВЕРКА РАБОТОСПОСОБНОСТИ 43
3.1 Тестирование функционала 43
3.2 Выводы 47
ЗАКЛЮЧЕНИЕ 48
БИБЛИОГРАФИЧЕСКИЙ СПИСОК 49
ПРИЛОЖЕНИЕ 1 Код программы 51
В современном обществе все больше и больше людей используют гаджеты для удовлетворения своих потребностей, заказывают продукты питания через интернет, одежду, технику, записываются к врачам. С развитием технологий разработчики стараются автоматизировать как можно большее количество процессов, раньше чтобы купить какой-то товар покупателю приходилось идти в ближайший магазин, искать нужный товар, если нужного товара не оказывалось идти в другой магазин и так далее. Для удобства пользователей каждый год открывается все больше и больше интернет магазинов, где покупатель может посмотреть товар, ознакомиться с характеристиками, почитать отзывы и заказать его. Раньше, чтобы представить свой товар на сайте, компании делали высококачественные фотографии, но технологии использования графики в интернете не стоят на месте, на смену двухмерной, плоской графики, приходит 3D графика. С одной стороны, трехмерное представление гораздо привлекательнее демонстрирует товар, с другой стороны это требует достаточно серьезных технических мощностей со стороны пользовательских устройств. Однако, даже дешевые мобильные устройства и офисные компьютеры уже позволяют просматривать SD-графику на сайте, пусть и со средним визуальным качеством. У пользователей появляются новые возможности взаимодействия с товаром, такие как: просмотр с разных ракурсов, приближение, возможность изменить внешний и конфигурации.
Благодаря развитию интернет браузеров, электронных устройств и увеличению скорости интернета использование 3D графики становится все более актуальным. Подавляющее большинство современных браузеров имеет возможность взаимодействовать с трехмерной графикой с помощью WebGL.
WebGL (Web Graphics Library) - графическая библиотека, используемая в веб-приложениях, одна из современных браузерных технологий, позволяющая создавать трехмерные графические веб-приложения.
WebGL используется как элемент разметки страницы и поэтому является полноценной частью объектной модели документа. Все ведущие разработчики браузеров, такие как: Google (Chrome), Opera (Opera), Mozilla (Firefox), и Apple (Safari), являются членами команды разработчиков WebGL и реализуют данный элемент в своих браузерах [1-3].
3D графика в интернете, используется:
• при разработке игр;
• в медицине;
• в проектировании;
• в презентации товара на сайте.
В данной выпускной квалификационной работе был разработан 3D конфигуратор для интернет-магазина мебели, с целью автоматизации выбора оптимальной конфигурации товара.
Проведен анализ потребностей пользователей, рассмотрены альтернативные решения, и на основе этого определены необходимые функции и другие требования к системе.
Сформулирована и описана математическая модель для задачи раскроя. Разработан собственный конфигуратор на языке программирования JavaScript, с использованием графической библиотеки для 3D моделирова¬ния - WebGL. Была спроектирована архитектура приложения, создана база данных, Разработана клиентская часть на Vue.js, серверная на Koa.js и реализована работа с 3D графикой с помощью Three.js. Результатом работы является программное решение, реализующее 3D конфигуратор для интернет-магазина мебели.
На заключительном этапе разработки была проведена проверка работоспособности функционала и корректности обработки ошибок.
В дальнейшем планируется улучшить графический вид приложения, улучшить отображение 3D графики в интернете.
