Diseño de confirmación protegido

La interfaz de usuario (UI) de confirmación protegida consta de seis elementos obligatorios. Algunos elementos se pueden personalizar, pero hay requisitos que deben cumplirse. Use las siguientes pautas cuando personalice la interfaz de usuario y asegúrese de que se cumplan los requisitos. Si un elemento está marcado con Requisito: ese elemento debe usar la propiedad listada.

Las siguientes pautas utilizan la familia de fuentes Roboto, que puede descargar de fonts.google.com .

Interfaz de usuario con botones de hardware

La confirmación protegida de Android puede usar botones de hardware en el dispositivo para confirmar y cancelar la entrada.

Patrón de diseñó

Iconos

Icono de escudo

Icono Icono de escudo de confirmación protegida
Descargar escudo de seguridad
Tamaño de ícono 32dp

Icono de flecha

Icono Icono de flecha del teclado
Descargar Flecha derecha del teclado
Tamaño de ícono 24dp
Radio de la esquina del contenedor 4dp

Mensajes de entrada

Hay dos tipos de entrada que se utilizan en la confirmación protegida: confirmar y cancelar.

Cadena de confirmación

Este mensaje debe indicar qué botón se utiliza como confirmación.

Mensaje Presione dos veces (botón) para confirmar
Longitud máxima Requisito: El mensaje de confirmación no puede tener más de dos líneas.
Color #000000 87%
Perfil delantero Roboto-Medio
Tamaño de fuente Requisito: 14sp
Altura de la línea Requisito: 20dp

Cancelar cadena

El mensaje de cancelación debe ser claramente visible y fácilmente distinguible del botón de confirmación. Utilice las siguientes propiedades junto con la sola palabra Cancelar .

Mensaje Cancelar
Color #000000 87%
Perfil delantero Roboto-Medio
Tamaño de fuente Requisito: 14sp
Altura de la línea Requisito: 20dp

Texto de cabecera

Incluya el texto del encabezado Confirmación de protección de Android en la IU de confianza para identificar la función. Utilice las siguientes propiedades para el texto del encabezado.

Mensaje Requisito: Confirmación protegida de Android
Color #000000 87%
Perfil delantero Roboto-Regular
Tamaño de fuente Requisito: 22sp
Altura de la línea Requisito: 28dp

Cuerpo de texto

Utilice las siguientes propiedades al implementar el elemento de texto del cuerpo. El mensaje real está escrito por el desarrollador de API (desarrollador de aplicaciones).

Mensaje El cuerpo del texto lo proporciona el desarrollador de la aplicación llamando a Confirmación protegida.
Color #000000 87%
Perfil delantero Roboto-Regular
Tamaño de fuente Requisito: 16sp
Altura de la línea Requisito: 24dp

texto del subtítulo

Utilice el texto del subtítulo para explicar por qué el usuario ve la pantalla de confirmación protegida. Coloque este texto en la parte inferior de la pantalla y use las siguientes propiedades.

Mensaje Requisito: esta confirmación proporciona una capa adicional de seguridad para la acción que está a punto de realizar.
Longitud máxima Requisito: El mensaje de confirmación no puede tener más de cuatro líneas.
Color #000000 87%
Perfil delantero Roboto-Regular
Tamaño de fuente Requisito: 14sp
Altura de la línea Requisito: 20dp

Interfaz de usuario con botones de software

La confirmación protegida de Android puede usar botones de software para confirmar y cancelar la entrada. Las siguientes pautas describen la interfaz de usuario usando botones de software.

Diseño de diseño de software de interfaz de usuario de confirmación

icono de escudo

Descargue el recurso del ícono en el ícono del escudo de confirmación protegido de Android . Coloque el icono en la parte superior de la pantalla.

icono de escudo

El ícono del escudo de Confirmación Protegida es un elemento requerido. El color del escudo se puede personalizar pero debe ser claramente visible.

Aporte

Dimensiones del botón de software

Use la forma de un botón primario y secundario para las entradas de confirmación y cancelación.

Etiqueta de botón Use mayúsculas y minúsculas para las etiquetas de los botones.
Radio del botón 4dp
Acentuar el color #1a73e8
Perfil delantero Roboto-Medio
Tamaño de fuente Requisito: 14sp

Texto de cabecera

Incluya el texto del encabezado Confirmación de protección de Android en la IU de confianza para identificar la función. Utilice las siguientes propiedades para el texto del encabezado.

Mensaje Requisito: Confirmación protegida de Android
Color #000000 87%
Perfil delantero Roboto-Medio
Tamaño de fuente Requisito: 24sp
Altura de la línea Requisito: 20dp

Cuerpo de texto

Utilice las siguientes propiedades al implementar el elemento de texto del cuerpo. El mensaje real está escrito por el desarrollador de la aplicación.

Mensaje El cuerpo del texto lo proporciona el desarrollador de la aplicación llamando a Confirmación protegida
Color #000000 87%
Perfil delantero Roboto-Medio
Tamaño de fuente Requisito: 16sp
Altura de la línea Requisito: 24dp

texto del subtítulo

Utilice el texto del subtítulo para explicar por qué el usuario ve la pantalla de confirmación protegida. Coloque este texto en la parte inferior de la pantalla y use las siguientes propiedades.

Mensaje Requisito: esta confirmación proporciona una capa adicional de seguridad para la acción que está a punto de realizar.
Longitud máxima Requisito: El mensaje de confirmación no puede tener más de cuatro líneas.
Color #000000 54%
Perfil delantero Roboto-Medio
Tamaño de fuente Requisito: 14sp
Altura de la línea Requisito: 20dp

Localización

Puede encontrar localizaciones para los componentes descritos en una implementación en C independiente de una tabla de búsqueda como parte de AOSP .

,

La interfaz de usuario (UI) de confirmación protegida consta de seis elementos obligatorios. Algunos elementos se pueden personalizar, pero hay requisitos que deben cumplirse. Use las siguientes pautas cuando personalice la interfaz de usuario y asegúrese de que se cumplan los requisitos. Si un elemento está marcado con Requisito: ese elemento debe usar la propiedad listada.

Las siguientes pautas utilizan la familia de fuentes Roboto, que puede descargar de fonts.google.com .

Interfaz de usuario con botones de hardware

La confirmación protegida de Android puede usar botones de hardware en el dispositivo para confirmar y cancelar la entrada.

Patrón de diseñó

Iconos

Icono de escudo

Icono Icono de escudo de confirmación protegida
Descargar escudo de seguridad
Tamaño de ícono 32dp

Icono de flecha

Icono Icono de flecha del teclado
Descargar Flecha derecha del teclado
Tamaño de ícono 24dp
Radio de la esquina del contenedor 4dp

Mensajes de entrada

Hay dos tipos de entrada que se utilizan en la confirmación protegida: confirmar y cancelar.

Cadena de confirmación

Este mensaje debe indicar qué botón se utiliza como confirmación.

Mensaje Presione dos veces (botón) para confirmar
Longitud máxima Requisito: El mensaje de confirmación no puede tener más de dos líneas.
Color #000000 87%
Perfil delantero Roboto-Medio
Tamaño de fuente Requisito: 14sp
Altura de la línea Requisito: 20dp

Cancelar cadena

El mensaje de cancelación debe ser claramente visible y fácilmente distinguible del botón de confirmación. Utilice las siguientes propiedades junto con la sola palabra Cancelar .

Mensaje Cancelar
Color #000000 87%
Perfil delantero Roboto-Medio
Tamaño de fuente Requisito: 14sp
Altura de la línea Requisito: 20dp

Texto de cabecera

Incluya el texto del encabezado Confirmación de protección de Android en la IU de confianza para identificar la función. Utilice las siguientes propiedades para el texto del encabezado.

Mensaje Requisito: Confirmación protegida de Android
Color #000000 87%
Perfil delantero Roboto-Regular
Tamaño de fuente Requisito: 22sp
Altura de la línea Requisito: 28dp

Cuerpo de texto

Utilice las siguientes propiedades al implementar el elemento de texto del cuerpo. El mensaje real está escrito por el desarrollador de API (desarrollador de aplicaciones).

Mensaje El cuerpo del texto lo proporciona el desarrollador de la aplicación llamando a Confirmación protegida.
Color #000000 87%
Perfil delantero Roboto-Regular
Tamaño de fuente Requisito: 16sp
Altura de la línea Requisito: 24dp

texto del subtítulo

Utilice el texto del subtítulo para explicar por qué el usuario ve la pantalla de confirmación protegida. Coloque este texto en la parte inferior de la pantalla y use las siguientes propiedades.

Mensaje Requisito: esta confirmación proporciona una capa adicional de seguridad para la acción que está a punto de realizar.
Longitud máxima Requisito: El mensaje de confirmación no puede tener más de cuatro líneas.
Color #000000 87%
Perfil delantero Roboto-Regular
Tamaño de fuente Requisito: 14sp
Altura de la línea Requisito: 20dp

Interfaz de usuario con botones de software

La confirmación protegida de Android puede usar botones de software para confirmar y cancelar la entrada. Las siguientes pautas describen la interfaz de usuario usando botones de software.

Diseño de diseño de software de interfaz de usuario de confirmación

icono de escudo

Descargue el recurso del ícono en el ícono del escudo de confirmación protegido de Android . Coloque el icono en la parte superior de la pantalla.

icono de escudo

El ícono del escudo de Confirmación Protegida es un elemento requerido. El color del escudo se puede personalizar pero debe ser claramente visible.

Aporte

Dimensiones del botón de software

Use la forma de un botón primario y secundario para las entradas de confirmación y cancelación.

Etiqueta de botón Use mayúsculas y minúsculas para las etiquetas de los botones.
Radio del botón 4dp
Acentuar el color #1a73e8
Perfil delantero Roboto-Medio
Tamaño de fuente Requisito: 14sp

Texto de cabecera

Incluya el texto del encabezado Confirmación de protección de Android en la IU de confianza para identificar la característica. Utilice las siguientes propiedades para el texto del encabezado.

Mensaje Requisito: Confirmación protegida de Android
Color #000000 87%
Perfil delantero Roboto-Medio
Tamaño de fuente Requisito: 24sp
Altura de la línea Requisito: 20dp

Cuerpo de texto

Utilice las siguientes propiedades al implementar el elemento de texto del cuerpo. El mensaje real está escrito por el desarrollador de la aplicación.

Mensaje El cuerpo del texto lo proporciona el desarrollador de la aplicación llamando a Confirmación protegida
Color #000000 87%
Perfil delantero Roboto-Medio
Tamaño de fuente Requisito: 16sp
Altura de la línea Requisito: 24dp

texto del subtítulo

Utilice el texto del subtítulo para explicar por qué el usuario ve la pantalla de confirmación protegida. Coloque este texto en la parte inferior de la pantalla y use las siguientes propiedades.

Mensaje Requisito: esta confirmación proporciona una capa adicional de seguridad para la acción que está a punto de realizar.
Longitud máxima Requisito: El mensaje de confirmación no puede tener más de cuatro líneas.
Color #000000 54%
Perfil delantero Roboto-Medio
Tamaño de fuente Requisito: 14sp
Altura de la línea Requisito: 20dp

Localización

Puede encontrar localizaciones para los componentes descritos en una implementación en C independiente de una tabla de búsqueda como parte de AOSP .