Этапы разработки сайта и приложения – что стоит за каждым шагом индивидуальной веб-разработки

Это третья статья цикла для IT-директоров и директоров по развитию/маркетингу про разработку сайтов и мобильных приложений. В предыдущей статье мы рассказали про цели разработки сайта и приложения, а также пояснил, кому подходит индивидуальная разработка IT-решений. Сегодня речь пойдет именно о ней — это не просто удобство, а стратегический актив. IT-директора сталкиваются с задачей не просто создать сайт или приложение, а выстроить цифровую экосистему, обеспечивающую бизнесу конкурентные преимущества. 

Сложная (= индивидуальная, “под ключ”) веб-разработка — это создание высоконагруженных, масштабируемых и интегрированных с внешними системами решений, которые помогают бизнесу достигать целей, оптимизировать процессы и удерживать клиентов. Разберём ключевые этапы индивидуальной разработки – важность каждого, вызовы и способы их решения.

Этап 1: Сбор требований и предпроектное обследование
(2–4 недели)

Все начинается с опроса клиента и проблемного интервью – почему этот проект важен для бизнеса клиента, как сейчас он решает эту задачу, что конкретно его не устраивает. Важно также понять, как эта задача / проблема выглядит со стороны собственника / инвестора, ИТ директора, директора по маркетингу. Далее прежде чем, что-то предлагать, важно уточнить, как сам заказчик видит будущее решение (сайт, приложение, архитектуру, экосистему), какие варианты рассматривал, что в них нравится или не нравится, когда нужно решение, какие есть ожидания или рамки по бюджету, плану финансирования. После этого нужно понять, в чем конечная цель разработки, критерии успеха проекта.

Почему важно?

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

Вызовы (какие проблемы могут возникнуть, на что обратить внимание)

• Отсутствие точного понимания бизнес-задач и целей проекта, что может привести к ошибочному выбору решения, например, его избыточности или недостаточности с точки зрения функционала и сроков.

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

• Недостаточная проработка технико-экономического обоснования и коммерческого предложения для презентации и совместной защиты проекта перед инвестором, что может повлиять на выделение бюджета

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

Решение (что делаем):

1. Интервью с заказчиком. Определение запросов, ожиданий и конечной цели проекта.

2. Оценка технических рисков. Проверка совместимости технологий, анализ возможных узких мест.

3. Предпроектное формирование концепции. Разработка состава, архитектуры системы, определение структуры баз данных, API и серверных решений.

4. Предпроектная оценка бюджета и сроков. Подготовка детализированной сметы и плана работы, дорожной карты проекта.

Цифры:

• 70% IT-проектов проваливаются из-за отсутствия глубокого анализа в начале (данные PMI).

• Чётко сформулированные требования сокращают затраты на переделки на 30–50%.

• Компании, которые проводят исследование, увеличивают шансы успешного завершения проекта на 39%.

Итогом предпроектного обследования является:

1. Состав проектной документации – описаны проектируемые системы и подсистемы, разделы.

2. Оценка проектирования решения – определена стоимость разработки концепции и сроки ее реализации.

3. Предварительная оценка состава и стоимости решения, включая план (дорожная карта) по его реализации

Этап 2: Проектирование и разработка прототипов
(3–6 недель)

В рамках второго этапа разрабатывается концепция – создаются схема решения, общее ТЗ, прототипы, которые формируют структуру интерфейсов, дизайн, ЧТЗ (частное техническое задание). Анализируются бизнес-процессы, выявляются потребности пользователей, определяются требования к будущему продукту – это основа для грамотного проектирования.

Почему важно?

На этапе ППО определяются требования и ограничения, но как именно их реализовать — решается на этапе проектирования. Проектирование — это фундамент успешной разработки. Без него проект будет страдать от перерасхода бюджета, задержек и технических проблем. Прототипирование снижает риск изменения логики системы на 60%. Помогает увидеть проект до его реализации, оптимизировать этапность реализации и определиться с функционалом MVP-версии проекта, за счет чего существенно сократить бюджет. В ходе проектирования учитываются не только функциональные рамки и цели проекта, но и бюджетные и временные рамки, в которые необходимо вписать проект.

Вызовы (Какие проблемы могут возникнуть, на что обратить внимание):

• Низкая удовлетворенность пользователей

• Ошибки в архитектуре и сложности с масштабированием

• Хаотичная разработка и постоянные переделки

• Неучтенные требования или процессы

• Проблемы с интеграцией и стабильностью работы процессов

• Потребность в доработках, превышение бюджетов и сроков

Решение (какие работы проводятся):

• Анализ конкурентов и референсных проектов – исследование существующих решений на рынке, их сильных и слабых сторон

• Исследование целевой аудитории – формирование портрета пользователя, его потребностей для создания удобного и востребованного продукта.

• Разработка UX/UI-дизайна, прототипов решения – наглядное представление функционала и внешнего вида будущего проекта

• Разработка концепции, схемы решения, с определением окружения, деления на подсистемы, необходимых интеграций и др.

• Разработка общего технического задания на решение (ОТЗ) и разработка ЧТЗ на отдельные элементы или первый этап проекта.

• Уточнение сроков и стоимости согласно ЧТЗ, с корректировкой требований для соблюдения бюджетных рамок проекта и его сроков. 

Цифры:

• Улучшение UX повышает конверсию на 35%, а удобный интерфейс снижает отказы на 50%

Итогом этапа Проектирование и разработка прототипов является 

Общее с клиентом понимание о структуре, функционале будущего проекта (сайта, мобильного приложения, веб-сервиса IT-экосистемы), а также стоимости, сроках и плане его реализации. Клиент получает:

1. Общее ТЗ, включая схему решения / концепцию;

2. Согласованные прототипы и дизайн решения;

3. ЧТЗ на первый этап, для старта разработки;

4. Подробная матрица оценки проекта по ЧТЗ;

5. План /проекта, с делением на этапы и сроки.

Этап 3: Разработка и тестирование
(6-9 месяцев)

В начале создаётся минимально жизнеспособный продукт (MVP), включающий ключевой функционал, решающий основную задачу проекта, который можно протестировать на реальных пользователях. Далее разработка идет спринтами – совместно с заказчиком определяется фронт работ из числа описанных на этапе проектирования, на следующий временной промежуток, готовится частное ТЗ.

Почему важно?

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

Вызовы (какие сложности могут возникнуть во время разработки):

• Долгая разработка без обратной связи

• Большие вложения при долгом ожидании запуска

• Превышение трудозатрат, бюджета проекта

• Несогласованность работы между несколькими подрядчиками

• Срыв сроков запуска проекта, потеря рынка, возможностей

• Потребность в изменениях и дополнениях ТЗ (ЗНИ – запрос на изменение)

• Несовпадение ожиданий с согласованным ТЗ

• Низкое качество решения, ошибки при запуске

Решения:

• Внедрение на проекте гибкой методологии Agile или Организация работ по Scrum, итеративный подход

• Ранний запуск базовой версии MVP

• Выпуск новых функций по готовности

• Поэтапное финансирование (помесячный БДР)

• Контроль соответствия освоенных инвестиций с результатом

• Календарный план, управление сроками и содержанием

• Определение ключевых вех (результатов проекта)

• Включение изменений только с уточнением сроков / бюджета

• Отказ от ТЗ на весь проект в пользу небольших ТЗ на этап

• Функциональное и нагрузочное тестирование

• Кроссбраузерное и кроссплатформенное тестирование

Цифры:

• Компании, запустившие MVP перед полной разработкой, снижают затраты на 35% (CB Insights).

• Каждая ошибка, найденная после запуска, обходится в 15 раз дороже, чем во время тестирования.

• 80% пользователей удаляют приложение после первого зависания (Google).

• Тестирование снижает вероятность сбоев в продакшене на 90%.

Итогом этапа является первая итерация решения / его минимально жизнеспособная версия, решающая основную задачу, клиент за счет этого получает быстрый запуск проекта, отдачу инвестиций, их рефинансирование в дальнейшее развитие проекта и возможность варьировать последующий запуск дополнительного функционала в рамках ранее составленного и утвержденного плана работ и корректировать план с учетом опытной эксплуатации работающего решения. В итоге клиент получает отлаженный, готовый к запуску, проект без критичных ошибок.

Этап 4: Опытная эксплуатация
(2–4 недели)

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

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

Вызовы (какие сложности могут возникнуть):

• Провал запуска, большое количество багов – потеря клиентов.

• Непредвиденные ошибки в продакшене, которые ведут к потере клиентов.

• Отсутствие возможности тестирования проекта на ограниченной аудитории

• В реальной работе пользователи используют процессы иначе

• Некоторые сценарии работы оказались непродуманными

• Неожиданные ситуации, которых не было в тестах

• Сопротивление пользователей

• Сбои интеграций проекта при нагрузке

Решения:

• Протестировать в боевых условиях без участия реальных пользователей

• Включить ключевых пользователей в тестирование на ранних этапах.

• Запустить пилот на ограниченной группе клиентов / сотрудников

• Адаптировать систему к реальным процессам на основе обратной связи.

• Постепенный запуск (staged rollout)

• Мониторинг системы в первые недели работы

• Оперативное исправление выявленных багов

• Мониторинг метрик и сбор фидбэка

• Оптимизация на основе полученных данных

• Внедрять автоматизированное тестирование

Цифры:

• Грамотно проведённый запуск снижает риск технических проблем на 40%.

• Стартапы, анализирующие пользовательское поведение перед полным запуском, увеличивают шансы на успех на 80%

В итоге клиент получает стабильно работающий сайт/веб-сервис/мобильное приложение.

Этап 5: Поддержка и развитие
(постоянно)

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

Почему важно?

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

Вызовы (какие сложности могут возникнуть):

• Быстрое устаревание технологии, появление новых устройств;

• Обрастание проекта все новым функционалом, потеря в надежности;

• Отсутствие времени и бюджета на рефакторинг и документирование;

• Сложность с обеспечением оперативной техподдержки пользователей;

• Смена специалистов, потеря знаний о проекте

• Обновление смежных систем и сбои в работе интеграций

Решения:

• Регулярные обновления и доработка проекта, адаптация под новые устройства

• Обкатка любого нового функционала сначала в тестовом поле

• Регулярный рефакторинг

• Пересмотр архитектуры проекта вместе со значительными изменениями

• Мониторинг системы и заблаговременное отлавливание багов

• Ведение документации и базы знаний о проекте, систематизация кода

• Тестовое окружение для интеграций, гибкая архитектура для корректировок

Цифры:

• 60% ресурсов ИТ-отделов тратится на обслуживание устаревших систем и технического долга

• Снижение техдолга на 20-40% позволяет высвободить до 30% времени команды на разработку новых функций

• Рефакторинг кода позволяет сократить инфраструктурные затраты на 20-30% и  ускорить работу системы на 20-60% 

• 45% проектов затягиваются из-за сложности кода. Четко задокументированные системы снижают трудозатраты на поддержку на 20-40%.

• Регулярная поддержка снижение вероятность сбоев на 40-60%. Снижение финансовых потерь от простоев на 30-50%.

В итоге клиент получает сайт/веб-сервис/мобильное приложение, которые остаются актуальными из года в год, благодаря постоянной работе над ними.

Заключение

Создание технически сложных веб-сервисов, сайтов и приложений — это многогранный процесс, требующий тщательной подготовки, проработки архитектуры и точной реализации. Успех зависит от эффективной коммуникации между всеми участниками проекта, глубины анализа и использования современных технологий. Системный подход к разработке позволяет создавать продукты, соответствующие требованиям заказчика и ожиданиям пользователей.

У нашей команды большой опыт в создании крупных проектов в e-commerce – мы создаем сайты и приложения для цифровизации клиентского сервиса:

Horeca (рестораны). Один из наших флагманских проектов IT-экосистема для сети ресторанов Своя Компания – сайт и приложение гостя, приложения официанта и курьера, кастомная CMS для управления проектом и работы с заказами (интегрирована с R_keeper). 

• приложения официанта и курьера, рабочее место оператора

• мобильное приложение

• сайт c сервисом доставки

FMCG (E-grocery). Один из последних проектов интернет-магазин (сайт и мобильное приложение) и личный кабинет дистрибьютора для МЛМ-компании Тенториум – разнообразные акции, сложная система иерархии для сети дистрибьюторов >70 000.

Туризм. Разработали агрегатор туристических услуг Гоша – Веб-сервис, позволяющий туристам забронировать/приобрести нужные услуги, партнерам продать свои услуги, а отелям улучшить сервис и зарабатывать на рекомендациях. 

Fintech. Пожалуй, еще один из наших флагманских проектов – Фрисби, сервис для оплаты различных услуг на одной площадке. Начиналось все с ЖКУ и мобильной связи, а сейчас портфель услуг, которые можно оплатить через сервис, значительно вырос в объемах – в сервисе представлено более 1,5 тысяч поставщиков услуг и более 6 тысяч активных услуг.