x
 
Алексей Рогулин
8 октября 2009

Когда имеешь дело с длинными списками из похожих, например, слов или числовых кодов одинаковой длины, глазам нужно за что-то цепляться. Для этого придумали чересполосицу. Но лично я её не очень люблю и на маке редко пользуюсь таким видом папки, где есть чересполосица. Не люблю, когда в глазах рябит, какими бы бледными эти полосы ни были.

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

Как вы думаете, имеет ли смысл такой ход?



В ТРИЗе есть стандарты «сделать статическое динамическим» (или постоянное — переменным) и «сделать неуправляемое управляемым».

Что если полоски были бы не постоянной, а переменной высоты?

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

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

Дизайн продуктов — дисциплина Школы руководителей. Набор открыт. Чем раньше поступите, тем ниже стоимость и выше шанс на бесплатное место.
 

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

Комментарии

Алексей Егоров
8 октября 2009

А я бы использовал многоцветную чересполосицу: цветная, белая, другая цветная, белая… И наряднее, и ориентироваться легче.

Юрий Хан
8 октября 2009

В продукте phpMyAdmin используется эта техника (подсветка строки, на которой курсор мыши). Кроме того, клик на строке ставит на ней перманентную подсветку другим цветом. Повторный клик — снимает.

К сожалению, их реализация имеет полтора фундаментальных недостатка.

Во-первых, в обработчике клика не проверяется кнопка, вследствие чего клик средней кнопкой, включающий автопрокрутку, побочным эффектом красит строку.

В-полуторных, было бы удобно использовать это как мультивыделение для групповых операций. У них же — на каждой строке есть отдельные кнопки/ссылки Edit и Delete.

Назар Токарь
9 октября 2009

В полосках произвольной высоты сложно ориентироваться, если нам нужно, к примеру, найти запись нужного номера. Например, 15-ю. Придётся складывать не по 3-5-7, а каждый столбец отдельно. Что неудобно.

Я бы предложил разбивать список на столбцы равной высоты, но не по три (слишком мало), а по 5-7.

Виктор Глушенков
10 октября 2009

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

Я бы предпочёл, чтобы подсвечивалось не всё подряд, а то, что мне нужно. Например, по клику (или двойному) подсвечивалась выбранная строка. Убрать выделение можно повторным кликом. Так я и несколько строк в таблице могу раскрасить, какие мне важны.

Кирилл Латинский
12 октября 2009

Вместо окрашивания строчек я чаще предпочитаю увеличивать интервалы. Глаз отлично цепляется за сгруппированные ячейки, и это не мешает воспринимать таблицу целиком. Оптимальным количеством группируемых строк мне представляется 4 или 5.

Юрий Хан
13 октября 2009

Виктору Глушенкову:

> И тут возникает проблема, как сохранить подсветку во время горизонтальной прокрутки.

Зажимаем среднюю кнопку, двигаемся чуть вправо, когда докрутится, отпускаем.

Александр Благочевский
13 октября 2009

Кирилл Латинский, в вашей таблице непонятно, как цифры читать, по горизонтали или по вертикали.

Виктор Глушенков
15 октября 2009

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

Даже если забыть про выдуманный мной пример с очень длинной таблицей, это просто неудобно: сконцентрированно держать руку с зажатой мышью на строке, чтобы ничего не потерять. А если при этом надо в другую таблицу на другой вкладке посмотреть? А если в скайп при этом написать: «О! Кажется, я нашёл, на чём мы будем экономить в этом месяце!»?


20 октября 2009

Исследование полезности чересполосицы (англ.)
http://www.alistapart.com/articles/zebrastripingdoesithelp

Автор пришел к выводу, что большого смысла в ней нет.

Павел Левин
24 мая 2011

Артём, как динамическая подсветка будет работать на планшетниках?

Alex Tikonoff
21 ноября 2017

По поводу исследования, автор вообще-то пришёл к другому выводу - «нет большого выигрыша в скорости или точности». А также указал, что 46% опрошенных предпочли версию с зеброй, а 33% было всё равно, что даёт нам всего 21% тех, кто был против.

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

Всё это говорит, что зебру скорее лучше использовать, чем нет. Ориентируясь, конечно, на контекст и своё восприятие прекрасного.


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

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

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

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

15 14 2 2




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

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