15 sign-in screens from 4 complete apps
Sign-up, sign-in, magic links and one-time codes, including the moments they go wrong. Open any screen in its journey, compare how each app handles it, and use the one you like as the start of your own design.
Backstage pass
Spinback · MusicApple, Google or a magic link, with free forever said up front.
Welcome back
Spinback · MusicOne email field for a magic link, Apple below, and the headphones peeking in.
Already on the list
Spinback · MusicThe email has an account already: sign in, with the tapes waiting.
Phone sign-in
Kitchenbell · Food & drinkPhone number and 4-digit code on one screen, with an email fallback.
Your name
Kitchenbell · Food & drinkAsks only for a first name and shows why: the order slip the cook writes it on. Email is optional.
Change phone number
Kitchenbell · Food & drinkVerify the new number; everything moves with you and the old number gets a heads-up.
Signed out
Kitchenbell · Food & drinkWhy you were signed out (a new phone), that the cart is saved, and ‘that wasn’t me’.
Bank code
Ravel · FinanceThe bank, not Ravel, asks for the code; a 6-box entry and a resend timer.
Choose a PIN
Ravel · FinanceA 6-digit fallback PIN with dots filling in, and face unlock on.
UPI PIN
Ravel · FinanceThe bank’s own PIN sheet, saying Ravel never sees the PIN.
Face unlock
Ravel · FinanceA pulsing face frame, one unlock button, a PIN fallback and a quiet account switch.
Create account
Vela · Health & fitnessApple, Google or a sign-in link; says plainly that health data is never sold.
Sign in
Vela · Health & fitnessWelcome back over the three rings: Apple, Google or an emailed link.
Create account · typing
Vela · Health & fitnessMid-typing an email with the keyboard up and address suggestions above it.
Sign in with Apple
Vela · Health & fitnessThe system sheet over sign-up, with hide-my-email chosen and Face ID to finish.
Side by side: one sign-in screen from each app
More patterns
Questions
Can I use these sign-in screens in my own app?
Yes. Use this screen puts one in a new SketchXFlow project with your app's name in its words, where you can change every word and part of it, then copy it to Figma or export the code. It's free with an account, three screens a day.
Are these real apps?
They are complete sample apps made for SketchXFlow Inspiration (Spinback, Kitchenbell, Ravel, Vela), with every step of the journey drawn, including errors and empty states. Their names, people and prices are made up.
How many sign-in screens are there?
15 today, across 4 apps. Each new app adds its own.