Если для вашего приложения требуется вход в систему, вам необходимо предоставить поток входа, включающий один или несколько предложенных методов входа.
Вы можете создать этот поток, адаптировав предоставленный пример кода. Процесс включает в себя следующие шаги:
- Выбор основного метода входа (и любых резервных методов)
- Настройка содержимого экранов входа в систему
- Настройка визуального стиля
Пример кода представлен в автомобильном приложении Universal Android Music Player (UAMP) . Этот код предназначен для адаптации к экранам различных размеров, поэтому вам не придется решать вопросы портретного и альбомного режима.
При адаптации примера кода для вашего приложения приведенные здесь рекомендации помогут вам обеспечить оптимизацию процесса входа в систему для транспортных средств. Чтобы узнать, как пользователи получат доступ к вашему входу в систему, посетите раздел «Вход, настройки и поиск» .
Выберите способы входа
Ваш первый шаг в адаптации примера кода — решить, какой из трех доступных методов входа вы хотите предложить.
| Метод входа | Как это работает |
|---|---|
| А) Вход в Google (настоятельно рекомендуется) | Введите учетную запись Google и пароль |
| Б) Вход в систему с помощью телефона (рекомендуется в качестве резервного варианта или основного варианта, если ваше приложение не поддерживает вход в Google) | Введите PIN-код с экрана автомобиля на телефоне или наоборот. |
| В) Стандартный вход (лучше всего как запасной вариант) | Введите имя пользователя (или адрес электронной почты) и пароль для приложения. |
Вход в Google должен быть представлен в качестве основного варианта, если ваше приложение его поддерживает, поскольку это проще всего для пользователей. Если ваше приложение не поддерживает вход в Google, вход в систему с помощью телефона — следующий лучший выбор в качестве основного варианта.
Поток входа в пример кода включает экраны для всех трех методов. После того, как вы решили, какие параметры вы поддерживаете (как основной вариант, так и любые резервные параметры, которые вы, возможно, захотите поддержать), вы можете отключить все оставшиеся параметры в примере кода и сосредоточиться на настройке остальных экранов.
А) Вход в Google
Если ваше приложение поддерживает вход в Google и вход в Google доступен в системе, лучше всего сделать этот метод основным вариантом в процессе входа. Пользователям это легко, потому что им просто нужно подтвердить существующую учетную запись Google.
Если вы предлагаете вход в систему с помощью телефона или стандартный вход, они должны быть представлены как резервные варианты, доступные по текстовым ссылкам в нижней части целевого экрана.
Процесс входа в Google
При входе в Google целевая страница — это единственный экран, который вам нужно разработать, если только вы не предлагаете также резервные варианты. Вход в систему с помощью телефона и стандартный вход суммируют экраны и процессы для этих параметров.
Б) Вход в систему с помощью телефона
Если ваше приложение не поддерживает вход в Google, лучше всего предложить вход с телефона в качестве основного варианта входа в систему. (Вход с помощью телефона также может быть предложен в качестве резервного варианта входа в Google.) При входе с телефона пользователям не нужно запоминать имя пользователя или пароль. Вместо этого они вводят предоставленный им PIN-код.
Вход в систему с помощью телефона можно выполнить одним из двух способов:
- Пользователи видят ПИН-код на экране автомобиля и вводят его на своих телефонах.
- Пользователи ищут PIN-код на своих телефонах и вводят его на экране автомобиля.
Если также предлагается стандартный метод имени пользователя и пароля, он должен быть представлен как резервный вариант, доступный по текстовой ссылке в нижней части целевого экрана.
Процесс входа в систему с помощью телефона
При входе с телефона вы можете выбрать одну из двух версий целевой страницы: одну, на которой отображается ПИН-код для входа на телефоне, и другую, которая позволяет пользователям вводить ПИН-код, указанный на телефоне.
Экран целевой страницы — единственный, который вам нужно спроектировать, если только вы не предлагаете стандартный вход в качестве резервного варианта.
В) Стандартный вход
Стандартный вход в приложение требует от пользователя ввести имя пользователя (или адрес электронной почты) на целевой странице, а затем ввести пароль на следующей странице.
Стандартный вход может быть предложен в качестве резервного варианта входа в Google или входа в систему с помощью телефона. Или, если ни один из двух других вариантов не поддерживается, это может быть основной вариант входа. Однако стандартный вход в систему не рекомендуется использовать в качестве основного варианта, поскольку он включает в себя несколько шагов и запоминание имен пользователей и паролей.
Поскольку пользователи не всегда могут запомнить имена пользователей и пароли, важно предложить варианты их восстановления или сброса. Эти параметры должны предлагаться с помощью текстовых ссылок в нижней части экранов ввода, чтобы они не конкурировали за внимание с основными действиями по вводу имени пользователя и пароля.
Стандартный процесс входа в систему
Процесс стандартного входа представляет собой последовательность из двух экранов (ввод имени пользователя и пароля) с дополнительными переходами на два других экрана. Вам понадобятся версии всех 4 экранов.
Настройка содержимого экранов
Определив, какие методы входа будет поддерживать ваше приложение, вы будете знать, какие экраны будут использоваться в процессе входа. В зависимости от того, что вы решите поддерживать, у вас может быть от 1 до 6 экранов, для которых вам необходимо определить содержимое (и стиль, как описано в разделе «Настройка стиля» ).
Если вы выберете вход в Google или вход с помощью телефона без резервных опций, вам нужно будет создать один экран входа. С другой стороны, если вы выберете вход в Google с обоими другими вариантами в качестве резервных копий, у вас будет 6 экранов (1 для входа в Google, 1 для входа в систему с помощью телефона и 4 для стандартного входа).
Примеры этих экранов показаны в разделах «Вход в Google» , «Вход с телефона » и «Стандартный вход» . Если вы работаете с примером кода, вы можете изменить версии этих экранов, созданные в коде. Если вы не используете пример кода, вам все равно следует использовать эти примеры в качестве модели.
Вам потребуется внести некоторые изменения в содержимое этих экранов, в том числе следующее:
- Замените логотип вымышленного приложения Aural логотипом вашего приложения.
- Измените текст и ссылки, чтобы они ссылались на ваше приложение и связанный с ним контент.
- Настройте логику отображения PIN-кода
Замена логотипа и логика отображения PIN-кода более подробно рассмотрены ниже.
Заменить логотип приложения
После удаления ненужных экранов из примера кода вам необходимо убедиться, что на оставшихся экранах отображается логотип вашего приложения, а не логотип вымышленного приложения Aural. Эта замена может повлиять на другие аспекты дизайна страницы, как описано ниже.
Замена логотипа может привести к необходимости других тонких настроек, таких как настройка цветов других элементов страницы или регулировка зазора вокруг логотипа.
Настройка цветов для логотипа
Чтобы логотип вашего приложения хорошо сочетался с окружающими элементами страницы, вы можете настроить код входа на использование акцентного цвета вашего приложения. Настройка стиля обсуждается на следующем этапе «Настройка стиля» .
Регулировка зазора логотипа
После замены логотипа Aural логотипом вашего приложения, который будет масштабирован до того же размера, что и логотип Aural, проверьте расстояние вокруг логотипа. Если количество свободного пространства не соответствует рекомендациям вашего бренда, вы можете добавить пространство по краям логотипа в файле логотипа.
Другой подход — отрегулировать расстояние на экране. Однако при таком подходе вам придется регулировать расстояние вокруг логотипа индивидуально для каждого макета. По этой причине добавление места в файле логотипа — самый простой способ увеличить свободное пространство вокруг логотипа.
Настройте логику отображения PIN-кода
Пример процесса входа генерирует PIN-коды случайным образом с помощью простой функции RAND. Чтобы реализовать метод генерации PIN-кода на основе более надежной бизнес-логики, вам необходимо изменить соответствующий код в PinCodeSignInFragment.kt , который является частью автомобильного приложения Universal Android Music Player (UAMP).
Настроить стиль
После настройки содержимого экранов входа вы можете применить глобальный стиль, соответствующий бренду, к аспектам пользовательского интерфейса, которые влияют на несколько экранов.
Возможно, вы захотите настроить некоторые или все из следующих элементов, чтобы они отражали стиль вашего бренда:
- Стиль поля ввода : заполненный, обведенный или подчеркнутый.
- Стиль кнопки : закругленный или прямоугольный.
- Цвета : акцент, заливка и текст кнопки, заливка и обводка формы, ошибка формы.
- Типографика : шрифт, размер текста.
Примеры некоторых из этих вариантов настройки приведены ниже. Помните, что индивидуальный стиль должен поддерживать контрастность, минимальные размеры текста и сенсорных объектов, а также другие требования, описанные в рекомендациях для пользовательских экранов .
