Графический интерфейс пользователя , или 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]
Since the commands available in command line interfaces can be many, complex operations can be performed using a short sequence of words and symbols. Custom functions may be used to facilitate access to frequent actions. Command-line interfaces are more lightweight, as they only recall information necessary for a task; for example, no preview thumbnails or graphical rendering of web pages. This allows greater efficiency and productivity once many commands are learned.[3] But reaching this level takes some time because the command words may not be easily discoverable or mnemonic. Also, using the command line can become slow and error-prone when users must enter long commands comprising many parameters or several different filenames at once. However, windows, icons, menus, pointer (WIMP) interfaces present users with many widgets that represent and can trigger some of the system's available commands.
GUIs can be made quite hard when dialogs are buried deep in a system or moved about to different places during redesigns. Also, icons and dialog boxes are usually harder for users to script.
WIMPs extensively use modes, as the meaning of all keys and clicks on specific positions on the screen are redefined all the time. Command-line interfaces use modes only in limited forms, such as for current directory and environment variables.
Most modern operating systems provide both a GUI and some level of a CLI, although the GUIs usually receive more attention.
Оболочки графического пользовательского интерфейса находят способ обойти версии интерфейса командной строки (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 и добавляем новую надежную модель совместной работы с объектами.