Пример: календарь с сеткой точек

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

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

Вскоре после запуска клиенты начали просить «добавить календарь» в Basecamp. Мы уже делали календари и знали, насколько они сложны. На полноценный календарь запросто может уйти шесть месяцев или больше.

Вот что делает календарь сложным:

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

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

Располагая всего шестью неделями, мы могли создать примерно десятую часть того, что люди представляют, когда говорят «календарь». Вопрос был в том, какую именно десятую часть.

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

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

Вот с каким уровнем детализации мы определили решение:

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

В то же время обратите внимание, насколько конкретна сама идея. Совершенно ясно, как она работает, что нужно сделать, что входит в проект, а что нет.

К концу проекта результат работы дизайнеров и программистов выглядел так:

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