Dal codice alla tela: Logto rende open-source la progettazione dell'esperienza di accesso
Abbiamo reso pubbliche le risorse Figma dell'esperienza di accesso, inclusi progetti completi del flusso di autenticazione e stili e componenti versatili.
RanProduct & Design
Smetti di sprecare settimane sull'autenticazione degli utenti
Lancia app sicure più velocemente con Logto. Integra l'autenticazione degli utenti in pochi minuti e concentrati sul tuo prodotto principale.
Da Logto, crediamo nel potere della collaborazione e della trasparenza. Ecco perché siamo felici di far sapere che abbiamo reso open-source la progettazione della nostra esperienza di accesso in Figma, disponibile per tutti. Per accedere alle risorse di Figma:
Catalogo delle risorse di progettazione dell'esperienza di accesso#
Questo design include due componenti principali: il flusso di autenticazione (esperienza di accesso) e gli stili e i componenti. Esploriamoli in dettaglio.
Abbiamo meticolosamente creato varie combinazioni di scenari di registrazione, accesso e primo accesso sociale sia per piattaforme mobili che PC. Ogni scenario viene fornito con la sua configurazione di console corrispondente, offrendoti una panoramica completa del flusso di autenticazione. Ecco un'anteprima di alcuni degli scenari:
Registrazione
Accesso
Primo accesso sociale
Nome utente
Nome utente + Password
Nome utente + Password
Accesso sociale + Imposta nome utente
Email (più popolare)
Email + Codice di verifica + Password
Email + Password
Accesso sociale + Collega email
Numero di telefono
Numero di telefono + Codice di verifica
Numero di telefono + Codice di verifica
Accesso sociale + Collega numero di telefono
Email e telefono misti
Email/Numero di telefono + Codice di verifica + Password
Email/Numero di telefono + Codice di verifica/Password
Accesso sociale + Collega email/Numero di telefono
Solo accesso sociale
/
/
Solo accesso sociale
Password dimenticata
Email e telefono misti
Reimposta password verificando email/numero di telefono
Il nostro design include anche una serie di stili e componenti semplici e versatili che facilitano la personalizzazione della UI complessiva della tua esperienza di accesso. Ecco cosa troverai:
Introduzione
Stili di carattere
Abbiamo semplificato la classificazione dei caratteri in categorie come corpo, etichetta, titolo e intestazione. Gli stessi stili di carattere sono utilizzati sia per piattaforme mobili che PC, garantendo coerenza e facilità d'uso.
Stili di colore
Con l'aiuto di palette e token, puoi modificare facilmente i colori del tema per adattarli al tuo brand. La nostra palette di colori è generata utilizzando Google Material Design e offre sia modalità luce che modalità scura, facilitando la comprensione per i tuoi designer.
Icone
Abbiamo incluso una selezione curata di icone funzionali che coprono una vasta gamma di casi d'uso, che possono essere direttamente utilizzate o facilmente sostituite. Inoltre, forniamo una varietà di icone di social media progettate specificamente per i tuoi pulsanti di accesso social.
Componenti
Abbiamo organizzato componenti sia per piattaforme mobili che web, inclusi Branding, Pulsante, Checkbox, Dialogo, Navigazione, Toast, Campo di testo e Tastiera (Mobile).
Ma non è tutto! Con Logto, puoi saltare i dettagli tecnici sopra e fidarti di noi per offrire un'esperienza di integrazione senza interruzioni. In Logto Console, puoi esplorare facilmente le configurazioni dei metodi e adattarle alla UI del tuo brand. In pochi minuti, avrai un'esperienza di login e registrazione personalizzata che si allinea perfettamente alla tua attività.
Perché abbiamo reso pubblico il nostro design Figma?#
Logto è sempre stato impegnato a fornire un servizio di codice open-source, ma potreste chiedervi perché abbiamo deciso di estendere questa apertura anche al nostro design.
Comprendere e configurare l'esperienza di accesso#
Vogliamo che Logto sia non solo amico degli sviluppatori, ma anche il miglior amico dei PM e dei designer. Crediamo nel favorire una migliore collaborazione durante l'intero processo di sviluppo, portando ad alta efficienza, trasparenza e fiducia.
Comprensione completa del flusso di autenticazione: Mentre il tuo prodotto potrebbe utilizzare solo un metodo specifico di login o registrazione, come designer, potresti voler avere una visione olistica. Questa conoscenza ti permette di determinare l'approccio che meglio si adatta al tuo business e massimizza i tassi di conversione. La logica di autenticazione non dovrebbe essere un'entità ambigua. Tuttavia, la corrispondenza tra identificatori e metodi di autenticazione non è una relazione semplice N*N; coinvolge vari vincoli e decisioni di prodotto. La nostra Figma ti aiuterà. Per saperne di più, puoi consultare l'articolo “Le considerazioni progettuali per un'esperienza di accesso fluida”.
Progetta direttamente la tua UI: I designer sono abituati a fornire soluzioni complete in Figma. Se il tuo progetto coinvolge designer, questo design open-source li aiuterà a far corrispondere rapidamente l'identità visiva del tuo brand.
Potenziamento dell'esperienza e dei servizi di Logto#
Mentre Logto è impegnato a fornire un servizio Cloud efficiente, è nato dalla comunità open-source e intende rimanere pubblicamente trasparente a lungo termine.
Adottare lo spirito dell'open-source: Crediamo che i benefici derivati dal rendere open-source il codice possano essere applicati anche al design. Invitando maggiore attenzione all'esperienza utente attraverso apertura, utilizzo e discussione all'interno della comunità open-source, possiamo migliorare continuamente l'esperienza di autenticazione.
Fornire insight sulla progettazione della produzione a lungo termine: Sebbene la maggior parte dei nostri sforzi siano attualmente concentrati sullo sviluppo delle capacità di Autenticazione e Autorizzazione, l'esperienza di accesso che forniamo è altamente estensibile e soddisfa la maggior parte delle tue esigenze. Attraverso feedback open-source e collaborazione, speriamo di integrare meglio i processi SIE e le configurazioni visive nei nostri prodotti, riducendo al contempo il costo della produzione.
Mentre continuiamo a iterare sul prodotto Logto, manterremo aggiornato il design di Figma. Speriamo che utilizzerai Logto per creare esperienze iniziali eccezionali per i tuoi prodotti e lasciare una duratura impressione sul tuo brand.
Valutiamo la tua esperienza e il tuo feedback, quindi ti preghiamo di mantenere aperti i canali di comunicazione. Non vediamo l'ora di sentire da te.
