B2B-платформа телеизмерений, в которой телеканалы анализируют эфирные данные (составляют отчеты по определенным показателям и датам).
Задачи
Задачи появлялись одна за другой по мере развития продукта:
1. Задавать диапазон дат и часов (и минут)
2. Выкалывать дни недели из выбранного диапазона
3. Выбирать тип расчета временного периода
4. Выбирать пресеты для периодов
5. Видеть выбор, когда календарь свернут в датапикере
Еще одна задача родилась из контекста использования календаря. О ней я упомяну в конце.
Решение
Буду расписывать решения по поставленным задачам.
1. Задавать диапазон дат и часов (и минут)
Ну, это стандартный функционал календарей, в принципе, я могла бы и опустить этот шаг.
На макете минуты заблокированы, чтобы не дать пользователю допускать ошибки (чтобы он не забыл их сбросить, например, и не сделал квартальный отчет с 58 минутами в часу, а не полным часом). Если очень попросить, я думаю, можно было бы дать возможность и их редактировать.
2. Выкалывать дни недели из выбранного диапазона
Добавила группу кнопок с множественным выбором, а также пресеты «Будни» и «Выходные», чтобы быстро переключать между выбором пяти дней или двух дней.
💥Считаю, что это совершенно классный функционал: можно выбрать только субботу, и отчет будет строиться по всем субботам периода!
3. Выбирать тип расчета временного периода
Вот где все становится сложнее, еще сложнее. И для пользователя в том числе.
Время и правда может рассчитываться по-разному. Раньше оно по умолчанию считалось по «Сквозному» типу расчета: это когда время, которое мы задаем, соответствует времени в первые сутки и последние. Таким образом, в отчет попадают все часы между.
Опять же представим телепередачу: у нее есть определенные часы выхода. Мы можем задать тип расчета «Посуточный», тогда каждые сутки мы будем видеть в отчете только тот диапазон времени, который указали.
Чтобы объяснить пользователю разницу, помимо радиокнопок было сделано следующее:
✨ Заголовок у временных блоков меняется в зависимости от выбора: выбранные даты или «Начало суток» / «Конец суток».
✨ Добавлена подсказка для каждого типа расчета времени.
В пределах календаря произошла перегруппировка: выделены две секции Расчет времени и Дни недели.
4. Выбирать пресеты для периодов
В целом это тоже стандартный функционал многих календарей.
Сгруппировали пресеты по Дням, Неделям, Месяцу, Кварталу и Году. Дни «Сегодня» и «Вчера» оставили как есть, так как слишком часто их выбираю, а вот остальные сложили по селектам («Текущий», «Прошлый»). В случае с Кварталом это также «Текущий» и три последних квартала в виде «Q#». Год: «yyyy (Текущий)» и три последних года.
Можно с помощью этих пресетов отброситься на квартал или год назад, чтобы не листать календарь.
Бонусная задача: обработка (не) ошибки #2
Обработку (не) ошибки #1 можно прочитать тут.
Родилась из предположительного бага, но решили не наставлять ограничений, чтобы не накручивать логику.
Нынешний функционал позволял «выколоть» все дни из периода, таким образом для формирования отчета системе не было указано никаких дней вовсе. Соответственно, построить отчет она не могла.
Я предложила писать на месте отчета не просто сообщение об ошибке, а что именно могло произойти (все же, мы же можем увидеть, что фильтр по дням недели стоит, грубо говоря, на [none]. Плюсом в самом календаре предложила проводить валидацию на количество дней, выбранных для отчета. Таким образом пользователь сможет сразу увидеть:
- Сколько отчетов будет у него отображаться (если выбрал вывод по дням)
- Построится ли у него отчет в принципе
Если он строит отчет по конкретной телепередаче и знает, сколько этих телепередач, то количество дней поможет ему понять, что он прав.
Соответственно, если выколоть все дни, то вместо зеленой галочки мы получим желтый прямоугольник и надпись «Дней для отчета: 0».
5. Видеть выбор, когда календарь свернут в датапикер
Вынесла дату и выбранные дни недели наверх в заголовок (вместо того, чтобы писать «Период»), а дни недели соединила ярким фоном (получилась наглядная метафора, что такое Сквозной тип расчета) либо каждый день окрасила в яркий отдельный фон (Посуточный тип расчета).
Если выбраны, допустим, только выходные, то будет написано «сб, вс», то есть все дни не будут всегда перечислены.
Но из-за того, что они все же могут быть и все, датапикер имеет строгую минимальную ширину, что мешает делать его адаптив. Но, это решается минимальной шириной экрана, указанной в требованиях для системы, поэтому проблемы не вижу.
Заключение
В итоге календарь перестал быть просто формой для выбора дат — теперь он помогает пользователю осознанно управлять временем и понимать, как именно формируется его отчет. Для меня этот кейс — про то, как можно сделать нестандартное сложное понятным.
