---
updateDate: 2026-02-10T00:00:00Z
publishDate: 2024-07-25
publishYear: 2018
name: E-gorod
title: Сайт амбициозного регионального провайдера
excerpt: Обновили позиционирование компании без всякого маркетинга — только текстами и дизайном.
context: У провайдера был десяток-другой услуг, но подать он их не умел. Поэтому клепал лендинг за лендингом. В какой-то момент руководство поняло, что это только вредит компании. И обратилось к нам.
logo:
src: ~/assets/images/portfolio/e-gorod/logo.svg
alt: Электронный город logo
link: https://2090000.ru/
image: ~/assets/images/portfolio/e-gorod/e-gorod.png
imageAlt: Сайт амбициозного регионального провайдера
thumbnail:
src: ~/assets/images/portfolio/cards/ecity.svg
alt: Собака Павлова • Электронный город • Редизайн сайта
tags:
- telecom
- ux-design
- ux-outsource
- mass
- ecity
relatedPages:
- text: |
### Вам нужен интерфейс?
#### Заказать дизайн
Напишите нам на [we@sobakapav.ru](mailto:we@sobakapav.ru)
#### Что мы можем сделать?
[UX-дизайн](/ux-design) и [продуктовые исследования](/ux-researches), независимо или [на аутсорсе](/ux-outstaff).
collection: services
page: ux-design
- text: |
### Хотите уметь так же?
Научим создавать хорошие интерфейсы.
collection: promo
page: mio
- collection: promo
page: uc
relatedPages2:
- text: |
### Похожие проекты
collection: portfolio
page: e-gorod-mobile
- collection: portfolio
page: novotelekom
- collection: portfolio
page: e-gorod-guide
- collection: portfolio
page: stream-telecom
- collection: portfolio
page: fastvps
- collection: portfolio
page: yota
result:
-
src: ~/assets/images/portfolio/rp.png
text: Прототип сайта
link: http://proto.pavlova.cc/NTAHTT/
budget: ~ 1 900 000 ₽
review:
text: |
Проработаны многие детали, и коллеги погрузились в продукт с головой во время работы.
«Собаку» уже всем рекомендую, недавно вот знакомым застройщикам рекомендовал. Для каких задач? Я говорю всем так — если хотите продуманный сайт, который будет отвечать 90% потребностей ваших клиентов, тогда не поскупитесь и работайте с «Собакой».
photo: ~/assets/images/portfolio/e-gorod/person.png
person: Степан Антонов,
position: руководитель отдела маркетинга
director: Компания разработала сайт по нашим прототипам и, что важнее, узнала, как позиционировать себя на рынке.
metadata:
canonical: https://sobakapav.ru/portfolio/e-gorod
title: Дизайн интерфейсов • Сайт регионального провайдера
description: "Сделали новый UX-дизайн сайта и переписали тексты с заботой о пользователе — обновили позиционирование компании без маркетинга. Интерактивный прототип — внутри."
robots:
index: true
follow: true
openGraph:
site_name: Собака Павлова
images:
- url: '~/assets/images/portfolio/e-gorod/e-gorod.png'
width: 1333
height: 1099
---
import TOC from '~/components/widgets/TOC.astro';
<TOC>
[Бизнес-задача](#anchor1) • [Дизайн-задачи](#anchor2) • [Плюсы и минусы](#anchor3) • [Дизайн-процесс](#anchor4) • [UX-исследование](#anchor5) • [Концептуальный дизайн](#anchor6) • [Дизайн интерфейса](#anchor7) • [Результат](#anchor8) • [Смысл](#anchor9) • [Отзыв, цены, сроки](#anchor10)
</TOC>
## <a name="anchor1" />Бизнес-задача
[«Электронный город»](https://2090000.ru/) — крупнейший интернет-провайдер Новосибирска. Помимо Интернета он предлагает несколько пакетов цифрового ТВ, аренду телеприставок, организацию видеоконтроля, ремонт техники, офисную телефонию и прочие «околоинтернетные» услуги для физических и юридических лиц.
_Главная страница прошлого сайта предлагала приоритетные услуги, но не показывала все — для этого нужно было перейти в специальный раздел_
Дела у «Электронного города» идут неплохо. Услуги качественные, доля рынка большая, клиентское обслуживание на уровне, бизнес-процессы отлажены. Словом, добротный провайдер, который заботится о своих клиентах.
Вот только по сайту этого было не видно. Созданный в 2012 году, он оброс лендингами, всплывающими окнами, разномастными разделами. От этой пестроты у пользователя рябило в глазах: ни общей логики, ни единого стиля, попробуй разберись, куда кликать.
_Вряд ли хоть раз было так, чтобы кто-то увидел это всплывающее окно и спонтанно решил подключить интернет_
## <a name="anchor2" />Дизайн-задача
После общения стало понятно, что проблема не в структуре и не в дизайне сайта — ее корни глубже. За каждое направление отвечает свой менеджер. И каждый по отдельности делает все хорошо. А вместе получается письмо дяди Федора. Нет единого подхода к коммуникации с клиентом в цифровой среде.
Нам нужно было вместе с командой заказчика выработать общий подход к цифровой коммуникации и разработать стандарты представления услуг на сайте.
## <a name="anchor3" />Плюсы и минусы
>**+ Клиентоориентированность**
>Не на словах, а на деле. Например, для клиентов провайдера мелкий ремонт компьютерной техники — бесплатно.
>**+ Желание меняться**
>Заказчик пришел к нам не просто за прототипом сайта, а с желанием качественно изменить свое присутствие в цифровой среде.
>**+ Выстроенные бизнес-процессы ответственности**
>Контакт-центр, центры обслуживания — всё есть. Регламенты предоставления услуг соблюдаются.
>**- Заниженная самооценка**
>Лидер регионального рынка чувствует себя неуверенно на фоне менее успешных в регионе федеральных брендов.
>**- Сложности с позиционированием**
>Заигрывание с аудиторией и бравада неуместны, когда целевая аудитория — это не только подростки и молодежь.
>**- Конкуренция услуг**
>Второстепенные услуги перетягивают на себя внимание. Да, их тоже надо продвигать, но они не могут конкурировать по массовости с основными направлениями.
## <a name="anchor4" />Дизайн-процесс
Проблемы с сайтом были видны невооруженным глазом. А вот решение не казалось таким уж очевидным. Понятно, что в итоге должны были появиться прототипы нового сайта. Но между фиксированием текущей ситуации и проектированием явно должно что-то произойти. План действий был такой.
1. Изучить бизнес и составить его описание. Что предлагает компания, как именно, что думают обо всем этом ее сотрудники.
2. Узнать, как видят «Электронный город» его клиенты.
3. Сравнить нынешний имидж (сайт) с представлением заказчика о самом себе и с представлениями и ожиданиями клиентов.
4. Разработать концепцию нового сайта.
5. Выполнить в рамках концепции проектирование.
Пунктов всего пять, но за ними — огро-о-о-омный план производства.
_Хороший план — половина успеха и гарантия взаимопонимания с клиентом. А если в нем еще указать часы, вас будут на руках носить_
[План производства](https://drive.google.com/file/d/1XDD-hjgYXdlxzOq1_PMJYUIaOsGTkPJd/view?usp=sharing)
## <a name="anchor5" />UX-исследование
Мы в Петербурге, «Электронный город» в Новосибирске. Объемы интервью никак не позволяли провести их по скайпу, поэтому два аналитика отправились в Новосибирск. Нет смысла подробно рассказывать, что мы выяснили. Информации было много, очень много. Опросили 15 сотрудников провайдера, провели 12 полных и 7 экспресс-интервью с клиентами.
При таких масштабах неизбежно появляется куча документов. Мы не любим писать документы, мы любим делать продукт. Но без бумажной работы было не обойтись — просто не удержать все в голове.
1. Портреты пользователей — юридические и физические лица. Для общего понимания аудитории и как отправная точка для последующей детализации.
2. Жизненные ситуации и сценарии. Общие ожидания от сайта — что на нем можно сделать.
>Use cases — пользовательские сценарии, сценарии взаимодействия, сценарии использования, пользовательские сценарии — последовательное описание поведения человека при взаимодействии с системой и системы, когда с ней взаимодействует человек. У нас есть [модуль дизайн-задачника «Сценарии взаимодействия»](https://www.eduhund.ru/program/usecases/?utm_source=sobakapav&utm_medium=site&utm_campaign=page) для тех, кто хочет научиться их использовать в дизайне интерфейсов.
3. Вопросы пользователей об услугах. О чем должен рассказывать сайт.
4. Список услуг — 15 для физических лиц, 9 для юридических. То, что нужно отразить на сайте.
5. Анализ пользовательской активности. Откуда пользователи приходят на сайт и что там делают.
6. Сводные результаты бизнес-интервьюирования. Что думают сотрудники «Электронного города» о себе и своих клиентах.
_Если поговорить с сотрудниками компании, записать разговоры и структурировать тезисы, можно составить документ, который покажет все проблемы станет основой техзадания_
Чтобы не потонуть в документах, сделали конспект.
_Все задачи — на одной странице. Полезно держать перед глазами, чтобы ничего не забывать_
[Summаry и опорный конспект брейншторма](https://drive.google.com/file/d/1XmJnbUTLzEVrAXbSeYg1-KRLAZiWFDKx/view?usp=sharing)
## <a name="anchor6" />Концептуальный дизайн
Мы выделили ключевые проблемы и предложили точечные решения.
_Каждую большую проблему можно декомпозировать и решать по частям. Браться за все сразу обычно значит не сделать ничего_
А потом — объединили эти точечные решения в общую историю.
[Концепция цифровой представленности](https://drive.google.com/file/d/1Xn9G5McEEsWJS3bnXmIzwDyFAd6a7nfN/view?usp=sharing)
Основная работа — разговоры. Внутри команды и с заказчиком. Нам нужно было рассказать про каждый пункт. Убедиться, что заказчик согласен с нашими выводами. Или не согласен — тогда понять в чем.
### И как жить дальше?
В сухом остатке — принять, что сейчас на сайте маркетинговая каша. Избавиться от нее раз и навсегда помогает принцип «что не опубликовано, того не существует». Сделать для каждого руководителя понятный маркетинговый инструмент для сборки промостраниц. Это сразу поднимает много вопросов — и про модульную CMS, и про редакцию. Серьезные вопросы, которые «Электронному городу» придется прорабатывать самостоятельно. Наша задача — указать направление и помочь сделать — даже не первый шаг, первую сотню.
## <a name="anchor7" />Дизайн интерфейса
На примере ключевых страниц нам надо было показать, как должны выглядеть продуктовые страницы. Общая идея — сделать их не столько рекламно-зазывными, сколько отвечающими на вопросы пользователей.
_Проектировать на бумаге проще и быстрее. Что еще важнее, с такими артефактами не жалко расставаться — их себестоимость ничтожна. Если рисовать сразу в дизайне и тратить на каждую страницу по несколько часов, никто не позволит вам перепробовать четыре-пять разных подходов_
В главном меню — полный порядок, а на главной странице в целом — раздолье маркетологам. И большой баннер, и пакетные предложения, и мини-баннеры в меню. Раньше рекламность конкурировала с логичностью, сейчас они мирно уживаются вместе.
Еще один пример, когда желание продавать не мешает заботе о пользователе. На одном экране и вполне себе коммерческое предложение с подарками к тарифу и бесплатным тестированием оборудования, и достаточно подробное описание услуги «Социальный Интернет».
_На этой странице достаточно рекламы. Но она не выглядит навязчивой, потому что предлагает пользу_
На странице про цифровое телевидение для нового пользователя — рекламная информация, что телевизор можно смотреть на компьютере и смартфоне, для клиента эти же блоки — ссылки на приложения.
_Рекламные блоки выглядят как органичная часть сайта и тоже делятся полезной информацией_
Реверанс для любителей конструкторов. Да, львиная доля пользователей позвонит или оставит заявку, но есть и те, кто хочет «поиграть с тарифами».
_Дополнительные услуги можно предлагать в формате конструктора — так у человека не возникнет ощущения, будто ему что-то навязывают_
Если страницы услуг можно считать в большей степени информационными, предназначенными для спокойного изучения сверху вниз, то в личном кабинете нужно было проработать ситуации и сценарии.
_Удивительно, но личный кабинет нужен не только пользователю. Если человек не найдет на сайте важную информацию или не сможет выполнить важное действие, он будет звонить в техподдержку. А это — дополнительная нагрузка на сотрудников_
Для разработчиков в прототипе есть комментарии.
_Если не описать, как ведет себя каждый элемент на сайте, разработчик может привязать к нему не то действие и слегка разрушить ваш труд_
## <a name="anchor8" />Результат
[Прототипы](http://proto.pavlova.cc/NTAHTT/) отправились в разработку. Но цель была не только в прототипах, а в том, чтобы помочь заказчику почувствовать себя увереннее в цифровом мире. И, кажется, нам это удалось.
## <a name="anchor9" />Смысл
Разработка сайта — особенно когда речь идет о сайте крупной компании с разными услугами — это не картинки, не прототипы и даже не контент. В первую очередь заказчик должен осознать, что именно ему нужно. Для этого не требуется быть гуру в разработке сайтов. Плохо, когда ему просто приносят картинки и говорят «делай так». Наша задача — подвести заказчика к решению через осознание текущей ситуации, выявить все проблемы и обсудить решения в контексте бизнес-процессов компании, показать смысл каждого этапа. А после этого — да, можно и прототипы, и дизайн.
## <a name="anchor10" />