Сверстать одно-страничник согласно ТЗ.
Использовать либо вордпресс либо
Наполнить контентом чуть чуть
ТЗ:
У первого экрана сайта не однозначный, многослойный бэкграунд. !!! Важно что бы при загрузке страницы элементы появлялись в правильном порядке! Сначало информационные после уже все слои фона, а не наоборот. Первым мы должны увидеть видео и Акцию с формой захвата контакта возможно на однотонном фоне, а после уже все детали, гардиенты , экран аймака и пр.
Кликабельные элементы – стрелочки для слайдеров и кнопочки на сайте имеют 3 состояния см. слоли (кроме ссылок и соц сетей)
Меню полупрозрачное и должно всегда быть сверху экрана и "ездить" вместе со скролом сайта. При наведении на пункт меню он становится "бежевый", при нажатии "зеленый". (см. макет) При нажатии на пункт меню, нас автомиатически спускает?поднимает по вертикали на нужный пункт ( аля fair.pir.ru/#events)
Кнопка "заказать обратный звонок" (как и все кнопки на сайте) выполнина в трех вариантах (спокойное, наведение, нажатие). при нажатии на нее всплывает "попап" с формой для обратной связи (см. джепеги)
"Попап" – все попапы идентичны и содержат одни поля информации. При клике на поле с именем, слово "имя" -исчезает. При нажатии на поле для ввода номера телефона, все что в ней содержится, остается как образец и заполняются только не достающие цифры. Кнопка по аналогии со всеми кнопками в трех состояниях. Крестик для закрытия тоже в трех состояниях. php и адресс куда и как отправлять заявки взять с пред идущей версии сайта web.patipac.ru
"Видео" – находится по ссылке vimeo.com/62542683
Акция справа, всегда будет меняться, неизменным будет оставаться заголовк, таймер и форма заявки. Меняться будет только содержание. Таймер сделать "закольцованным", поставить на 3 дня. и каждый раз при окончании времени, запускать его заново.
Иконки соц сетей, полупрозрачные, при наведении появляется зеленая подложка. При нажатии всплывает форма, оставить коммент о нас на своей стене в соц сети или твитнуть от своего имени и т.д.
При нажатии на ссылку под иконками "Делитесь с друзьями и зарабатывайте" всплывает попап с инфой (см. джепеги)
Раздел "О нас"
при заходе на страницу всегда выбран пункт"коротко", при нажатии на пункт "подробно" экран раздвигается (см. джепег "о нас") не закрывая то что под ним а раздвигая и увеличивая длинну сайта. " так же при нажатии кнопки " коротко" или "свернуть " окно сворачивается.
Так же при нажатии на ссылки основных триггеров мы соерещаем переход по сайту (70 сайтов в год – переход на портфолио, просто опускает нас чуть ниже, нам боверяют бренды – переход на раздел "нам доверяют" с клиентами, Уважаем свое и ваше время – переход на раздел " порядок работ") Все переходы по сайту осуществляются по принцепу вертикального слайдера (пр. fair.pir.ru/#events)
В портфолио действует та же система увелеличения экрана по вертикале при нажатие на ссылку "больше наших работ". С разницей лишь в том что добавляется всего один ряд работ и так пока не кончатся работы.
При наведении курсора на на превью работы в портфолио, появляется черный полупрозрачный фрейм с названием работы ( пример в джепеги AmWay)
При нажатии на работу, всплывает попап с увеличенной работой и кратким описанием (см. джепег "работа") есть возможность пролистывать работу, смотреть различные страницы.
Кнопка узнать стоимость также вызывает попап.
Требуется так же залить все работы на сайт их около 35шт. (есть превью и работа крупно, в основном по одной страничке) описание заливать НЕ НУЖНО!
Раздел "услуги"
Тут все просто, при выборе определенного раздела меняется центральный блок с иконкой и инфой. У блоков меню так же есть 3 состояния (покой, наведение, надатие) см. слои.
Раздел "нам доверяют" -обычный слайдер, так же нужно залить все работы, будет приложена папка с логотипами в размер!
Раздел " порядок работ" – не кликабелен, кроме кнопки
Отзывы по аналогии с разделом "нам доверяют" обычный слайдер. Единственное что под фото есть контакт клиента, нужно что бы он был кликабелен.
Раздел "контакты" – по аналогии с примерами
... и fair.pir.ru/#contacts С возможностью двигать карту. При движении карты окно с кантактами исчезает но маркет остается! при наведении на маркет окно всплывает.
В окне с контактами есть ссылочка "как добраться" в слоях есть папкас аналогичным названием. там второй экран с подробной инфой и возможностью вернуться назад.