Как заказчику ускорить создание сайта: советы от разработчиков

Светлана Пушкарь

Руководитель технического отдела группы компаний «Медиасфера»

Привет, друзья! Меня зовут Светлана Пушкарь. Я – руководитель технического отдела группы компаний «Медиасфера». Эффективное взаимодействие между заказчиком и разработчиками – залог успешного и быстрого завершения проекта. Сегодня поговорим о том, как клиенты влияют на сроки каждого этапа разработки сайта и можно ли сократить временные затраты без ущерба для качества.

Модели разработки сайта и их влияние на сроки

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

• Каскадная модель (Waterfall model)

Для проектов с четко определенными и неизменными требованиями, где итоговый результат ясен с самого начала, каскадная модель является наиболее подходящей. Это классическая система с линейной структурой. В ней каждый этап разработки плавно «перетекает» в следующий: составление ТЗ, прототипирование, отрисовка макета, верстка, тестирование и запуск. Ее плюс: понимание потенциальных сроков разработки.

 

• MVP (Minimum Viable Product)

Это быстрый запуск простого сайта с основным набором функционала или доработкой уже имеющегося ресурса. Здесь также можно установить сроки реализации сайта, если у вас не появится дополнительных пожеланий и требований в процессе. Разработка по MVP проходит по тем же этапам, что и по каскадной модели, но время запуска сокращается за счет уменьшения объема функционала. Здесь запуск может начинаться с «заглушки страницы».

«Заглушка»” страницы может иметь интерактивную реализацию. Например, в виде таймера обратного отсчета

• Agile model

Это гибкий подход к разработке сайта. Акцент на быстрой адаптации к изменениям и постоянной коммуникации с заказчиком. Разработка делится на короткие итерации, в течение которых команда создает, тестирует гипотезы и улучшает продукт. Минус такой модели – невозможность заранее рассчитать окончательную стоимость и временные затраты.

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

Реальные сроки этапов создания сайта по waterfall модели

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

Давайте рассмотрим каждый этап разработки сайта и объективные сроки их реализации.

Постановка задач и составление ТЗ

Разработка абсолютно любого веб-ресурса начинается с ТЗ. Почему этот этап является критически важным? Все просто, ТЗ позволяет:

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

Скачайте шаблон ТЗ на разработку сайта

Сроки: от 14 дней. По опыту могу сказать, что на этот этап не стоит жалеть времени и тем более игнорировать его, чтобы в результате не получить недопониманий с разработчиком. ТЗ должно быть максимально точным и подробным – это своего рода акцепт всех договоренностей.

Прототипирование

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

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

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

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

Сроки: от 20 дней примерно до 20 страниц, в зависимости от сложности проекта и его структуры/функционала.

Пример подачи прототипа сайта

На основе прототипа получили такой вот дизайн в финале

Отрисовка дизайн-макета

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

Из чего складываются временные затраты: сначала отрисовывается макет страниц сайта под десктоп (стандартно 1900х1600), затем – для мобильной версии. Если вам потребуются дополнительные макеты, например, для нестандартного разрешения или планшета, это, само собой, увеличит срок реализации этапа и перехода к следующему.

Сроки: от 50 дней до 20 уникальных страниц сайта.

Верстка и программирование

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

Сроки: от 60 дней, в зависимости от сложности проекта.

Тестирование и запуск

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

Например, в нашем агентстве процесс тестирования проходит в несколько этапов:

1. Сначала разработчики проводят внутреннее тестирование, затем на очереди технический и SEO-отделы, которые проверяют юзабилити, скорость загрузки, соответствие верстки и другие аспекты.
2. После этого проводится проверка функциональности на разных браузерах и устройствах, учитывая возможные отличия в работе сайта на различных платформах (Android и iOS).
3. Дальше менеджер проекта организует дополнительные проверки. Все обнаруженные ошибки фиксируются в баг-листе, который регулярно обновляется и предоставляется клиенту.
4. После исправления ошибок проводится финальное тестирование и переход к завершающему этапу – запуску, переносу на «боевой» сервер и размещению в сети.

Сроки: от 20 дней.

Пример адаптивного дизайна сайта

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

Как заказчику сократить сроки разработки сайта

Команда нашего агентства «съела собаку» на вопросах, касаемых сроков сдачи проектов. И вывод здесь один: успех проекта во многом зависит от тесного сотрудничества заказчика и разработчиков. Рассказываю, что конкретно может сделать клиент, чтобы помочь сократить сроки разработки сайта.

1. Приемка работы блоками

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

Как это происходит:

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

Этот вариант работы отлично подойдет для запуска сайта по MVP, если у вас раньше не было веб-ресурса. Сначала запускается главная страница, затем внутренние, имиджевые (например, контакты, новости и пр.) и т.д. Главное, чтобы был реальный живой контент, который можно встроить в верстку. Таким образом, можно запустить небольшой сайт, которым вы сразу сможете начать пользоваться.

Плюсы:

• сокращение общего срока разработки.
• сокращение количества правок на каждом этапе или в каждой итерации.

Правда, стоит отметить, что увеличится время на тестирование, потому что количество баг-листов вырастет кратно числу блоков.

2. Своевременная обратная связь

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

Если вы «кормите завтраками» исполнителя (нет времени, отпуск, другие задачи и пр.), будьте готовы, что у команды разработчиков приоритет вашего проекта сместится в пользу других. Работа над сайтом превратится в «жвачку» и может тянуться бесконечно. Соответственно, сроки сдачи будут увеличены.

К тому же, большие перерывы «стирают» детали. Если вы вернетесь с правками через месяц и более, разработчикам придется заново поднимать переписки, ТЗ и пр., чтобы вспомнить, какие были договоренности.

Фиксировать и координировать работу над проектом помогает диаграмма Ганта.

Пример визуализации задач в диаграмме Ганта

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

3. Предоставление корректировок для разработчиков в едином виде

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

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

На практике клиенты неохотно заполняют баг-листы, но это необходимо, так как позволяет серьезно сократить сроки на доработку и внесение правок:

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

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

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

Выводы

1. Разработка сайта – это многоуровневый, сложный процесс, в том числе с точки зрения коммуникации. Если вам обещают создать сайт за неделю, скорее всего, вы сильно разочаруетесь в полученном результате. Реальные сроки, в рамках которого можно получить качественный рабочий сайт – от 4-х месяцев.
2. Задержка обратной связи для разработчика может привести не только к увеличению сроков разработки, но и к потере актуальности и конкурентоспособности сайта. За долгое время у вас могут, как минимум, поменяться цели и задачи, требования к функционалу ресурса, SEO и многое другое.
3. Использование диаграммы Ганта позволит четко понимать сроки выполнения каждого этапа разработки и увидеть, почему и где произошла задержка.
4. Возьмите на заметку единый баг-лист для предоставления корректировок разработчикам. Он поможет единоразово собрать все правки и сократить сроки тестирования этапов.
5. Заинтересованность исполнителя в проекте прямо пропорциональна вашей. Не игнорируйте регулярные встречи, обсуждение промежуточных результатов и совместное решение проблем – все это сокращает сроки разработки и повышает качество итогового продукта.