Графический пользовательский интерфейс , или 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 ). В обоих случаях операционная система преобразует окна на лету, продолжая обновлять содержимое этих окон.
Графический интерфейс пользователя обычно основан на 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 и добавляем новую надежную модель совместной работы объектов.