Вводная:
Дизайн: готов, предоставим
Верстка: готова, предоставим
Тексты и элементы по страницам: анимированы. Все анимации реализованы в верстке.
FTP аккаунт / Админ панель: подготовлены, предоставляем доступы
CMS: WordPress (последняя версия)
Необходим будет плагин ACF
Техническое описание
1. Меню сайта
1.1. Меню сайта (web версия):
Home
Values
Contact
Get in touch
Анимационное блоки в меню (только web версия):
Company
Sectors
How we work
Футер (web версия, в выпадающем меню):
Контакты
Номер телефона
Ссылка / Иконка: LinkedIn
Ссылка на страницу: Privacy Policy
Копирайты
Клик на каждый пункт в меню - ведет в соответствующий раздел / страницу сайта
Клик на “Почтовый контакт” - открывает почтовый клиент на девайсе пользователя
Клик на “Номер телефона” - открывает почтовый клиент на девайсе пользователя
Клик на иконку LinkedIn - ведет на страницу компании в LinkedIn
Клик на “Privacy Policy” - открывает страницу с Privacy Policy, в том же окне
1.2. Меню сайта (mobile версия):
Home
Company
Sectors
How we work
Values
Contact
Get in touch
Футер (mobile версия, в выпадающем меню):
Контакты
Номер телефона
Ссылка / Иконка: LinkedIn
Ссылка на страницу: Privacy Policy
Клик на каждый пункт в меню - ведет в соответствующий раздел / страницу сайта
Клик на “Почтовый контакт” - открывает почтовый клиент на девайсе пользователя
Клик на “Номер телефона” - открывает почтовый клиент на девайсе пользователя
Клик на иконку LinkedIn - ведет на страницу компании в LinkedIn
Клик на “Privacy Policy” - открывает страницу с Privacy Policy, в том же окне
2. Админ панель
В админ панели сайта должны редактироваться все текстовые поля (пункты меню, футер, хедер, заголовки, текстовые блоки), изображения на всех страницах, а также названия полей форм отправки данных (со страниц: contact us и enquiry).
Будет необходимость в редактировании максимально всего, что есть на сайте
3. Языки сайта
Контент сайта будет на двух языках
Английский
Арабский
Необходимо предусмотреть возможность:
Включить / Выключить из админки языки для отображения. Так как при первом запуске будет доступен только английская версия
Задать все переводы. Соответственно важно иметь возможность редактирования всех текстов на сайте.
4. Поп-ап при первом входе на сайт
В открываемом поп-апе пользователь соглашается с политикой кук.
При клике на “More details” - открываем страницу с Cookies Policy
При клике на “Decline” - пользователь отказывается принимать куки
При клике на “Accept” - пользователь соглашается принимать куки
Пока пользователь не нажал на кнопки “Decline” или “Accept” - поп-ап остается отображаться при переходе между страницами сайта
5. Home
5.1. Структура страницы:
Хедер
Логотип компании
Переключатель языка сайта
Вызов бокового меню
Центральный слоган компании
Информационные блоки, описывающие область работы компании (не кликабельные):
Artificial Intelligence
Blockchain
Data Center
Software Development
Футер (web версия, только на home странице):
Контакты
Номер телефона
Ссылка / Иконка: LinkedIn
Ссылка на страницу: Privacy Policy
Клик на “Лого компании” открывает домашнюю страницу - home, в том же окне
Клик на “Переключатель языка” - меняет язык на странице
Клик на “Меню” открывает боковое меню
Клик на “Почтовый контакт” - открывает почтовый клиент на девайсе пользователя
Клик на “Номер телефона” - открывает почтовый клиент на девайсе пользователя
Клик на иконку LinkedIn - ведет на страницу компании в LinkedIn
Клик на “Privacy Policy” - открывает страницу с Privacy Policy, в том же окне
5.2. Mobile адаптация
Обратить внимание: в mobile версии, информационные блоки, описывающие область работы компании автоматически скролятся (реализовано в верстке) и кликабельны. Соответственно, в отличие от web версии, они ведут на соответствующие разделы / страницы сайта
Футер (mobile версия, только на home странице):
Копирайты
Ссылка на страницу: Privacy Policy
Ссылка на страницу: Contact Us
Ссылка / Иконка: LinkedIn
Клик на “Лого компании” открывает домашнюю страницу - home, в том же окне
Клик на “Переключатель языка” - меняет язык на странице
Клик на “Меню” открывает боковое меню
Клик на кнопку “Artificial Intelligence” - ведет на соответствующую страницу
Клик на кнопку “Blockchain” - ведет на соответствующую страницу
Клик на кнопку “Data Center” - ведет на соответствующую страницу
Клик на кнопку “Software Development” - ведет на соответствующую страницу
Клик на “Privacy Policy” - открывает страницу с Privacy Policy, в том же окне
Клик на “Contact Us” - открывает страницу с Contact Us, в том же окне
Клик на иконку LinkedIn - ведет на страницу компании в LinkedIn
6. Company
6.1. Структура страницы:
Хедер
Логотип компании
Переключатель языка сайта
Вызов бокового меню
Заголовок
Описание
Клик на “Лого компании” открывает домашнюю страницу - home, в том же окне
Клик на “Переключатель языка” - меняет язык на странице
Клик на “Меню” открывает боковое меню
7. Sectors
7.1. Структура страницы:
Хедер
Логотип компании
Переключатель языка сайта
Вызов бокового меню
Заголовок
Информационные блоки, описывающие область работы компании:
Artificial Intelligence
Blockchain
Data Center
Software Development
Клик на “Лого компании” открывает домашнюю страницу - home, в том же окне
Клик на “Переключатель языка” - меняет язык на странице
Клик на “Меню” открывает боковое меню
Клик на блок “Artificial Intelligence” - ведет на соответствующую страницу
Клик на блок “Blockchain” - ведет на соответствующую страницу
Клик на блок “Data Center” - ведет на соответствующую страницу
Клик на блок “Software Development” - ведет на соответствующую страницу
ВАЖНО: ниже будут описаны типовые страницы. Верстальщик сверстал только Artificial Intelligence. Остальные нужно будет создать из админки по аналогии. На типовых страницах отличаются только подложки блоков. Все блоки с подложками - сверстаны.
7.2. Artificial Intelligence
Хедер
Логотип компании
Переключатель языка сайта
Вызов бокового меню
Заголовок
Описание
Блоки (не кликабельные)
Machine learning
Data science
Computer vision
Текст с предложением подать заявку
Кнопка для подачи заявки
Клик на “Лого компании” открывает домашнюю страницу - home, в том же окне
Клик на “Переключатель языка” - меняет язык на странице
Клик на “Меню” открывает боковое меню
Клик на кнопку “Make an enquiry” - открывает страницу Get in touch
7.3. Blockchain
Хедер
Логотип компании
Переключатель языка сайта
Вызов бокового меню
Заголовок
Описание
Блоки (не кликабельные)
Trading
Investment
Cryptocurrency
Текст с предложением подать заявку
Кнопка для подачи заявки
Клик на “Лого компании” открывает домашнюю страницу - home, в том же окне
Клик на “Переключатель языка” - меняет язык на странице
Клик на “Меню” открывает боковое меню
Клик на кнопку “Make an enquiry” - открывает страницу Get in touch
7.4. Data Center
Хедер
Логотип компании
Переключатель языка сайта
Вызов бокового меню
Заголовок
Описание
Блоки (не кликабельные)
Green Technology
Servers
Текст с предложением подать заявку
Кнопка для подачи заявки
Клик на “Лого компании” открывает домашнюю страницу - home, в том же окне
Клик на “Переключатель языка” - меняет язык на странице
Клик на “Меню” открывает боковое меню
Клик на кнопку “Make an enquiry” - открывает страницу Get in touch
7.5. Software Development
Хедер
Логотип компании
Переключатель языка сайта
Вызов бокового меню
Заголовок
Описание
Блоки (не кликабельные)
Hardware
Software
Web
Текст с предложением подать заявку
Кнопка для подачи заявки
Клик на “Лого компании” открывает домашнюю страницу - home, в том же окне
Клик на “Переключатель языка” - меняет язык на странице
Клик на “Меню” открывает боковое меню
Клик на кнопку “Make an enquiry” - открывает страницу Get in touch
8. How we work
Хедер
Логотип компании
Переключатель языка сайта
Вызов бокового меню
Заголовок
Описание
Кнопка для подачи заявки
Графика (подложка)
Блоки с шагами к успеху
Кнопка для подачи заявки
Графика (подложка)
Кнопка “Стрелка” для возврата вверх страницы
Клик на “Лого компании” открывает домашнюю страницу - home, в том же окне
Клик на “Переключатель языка” - меняет язык на странице
Клик на “Меню” открывает боковое меню
Клик на кнопку “Make an enquiry” - открывает страницу Get in touch
Клик на “Стрелку” автоматически скроллит страницу в самый верх
9. Enquiry
Представляет собой пошаговую (в три этапа) форму для отправки запроса на почтовый ящик админа. Почтовый ящик должен быть задан в админке с возможностью менять, для получения писем. Соответственно с формы пользователь должен иметь возможность отправить письмо на заданный в админке почтовый ящик.
9.1. Step ⅓
Хедер
Логотип компании
Переключатель языка сайта
Вызов бокового меню
Поле формы для ввода текста / цифр / символов “Company / Organization Name” - ОБЯЗАТЕЛЬНО для заполнения
Поле формы для ввода текста / цифр / символов “Location” - ОБЯЗАТЕЛЬНО для заполнения
Поле формы для ввода текста / цифр / символов “Site” - ОБЯЗАТЕЛЬНО для заполнения
Поле формы для ввода значения из выпадающего списка “Year of foundation” - НЕ ОБЯЗАТЕЛЬНО для заполнения
Поле формы для ввода текста / цифр / символов “What amount of investment is required” - ОБЯЗАТЕЛЬНО для заполнения
Кнопка “Next step”
Текст ошибки в поле в случае отсутствия данных (относится ко всем трем шагам формы):
Текст ошибки: Empty field
Клик на “Лого компании” открывает домашнюю страницу - home, в том же окне
Клик на “Переключатель языка” - меняет язык на странице
Клик на “Меню” открывает боковое меню
Клик на кнопку “Next step” ведет на следующий шаг Step ⅔
(!) Все поля в форме редактируемые
(!) При переходе между шагами формы, заполненные поля должны быть сохранены
(!) Валидация на символы: точка, запятая, тире
9.2. Step ⅔
Хедер
Логотип компании
Переключатель языка сайта
Вызов бокового меню
Поле формы для ввода значения из выпадающего списка “The current stage of the project” - ОБЯЗАТЕЛЬНО для заполнения
Поле формы для ввода текста / цифр / символов “What industry do you plan to develop” - ОБЯЗАТЕЛЬНО для заполнения
Поле формы для ввода текста / цифр / символов “What MRR do you generate” - ОБЯЗАТЕЛЬНО для заполнения
Поле формы для ввода текста / цифр / символов “What funding round” - ОБЯЗАТЕЛЬНО для заполнения
Поле формы для ввода текста / цифр / символов “Project competitors” - ОБЯЗАТЕЛЬНО для заполнения
Поле формы для ввода текста / цифр / символов “Competitive advantages” - ОБЯЗАТЕЛЬНО для заполнения
Кнопка “Next step”
Кнопка “Back”
Клик на “Лого компании” открывает домашнюю страницу - home, в том же окне
Клик на “Переключатель языка” - меняет язык на странице
Клик на “Меню” открывает боковое меню
Клик на кнопку “Next step” ведет на следующий шаг Step ⅔
Клик на кнопку “Back” ведет на предыдущий шаг Step ⅓
(!) Все поля в форме редактируемые
(!) При переходе между шагами формы, заполненные поля должны быть сохранены
(!) Валидация на символы: точка, запятая, тире
9.3. Step 3/3
Хедер
Логотип компании
Переключатель языка сайта
Вызов бокового меню
Поле формы для ввода текста / цифр / символов “First Name” - ОБЯЗАТЕЛЬНО для заполнения
Поле формы для ввода текста / цифр / символов “Last Name” - ОБЯЗАТЕЛЬНО для заполнения
Поле формы для ввода текста / цифр / символов “E-mail - ОБЯЗАТЕЛЬНО для заполнения
Поле формы для ввода цифр “Phone Number” - ОБЯЗАТЕЛЬНО для заполнения
Поле для заливки файла “Add file or drop files here” - НЕ ОБЯЗАТЕЛЬНО для заполнения
Кнопка “Send”
Текст предупреждение: “By submitting the form you agree to the processing of personal data”
Кнопка “Back”
Клик на “Лого компании” открывает домашнюю страницу - home, в том же окне
Клик на “Переключатель языка” - меняет язык на странице
Клик на “Меню” открывает боковое меню
Клик на “Add file or drop files here” открывает окно для поиска файла с девайса. Залитый файл можно удалить через “х” после его заливки.
Клик на кнопку “Send” - отправляем все заполненные данные и вложенный файл на почтовый ящик админа (заданный в админке)
Клик на кнопку “Back” ведет на предыдущий шаг Step ⅔
(!) Все поля в форме редактируемые
(!) При переходе между шагами формы, заполненные поля должны быть сохранены
(!) Валидация на символы: точка, запятая, тире
(!) Валидация на поле email - проверка на @ и точки
При успешной отправке отображаем текст: “Thank you for your message. It has been sent” поверх нижней навигации между шагами формы
Текст ошибки в поле в случае неверно введенного почтового ящика (при отсутствии @ и точки)
Текст ошибки: Incorrect value
10. Values
Хедер
Логотип компании
Переключатель языка сайта
Вызов бокового меню
Заголовок
6-ть блоков с описанными ценностями (анимированные)
Клик на “Лого компании” открывает домашнюю страницу - home, в том же окне
Клик на “Переключатель языка” - меняет язык на странице
Клик на “Меню” открывает боковое меню
11. Get in touch
Хедер
Логотип компании
Переключатель языка сайта
Вызов бокового меню
Поле формы для ввода текста / цифр / символов “First Name” - ОБЯЗАТЕЛЬНО для заполнения
Поле формы для ввода текста / цифр / символов “Last Name” - ОБЯЗАТЕЛЬНО для заполнения
Поле формы для ввода текста / цифр / символов “E-mail - ОБЯЗАТЕЛЬНО для заполнения
Поле формы для ввода цифр “Phone Number” - ОБЯЗАТЕЛЬНО для заполнения
Поле формы для ввода текста / цифр / символов “Please let us know what we can do to serve your needs” - ОБЯЗАТЕЛЬНО для заполнения
Кнопка “Send”
Текст предупреждение: “By submitting the form you agree to the processing of personal data”
Чекбокс “Please, inform me about news”
Клик на “Лого компании” открывает домашнюю страницу - home, в том же окне
Клик на “Переключатель языка” - меняет язык на странице
Клик на “Меню” открывает боковое меню
Клик на кнопку “Send” - отправляем все заполненные данные на почтовый ящик админа (заданный в админке)
Клик на кнопку чекбокс “Please, inform me about news” отправляет, дополнительно к данным введенным пользователем в полях формы, текст “Клиент согласен на новостную подписку”.
(!) Все поля в форме редактируемые
(!) Валидация на символы: точка, запятая, тире
(!) Валидация на поле email - проверка на @ и точки
При успешной отправке отображаем текст: “Thank you for your message. It has been sent” поверх нижней навигации формы
Текст ошибки в поле в случае неверно введенного почтового ящика (при отсутствии @ и точки)
Текст ошибки: Incorrect value
Текст ошибки в поле в случае отсутствия данных:
Текст ошибки: Empty field
12. Contact
Хедер
Логотип компании
Переключатель языка сайта
Вызов бокового меню
Заголовок
Address:
Текст-ссылка: Show on map
Opening Hours:
Phone number:
E-mail
Клик на “Лого компании” открывает домашнюю страницу - home, в том же окне
Клик на “Переключатель языка” - меняет язык на странице
Клик на “Меню” открывает боковое меню
Клик на “Почтовый контакт” - открывает почтовый клиент на девайсе пользователя
Клик на “Номер телефона” - открывает почтовый клиент на девайсе пользователя
Клик на “Show on map” подтягивает внизу страницы карту (сервис mapbox) - которую можно свернуть нажав на “х”
13. Privacy Policy
Хедер
Логотип компании
Переключатель языка сайта
Вызов бокового меню
Текст с абзацами
Клик на “Лого компании” открывает домашнюю страницу - home, в том же окне
Клик на “Переключатель языка” - меняет язык на странице
Клик на “Меню” открывает боковое меню
14. Cookie Policy
Хедер
Логотип компании
Переключатель языка сайта
Вызов бокового меню
Текст с абзацами
Клик на “Лого компании” открывает домашнюю страницу - home, в том же окне
Клик на “Переключатель языка” - меняет язык на странице
Клик на “Меню” открывает боковое меню
15. 404 ошибка
В случае, если страница, к которой обращается пользователь - не доступна
Хедер
Логотип компании
Переключатель языка сайта
Вызов бокового меню
404
Текст
Кнопка “Back to home”
Клик на “Лого компании” открывает домашнюю страницу - home, в том же окне
Клик на “Переключатель языка” - меняет язык на странице
Клик на “Меню” открывает боковое меню
Клик на “Back to home” открывает домашнюю страницу - home, в том же окне
