Редизайн
сайта API• Информационные технологии » Информатика » Программирование » Интерфейс программирования приложений
• Информационные технологии » Информационно-коммуникационные технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений
• Высокие технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений Яндекс Карт• Коммуникации » Интернет-коммуникации » Поисковая система » Яндекс.
Рост среднего времени посещения
сайта на
39% и
увеличение конверсии на 1,1 п. п.
Редизайн сайта API• Информационные технологии » Информатика » Программирование » Интерфейс программирования приложений
• Информационные технологии » Информационно-коммуникационные технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений
• Высокие технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений Яндекс Карт• Коммуникации » Интернет-коммуникации » Поисковая система » Яндекс. Рост среднего времени посещения сайта на 39% и
увеличение конверсии на 1,1 п. п.
Привет! Это — pinkman . Рассказываем, как сделали дизайн• Дизайн нового сайта
геосервисов Яндекса• Коммуникации » Интернет-коммуникации » Поисковая система » Яндекс для бизнеса и помогли превратить продукт из чисто
технологического решения в полноценную бизнес-платформу.
Кто мы
Мы в pinkman делаем дизайн• Дизайн коммуникаций, интерфейсов• Информационные технологии » Информатика » Программирование » Шаблоны Проектирования » Интерфейс (шаблон проектирования)
• Информационные технологии » Информационно-коммуникационные технологии » Информационные технологии и телекоммуникации » Программирование » Шаблоны Проектирования » Интерфейс (шаблон проектирования)
• Высокие технологии » Информационные технологии и телекоммуникации » Программирование » Шаблоны Проектирования » Интерфейс (шаблон проектирования) и сайтов для больших
компаний. Например, больше 3 лет создаем и поддерживаем главный сайт ВТБ• Объект организация » Организации по алфавиту » Организации на Гр » Группа ВТБ » Банки Группы ВТБ » Банк ВТБ
• Объект организация » Организации по алфавиту » Организации на Оа » Банк ВТБ
• Экономика » Финансы » Банк » Банки Группы ВТБ » Банк ВТБ.
Про продукт
API• Информационные технологии » Информатика » Программирование » Интерфейс программирования приложений
• Информационные технологии » Информационно-коммуникационные технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений
• Высокие технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений Яндекс Карты• Коммуникации » Интернет-коммуникации » Поисковая система » Яндекс — B2B-сервис Яндекс• Коммуникации » Интернет-коммуникации » Поисковая система » Яндекс Карт, который предлагает набор
программных библиотек, позволяющих бизнесу использовать актуальные
картографические данные, встраивать карты на сайты и в приложения, а также
решать задачи, связанные с маршрутизацией и навигацией. Решения API• Информационные технологии » Информатика » Программирование » Интерфейс программирования приложений
• Информационные технологии » Информационно-коммуникационные технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений
• Высокие технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений Яндекс
Карт• Коммуникации » Интернет-коммуникации » Поисковая система » Яндекс используют компании из самых разных отраслей: от логистики, ритейла и
электронной коммерции до финтеха и телекома.
С чем пришел заказчик
Продукт компании развивался без четкого позиционирования на рынке.
Предыдущий сайт бренда представлял собой набор страниц с документацией на
поддомене Яндекса• Коммуникации » Интернет-коммуникации » Поисковая система » Яндекс. Он был неудобным, а навигация — сложной. При этом сайт был
основным каналом для осуществления продаж и обработки входящих обращений.
Было две группы целевых аудиторий: разработчики и бизнес-заказчики. Последним
было трудно находить нужную информацию• Коммуникации » Контент из-за сложной навигации и неудобной
структуры контента• Коммуникации » Контент на сайте
Что мы сделали
Разработали с нуля новый сайт в концепции self-service. Ориентировались при
этом на новое позиционирование API• Информационные технологии » Информатика » Программирование » Интерфейс программирования приложений
• Информационные технологии » Информационно-коммуникационные технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений
• Высокие технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений Яндекс Карт• Коммуникации » Интернет-коммуникации » Поисковая система » Яндекс как самостоятельного бренда и
сфокусировались на привлечении новых клиентов — лидогенерации.
Адаптировали структуру и контент• Коммуникации » Контент под две целевые аудитории. Для разработчиков
— подробная документация, гайды и примеры кода. Для бизнеса — лендинги с
описанием возможностей и сценариями использования.
Добавили инструменты, которые позволяют быстро познакомиться с продуктами:
блоки с ценами, калькулятор тарифов и формы обратной связи.
Результаты
Благодаря редизайну мы не просто обновили упаковку, но заново выстроили
коммуникацию с разными аудиториями• Коммуникации » Контент — теперь гораздо проще доносить ценность
продуктов и узнавать, как встраивать их в существующие бизнес-процессы
клиентов.
Антон Токбулатов, руководитель проектного офиса API• Информационные технологии » Информатика » Программирование » Интерфейс программирования приложений
• Информационные технологии » Информационно-коммуникационные технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений
• Высокие технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений Яндекс Карт• Коммуникации » Интернет-коммуникации » Поисковая система » Яндекс
Аналитика
На старте было понятно, что у сайта есть две основные задачи —
позиционирование API• Информационные технологии » Информатика » Программирование » Интерфейс программирования приложений
• Информационные технологии » Информационно-коммуникационные технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений
• Высокие технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений Яндекс Карт• Коммуникации » Интернет-коммуникации » Поисковая система » Яндекс как отдельного бренда и рост конверсии за
счет разделения аудиторий• Коммуникации » Контент.
Помимо разработчиков, продуктами API• Информационные технологии » Информатика » Программирование » Интерфейс программирования приложений
• Информационные технологии » Информационно-коммуникационные технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений
• Высокие технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений Яндекс Карт• Коммуникации » Интернет-коммуникации » Поисковая система » Яндекс интересуются и
бизнес-заказчики, многие из которых вообще не имеют штатных программистов• Информационные технологии » Информатика » Программирование
• Информационные технологии » Информационно-коммуникационные технологии » Информационные технологии и телекоммуникации » Программирование
• Высокие технологии » Информационные технологии и телекоммуникации » Программирование и
хотят получить готовые решения.
Представьте себе директора транспортной компании• Транспорт » Транспортные компании, который ищет систему для
отслеживания грузов. Вряд ли он будет разбираться в тонкостях программных
методов и протоколов. Ему нужно, чтобы сайт на простом языке объяснил, как
продукты API• Информационные технологии » Информатика » Программирование » Интерфейс программирования приложений
• Информационные технологии » Информационно-коммуникационные технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений
• Высокие технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений Яндекс Карт• Коммуникации » Интернет-коммуникации » Поисковая система » Яндекс решат конкретную проблему бизнеса.
Антон Токбулатов, руководитель проектного офиса API• Информационные технологии » Информатика » Программирование » Интерфейс программирования приложений
• Информационные технологии » Информационно-коммуникационные технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений
• Высокие технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений Яндекс Карт• Коммуникации » Интернет-коммуникации » Поисковая система » Яндекс
Работу над проектом начали с глубокого исследования. Провели конкурентный
анализ — посмотрели, как устроены сайты других геосервисов.
Изучили паттерны взаимодействия пользователей• Коммуникации » Контент со старым сайтом и провели серию
интервью с клиентами, чтобы узнать об их проблемах и ожиданиях. Так нам
удалось сегментировать аудиторию• Коммуникации » Контент и понять, какая информация• Коммуникации » Контент нужна каждой
группе.
На основе этих данных мы спроектировали логику взаимодействия пользователей• Коммуникации » Контент с
платформой, подготовили новую карту сайта• Коммуникации » Интернет-коммуникации » Веб-дизайн » Карта сайта
• Дизайн » Веб-дизайн » Карта сайта и описали ключевые пользовательские
сценарии.
Прототипирование и дизайн• Дизайн
Для быстрого масштабирования сайта в будущем мы создали гибкую дизайн• Дизайн-систему
на основе обновленного фирменного стиля• Коммуникации » Интернет-коммуникации » Веб-дизайн
• Дизайн » Веб-дизайн бренда. Она включает в себя набор
готовых блоков в едином стиле, а также иконки, иллюстрации и микроанимации для
привлечения внимания к важным деталям.
Раздел «Продукты»
В этом разделе сайта описываются продукты API• Информационные технологии » Информатика » Программирование » Интерфейс программирования приложений
• Информационные технологии » Информационно-коммуникационные технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений
• Высокие технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений Яндекс Карт• Коммуникации » Интернет-коммуникации » Поисковая система » Яндекс, при этом у каждого
из них есть своя страница с описанием возможностей, примерами использования,
формами подбора решений и обратной связи.
Информация• Коммуникации » Контент по каждому из продуктов адаптирована под потребности конкретных
целевых групп. Бизнесу мы рассказываем про кейсы использования и ценность
внедрения того или иного решения. Разработчикам даем всю необходимую
техническую информацию• Коммуникации » Контент
Раздел «Решения»
Подробно описывает возможности продуктов API• Информационные технологии » Информатика » Программирование » Интерфейс программирования приложений
• Информационные технологии » Информационно-коммуникационные технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений
• Высокие технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений Яндекс Карт• Коммуникации » Интернет-коммуникации » Поисковая система » Яндекс для бизнесов из
разных отраслей: логистики, электронной коммерции, телекома и других
Показывает примеры использования решений с конкретными интерфейсами• Информационные технологии » Информатика » Программирование » Шаблоны Проектирования » Интерфейс (шаблон проектирования)
• Информационные технологии » Информационно-коммуникационные технологии » Информационные технологии и телекоммуникации » Программирование » Шаблоны Проектирования » Интерфейс (шаблон проектирования)
• Высокие технологии » Информационные технологии и телекоммуникации » Программирование » Шаблоны Проектирования » Интерфейс (шаблон проектирования)
Предлагает готовые шаблоны• Информационные технологии » Информатика » Программирование » Шаблоны Проектирования » Интерфейс (шаблон проектирования)
• Информационные технологии » Информационно-коммуникационные технологии » Информационные технологии и телекоммуникации » Программирование » Шаблоны Проектирования » Интерфейс (шаблон проектирования)
• Высокие технологии » Информационные технологии и телекоммуникации » Программирование » Шаблоны Проектирования » Интерфейс (шаблон проектирования) интеграции и кастомизации под задачи бизнеса
Раздел «Разработчикам»
Содержит исчерпывающую техническую документацию по всем продуктам
Описывает процесс интеграции API• Информационные технологии » Информатика » Программирование » Интерфейс программирования приложений
• Информационные технологии » Информационно-коммуникационные технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений
• Высокие технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений для разных платформ
Приводит подробные примеры кода и возможных кастомизаций
Дает ответы на самые частые вопросы при разработке
Подборщик решений
Мы понимали, что у бизнес-клиентов нет времени разбираться в деталях различных
API• Информационные технологии » Информатика » Программирование » Интерфейс программирования приложений
• Информационные технологии » Информационно-коммуникационные технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений
• Высокие технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений и SDK. Им нужен простой и быстрый способ понять, какой продукт решит
конкретную задачу их бизнеса. Так родилась идея подборщика решений.
Пользователь• Коммуникации » Контент просто выбирает задачу, а сайт предлагает ему конкретное решение.
За основу мы взяли самые популярные кейсы использования API• Информационные технологии » Информатика » Программирование » Интерфейс программирования приложений
• Информационные технологии » Информационно-коммуникационные технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений
• Высокие технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений Яндекс Карт• Коммуникации » Интернет-коммуникации » Поисковая система » Яндекс в
разных отраслях.
Калькулятор цен
Интерактивный калькулятор позволяет быстро рассчитать стоимость внедрения, что
экономит время клиентов и разгружает техподдержку.
Клиент пошагово выбирает нужный продукт, вводит планируемый объем запросов и
видит итоговую цену. Тут же можно отправить заявку на подключение.
Языковые версии
Сайт изначально разрабатывался как глобальная платформа, рассчитанная на
клиентов из разных стран. Он доступен на четырех языках: русском, английском,
казахском и турецком.
При локализации мы не только учли специфику языков, но и адаптировали дизайн• Дизайн
всех элементов под разную длину текстов.
Что в итоге
Новый сайт API• Информационные технологии » Информатика » Программирование » Интерфейс программирования приложений
• Информационные технологии » Информационно-коммуникационные технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений
• Высокие технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений Яндекс Карт• Коммуникации » Интернет-коммуникации » Поисковая система » Яндекс удобно и доступно предоставляет всю важную
информацию• Коммуникации » Контент о продуктах для обеих целевых аудиторий: разработчики теперь
быстрее находят нужную документацию, а бизнес-клиенты легче понимают
возможности решений.
Статистика показывает улучшения по ключевым показателям: выросла конверсия,
увеличилось среднее время на сайте, снизился процент отказов. Редизайн помог
четче позиционировать API• Информационные технологии » Информатика » Программирование » Интерфейс программирования приложений
• Информационные технологии » Информационно-коммуникационные технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений
• Высокие технологии » Информационные технологии и телекоммуникации » Программирование » Интерфейс программирования приложений Яндекс Карт• Коммуникации » Интернет-коммуникации » Поисковая система » Яндекс на рынке и создал основу для дальнейшего
развития продуктового сайта.
Спасибо, что прочитали до конца. Еще можно сделать две вещи:
1) Подписаться на наш телеграм (там больше кейсов и много красивого 3D каждый
день)
2) Оставить заявку, чтобы обсудить ваш проект (быстро ответим, обсудим условия
и детали)