Вопрос из области Веб программирования.
Компания занимается флагами и всем что с ними связанно. Для сайта нужна интерактивная иллюстрация (см картинку). Суть задачи, наглядно показать клиенту как примерно будет выглядеть его заказ, помочь определится с высотой флагштока и размером полотнища флага. И если с творческой частью задачи все более менее понятно, Выбрать сцену, отрисовать флагштоки, полотнища и т.д. то с технической точки зрения, на чем реализовать, как и как заставить работать?....В общем I need help.
Комментарии пользователей
С помощью JS. При выборе параметра JS меняет параметры CSS у DIV и производиться анимация. Это один из самых простых способов. но можно еще варинты Flash и т.д. сделать
на JS сколько займет времени написать такой скрипт?
Зависит от сложности. В среднем 1 день. Зависит что будет меняться. Можно просто менять изображение или меняться динамически блоки и тогда нужно 2 блока. 1 на мачту и 1 на полотнище.
Ну менятся будет в частности флагшток поскольку их 2 вида + 1 будет удлинятся 2 раза поскольку имеет 3 высоты(или большой флагшток порежется на 3 части) + 7 вариантов полотнищ. Фон и все остальное статично. Я заранее прошу прощения за свою тупизну в этом вопросе если что. Это сильно повлияет на объем?
4 действия на флагшток и 7 на полотнища. Вот я накидал примерный вариант работы. Посмотрите исходный код и думаю сразу разберетесь. Для продакшена конечно нужно писать лучше но для примера подходит http://happymalyar.com.ua/primer.html
Для JS программиста среднего уровня это будет простой задачей на пару часов работы.
в каком виде програмисту нужны исходники и есть ли какие то важные требования? в плане исполнения на сколько я понял из примера (igor спасибо) вектор имеет широкие возможности в области применения различных эфектов, но растровые полотна будут выглядеть естественней как мне кажется. Прибавит ли это проблем и в каком луче направлении тут двигаться?
Передайте исполнителям PSD со всеми вариантами и слоями и пусть решают как им удобнее. Верстальщики обычно знают JS и способны это сделать. Тут лучше сразу все обсудить с исполнителем. Работы всего на пару часов. Максимум день если писать с запасом на будущее и чтобы динамически потом можно было добавлять варианты размеров и их анимацию.
Благодаря вам картина прояснилась, спасибо, буду развивать.
Все достаточно просто. Меняешь стили и все http://batester.ru/flag/ данные кликаются
В общих чертах понятно, спасибо. Для динамической схемы такой способ подойдет идеально. Смущает вот что: когда в место красного прямоугольника появится отрисованое полотнище флага оно будут иметь складки блики и.т.д. как он себя поведет например, при трансформации в полотно большего размера при этом из горизонтального в вертикальное?
ну тут как вариант можно растягивать изображение с высотой и шириной 100% либо в стилях менять фоновое изображение
Axios, мне кажется растягивать не айс получится, а вот вариант менять в полне подойдет может еще какой то фильтр прикрутить.
Спасибо большое за дельные советы.