Технологические стандарты и требования

Приложение № 2
Договору № от « »______________________ 2015 г.
«»___________________ г.
«__» _____________ 2015 г.
Утверждаю
Утверждаю
Исполнитель:
Заказчик:
Директор
Директор
________________/Шевелевич А.В/
________________/________________/
М.П.
М.П.
Техническое задание
на разработку интернет-магазина hi-fi техники
«Авекс»
Центр информационных технологий «Биконсалт»
2
Оглавление
1 Технологические стандарты и требования .......................................................................... 4
1.1
Общие требования ................................................................................................................. 4
1.2
Требования к дизайну ............................................................................................................ 4
1.3
Требования к информационным материалам Заказчика .................................................... 4
1.4
Технические требования. ...................................................................................................... 5
1.4.1 Требования к верстке ...................................................................................................... 5
1.4.2 Требования к интеграции ............................................................................................... 5
1.4.3 Требования к хостингу .................................................................................................... 5
2
Карта сайта ............................................................................................................................. 5
3
Механизмы работы сайта ...................................................................................................... 6
3.1
Система управления сайтом X3M.CMS ............................................................................... 6
3.2
Модули системы управления сайтом X3M.CMS ................................................................ 6
3.2.1 Каталог «Товары» ............................................................................................................ 6
3.2.2 Каталог «Бренды» ............................................................................................................ 8
3.2.3 Каталог «Слайдер»........................................................................................................... 9
3.2.4 Модуль «Новости»............................................................................................................ 8
3.2.5 Модуль «Пользователи сайта» ...................................................................................... 9
3.2.6 Модуль «Интернет-магазин» ............................................Error! Bookmark not defined.
3.2.7 Поиск по сайту .....................................................................Error! Bookmark not defined.
4
Структура шаблонов и интерфейс ..................................................................................... 10
4.1
Основные используемые блоки шаблонов ........................................................................ 10
4.2
Главная страница (Шаблон 1) ............................................................................................. 11
4.3
О компании (Шаблон 2) .......................................................Error! Bookmark not defined.
4.4
Товары (Шаблон 3) .............................................................................................................. 15
4.5
Карточка товара (Шаблон 4) ............................................................................................... 19
4.6
Бренды (Шаблон 5) .............................................................................................................. 12
4.7
Бренд (Шаблон 6) ..................................................................Error! Bookmark not defined.
4.8
Вопрос-ответ (Шаблон 7) .....................................................Error! Bookmark not defined.
4.9
Новости (Шаблон 8)..............................................................Error! Bookmark not defined.
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
3
5
4.10
Новость (Шаблон 9) ..............................................................Error! Bookmark not defined.
4.11
Контакты (Шаблон 10) ........................................................................................................ 15
4.12
Регистрация (Шаблон 11) .................................................................................................... 15
4.13
Авторизация/ Ошибка авторизации (Шаблон 11)..............Error! Bookmark not defined.
4.14
Восстановление пароля (Шаблон 12) ..................................Error! Bookmark not defined.
4.15
Пустая корзина (Шаблон 13) ...............................................Error! Bookmark not defined.
4.16
Корзина (Шаблон 14) ........................................................................................................... 21
4.17
Оформление заказа (Шаблон 15) ........................................................................................ 21
4.18
Заказ принят (Шаблон 16) ................................................................................................... 24
4.19
Личные данные пользователя (Шаблон 17) .......................Error! Bookmark not defined.
4.20
Мои адреса/ Мои дети (Шаблон 18) ....................................Error! Bookmark not defined.
4.21
История заказов (Шаблон 17) ..............................................Error! Bookmark not defined.
4.22
Результаты поиска по сайту (Шаблон 20) ..........................Error! Bookmark not defined.
4.23
Страница 404 (Шаблон 21).................................................................................................. 23
Порядок работы.................................................................................................................... 26
5.1
Разработка дизайна .............................................................................................................. 26
5.2
Вёрстка .................................................................................................................................. 26
5.3
Программирование .............................................................................................................. 26
5.4
Сдача сайта ........................................................................................................................... 26
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
4
1
Технологические стандарты и требования
1.1
Общие требования

Сайт должен иметь две русскоязычную версию.

Заказ товара может производиться как зарегистрированным пользователем, так и
гостем.
1.2
Требования к дизайну
Стилистическое оформление Сайта должно соответствовать корпоративному стилю компании и
использовать его цветовые схемы, графические элементы (логотип) и шрифты.
Дизайн должен обеспечивать соответствие следующим основным требованиям:
 графические
элементы
должны
быть
выполнены
с
учетом
специфики
представления графической информации на веб-страницах;
 внимание пользователя должно концентрироваться на наиболее важных навигационных
элементах;
 основная информация, меню и другие элементы навигации должны быть доступны без
горизонтального прокручивания полностью открытого окна браузера при стандартном разрешении
экрана 1280 px;
 не допускается использование апплетов и загружаемых на браузер пользователя независимых
программных модулей, требующих дополнительной инсталляции;
 дизайн должен учитывать принятые в электронных СМИ правила подачи информации.
1.3
Требования к информационным материалам Заказчика
Заказчик предоставляет все необходимые Исполнителю текстовые и графические материалы, а
также комментарии, касающиеся их содержания, объема, оформления и размещения.
Информационные материалы должны предоставляться в следующем виде:
Фотографии (изображения): допустимые форматы - .jpg, .gif (для анимированных
изображений), .png, .psd, .tiff.
Предоставление изображений внутри документов форматов .doc или .rtf крайне нежелательно,
так как качество таких изображений является неприемлемым.
Тексты для наполнения страниц представляются в отдельных файлах (один файл на одну
страницу), названия файлов должны совпадать с названиями страниц. Допускаются файлы
следующих форматов: .doc, .docx, .rtf, .txt.
Таблицы предоставляются в формате .xls, .xlsx.
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
5
Технические требования.
1.4
1.4.1 Требования к верстке
Стандартом языка разметки принимается версия HMTL5 - язык гипертекстовой разметки
страниц; CSS3 - каскадная таблица стилей.
Необходимо реализовать адаптивный вариант верстки в двух разрешениях с минимальным
разрешением 1000 px.
Контент на странице выравнивается по левому краю.
Сайт должен поддерживать корректную работу с версиями веб-браузеров, начиная от указанной
до последней версии на момент подписания ТЗ: MS Internet Explorer 10, Opera 12.16, Mozilla Firefox 24, Google Chrome 29, Safari 5.1.7.
Допускается визуальное отличие сглаживания шрифтов различных браузерах и операционных
системах.
1.4.2 Требования к интеграции
При разработке Сайта используются следующие технологии: PHP - серверный язык
программирования; MySQL – CУБД; JavaScript - клиентский язык программирования.
В качестве платформы рекомендуется использовать стандартную связку LAMP (Linux Apache
MySQL PHP).
1.4.3 Требования к хостингу
Требуется поддержка PHP 5.2, СУБД MySQL 5, а также минимум 3Гб дискового пространства.
2
Карта сайта
Номер в квадратных скобках означает номер шаблона.
ГЛАВНАЯ [1]
О КОМПАНИИ [2]
Авекс компани [2]
Новости [3]
Карточка новости [4]
Портфолио [5]
Ремонт радиоаппаратуры [6]
Услуги [2]
Вакансии [2]
Доставка [2]
Способы оплаты [2]
БРЕНДЫ [7]
Бренд [8]
СПЕЦПРЕДЛОЖЕНИЯ [9]
Карточка спецпредложения [10]
КОНТАКТЫ [11]
ABOUT US [2]
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
6
КАТАЛОГ
Список подкатегорий [12]
Список товаров[13]
Карточка товара [14]
Корзина [15]
Оформление заказа [16]
Подтверждение заказа[17]
Заказ оформлен [18]
Личный кабинет дилера [19]
Результаты поиска [20]
404 [21]
3
Механизмы работы сайта
3.1
Система управления сайтом X4M.CMS
Система управления сайтом X4M.CMS включает:
 Возможность обновление контента сайта на стороне Заказчика без участия разработчиков;
 Модульность;
 Совместимость с поисковыми системами и каталогами, возможность поисковой оптимизации;
 Защищённость системы от несанкционированного доступа;
 Простота освоения, удобство пользования;
 Система поддерживает работу администратора в Firefox 10 или выше, а также в Google
Chrome.
Использование браузера Mozilla Firefox версии 10 обосновано в связи с поддержкой современных
стандартов HTML 5, без которых работа базового функционала администрирования системы
x3m.cms невозможна. Необходимыми стандартами для работы являются:
 наличие поддержки DOM WEB WORKERS http://www.whatwg.org/specs/web-workers/currentwork/;
 поддержка File Api и состояния закачки http://www.whatwg.org/specs/web-apps/currentwork/multipage/number-state.html#concept-input-type-file-selected (4.10.7.1.18 File Upload state);
 полная поддержка стандарта CSS3;
 поддержка DOM Storage (контекст globalStorage) http://www.w3.org/TR/webstorage/.
Модули системы управления сайтом X3M.CMS
3.2
3.2.1 Каталог «Товары»
Каталог товаров – двухуровневый.
Корневая директория имеет свойства:

Курс для розницы (для перевода в бел. руб. )
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
7

Процент для расчета оптовой цены

В какой валюте показывать (выпадающий список: доллар, евро, росс.) – касается только
зарегистрированных пользователей.

Отключить валюту (флажок) – если включен, пересчет в валюте на сайте не показывать
Папки первого уровня содержат изображение, которое выводится на главной странице в блоке
«Категории товаров» (см. п. 4.2).
Папки второго уровня имеют свойства:

Наименование подкатегории

Популярная категория (флажок) – если установлен, то категория имеет приоритет в
выводе (см. п. 4.12).

Индекс популярности (строка)
Папки пустые должны автоматически удаляться.
Каждый объект каталога обладает следующими свойствами:

Изображение

Галерея изображений

Наименование модели(строка)

Бренд (id объекта каталога «Бренды»)

Серия (строка)

Страна производства (строка)

Единица измерения (строка)

Описание (гипертекст)

Связанные объекты - каждому объекту может соответствовать несколько связанных
объектов из этого же каталога, выводятся в блоке «С этим товаром покупают».
Торговое предложение (SKU) имеет свойства:

Изображение (для списка товаров)

Галерея (для карточки товара)

Цвет (код цвета)

Название цвета (строка)

Наличие (строка)

Скидка (строка) – задается в виде целого числа, выводится в метке товара с
припиской «%»

Статус Новинка (флажок) - если установлен, присваивается статус «Новинка»,
выводится в метке товара

Статус Скоро (флажок) - если установлен, присваивается статус «Скоро», выводится
в метке товара
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
8

Популярный товар (флажок) – если установлен, то товар выводится в блок
«Рекомендуемые товары» на главной.

Стоимость для покупателя (строка)

Новая стоимость для покупателя (строка)

Стоимость для дилеров (строка)

Новая стоимость для дилеров (строка)

Стоимость товара в комплекте (строка)

Стоимость товара в комплекте для дилеров (строка)
Наименование
SKU
является
комбинацией
следующих
полей:
Наименование
подкатегории + Бренд + Модель + Цвет.
Каждому SKU должны соответствовать свои параметры в url.
Стоимости задаются в долларах и пересчитываются в бел. рубли.
Стоимость для розницы = округление до 100 руб [курс для розницы* стоимость для
покупателя].
Стоимости для опта = округление до 100 руб [(курс нацбанка + 2%)*стоимость для
дилеров].
3.2.2 Каталог «Спецпредложения»
Спецпредложения распределены по папкам-категориям.
Каждый объект характеризуется следующими свойствами:
● Модель комплекта (строка)
● Изображение
● Стоимость для покупателя (строка)
● Стоимость со скидкой для покупателя (строка)
● Стоимость для дилеров (строка)
● Стоимость со скидкой для дилеров (строка)
● Описание (гипертекст)
Наименование SKU является комбинацией следующих полей: Наименование категории + Бренд
+ Модель + Цвет
Каждый объект связан более с чем одним SKU объектов каталога «Товары».
3.2.3 Каталог «Бренды»
Каждый объект каталога имеет следующие свойства:

Название (строка)

Изображение

Страна бренда (строка)
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
9

Описание (гипертекст)
3.2.4 Каталог «Слайдер»
Каждый объект каталога имеет следующие свойства:

Изображение

Заголовок (строка)

Ссылка (строка) – если задана, слайд кликабельный.
3.2.5 Модуль «Новости»
Новость представляет собой объект, характеризующийся следующими свойствами:

Заголовок новости (строка)

Изображение

Дата публикации отображается в формате <дд месяц гггг>. Текущая дата выводится
в формате «Сегодня чч:мм»

Краткий текст новости (гипертекст)

Полный текст новости (гипертекст)
3.2.6 Модуль «Пользователи сайта»
Интернет магазин действует без регистрации покупателей.
Но есть группа пользователей – дилеры – для которых регистрация осуществляется в админ.
панели менеджером сайта. Логины и пароли передаются без участия сайта.
Поля регистрации:

ФИО (строка)

Название компании (строка)

Номер телефона (строка)

E-mail (строка)
Для каждого пользователя из админ панели могут задаваться файлы, которые можно скачать
дилеру из личного кабинета.
Авторизация дилеров описана в п. 4.1.6.
3.2.7 Поиск по каталогу
Поиск по каталогу товаров (с подсказкой) осуществляется среди товаров каталога по
наименованию товара. В семантике поиска не должны учитываться порядок слов и окончания.
Подсказка содержит следующие элементы:
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
10

Список категорий, в которых содержится искомый объект и количество найденных
объектов в категории. По клику на название категории загружается соответствующий список
искомых объектов (шаблон Список товаров, см. п. 4.13).

Наименования 5 найденных объектов каждой найденной категории, которые являются
ссылками на соответствующие карточки товара.
При выводе всех результатов поиска по каталогу используется шаблон «Результаты поиска»
(см. п. 4.20).
Структура шаблонов и интерфейс
4
В данном разделе описываются основные страницы и блоки, а также их поведение.
Основные используемые блоки шаблонов
4.1
Ниже описаны повторяющиеся на сайте блоки шаблонов.
4.1.1 Шапка (header) – логотип, слоган, Меню главное, Меню каталога товаров, телефон, факс
(задаются в админ. панели), поиск по каталогу (см. п. 3.2.7), выбор валюты (см. п. 4.1.5), ссылка на
Корзину (с указанием количества товаров, если количество «0»- кнопка не кликабельная), Вход (см.
п. 4.1.6).
4.1.2 Логотип – графический визуальный образ. При щелчке по Логотипу происходит переход
на Главную страницу сайта.
4.1.3 Главное меню представляет собой панель из ссылок на основные страницы и разделы
сайта. По наведению на пункт меню «О компании» выпадает подменю. Меню отображается на всех
страницах сайта, за исключением 404 стр.
4.1.4 Меню каталога. По клику на меню каталога всплывает подменю: список категорий
первого уровня. По щелчку на категорию загружается страница «Список подкатегорий» (см. п. 4.12).
4.1.5 Выбор валюты. Блок отображается только для зарегистрированных пользователей. По
умолчанию – в бел. руб. В каких валютах можно пересчитывать цены, задается в админ. панели. При
выборе иностранной валюты (росс., евро, $) все цены автоматически пересчитываются по курсу нац.
Банка + процент и округляются до 100 руб. Блок может отключаться в админ. панели.
4.1.6 Кнопка «Вход». При нажатии на кнопку всплывает окно авторизации с полями

Логин (текстовое поле) – с валидацией

Пароль (текстовое поле) – с валидацией
В случае успешной авторизации ссылка «Вход» меняется на «Выход», а также появляется
ссылка на личный кабинет «Привет, <имя пользователя>!».
4.1.7 Заголовок страницы.
Заголовок текущей страницы. Отображается как текст на всех
странцах сайта и не является ссылкой.
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
11
4.1.8 Информационный блок. Данный блок может включать текст, списки, таблицы, видео,
графические изображения. Видео может быть загружено только со сторонних сервисов Vimeo.com и
Youtube.com. Для тестовых фрагментов и изображений можно назначать ссылки.
4.1.9 Элемент навигации «Хлебные крошки». Данный элемент навигации, указывающий путь к
странице, представляет собой строку в верхней части страницы следующего вида: Главная/ Раздел/
… / Текущая страница. Все элементы данной строки, могут являться ссылками. Последний элемент
(текущая страница) является текстом. Присутствует на всех внутренних страницах.
4.1.10 Пейджинатор.
Данный
объект является переключателем страниц. Например:
«Предыдущая 1 2 3 4 5 Следующая». Каждый элемент пейджинатора является ссылкой на
соответствующую страницу. Пейджинатор появляется, когда количество имеющихся объектов
превышает выводимое количество объектов на страницу. Количество объектов выводимых на
странице задается в админ. панели.
4.1.11 Футер (нижняя часть сайта). Содержит дублирующее меню (О компании, Бренды,
Спецпредложения, Контакты), копирайт, информацию о регистрации интернет-магазина, телефоны,
e-mail, лого платежных систем, ссылку на официальный сайт разработчика, кнопка на подписку на
рассылку.
4.1.12 Подписка на рассылку. По клику на кнопку открывается форма ввода e-mail, на который
будет производиться рассылка новостей. Рассылка и отказ от подписки осуществляется посредством
сервиса e-mail рассылок smartresponder.ru. Рассылка должна предусматривать две группы
пользователей: покупателей и дилеров.
4.1.13 Блок с изображением. Размеры блока определяются дизайном. При выводе на сайт
изображение должно пропорционально масштабироваться до указанных в шаблоне значений
ширины.
4.2
Главная страница (Шаблон 1)
Страница содержит следующие элементы:
 Шапка
 Слайдер
 Категории товаров
 Блок «Рекомендуемые товары»
 Блок новостей
 Блок «О компании» (гипертекст)
 Кнопка «Заказать проект»
 Кнопка «Ремонт и гарантийное обслуживание»
 Блок брендов
 Футер
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
12
Слайдер содержит следующие элементы: слайды, переключатели и индикаторы слайдов. Слайд
содержит изображение, которое может быть ссылкой (ссылка задается в админ. панели (см. п. 3.2.4))
и заголовок. Смена слайдов происходит автоматически через определенный промежуток времени
либо по щелчку на переключатель слайдов. Слайдер работает циклически.
Категории товаров. Блок представляет собой слайдер, содержащий кнопки-ссылки на
категории каталога товаров. Слайдер смещается на одну позицию по клику на переключатель.
Блок «Рекомендуемые
товары». Блок содержит четыре объекта из списка товаров и два
объекта из спецпредложений со статусом
«Популярный товар». Среди популярных объектов
происходит ротация на главной. Элемент содержит Изображение, наименование, Стоимость для
покупателей, Новая стоимость, метки статусов (Скидка, Скоро, Новинка). По клику на элемент
происходит переход в карточку соответствующего SKU.
Блок новостей содержит три последние новости. По клику на объект (на изображение и
заголовок) происходит переход в карточку нвоости. Заголовок блока – ссылка на раздел Новости (см.
п. 4.4).
Кнопка «Заказать проект» является ссылкой-якорем на форму на стр. Портфолио (см. п. 4.6).
Кнопка «Ремонт и гарантийное обслуживание» является ссылкой на стр.Услуги раздела «О
компании».
Блок брендов представляет собой слайдер и содержит изображения всех
объектов каталога
«Бренды» (см. п. 3.2.3). Слайдер сдвигается на одну позицию автоматически либо по щелчку на
переключатель. Слайдер – циклический. По клику на лого бренда происходит переход в карточку
соответствующего бренда.
4.3
Текстовый шаблон (Шаблон 2)
На основе данного шаблона строятся следующие страницы сайта: Авекс компани, Услуги,
Вакансии, Доставка, Способы оплаты, About us.
Страница содержит следующие элементы:
● Шапка
● Элемент навигации «Хлебные крошки»
● Заголовок
● Информационный блок (см. п. 4.1.8)
● Галерея
● Футер
● Галерея представляет собой список миниатюр. По клику на миниатюру всплывает большое
изображение со списком миниатюр.
4.4
Новости (Шаблон 3)
Страница содержит следующие элементы:
Исполнитель
Нач. отдела разработки
Представитель заказчика
Мелешко Л.Г.
Масюк А.В.
13
● Шапка
● Элемент навигации «Хлебные крошки»
● Заголовок
● Список новостей
● Пейджинатор
● Футер
Список новостей организован таблично. Каждый элемент включает изображение (в случае
отсутствия - заглушку), заголовок, дату публикации (см. п. 3.2.5), краткий текст. Картинка и
заголовок – ссылки на соответствующую страницу «Новость» (см. п. 4.5). Новости в списке
сортируются по убыванию по дате.
Новость (Шаблон 4)
4.5
Страница содержит следующие элементы:
o Шапка
o Элемент навигации «Хлебные крошки»
o Заголовок
o Блок сообщения (дата, полный текст новости)
o Ссылка на список новостей
o Футер
Портфолио (Шаблон 5)
4.6
Страница содержит следующие элементы:
● Шапка
● Элемент навигации «Хлебные крошки»
● Заголовок
● Информационный блок (см. п. 4.1.8)
● Блок «Наши работы»
● Форма «Заказать проект»
● Футер
Блок «Наши работы»
представляет собой список галерей. Каждый элемент содержит
заголовок, галерею изображений, количество изображений в галерее. При клике на изображение
всплывает слайд-шоу больших изображений галереи.
Форма «Заказать проект» включает поля:

Имя (текстовое)

Телефон (текстовое)

E-mail (текстовое)
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
14

Опишите ваши пожелания (многострочное текстовое)

Прикрепить файл
Все поля обязательные. В случае ошибки валидации выводится соответствующее сообщение.
При успешной валидации и отправке сообщения на странице выводится текст «Спасибо! Ваша
заявка принята», при этом поля формы очищаются, а данные из формы высылаются на указанный в
админ. панели e-mail.
Ремонт радиоаппаратуры (Шаблон 6)
4.7
Страница содержит следующие элементы:
 Шапка
 Элемент навигации «Хлебные крошки»
 Заголовок страницы
 Информационный блок
 Форма заявки на ремонт
 Футер
Контакты. Блок имеет следующие элементы: телефоны (гипертекст), адрес (строка),
Яндекс.Карту с меткой расположения объекта. Яндекс. Карту можно отключать.
Форма заявки на ремонт. Поля формы (звездочкой обозначены обязательные поля для
заполнения):
o Номер гарантийного талона* (текстовое)
o Тип устройства* (текстовое)
o Фирма-производитель* (поле поиска по бренду с подсказкой )
o Модель устройства
o Серийный номер* (текстовое)
o Комплектность* (многострочное текстовое)
o Внешний вид* (многострочное текстовое)
o Возможная неисправность* (многострочное текстовое)
o Примечание (многострочное текстовое)
Сведения о продавце
o Продавец* (текстовое)
o Дата продажи* (текстовое)
o Вид ремонта (переключатель) – значения «Гарантийный», «Не гарантийный»
Сведения о клиенте
o ФИО* (текстовое)
o Адрес* (текстовое)
o E-mail * (текстовое)
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
15
o Телефон* (текстовое)
o Текст сообщения* (многострочное текстовое)
В случае ошибки валидации выводится соответствующее сообщение. При успешной валидации
и отправке сообщения на странице выводится текст «Спасибо! Ваша заявка на ремонт принята», при
этом поля формы очищаются, а данные из формы высылаются на указанный в админ. панели e-mail.
Бренды (Шаблон 7)
4.8
Страница содержит следующие элементы:
● Шапка
● Элемент навигации «Хлебные крошки»
● Заголовок
● Список брендов
● Футер
Список брендов. Каждый элемент содержит изображение и заголовок. При щелчке по
изображению или заголовку происходит переход на соответствующую стр. «Бренд».
Специальные предложения (Шаблон 8)
4.9
Страница содержит следующие элементы:
● Шапка
● Меню видов комплектов
● Элемент навигации «Хлебные крошки»
● Заголовок
● Список спецпредложений определенного вида
● Пейджинатор
● SEO-блок
● Футер
Меню видов комплектов представлено в виде слайдера. Содержит названия видов комплектов
(папок каталога «Спецпредложения», см. п. 3.2.2).По умолчанию активен первый пункт меню.
Список спецпредложений определенного вида организован таблично. Каждый элемент включает
изображение, наименование, описание, стоимости комплекта для покупателей и дилеров, а также
если заданы в админ. панели стоимости со скидкой (см. п. 3.2.2). Заголовок – ссылки на
соответствующую страницу «Карточка спецпредложения» (см. п. 4.10). По клику на изображение
всплывает окно быстрого просмотра, содержащее:

Изображение

Наименование

Описание
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
16

Состав комплекта (наименование товара, стоимость в комплекте для покупателя,
стоимость в комплекте для дилера)

Стоимость комплекта для покупателей, для дилеров

Стоимость комплекта со скидкой для покупателей, для дилеров.

Кнопка «Положить в корзину» (не отображается, если авторизован пользователь)
Карточка спецпредложения (Шаблон 12)
4.10
Страница содержит следующие элементы:
 Шапка
 Меню видов комплектов
 Элемент навигации «Хлебные крошки»
 Информация о спецпредложении
 Целевая кнопка
 Версия для печати
 Состав комплекта
 Футер
Информация о спецпредложении: изображение (по наведению увеличенное изображение),
наименование, описание (если описание превышает объем, заданный по верстке, то появляется
полоса прокрутки), стоимость комплекта для покупателей, для дилеров, стоимость комплекта со
скидкой для покупателей, для дилеров.
Целевая кнопка может иметь два варианта:
«Добавить в корзину», если все товары, входящие в комплект, все в наличии. По клику
1)
на кнопку всплывает окно с сообщением «Спецкомплект добавлен в корзину!» и перечнем
заказанных товаров, входящих в комплект:

Изображение, наименование, цвет, количество, единица измерения, стоимость
товара для покупателя в комплекте.

Общая стоимость товаров в комплекте.

Стоимость комплекта, если есть скидка.

Кнопка «Оформить заказ», по клику на которую происходит переход на этап
оформления (см. п. 4.15).
o «Оформить заказ», если хотя бы один из товаров комплекта имеет статус «под заказ». По
клику на кнопку всплывает окно, содержащее:

Название комплекта, стоимость комплекта, стоимость со скидкой.

Форму для оформления заявки на комплект:
 ФИО
 Телефон
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
17
 E-mail
 Комментарий
 Кнопка «Заказать». По нажатию на кнопку и при успешной валидации
полей информация о заказе приходит как менеджеру, так и покупателю на эл. адрес (наименование,
состав комплекта, итоговую стоимость заказа). А также выводится информация (в письме и в окне)
«Заказ успешно оформлен! Мы свяжемся с Вами в ближайшее время для уточнения следующих
действий. Если возникли вопросы, обращайтесь к нам по указанным ниже данным».
Причем нужно учитывать следующее:
o Если авторизован пользователь, кнопка не выводится.
o Если в корзину добавлены товары, то появляется окно-предупреждение с элементами:

Сообщение «Стоимость спецкомплекта рассчитывается по специальной системе
скидок. При добавлении спецкомплекта корзина будет очищена. Очистить корзину и
положить выбранный комплект?»

Кнопка «Не очищать корзину и перейти к оформлению заказа».

Кнопка «Очистить корзину и добавить спецкомплект»

Кнопка «Вернуться в карточку спецпредложения»
Версия для печати. По нажатию на кнопку «Сохранить и распечатать» формируется pdfдокумент, который можно сохранить на диск или отправить на печать.
Состав комплекта
содержит список всех связанных товаров с текущим объектом:
изображение, наименование, стоимости новая, старая, кнопку «Добавить в корзину».
4.11
Контакты (Шаблон 13)
Страница содержит следующие элементы:
 Шапка
 Элемент навигации «Хлебные крошки»
 Заголовок страницы
 Контакты
 Форма обратной связи
 Футер
Контакты. Блок имеет следующие элементы: адрес (гипертекст), телефонs (гипертекст), E-mail
(ссылка mail to:), Яндекс.Карту с меткой расположения объекта.
Форма обратной связи. Форма – одна на все вкладки. Поля формы (звездочкой обозначены
обязательные поля для заполнения):
o Имя* (текстовое)
o E-mail * (текстовое)
o Телефон* (текстовое)
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
18
o Текст сообщения* (многострочное текстовое)
Валидация соответствует п. 4.7. При отправке письма на странице выводится текст «Спасибо!
Ваше сообщение успешно отправлено», при этом поля формы очищаются.
4.12
Список подкатегорий (Шаблон 3)
Страница содержит следующие элементы:
 Шапка
 Элемент навигации «Хлебные крошки»
 Список подкатегорий товаров
 SEO-блок
 Футер
Список подкатегорий товаров содержит перечень подкатегорий текущей категории товара.
Каждая подкатегория является ссылкой на список входящих в нее товаров (см. п. 4.13).
Те категории, которые в админ. панели отмечены как популярные, выводятся в списке
первыми. Между собой они выводятся в порядке возрастания индекса популярности (см. п. 3.2.1).
Остальные категории выводятся в алфавитном порядке.
4.13
Список товаров (Шаблон 14)
Страница содержит следующие элементы:
 Шапка
 Элемент навигации «Хлебные крошки»
 Меню текущей категории
 Блок фильтров по параметрам
 Сортировка по цене
 Список товаров
 Пейджинатор
 Seo-блок
 Футер
Меню текущей категории. Подкатегория, список товаров которой загружен, выделен визуально
в меню.
Блок фильтров по параметрам. Фильтры – зависимые, т.е. используется логическое «И».
Поиск осуществляется среди всех SKU объектов текущей подкатегории. Значения параметров в
фильтрах выводятся только те, которые фигурируют в товарах текущей подкатегории и в выбранных
параметрах. При каждом выборе значения происходит пересчет и загрузка товаров. Все параметры
фильтрации дублируются в отдельной панели. Содержит фильтры по параметрам:
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
19

Стоимость
(диапазон, бегунок) - учитывается стоимость для покупателей, если
пользователь не авторизован, иначе – стоимость для дилеров.

Производители (флажок)

Цвет (флажок)

Наличие (переключатель) – Все, В наличии, Под заказ.

Акция (кнопка включения/выключения)
Выдача результатов фильтрации должна производиться в асинхронном режиме.
Сортировка по цене. При загрузке страницы по клику на данную ссылку происходит
сортировка товаров по возрастанию цены, т.е. вверху списка товары с наименьшей ценой. При
повторном клике сортировка меняется на противоположную.
Список товаров. По умолчанию отображается по одному SKU (с наименьшей стоимостью)
каждого товара текущей подкатегории. Элемент списка cодержит следующую информацию из
каталога «Товары»:
o Изображение SKU– ссылка на карточку SKU
o Наименование SKU – ссылка на карточку SKU
o Единица измерения
o Тип – название текущей папки (подкатегории товара)
o Производитель – ссылка на соответствующую страницу бренда
o Страна
o Серия
o Произведено
o Цвет – опция для выбора (по умолчанию выбран цвет с минимальной стоимостью). При
изменении цвета меняется наименование, фото,
стоимость, статус, наличие без
перезагрузки.
o Наличие (В наличии, Под заказ)
o Стоимости (минимальная среди всех sku, для покупателей и для авторизованных
дилеров). Дилер видит все стоимости, покупатель только свою.
o Новая стоимость (для покупателей и для дилеров, если авторизованы)
o Статус (скидка, новинка, скоро) – показывается визуально
o Кнопка «Добавить в корзину» (не отображается, если пользователь авторизован). По
клику на кнопку всплывает окно.
4.14
Карточка товара (Шаблон 5)
Страница содержит следующие элементы:
 Шапка
 Элемент навигации «Хлебные крошки»
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
20
 Панель каталога
 Галерея
 Блок описания (с прокруткой)
 Параметры товара (аналогичны п. 4.13)
 Выбор количества
 Целевая кнопка
 Версия для печати
 Блок «С этим товаром покупают»
 Футер
Галерея. По умолчанию отображается галерея текущего SKU. При изменении цвета товара
меняются изображения в галерее на соответствующие.
Содержит контейнер для отображения активного изображения и список миниатюр изображений
галереи. Если миниатюр более трех, появляются переключатели. Слайдер миниатюр – циклический.
По умолчанию активным изображением является первое изображение из соответствующего каталога.
По клику на миниатюру соответствующее изображение отображается в контейнере. По наведению на
изображении всплывает большое изображение.
Выбор количества. Количество экземпляров по умолчанию 1. Значения можно изменить
вручную либо используя кнопки-счетчики. Значение, меньшее 1, задать нельзя. Рядом с элементом
выводится единица измерения.
Целевая кнопка имеет два варианта (логику см. п. 4.10).
Причем нужно учитывать следующее:

Если авторизован пользователь, кнопка не выводится.

Если в корзину добавлен спецкомплект, то появляется окно-предупреждение:
o
Сообщение «В корзине лежат товары спецпредложения, стоимость которых
рассчитана по специальной системе скидок. При добавлении товара из общего каталога
корзина будет очищена. Очистить корзину и положить выбранный товар?»
o
Кнопка «Не очищать корзину и перейти к оформлению заказа спецкомплекта».
o
Кнопка «Очистить корзину и добавить товар»
o
Кнопка «Вернуться в карточку товара»
Версия для печати. По нажатию на кнопку «Сохранить и распечатать» формируется pdfдокумент, который можно сохранить на диск или отправить на печать.
Блок «С этим товаром покупают» содержит список всех связанных товаров (SKU с
наименьшей стоимостью) с текущим товаром каталога «Товары»: изображение, метки статуса,
наименование, наличие, стоимости, целевая кнопка «Добавить в корзину» или «Заказать».
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
21
4.15
Корзина (Шаблон 16)
Данный шаблон загружается, если пользователь на ткущий момент не авторизован или не
зарегистрирован.
Страница содержит следующие элементы:
 Шапка
 Элемент навигации «Хлебные крошки»
 Таблица заказа
 Кнопка «Оформить заказ»
 Футер
Таблица заказа. Содержит следующие поля:
o
Изображение
o
Наименование SKU
o
Цвет
o
Количество (счетчик для товара, значение «1» для спецкомплекта).
o
Единица измерения товара
o
Стоимость, руб.
o
Сумма, руб. Пересчитывается автоматически при изменении количества.
o
Кнопка «Удалить товар из корзины» (нет возможности у спецкомплектов)
o
Кнопка «Удалить все»
o
Итого – выводится общая итоговая стоимость.
o
Итоговая стоимость спецкомплекта со скидкой (только для спецпредложений)
o
Ссылка «Продолжить покупки» (на главную)
4.16
Оформление заказа (Шаблон 15)
Страница содержит следующие элементы:
 Шапка
 Элемент навигации «Хлебные крошки»
 Форма заказа
 Информационная панель
 Кнопка «Оформить заказ»
 Футер
Форма заказа состоит из этапов, которые подгружаются по мере заполнения формы
предыдущего этапа.
Этап 1. Выбор способа доставки (переключатель)
o Самовывоз (г. Минск) – бесплатно
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
22
o Доставка курьером по г. Минску и 5 км от МКАД – при заказе более 1000000 руб
бесплатно, при заказе менее 1000000 руб – 150000 руб. Значения стоимости заказа
и минимальной суммы заказа задается в админ. панели.
o По Беларуси и в другие страны – стоимость рассчитывается индивидуально.
Запросить скидку (флажок)
Этап 2. Личные данные покупателя
o Имя, фамилия, отчество* (текстовое поле)
o Номер телефона* (строка) – с валидацией. По клику в область поля появляется шаблон
ввода номера телефона «+375 (__) ___-__-__». Попытки ввести символ или пробел, а
также более десяти цифр – игнорируются.
o Логин (E-mail)* (текстовое поле) – с валидацией
o Город, населенный пункт*(текстовое поле)
o Улица* (текстовое поле)
o Дом, корпус* (текстовое поле)
o Квартира (текстовое поле)
o Примечание к заказу (текстовое поле)
Адрес требуется, если способ доставки не самовывоз.
Этап 3. Выбор способа оплаты представляет собой группу переключателей:

Наличными

WebPay

ЕРИП
Информационная панель может содержать следующую информацию:
o при загрузке страницы содержит стоимость заказа.
o При выборе способа доставки:

курьером по Минску, то рассчитывается стоимость доставки и выводится на сайт;

по Беларуси или в др. страны, выводится сообщение «Доставка рассчитывается
индивидуально. Информация о стоимости доставки будет выслана Вам на почту на
последнем этапе оформления заказа».
o В случае запроса на скидку выводится сообщение «Скидка рассчитывается индивидуально.
Информация о величине скидки будет выслана Вам на почту на последнем этапе
оформления заказа».
Кнопка «Заказать». По клику на кнопку происходит проверка валидации. При успешной
валидации:
o
в случае выбора способа доставки «Самовывоз» и если запроса на скидку не было,
происходит переход на страницу подтверждения заказа (см. п. 4.17).
o
в другом случае происходит формирование нового заказа и вывод сообщения во
всплывающем окне «Спасибо! Ваши данные приняты. На указанный e-mail будет выслано письмо с
Исполнитель
Нач. отдела разработки
Представитель заказчика
Мелешко Л.Г.
Масюк А.В.
23
информацией о стоимости доставки (если не самовывоз) и величине скидки (если был запрос на
скидку)» с дальнейшими шагами для оформления заказа.
Кроме того, на почту администратора приходит письмо «Поступил новый заказ <№_номер
заказа>», а также с информацией о заказе, личных данных, способах доставки и оплаты.
На почту пользователя приходит уведомление от интернет-магазина «Авекс» о принятых
данных c темой «заказ № _номер заказа» с таблицей «Информация о заказе», информацией о
выбранных способах доставки и оплаты и следующим текстом: «Добрый день! Ваш заказ <№_номер
заказа> сформирован. Спасибо, что выбрали наш интернет-магазин! В ближайшее время будет
выслано письмо с информацией о стоимости доставки (если не самовывоз) и величине скидки (если
был запрос на скидку)» с дальнейшими шагами для оформления заказа. В случае возникновения
вопросов Вы можете связаться с нами по телефону <номер телефона задается в админ. панели>.
Статус заказа становится «Подтверждение заказа».
В админ. панели в списке заказов должна выводиться информация о дате и времени заказа,
ФИО заказчика, e-mail, телефон, способ доставки, оплаты, адрес, запрос на скидку, статус
(Подтверждение заказа, Принят, Оплачен, Отменен, Доставлен). Далее менеджер в заказе указывает
стоимость скидки и стоимость доставки и отправляет письмо пользователю с данными о заказе.
Пользователь для подтверждения заказа переходит в письме по ссылке на страницу подтверждения
(см. п. 4.17).
4.17
Подтверждение заказа (Шаблон 17)
Данный шаблон загружается, если пользователь на ткущий момент не авторизован или не
зарегистрирован.
Страница содержит следующие элементы:
 Шапка
 Элемент навигации «Хлебные крошки»
 Таблица заказа
 Информация о заказе
 Целевая кнопка
 Футер
Таблица заказа. Содержит следующие поля:
o Изображение
o Наименование товара
o Цвет
o Количество, единица измерения товара
o Стоимость, руб.
o Сумма, руб.
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
24
o Скидка, руб.
o Сумма со скидкой, руб
o Стоимость доставки (если не самовывоз)
o Итого, руб.
Информация о заказе: данные о доставке, личных данных, о способах оплаты.
Целевая кнопка «Оплатить» (если WebPay), «Заказать» в ином случае. По клику на кнопку
«Заказать» на почту пользователя приходит уведомление от интернет-магазина «Авекс» о принятых
данных c темой «заказ № _номер заказа» с номером ЕРИП (если таков способ оплаты), с таблицей
«Информация о заказе», информацией о выбранных способах доставки, оплаты, со стоимостями
скидки и доставки, а также итоговой стоимостью и следующим текстом: «Добрый день! Ваш заказ
<№_номер заказа> принят. В ближайшее время с вами свяжется менеджер. В случае возникновения
вопросов Вы можете связаться с нами по телефону <номер телефона задается в админ. панели>».
Кроме того, приходит письмо менеджеру сайта о том, что принят новый заказ с данными заказа (по
аналогии с информацией клиенту).
А также:
o
Если способ оплаты ЕРИП, происходит переход на стр. «Заказ оформлен» (см. п. 4.18).
Статус заказа становится «Принят». После проведения оплаты статус меняется на «Оплачен»
и соответствующее уведомление приходит на почту менеджера сайта (Номер заказа, ФИО
плательщика).
o
Если способ оплаты наличными, происходит переход на стр. «Заказ оформлен» (номер
заказа в ЕРИП не выводится). Статус заказа становится «Принят».
o
Если способ оплаты WebPay, происходит переход на страницу платежной системы с
дальнейшими шагами процесса оплаты. По завершению процедуры оплаты статус заказа
становится «Оплачен», а также приходит соответствующее уведомление пользователя и
менеджера сайта.
4.18
Заказ оформлен (Шаблон 18)
Страница содержит следующие элементы:
 Шапка
 Элемент навигации «Хлебные крошки»
 Блок «Заказ принят»
 Кнопки перехода
 Футер
Блок «Заказ принят».
o
«Заказ успешно оформлен!»
o
Номер вашего заказа: <номер> от <дата>.
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
25
o
Номер заказа в системе ЕРИП <номер> (если способ оплаты ЕРИП)
o
Текстовый блок (задается из админ. панели)
Кнопки перехода «Продолжить покупки» (на главную), «Смотреть новости и акции» (на ),
«Подобрать спецпредложение».
4.19
Личный кабинет дилера (Шаблон 19)
Страница содержит следующие элементы:
 Шапка
 Элемент навигации «Хлебные крошки»
 Заголовок страницы
 Данные дилера
 Файлы для скачивания
 Футер
Данные дилера. Все регистрационные данные выводятся в текстовых полях. Кнопка «Сохранить
данные» по умолчанию не активна. При установлении курсора в текстовое поле кнопка
активизируется.
4.20
Результаты поиска (Шаблон 20)
Страница содержит следующие элементы:
 Шапка
 Элемент навигации «Хлебные крошки»
 Меню каталога
 Текстовое сообщение
 Список категорий
 Список товаров
 Пейджинатор
 Футер
Текстовое сообщение: «По вашему запросу «…» найдено <n> результатов. Если результатов
ноль, то выводится сообщение: «К сожалению, по вашему запросу ничего не найдено».
Список категорий. В данном блоке выводятся названия категорий и количество найденных
позиций в этих категориях. По клику на категорию загружается шаблон «Список товаров» (см. п. 4.5)
со списком искомых товаров данной категории.
4.21
Страница 404 (Шаблон 21)
Страница ошибки отображается в случае, если набранная в браузере страница отсутствует или
была удалена.
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
26
Страница содержит следующие элементы:
 Логотип
 Заголовок и описание
 Ссылка на главную страницу.
5
Порядок работы
5.1
Разработка дизайна
Заказчиком предоставляются все необходимые для начала разработки дизайна материалы:
логотип, образцы фирменного стиля, текстовая, графическая информация и пр. В соответствии с
составленным техническим заданием на дизайн разрабатывается дизайн-макет Сайта.
Заказчик рассматривает предоставленный дизайн-макет. Если у Заказчика возникают
пожелания по доработке, в протоколе согласования записывается список корректировок, которые
необходимо внести. После внесения корректировок и утверждению Заказчиком, работа по дизайну
считается законченной. Если макет не удовлетворяет заказчика, Исполнитель готовит новый макет (в
соответствии с договором).
5.2
Вёрстка
Дизайн-макет нарезается на отдельные изображения, создаются шаблоны html-страниц.
Из-за отсутствия единого стандарта среди разработчиков браузеров, отображение шрифтов
может отличаться от макета, в зависимости от используемого пользователем браузера и
операционной системы.
5.3
Программирование
Производится программирование вышеописанных программных компонентов сайта. Для этого
необходим полный доступ к хостингу (по FTP и с-panel), домену, и к базам данных MySQL (PHP
MyAdmin или аналог). Готовый сайт тестируется Исполнителем, выполняются необходимые
корректировки. Производится заполнение текстовым и графическим содержанием всех разделов
сайта, по которым Заказчик предоставил информацию до момента завершения этапа интеграции.
5.4
Сдача сайта
Происходит передача паролей для администрирования сайта и статистики Google Analytics
(заказчик предоставляет аккаунт gmail + yandex).
Представитель Заказчика получает инструкцию по работе с Систе мой управления сайтом.
Разработчик проводит 2 обучающие сессии, общей продолжительностью не более 6 часов.
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.
27
На тестирование отводится не более 5 дней. В протоколе согласования записываются
найденные недоработки и неточности (если таковые имеются), после чего они исправляются
Исполнителем. Если неточности соответствуют техническому заданию, они устраняются бесплатно.
На данном этапе работа по разработке сайта считается выполненной.
Изменение дизайна и структуры Сайта, а также доработка существующего и создание нового
функционала должны происходить в соответствии с отдельными договорами на указанные виды
работ.
Возможные способы обмена данными, реализуемые в 1С:
email + txt/dbf/xml, ftp + txt/dbf/xml, офлайн в обе стороны
SOAP, онлайн в обе стороны
XML-RPC, HTTP POST, онлайн в направлении от 1С к интернет-магазину.
Другие способы обмена возможны, но нужно обсуждать.
Желательно использовать для обмена данными онлайн способы.
После выгрузки данных цен и товаров из 1С они должны с минимальной задержкой
отображаться на сайте с целью гибкой регулировки периодичности обновления данных на
сайте.
Связь с информационной системой 1С (версия 8.2.16, конфигурация Управление торговлей для
Беларуси, редакция 2.0 (2.0.10.8) доработанная.

Выгрузка
на
сайт
свойств
продукта:
наименование,
изображение,
описание,
характеристики, параметры товара для заказа, цены, остатки для разных складов.

Загрузка в 1С заказов: личные данные пользователя, группа пользователя, информация
о товарах в заказе, способ оплаты, способ доставки, цены товаров со скидкой и без, расстояние
доставки для оплаты, тариф за км, склад, стоимость доставки, итоговая стоимость.

SOAP в направлении от интернет-магазина к 1С.

В направлении от 1С к интернет-магазину HTTP POST.
Исполнитель
Мелешко Л.Г.
Нач. отдела разработки
Представитель заказчика
Масюк А.В.