Как сделать такой сайт: материалы, скрипты, библиотеки?

Question

[Сергей Горячев]

Очередной любопытство :)
Как сделать такой сайт: материалы, скрипты, библиотеки?
Интересует магия с самим комплексом.
fest62.ru

Comments

[Ivanq]

А какие именно материалы, скрипты, библиотеки?

[Aleksandr]

интересует как картинки меняются или что?)

[Сергей Горячев]

Александр Котов: Как реализован 3д тур.

Answer 1

[Александр Павлюк]

Отрендерить в 3д редакторе пролет камеры вокруг комплекса в виде последовательности изображений высокого разрешения. Сконвертировать полученный материал в видео низкого разрешения через avconv, например (форматы h264 и webm) и в последовательность подготовленных для веба jpg. С помощью javascript обеспечить прелоад видеоролика и его прокрутку по drag'n'drop. При остановке прокрутки подменять видеоролик соответствующей jpg-шкой высокого разрешения.

Answer 2

[A K]

1. Вместо ста картинок лучше использовать видео (1080p60), зарендерить и с помощью html5 и скролла управлять проигрыванием видео.
2. Для планировок используйте svg
3. Список библиотек, плагинов:

Answer 3

[Максим Гречушников]

Залезь в код страницы и посмотри. 500 кадров. при захвате мышкой кадры заменяются.

Answer 4

[Виктор Королев]

Красиво, но не эффективно. Долго грузится. Реальное 3D было бы проще. Такое можно смастрячить для webgl с любым подходящим движком (blend4web, threejs etc).

Comments

[Сергей Горячев]

У webgl насколько я почитал поддержка браузерами никакая.

[Виктор Королев]

Это не совсем так. Практически все браузеры (firefox, chrome, opera, edge, маковский) прекрасно поддерживают webgl. Проблемы начинаются для мобильных браузеров, особенно у андроид (ниже версии 4.4) и windows phone. В данный момент поддержка webgl включена по умолчанию у всех современных браузеров. Что же касается производительности, то вот как пример, ссылка на сложное приложение (https://www.blend4web.com/apps/dairy_plant/dairy_p...