ROSTIC’S — редизайн сайта в новой роли цифрового канала бренда

За 6 месяцев спроектировал редизайн обновлённого сайта: страницы, новые разделы, баннерные сетки и адаптивные версии. Работал в связке с дизайн-директором, продакт-менеджером и разработчиком. А еще помогали другие дизайнеры из команды

ПРОБЛЕМА

Заказы переехали в приложение. Сайту предстояло найти новую роль

ROSTIC'S пересматривал роль собственного сайта в цифровой экосистеме бренда. Основной сценарий заказа и покупки сместился в мобильное приложение, а сайт должен сохранить информационную функцию и стать точкой входа для пользователей, которые ещё только знакомятся с продуктом или ищут конкретную информацию
Прежний дизайн сайта стал неконсистентным относительно мобильного приложения и приложения киоска. По сути, сайт визуально выпадает из общей экосистемы бренда

МЕТОД ИССЛЕДОВАНИЯ

Изучил доступную продуктовую аналитику о работе текущего сайта

80% пользователей сидит на мобильной версии сайта, только 12% пользуется десктопной версией. Поэтому редизайн строил вокруг мобильного приложения и с mobile-first подходом

ЛЮДИ

За каждым посещением сайта стоит своё намерение и его нужно учитывать

Пользователи приходят на сайт ROSTIC’S с разными задачами. Одни хотят изучить меню и узнать больше о конкретном блюде, другие ищут акции и купоны, третьи хотят найти ресторан или получить информацию о компании. Главное — не сломать привычные сценарии пользователя

СЦЕНАРИИ

Изучить меню

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

А еще начали внедрять новые вкусовые теги
Модификаторы теперь носят информационный характер, чтобы пользователь точно знал: что можно убрать и добавить к блюду. Дублируем кнопку «Скачать приложение», с предположением, что конверсия скачивания будет выше

Оставить отзыв

Обратная связь теперь формализована по всем каналам: пользователь быстрее попадает в универсальную форму, если отсканирует QR-код на кассе, зайдет на сайт или перейдет из рабочего аккаунта. До этого все формы были разбросаны или спрятаны и все выглядели и устроены по-разному. Теперь сценарий максимально предсказуемый, а весь дизайн — унифицированный

Узнать о компании

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

МОЯ РОЛЬ

От аналитики до Figma

  • Изучил продуктовую аналитику
  • Проанализировал текущие сценарии
  • Сделал визуальный анализ конкурентов, аналогов за рубежом и других сайтов фудтех компаний
  • Собрал wireframes всех страниц
  • Изучил дизайн-системы мобильного приложения и киоска
  • Сделал прототипы в Figma Make для новых страниц и разделов
  • Задизайнил 20 страниц и адаптировал каждую под 5 экранов
  • Собрал UI-кит сайта, основу для полноценной дизайн-системы
This site was made on Tilda — a website builder that helps to create a website without any code
Create a website