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

Как мы составляли основной набор экранов и попробовали «половинчатую компоновку». Это продолжение дневника, начало читайте здесь.

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

Тут ещё возникает интересный момент — бывает, что конфликт завязан на два, а то и больше параметров. Если мы будем «зажимать» допустимые параметры ввода в каждом последующем поле (дата возвращения всегда позже даты отправления), то мы заставляем человека метаться по форме составления запроса, исправляя уже введённые ранее параметры и отслеживая реакцию в последующих полях. Вместо этого мы можем где-то на периферии экрана предупреждать его о конфликте и давать ему самому решать, где менять параметры (пораньше отправиться или попозже вернуться).

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

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

Варианты различных стилей оформления лучше пробовать на наиболее разносторонних элементах интерфейса.

В качестве навигационной парадигмы, «фишки» мне пришла идея раздвоенного экрана — делим экран на левую и правую половины и в левой располагаем списки, объекты, а в правой — их подробное описание, настройки или похожие объекты. На примере трёх разных экранов это может иметь такую структуру:

Детали маршрута — слева, карта — справа.

Карточка отеля — слева, подробное описание — справа.

Описание перелёта — слева, альтернативные перелёты — справа.

Пока вроде бы всё складывается, буду продолжать в этой же половинчатой структуре. На следующей картинке видно, что перед постройкой основных прототипов страниц я составил список сущностей (не таких, как время или заголовок, а более общих, составных) и модулей, которые представляют собой логически самостоятельные компоненты страниц или этапов работы:

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

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

Варианты карточек для различных площадей размещения.

Мы — Секретные Агенты. Нас пятеро и с нами двое малышей. 25 декабря мы вылетаем в Сан-Франциско, два дня посмотрим город, потом у нас миссия на Ранчо Корал Де Тьерра. Возвращаемся в Петербург не раньше 5 января.

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

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

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