Илья Бир­ман

Пользовательский интерфейс

🔍 Начните печатать, чтобы искать по книге или перейти к нужной странице по номеру

Удобно листать не только прокруткой, но и клавишами‑стрелками:

 
между важными местами
Shift
между
разворотами
Илья Бир­ман

Пользовательский интерфейс

Изда­тель­ство Бюро Гор­бу­нова
2017
Илья Бирман

Пользовательский интерфейс

Издательство Бюро Горбунова
2017
удк 655.262
ббк 85.15
Б64
Бир­ман И. Б.
Б64
Поль­зо­ва­тель­ский интер­фейс. —
М.: Изд‑во Бюро Гор­бу­нова, 2017
ISBN 978‑5‑9907024‑1‑7

Пред­став­ляем книгу Изда­тель­ства Дизайн‑бюро Артёма Гор­бу­нова — прак­ти­че­ское руко­вод­ство по поль­зо­ва­тель­скому интер­фейсу. Учеб­ник пред­на­зна­чен для дизай­не­ров, редак­то­ров, руко­во­ди­те­лей, раз­ра­бот­чи­ков и всех, кто при­ча­стен к созда­нию продуктов.

УДК 655.262
ББК 85.15
ISBN 978‑5‑9907024‑1‑7
© Изда­тель­ство
Бюро Гор­бу­нова, 2017

Оглавление

    Принципы 4

    Взаимодействие 86

    Язык 213

    Экраны 311

удк 655.262
ббк 85.15
Б64
Б64
Бирман И. Б.
Пользовательский интерфейс. —
М.: Изд‑во Бюро Горбунова, 2017
ISBN 978‑5‑9907024‑1‑7

Представляем книгу Издательства Дизайн‑бюро Артёма Горбунова — практическое руководство по пользовательскому интерфейсу. Учебник предназначен для дизайнеров, редакторов, руководителей, разработчиков и всех, кто причастен к созданию продуктов.

УДК 655.262
ББК 85.15
ISBN 978‑5‑9907024‑1‑7
© Издательство
Бюро Горбунова, 2017

Оглавление

    Принципы 4

    Взаимодействие 86

    Язык 213

    Экраны 311

Скрыто 186 разворотов

Попу­ляр­ность Вин­до­уса поз­во­ляет счи­тать логику его полос про­крутки стан­дарт­ной: там она уста­ка­ни­лась и не меня­лась больше два­дцати лет. От вер­сии к вер­сии менялся лишь внеш­ний вид:

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

Кнопки‑стрелки прокручивают на одну строку. Они указывают в направлении движения лифта, а не содержания

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

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

Популярность Виндоуса позволяет считать логику его полос прокрутки стандартной: там она устаканилась и не менялась больше двадцати лет. От версии к версии менялся лишь внешний вид.

Кнопки‑стрелки прокручивают на одну строку. Они указывают в направлении движения лифта, а не содержания

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

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

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

Настройка рабочего стола Виндоуса 3.1, 1990

Изна­чально на полосу про­крутки смот­рели про­сто как на один из эле­мен­тов экран­ного интер­фейса, вроде кнопки и поля ввода. Как пра­вило, она рабо­тала как эле­мент управ­ле­ния для пере­ме­ще­ния по доку­менту и как инди­ка­тор поло­же­ния в нём. В неко­то­рых ста­рых интер­фей­сах можно даже встре­тить её вме­сто ползунка.

Настройка рабочего стола Виндоуса 3.1, 1990

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

Но чело­век изоб­рёл колесо.

Колесо управ­ляло дви­же­нием лифта в полосе про­крутки. При дви­же­нии вверх содер­жи­мое про­кру­чи­ва­лось вниз.

Бла­го­даря колесу люди стали всё реже исполь­зо­вать полосы про­крутки для про­крутки, однако на их дизайн это почти не влияло.

В 2000‑х в Эпле реа­ли­зо­вали про­крутку на трек­па­дах — нужно было про­во­дить по ним не одним, а двумя пальцами.

Про­крутка обрела новое каче­ство. Ока­за­лось, что про­крутка — спо­соб вза­и­мо­дей­ствия по важ­но­сти срав­ни­мый с кликом.

Микрософт Интеллимаус, 1996

Микрософт Интеллимаус, 1996

Но человек изобрёл колесо.

Колесо управляло движением лифта в полосе прокрутки. При движении вверх содержимое прокручивалось вниз.

Благодаря колесу люди стали всё реже использовать полосы прокрутки для прокрутки, однако на их дизайн это почти не влияло.

В 2000‑х в Эпле реализовали прокрутку на трекпадах — нужно было проводить по ним не одним, а двумя пальцами.

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

Видео с презентации «Макворлд», 2007

В 2007 вышел Айфон. На малень­ком экране про­крутка нужна посто­янно. Вме­сто клас­си­че­ских полос про­крутки Айфон исполь­зо­вал всю пло­щадь экрана. Отпала необ­хо­ди­мость при­це­ли­ваться. Обрат­ная связь созда­вала ощу­ще­ние непо­сред­ствен­ного вза­и­мо­дей­ствия. Стив Джобс «про­сто брал палец — и прокручивал».

Видео с презентации «Макворлд», 2007

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

У полосы про­крутки оста­лась лишь задача инди­ка­ции поло­же­ния в про­кру­чи­ва­е­мой обла­сти. Поэтому в Айфоне изба­ви­лись от стре­лок и шахт, оста­вив только тонень­кие лифты — Эпл назвал их «скрол­ле­рами». Они появ­ля­ются только во время про­крутки прямо поверх про­кру­чи­ва­е­мого содер­жи­мого. Это поз­во­лило не выде­лять для них допол­ни­тель­ное место.

«Скрол­леры» вме­сто клас­си­че­ских полос про­крутки стали стан­дар­том Мака к 2011 году. Тогда же на Мак при­шли инер­ция и пру­жи­ни­стость. А спу­стя несколько лет появи­лась и воз­мож­ность изме­нить направ­ле­ние про­крутки с обрат­ного на пря­мое, чтобы управ­лять дви­же­нием содер­жи­мого, а не лифта — как на Айфоне.

У полосы прокрутки осталась лишь задача индикации положения в прокручиваемой области. Поэтому в Айфоне избавились от стрелок и шахт, оставив только тоненькие лифты — Эпл назвал их «скроллерами». Они появляются только во время прокрутки прямо поверх прокручиваемого содержимого. Это позволило не выделять для них дополнительное место.

«Скроллеры» вместо классических полос прокрутки стали стандартом Мака к 2011 году. Тогда же на Мак пришли инерция и пружинистость. А спустя несколько лет появилась и возможность изменить направление прокрутки с обратного на прямое, чтобы управлять движением содержимого, а не лифта — как на Айфоне.

Скрыто 225 разворотов

Бир­ман Илья Борисович

Поль­зо­ва­тель­ский интерфейс

  • Арт‑дирек­тор и изда­тель Артём Горбунов

  • Дизай­нер обложки и фото­граф
    Вла­ди­мир Колпаков

  • Иллю­стра­тор Андрей Кокорин

  • Раз­ра­бот­чики Рустам Кул­ма­тов
    и Васи­лий Половнёв

  • Мет­ран­паж и тести­ров­щик Сер­гей Фролов

  • Помощ­ники Юрий Мазур­ский
    и Алек­сандра Шабалдина

  • Книга набрана шриф­тами
    «Бюро­се­риф» и «Бюросанс»

  • Дизайн‑бюро Артёма Гор­бу­нова
    Большая Новодмитровская улица,
    дом 36, стро­е­ние 2
    Москва, Рос­сия, 127015

  • bureau.ru

Бирман Илья Борисович

Пользовательский интерфейс

  • Арт‑директор и издатель Артём Горбунов

  • Дизайнер обложки и фотограф
    Владимир Колпаков

  • Иллюстратор Андрей Кокорин

  • Разработчики Рустам Кулматов
    и Василий Половнёв

  • Метранпаж и тестировщик Сергей Фролов

  • Помощники Юрий Мазурский
    и Александра Шабалдина

  • Книга набрана шрифтами
    «Бюросериф» и «Бюросанс»

  • Дизайн‑бюро Артёма Горбунова
    Большая Новодмитровская улица,
    дом 36, строение 2
    Москва, Россия, 127015

  • bureau.ru

Закладки
Добавьте закладки
Ничего не нашлось