Диспетчер приложений Вердж3Д
Диспетчер приложений предназначен для создания и выполнения различных операций с приложениями «Вердж3Д».
Содержание
- Запуск диспетчера приложений
- Первый запуск
- Страница приложений
- Создание приложения
- Импорт приложений
- Работа с приложениями
- Шаблоны
- Управление удалённой директорией «Вердж3Д Нетворк»
- Настройки диспетчера приложений
- Управление лицензией
Запуск диспетчера приложений
Диспетчер приложений — это классический сайт, отображаемый локальным веб-сервером, наподобие панели настроек вайфай-роутера.

По умолчанию страницы диспетчера отображаются по следующим адресам:
- localhost:8668 — «Вердж3Д» для «Блендера»
- localhost:8669 — «Вердж3Д» для «3дс Макса»
- localhost:8670 — «Вердж3Д» для «Майи»
которые можно открывать каждый раз, держать уже открытыми, либо добавить в закладки. Сам сервер запускается несколькими способами (см. ниже).
Вариант 1. Прямой доступ из «Блендера», «3дс Макса» или «Майи»
При старте вашего 3Д-редактора происходит автоматический запуск локального веб-сервера (предполагается что плагин «Вердж3Д» установлен). Щелкните по кнопке App Manager в «Блендере»:

или выберите соответствующий пункт меню в «3дс Максе» и «Майе:


чтобы диспетчер приложений в веб-браузере по умолчанию.
В случае неработоспособности веб-сервера (такое может случится, например, если вы обновите «Вердж3Д» на новую версию) данная функция его перезагрузит.
Вариант 2. Использование десктопного приложения
Локальный веб-сервер можно запустить без «Блендера», «3дс Макса» или «Майи». Просто щелкните значок на рабочем столе, созданный установщиком «Вердж3Д» (работает только в ОС «Виндоус»). Страница диспетчера приложений откроется в веб-браузере.

Если веб-сервер уже запущен (например из 3Д-редактора), данное приложение просто откроет диспетчер приложений в браузере.
Вариант 3. Запуск из командной строки
Установите интерпретатор языка программирования «Питон» версии 3, например из «Майкрософт Стор». Затем запустите интерпретатор командной строки и введите:
cd verge3d_blender
(укажите корректный путь к директории, где установлен «Вердж3Д»). Для «Блендер»-версии введите:
python manager\server.py BLENDER
для «3дс Макса»:
python manager\server.py MAX
для «Майи»:
python manager\server.py MAYA
Откройте веб-браузер и перейдите по адресу localhost:8668, localhost:8669, localhost:8670. Пользователи «Мак ОС» или «Линукс» могут использовать те же команды, заменяя обратный слэш (\) прямым (/).
Первый запуск
Если «Вердж3Д» был установлен впервые или был обновлён на новую версию, при первом запуске диспетчера приложений вы увидите экран приветствия:

На этом экране вам будет предложено выбрать директорию, в которой будут храниться ваши проекты. По умолчанию все приложения сохраняются в папке Документы. Также на экране приветствия вы можете выбрать светлую (Light) или тёмную (Dark) тему оформления.
Страница приложений
Список на главной странице
После запуска или обновления главной страницы, диспетчер приложений сканирует директорию приложений и отображает все найденные проекты в виде списка.
Для каждого приложения из списка диспетчер приложений показывает все HTML (.html) и glTF (.gltf/.glb) файлы, а также проекты 3Д-редакторов. Эти файлы можно просмотреть, щелкнув по нужной иконке.

Если приложение содержит большое количество файлов, то они скрываются для удобства просмотра. Щелкните по иконке треугольника, рядом с названием приложения, и вы получите полный доступ.

Используйте строку поиска для фильтрации приложений.

Страница приложения
Кликните по названию приложения, чтобы перейти на его страницу.

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

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

Магазин ассетов доступен по кнопке Корзина:

Создание приложения
Новое приложение создается с помощью кнопки на левой панели.

Введите имя для нового приложения и выберите шаблон:

По умолчанию предлагается 4 варианта шаблонов (новые могут быть добавлены самостоятельно в настройках).
- Standard Light
- Светлая тема приложения, загружает серебряный куб. Сцена включает в себя орбитальную камеру, источник света и освещение на основе HDR-карты.
- Standard Dark
- Тёмная тема приложения, загружает золотой куб. Сцена включает в себя орбитальную камеру, источник света и освещение на основе HDR-карты.
- Blank Scene
- Пустая сцена без моделей. Тем не менее, сцена предоставляет готовое освещение на основе HDR-карты
- Code-Based
- Примитивная сцена с кубом для «Ява Скрипт»-программистов. Поддержка пазлов должна быть добавлена вручную.
Вы также можете добавить (или отключить) модули приложения:
- Font Converter
- Преобразователь шрифтов Truetype (opentype.js). Используется для загрузки и отображения динамического текста.
- Texture Decompressor
- Текстурный декомпрессор (basis_transcoder.js и basis_transcoder.wasm). Загружает сжатые текстуры в формате KTX.
- Physics
- Физический движок (ammo.wasm.js и ammo.wasm.wasm). Лежит в основе физических пазлов.
После создания приложения вам будет показан диалог со ссылкой (вы также можете перейти по ней или просто закрыть данное диалоговое окно).

Созданное приложение появится в общем списке.
Импорт приложений
Экспортированные «ЗИП»-файлы могут быть добавлены вновь (импортированы) в диспетчер приложений с помощью операции перетаскивания:

После добавления приложения вам будет показан диалог со ссылкой (вы также можете перейти по ней или просто закрыть данное диалоговое окно).

Добавленное приложение появится в общем списке.
Работа с приложениями
Редактор пазлов
Вы можете начать работу с пазлами, нажав соответствующую кнопку справа от имени приложения в главном окне:

...или на панели справа в окне приложения:

Информацию по работе с пазлами ищите здесь.
Открытие папки
Для открытии папки приложения, щелкните по этой кнопке:

... или же используйте ее дубликат на панели справа в окне приложения.

Эта операция вызовет файловый менеджер, который установлен в системе по умолчанию (для «Виндоус» — классический проводник).
Настройки приложений
Вы можете открыть диалог с настройками приложения Application Settings с помощью кнопки на панели справа, находясь в окне приложения:

Используя эти настройки вы можете определить как будет выглядеть ваше приложение в браузерах, поисковых системах или социальных сетях:
Имеются следующие настройки:
Вкладка General (Общие настройки)

- Title
- Заголовок приложения, отображаемый в браузере и поисковых системах.
- Description
- Описание приложения, отображаемое в поисковых системах.
- Favicon 16x16, 32x32, 48x48
- Базовые иконки приложения (называются favicons), показываемые при запуске приложения в браузерах на десктопах. Также используется для отображения ссылок в поисковых системах. Иконки должны использовать формат PNG и иметь правильные разрешения.
- Safari 180x180
- Иконка, отображаемая в браузере «Сафари» на «Айфонах» и «Айпадах».
- Chrome 192x192, 512x512
- Иконка, отображаемая в браузере «Хром» на устройствах с «Андроид». Также используются для иконок запуска прогрессивных веб-приложений (PWA).
Вкладка Preloader (Прелоадер)

- Image
- Картинка прелоадера. Для лучшего результата используйте квадратное изображение в формате PNG, JPEG, WebP, или SVG.
- Image Size
- Ширина и высота картинки прелоадера.
- Bar Color
- Цвет, градиент (2 цвета), либо произвольный CSS-стиль полосы загрузки прелоадера.
- Bar Border Color
- Цвет рамки полосы загрузки.
- Bar Height
- Высота полосы загрузки. Не включает размер рамки, ширина которой равна 1 пикселю.
- Background Color
- Цвет фона экрана прелоадера.
- Shadow
- Только для тёмных тем приложения. Цвет и ширина свечения вокруг картинки прелоадера и полосы загрузки.
Вкладка UI (Интерфейс)

- Fullscreen Open
- Кнопка для переключения в полноэкранный режим. Для лучшего результата используйте квадратное изображение в формате PNG, JPEG, WebP, или SVG.
- Fullscreen Close
- Кнопка для возврата из полноэкранного режима. Для лучшего результата используйте квадратное изображение в формате PNG, JPEG, WebP, или SVG.
- Move Forward
- Кнопка отображаемая на мобильных устройствах для перемещения в режиме камеры от первого лица.
Вкладка Annotations (Аннотации)

- Marker Colors
- Цвет текста, фона и рамки аннотаций.
- Marker Size
- Размер аннотаций в пикселях.
- Dialog Colors
- Цвет текста, фона и рамки всплывающего диалога аннотаций.
Вкладка Sharing (Публикация)

- Open Graph Title
- Заголовок, отображаемый при публикации ссылки на приложение в большинстве социальных сетей, таких как «Вконтакте», «Фейсбук», «Реддит», «Линкедин» и др.
- Open Graph Description
- Описание, отображаемое при публикации ссылки на приложение в большинстве социальных сетей, таких как «Вконтакте», «Фейсбук», «Реддит», «Линкедин» и др.
- Open Graph Image
- Изображение, отображаемое при публикации ссылки на приложение в большинстве социальных сетей, таких как «Вконтакте», «Фейсбук», «Реддит», «Линкедин» и др. Рекомендуемый размер этого изображения — 1200x630.
- X/Twitter Title
- Заголовок, отображаемый при публикации ссылки на приложение в сети «X» («Твиттер»).
- X/Twitter Description
- Описание, отображаемое при публикации ссылки на приложение в сети «X» («Твиттер»).
- X/Twitter Image
- Изображение, отображаемое при публикации ссылки на приложение в сети «X» («Твиттер»). Рекомендуемый размер этого изображения — 1200x630.
Вкладка Errors (Ошибки)

- WebGL Error Message
- Текст ошибки, отображаемый приложением, в случае если технология WebGL не поддерживается браузером. Поддерживается простой текст и HTML-разметка.
- WebGL Error Image
- Изображение, отображаемое сверху сообщения об ошибке WebGL.
Вкладка PWA (Прогрессивные приложения)
Используется для настройки поведения прогрессивного веб-приложения.

- Progressive Web App
- Сделать приложение прогрессивным (PWA). Это означает, что приложение может быть установлено в систему и запущено с помощью иконки на рабочем столе (из панели инструментов, либо через меню «Пуск») на десктопах, либо с помощью иконки на главном экране на мобильных устройствах.
- Web App Name
- Имя для прогрессивного веб-приложения. Это имя будет отображаться в момент установки приложения и использоваться для иконки запуска. Если установлено пустое имя, приложение перестаёт быть прогрессивным.
- Offline Mode
- Позволяет приложению работать без подключения к интернету (например, в «самолётном» режиме). Режим без подключения реализуется с помощью специального скрипта, называемого сервис воркер (v3d_pwa_cache.js), который автоматически создаётся и помещается в папку приложения. Этот скрипт отвечает за создание и поддержку постоянного хранилища ресурсов приложения. Настройка Offline Mode может работать независимо от того, является или нет приложение прогрессивным (PWA).
- Refresh Cache
- Как только вы включите возможность работы без подключения к интернету, приложение заполнит постоянное хранилище ресурсов при первом запуске и будет использовать его для всех последующих запусков. Таким образом, вам нужно будет вручную обновлять это хранилище при помощи предложенной кнопки каждый раз, когда вы делаете изменение в приложении (экспортируете или сохраняете пазлы).
Публикация
Вы можете опубликовать приложение, щелкнув по соответствующей кнопке в главном окне:

...или по ее аналогу на правой панели в окне приложения.

Начнется загрузка приложения в «Вердж3Д Нетворк» (при необходимости операцию можно отменить), после чего приложение станет доступно в сети.

Если загрузка файлов прекратилась с выводом сообщения «The difference between your local system time and the server time is too large», то установите корректное время на своем компьютере и попробуйте снова.
После завершения загрузки будет показано окно со ссылкой на приложение, а также код для встраивания в уже имеющиеся страницы.

Вы также можете использовать кнопки социальных сетей и генератор QR-кода.

Загруженные файлы можно просмотреть или удалить на странице Network Directory.
Экспорт приложений
Вы можете сохранить любое приложение в виде «ЗИП»-архива, используя кнопку на правой панели на странице приложения:

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

Если вы выберете опцию загрузки архива в «Вердж3Д Нетворк», то после завершения загрузки откроется окно со ссылкой на «ЗИП»-архив.

Если загрузка файлов прекратилась с выводом сообщения «The difference between your local system time and the server time is too large», то установите корректное время на своем компьютере и попробуйте снова.
Загруженные файлы также могут быть просмотрены и удалены в соответствующем окне.
Создание десктопных и мобильных приложений
Диспетчер приложений включает в себя инструмент для конвертации «Вердж3Д»-проектов в десктопные и мобильные приложения. Для запуска конвертера нажмите на кнопку с соответствующим значком на правой панели экране приложения:

Читайте подробности в разделах документации, посвящённым созданию: десктопных и мобильных приложений.
Создание обучающих приложений
С помощью «Вердж3Д» вы можете упаковывать ваши 3Д-приложения в обучающие пакеты, совместимые со стандартом SCORM версии 1.2. Используйте кнопку с соответствующим значком, расположенную на правой панели окна приложения:

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

... или по аналогичной на странице приложения:

Приложение будет удалено в корзину с возможностью его последующего восстановления.
Обновление
Если приложение использует старую версию «Вердж3Д», то станет доступна специальная кнопка для обновления:

Аналогичная кнопка также появится на странице приложения:

Больше информации по обновлению вы найдете здесь.
Шаблоны
Что такое шаблон
В диспетчере приложений вы можете выбрать шаблон, на основе которого будет создано новое приложение. По умолчанию поддерживаются 4 шаблона: "Standard Light", "Standard Dark", "Blank Scene" и "Code-Based".

Исходники этих шаблонов находятся в папке templates, например для «Блендера» это будет "verge3d_blender\manager\templates". Вы можете модифицировать встроенные шаблоны либо создать свои собственные.
В папке шаблонов имеется скрытый шаблон "Embeddable". Он используется для создания React.js и Vue.js-приложений.
Существует несколько способов модификации и создания шаблонов приложений. Вы можете поменять вёрстку приложений отредактировав HTML/CSS файлы, встроить новый «Ява Скрипт»-код или библиотеку, заменить интерфейс или прелоадер, либо создать логику на пазлах, которая будет включаться во все новые приложения.
Создание шаблонов
Для того чтобы создать новый шаблон, нажмите кнопку Settings на левой панели, затем выберите вкладку Templates:

На появившейся панели нажмите + и выберите имя нового шаблона (например "My Template"), затем нажмите Apply:

В результате при создании нового приложения вы сможете выбрать добавленный шаблон из списка:

По умолчанию шаблон будет создавать пустое приложение, поскольку в нём отсутствуют файлы. Самый простой способ создания рабочего шаблона — взять за основу существующий (например "Standard Dark") и переименовать его назвав именем нового шаблона (то есть "My Template").
Управление удалённой директорией «Вердж3Д Нетворк»
Кликнув на кнопке с облаком на левой панели вы получите доступ к удалённой директории «Вердж3Д Нетворк»:

В ней находится список файлов, директорий и архивов, загруженных в «Вердж3Д Нетворк» ранее:

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

Сами настройки выглядят так:
Вкладка General

- Applications Folder
- Абсолютный путь (например C:\Users\Alex\my_verge) к директории проектов.
- Notify about Verge3D updates
- Показывать уведомление о выходе новых версий «Вердж3Д» (активировано по умолчанию).
- Add source files (models, puzzles, backups, etc.) to exported ZIP
- По умолчанию функция экспорта сохраняет в «ЗИП»-архивы исходные файлы приложения. Сюда входят: .blend, .max, .ma/.mb, visual_logic.xml, а также содержимое папки v3d_app_data. Если галочка снята, исходные файлы не будут добавлены в архив.
- Enable external server interface
- Использовать адрес компьютера в локальной сети вместо localhost. Смотрите здесь чтобы узнать как определяется этот адрес «Виндоус», «Мак ОС», «Линукс». После установки вы сможете запускать диспетчер приложений из локальной сети, например с помощью адреса: 192.168.1.15:8668
Вкладка UI

- Select Theme
- Переключить тему диспетчера приложений и редактора пазлов: светлая (Light) или тёмная (Dark).
- User Manual URL
-
Устанавливает путь к документации «Вердж3Д». Устанавливать свой путь рекомендуется в следующих случаях:
- Чтобы заменить английскую документацию русской. Для этого поставьте путь https://www.soft8soft.com/docs/manual/ru/index.html.
- Чтобы читать локальную версию документации, например для «Блендера» http://localhost:8668/docs/manual/ru/index.html
- Читать документацию, предназначенную для одной из старый версий «Вердж3Д».
Данная Опция заменяет руководство в «Блендере», «3дс Максе», «Майе», диспетчере приложений и в пазлах.
Puzzles Tab

- Enable Performance Mode
- Включить серию оптимизаций прокрутки и масштабирования в редакторе пазлов. Поведение зависит от используемого браузера, в частности браузеры основанные на «Хромиуме» («Гугл Хром», «Майкрософт Эдж», «Брейв», итд...) получат максимальные оптимизации, тогда как «Файрфокс» и «Сафари» минимальные. Включение данной опции рекомендуется, если вы разрабатываете большие проекты с огромным числом пазлов.
Network Tab
Use these settings to configure Verge3D Network uploads.

- Verge3D Network cache age (minutes)
- Период обновления кеша «Вердж3Д Нетворк (в минутах). Установите в 0 (убирает кеш) чтобы обновлять данные мгновенно (полезно если вы находитесь в процессе разработки и отладки приложения).
- Use URL shortener for uploads
- Shorten the links to the apps uploaded to Verge3D network or generate direct (long) links. Using the direct links may be less convenient, but have the benefit of loading a bit faster. This also makes it impossible to guess about the URLs of other users' apps uploaded to Verge3D Network, which makes sense if privacy is a concern.
- Publish all app files (models, puzzles, backups, etc.)
- По умолчанию (галочка снята) функция публикации не загружает исходные файлы, которые не требуются для запуска приложения. Сюда входят: .blend, .max, .ma/.mb, visual_logic.xml, а также содержимое папки v3d_app_data. Если галочка установлена, исходные файлы также будут загружаться (может пригодиться для обмена данными с заказчиками и коллегами).
Вкладка Templates
Смотрите выше.
Управление лицензией
Кнопка с ключом позволяет активировать вашу копию «Вердж3Д», используя высланный на почту лицензионный ключ, либо посмотреть текущий статус лицензии. При первой установке «Вердж3Д» назначит статус лицензии trial («для ознакомления»), а на иконке с ключом появится маленькая красная точка:

Нажмите на кнопку Enter Key и скопируйте лицензионный ключ в поле ввода. Статус вашей копии изменится на active («активная»), а в окне лицензии появится дата окончания обслуживания «Вердж3Д»:

Как только период обслуживания закончится, вам будет предложено обновиться за 50% стоимости лицензии (на почту придёт соответствующее письмо). Этот льготный период длится 30 дней:

По окончании льготного периода ваша лицензия перейдёт в статус expired («просроченная»), а вам придётся покупать новую лицензию «Вердж3Д» за полную стоимость. Тем не менее, вы сохраняете возможность пользоваться старой версией «Вердж3Д» без каких-либо ограничений.

Если вы планируете использовать «Вердж3Д» в течение длительного времени, не забывайте своевременно обновляться. Периодически проверяйте электронную почту и следите за значком ключа. Отсутствие красной точки означает, что с лицензией всё в порядке:

Все еще есть вопросы?
Задавайте их на нашем форуме!