Ищу frontend-разработчика для выполнения настройки сайта на Tilda и запуска библиотеки krpano на нём. Забегая вперёд скажу, что глубоко внутрь самой библиотеки, как я вижу, погружаться не надо. Код для неё эффективно пишет chatGPT, поэтому с ней проблем возникнуть не должно. Документация библиотеки: https://krpano.com/docu/embedpano/#top. Основная сложность, как я её себе представляю - это использовать свистелки веб-разработки с этой библиотекой, например, красивое выделение элементов на изображениях.
Что конкретно необходимо сделать:
1. Есть сайт, работающий на Tilda. Сайт пустой. Нужно, чтобы на одной из страниц сайта запускалась панорама библиотеки krpano.
2. Сейчас панорама работает так (запускается на локальном сервере, не на сайте): - Отображается сцена №1; - Клик по точке перемещения открывает сцену №2; - На сцене №2 присутствует изображение дома. Дом имеет несколько этажей; - Клик по изображению дома открывает картинку с планом этажа.
Целевой результат выглядит так: - Отображается сцена №1; - Клик по точке перемещения открывает сцену №2; - На сцене №2 присутствует изображение дома. При открытии сцены с помощью анимации выделяем цветными прямоугольниками этажи дома, давая понять пользователю, что каждый отдельный этаж кликабельный. Анимация временная - как только показали пользователю кликабельность этажей, её выключаем; - Если навести курсор на такой прямоугольник, то он подсвечивается. Клик по прямоугольнику открывает картинку с планом этажа. Картину с планом можно закрыть кликом по крестику; - Квартиры на плане этажа также подсвечиваются временной анимацией как и этажи на доме, давая понять пользователю, что они кликабельны; - Если навести курсор на квартиру, то открывается небольшой поп-ап с с основными характеристиками квартиры. Внизу поп-апа кнопка, клик по которой открывает панораму квартиры; - Клик по кнопке панорамы квартиры открывает соответствующую панораму.
3. Чтобы пользователь знал в какой части панорамы находится, нужно отображать “хлебные крошки” вверху всех страниц. Т.е. там фиксируется в какие сцены проваливался пользователь. Если кликнуть по любой из “крошек”, то должна открыться соответствующая сцена.
4. Чтобы я мог разобраться в вашем коде, попрошу оставить как можно больше комментариев в нём что и как работает. В будущем хотел бы реализовывать описанный выше функционал самостоятельно.
5. Попрошу консультацию о том, как правильно и безопасно интегрировать получившиеся панорамы в другие сайты. Пока вижу два варианта: 1. отдельная страница с панорамами на сайте и 2. фрейм с панорамой, вставленный на уже существующую страницу сайта. Также хотелось бы понять ограничения производительности получившихся решений, максимальное количество сцен для быстрой работы сайта.
Для выполнения этой задачи с меня:
- доступы к Siteground и Tilda; - файлы двух панорам: - Сцена 1 → Сцена 2. На Сцене 2 изображение дома. При клике на дом открывается план этажа, этот план можно закрыть нажатием на крестик; - Панорама квартиры, состоящая из двух сцен.
