Design dell'esperienza utente

La prima esperienza degli utenti con la tua app è fondamentale. Un'esperienza di alta qualità può portare tassi di conversione superiori al 90% e coinvolgere maggiormente le persone a tuo vantaggio.

Con Facebook Login, le persone possono iniziare a utilizzare la tua app in modo facile e veloce, godendo di esperienze più personalizzate e significative. In questo documento, ti offriamo consigli e considerazioni sulla modalità di creazione di un'esperienza di accesso ottimale per gli utenti con Facebook Login.

  1. Mostra la qualità dei contenuti
  2. Evita passaggi inutili
  3. Design del pulsante
  4. Autorizzazioni
  5. Fornisci un metodo di disconnessione
  6. Esegui test e misurazioni

1. Mostra la qualità dei contenuti prima di richiedere l'accesso

Per decidere in quale momento dell'esperienza utente richiedere l'accesso, pensa a quando le persone avranno la possibilità di apprezzare i contenuti offerti dalla tua app tanto da voler condividere le informazioni.

Spesso è l'esperienza vissuta prima di scaricare l'app ad avere il peso maggiore, ma hai la possibilità di influenzare la decisione delle persone con un buon design dell'app.

Di seguito sono riportati alcuni approcci di design per incoraggiare le persone ad accedere:

  • Offri una spiegazione breve e chiara sui contenuti dell'app.
  • Offri una panoramica dei contenuti disponibili dopo l'accesso.
  • Offri una nuova esperienza utente.
  • Offri alle persone la possibilità di usare l'app senza un account.

Offri una spiegazione breve e chiara sui contenuti dell'app.

Offri una spiegazione breve, chiara ed efficace sui contenuti offerti dalla tua app. È possibile che sia passato del tempo da quando l'utente l'ha scaricata o ha letto una descrizione nell'App Store.

Offri una panoramica dei contenuti disponibili dopo l'accesso.

Offri una panoramica dei contenuti prima che le persone effettuino l'accesso, come la foto di sfondo nell'esempio. Non è necessario che sia dettagliata, anche le immagini sfocate della pinboard di Pinterest incoraggiano le persone ad accedere.

Offri una nuova esperienza utente.

Se sono necessarie altre informazioni per offrire la migliore esperienza possibile, inserisci una demo composta da diversi passaggi sopra il pulsante Accedi. In questo modo, le persone possono scegliere se scoprire maggiori informazioni sulla tua app oppure effettuare immediatamente l'accesso se sono pronte.

Offri alle persone la possibilità di usare l'app prima di effettuare l'accesso

Se possibile, consenti alle persone di usare la tua app prima di richiedere loro di effettuare l'accesso. Ad esempio, molte app di e-commerce come Zulily richiedono alle persone di effettuare l'accesso solo quando sono pronte per concludere l'acquisto.

2. Evita passaggi inutili

Evitare passaggi inutili rappresenta una delle strategie più efficaci per migliorare il tasso di conversione.

Non chiedere agli utenti di toccare "Accedi" o "Registrati" per visualizzare il pulsante Facebook Login. Grazie a Facebook Login questo passaggio non è necessario. Non è proprio necessario che le persone si fermino a pensare se dispongono o meno di un account.

Una volta che le persone hanno effettuato l'accesso con Facebook, non chiedere di creare un nome utente o una password. Uno dei motivi principali per cui le persone effettuano l'accesso con Facebook è che "è semplice, veloce e non è necessario inserire una password". In particolare, dopo aver effettuato l'accesso con Facebook, le persone non vogliono essere costrette a creare un nome utente o una password.

3. Pulsante Facebook Login

Il pulsante Facebook Login, presente nei nostri SDK, è facile da integrare e include le informazioni necessarie per realizzare un design e un'esperienza coerenti.

Per abilitare la creazione dell'account e per Facebook Login, le etichette preferite sono "Continua con Facebook" o "Accedi con Facebook" a seconda del contesto.

Utilizzo approvato di "Accedi con Facebook"

Utilizzo approvato di "Continua con Facebook"

Utilizzo approvato di "Continua come [Nome]"

I design di accesso illustrati in precedenza sono preferiti e saranno approvati dai nostri revisori. Se è necessario creare una versione specifica per le tue esigenze, tuttavia, devi seguire le linee guida riportate di seguito.

Logo

Per creare riconoscimento e fiducia, usa sempre il logo "f" approvato disponibile nel Centro risorse del brand di Facebook.

Quando lo utilizzi nel design del pulsante di accesso, il logo "f" deve essere visibile prima della call to action. Non utilizzarlo come parte della call to action, ad esempio come in "Accedi con logo "f"".

Colore

Il colore consente di riconoscere rapidamente un elemento. In termini di usabilità, più rapidamente lo riconoscono, prima le persone decideranno di utilizzarlo, vivendo un'esperienza più fluida.

I colori dei pulsanti sono bianco e blu Facebook: 5890FF. In tutto il mondo, quando le persone parlano di Facebook Login, spesso lo definiscono "il pulsante blu". Se non puoi utilizzare blu Facebook, ripristina il bianco e il nero.

VALORI COLORE BLU FACEBOOK

  • CMYK Coated: 83 / 52 / 00 / 00
  • CMYK Uncoated: 77 / 36 / 00 / 00
  • PMS 2727C
  • PMS 2382U
  • Hex #1877F2
  • R = 24 G = 119 B = 242

Testo

Le etichette preferite sono "Continua con Facebook" o "Accedi con Facebook" a seconda del contesto. Quando usi il logo "f" con una call to action, utilizza la versione ufficiale disponibile per il download nel Centro risorse del brand di Facebook.

Posiziona il testo della call to action all'interno del pulsante di accesso (non deve trovarsi al di fuori del pulsante).

Scegli il carattere, lo spessore e la crenatura più adatti alla tua app, ottimizzandoli per una facile lettura.

Posizionamento

Deve essere possibile riconoscere e toccare il pulsante di accesso il più facilmente e velocemente possibile. Ad esempio, nei dispositivi mobili, posizionalo vicino al pollice e fai in modo che sia grande abbastanza da poterlo toccare facilmente. È un concetto semplice ma efficace: pulsanti di dimensioni maggiori offrono una conversione migliore di quelli di dimensioni minori.

Il logo "f" è disponibile in diverse dimensioni per adattarlo ai pulsanti, ma proporzioni e stile tipografico devono rispettare i nostri standard.

Azioni consigliate e da evitare

  • UTILIZZA il logo "f" approvato fornito nel Centro risorse del brand di Facebook e segui le linee guida per l'utilizzo.

  • UTILIZZA l'etichetta preferita "Continua con Facebook" o "Accedi con Facebook" sul pulsante di accesso a seconda del contesto e assicurati che il testo si trovi all'interno del design del pulsante.

  • NON MODIFICARE il logo "f" in alcun modo, ad esempio cambiandone il design, le dimensioni, il colore o qualsiasi altra variante. Se, a causa di limitazioni tecniche, non è possibile impiegare il colore corretto, utilizza il bianco e il nero.

  • NON UTILIZZARE il logo "f" su un pulsante senza una call to action appropriata, preferibilmente "Continua con Facebook" o "Accedi con Facebook"

  • NON POSIZIONARE il testo della call to action (ad esempio, Continua con Facebook) al di fuori del pulsante di accesso.

4. Autorizzazioni

Richiedi solo le autorizzazioni necessarie

Minore sarà il numero delle autorizzazioni richieste, più facile sarà per le persone concederle. Abbiamo osservato che un numero minore di autorizzazioni si traduce di solito in una conversione maggiore.

Potrai richiedere altre autorizzazioni quando le persone avranno avuto la possibilità di provare la tua app.

Per un numero minimo di autorizzazioni spesso non è nemmeno necessaria un'Analisi degli accessi per la tua app. Devi effettuare l'invio per l'Analisi degli accessi solo se richiedi autorizzazioni diverse da public_profile e email.

Richiedi le autorizzazioni nel contesto e spiega il motivo per cui sono necessarie

È più probabile che le persone accettino una richiesta di autorizzazione dopo aver compreso il motivo per cui l'app necessita di determinate informazioni per offrire un'esperienza migliore. Attiva quindi le richieste di autorizzazioni quando le persone hanno bisogno di un'autorizzazione specifica per eseguire un'azione all'interno dell'app.

Ad esempio, l'app Facebook richiede l'uso delle impostazioni sulla posizione solo quando la persona tocca il relativo pulsante nell'aggiornamento di stato.

5. Fornisci un metodo di disconnessione

Una volta effettuato l'accesso, le persone devono avere la possibilità di uscire, disconnettersi o eliminare l'account. Non si tratta solo di un'agevolazione, ma di un requisito presente nelle Normative per gli sviluppatori - Facebook Login.

Ad esempio, l'app di incontri Tinder offre la possibilità di nascondere la scheda del profilo (per impedire alle altre persone di trovarti), di uscire o di eliminare completamente l'account.

6. Esegui test e misurazioni

Nemmeno i designer più esperti riescono a creare un buon flusso di onboarding al primo tentativo. Le migliori esperienze sono il risultato di un design e di test attenti con diverse iterazioni.

Prima di avviare l'app, esegui un test qualitativo sull'usabilità per capire come le persone reagiscono ai contenuti visualizzati. Non è necessario che sia formale per essere utile, tuttavia assicurati di osservare le persone alle prese con l'esperienza.

Usa anche dati statistici per comprendere se le persone completano il processo e i loro tassi di conversione complessivi. Seguendo le nostre best practice, puoi registrare tassi di conversione superiori al 90%.