Исходник TIFF разбит по слоям:
1. Все тексты должны быть текстами, не картинками.
2. Your name, Email, wish – это placeholder. При открытии страницы фокус сразу же мигает в поле "Your name".
3. На фоне шапки – видео из ютуба крутится в бесконечном цикле. На всю ширину экрана. Не факт, что влезет вся высота. Это не важно. Высота статическая. Ширина – резиновая.
4. Сверху видео – затемняющий фон.
5. На одном экране должен помещаться один слой и заголовок следующего, чтобы было видно на любом экране, что внизу есть продолжение.
6. В прямоугольнике How it works – видео из ютуба. Как только прокручиваешь до него, оно автоматом начинает играть. Прокручиваешь видео за пределы экрана – перестает.
7. Нажатие на кнопку "Send a request" переходит моментально (без анимации) на первый экран. Фокус мигает в поле "Your name".
8. Кнопка "For musicians" – это ссылка.
9. Мелкий логотив справа снизу каждого блока – это фиксированно прилепленный внизу экрана логотип. При нажатии – переходит в самый верх.
10. Our musicians. В базе будет много фоток разных размеров и пропорций. Их нужно HTML/CSSами выравнивать до однородной массы. Все они будут крутиться сверху вниз бесконечным циклом, как барабан, на котором нет начала и конца. Карусель. Градиент поверху – это HTML/CSS.
11. Отзывы. Картинка отдельно. Надпись на ней – это HTML/CSS. Тут тоже фотки разных размеров и пропорций нужно HTML/CSSами выравнивать до необходимого размера.
12. Отзывы будут крутиться сверху вниз бесконечным циклом, как барабан, на котором нет начала и конца. Карусель. Скорость, как у музыкантов. При наведении мыши на какой-то отзыв, крутилка останавливается. При выходе за пределы отзывов – снова крутится.
13. Responsive вариант – это элементы выстраиваются/меняют размеры так, чтобы помещаться в одной ширине экрана без прокрутки. Например, форма может уменьшиться, и видео тоже, а фотки выстроятся не в 6 колонок, а в меньше колонок, чтобы поместиться на экране, и отзывы, и команда тоже.
14. Карта внизу – это код гугл карты с нашим адресом в таком черно-белом варианте.
15. Соглашение об обработке в самом низу – это ссылка.
16. При наведении на периметр формы или при фокусе в любом поле формы весь блок формы с полями пропорционально на 10 пикселей плавно (500 мс) увеличивается (по 5 пикселей вправо, влево, вверх, вниз). При убирании мышки – возвращается в исходное положение. При этом на расположение соседних элементов это не дожно влиять. Они не должны менять свое месторасположение. Не должна увеличиваться высота слоя.
17. То же, что и в 16, при наведении на фотку музыканта, на блок отзыва (одна фотка + текст), блок члена команды (одна фотка + текст).
18. Нажатие на любую кнопку – кнопка должна проваливаться. Отпускание – возврат в исходное положение.
19. Любая кнопка, поле должны уметь менять ширину, высоту, сохраняя свой дизайн.
Просьба сообщить окончательную цену, дату начала и окончания работы, если я вас выберу сегодня исполнителем по этому проекту.
Оплата только через безопасную сделку.