Инструменты для создания виртуального музея: часть третья - фото в 3D
Помимо панорам и виртуальных туров, задалась я вопросом, можно ли нам как-то для музейного комплекса в университете найти решение и сделать самим представление крутящейся 3d-фотки при описании какого бы то ни было экспоната. Как делают это в интернет-магазинах - просмотр фото с возможностью вращения на 360 градусов.
Спасибо всем авторам, кто не боится приоткрывать завесу в свою мастерскую - очень интересно было узнать о синхронизации камер с поворотными столами и автоматической "заливкой" фоток не на карту памяти фотоаппарата, а в комп:
Съёмку можно вести на поворотных столах как с автовращением (настраивается и синхронизируется с камерой), так и на столике с вращением вручную по заданному промежутку (в градусах) - через каждые 10-15-30 и далее градусов. Великое множество поворотных столов на AddSpace.ru и недорогие - стоимостью 7500 рублей на конец декабря 2015 года. Если возникнет необходимость нам фотографировать такие вещи - купим обязательно. Кстати, на автоматическом поворотном столе можно снимать видео - это для особо ленивых, кто не хочет заморачиваться с фотографированием и описанием :-)
А далее речь пойдёт о самом интересном. Отснять нужное число кадров - половина дела. Надо ещё эти фотки как-то заставить крутиться. Для этого есть великое множество скриптов для 3d-вращения, замечательное описание которых и к которым я нашла на странице 360-pro.ru. Здесь перечислялись скрипты: SpriteSpin, reel, 360 javascript viewer, jQuery.Threesixty, Ajax-Zoom 360°/3D, Dopeless Rotate. Я остановлюсь на двух самых простых, которые мне понравились.
Ajax-Zoom 360°/3D
Хотелось мне испытать работу этого скрипта в Битриксе, но... требуется ему ionCube Loader - шифровальщик php-файлов, полностью бесплатный (дополнительно про установку модуля можно прочитать на хабре):
Некоторые хостеры предоставляют уже установленный шифровальщик, как например www.hostland.ru - я на тестовом получила предустановленное решение:
Дальше загружаю на сервер папки со скриптами Ajax-Zoom'a (скачать можно с оф.сервера):
{C}
Примеры лежат в папке examples (предварительный просмотр доступен по ссылке с примерами):
Получаем полностью рабочее и бесплатное (для некоммерческих проектов) решение, которое "светит" своё сообщение в углу окна просмотра:
Решение полностью адаптивно, подгоняет размеры под ширину экрана на любом устройстве:
Вы заметили, что в двух последних скриншотах у меня светится ошибка - это из-за ограничений на размер фотографии - бесплатно можно загрузить фотку не более 3 Мегапикселей:
Лезу читать лицензию - найденная и используемая в данном примере лицензия Light - это 500 фотографий по 3.2Мп и со вставкой лого:
Однако, возник вопрос (а вместе с ним и надежда) - что, если 500 - это не число фотографий, а 500 объектов в 3D-модели? Бггг, наивная! Пишу в техническую поддержку, а вдруг повезёт. И ответ:
А это означает, что если на поворотом столике с фотографированием кадра через каждые 10 градусов мне понадобится 36 кадров.
500 : 36 = 13 объектов в 3D.
Было очень жаль. Но есть вариант - уменьшать угол поворота при фотографировании. Так, если при повороте на угол в 15 градусов мне надо будет сделать 24 кадра - получится 20 объектов в 3D, а при повороте на 20 градусов - уже 18 кадров, но с заметным "дёрганьем" объекта при повороте и 27 объектов в 3D... В общем, для представления запасов камней-экспонатов минералогического музея явно недостаточно мощностей данного ресурса для бесплатного использвоания :-) А сам скрипт великолепен и хорош. Взяла на заметку, а далее вопрос важности, необходимости и нужности будет решаться на уровне руководства - что и для каких нужд надо и в какие сроки.
360 javascript viewer
Это полностью бесплатный и не накладывающий ограничений ни на размер файлов, ни на количество штук кадров, ни на пиксели. Единственное условие - при вращении фотки появляется лого (фото каменного кеда взято с сайта про скрипт Jquery.Threesixty):
Конечно, за 19$ можно купить платную версию, а базовые бесплатные настройки доступны на сайте скрипта. Кроме того, много примеров с описанием (всё на аглицком). Главная строка в скрипте - total_frames -указывает ваше число промежуточных кадров для создания 3D-объекта. Можно размещать на странице несколько таких объектов, но для этого не забывайте менять айдишники у image_holder_x и product_image_x, прописывая последний в объявлении target_id:'image_holder_x'. Вот, собственно, и всё!
Да, почему именно о двух вот этих скриптах я написала? Потому что именно их проще всего внедрить в компоненты битрикс, это может сделать даже верстальщик, без участия мега-супер-программиста. ВременнЫе затраты составят максимум 1 рабочий день. Удачных работ, внедрений и съёмок!