Кейс: Больше, чем просто пицца. Как мы создавали сайт для сети пиццерий Roni Napoletana

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

К нам обратилась команда, которая создала и развивает сеть пиццерий Roni Napoletаnа. Это международная компания, которая работает в 3 странах: Россия, Казахстан и Узбекистан, и продолжает расти.

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

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

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

Погружение в проект было максимальным. Да, да, прямо на все 150%))

Для начала, мы отправились в Тюмень, в один из ресторанов заказчика, чтобы почувствовать внутренний вайб пиццерии Roni. Мы смотрели, какие формы, цвета и элементы декора использованы в интерьере, чтобы отразить это стилистически в дизайне сайта.

Предложили идею заказчикам… Пользователь, попадая на сайт и затем придя в ресторан, должен чувствовать единую концепцию стиля. Сайт должен был стать органичным продолжением самих ресторанов.

Классная была встреча с большим количеством съеденных безумно вкусных пицц (кстати, готовят там просто фантастически) .

Мы опирались на брендбук компании, когда начали работать с типографикой, цветом, голосом и характером проекта. Характер в итоге получится на 100% “итальяно веро” — дружелюбный, открытый и позитивный. Но это будет потом, а начнём мы с изучения опыта конкурентов и знакомства с целевой аудиторией.

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

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

Целевая аудитория — это не только фраза “Женщины и мужчины 25-45”, если хочется, чтобы сайт приносил не только приятные эмоции, но и прибыль.

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

Изучали аудиторию в разных странах (Россия, Казахстан, Узбекистан) при помощи мониторинга соцсетей Roni и конкурентов. Выясняли, с какими проблемами сталкиваются пользователи, чем живут, чем занимаются, что любят.

Также анализировали отзывы конкурентов в поисковых системах. Искали позитивные и негативные комментарии и отзывы, чтобы отстроиться от конкурентов и усилить проект как изнутри, так и снаружи.

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

Мы выделили несколько основных групп пользователей.

1. Родители, которым важно не просто вкусно поесть, но и занять ребёнка в заведении.
2. Компании друзей или коллег, которые хотят забронировать столик, чтобы хорошо провести время, и при этом получить скидку за количество гостей.
3. Одинокие гости и путешественники — любители итальянской кухни.
4. Люди, которым не хочется готовить и просто нужна доставка еды.
   

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

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

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

Разработали и согласовали с заказчиком новую архитектуру, проработали CJM (пути пользователя) , чтобы сделать взаимодействие с сайтом для новых посетителей удобным и простым.

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

Все тексты для сайта мы писали в тесном контакте с заказчиками, опираясь на брендбук компании. В нем подробно описана идеология бренда, а еще мы учитывали особенности ЦА, которые выявили на этапе аналитики.

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

Специально искали “тупиковые зоны”, чтобы выявить все слабые места, помочь пользователю быстро сориентироваться в интерфейсе, найти нужную информацию и совершить целевое действие.

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

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

Цветовая схема проекта основана на трех главных цветах. Светло-бежевый, как цвет пиццы. Красный, как цвет экспрессии, огня (пицца готовится в настоящей дровяной печи) и сочных итальянских томатов. Тёмный цвет — цвет стволов оливковых деревьев.

Создали 3 дизайн-концепции на основе согласованных референсов, чтобы заказчики выбрали ту, которая ближе по ощущениям. В процессе совместного обсуждения определили наиболее выигрышный вариант.

На главной странице расположили самую важную информацию и каталог блюд, создали страницы об истории компании, страницу с партнёрскими предложениями, разместили информацию о тонкостях приготовления крутой пиццы в ресторанах и продумали креативную анимацию.

На сайте можно не только узнать про пиццерии и философию бренда, но и заказать вкуснейшую еду себе домой или в офис. А еще можно заказать фирменную продукцию Roni Napoletana.

Отрисовали страницы двух каталогов — для заказа разнообразной еды и классного мерча, который делают в Roni.

Создали подробные и понятные карточки товаров, упростили оформление заказа и адаптировали всё это под разные разрешения экранов.

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

Подготовили адаптивный дизайн каждой страницы для разработки нашими партнёрами из 2Dit: подготовили UI-kit, компоненты и создали моушн-ролики, чтобы показать, как должна работать анимация на сайте.

Мы упоминали в начале статьи, что в процессе работы постоянно были на связи с заказчиком. Это помогло сделать проект более гибким и вносить изменения оперативно по ходу работы. Думаем, что это было отличным решением и вот почему…

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

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

Мы вносили изменения в ТЗ по ходу движения, так как считаем, что это нормальное органичное развитие проекта и есть вещи, которые невозможно предусмотреть на старте.

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

Сайт уже успешно работает в 3 странах и помогает людям наслаждаться прекрасной неаполитанской пиццей.

Посмотреть больше наших кейсов (или связаться для сотрудничества) можно у нас на сайте.