x
 
Илья
18 октября 2016
Советы почтой каждую неделю
Пожалуйста, получите наше письмо, чтобы подтвердить свой адрес:
Вы подписаны на «Советы за неделю»:

Как должна работать прокрутка?


При прокрутке содержимое не разделяют на части, на экране постоянно виден его фрагмент, а пользователь плавно перемещается по нему при помощи специальных жестов и экранных элементов:


Элемент управления прокруткой называется полосой прокрутки.

Кадры из исторического видео об элементах интерфейса

Полосы прокрутки придумали в 1974 году для текстового редактора «Браво», созданного в центре исследований Ксерокса. При подведении мыши к левому краю экрана, появлялся индикатор. Он показывал, где в документе находится пользователь:

Компьютер «Ксерокс Альто»



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

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

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


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

Вправо полосы прокрутки переехали в начале 80-х.


Позже (кто?) для построчной прокрутки в сами полосы добавили кнопки-стрелки. Сначала они указывали не направления движения лифтов, а направления движения содержимого. Верхняя стрелка смотрела вниз, а нижняя — вверх:


Здесь в вертикальной полосе ещё есть кнопки + и − для листания по страницам.

В 1984 году Эпл в Макинтоше перевернул стрелки и избавился от + и −, но забыл про пропорциональный скроллинг — лифт Макиншота был квадратным независимо от длины документа:

Уважаемые советчики! Помогите закрыть пробелы в истории.


Однако листание осталось важным частным случаем прокрутки. На Макинтоше для постраничного листания использовалась шахта: клик в шахту над лифтом приводил к переходу на страницу вверх, под лифтом — вниз.

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

Позже (где, когда?) полосе прокрутки стало безразлично, где будет курсор мыши, когда пользователь отпустит кнопку.

Музей интерфейса

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

О мгновенной обратной связи

В «Нексте» в 1989 году полосы прокрутки стали пропорциональными, снова оказалась слева, а стрелки разместились рядом, а не на концах полосы прокрутки:


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

Мак научился пропорциональным полосам только в 2000 году, в системе Мак ОС Х, основанной на многих технологиях «Некста». Опцию размещения стрелок рядом Мак имел до тех пор, пока вообще показывал эти стрелки. А придуманное в «Нексте» замедленное таскание лифта с нажатым «Альтом» работает на Маке и сейчас.

Но Мак унаследовал не всё. Шахта «Некста» работала иначе  — клик в любое её место мгновенно перемещал лифт туда. Для постраничного листания нужно было кликать в стрелки с нажатым «Альтом».

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


«Некст» — компания, основанная Стивом Джобсом после увольнения из Эпла в 1985 году. Была куплена Эплом в 1997-м.

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


Документация «Опен-лука»

Продолжение

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

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

Комментарии

Игорь Адаменко
18 октября 2016

Стрелки добавили тоже в «Ксероксе» при разработке «Ксерокс Стар». Пруф тут, в разделе A digression — arrows: http://alandix.com/academic/papers/scrollbar/

Константин Петров
20 октября 2016

Если настроить Мак ОС так, как показано на картинке, будет один в один старое некстовское поведение шахты.


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

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

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

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





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

Почему дизайнер должен уметь писать текст? 8 Правдивость 4 Как следует поступить дизайнеру, если клиент постоянно вспоминает «нечто очень важное» 7 Какой движок выбрать для сайта рекламного агентства? 2