12 июня 2020
Прототип сайта для проекта ВТБ Бизнес Коннект
Сформулировали УТП, проработали структуру всех страниц, прописали тексты и подготовили макеты к передаче в дизайн для одного из крупнейших банков России.
ЛЮБОМУ САЙТУ НУЖЕН ПРОТОТИП
К нам часто приходят запросы сделать лендос за пару дней. Мы терпеливо объясняем, что ничего доброго не выйдет, и показываем процесс работы над сайтом. Сперва нужно изучить рынок, собрать всю информацию и погрузиться в проект. Потом сформировать ценность и собрать прототип. И уже только затем — дизайнить и верстать.

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

На выходе получается макет в Figma, готовый к передаче в дизайн. Именно эту работу мы и проделали для запуска новой платформы Бизнес Коннект от банка ВТБ.
ИЗУЧАЕМ РЫНОК И ПРОДУКТ

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

Вот так мы собирали информацию о продукте:

  • Изучили бриф, сайт, презентацию, компред и другую полезную информацию.
  • Посмотрели на русские и англоязычные аналоги, проанализировали их сильные и слабые стороны, приёмы и позиционирование.
  • Обсудили с клиентом оставшиеся вопросы и дописали информацию в бриф.
  • Сделали майндмап проекта. Такая карта позволяет структурировать всю информацию о продукте, чтобы потом ничего не потерялось.
ФОРМИРУЕМ КОРНЕВОЕ УТП, СОЗДАЕМ СТРУКТУРУ
Первая итерация — создание основы. Здесь мы не стараемся писать красивые тексты. Главная задача — собрать каркас сайта и сформировать главную ценность продукта.

Как только один проектировщик собрал вариант страницы, его проверяют ещё 2 проектировщика из out.agency. За одну итерацию получается три внутренних ревью.
Каждую итерацию мы созванивались с клиентом и презентовали работу.

После каждого созвона команда ВТБ брала 1−3 дня на то, чтобы окончательно высказать все комментарии по странице.

На выходе получилась структура страницы.
ДОПИЛИВАЕМ СТРУКТУРУ, ПРОРАБАТЫВАЕМ ВНУТРЕННИЕ БЛОКИ
Вторая итерация работы над прототипом — проработка внутренних блоков. Мы смотрим уже не на весь сайт целиком, а на конкретные детали. Как работает конкретный раздел на сайте, как расположена графика и текст.

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

Вот такой получился прототип после второй итерации.
ЧИСТОВАЯ ПРОРАБОТКА ТЕКСТОВ
Прототип близится к завершению и пора вычищать все тексты. Каждое слово должно стоять на своем месте.

Разрабатываем дополнительные поля и окна: окна заявки, блоки с динамическим контентом, системные сообщения.

Как всегда, прототип проходит внутреннее ревью и согласовывается с клиентом.
БУФЕРНЫЕ ДОРАБОТКИ И ПЕРЕДАЧА В ДИЗАЙН
Как сильно не старайся делать прототип — всё равно в финале захочется что-нибудь поправить. Поэтому мы изначально закладываем 2−3 дня на буферные доработки. Чтобы в финальной работе не было абсолютно никаких замечаний.

Дотачиваем до идеала и сдаём работу.

Итоговый прототип — по ссылке в фигме и целиком ниже.
ОТДАЛИ В ДИЗАЙН
В этот раз дизайн делали не мы. Но мы отслеживали все этапы создания дизайна и давали свои комментарии. Итоговый дизайн — по ссылке.
ПРОТОТИПЫ СТРАНИЦ ВТОРОГО УРОВНЯ
Главная страница подразумевает разведение аудитории в зависимости от их потребностей. Точно по такой же схеме мы создали еще три прототипа для трех подпродуктов: Маркетплейс, Менеджер продаж и Экспорт менеджер.

Хороший прототип как вино — со временем становится только лучше. С проработанным прототипом ваш сайт станет более убедительным. А ещё меньше придётся переделывать сайт на этапе дизайна или вёрстки : )
1
4 НЕДЕЛИ
от брифа до передачи в дизайн
2
4 ИТЕРАЦИИ
для создания полноценного прототипа
3
4 СОЗВОНА
для обсуждений и согласований
Антон Шаяхов
Founder
Конечно же, очень лестно работать с таким большим и знаменитым клиентом. Да ещё и продукт новый — интересно вдвойне. Мы переживали, что утонем в согласованиях, а на деле команда ВТБ оказалась очень быстрой и крутой.

Мы кайфуем от создания прототипов сайтов для новых продуктов. Так что если у вас есть что-то свежее и мощное — приходите : )

Хотите так же круто?

Оставьте номер или email. Обсудим детали и сделаем, как для себя!