Введение

Пользовательский интерфейс macOS от Apple. Aqua — это графический пользовательский интерфейс, язык дизайна и визуальный стиль операционных систем Apple macOS и iOS. Изначально он был основан на теме воды, с элементами, напоминающими капли, и активным использованием эффектов отражения и полупрозрачности. Его задача — "включить цвет, глубину, прозрачность и сложные текстуры в визуально привлекательный интерфейс" приложений macOS. При его представлении Стив Джобс заметил: «Он как жидкость, одна из целей дизайна заключалась в том, чтобы, увидев его, захотелось лизнуть». Aqua впервые была представлена на конференции Macworld Conference & Expo 2000 года в Сан-Франциско. Её первое появление в коммерческом продукте состоялось в июле 2000 года с выпуском iMovie 2, а затем в Mac OS X 10.0 в следующем году. Aqua является преемником Platinum, который использовался в Mac OS 8, Mac OS 9 и разработческих версиях Rhapsody (включая Mac OS X Server 1.2). Внешний вид Aqua неоднократно менялся с годами, наиболее заметно и кардинально — с выпуском macOS Big Sur в 2020 году, который Apple называет «самым масштабным обновлением дизайна со времён появления Mac OS X».

Предыстория

В течение многих лет Apple безуспешно пыталась создать операционную систему Mac OS следующего поколения, включая проекты с кодовыми названиями Pink, Taligent и Copland. Mac OS X в конечном итоге была создана на базе NeXTSTEP, после того как Apple приобрела NeXT, а её генеральный директор Стив Джобс вернулся в Apple, компанию, которую он соосновал. Ранние версии Mac OS X, известные как Rhapsody, представляли собой версию для разработчиков с временным пользовательским интерфейсом, сочетавшим элементы "Platinum" из MacOS 8 и OpenStep. От подхода Rhapsody в конечном итоге отказались, и в 1998 году новая операционная система получила название Mac OS X. Финальный интерфейс операционной системы, Aqua, был представлен на выставке Macworld Expo в январе 2000 года.

Элементы дизайна

В стиле Aqua используются синий, белый и серый цвета как основные цвета во всем оформлении. Строки инструментов окон, фоны окон, кнопки, меню и другие элементы интерфейса выполнены в этих цветах. Например, панели инструментов и боковые панели часто имеют серый или металлический оттенок, фоны окон и всплывающие меню – белые, а кнопки (в более ранних версиях системы также ползунки полос прокрутки) выделены ярким синим цветом. В версиях OS X до OS X Yosemite к большинству элементов управления применялся эффект "стекла" или "геля". Дэвид Погю описал этот эффект как "аппетитные капли геля зубной пасты Crest Berrylicious". macOS предлагает немного встроенных возможностей для изменения общего внешнего вида системы. Пользователи могут выбрать графитовую тему вместо синей по умолчанию. При использовании графитовой темы элементы управления приобретают цвет шифера, серо-голубой или серый оттенок, включая основные элементы управления окном, которые в стандартной теме имеют красный, желтый и зеленый цвета. Эта опция была добавлена по просьбе разработчиков и пользователей, которым синяя тема казалась слишком яркой или непрофессиональной. OS X Yosemite представила темный режим, который затемняет преимущественно белую панель меню и Dock. Пользователи также могут свободно выбирать цвет выделения текста и файлов.

Окна

Исторически, в Aqua было два дизайна окон: окна Aqua по умолчанию и окна «металлический блеск». Окна Aqua обычно имеют металлическую или серую панель заголовка с тремя кнопками на левой стороне (для закрытия, сворачивания и масштабирования или перехода в полноэкранный режим). Визуально эти кнопки изначально располагались сверху, но позже казались углубленными в окно. Окна Aqua практически не имеют рамки или внешней границы, вместо этого используются тени для отделения и различия активных и неактивных окон. Эстетика фонов окон изменилась от полосатых к белым. Окна «металлический блеск» имели толстую рамку с металлической текстурой или темно-серым фоном и углубленными кнопками и внутренними рамками. Они также обладали свойством перетаскиваться в любой точке рамки, а не только в панели заголовка и панели инструментов. Apple рекомендовала использовать окна «металлический блеск» для приложений, имитирующих реальные устройства (например, iTunes) или предназначенных для взаимодействия с ними (например, iSync), но подверглась критике со стороны дизайнеров за несоблюдение собственных рекомендаций или их непоследовательное применение (они также использовались в Safari или Finder). Окна «металлический блеск» в значительной степени устарели с момента выхода Leopard и стали визуально неотличимыми от окон Aqua. Листы — это диалоговые окна, модальные для конкретного окна. При открытии они выдвигаются к пользователю, как лист бумаги, отсюда и название. Они частично прозрачны и привлекают внимание к содержимому листа. Элементы управления родительского окна отключаются до закрытия листа, но пользователь может продолжать работу в других окнах (включая те, что в том же приложении) во время отображения листа.

Меню

Меню имеют слегка прозрачный серый фон, а при выделении элементы меню становятся синими. В меню приложений, расположенных в виде одной строки в верхней части экрана, клавиатурные сочетания отображаются справа от названия пункта меню, а сам пункт – слева. В Yosemite меню гораздо более прозрачные и имеют эффект размытия. Также доступны различные варианты выпадающих меню для использования непосредственно в окнах. Стандартное всплывающее меню белое с синим индикатором и стрелками, направленными в противоположные стороны, а меню «выпадающее» имеет только одну стрелку, направленную вниз, в индикаторе. Меню «выпадающее» доступно в четырех вариантах оформления Aqua, большинство из которых устарели в более поздних версиях macOS.

Текстовые поля и поля

Текстовые поля черные, текст в них белый, с границей, создающей эффект углубления. Помимо стандартных прямоугольных текстовых полей, доступны округленные поля для поиска. Для ввода больших объемов текста предусмотрено многострочное текстовое поле. Также доступно комбинированное текстовое поле и выпадающее меню, позволяющее пользователю вводить значение вручную или выбирать из списка. Существует также комбинация текстового поля и элемента выбора даты и времени, позволяющая вводить дату и время или редактировать их с помощью кнопок навигации. В Mac OS X 10.4 был представлен новый элемент интерфейса, позволяющий пользователю перетаскивать нередактируемые "токены" в текстовое поле, между которыми можно вводить текст. Пробелы до и после токенов автоматически удаляются.

Нажимать на кнопку

Стандартные кнопки с закругленными углами доступны в двух вариантах: белые и синие. Синяя кнопка является кнопкой действия по умолчанию, и в версиях ОС до Yosemite она подсвечивалась пульсацией, чтобы побудить пользователя выполнить это действие. Действие синей кнопки обычно также можно выполнить, нажав клавишу Return. Белые кнопки обычно используются для всех остальных действий. Также доступны кнопки с закругленным скосом, предназначенные для отображения иконки; стандартные квадратные кнопки; квадратные кнопки из стекла и круглые кнопки. Кроме того, доступны круглые фиолетовые кнопки онлайн-справки, которые при нажатии отображают справку по текущей задаче. Треугольники раскрытия, хотя технически и являются кнопками, позволяют показывать и скрывать элементы управления, чтобы экономить место.

Кнопки отметки и радиокнопки

В macOS пустые флажки — это маленькие белые прямоугольники со скругленными углами. При установке флажка они становятся синими и появляется галочка. По сути, это кнопки, которые можно включать или выключать. Радиокнопки похожи по внешнему виду и поведению, за исключением того, что они круглые и содержат точку вместо галочки. Радиокнопки объединяются в группы, из которых одновременно может быть выбрана только одна. В Yosemite была добавлена короткая анимация, показывающая процесс заполнения флажка или радиокнопки.

Таблицы и списки

Таблицы и списки можно классифицировать тремя основными способами: стандартная многоколоночная таблица с местом для ввода значений или размещения других элементов интерфейса, таких как кнопки; представление в виде структуры, которое может содержать треугольники раскрытия/сворачивания для отображения и скрытия наборов данных; и представление столбцами Миллера, аналогичное представлению столбцов в Finder. Все представления таблиц могут использовать чередующиеся синие и белые фоны строк.

Показатели прогресса

Существует два основных типа индикатора выполнения: полоса прогресса или монохромный вращающийся элемент (не спиннер в виде курсора). Сама полоса прогресса доступна в двух вариантах: неопределённая, которая просто показывает анимированные диагональные сине-белые полосы без индикации прогресса; или определённая, которая отображает пульсирующую синюю полосу на белом фоне, пропорциональную проценту завершённой задачи. Индикатор вращающегося колеса, впервые появившийся на экране загрузки Mac OS X в версии 10.2, представляет собой последовательность из 12 серых линий, постепенно темнеющих к центру, расположенных по кругу, напоминая вид спицованного колеса, вращающегося по часовой стрелке. Многие другие интерфейсы переняли этот элемент, включая веб-браузеры Firefox и Camino, а также множество веб-сайтов, выполненных в стиле Web 2.0. В Yosemite полоса прогресса была изменена на тонкую, светло-серую. Неопределённый вариант сохранил пульсацию, но более медленную и растянутую по времени. Теперь индикатор выполнения отображается во время загрузки, заменяя вращающийся элемент, использовавшийся в предыдущих версиях.

Разное

Слайдеры доступны в трех типах: с метками и треугольным ползунком, с круглым ползунком и без меток, и круговой слайдер, который можно вращать. Все они могут быть расположены горизонтально или вертикально. Круговой слайдер представляет собой просто серую точку на белом круге, которую можно вращать для установки значений. В macOS есть стандартный элемент управления для выбора цветов, который выглядит как обычная квадратная кнопка с образцом цвета в центре. При нажатии на него отображается стандартная цветовая палитра macOS. Вкладки в macOS почти идентичны кнопкам, при этом невыбранные вкладки белые, а выбранная вкладка – синяя. Также доступны "ячейки" для изображений: небольшой углубленный контейнер, в который можно перетаскивать файлы изображений. Когда ячейка содержит изображение, она может отображать миниатюрное представление содержимого файла.

Шрифты

Apple использовала Lucida Grande в качестве системного шрифта от первой версии Cheetah до Mavericks. Иногда Apple также использовала Helvetica и Helvetica Neue, например, в приложениях Mail и iPhoto. Системный шрифт был изменен на Helvetica Neue в Yosemite и снова в El Capitan на собственный шрифт Apple San Francisco. macOS использует антиалиасинг шрифтов для всей системы, чтобы сгладить края и сохранить узнаваемые формы шрифтов, иногда в ущерб четкости и ясности.

Анимации

Aqua активно использует анимацию. Примеры включают: иконки в Dock подпрыгивают вверх и вниз при запуске соответствующих приложений. Иконки Dock также подпрыгивают в другом ритме, когда фоновое приложение требует внимания пользователя. Иконки Dock могут увеличиваться в размере при приближении курсора. Эта функция (называемая «увеличением») является необязательной. При минимизации окна «втягиваются» в Dock с помощью эффекта «Джин» или «Масштабирования». Оба эффекта настраиваются пользователем. Первый превращает окно в изогнутую форму, имитируя обратную анимацию джина, выходящего из лампы, а второй уменьшает окно, пока оно не станет достаточно маленьким для Dock. При нажатии клавиши Shift оба эффекта можно увидеть в замедленном режиме. Эти сочетания клавиш также применимы к другим эффектам Aqua, таким как Dashboard, Mission Control и Front Row. При удержании клавиш Control и Shift эффект минимизации занимает вдвое больше времени, чем при удержании только Shift. Удержание только Control слегка замедляет анимацию. Существует также неофициальный эффект Dock под названием «Всасывание», который можно включить, вручную отредактировав файл конфигурации или используя команду в Terminal; он, по-видимому, идентичен эффекту, сопровождающему удаление виджетов из Dashboard. При открытии или закрытии папки на рабочем столе окно Finder, кажется, появляется из иконки папки или исчезает в ней, а не возникает из ниоткуда. Этот эффект присутствовал в Finder Classic Mac OS под названием ZoomRects, но был удален из ранних версий для разработчиков Mac OS X. Листы «выдвигаются» из-под заголовков окон. Листы выглядят как листы бумаги, которые толкают к пользователю или выскальзывают, как из лотка. Виджеты Dashboard, кажется, прилетают на экран. Виджеты Dashboard появляются с эффектом «ряби», как будто падают на поверхность пруда. При удалении виджеты всасываются в кнопку закрытия, как будто их затягивает в вакуум. Этот эффект также можно применить к окнам, минимизируемым в Dock. Panther также отличался более широким использованием стиля «Металлизированная поверхность», особенно в Finder и веб-браузере Safari. «Металлизированная поверхность» впервые появилась в QuickTime Player 4.0 в 1999 году. В Руководстве по дизайну интерфейсов Apple указано, что интерфейс в стиле «Металлизированная поверхность» следует использовать для программ, имитирующих работу или интерфейс реальных устройств (скеуморфизм). Mac OS X Tiger принесла более тонкие изменения, включая унифицированную панель заголовков. Полосы были полностью удалены из меню и заменены глянцевым белым оформлением. Вкладки были изменены, чтобы выглядеть как обычные сегментированные кнопки. Иконка меню Apple стала более матовой, а новая утилита Spotlight для поиска была постоянно закреплена справа на панели меню в том же цвете и градиенте, что и меню Apple.

Mac OS X Leopard и Snow Leopard

Mac OS X Leopard внесла масштабные изменения в Aqua. Окна Aqua и окна с эффектом "шлифованного металла" приобрели единый металлический, серый вид, полосатые фоны были полностью удалены, панели инструментов и заголовки были объединены в единое целое, различия между активными и неактивными окнами стали более выраженными за счет более толстых теней и монохромного отображения неактивных окон, цвет строки меню изменился на серый с возможностью полупрозрачного отображения на поддерживаемых Mac, а Dock получил трехмерный вид с отражающей стеклянной "поверхностью". Дизайн Dock при размещении слева или справа изменился на черный полупрозрачный фон с белой рамкой и закругленными углами. Контекстные меню получили слегка скругленные углы, а множество значков были переработаны, включая значки папок и значки Системных настроек. Mac OS X Snow Leopard практически не внес изменений в Aqua. Наиболее заметным изменением стало изменение контекстного меню элементов Dock с белого на полупрозрачный черный.

Mac OS X Lion, OS X Mountain Lion и Mavericks

Mac OS X Lion представила множество изменений, вдохновленных iOS, которые сохранились в OS X Mavericks и OS X Yosemite, хотя последняя изменила общую эстетику. Полосы прокрутки были удалены, а ползунки прокрутки превратились в тонкие, полупрозрачные полосы, исчезающие в неиспользуемом состоянии. Радиус скругления углов кнопок был уменьшен, что придало им вид, напоминающий Mac OS 8 и 9. Гелеобразный вид большинства элементов был заменен на слегка глянцевый и более плоский. Фоны окон стали немного светлее, а углы окон – закругленными. Lion также добавила больше анимации. OS X Mountain Lion внесла лишь незначительные изменения и изменила внешний вид Dock на стиль матового стекла с закругленными углами, прямоугольными индикаторами, новым диагональным разделителем и новой иконкой корзины. OS X Mavericks отказалась от нескольких насыщенных и декоративных элементов дизайна, отражая масштабные изменения в дизайне iOS 7. Приложения «Календарь», «Контакты» и «Заметки» соответственно лишились кожаного, книжного и блокнотного оформления (все они были введены в Lion). Текстуры льняного полотна в Центре уведомлений и Launchpad также были удалены и заменены на простые серые фоны.

OS X Yosemite, El Capitan, macOS Sierra, High Sierra, Mojave и Catalina

В OS X Yosemite многие элементы и иконки Aqua были упрощены и стали более плоскими, вслед за аналогичным изменением дизайна в iOS 7. Apple внедрила в систему тот же насыщенный эффект матового стекла, названный "Vibrancy" (Вибрация). Примеры включают Dock, строку меню, боковые панели, Центр уведомлений и Mission Control. Подобный эффект был применен к панелям инструментов, но они сохранили свой серый цвет. Кнопки панелей инструментов стали белыми, и Apple представила более компактный тип панели инструментов, который убрал заголовок окна, но сохранил кнопки панели инструментов (например, в Safari). Некоторые элементы управления, такие как флажки и переключатели, получили анимацию, а в других местах анимация была удалена, например, анимация "исчезновения" при удалении иконки с Dock и анимация "куба" при быстром переключении между учетными записями пользователей. Apple изменила системный шрифт на Helvetica Neue. Yosemite также добавила "темную тему", которую можно включить в настройках, делающую Dock и строку меню черными. OS X El Capitan внесла лишь незначительные изменения в Aqua. Белые кнопки панелей инструментов вновь приобрели легкий глянцевый вид, значок загрузки был переработан, а эффект Vibrancy был уменьшен в определенных областях, таких как Mission Control. Системный шрифт был изменен еще раз, на собственный шрифт Apple San Francisco, одновременно с iOS 9 и после выпуска этого шрифта для watchOS в апреле 2015 года. Эти изменения продолжились в macOS Sierra, High Sierra, Mojave и Catalina.

macOS Big Sur, Monterey, Ventura и Sonoma

macOS Big Sur внесла существенные изменения в дизайн Aqua, приведя его в соответствие с другими платформами Apple, такими как iOS и iPadOS. Dock теперь отделен от края экрана и имеет более скругленные углы. Иконки приобрели форму скругленного квадрата и стали более объемными. Строки заголовков лишились градиентного оформления, перейдя к плоскому белому виду, а текст заголовка стал жирным и выровнен с элементами панели инструментов, которые больше не заключены в отдельный фон. Модальные окна значительно изменились: они теперь имеют размер, соответствующий содержимому, с крупной иконкой вверху, текстом в центре и кнопками внизу. Листы больше не выдвигаются из-под строки заголовка, как листы бумаги, а просто плавно появляются из центра окна. Унифицированные боковые панели стали более распространенными и теперь используются по умолчанию во всех приложениях. Окна получили более скругленные углы и приобретают оттенок от обоев пользователя, подобно эффекту Mica в Windows 11. Строка меню стала полностью прозрачной, используя сильное размытие для отделения от фона. Эта версия Aqua продолжала использоваться в macOS Monterey, Ventura и Sonoma.

Приложения Microsoft Windows

Aqua также была интегрирована в приложения Apple для Microsoft Windows, такие как iTunes, QuickTime и Safari (хотя и не в Safari 4). iTunes для Windows в целом следовал тем же обновлениям, что и соответствующая версия для macOS, за исключением использования элементов управления пользовательского интерфейса Windows и кнопок в стиле Windows в правом верхнем углу окна проигрывателя. В версии 3 Safari для Windows предлагал функциональный внешний вид и ощущения, очень похожие на macOS. Начиная с версии 4, использовалась более типичная для Windows тема с применением стандартных элементов управления пользовательского интерфейса Windows и оформления окон. QuickTime для Windows использует ту же тему, что и в более ранних версиях QuickTime для macOS, с окнами, имитирующими шлифованный металл, и кнопками в стиле Aqua в верхней части.

Критика

Большая часть оригинального дизайна Aqua напоминала полупрозрачный двухцветный облик современного оборудования Apple. В 2003 и 2004 годах Apple перешла к использованию матового алюминия в промышленном дизайне (как, например, в алюминиевых дисплеях Apple Cinema Display). Дизайн Aqua изменился в соответствии с этим. Эта несколько противоречивая смесь стилей интерфейса вызывала споры в сообществе пользователей Mac.

Судебные разбирательства

В прошлом Apple угрожала судебными исками тем, кто создавал темы, имитирующие их визуальный стиль. Сообщество разработчиков тем для Mac негативно отреагировало на жесткие действия Apple против любых элементов, похожих на Aqua. Брэд Уорделл из Stardock противопоставил склонность компании к судебным разбирательствам более открытому подходу Microsoft к интеграции сторонних тем в Windows XP.