Проектирование для iOS

Скачать iOS Human Interface Guidelines

pdf-page docx-win-icon

ВАЖНО

Этот подготовительный документ находится в стадии разработки. Несмотря на то, что данный документ прошёл проверку на техническую точность, его версия не является окончательной. Эта конфиденциальная информация Apple предназначена для использования только зарегистрированными пользователями программы Apple Developer. Apple предоставляет данную конфиденциальную информацию, чтобы помочь вам подготовиться к применению технологий и программированию интерфейсов, описанных здесь. Данная информация может меняться, а программное обеспечение, реализованное в соответствии с этим документом, должно подвергаться проверке при окончательном обеспечении операционной системы и конечной документации. Новые версии этого документа могут быть обновлены в соответствии с созданием  новых технологий или API.

iOS воплощает следующие идеи:

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

weather_app_7_2x

Переделываете ли вы своё старое приложение или создаёте новое — примите во внимание следующий подход к работе:

  • Во-первых, посмотрите на отношение пользовательского интерфейса к основным функциям и утвердите его важность.
  • Далее, используйте тематику iOS, чтобы оживить дизайн пользовательского интерфейса и опыт пользователя. Добавление деталей и украшений должно быть аккуратным, но никогда беспричинным.
  • Наконец, будьте уверены, что вы спроектировали пользовательский интерфейс для использования на различных устройствах и режимах таким образом, что пользователи могут наслаждаться вашим приложением в максимально разных условиях.

На протяжении всего процесса будьте готовы бросать вызов прошлому, оспаривать вопросы, и позвольте акценту на содержании и функциональности способствовать принятию каждого решения в оформлении.

Подчинение содержанию

Хотя лаконичный и красивый пользовательский интерфейс и плавные движения являются ключевыми аспектами использования iOS, на первом месте остаются материалы пользователей.

Далее приведены некоторые способы для получения уверенности в том, что дизайн вашего приложения совершенствует функционал и направлен на материалы пользователей.

weather_focus_2x
Воспользуйтесь преимуществами всего экрана. Приложение “Погода” является прекрасным примером такого подхода: красивое, полноэкранное отображение текущей погоды с местом для дополнительных почасовых данных сразу же передаёт самую важную информацию.
weather_focus_2x
Пересмотрите визуальные индикаторы физических качеств и реальных условий. Рамки, перепады и оттенение иногда способствуют утяжелению элементов пользовательского интерфейса, что может подавлять содержание или конкурировать с ним. Вместо этого уделите внимание содержанию и позвольте пользовательскому интерфейсу выполнять вспомогательную роль.
weather_focus_2x
Позвольте полупрозрачным элементам пользовательского интерфейса намекать на содержание между ними. Полупрозрачные элементы — такие как Control Center — открывают контекст, помогают пользователям видеть, что доступно больше содержания, и могут обозначать переходное состояние. В iOS полупрозрачный элемент затемняет только содержание, расположенное прямо за ним, создавая впечатление взгляда через рисовую бумагу. Он не затемняет остальную часть экрана.

Предоставьте ясность

Предоставление ясности — это ещё один способ убедиться, что содержание является первостепенным в вашем приложении. Далее приведены некоторые способы для того, чтобы сделать важнейшее содержание и функциональность ясными и простыми во взаимодействии.

use_white_space_2x

Используйте много негативного пространства. Негативное пространство делает важное содержание и функциональность более заметными и простыми в понимании. Негативное пространство также может придавать ощущение спокойствия и порядка, и оно может помочь вашему приложению выглядеть более направленным и эффективным.

notes_color_2x

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

mail_message_fonts_2x

Обеспечьте чёткость посредством использования системного шрифта. San Francisco (системный шрифт iOS) работает с динамическим типом (Dynamic Type) для автоматической регулировки интервала между знаками и высоты строк, чтобы текст выглядел хорошо в любом размере и его было легко читать. Используете вы San Francisco или обычный шрифт, убедитесь в использовании типа Dynamic, чтобы ваше приложение реагировало, когда пользователь выбирает другой размер шрифта.

contact_card_2x

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

Используйте глубину для взаимодействия

iOS часто отображает содержимое в чётко выраженных слоях, что выражает иерархию и местоположение, и это помогает пользователям понять взаимосвязь между объектами на экране.

webview_peek-30_2x

На устройстве, которое поддерживает 3D Touch, быстрые и внезапные действия дают пользователю доступ к важным функциональным возможностям без потери контекста.

folder_2x

Посредством использования полупрозрачного фона и возможности всплывать над начальным экраном, папки отделяют содержимое от остальной части экрана.

layered-reminders_2x

Отображения оповещений расположены слоями, так, как показано здесь. Когда пользователь работает с одним листом, остальные собраны внизу экрана.

cal_year_2x

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

cal_month_2x

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

cal_day_2x

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

Copyright © 2016. iOSManual Все авторские права защищены