Я запускал бета-версии iOS 15 на своем iPhone, и наиболее заметное изменение — это серьезная переработка основного пользовательского интерфейса в Safari. Apple открыто повторяла это, поэтому я подумал, что было бы забавно написать небольшую критику, как будто я работал над этой функцией и пытался решить, готова она к производству или нет. Скачать приключенческие игры на iPhone и iPad можно по ссылке https://appvisor.ru/ios/games/adventure/. Примечание: этот пост посвящен iOS 15 beta 4 . Он, вероятно, устареет после выхода новых бета-версий.
Содержание статьи
Что нового?
Вот параллельное сравнение Safari в iOS 14 и iOS 15 beta 4, используя Pitchfork в качестве пример веб-сайта, контент которого в основном заблокирован, поэтому вы можете увидеть различия.
Сводка изменений выглядит следующим образом:
- Весь пользовательский интерфейс для взаимодействия с веб-страницами перемещен из верхней части экрана в нижнюю.
- Верхняя и нижняя панели инструментов Safari теперь объединены в одну плавающую панель URL-адресов, которая находится над содержимым страницы. .
- Прокрутка строки URL влево или вправо позволяет перемещаться между вкладками.
- Safari теперь поддерживает группы вкладок и имеет совершенно новый интерфейс управления вкладками.
Плюсы и минусы
Новый дизайн дает несколько прямых преимуществ:
- Менять веб-страницы легче.
- Переход между вкладками удобен.
- Значительно улучшено управление вкладками.
- Новый интерфейс уникален и интересен!
[1 9459002] Есть также несколько недостатков:
- Плавающая строка URL-адреса иногда кажется «мешающей». Он визуально доминирует в отличие от старого дизайна. Это связано с тем, что плавающий элемент требует дополнительного пустого пространства над и под ним, поэтому он привлекает больше визуального внимания, чем что-то, прикрепленное к краю экрана. Он также находится в пространстве, где вы обычно прокручиваете или нажимаете на объекты.
- Раньше быстрое взаимодействие стало неудобным или более сложным. Переключение в режим приватного просмотра особенно неудобно: теперь требуется несколько нажатий внутри новых параметров группы вкладок.
- Кнопки вокруг поля URL-адреса тесно переполнены, и их легко случайно нажать. Сам URL-адрес также существенно урезан, чтобы освободить место для всех кнопок.
- Нижняя часть экрана теперь довольно перегружена. Домашняя панель iOS и строка URL-адреса Safari находятся в непосредственной близости друг от друга, поэтому прокрутка в неправильном месте может дать непредвиденный результат. Еще хуже обстоит дело с такими веб-сайтами, как Pitchfork, у которых дизайн навигации ориентирован снизу — теперь у вас есть 3 разных нижних навигационных элемента, соперничающих за внимание (веб-сайт, адресная строка Safari, домашняя панель iOS).
Почему они меняют это?
Я за эксперименты с новыми способами решения старой проблемы пользовательского интерфейса. Вы никогда не узнаете, сможете ли вы найти лучший дизайн, если не попробуете.
Когда вы переделываете что-то столь фундаментальное, как пользовательский интерфейс браузера, вы должны начать с твердого мнения о том, что вы пытаетесь улучшить. . Трудно превзойти проверенное временем производственное программное обеспечение, к которому все привыкли, поэтому вы должны определить, какие аспекты, по вашему мнению, могут быть лучше, и исследовать новые разработки с учетом этих целей.
Мы не знаем каковы приоритеты Apple, но похоже, что они пытаются оптимизировать для трех вещей:
- Достижимость поэтому взаимодействие с пользовательским интерфейсом браузера не требует больших усилий.
- Экономия места и очистка поэтому в браузере меньше собственного хрома и больше места для отображения веб-контента.
- Уникальность. Я не уверен, явное ли это намерение или просто побочный эффект разработки первых двух.
Давайте оценим, насколько хорошо этот новый дизайн попадает в цель.
Достижимость улучшена для доступа к вводимому URL-адресу Safari, но это также имеет отрицательный побочный эффект на доступность контента веб-сайта. Меню веб-сайта и элементы навигации часто располагаются вверху экрана. Браузерный Chrome, ориентированный на верхнюю часть страницы, помогает сдвинуть эти элементы вниз по вертикали, чтобы их было легче достать. Без какого-либо браузера Chrome наверху контент находится еще дальше от вашей руки, и поэтому его труднее достать.
Это значительный недостаток, потому что 80% времени в браузере вы взаимодействуете с веб-сайты а не сам пользовательский интерфейс веб-браузера. В результате общие преимущества достижимости нового дизайна неоднозначны.
Экономия места — одна из тех дизайнерских целей, которые часто больше уходят корнями в крайний минимализм, чем в реальные случаи использования. . Я предполагаю, что ни один клиент никогда не жаловался на пространство, которое пользовательский интерфейс Safari использовал в версиях iOS 1–14, потому что это пространство было занято несколькими полезными кнопками и входами, и в любом случае его было не так уж и много. Это сработало нормально, и большинству людей это просто наплевать.
Но как дизайнер, это достойный принцип — позволять контенту быть звездой шоу, насколько это возможно. Если можно обойтись меньшим количеством хрома браузера и иметь более простой интерфейс, почему бы не попробовать?
Итак, давайте представим, что мы даем ему шанс. Отличный способ начать — собрать все различные элементы пользовательского интерфейса и объединить их в одном месте. Это похоже на организацию ваших носков, складывая их все в одну кучу, а затем выясняя, как после этого разделить.
Вот что Apple сделала здесь. Две отдельные панели инструментов объединились в одну.
Причина, по которой разработчик сделал это, состоит в том, чтобы агрессивно упростить — вырезать почти весь пользовательский интерфейс — а затем сделать каждый отдельный аффорданс борется за то, чтобы вернуть его на видное место. Это итеративный процесс объединения всего до самого необходимого, а затем постепенного повторного внедрения функций, которые оказываются настолько важными, что слишком раздражают, чтобы их можно было спрятать во второстепенном месте.
Как вы можете на этих снимках экрана видно, что несколько кнопок были перемещены в подменю «Совместное использование» и «Вкладки», вместо того, чтобы быть постоянно доступными на видном месте. Режим чтения и закладки не вошли. Кнопка «Обновить» теперь намного меньше, а кнопка «Вперед» появляется только условно.
Уникальность также является целью дизайнера, которая не имеет непосредственного влияния на конечного пользователя, но может есть много преимуществ со временем. Если Apple решит работать с этим новым пользовательским интерфейсом, Safari будет иметь выдающийся интерфейс, не похожий на любой другой мобильный веб-браузер. Это означает, что будет легче отличить Safari от других.
Если Apple сделает все правильно, они будут лидировать в отрасли с чем-то новым и странным, а другие производители браузеров, вероятно, последуют их примеру. Это впоследствии повлияет на то, как создатели мобильных сайтов создают свои сайты. И новые инновации также со временем найдут свое отражение в этой ориентированной на дно экосистеме пользовательского интерфейса.
Вот почему стоит попробовать переработать «решенные проблемы», такие как пользовательский интерфейс браузера. В конце концов, вы можете прийти к лучшему — или, по крайней мере, к другому месту.
Успешен ли новый дизайн?
Это зависит от того, как вы оцениваете успех. Исходя из наших целей, перечисленных выше, новый дизайн, вероятно, достаточно успешен: он (в некоторой степени) достижим, экономит пространство и уникален.
Но действительно ли это значительно лучший опыт в целом?
Пока что , не совсем.
Как правило, программное обеспечение легче использовать, когда аффордансы видны и заметны, а не скрыты в подменю. Конечно, вы не можете сделать все заметным и заметным, потому что места очень мало, поэтому вам нужно расставить приоритеты. Есть три основных варианта для каждого входа или кнопки, которую вам нужно включить:
- ЯСНО И ЯВНО: Доступность видна и заметна, и у нее есть значок и текстовая метка, описывающая его функцию.
- ЯВНО, НО НЕ ЯСНО: Доступность видна, но у нее есть значок без текстовой метки, поэтому пользователи должны угадывать что означает значок.
- Ясно, но НЕ ЯВНО : аффорданс свернут или скрыт в подменю. Пользователи должны искать или угадывать, где его найти, но как только они его находят, он четко маркируется.
В сложном программном обеспечении существует множество возможностей для организации, поэтому обычно вы в конечном итоге делать все три из них. Общая цель — сделать основные элементы настолько очевидными и понятными, насколько это возможно, а затем убрать более эзотерические или менее часто используемые параметры.
С изменением дизайна Safari, Apple понизила несколько кнопок до уровня НЕ. ЯВНАЯ категория, и те, что остались, все упакованы вместе. Теперь в этом маленьком баре есть как минимум пять разных аффордансов, которые кажутся переполненными и немного неразрешенными. Некоторые функции, такие как закрытые вкладки, глубоко скрыты, и, вероятно, в них нет необходимости.
В целом, новый дизайн по-прежнему вызывает больше повседневных проблем, чем старая версия, которую он заменяет. Но это не так уж и далеко, и Apple может решить, что некоторое повышенное трение стоит компромисса для всех других преимуществ, описанных выше.
Что бы я попробовал дальше?
Это зависит от многих обстоятельств. от того, насколько команда привержена дизайну плавающей строки URL. Если они придерживаются этой концепции, все, что остается, — это оптимизировать и отшлифовать ее, насколько это возможно. Несмотря ни на что, плавающая штанга всегда будет казаться немного неуклюжей или забитой, потому что вы просто не сможете уместить больше в одну штангу.
Когда я чувствую, что дизайн ограничен пространством, Я начинаю спрашивать, почему мы оказались в ситуации, когда нам не хватает места для работы. Так что, если у команды еще есть время попробовать что-то еще, я бы посоветовал отказаться от ультра-минимальной планки и изучить другие конструкции, которые снова обеспечат большую гибкость.
Например, они могут попробовать что-то, что работает больше как на скользящей нижней панели приложения «Карты». С этим шаблоном вы могли бы сохранить большинство преимуществ минимализма и достижимости плавающей панели, но с гораздо большим пространством для быстрого отображения вторичных вариантов.
Вот примерный макет, показывающий, как это может выглядеть:
Конечно, он менее минимален, но также немного более очевиден и не так ограничен пространством. Проблема с этим дизайном будет заключаться в том, как представить пользовательский интерфейс управления вкладками (должен ли он находиться под скользящей панелью, внутри нее или сверху?) тоже хорошая вариация!
В любом случае, я надеюсь, вам понравился этот небольшой критический анализ дизайна кресла. Такого рода вещи трудно изменить, особенно когда вы проектируете открыто и получаете массу отзывов от всех (особенно случайные дизайнеры, пишущие в своих блогах. 😅) С нетерпением жду окончательного решения.