Графический интерфейс пользователя , или GUI ( / ˈ ɡ uː i / [1] [2] GOO -ee ), — это форма пользовательского интерфейса , которая позволяет пользователям взаимодействовать с электронными устройствами посредством графических значков и визуальных индикаторов, таких как вторичные обозначения . Во многих приложениях вместо текстовых интерфейсов , основанных на вводимых метках команд или текстовой навигации, используются графические интерфейсы . Графические пользовательские интерфейсы были введены в ответ на воспринимаемую крутую кривую обучения интерфейсов командной строки (CLI), [3] [4] [5] , которые требуют ввода команд на клавиатуре компьютера .
Действия в графическом интерфейсе обычно выполняются путем прямого манипулирования графическими элементами. [6] [7] [8] Помимо компьютеров, графические интерфейсы используются во многих портативных мобильных устройствах , таких как MP3- плееры, портативные медиаплееры, игровые устройства, смартфоны и небольшие бытовые, офисные и промышленные средства управления . Термин GUI, как правило, не применяется к другим типам интерфейсов с более низким разрешением дисплея , таким как видеоигры (где предпочтительнее проекционные дисплеи ( HUD ) [9] ) или не включает плоские экраны, такие как объемные дисплеи [10], потому что этот термин ограничен сферой применения 2D- экранов, способных описывать общую информацию, в традициях компьютерных исследований в Исследовательском центре Xerox в Пало-Альто .
Проектирование визуальной композиции и временного поведения графического пользовательского интерфейса является важной частью программирования приложений в области взаимодействия человека и компьютера . Его цель — повысить эффективность и простоту использования лежащего в основе логического проектирования хранимой программы — дисциплины проектирования, называемой юзабилити . Методы пользовательско-ориентированного дизайна используются для того, чтобы визуальный язык, введенный в дизайн, был хорошо адаптирован к поставленным задачам.
Видимые функции графического интерфейса приложения иногда называют Chrome или GUI . [11] [12] [13] Обычно пользователи взаимодействуют с информацией, манипулируя визуальными виджетами , которые позволяют осуществлять взаимодействие, соответствующее типу данных, которые они хранят. Виджеты хорошо продуманного интерфейса подобраны так, чтобы поддерживать действия, необходимые для достижения целей пользователей. Модель -представление-контроллер позволяет создавать гибкие структуры, в которых интерфейс не зависит от функций приложения и косвенно связан с ними, поэтому графический интерфейс можно легко настроить. Это позволяет пользователям выбирать или создавать другой скин по своему желанию и облегчает работу дизайнера по изменению интерфейса по мере развития потребностей пользователя. Хороший дизайн графического пользовательского интерфейса больше относится к пользователям, а не к архитектуре системы. Большие виджеты, такие как окна , обычно представляют собой рамку или контейнер для основного содержимого презентации, такого как веб-страница, сообщение электронной почты или рисунок. Меньшие обычно действуют как инструмент пользовательского ввода.
Графический интерфейс может быть разработан с учетом требований вертикального рынка как графический интерфейс для конкретного приложения. Примеры включают банкоматы (ATM), сенсорные экраны точек продаж (POS) в ресторанах, [14] кассы самообслуживания, используемые в розничных магазинах, системы самостоятельной регистрации билетов и регистрации на рейсы авиакомпаний, информационные киоски в общественных местах, например вокзал или музей, а также мониторы или экраны управления во встроенном промышленном приложении, использующем операционную систему реального времени (RTOS).
В сотовых телефонах и портативных игровых системах также используются графические интерфейсы с сенсорным экраном для конкретных приложений. В новых автомобилях графические интерфейсы используются в навигационных системах и мультимедийных центрах или в комбинациях навигационных мультимедийных центров.
Графический интерфейс использует комбинацию технологий и устройств, чтобы предоставить платформу, с которой пользователи могут взаимодействовать для решения задач сбора и производства информации.
Ряд элементов, соответствующих визуальному языку, эволюционировали для представления информации, хранящейся в компьютерах. Это облегчает работу и использование компьютерного программного обеспечения людям с небольшими навыками работы с компьютером. Наиболее распространенной комбинацией таких элементов в графических интерфейсах является парадигма окон, значков, текстовых полей, холстов, меню и указателей ( WIMP ), особенно на персональных компьютерах . [15]
Стиль взаимодействия WIMP использует виртуальное устройство ввода для представления положения интерфейса указательного устройства , чаще всего мышь , и представляет информацию, организованную в окнах и представленную значками . Доступные команды объединены в меню, а действия выполняются жестами манипулятора. Оконный менеджер облегчает взаимодействие между окнами, приложениями и оконной системой . Оконная система обрабатывает аппаратные устройства, такие как указывающие устройства, графическое оборудование и позиционирование указателя.
В персональных компьютерах все эти элементы моделируются с помощью метафоры рабочего стола для создания симуляции, называемой средой рабочего стола , в которой дисплей представляет собой рабочий стол, на котором можно размещать документы и папки с документами. Оконные менеджеры и другое программное обеспечение в совокупности моделируют среду рабочего стола с разной степенью реализма.
Записи могут отображаться в списке, чтобы освободить место для текста и подробностей, или в сетке для компактности и более крупных значков с небольшим пространством под текстом. Существуют промежуточные варианты, такие как список с несколькими столбцами элементов и сетка элементов со строками текста, идущими вбок от значка. [16]
Многострочные и многоколоночные макеты, обычно встречающиеся в Интернете, — это «полка» и «водопад». Первый встречается в поисковых системах изображений , где изображения появляются с фиксированной высотой, но переменной длиной, и обычно реализуется с помощью свойства и параметра CSS display: inline-block;
. Макет водопада, найденный на Imgur и Tweetdeck, с фиксированной шириной, но переменной высотой для каждого элемента, обычно реализуется путем указания column-width:
.
Небольшие мобильные устройства с приложениями, такие как персональные цифровые помощники (КПК) и смартфоны , обычно используют элементы WIMP с различными объединяющими метафорами из-за ограничений в пространстве и доступных устройств ввода. Приложения, для которых WIMP не очень подходит, могут использовать новые методы взаимодействия , называемые пользовательскими интерфейсами после WIMP . [17]
По состоянию на 2011 год некоторые операционные системы на базе сенсорных экранов, такие как Apple iOS ( iPhone ) и Android, используют класс графических интерфейсов под названием post-WIMP. Эти стили взаимодействия поддерживают использование более одного пальца при контакте с дисплеем, что позволяет выполнять такие действия, как сведение и вращение, которые не поддерживаются одним указателем и мышью. [18]
Устройства пользовательского интерфейса для эффективного взаимодействия с графическим пользовательским интерфейсом включают компьютерную клавиатуру , особенно используемую вместе с сочетаниями клавиш , указательные устройства для управления курсором (или, скорее, указателем ): мышь , указку , сенсорную панель , трекбол , джойстик , виртуальные клавиатуры и проекционные дисплеи (полупрозрачные информационные устройства на уровне глаз).
Также существуют действия, выполняемые программами, влияющие на графический интерфейс. Например, существуют такие компоненты, как inotify или D-Bus , для облегчения связи между компьютерными программами.
Иван Сазерленд разработал Sketchpad в 1963 году и широко известен как первая программа графического компьютерного проектирования . Он использовал световое перо для создания объектов на инженерных чертежах и манипулирования ими в реальном времени с использованием скоординированной графики. В конце 1960-х годов исследователи из Стэнфордского исследовательского института под руководством Дугласа Энгельбарта разработали онлайн-систему (NLS), которая использовала текстовые гиперссылки, управляемые с помощью нового на тот момент устройства: мыши . (Демонстрация NLS в 1968 году стала известна как « Мать всех демонстраций » ). GUI в качестве основного интерфейса для языка программирования Smalltalk , который работал на компьютере Xerox Alto , выпущенном в 1973 году. Большинство современных графических интерфейсов общего назначения произошли от этой системы.
Графический интерфейс Xerox PARC состоял из графических элементов, таких как окна , меню , переключатели и флажки . Понятие икон было позже введено Дэвидом Кэнфилдом Смитом , написавшим диссертацию на эту тему под руководством Кея. [19] [20] [21] В графическом интерфейсе PARC используется указательное устройство и клавиатура. Эти аспекты можно подчеркнуть, используя альтернативный термин и аббревиатуру для окон, значков, меню, указывающего устройства ( WIMP ). Кульминацией этих усилий стал Xerox Alto в 1973 году , первый компьютер с графическим интерфейсом, хотя система так и не достигла коммерческого производства.
Первым коммерчески доступным компьютером с графическим пользовательским интерфейсом стала рабочая станция PERQ 1979 года , выпускаемая компанией Three Rivers Computer Corporation. На его дизайн сильно повлияла работа Xerox PARC. В 1981 году Xerox в конечном итоге коммерциализировала идеи Alto в форме новой усовершенствованной системы — информационной системы Xerox 8010, более известной как Xerox Star . [22] [23] Эти ранние системы стимулировали множество других усилий по созданию графического пользовательского интерфейса, в том числе машины Lisp от символики и других производителей, 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] с намеками на знаменитый роман Джорджа Оруэлла «Девятнадцать восемьдесят четыре» . Цель рекламного ролика заключалась в том, чтобы заставить людей задуматься о компьютерах, обозначив удобный интерфейс персонального компьютера, который отошел от прежних бизнес-ориентированных систем [29] и стал характерным представителем продуктов Apple. [30]
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 ) предоставляют пользователям множество виджетов , которые представляют и могут запускать некоторые доступные команды системы.
Графические интерфейсы могут быть довольно сложными, когда диалоги спрятаны глубоко в системе или перемещаются в разные места во время редизайна. Кроме того, пользователям обычно сложнее писать сценарии для значков и диалоговых окон.
Вимпы широко используют режимы , поскольку значение всех клавиш и щелчков по определенным позициям на экране постоянно переопределяются. Интерфейсы командной строки используют режимы только в ограниченных формах, например, для переменных текущего каталога и среды .
Большинство современных операционных систем предоставляют как графический интерфейс, так и некоторый уровень интерфейса командной строки, хотя графическому интерфейсу обычно уделяется больше внимания.
Оболочки графического пользовательского интерфейса находят способ обойти версии интерфейса командной строки (CLI) (обычно) Linux и Unix-подобных программных приложений, а также их текстовые пользовательские интерфейсы или метки печатных команд. В то время как приложения командной строки или текстовые приложения позволяют пользователям запускать программу в неинтерактивном режиме, оболочки с графическим пользовательским интерфейсом поверх них позволяют избежать сложного обучения работе с командной строкой, которое требует ввода команд на клавиатуре . Запустив оболочку с графическим интерфейсом, пользователи могут интуитивно взаимодействовать , запускать, останавливать и изменять ее рабочие параметры, например, с помощью графических значков и визуальных индикаторов среды рабочего стола . Приложения также могут предоставлять оба интерфейса, и когда они это делают, графический интерфейс обычно представляет собой WIMP-оболочку версии для командной строки. Это особенно характерно для приложений, разработанных для Unix-подобных операционных систем. Последнее раньше реализовывалось в первую очередь, поскольку позволяло разработчикам сосредоточиться исключительно на функциональности своего продукта, не беспокоясь о деталях интерфейса, таких как дизайн значков и размещение кнопок. Разработка программ таким образом также позволяет пользователям запускать программу в сценарии оболочки .
Многие среды и игры используют методы 3D-графики для проецирования 3D-объектов графического интерфейса на экран. Использование 3D-графики становится все более распространенным в основных операционных системах (например, Windows Aero и Aqua (MacOS)) для создания привлекательных интерфейсов, называемых «приятными для глаз» (которые включают, например, использование теней под окнами и курсором ). ), или для функциональных целей возможно только использование трех измерений. Например, переключение пользователей представлено вращением куба с гранями, представляющими рабочее пространство каждого пользователя, а управление окнами представлено с помощью механизма переворота в стиле 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 , Sun Project Looking Glass , Metisse , который был похож на Project Looking Glass, [42] BumpTop , где пользователи могут манипулировать документами и окнами с реалистичным движением и физика, как если бы это были физические документы, Croquet OS , созданная для совместной работы, [43] и композитные оконные менеджеры , такие как Enlightenment и Compiz . Дополненная реальность и виртуальная реальность также используют элементы трехмерного графического интерфейса. [44]
3D-графические интерфейсы появились в научно-фантастической литературе и фильмах еще до того, как некоторые технологии стали возможными или получили широкое распространение. [45]
Продукт Visi On не предназначался для домашнего пользователя.
Он был разработан и рассчитан на высококлассные корпоративные рабочие станции.
Требуемого оборудования было довольно много для 1983 года. Требовалось минимум 512 КБ оперативной памяти и жесткий диск (5 МБ свободного места).
Усилия Xerox PARC под руководством Алана Кея, которые привели к разработке [...] мощных пользовательских интерфейсов на основе растровых дисплеев, сыграли ключевую роль.
В каком-то смысле все, что мы здесь делаем, — это расширяем эту модель до 3D и добавляем новую надежную модель совместной работы с объектами.