1 258

Концепт лендинга для туристической компании World19

[изображение удалёно из-за наличия иконок компаний запрещенной в России организации Meta]

Идея и прототип

Что должна была предоставить страница:

  • Дать пользователю понимание, куда он попал
  • Предоставить 3−4 направления с возможностью забронировать
  • Бронирование с формой: имя и фамилия, количество человек, дата отдыха, пожелания и кнопка «Отправить»

Я решил сделать следующую структуру

  1. Первый экран: шапка, заголовок, подзаголовок, изображение
  2. Рассказ о компании
  3. Преимущества
  4. Направления
  5. Секция с формой
  6. Подвал

Жирным выделил то, что нужно сделать акцентным на уровне всего макета.

Первый экран

Первая версия первого экрана

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

Концепт лендинга для туристической компании World19 1
Прототип первого экрана

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

Что предоставляет туристическая компания? Уникальные места, эмоции.

Вторая версия первого экрана

Я продумал новый прототип, который показывает больше визуала, расположив другие элемент в углах макета.

Снизу идет заголовок, подзаголовок и кнопка «Забронировать». В центре можно включить видео. На фоне всего блока лежит изображение.

Концепт лендинга для туристической компании World19 2
Вторая версия первого экрана

Визуальное исполнение прототипа

Концепт лендинга для туристической компании World19 3
Дизайн первого блока по второй версии прототипа

И также хотел добавить стрелки или точки для переключения направлений.

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

Третья и последняя версия первого экрана

Что нужно рассказать на первом экране? Куда вы попали. Сразу в лоб предлагать что-то купить — глупо, так как это премиум услуга. Пользователю нужно понять, что вы не пытаетесь впарить.

Оставил то же расположение объектов, но немного изменил текст.

Концепт лендинга для туристической компании World19 4
Финальная версия первого экрана

Здесь я написал название компании и тех, кто подойдет по описание клиента. Вы хотите быть ближе к природе — тогда вам в World19.

Справа подписал место и если бы это был сайт, при клике на название сайт прокручивал к нужному направлению.

Здесь легко можно сделать сменяемость слайдов и менять фото и подпись. А при клике на подпись прокручивать к направлению. Дополнительное удобство 🙂

В шапке добавил кнопку «Забронировать» для быстрого бронирования.

О компании

В первой версии я использовал иллюстрацию комады.

Концепт лендинга для туристической компании World19 5
Первая версия второго экрана

Не нравился хаос в стилях. В первом экране фото, во втором иллюстрация. Должен вырабатываться единый стиль. Принял решение поставить фото команды.

Я уделил мало времени этому блоку и поставил фото команды в офисе.

Концепт лендинга для туристической компании World19 6
Вторая версия второго экрана

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

Концепт лендинга для туристической компании World19 7
Границы слипшихся изображений

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

[изображение удалёно из-за наличия иконок компаний запрещенной в России организации Meta]

Фото передаёт эмоции, я вижу, что вот она, команда, которая бывает в уникальных местах и событиях.

Они всей командой летят по руслу реки и я хочу доверить им свой отдых. Чтобы я испытал те же эмоции.

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

Преимущества

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

Этот блок был принят мной с первой версии.

Концепт лендинга для туристической компании World19 8
Блок преимущества

Направления

По направлениям у меня уже был готовый прототип от первого экрана, поэтому я принял его в единственном варианте.

Здесь мы даём нужную информацию для клиента:

  • Возможность просмотреть видео об объекте
  • Название объекта
  • Расположение
  • Описание
  • Стоимость в сутки
  • Кнопку для бронирования

Направления всего три. Это не случайно. Если предлагать пользователю слишком много направлений, он растеряется и в итоге не купит ничего.

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

Концепт лендинга для туристической компании World19 9

Бронирование

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

Концепт лендинга для туристической компании World19 10
Первая версия

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

С полем «Сколько планируете отдыхать» тоже есть проблема — не понятно как его заполнять.

Пользователи привыкли: дата начала и дата конца. У меня была мысль сделать заполнение в свободной форме, но сейчас понимаю, что в этом поле больше вопросов, чем ответов. Отработка заявок будет сопряжена со сложностями. Кто-то забудет вписать дату начала, кто-то дату конца.

В следующем варианте я её сделал её собранной и добавил дату начала и дату конца.

Концепт лендинга для туристической компании World19 11
Вторая версия

Потом я обдумал использование этого нового цвета. Его нигде не было и вводить его только в одном месте не нужно, зато был уже использованный элемент — звёзды, я решил использовать его и здесь тоже.

Концепт лендинга для туристической компании World19 12
Секция"Бронирование"

Итоговый макет

[изображение удалёно из-за наличия иконок компаний запрещенной в России организации Meta]

Выполненная работа

  1. Поиск референсов
  2. Прототип
  3. Поиск уникальных мест
  4. Подбор изображений
  5. Написание текста
  6. Дизайн
Поделиться
Отправить
Линкануть
Вотсапнуть
← К списку проектов