---
updateDate: 2026-02-09T00:00:00Z
publishDate: 2024-07-09
publishYear: 2013
name: Cybermall
title: Интерфейс интернет-магазина
excerpt: Спроектировали интернет-магазин, который очень быстро стал лидером ниши на Дальнем Востоке.
context: Владелец бизнеса до этого никогда не занимался онлайн-продажами. Он заказал прототипы в «Собаке», нанял аутсорс-разработчиков и попробовал управлять проектом из Владивостока, в девяти часовых поясах от Петербурга.
logo:
src: ~/assets/images/portfolio/cybermall/logo.png
alt: Cybermall logo
link: https://cybermall.ru/
noCard: true
image: ~/assets/images/portfolio/cybermall/cybermall.png
imageAlt: Интерфейс интернет-магазина
thumbnail:
src: ~/assets/images/portfolio/cards/cybermall.svg
alt: Собака Павлова • КиберМолл • Спроектировали интернет-магазин
tags:
- ec
- ux-design
- mass
relatedPages:
- text: |
### Вам нужен интерфейс?
#### Заказать дизайн
Напишите нам на [we@sobakapav.ru](mailto:we@sobakapav.ru)
#### Что мы можем сделать?
[UX-дизайн](/ux-design) и [продуктовые исследования](/ux-researches), независимо или [на аутсорсе](/ux-outstaff).
collection: services
page: ux-design
relatedPages2:
- text: |
### Похожие проекты
collection: portfolio
page: domotech
- collection: portfolio
page: zapovednik
- collection: portfolio
page: avito
- collection: portfolio
page: okey
- collection: portfolio
page: petrovich
- collection: portfolio
page: otvinta-2025
- collection: portfolio
page: otvinta-2024
- collection: portfolio
page: ot-vinta
director: "«Кибермолл» стал крупнейшим кибермаркетом на Дальнем Востоке."
result:
-
src: ~/assets/images/portfolio/rp.png
text: Прототип интерфейса
link: https://soq1fw.axshare.com/
-
src: ~/assets/images/portfolio/link.png
text: Готовый сайт
link: https://cybermall.ru/
budget: ~ 650 000 ₽
review:
text: "Реальность всерьез превзошла ожидания. Обладая серьезной экспертизой в области розничной торговли и логистики, мы на тот момент являлись совершенными (почти) профанами в области электронной коммерции, и знания и опыт Ольги Павловой и ее коллег при обсуждении задач, проектировании нашего сайта и построении его интерфейса сослужили нам добрую службу. В процессе проработки с командой «Собаки» функциональной и иных составляющих сайта мы получили необходимый нам опыт, и дальнейшее развитие проекта происходило весьма динамично во многом благодаря правильному выбору провайдера этого опыта.
Разработка, которая велась с использованием аутсорса, под неусыпным оком специалистов «Собаки», выявила несоответствие подходов разработчиков, наших требований и отраслевых стандартов, что привело нас к созданию собственной команды веб-разработки полного цикла. В результате в момент запуска проекта мы получили полностью работоспособную и клиентоориентированную модель сайта и интерфейса, которые и в модернизированном варианте сайта живут до сих пор."
photo: ~/assets/images/portfolio/cybermall/person.jpg
person: Олег Александрович Косенко,
position: генеральный директор ООО «Кибермолл»
metadata:
canonical: https://sobakapav.ru/portfolio/cybermall
title: UX-дизайн • Интерфейс интернет-магазина
description: "Спроектировали интернет-магазин, который очень быстро стал лидером ниши на Дальнем Востоке."
robots:
index: true
follow: true
openGraph:
site_name: Собака Павлова
images:
- url: '~/assets/images/portfolio/cybermall/cybermall.png'
width: 983
height: 842
---
import Image from '~/components/common/Image.astro';
import TOC from '~/components/widgets/TOC.astro';
<TOC>
[Вводные](#anchor1) • [Плюсы](#anchor2) • [Минусы](#anchor3) • [Задачи](#anchor4) • [Процесс](#anchor5) • [Результат](#anchor6) • [Смысл](#anchor7) • [Отзыв, цены и сроки](#anchor8)
</TOC>
## <a name="anchor1" />Вводные
За 9 часовых поясов от Санкт-Петербурга — но все еще в России — тоже есть интернет-магазины. И весьма крупные. Даже сети. Даже сетевые кибермаркеты: сегодня заказал в Интернете — завтра получил в ближайшей точке выдачи. И все это без оперативного склада и торгового зала.
[«Кибермолл»](http://cybermall.ru/) («Домотехника») — самый большой дальневосточный кибермаркет. Сейчас. Когда мы начинали с ними работу, был только домен и эскиз логотипа. Предстояло же сделать — всё. То есть совсем всё, от найма персонала до строительства помещений. Заказчик, надо сказать, сложа руки не сидел и к нам пришел уже со своими набросками.
_Заказчик сам нарисовал прототип магазина в Axure_
Это здорово, когда заказчик смело расчехляет Axure и пробует проектировать интерфейс самостоятельно. Ему становится понятно, что ценность работы проектировщика не в том, чтобы квадратики по экрану раскидать, а в том, чтобы сделать это осмысленно. Чем мы и занялись.
Очевидно, интерфейсы сайта и торгового киоска для кибермаркетов — задача важная. Ведь других способов сделать заказ, кроме как потыкать кнопочки и попереходить по ссылкам, у покупателей нет. На ловкость продавцов торгового зала или телефонных операторов рассчитывать не приходится: всё взаимодействие от выбора товара до платежа и отслеживания доставки должно происходить через компьютер.
_Понятные вводные от заказчика_
Казалось бы, ничего сложного: бери [«Юлмарт»](http://www.ulmart.ru/) и клонируй себе потихоньку. Но так уж вышло, что опыт создания интерфейсов для «Юлмарта» у нас тоже был — и о том, что нельзя просто так взять и спионе… творчески переосмыслить чужой интерфейс, мы знали преотлично. Слишком много «но», совершенно другие технические и организационные вводные, иной бизнес-опыт, даже привычки пользователей на Дальнем Востоке отличаются от среднероссийских.
Так в чем же специфика Кибермолла? Поговорили и выяснили вот что.
### <a name="anchor2" /> Плюсы
>**Внятный генеральный заказчик**
>Очень конструктивный и ответственный управленец, быстро принимающий решения и на лету схватывающий новые для себя концепции интернет-торговли.
>**Нет «исторически сложившихся» бизнес-процессов**
>Работу кибермаркета можно сразу строить от потребностей пользователя.
>**Наш зашкаливающий опыт**
>Мы уже много раз делали и кибермаркеты, и платежные сервисы, и прочий e-commerce. Знаем, что надо, а что — лишнее. Знаем подводные грабли. Обычно опыт исполнителя особо не пригождается, но здесь бросалось в глаза: наш опыт — гораздо, гораздо больше и глубже, чем опыт заказчика, и наверняка здорово ускорит дело.
>**Наполнение каталога**
>Для интернет-магазинов фотографии, описания и прочие отзывы — это больная тема. К счастью, у Кибермолла с наполнением каталога все было неплохо, и тут можно было хотя бы не волноваться.
### <a name="anchor3" /> Минусы
>**Команда разработки**
>Ее нет. Точнее, она как бы есть на аутсорсе, но недостаточно сильная. И всем это ясно, но коней на переправе тоже менять страшно.
>**Руководитель проекта**
>Его тоже нет. Но это полбеды: нет и понимания, что без руководителя проекта, на одном генеральном заказчике, такой объем работ не провернуть.
>**Старое техническое решение**
>Досталось в наследство от офлайн-компании, на базе которой создается «Кибермолл». Надо использовать.
>**9 часовых поясов разницы**
>Когда общаться, как обсуждать оперативные вопросы? Когда разница невелика (3–4 часа), можно найти общее время для созвонов и чатов. А если вы совсем не пересекаетесь с клиентом по рабочим часам?
>**Экстремальные сроки запуска бизнеса**
>Нам-то что, мы можем быстро и даже очень быстро решать свои задачи. Но с нуля за 2 месяца запрограммировать и внедрить в коммерческую эксплуатацию систему с развесистым backend'ом и сложной внутренней интеграцией? Задача на грани реальности.
## <a name="anchor4" /> Задачи
Планов громадье, но что реально можно и нужно сделать в такой ситуации? И зачем?
Пожалуй, «зачем» бросалось в глаза: ясно, что у заказчика большие проблемы с командой проекта, уровнем ее профессионализма и осмысленностью действий. Значит, нам нужно сделать то, что команда прямо сейчас без внешней помощи сделать не может. И сделать это так, чтобы результаты нашей работы коллеги из «Кибермолла» могли взять в оборот — и развивать дальше уже самостоятельно.
Итак, мы делаем минимальный набор каких-то штук про цифровое обслуживание, с которыми заказчик уже дальше управляется самостоятельно. Что же это за штуки?
Мы попредлагали, заказчик посоглашался и поотказывался, и в результате получился вот такой минимальный набор задач на проект.
### 1. Интерфейс процедуры заказа
Ничто не должно отвлекать покупателя от оформления покупки, если уж он решил эту покупку сделать! Ни мучения со способом доставки, ни неопределенности с оплатой, ни проблемы с наличием товара — ничто.
### 2. Каталог товаров
Он должен быть в достаточной степени стандартным и привычным опытному пользователю. Но с учетом того, что далеко не все покупатели так уж хорошо знакомы с форматом гипермаркета и онлайн-покупками в принципе.
### 3. UX-сопровождение разработки
Технической команде оказалось недостаточно просто прототипов, нужно было очень плотно общаться по нюансам реализации. Иначе велик был риск сделать не то, не так и не туда.
В целом история вписывалась в нашу услугу «Интерфейсы массового обслуживания».
### <a name="anchor5" /> Процесс
Как обычно, у проекта был менеджер с нашей стороны. И проектировщик. И чуть-чуть аналитика. Плюс как внутреннего эксперта привлекли Ольгу Павлову (это было особо оговорено в контракте).
_В 2013 году этот личный кабинет казался вершиной удобства_
Жанр кейса требует исторической правды, и вот она: работа шла не слишком гладко. Дело в том, что разница в 9 часовых поясов очень, очень мешала общению и принятию оперативных решений. Не слишком помогали ни Skype, ни телефон, ни тем более электронная почта: клиент просто работал в другом ритме, и нам никак не удавалось удержать фокус внимания генерального заказчика на проблемах и задачах проекта. Как мы не устаем повторять, коммуникация — залог (и даже заложник) успеха. В этот раз, к сожалению, именно заложник.
_Типовая страница продукта. Все прототипы мы наполняет релевантным текстом, так как это создает более законченный вид, влияет на восприятие, заставляет продумывать все возможные состояния_
Однако где наша не пропадала: заказчик потерялся в дальневосточном тумане — будем работать без заказчика. Благо экспертизы хватает.
_В этом проекте мы делали только прототипы. Дизайн не трогали_
Всё делали как обычно: фаза анализа, моделирование и поиск концептуального решения, а там уж и проработка деталей. Быстро-быстро и срочно-срочно.
### <a name="anchor6" />### Результат
Оглянуться не успели — а уже и вот он, _достаточно_ хороший прототип интерфейса с _достаточно_ четкими инструкциями. И _достаточно_ осознавшая ситуацию команда. Ура, _вроде бы_ все три цели достигнуты.
_Финальный макет. Страница каталога_
[Прототип интерфейса](https://soq1fw.axshare.com/#p=%D0%BE%D0%BF%D0%B8%D1%81%D0%B0%D0%BD%D0%B8%D0%B5_%D0%BF%D1%80%D0%BE%D0%B5%D0%BA%D1%82%D0%B0)
Но что за «достаточно» и почему «вроде бы»?
Дело в том, что в этом проекте у нас не было задачи найти идеальное решение. Нужно было только сделать быстро и не слишком ошибиться. Соответственно, показателем успеха была не эффективность интерфейса, а — внедряемость.
Как же оценить эту «внедряемость», по каким критериям? У нас получилось вот что.
- Команда разработки приняла прототипы в работу.
- Прототипы не потребовали эстетических доработок (визуального дизайна).
- В предлагаемом интерфейсе были проработаны ключевые пользовательские сценарии.
- С помощью справочной системы пользователи могли начать делать покупки.
- Интерфейс универсально внедрялся и в веб-среде, и на терминалах.
- Заказчик чувствовал уверенность в том, что дальше справится сам.
Интерфейс реализовали почти без изменений. Этого оказалось вполне достаточно, чтобы запустить бизнес и дальше двигаться самостоятельно. Сейчас потихоньку эволюционировал и теперь выглядит вот так.
_Со временем cybermall.ru оброс дополнительными функциями, но наши наработки заметны даже сейчас_
_На главной странице появились слайдер и баннеры_
### <a name="anchor7" /> Смысл
Проект был не совсем обычный. Заказчик был не совсем обычный. Результат, впрочем, получился вполне обычный: мы взяли свои знания предметной области и использовали их в полуслепом — без тестирования на людях — и очень быстром проектировании.
Кажется, основная польза от нашей работы была в том, что мы довели ее до конца. Потому что знали, как это сделать даже без плотного участия заказчика.
Проекты, которые кто-то начал, но не закончил, — действительно бич российского IT. На старте ведь всегда кажется, что работы немного, особой квалификации не нужно, серьезный бюджет не требуется, а исполнители выстроятся в очередь. Когда оказывается, что это немножко не так, заказчик часто сначала теряется, а потом и бросает затею на полпути.
Бизнес «Кибермолла» все-таки стартовал. В основном, конечно, благодаря упорству и настойчивости генерального заказчика. Но и наши целеустремленность и знание, что надо — а что не надо — делать, надеемся, здорово тому поспособствовали».
### <a name="anchor8" />