x
 
Даниил Мочуляк
28 июня 2007

Уважаемый Артем, интересно ваше мнение, а также совет, рекомендации и критика.

Ввод даты
Проблема: ввод даты. Вероятно, для кого-то это неочевидная проблема и пользователи попросту привыкли осуществлять ввод ручками.

Решение: ввод даты в поле формы через выпадающий календарь.

Реализация. Сразу оговорюсь, календарный ввод даты находится в процессе реализации и скриншоты — это, так сказать, alfa, в которой отсутствуют пока подсветка месяца и числа, а также кнопуля с крестиком [x] в правом верхнем углу. Открытым стоит вопрос с кнопкой «ввод», на данном этапе он осуществляется по выбору числа.



Вообще, этот элемент — развитие идеи выпадающего списка, поэтому подтверждающие и отменяющие кнопки не нужны.

Во всех выпадающих календарях меня смущает дискретность перемещения во времени. Можно видеть либо июнь, либо июль. Если ваша мысль находится на границе месяцев, такой календарь вам не поможет думать.

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

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

P. S. Выпадающий календарь подходит для ситуаций, когда нужно подобрать дату. Для ввода даты рождения подойдут обычные поля и выпадающие списки.


Поделиться
Отправить

Комментарии

Огарко Татьяна
28 июня 2007

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

Алексей Мельников
28 июня 2007

Даниил, если вы не подсвечиваете сегодняшнее число в календаре, а выводите его текстом ниже, то после «сегодня» не надо двоеточие, а в сегодняшнем числе год — избыточная информация. По большому счету, и месяц, наверное, избыточен.

— Какой, бишь, сегодня день?
— Пятое.
— ?
— Четвергъ!

Евгений Бакст
30 июня 2007

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

Вот такой контрол. Что скажете?

Станислав Болотов
30 июня 2007

Евгений, идея кругового отображения года, несомненно, интересная, но в данном случае она не подходит вот по какой причине.

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

P. S. При проектировании полос прокрутки и их модификаций не следует забывать о том, что на 99% всех мышей сейчас присутствует колесико, которое задает вертикальное направление прокрутки.

Алексей Мельников
30 июня 2007

Евгений, у вас месяцы расположены против часовой стрелки. И раз уж так получилось, что месяцов столько же, сколько и часов на циферблате, то синие маркеры лучше располагать как на часах.

Огарко Татьяна
30 июня 2007

Евгений, идея несколько непривычная. Лично у меня возникает желание крутить не маркер, а саму шкалу (сложившийся рефлекс от телефонного аппарата с дисковым наборником), и опять же из-за привычности к часам с направлением делений через правую сторону, сбивает с толку следование декабря за январем.

1 января просится на 12 часов.

А спиннер стоит заменить выпадающим списком — замахаешься щелкать, если нужен будет годок эдак 1994.

И под плашкой с числами не помешала бы плашка с названием месяца, чтобы наверняка знать, что сейчас именно июнь, а не что-то иное. Хотя, в таком случае, отпадает необходимость в календарном круге)

Белан Александр
1 июля 2007

В конроле выбора даты, если месяц пишут словом, то нужно добавлять его порядковый номер. Например так — «(11) Ноябрь».

Потому что даты для ввода очень часто бывают числовые — 12.11.2006. А бывают и полные, где месяц записан словом. И переводить число в название — тоже процесс мозга. Надо ему помогать (мозгу). Если январь и декабрь переводятся в числа человеком практически беошибочно, то с остальными названиями возможны промахи. Нужно помочь человеку делать правильный выбор.

Кузин Денис
2 июля 2007

Добрый день.

Я второй разработчик исходного контрола. Большое спасибо всем за советы, в ближайшей версии отдельные светлые мысли будут реализованны, но есть еще глобальный вопрос. А имеет ли смысл разработка библиотеки узконаправленных элементов ввода. Т. е., например, для ввода даты, для ввода времени, для ввода цвета … ну и так далее.

Кто что думает по этому поводу?

Евгений Бакст
2 июля 2007

Хотел бы сказать несколько слов по поводу расположения месяцев. У меня в голове почему-то весна пространственно находится слева, а осень — справа. Если вписать в этот круг квадрат, возможно, вы поймете ход моей мысли. И тогда станет ясно, почему 1.01 не на 12 часов.
Мне показалось, что в такое расположение носит «тень» астрономического года.

Юрий Хан
9 июля 2007

Разработать контрол по типу раскрывающегося списка — весьма нетривиальная задача, есть очень много мест, где можно мелко и на первый взгляд незаметно накосячить, но пользователь вас проклянет.

Вот, например, есть такой биллинг Netup UTM5. У него все даты вводятся через выпадающий календарь. Интерфейс сделан на Java.

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

Проблема номер полтора. Обычный комбобокс позволяет нажатиями стрелок вверх и вниз выбирать элемент без выдергивания всего списка. Стандартный календарный контрол в Windows выделяет фокусом одну из компонент даты и позволяет нажатиями стрелок прокручивать ее. UTM’овский календарь не делает ни того, ни другого.

Проблема номер два. Календарь выпадает по клавише F4, как это принято в Windows, но, поскольку текущее значение не подсвечивается и развернутый календарь не реагирует на клавиши-стрелки, толку с этого ноль.

Проблема номер три. Я привык, что в обычном комбобоксе, если я нажал кнопку не на том элементе, я могу ее протянуть и отпустить там, где надо. UTM позволяет нажать, протянуть и отпустить, но засчитывает ту точку, где было нажатие, заставляя меня снова выдернуть календарь и повторить выбор. Если вовремя замечу.

Проблема номер четыре. У них тип данных для дат расширен выделенным значением «Infinite date». В календаре это отображается как чекбокс, при отметке которого вся остальная часть календаря прячется. Я бы предпочел, чтобы она делалась неактивной, а лучше — оставляла бы возможность при выделенном варианте «Infinite» ткнуть в любой день.

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

В веб-интерфейсе того же UTM есть формы, где требуется ввести временной интервал. Реализован как 10 селектов с числами от 1 до 31, месяцами с января по декабрь, годами в каком-то заранее заданном диапазоне, часами с 00 по 23, минутами с 00 по 60. Я готов терпеть в таких формах два поля ввода в формате YYYY-MM-DD hh:mm, максимум четыре (с разделением на дату и время).

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

Немногим лучше валидация по уходу из поля. Но, на мой взгляд, самое правильное — валидировать все поля только при нажатии OK (в случае веба — перед отправкой формы).

Пример хорошего поля ввода даты/времени — Excel. Если для ячейки выставлен формат ГГГГ-ММ-ДД, то одно число будет проинтерпретировано как день текущего месяца, два числа с разделителем — как дата в текущем году.


9 июля 2007

Юрий, спасибо за подробное рассмотрение проблемы.

Добавлю, что календарик стоит делать именно по принципу комбобокса, принимающего ввод с клавиатуры в произвольном формате, а не стандартного выпадающего списка (селекта), допускающего ввод только фиксированных значений.

Юрий Хан
9 июля 2007

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

Алексей Копылов
26 июля 2007

Волшебная программа — это, например, MS Outlook 2003. В Задачах, в строке Срок, можно написать «вчера», «следующий четверг» и даже «100 лет назад» :-)

Виктор Никитин
3 сентября 2007

Контрол, разработанный мной для программного обеспечения Oktell. Предназначен для выбора даты либо интервала дат.
— Год представлен в виде круга. Виден сразу целый календарный год.
— При наведении на месяц он подкрашивается, также подкрашивается и выбранный день.
— Текущая дата подкрашена короткой красной полосой и написана в центре. Естественно, по нажатию на эту надпись выбирается эта дата.
— С помощью скрола мыши можно плавно «развигать» месяц, чтобы было удобно выбрать день. С помошью правой кнопки мыши это происходит сразу.
— Контрол позволяет выбрать интервал дат в 2 нажатия мыши.

Разработан в начале 2006 года.

Сергей Никитин
28 июня 2011

Здравствуйте! Решил попробовать реализовать идею Артёма, визуальная часть почти готова: http://www.mrnix.ru/blog/post/177/picker

Тимур Арефьев
15 февраля 2014

Я тоже попробовал реализовать идею:

http://ag-test-1.kengurumi.ru/

Даты при переключении года ползают на манер Бирмановского Всегдабря.

Тимур Сергеевич Арефьев
9 декабря 2015

Если кто-то наткнётся на этот совет, реализация последней версии календаря здесь:
http://timurarefev.ru/all/goodyear/


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

Мы публикуем комментарии, которые добавляют к уже сказанному новые мысли и хорошие примеры. Мы ожидаем, что такие комментарии составят около 20% от общего числа.

Решение о публикации принимается один раз; мы не имеем возможности комментировать или пересматривать свое решение, хотя оно может быть ошибочно. Уже опубликованные комментарии могут быть удалены через некоторое время, если без них обсуждение не становится менее ценным или интересным.

Вот такой веб 2.0.

11 2 6 5




Недавно всплыло

Как сделать, чтобы публикация выделялась в ленте: композиция, исправление дефектов, цвет 1 1 Выбранные элементы списка, как не забывать принципы из советов бюро и когда нужен логотип 1 3