Как стать автором
Обновить

Liquid Glass и цикличность в UI-дизайне

Уровень сложностиПростой
Время на прочтение4 мин
Количество просмотров3.7K

Когда я смотрел эстетичные Frutiger Aero картинки, либо эстетичные UI-концепты со стекломорфизмом в Пинтересте, я не думал, что оно снова станет реальностью, а останется приятной ностальгией.. В этой статье разберём, почему стеклянные интерфейсы – уже перебор.

Опять история, скевоморфизм

Когда ПК был не у каждого, его нужно было продать как необходимую для дома вещь. Скевоморфичный стиль повсеместно был внедрён в интерфейсы, чтобы подружить людей с компьютерами, для лучшего понимания инструментов, которые он предлагает. Отсюда и появились иконки песочных часов и папок с файлами.

Macintosh System and Finder
Macintosh System and Finder

А например, ещё в 1995 выходил пакет с гиперскевоморфичным интерфейсом Microsoft Bob, включавший в себя приложение для управления финансами и текстовый процессор. Когда запускаешь его, чувствуешь себя как дома, всё интуитивно понятно, потому что программы похожи на вещи из реального мира.

Microsoft Bob
Microsoft Bob

С таким подходом был и инновационный интерфейс первого iPhone, заимствованный у macOS, но предлагающий новое взаимодействие пальцем по экрану. Он довольно сильно отличался от ОС для смартфонов, имеющихся тогда на рынке, поэтому нужно было нарративно обучать как пользоваться функциям, через визуал, делая элементы похожими на реальные объекты.

iPhone OS 1.0
iPhone OS 1.0
Заметки iPhone
Заметки iPhone

2000, Aqua

В начале тысячилетия Apple проводила масштабную революшн в macOS. Сильно изменился и стиль, ставший соответствовать тогдашним моделям компьютеров – Aqua. Вместо серых интерфейсов из 90х, характерных для WIndows и Mac, в UI стали присутствовать стеклянные прозрачные элементы.

Mac OS X 10.0 Cheetah с интерфейсом Aqua
Mac OS X 10.0 Cheetah с интерфейсом Aqua
Aqua-кнопочка
Aqua-кнопочка

2006, Aero

Такое ответвление скевоморфизма как Frutiger Aero появился и раньше, но стал более массовым после внедрения в Windows Vista в 2006 и позже в 7. Прозрачным и стеклянным стало уже куда больше элементов, например, сами окна. Это было футуристическое направление в графическом дизайне, символизирующее единение технологий с природой. Максимально ударялись в такое единения уже производители Android-смартфонов в начале 10х, например Samsung и LG, у которых всё булькало и светилось как, например, в оболочке Touch Wiz Nature UX. При этом чистый Google’овский Android был очень даже плоским и минималистичным давно.

Windows Vista с интерфейсом Aero
Windows Vista с интерфейсом Aero
Android 4 с интерфейсом Samsung TouchWiz
Android 4 с интерфейсом Samsung TouchWiz
Android 4 с интерфейсом Holo
Android 4 с интерфейсом Holo

2009, интерфейсы будущего, Metro

Microsoft неймётся и порой, если посмотреть на их хронологию изменений дизайна цифровых продуктов, можно заметить кашу, т.к. они часто делали прогрессивные шаги и уже в уже 2009, почти в одно время со стеклянной Windows 7, в своём плеере Zune HD они делают UI в абсолютно другом стиле – Frutiger Metro. Здесь уже никакого объёма, природы и реальных объектов – всё максимально просто, строго, плоско и тоже стильно. Позже этот стиль внедрится и в Windows Phone, Windows 8 и Xbox.

Zune HD
Zune HD

Metro использует текст в качестве основной формы навигации с минимумом иконок и иллюстраций. Без накрученных стилистик в UI лучше акцентировалось внимание на информации, которую мы считываем для прохождения UX-сценариев. Это было неизбежное течение, т.к. пользователи с компьютерами уже на Ты и ставить иконки песочных часов им не нужно, для понимания достаточно многоточия, а для обозначения кнопок достаточно обводки или заливки, а не всего сразу, с прозрачностями и тенями. В 10х годах похожему подходу подверглись все основные ОС, сайты, сервисы и приложения, например, Android Holo, позже iOS 7 и Google Material Design.

Windows Phone 7 с интерфейсом Metro
Windows Phone 7 с интерфейсом Metro

2013, iOS 7

Масштабный плоский редизайн добрался и до Apple в iOS 7 в 2013, а позже и в macOS. Теперь плоские все, везде акцент на контенте, а интерфейс лишь является посредником, не требующий накрученных стилистик.

iOS 7
iOS 7
Заметки iOS 7
Заметки iOS 7

2017, Fluent

В мае 2017 года на конференции Microsoft Build 2017 был представлен стиль Microsoft Fluent Design. Тут я и начал чуять что-то ностальгическое. Windows 10 тогда приблизилась по визуалу к тому, что сейчас имеем в Windows 11, но до этого момента она была скрее как Windows 8.

Windows 11 с интерфейсом Fluent
Windows 11 с интерфейсом Fluent

2025

И опять Apple на WWDC 25 делает тренд, который вводила Microsoft несколько лет назад и называет его Liquid Glass. Только, если редизайн сделали Apple, этот тренд достигнет теперь уже небывалых масштабов.

Nowadays

Сейчас всё выглядит как шаг назад. Особенно это видно по иконке камеры в iOS 26. которая чертовски напоминает такую из iOS 6. Всё время до Windows 11 и современной iOS индустрия стремилась к максимальному упрощению и выставлению правильных акцентов на функциях и контенте в интерфейсах. Мы видели, как иногда постепенно, а иногда резко в разных версиях всех ОС уменьшалось колличество стилистик на элементах, потому что они не являются главным. Главным является контент / информация, которую мы просматриваем, редактируем, создаём, уже зная, где какая кнопка находится. Лишь первые разы мы учимся ориентироваться в приложениях, после чего, внимание заостряется на контенте внутри сервиса, которым пользуемся. Все красивости и стеклянные поверхности лишь ухудшают читаемость и мешают быстро пройти нужный сценарий.

Когда способ взаимодействия со смартфонами / ПК всё ещё не изменился, такие изменения выглядят как попытка что-то поменять просто, чтобы было и потому что это свежее выглядит для многих. Упрощение и минимализм что раньше, что сейчас обосновываются лучшим практическим использованием акцентов. Apple на своей презентации Liquid Glass обосновывает тем, что устройства стали powerful и можно сделать beautiful. Никакого практического обоснования таким изменениям в дизайне нет.

Обоина идеально под
Обоина идеально под
Теги:
Хабы:
+9
Комментарии14

Публикации

Работа

Ближайшие события