Die Musterentwicklung für Top-Anmeldebildschirme muss im Jahr 2022 berücksichtigt werden

Die Anmeldeseite mag beim Erstellen einer App wie ein nachträglicher Einfall erscheinen. Anmeldebildschirme werden selten angezeigt, und Anmeldebildschirme werden nur angezeigt, wenn sich Benutzer anmelden. Wie viel Fokus erfordert ein einzelner Bildschirm? Ziemlich viel, um genau zu sein.

Der Anmeldebildschirm einer mobilen App fungiert als Eingang. Nach dem Herunterladen einer App ist der erste Eindruck des Benutzers die Benutzeroberfläche. Um Benutzerfrust beim ersten Hindernis zu vermeiden, stellen Sie sicher, dass Ihre Benutzer leicht navigieren und die Anmeldeseite ausfüllen können. Um Ihre Geschäftsziele zu erreichen, beauftragen Sie Flutter-Entwickler von Flutter Agency ( www.flutteragency.com ) wie Unternehmen, um sicherzustellen, dass Ihr Anwendungs-Anmeldebildschirm der richtigen Struktur folgt.

Wir haben eine Liste mit einigen der besten Anmeldebildschirme zusammengestellt, die Sie als Inspiration für Ihr bevorstehendes mobiles UI-Projekt verwenden können.

PayPal

PayPal gewinnt den Preis für Einfachheit. Ohne das kleine PayPal-Logo oben im Login hätten Sie keine Ahnung, wo Sie sich befinden.

Diese Anmeldeseite hat eine einzigartige Funktion: Sie ist in zwei Abschnitte unterteilt. Sie geben Ihre E-Mail-Adresse ein und drücken die folgende Schaltfläche, um Ihr Passwort zu ändern. Die Nutzerbasis von PayPal wuchs im vierten Quartal 2021 im Jahresvergleich um mehr als 13 % , verglichen mit dem gleichen Zeitraum im Jahr 2020.

Linkedin

Auf der Anmeldeseite von LinkedIn gibt es keine Hintergrundbilder oder Animationen. Eine Login-Seite muss jedoch nicht auf Dauer ästhetisch ansprechend sein. Es ist ein direkter Weg zum Ziel, ideal für eine ablenkungsfreie Designseite.

Die Einfachheit des Designs der Anmeldeseite von LinkedIn spiegelt dies wider. Es kreuzt alle notwendigen Kästchen mit einer fröhlichen und motivierenden Kopie, der Möglichkeit, sich mit Ihrer Telefonnummer anzumelden, und der Option, das Passwort anzuzeigen.

Es tut was es soll und gibt den Menschen ein Gefühl der Bestätigung, wenn sie es brauchen. Was brauchen wir außer einem Login-Formular noch?

Über

Die Anmeldeseite von Uber enthält mehrere kreative, markenkonforme Zeichnungen. Eine Anmeldeseite wird wahrscheinlich nicht über einen längeren Zeitraum gesehen, aber das Hinzufügen von visueller Attraktivität und einer Prise Leben kann dazu beitragen, die Benutzer zu beschäftigen.

Das National Geographic

Beim Anmeldevorgang bei National Geographic gibt es keine Überraschungen. Da es sich um ein anständiges Beispiel für ein Anmeldeformular handelt, gibt es nicht viel darüber zu sagen. Unternehmen in den Vereinigten Staaten und Kanada verwenden häufig den Titelfall, und National Geographic ist diesem Beispiel gefolgt.

Andere Fälle zeigen eine Mischung aus Titel- und Satzfällen in den Titeln. Das Schreiben in einem Stil, der dem beabsichtigten Publikum vertraut ist, hilft dem Leser, sich diese Zeile so vorzustellen, als würde sie von einer realen Person gesagt.

Mittel

The Medium ist möglicherweise der klare Gewinner für benutzerfreundliche Anmeldeseiten. Zunächst einmal werden Benutzer nicht sofort aufgefordert, ihre E-Mail-Adresse, ihren Benutzernamen oder ein anderes Passwort einzugeben.

Sie können Zugriff auf die Plattform basierend auf Ihrer Nutzung anderer wichtiger sozialer Mediennetzwerke wie Facebook oder Twitter erwerben. Für diejenigen, die eine traditionellere Anmeldemethode bevorzugen, können sie die Option „Mit E-Mail anmelden“ wählen.

Der grundlegende Stil der Anmeldeseite wird durch die Verwendung von Weiß als Primärfarbe aufgewertet. Im Einklang mit ihrer Identität enthielt Medium jedoch einige dynamische Grafiken, die dem Bildschirm ein Gefühl von Bewegung verleihen.

Spotify

Die Anmeldeseite von Spotify ist ein Kunstwerk. Es sind keine Bilder oder andere visuelle Elemente auf einem weißen Hintergrund für den Benutzer sichtbar. Neben der Möglichkeit, sich über Facebook anzumelden, bietet Spotify auch die Möglichkeit, angemeldet zu bleiben.

Dieses Anmeldeformular hat eine Inline-Validierung sowohl im Benutzernamen- als auch im Passwortbereich, was unserer Meinung nach eine nette Geste ist, da es dazu beiträgt, den Zustand benutzerfreundlicher zu machen. Nach einem erfolglosen Login-Versuch erscheint oberhalb des Login-Formulars eine weitere Art der Validierung.

Es ist nichts Falsches daran, Farb- und andere visuelle Signalinvalidierungen zu verwenden. In den ersten drei Monaten des Jahres 2022 hat Spotify weltweit 182 Millionen Premium-Mitglieder.

Dropbox

Das Anmeldeformular von Dropbox wird als vertikales Modal angezeigt, das sich ausdehnt, wenn der Benutzer den oberen Rand der Seite erreicht, direkt auf seiner Homepage. Wenn der Benutzer die Homepage herunterscrollt, kollabiert sie dann. Es nimmt einen erheblichen Teil der Seite ein, und die in diesen beiden Abschnitten verwendeten Farben sind ziemlich unterschiedlich.

Folglich hebt sich das Login-Formular durch einen auffälligen Kontrast vom Rest der Seite ab. Wir genießen die E-Mail-Validierung und die Anmeldeoptionen für soziale Medien.

MailChimp

Eine Neugestaltung ist erforderlich, da Mailchimp zu einer vollwertigen Marketingplattform heranwächst. Seit der letzten Änderung wurden einige Änderungen an der Anmeldeseite vorgenommen.

Eine davon ist die Hinzufügung eines unverwechselbaren Charakterzugs. Ihre Kunstwerke sind seltsam, handgezeichnet, aber gut geeignet. Neben der Möglichkeit, sich normal anzumelden, können Sie auf dieser Anmeldeseite lernen, wie Sie sich besser mit Ihrer Zielgruppe verbinden können, was viele Mailchimp-Benutzer wahrscheinlich daran interessiert sind, zu erfahren, wie Sie dies erreichen können.

Auch wenn die Formulierung auf diesem Anmeldebildschirm spärlich ist, ist der Teil „Passwort/Benutzername vergessen“ dennoch einfach und konsistent.

Sephora

Die Anmeldeseite bei Sephora verwendet ein modales Fenster als primäres Element der Benutzeroberfläche. Sie verfügen über ausgezeichnete Englischkenntnisse. „Erinnerst du dich an dein Passwort?“ genügt, um zwischen Login und Registrierung zu unterscheiden.

Darüber hinaus bedanken wir uns für den zusätzlichen Aufwand zur Validierung der im Formular eingetragenen E-Mail-Adresse. Anstatt den Benutzer nur auf einen Fehler in seiner E-Mail hinzuweisen, bietet es auch das richtige Format für jede einzelne E-Mail. Obwohl es sich um ein kleines Feature handelt, wurde es von einigen Leuten in der virtuellen Wildnis geschätzt.

Skillshare

Verbraucher können sich mit einem einzigen Klick über ihre Social-Media-Konten bei einem Dienst anmelden. Es ist nicht erforderlich, Ihr Passwort oder andere persönliche Informationen einzugeben. Skillshare zeigt ganz oben im Anmeldeformular eine Social-Login-Option an.

Wenn Sie sich dagegen entscheiden, können Sie Ihre E-Mail-Adresse und Ihr Passwort direkt unten eingeben. Dieses Login-Formular erfüllt seinen Zweck.

Fazit

Login-Formulare testen, wie einfach Sie es Ihren Benutzern machen können, sich anzumelden. Erstellen Sie ein benutzerfreundliches Login-Formular, indem Sie soziale Logins, Platzhaltertext und eindeutige Beschriftungen einfügen. Flutter Agency, ein führendes Unternehmen für die Entwicklung von Flutter-Apps, unterstützt Sie dabei, die besten Flutter-Ressourcen und den Zugriff auf die neuesten Tools zu erhalten.