Как я сделал редизайн Старбакса

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

Полный кейс редизайна

Главное — всё должно быть последовательно и логично.

Слайдер на главной

Одно из главных правил дизайна — быстро передать пользователю важную информацию. Но иногда в компании важного слишком много: сезонные распродажи, акции, скидки, новые предложения. Все это полезно, но уместить на одном экране кажется нереально. Чтобы сделать одновременно много и мало информации на первом экране, я использовал слайдер. Это удобно: на улице неделю +30 — значит предлагаем прохлаждающие напитки, а дальше — акции, мерч, скидки.

Онлайн-заказ кофе

Всех бесит стоять в очереди. Чтобы очередей стало меньше, я добавил форму онлайн-заказа. Механика такая:

— выбираешь состав

— выбираешь к какому времени приготовить

— оплачиваешь картой

— заходишь за кофе

Блок сайта, как заказать кофе с телефона или компьютера

Карта кофеен

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

Кофейни Старбакс на карте

Карта кофеен

Я сделал карту, которая отслеживает пользователя и показывает ближайшие к нему кофейни Старбакс. Если нажать на адрес, пользователь перейдет в Гугл карты. Приложение построит маршрут до нужной точки. Чтобы человек не пришел к закрытом дверям, на карте есть часы работы всех кофеен.

Эксклюзивные предложения на сайте меняются контент-менеджером

Если нужно сделать сезонные предложения, я подготовил шаблон карточек:

Когда нужны сезонные предложения, контент-менеджер работает с шаблоном

Карта вознаграждений

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

Карта покупателя, чтобы заказывать кофе с телефона или компьютера

Мобильная версия

Больше половины интернет-пользователей выходят в сеть с мобильных устройств, к такому выводу пришли исследователи агентства We Are Social в 2017 году. Поэтому редизайн без мобильной версии — это не редизайн, а игрушки.

Первые три экрана сайта

Человек заказывает кофе онлайн. Выбирает состав, крепость, объем, сахар и добавки

Было

Стало

Автор кейса выпускник школы WDI Константин Жук. Подписывайся на наш канал, ставь лайк и напиши в комментариях, что думаешь о таком редизайне?

***

Если тебя покорила работа Константина, и ты хочешь приносить пользу людям, задумайся о карьере веб-дизайнера. Чтобы узнать о профессии и определить в ней свой путь развития, записывайся на консультацию с менеджером WDI.

Записаться и начать новую жизнь