Графический пользовательский интерфейс , или GUI ( / ˈɡuːi / [ 1 ] [2] GOO -ee ), представляет собой форму пользовательского интерфейса , которая позволяет пользователям взаимодействовать с электронными устройствами посредством графических значков и визуальных индикаторов, таких как вторичные обозначения . Во многих приложениях GUI используются вместо текстовых UI , которые основаны на набранных метках команд или текстовой навигации. GUI были введены в ответ на воспринимаемую крутую кривую обучения интерфейсов командной строки (CLI), [3] [4] [5] которые требуют ввода команд на клавиатуре компьютера .
Действия в графическом пользовательском интерфейсе обычно выполняются посредством прямого манипулирования графическими элементами. [6] [7] [8] Помимо компьютеров, графические пользовательские интерфейсы используются во многих портативных мобильных устройствах, таких как MP3- плееры, портативные медиаплееры, игровые устройства, смартфоны и небольшие бытовые, офисные и промышленные элементы управления . Термин графический пользовательский интерфейс , как правило, не применяется к другим типам интерфейсов с более низким разрешением дисплея , таким как видеоигры (где предпочтительны проекционные дисплеи ( HUD ) [9] ), или не включает плоские экраны, такие как объемные дисплеи [10], поскольку этот термин ограничен областью действия экранов 2D -дисплеев, способных описывать общую информацию, в традициях исследований в области компьютерных наук в исследовательском центре Xerox в Пало-Альто .
Проектирование визуальной композиции и временного поведения GUI является важной частью программирования приложений в области взаимодействия человека и компьютера . Его цель — повысить эффективность и простоту использования для базового логического дизайна хранимой программы , дисциплина дизайна, называемая удобством использования . Методы проектирования, ориентированного на пользователя, используются для того, чтобы гарантировать, что визуальный язык, введенный в дизайн, хорошо подходит для задач.
Видимые графические интерфейсные функции приложения иногда называют хромом или GUI . [11] [12] [13] Обычно пользователи взаимодействуют с информацией, манипулируя визуальными виджетами , которые позволяют взаимодействовать с типом данных, которые они содержат. Виджеты хорошо спроектированного интерфейса выбираются для поддержки действий, необходимых для достижения целей пользователей. Модель -представление-контроллер допускает гибкие структуры, в которых интерфейс независим и косвенно связан с функциями приложения, поэтому GUI можно легко настраивать. Это позволяет пользователям выбирать или разрабатывать другой скин или тему по своему желанию и облегчает работу дизайнера по изменению интерфейса по мере развития потребностей пользователя. Хороший дизайн GUI больше связан с пользователями и меньше с архитектурой системы. Большие виджеты, такие как окна , обычно предоставляют рамку или контейнер для основного содержимого презентации, такого как веб-страница, сообщение электронной почты или рисунок. Более мелкие обычно действуют как инструмент ввода данных пользователем.
GUI может быть разработан для требований вертикального рынка как GUI, специфичный для приложения. Примерами могут служить банкоматы (ATM), сенсорные экраны точек продаж (POS) в ресторанах, [14] кассы самообслуживания, используемые в розничных магазинах, самостоятельная продажа билетов и регистрация на рейсы в самолетах, информационные киоски в общественных местах, таких как железнодорожные станции или музеи, а также мониторы или экраны управления во встроенном промышленном приложении, которые используют операционную систему реального времени (RTOS).
Сотовые телефоны и портативные игровые системы также используют специальные сенсорные GUI. Новые автомобили используют GUI в своих навигационных системах и мультимедийных центрах или комбинациях навигационных мультимедийных центров.
Графический пользовательский интерфейс использует комбинацию технологий и устройств для предоставления платформы, с которой пользователи могут взаимодействовать для решения задач по сбору и созданию информации.
Ряд элементов, соответствующих визуальному языку, развился для представления информации, хранящейся в компьютерах. Это облегчает людям с небольшими навыками работы с компьютером и ее использование. Наиболее распространенной комбинацией таких элементов в графических интерфейсах является парадигма окон, иконок, текстовых полей, холстов, меню, указателя ( WIMP ), особенно в персональных компьютерах . [15]
Стиль взаимодействия WIMP использует виртуальное устройство ввода для представления положения интерфейса указательного устройства , чаще всего мыши , и представляет информацию, организованную в окнах и представленную значками . Доступные команды собираются вместе в меню, а действия выполняются с помощью жестов с указательным устройством. Менеджер окон облегчает взаимодействие между окнами, приложениями и оконной системой . Оконная система обрабатывает аппаратные устройства, такие как указательные устройства, графическое оборудование и позиционирование указателя.
В персональных компьютерах все эти элементы моделируются через метафору рабочего стола , чтобы создать симуляцию, называемую средой рабочего стола , в которой дисплей представляет собой рабочий стол, на котором могут быть размещены документы и папки с документами. Оконные менеджеры и другое программное обеспечение объединяются для имитации среды рабочего стола с различной степенью реалистичности.
Записи могут отображаться в списке, чтобы освободить место для текста и деталей, или в сетке для компактности и более крупных иконок с небольшим пространством под ними для текста. Существуют промежуточные варианты, такие как список с несколькими столбцами элементов и сетка элементов со строками текста, простирающимися в стороны от иконки. [16]
Многорядные и многоколоночные макеты, которые обычно встречаются в Интернете, — это «полка» и «водопад». Первый из них встречается в поисковых системах изображений , где изображения отображаются с фиксированной высотой, но переменной длиной, и обычно реализуется с помощью свойства CSS и параметра display: inline-block;
. Макет водопада, который можно найти на Imgur и TweetDeck, с фиксированной шириной, но переменной высотой для каждого элемента, обычно реализуется путем указания column-width:
.
Меньшие мобильные устройства, такие как персональные цифровые помощники (КПК) и смартфоны, обычно используют элементы WIMP с различными объединяющими метафорами из-за ограничений в пространстве и доступных устройств ввода. Приложения, для которых WIMP не очень подходит, могут использовать более новые методы взаимодействия , которые в совокупности называются пост-WIMP UI. [17]
По состоянию на 2011 год некоторые операционные системы с сенсорным экраном, такие как iOS ( iPhone ) и Android от Apple , используют класс графических интерфейсов, называемых post-WIMP. Они поддерживают стили взаимодействия с использованием более одного пальца, контактирующего с дисплеем, что позволяет выполнять такие действия, как сжатие и вращение, которые не поддерживаются одним указателем и мышью. [18]
Устройства интерфейса пользователя , обеспечивающие эффективное взаимодействие с графическим пользовательским интерфейсом, включают в себя компьютерную клавиатуру , особенно используемую вместе с сочетаниями клавиш , указательные устройства для управления курсором (или, скорее, указателем ): мышь , указку , сенсорную панель , трекбол , джойстик , виртуальные клавиатуры и проекционные дисплеи (прозрачные информационные устройства на уровне глаз).
Также есть действия, выполняемые программами, которые влияют на GUI. Например, есть компоненты, такие как inotify или D-Bus , которые облегчают связь между компьютерными программами.
В 1963 году Иван Сазерленд разработал Sketchpad , широко известную как первая графическая программа автоматизированного проектирования . Она использовала световое перо для создания и управления объектами в инженерных чертежах в реальном времени с помощью скоординированной графики. В конце 1960-х годов исследователи из Стэнфордского исследовательского института под руководством Дугласа Энгельбарта разработали On-Line System (NLS), которая использовала текстовые гиперссылки , управляемые с помощью нового на тот момент устройства: мыши . (Демонстрация NLS 1968 года стала известна как « Мать всех демонстраций ».) В 1970-х годах идеи Энгельбарта были дополнительно уточнены и расширены на графику исследователями из Xerox PARC и, в частности, Аланом Кеем , который вышел за рамки текстовых гиперссылок и использовал графический интерфейс в качестве основного интерфейса для языка программирования Smalltalk , который работал на компьютере Xerox Alto , выпущенном в 1973 году. Большинство современных графических интерфейсов общего назначения получены из этой системы.
Xerox PARC GUI состоял из графических элементов, таких как окна , меню , радиокнопки и флажки . Концепция иконок была позже введена Дэвидом Кэнфилдом Смитом , который написал диссертацию по этой теме под руководством Кея. [19] [20] [21] PARC GUI использует указательное устройство вместе с клавиатурой. Эти аспекты можно подчеркнуть, используя альтернативный термин и аббревиатуру для окон, иконок, меню, указательного устройства ( WIMP ). Эти усилия достигли кульминации в 1973 году в Xerox Alto , первом компьютере с графическим интерфейсом пользователя, хотя система так и не вышла в коммерческое производство.
Первым коммерчески доступным компьютером с графическим интерфейсом пользователя была рабочая станция PERQ 1979 года , произведенная Three Rivers Computer Corporation. Ее дизайн во многом был вдохновлен работой в Xerox PARC. В 1981 году Xerox в конечном итоге коммерциализировала идеи из Alto в форме новой и усовершенствованной системы — Xerox 8010 Information System — более известной как Xerox Star . [22] [23] Эти ранние системы стимулировали многие другие усилия по созданию графического интерфейса пользователя, включая машины Lisp от Symbolics и других производителей, Apple Lisa (представившую концепцию панели меню и элементов управления окнами ) в 1983 году, Apple Macintosh 128K в 1984 году и Atari ST с GEM от Digital Research и Commodore Amiga в 1985 году. Visi On был выпущен в 1983 году для компьютеров, совместимых с IBM PC , но никогда не пользовался популярностью из-за своих высоких требований к оборудованию. [24] Тем не менее, это оказало решающее влияние на современное развитие Microsoft Windows . [25]
Apple, Digital Research, IBM и Microsoft использовали многие идеи Xerox для разработки продуктов, а спецификации IBM Common User Access легли в основу графических интерфейсов, используемых в Microsoft Windows, IBM OS/2 Presentation Manager , а также в наборе инструментов и менеджере окон Unix Motif . Эти идеи развились для создания интерфейса, который можно найти в текущих версиях Microsoft Windows и в различных средах рабочего стола для Unix-подобных операционных систем , таких как macOS и Linux . Таким образом, большинство современных графических интерфейсов имеют в значительной степени общие идиомы.
Графические интерфейсы были горячей темой в начале 1980-х годов. Apple Lisa была выпущена в 1983 году, и существовали различные системы управления окнами для операционных систем DOS (включая PC GEM и PC/GEOS ). Отдельные приложения для многих платформ представляли свои собственные варианты графического интерфейса. [26] Несмотря на преимущества графического интерфейса, многие обозреватели подвергали сомнению ценность всей концепции, [27] ссылаясь на аппаратные ограничения и проблемы с поиском совместимого программного обеспечения.
В 1984 году Apple выпустила телевизионную рекламу , которая представила Apple Macintosh во время трансляции Суперкубка XVIII на CBS , [28] с намеками на известный роман Джорджа Оруэлла «1984» . Целью рекламы было заставить людей задуматься о компьютерах, определив удобный интерфейс как персональный компьютер, который отошел от предыдущих бизнес-ориентированных систем, [29] и стал фирменным представлением продуктов Apple. [30]
В 1985 году Commodore выпустила Amiga 1000 вместе с Workbench и Kickstart 1.0 (содержавший Intuition ). Этот интерфейс работал как отдельная задача, что означало, что он был очень отзывчивым и, в отличие от других GUI того времени, не зависал, когда программа была занята. Кроме того, это был первый GUI, который представил что-то похожее на Virtual Desktops .
Windows 95 , сопровождавшаяся обширной маркетинговой кампанией, [31] имела большой успех на рынке при запуске и вскоре стала самой популярной операционной системой для настольных компьютеров. [32]
В 2007 году с появлением iPhone [33] и позднее в 2010 году с появлением iPad [34] Apple популяризировала пост-WIMP-стиль взаимодействия для мультисенсорных экранов , и эти устройства считались вехами в развитии мобильных устройств [35] [36] .
Графические интерфейсы, знакомые большинству людей по состоянию на середину-конец 2010-х годов, — это интерфейсы Microsoft Windows , macOS и X Window System для настольных компьютеров и ноутбуков, а также Android , iOS от Apple , Symbian , BlackBerry OS , Windows Phone / Windows 10 Mobile , Tizen , WebOS и Firefox OS для портативных устройств ( смартфонов ). [37] [38]
Поскольку команд, доступных в интерфейсах командной строки, может быть много, сложные операции могут выполняться с использованием короткой последовательности слов и символов. Пользовательские функции могут использоваться для облегчения доступа к частым действиям. Интерфейсы командной строки более легкие , поскольку они вызывают только информацию, необходимую для задачи; например, нет эскизов предварительного просмотра или графического рендеринга веб-страниц. Это обеспечивает большую эффективность и производительность после изучения многих команд. [3] Но достижение этого уровня занимает некоторое время, поскольку слова команд могут быть нелегко обнаружить или мнемоническими . Кроме того, использование командной строки может стать медленным и подверженным ошибкам, когда пользователи должны вводить длинные команды, содержащие много параметров или несколько разных имен файлов одновременно. Однако интерфейсы окон, значков, меню, указателей ( WIMP ) предоставляют пользователям множество виджетов , которые представляют и могут вызывать некоторые из доступных команд системы.
GUI могут быть довольно сложными, когда диалоги глубоко зарыты в систему или перемещены в разные места во время редизайна. Кроме того, значки и диалоговые окна обычно сложнее для пользователей в плане скриптов.
WIMP широко используют режимы , поскольку значение всех клавиш и щелчков по определенным позициям на экране постоянно переопределяется. Интерфейсы командной строки используют режимы только в ограниченных формах, например для текущего каталога и переменных окружения .
Большинство современных операционных систем предоставляют как графический интерфейс, так и определенный уровень CLI, хотя графическому интерфейсу обычно уделяется больше внимания.
Оболочки GUI находят способ обойти версии интерфейса командной строки (CLI) (обычно) Linux и Unix-подобных программных приложений и их текстовые пользовательские интерфейсы или набранные метки команд. В то время как командная строка или текстовые приложения позволяют пользователям запускать программу неинтерактивно, оболочки GUI поверх них избегают крутой кривой обучения командной строке, которая требует ввода команд на клавиатуре . Запустив оболочку GUI, пользователи могут интуитивно взаимодействовать с ней, запускать, останавливать и изменять ее рабочие параметры, например, с помощью графических значков и визуальных индикаторов среды рабочего стола . Приложения также могут предоставлять оба интерфейса, и когда они это делают, GUI обычно представляет собой оболочку WIMP вокруг версии командной строки. Это особенно распространено в приложениях, разработанных для Unix-подобных операционных систем. Последнее раньше реализовывалось первым, поскольку позволяло разработчикам сосредоточиться исключительно на функциональности своего продукта, не беспокоясь о деталях интерфейса, таких как проектирование значков и размещение кнопок. Разработка программ таким образом также позволяет пользователям запускать программу в скрипте оболочки .
Многие среды и игры используют методы 3D-графики для проецирования 3D-объектов GUI на экран. Использование 3D-графики становится все более распространенным в основных операционных системах (например, Windows Aero и Aqua (MacOS)) для создания привлекательных интерфейсов, называемых eye candy (что включает, например, использование теней под окнами и курсором ), или для функциональных целей, возможных только с использованием трех измерений. Например, переключение пользователей представлено вращением куба с гранями, представляющими рабочее пространство каждого пользователя, а управление окнами представлено с помощью механизма переворачивания в стиле Rolodex в Windows Vista (см. Windows Flip 3D ). В обоих случаях операционная система преобразует окна на лету, продолжая обновлять содержимое этих окон.
GUI обычно основан на WIMP, хотя иногда всплывают и другие метафоры, например, используемые в Microsoft Bob , 3dwm, File System Navigator, File System Visualizer , 3D Mailbox, [39] [40] и GopherVR . Масштабирование (ZUI) — это связанная технология, которая обещает предоставить преимущества представления 3D-сред без их недостатков удобства использования, таких как проблемы ориентации и скрытые объекты. В 2006 году Hillcrest Labs представила первый ZUI для телевидения. [41] Другие инновации включают меню на PlayStation 2 , меню на Xbox , Project Looking Glass от Sun , Metisse , который был похож на Project Looking Glass, [42] BumpTop , где пользователи могут манипулировать документами и окнами с реалистичным движением и физикой, как если бы они были физическими документами, Croquet OS , которая создана для совместной работы, [43] и композитные оконные менеджеры, такие как Enlightenment и Compiz . Дополненная реальность и виртуальная реальность также используют элементы 3D GUI. [44]
3D-графические пользовательские интерфейсы появились в научно-фантастической литературе и фильмах еще до того, как определенные технологии стали осуществимыми или получили широкое распространение. [45]
Продукт Visi On не был предназначен для домашнего пользователя. Он был разработан и оценен для высокопроизводительных корпоративных рабочих станций. Аппаратное обеспечение, которое он требовал, было довольно большим для 1983 года. Он требовал минимум 512 КБ оперативной памяти и жесткий диск (5 МБ места).
Ключевыми были усилия Xerox PARC под руководством Алана Кея, которые стимулировали разработку [...] мощных пользовательских интерфейсов на основе растровых дисплеев. В некотором смысле все, что мы делаем здесь, это расширяем эту модель до 3D и добавляем новую надежную модель совместной работы объектов.