Разработка конструктора путешествий: процесс глазами арт-директора. Часть 1

Среди первых решений в ходе бета-тестирования IQPlanner было принято решение провести тотальную переработку концепции UX и интерфейса сервиса. Команда пополнилась арт-директором. IQPlanner обещал освещать этапы развития проекта, и без рабочих дневников нового главного по дизайну этот рассказ был бы неполным.

День первый

Сразу скажу, что идее уже больше двух лет. Ребята успели разработать движок, запустить основной функционал, подключить несколько партнёров, сделать какой-никакой, а интерфейс составления запроса для построения маршрута и вывода результатов вплоть до перехода на покупку билетов на перелёт и букинг отелей. Теперь пора всерьез заняться UX, дизайном, начать думать над контентом и продвижением. Показывать картинки и давать ссылки мне хочется в формате «было-стало» — так будет интереснее читать и лучше объяснит мою работу. Итак, посмотрим, что в мой первый день работы имелось в наличии.

• Презентация проекта. В ней описаны проблемы пользователя при планировании путешествия «вручную», идея проекта и то, как сервис решает эти проблемы, первые достижения и планы. Для общего понимания очень пригодилось.
• Техническое описание проблем, их решений, компонентов системы и прочих деталей с технологической точки зрения. Это уже более серьёзный документ, к которому мы не раз возвратимся.
• Структура запроса на путешествие. Это изначально было заявлено как «самый сложный элемент для визуального представления, о который разбились все предыдущие попытки сделать UX». Вот тут ожидается очень много работы, откатов обратно, обсуждений и проектирования в ближайшие недели, а то и дольше.
• Скудный список из шести сценариев, подготовленный одним из digital-агентств в Петербурге. Это, конечно, самое начало в разработке карты сценариев.
• Плюс в голове ответы на общие вопросы о проекте, брендбук (который нужно просто отменить и сделать всю айдентику заново), статистика примерно четырёх сотен посещений, несколько весьма подробных отзывов пользователей (спасибо!) и, собственно, сам сервис онлайн.

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

День второй

Команда уже не один час провела у доски с маркерами , разъясняя мне шаги пользователя при составлении плана путешествия: как создается запрос, какие данные возникают, как образуется плоскость решений, ну и так далее — смесь географии, математики и обычной логики. Всё это украшено так любимыми мной сокращениями названий аэропортов — LAX, SFO, FRA, JFK, что ещё сильнее разгоняет интерес и фантазию.

На третий день…

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

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

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

Результаты обсуждения

• Мы прежде всего планировщик путешествий. Предварительно предлагаемые маршруты нужны, особенно для неопытных пользователей сервиса, но мы не должны встать в длинный ряд со всеми каталогами туров, которые не имеют нашего преимущества — планировщика. То есть на уровне UX и интерфейса мы должны постоянно показывать людям, что любой маршрут на сайте — результат планирования, его можно разобрать на части, покрутить, настроить под свои интересы и отправляться с ним в путешествие.
• Для людей, уже спланировавших свое путешествие и находящихся в дороге, обязательна офлайновая «распечатка» с детализацией их маршрута — билеты, отели, даты, подсказки и напоминания. Полезным добавлением будет возможность найти экскурсии и события рядом с местом пребывания, то есть не глобальные изменения маршрута, а локальные приятные бонусы к точкам на вашем пути. Сейчас мы говорим про телефоны, а функциональность на планшетах должна быть такой, как и на десктопах.
• Также на мобильный функционал нужно положить фото-видео-графирование, составление кратких отчётов, заметок, напоминаний. Плюс возможность делиться этим в соцсетях или блогах.
• Каждый маршрут должен иметь свою страницу с оригинальным URL. Скорее всего, будет полезным иметь в конце этой страницы список похожих маршрутов. Критерии похожести могут быть разными — общие точки для маршрутов, «точки-время», тематика или общие события в местах.
• Конечно, каждый маршрут не может болтаться в вакууме — на него обязательно должны быть ссылки с других страниц — похожие маршруты, тех же авторов, с теми же точками или путями, в то же время, за те же деньги. И на каждый маршрут должна быть последовательность ссылок с главной страницы, не используя поиск.
• Появилась идея карточек маршрутов — некоей сущности, коротко описывающей маршрут, его тематику, особенности и, возможно, важнейшие точки, а также время, стоимость, превьюшку и рейтинг. Эту карточку можно будет увидеть не только на самом сайте (что очевидно), но и на сторонних — начиная со стены Facebook и заканчивая страничкой блогера-путешественника в ЖЖ. Предполагается, что такой блогер после описания красот оставляет маршрут, сконструированный на нашем сервисе, в виде небольшого блока, дизайн которого можно варьировать в разумных пределах. Главное, чтобы не потерялась информация, и верстка самой карточки органично вписалась в страницу размещения. Перейдя по ссылке, пользователь должен увидеть развёрнутый план путешествия с указанием мест, времени, отелей, рейтингов, подсказок, фотографий, видео и заметок от людей, прошедших тем же маршрутом.
• На самом деле, введение карточек было предсказуемо, даже вышеупомянутое агентство, сделавшее минимум работы по сценариям и UX, рекомендовало их ввести на главной странице. Но пока делали только то, что мы называем «под капотом», и теперь придётся немного откатиться назад и посмотреть, как карточки будут влиять на построение персональных маршрутов, какие возможности они предоставляют, и как в связи с этим изменится интерфейс конструктора путешествий.
• Есть мысль написать «шаблоны маршрутов» — некое количество предзаданных интересных маршрутов, по которым уже прошлись путешественники, составив статьи, дневники и фотоотчёты. Это большая контентная работа, которую пора начать планировать. Нужно думать, где брать авторов, фотографии, отчёты, на каких условиях и в какой тональности всё должно быть.
• Не раз упоминалась идея «сайта из четырёх кнопок» — интерфейс запроса должен быть максимально простым и понятным. Конечно, все стремятся к тому же самому, но в случае с IQPlanner задача усложняется тем, что пользователь не просто выбирает лучшие предложения по перелётам и отелям в конкретном городе, а составляет маршрут, учитывающий множество параметров во всех точках. Никто пока не предлагает «упакованный» маршрут, в котором, например, для удешевления путешествия могут быть предложены другие даты вылета из-за стоимости отелей.
• Подбор лучших вариантов на данный момент может занимать от двух до пяти минут, и пользователь должен понимать, что происходит работа «под капотом» и сервис не завис. Очень желательно, чтобы он мог ознакомиться с уже составленными маршрутами, даже если продолжается поиск.

Первые графические опыты

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

Самая первая попытка улучшить вид главной страницы. Уже доступна онлайн.

Жить с таким дизайном ещё месяцев пять, пока проводится ревизия и строится новый UX с учётом новых идей. Параллельно пришла идея о концепции фирменного стиля — использовать текстуры нашей замечательной планеты, но эту идею ещё нужно переварить — ведь очень желательно, чтобы она вписывалась в графику описания направлений, мест и прочих субъектов путешествия. А пока на пробу центральная симметрия, Helvetica Neue, затемнённый фон — ну всё как обычно.

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

Продолжение дневника читайте здесь.

Andrey Belikov, арт-директор IQPlanner.com