Design di conferma protetto

L'interfaccia utente (UI) della conferma protetta è costituita da sei elementi obbligatori. Alcuni elementi possono essere personalizzati, ma devono essere rispettati alcuni requisiti. Segui queste indicazioni quando personalizzi la UI e assicurati che i requisiti siano soddisfatti. Se un elemento è contrassegnato con Requisito:, deve utilizzare la proprietà elencata.

Le seguenti linee guida utilizzano la famiglia di caratteri Roboto, che puoi scaricare da fonts.google.com.

UI con pulsanti hardware

Android Protected Confirmation può utilizzare i tasti hardware del dispositivo per confermare e annullare l'input.

Layout di progettazione

Icone

Icona di uno scudo

Icona Icona a forma di scudo della conferma protetta
Scarica Scudo di sicurezza
Dimensioni icona 32dp

Icona a forma di freccia

Icona Icona a forma di freccia della tastiera
Scarica Freccia destra sulla tastiera
Dimensioni icona 24dp
Raggio d'angolo del contenitore 4dp

Messaggi di input

In Protected Confirmation vengono utilizzati due tipi di input: conferma e annulla.

Stringa di conferma

Questo messaggio deve indicare quale pulsante viene utilizzato come conferma.

Messaggio Premere due volte (pulsante) per confermare
Lunghezza massima Requisito: il messaggio di conferma non può superare le due righe.
Colore #000000 87%
Carattere Roboto-Medium
Dimensioni carattere Requisito: 14sp
Altezza riga Requisito: 20 dp

Annulla stringa

Il messaggio di annullamento deve essere chiaramente visibile e facilmente distinguibile dal pulsante di conferma. Utilizza le seguenti proprietà insieme alla parola singola Cancel.

Messaggio Annulla
Colore #000000 87%
Carattere Roboto-Medium
Dimensioni carattere Requisito: 14sp
Altezza riga Requisito: 20 dp

Testo dell'intestazione

Includi il testo dell'intestazione Android Protected Confirmation nell'interfaccia utente attendibile per identificare la funzionalità. Utilizza le seguenti proprietà per il testo dell'intestazione.

Messaggio Requisito: Android Protected Confirmation
Colore #000000 87%
Carattere Roboto-Regular
Dimensioni carattere Requisito: 22sp
Altezza riga Requisito: 28 dp

Corpo del testo

Utilizza le seguenti proprietà quando implementi l'elemento del corpo del testo. Il messaggio effettivo è scritto dallo sviluppatore dell'API (sviluppatore dell'app).

Messaggio Il corpo del testo è fornito dallo sviluppatore dell'app che chiama Protected Confirmation.
Colore #000000 87%
Carattere Roboto-Regular
Dimensioni carattere Requisito: 16sp
Altezza riga Requisito: 24 dp

Testo sottotitolo

Utilizza il testo del sottotitolo per spiegare all'utente perché visualizza la schermata di conferma protetta. Posiziona questo testo nella parte inferiore dello schermo e utilizza le seguenti proprietà.

Messaggio Requisito: questa conferma fornisce un ulteriore livello di sicurezza per l'azione che stai per intraprendere.
Lunghezza massima Requisito: il messaggio di conferma non può superare le quattro righe.
Colore #000000 87%
Carattere Roboto-Regular
Dimensioni carattere Requisito: 14sp
Altezza riga Requisito: 20 dp

UI con pulsanti software

Android Protected Confirmation può utilizzare i pulsanti software per confermare e annullare l'input. Le seguenti linee guida descrivono la UI utilizzando i pulsanti software.

Layout di progettazione del software dell'interfaccia utente di conferma

Icona a forma di scudo

Scarica l'asset dell'icona da Android Protected Confirmation Shield Icon. Posiziona l'icona nella parte superiore dello schermo.

Icona a forma di scudo

L'icona a forma di scudo della conferma protetta è un elemento obbligatorio. Il colore dello scudo può essere personalizzato, ma deve essere chiaramente visibile.

Input

Dimensioni dei pulsanti software

Utilizza la forma di un pulsante principale e secondario per gli input di conferma e annullamento.

Etichetta del pulsante Utilizza la maiuscola iniziale per le etichette dei pulsanti.
Raggio del pulsante 4dp
Colore di contrasto #1a73e8
Carattere Roboto-Medium
Dimensioni carattere Requisito: 14sp

Testo dell'intestazione

Includi il testo dell'intestazione Android Protected Confirmation nell'interfaccia utente attendibile per identificare la funzionalità. Utilizza le seguenti proprietà per il testo dell'intestazione.

Messaggio Requisito: Android Protected Confirmation
Colore #000000 87%
Carattere Roboto-Medium
Dimensioni carattere Requisito: 24sp
Altezza riga Requisito: 20 dp

Corpo del testo

Utilizza le seguenti proprietà quando implementi l'elemento del corpo del testo. Il messaggio effettivo è scritto dallo sviluppatore dell'app.

Messaggio Il corpo del testo è fornito dallo sviluppatore dell'app che chiama la conferma protetta
Colore #000000 87%
Carattere Roboto-Medium
Dimensioni carattere Requisito: 16sp
Altezza riga Requisito: 24 dp

Testo sottotitolo

Utilizza il testo del sottotitolo per spiegare all'utente perché visualizza la schermata di conferma protetta. Posiziona questo testo nella parte inferiore dello schermo e utilizza le seguenti proprietà.

Messaggio Requisito:questa conferma fornisce un ulteriore livello di sicurezza per l'azione che stai per intraprendere.
Lunghezza massima Requisito: il messaggio di conferma non può superare le quattro righe.
Colore #000000 54%
Carattere Roboto-Medium
Dimensioni carattere Requisito: 14sp
Altezza riga Requisito: 20 dp

Localizzazione

Puoi trovare le localizzazioni per i componenti descritti in un'implementazione C autonoma di una tabella di ricerca nell'ambito di AOSP.