Разработка прототипа для сайта услуг по ЖД перевозкам

Прототип сайта услуг по ЖД перевозкам. Сегодня рассмотрим прототип сайта услуг по ЖД перевозкам, что должно в него входить, и как он должен выглядеть.

1 Этап анализ конкурентов

Для того, чтобы понять какие страницы должны быть на сайте и с какими коммерческими факторами необходимо сделать анализ конкурентов, что у нас было сделано.

Проанализировано 15 конкурентов и выбраны растущие, на основании этих данных выписаны страницы каждого конкурента.

Пример, как делать анализ конкурентов рассказано в статье "SEO анализ конкурентов для будущего проекта".

2 Этап анализ коммерческих факторов сайтов конкурентов

На данном этапе как раз происходит анализ коммерческих факторов. По итогу у нас получается список пересечений по коммерческим факторам, которые присутствуют у всех конкурентов, и которые дополнительно можно добавить.

Пример коммерческих факторов главной страницы:

1) Логотип

2) Телефон

3) Кнопка “Заказать звонок”

4) Гео

5) Слайдер

6) Категории

7) Оплата

8) Работы

9) Отзывы

10) Вопрос-ответ

11) Прайс

12) И т.д.

3 Этап построения структуры типовых страниц и их вложенность

На данном этапе мы выстраиваем структуру типовых страниц и их вложенность. Результатом будет карта зависимостей и какие прототипы необходимо будет реализовать.

4 Разработка прототипа с учетом п.2

Сейчас мы разберем пример построения прототипа страницы услуги

Прототип страницы услуги

Прототип отдельной услуги по ЖД перевозкам

Прототип 1 - Отдельная услуга - Баннер

Из прототипа 1:

1. Хлебные крошки
2. Н1
3. Калькулятор, как на главной

Прототип 2 - Отдельная услуга - Об услуге

Из прототипа 2:

1. Н2
2. Текст 1500 символов. Предусмотреть различные типы списков - нумерованный и ненумерованный
3. Баннер к услуге

Прототип 3 - Отдельная услуга - Таблица цен услуги

Из прототипа 3:

1. Н2
2. Тип перевозки
3. Активный таб
4. Неактивный таб
5. Выбор страны отправки
6. Ссылка на скачивание прайса
7. Таблица - строка. При наведении активная
8. Таблицы - столбы. Редактируемые
9. Текст 2 строки
10. Кнопка “Калькулятор” при нажатии открывается боковая форма
11. Ссылка на все тарифы

Прототип 4 - Отдельная услуга - Теги

Из прототипа 4:

1. Н2
2. Тег - кнопка услуги, при наведение активность, при нажатии переход
3. “Показать ещё”, при нажатии показываются все теги и заменяется на “Скрыть”

Прототип 5 - Отдельная услуга - Как работаем

Прототип 6 - Отдельная услуга - Часто задаваемые вопросы

Прототип 7 - Отдельная услуга - Форма

Из прототипа 7:

1. Н2
2. Кликабельный телефон
3. Кнопка “Оставить заявку”, при нажатии открытие боковой формы
4. Кнопка “Начать чат - менеджер в сети”, перекидывает на чат с менеджером
5. Кнопка “Обратный звонок”, при нажатии открывается боковая форма

Прототип 8 - Отдельная услуга - ГЕО

Итог

Мы с вами рассмотрели построение прототипа на основании действующего проекта. Я вам подробно расписал, как строился прототип страницы услуги по ЖД перевозкам, и какие элементы использовались для построения.

Прототип - это экономия времени на реализацию дизайна сайта, а также творческий рубеж для маркетолога и seo оптимизатора.

В следующем кейсе по прототипам рассмотрим построение другой страницы.

P.S. Прототип - это не дизайн, и в дизайне может отличаться расположение кнопок и ссылок, но вся суть сохраняется в том виде, в котором мы ее закладываем.