Туристическое агентство «Натали Трэвел», кейс || Блог Игоря Пронина

Туристическое агентство «Натали–трэвел», кейс

Главная / Блог / Кейс «Натали–трэвел»
Разработка сайта
Аналитика
Скетчинг
Прототипирование
Дизайн
Html / Css
Javascript
Bitrix

Проблемы и бизнес—задачи

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

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

Натали лого Натали старый сайт

Аналитика

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

Стратегия для Натали

Скетчинг

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

Прототипирование

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

15% времени, затраченного на разработку, составили аналитика, скетчинг и прототипирование. Благодаря этим этапам лучше понимаются цели проекта, уменьшается количество правок. Такая подготовка в итоге сильно экономит бюджет заказчика.

Прототип для Натали

Дизайн и анимация

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

Мы постарались сгладить разницу между нашим дизайном и дизайном готовых модулей («Найдите тур онлайн», «Горящие туры»).

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

Цвета и стили для Натали
Цвета и стили для Натали

Вся графика сайта адаптирована под ретина-дисплеи. Аналитика показала, что 9% посетителей сайта пользуется устройствами Apple. Новый сайт для них выглядит максимально эффектно.

Цвета и стили для Натали

Мы разработали две версии дизайна: для десктопных и для мобильных устройств. Все элементы и функции, доступные на ноутбуках и компьютерах, доступны и на мобильных экранах. Создание качественной мобильной версии сайта актуально для любого проекта, поскольку в 2018м году трафик с мобильных устройств впервые привысил трафик с десктопов.

Вёрстка

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

Около 20% времени, затраченного на дизайн и вёрстку, ушло на дизайнерский надзор за вёрсткой и правки вёрстки. Это помогло довести работающий сайт до визуального совершентсва.

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

Разработка и технологии

Проект разрабатывался на 1С—Битрикс. Клиент получил возможность самостоятельно редактировать контент через админку.

Результат

Получилось хорошо!

Впереди много работы. У клиента большие планы на развитие сайта

Хотите такой же сайт?

Заполните это поле

Заполните это поле

Допускаются только числа