Что можно добавить в 3D тур для повышения информативности?
Каталог расширений и модификаций, которые я добавляю в 3D туры на движке KRPano. Каждая - с живым видео-примером из реальных проектов. Дизайн и элементы управления тоже перерабатываются, частично или целиком.
Содержание
- Главное меню управления
- Графические подсказки и их визуальное оформление
- Навигационные элементы и визуальное оформление
- Информационные подсказки
- Текстовые подсказки
- Подсказки с фотографиями
- Подсказки с видео
- Подсказки с аудио
- Подсказки с другими функциями
- Фирменный стиль и индивидуальный дизайн
Практически всегда располагается внизу экрана и опционально состоит из следующих элементов, каждый из которых можно убрать при необходимости:
- предыдущая панорама
- следующая панорама
- приблизить
- отдалить
- посмотреть вверх
- посмотреть вниз
- посмотреть влево
- посмотреть вправо
- свернуть превью панорам
- вернуться к первой панораме
- запустить/остановить автовращение
- открыть меню на весь экран
- свернуть меню
Подойдет любая картинка или иконка: возьмите стандартный вариант или предложите свой.
Обычно это пульсирующая кайма вокруг круглого элемента, анимация используется исключительно для привлечения внимания и отделения иконки от фона.
Это скорее декоративный элемент: превью слишком маленькое, чтобы на нем что-то разглядеть.
Обводка выделяет именно тот предмет, к которому относится подсказка. Чаще всего используется в промышленных проектах, на выставках и в музеях.
Усложненный вариант предыдущей подсказки. Иконка показывает, что объект кликабельный, и делает его заметнее - это особенно нужно, когда форма контура получается слишком простой.
Пример: выставочный стенд Мастерпроф
Такие элементы управления предназначены для перехода между соседними панорамами, либо для быстрого перехода между панорамами, расположенными дальше "одного шага".
Горизонтальная или вертикальная галерея-список с миниатюрами 3D панорам.
Пример: фотостудия Lion
Вертикальный структурированный выпадающий список 3D панорам и групп панорам (этажи зданий, разделы экспозиций и т.п.).
Пример: Шоу-рум бытовой техники компании ASKO
Стрелки или другие пульсирующие иконки. Нажали - перешли к ближайшей панораме 3D тура.
Пример: Академия фигурного катания "Ангелы Плющенко"
Переход осуществляется в соответствии с запрограммированным в тур порядком панорам.
Пример: Академия фигурного катания "Ангелы Плющенко"
Похоже на предыдущий вариант, но кнопка "назад" возвращает не по заложенному в тур порядку, а по истории ваших перемещений между панорамами - как кнопка "назад" в браузере.
Пример: Академия фигурного катания "Ангелы Плющенко"
В большие или сложные по структуре виртуальные туры я рекомендую добавлять карту или план локации. Пользователю гораздо проще ориентироваться по плану, чем переходить по стрелкам.
Пример: Шоу-рум бытовой техники компании ASKO
Логотип размещается в углу интерфейса или внизу - в надире панорамы, это точка прямо под камерой. Логотип можно сделать кликабельным: при клике откроется сайт заказчика, обычно контакты или страница о компании.
Тур с нужными модификациями под ключ - цены и примеры
Иконки, кнопки, виджеты (hotspots) - интерактивные элементы, которые расширяют информативность 3D тура.
На компьютере появляются при наведении курсора на иконку или клике по ней, на мобильном - по однократному тапу.
На компьютере текст появляется над курсором при наведении на интерактивный элемент. При просмотре на мобильных устройствах текст появляется над иконкой при однократном тапе по ней.
Открываются при клике/тапе по иконке.
Пример: выставочный стенд Станкомаш
Помимо текста во всплывающем окне также можно добавить кнопку, которой привязывается соответствующая подсказке ссылка на сайт.
Пример: шоурум Zeiss
Дополнительно к фотографии можно добавить заголовок и текстовое описание.
Дополнительно к каждой фотографии можно добавить отдельный заголовок и развернутое текстовое описание.
Пример: выставочный стенд Станкомаш
В тур можно встроить и видео: горящий камин, работающий телевизор, видео-пролет от метро до входа в заведение. Или анимацию движения предметов - раскладывание кровати-трансформера, открытие и закрытие шкафа и т.п.
В большинстве случаев видео предоставляется заказчиком, но вы можете заказать создание видео для подсказок под ключ (оплачивается дополнительно).
На компьютере такие подсказки активируются наведением курсора или кликом, на смартфоне и планшете - тапом.
При клике на иконку во всплывающем окне открывается видео с Youtube.
Пример: выставочный стенд Станкомаш
Вставка видео осуществляется напрямую в панораму (горящий камин, работающий телевизор и т.п.). В этом случае обратите внимание, что вставить можно только прямоугольное видео единым контуром.
Пример: Музей Спорта в Москве
Это может быть речь, музыкальное сопровождение или звуки приборов/оборудования. Исходное аудио почти всегда предоставляет заказчик, но можно дополнительно заказать озвучание вашего текста. Например, в проекте для StyleGarage для демонстрации улучшения шумоизоляции автомобиля звуковое оформление добавлено к панорамам, в которых поэтапно появляются слои шумоизоляционного материала.
Аудиозапись запускается при клике по соответствующей подсказке.
Аудиозапись запускается автоматически при начале просмотра и не прерывается при переходах между панорамами.
При переходе к другой панораме запускается соответствующая ей аудиозапись.
То же, что развернутая текстовая подсказка, только вместо текста при взаимодействии открывается нужная страница сайта в новой вкладке браузера.
В новой вкладке
Во всплывающем окне
В этом случае верстка сайта должна быть адаптивной, иначе часть сайта не поместится во всплывающее окно (как в примере ниже).
При клике на иконку на весь экран открывается так называемая "плоская панорама" - фотография в высоком разрешении с возможностью увеличения.
Пример: выставочный стенд Мастерпроф
Например, в 3D тур по квартире с черновой отделкой для большей информативности можно добавить разметку габаритов помещения.
Пример: демо-тур
Форма для сборки контактов, в которую пользователь вводит свое имя, телефон и/или адрес электронной почты для связи с ним.
Внутрь тура можно добавить галерею товаров, например мебели: клиент гораздо охотнее купит мебель, которую только что посмотрел в реализованном интерьере.
Минус - обособленность проекта. Поменялся ассортимент или цены - самостоятельно обновить каталог в туре не получится, придется оплачивать работу программиста.
Поэтому практически всегда проще поставить ссылку на нужный раздел сайта - без дублирования информации, усложнения и удорожания проекта.
Пример: Магазин автосканеров
Соберу тур с модификациями из ваших панорам
Почти все элементы стандартного дизайна - меню управления и интерактивные элементы - можно перекрасить в цвета вашего фирменного стиля. По вашему ТЗ можно пойти дальше: дизайнер отрисует полностью новое меню и другие элементы, а я встрою их в тур.
Примеры проектов с индивидуальным дизайном:
- Производство компании Русклимат
- Завод "Totachi"
- Спортивный комплекс Олимпийский"
- Офис компании "Валеант"
- Выставочный стенд компании "Русклимат"
Какие модификации нужны вашему туру? Подскажу по задаче
