15 formulaires de connexion impressionnants pour l'inspiration de conception

Publié: 2020-09-02

Les formulaires de connexion existent depuis que le concept du site Web a vu le jour. Et c'est une section cruciale de tout site Web. L'interaction humaine avec les pages de connexion a changé avec le temps. Initialement, nous avions l'habitude de saisir l'adresse e-mail ou l'identifiant et le mot de passe pour se connecter au système. Maintenant, nous avons un Touch ID sur le téléphone, un scan du visage et d'autres moyens de se connecter au système. Du point de vue de la conception, les formulaires de connexion avaient des conceptions très ternes et plates. Mais de nos jours, les designers ont mis au point des designs impressionnants et prêts à l'emploi pleins de couleurs vives.

Masquer la table des matières
1. Sucré :
2. Zendesk :
3. Espace carré :
4. Progrès :
5. VSCO :
6. Goutte à goutte :
7. Rétrospective :
8. Pagaie :
9.Uber :
10. National Géographique :
11. Médium.com :
12. Le Washington Post :
13. Mailchimp :
14. Séphora :
15. Diprella :

Ce blog se concentre sur les formulaires de connexion impressionnants que vous pouvez explorer ou vous inspirer pour créer un formulaire de connexion de concepteur, en tant que concepteur. Examinons les sites Web qui disposent de formulaires de connexion dynamiques et époustouflants.

1. Sucré :

Broche

Sweet est un site web qui traite avec des influenceurs et des artistes. Vous pouvez être soit un artiste, soit un influenceur si vous utilisez le site. Le site Web a un thème de couleur qui ressemble à un bonbon à la crème glacée. De plus, le logo du site Web comporte également un bonbon à la crème glacée dans sa formation. Le formulaire de connexion de ce site Web est époustouflant, le thème de la couleur du bleu passant progressivement à différentes nuances de violet. Vous pouvez vous connecter au site Web avec un nom d'utilisateur, un numéro de téléphone ou une adresse e-mail. Il vous permet également de vous connecter via Facebook, Twitter et Google si le focus est sur l'un des champs de saisie, l'ombre du soulignement passe au bleu.

2. Zendesk :

Broche

Zendesk est un site Web qui gère le service client et est connu pour résoudre les problèmes des clients. Cette société est basée en Californie, aux États-Unis. Leur page de connexion est très minimaliste dans sa conception. Vous ne pouvez voir que le champ de saisie où vous devez avoir votre nom de sous-domaine. Il n'y a rien d'autre pour détourner votre attention du formulaire de connexion. Il y a d'autres liens sous le formulaire de connexion. Mais, il n'y a pas de liens d'en-tête et de pied de page ou d'images sur le site Web. Cela vous permet de vous concentrer uniquement et uniquement sur la journalisation dans le système.

3. Espace carré :

Broche

Squarespace est un autre site Web qui gère le marketing numérique et propose des modèles de conception prêts à l'emploi. Ils ont une nouvelle page d'accueil avec des designs élaborés. Mais, leur page de connexion a un design minimaliste. Cette page de connexion ne comporte pas non plus d'en-tête et de pied de page pour distraire l'utilisateur du processus de connexion. Le champ de saisie vous demande de saisir l'adresse e-mail et le mot de passe. Parallèlement à cela, vous pouvez également vous connecter en utilisant les comptes Google, Apple, Facebook et Twitter. Leur connexion CTA est également simple mais efficace.

4. Progrès :

Broche

Headway est un site Web qui fournit un journal des modifications pour tenir les clients informés d'un service ou d'un produit particulier. L'ensemble de leur site Web est peint dans un thème de couleur blanche dans la conception la plus simple possible. Ils ont une page de connexion encore plus simple où il n'y a pas de détails d'en-tête ou de pied de page qui peuvent vous distraire. Avec juste une image dans la marge de gauche, ils ont une page de connexion où vous pouvez remplir votre adresse e-mail et votre mot de passe. Vous êtes également autorisé à vous connecter avec les détails de votre compte Google. La page de connexion est simple, avec un fond blanc et aucun élément d'interface utilisateur fantaisiste.

5. VSCO :

Broche

VSCO est une application de retouche photo avec un site Web sous le même nom. Le site propose un défilement parallaxe et une nouvelle interface utilisateur. Mais le formulaire de connexion sur le site Web est un formulaire entièrement blanc au design simple. Vous pouvez vous connecter via votre adresse e-mail ou votre nom de profil et le mot de passe. La page vous permet également d'accéder à la page d'accueil de VSCO, au flux, à la page d'inscription et à la page de téléchargement de l'application VSCO. Il n'a qu'un logo qui représente la communauté en haut de la page du formulaire de connexion.

6. Goutte à goutte :

Broche

Drip est un site Web qui conçoit des choses à partir des genres de bandes dessinées, de films, de vidéos et de musique. Comme VSCO et Squarespace, le formulaire de connexion de ce site Web est également créé avec un thème de couleur blanche. En haut, vous pouvez voir qu'ils ont écrit : "Connexion à Kickstarter". Mais, Drip fait partie de l'équipe Kickstarter. Vous pouvez vous connecter au site Web à l'aide de l'identifiant Kickstarter et de son mot de passe. Ils ont également un lien de mot de passe oublié avec les informations de connexion. Vous pouvez également vous connecter en utilisant les informations de connexion Facebook. En faisant défiler en bas de la page, vous pouvez voir que Drip fait partie de la famille Kickstarter. Ils n'ont pas d'autres liens vers les différentes pages du site Web. Si vous souhaitez visiter le site, il vous suffit de cliquer sur le logo Drip en haut du formulaire de connexion.

7. Rétrospective :

Broche

Lookback est un site Web qui permet aux utilisateurs d'accomplir diverses tâches via leur application. Ils ont une page de formulaire de connexion fonctionnelle mais simple. Ils ont écrit en grosses lettres grasses : "Hé, content de vous revoir !" En dessous, ils ont écrit "Connectez-vous pour commencer" en petites lettres. Vous pouvez vous connecter à leur site Web via votre adresse e-mail ou un nom d'utilisateur et un mot de passe attribués. Ils ont un bouton de connexion vert qui définit leur bouton CTA, et il est facile de le remarquer dès que vous ouvrez la page. Le pied de page comporte quelques liens, mais l'en-tête reste vide.

8. Pagaie :

Broche

Paddle est un site Web qui ne vous permet pas d'accéder à d'autres parties du site comme d'autres sites Web vous le permettent. Leur page de connexion comporte le logo du site Web ainsi que les entrées de connexion. Vous pouvez vous connecter à leur site Web en utilisant une adresse e-mail et un mot de passe. Le bouton de connexion bleu a la bonne teinte de bleu, suffisamment attrayant pour attirer l'attention de l'utilisateur. De plus, cette nuance bleue est correcte pour définir le bouton d'appel à l'action. Vous pouvez également réinitialiser votre mot de passe avec le lien fourni sous le formulaire de connexion.

9.Uber :

Broche

Uber est un site Web de réservation de taxi populaire, et ses services sont également disponibles sous la forme d'une application mobile. Le géant de la réservation de taxis a pris d'assaut le public immédiatement après son lancement. Ils ont conçu différents formulaires de connexion : un pour leur chauffeur et d'autres pour leurs passagers. Jetons un coup d'œil au formulaire de connexion que le site Web a fourni aux conducteurs. En haut du formulaire de connexion, vous pouvez apercevoir le logo Uber en noir. Pour vous connecter sur le site, vous devez fournir votre adresse e-mail enregistrée. Vous pouvez donner le mot de passe sur la page suivante après avoir soumis votre adresse e-mail et appuyer sur le bouton suivant. Un lien d'inscription est également placé sous le formulaire de connexion. Ils ont astucieusement placé le bouton suivant dans la couleur foncée, ce qui ne manque pas d'attirer l'attention à l'ouverture de la page. Et comme on dit, un CTA doit toujours être d'une couleur différente. De plus, le CTA devrait également être le premier à apparaître à proximité visuelle de l'utilisateur.

10. National Géographique :

Broche

National Geographic est le site qui gère le réseau américain de télévision. Il s'agit d'une joint-venture entre la Walt Disney Company et la National Geographic Society. Leur page de connexion est aussi unique que leur existence. Leur page de connexion vous demande votre adresse e-mail et votre mot de passe. Il a un design minimaliste sans éléments fantaisistes pour attirer votre attention. Mais ils ont stratégiquement placé leur bouton de connexion en jaune, qui se trouve également être leur CTA. Vous pouvez vous inscrire en tant que nouvel utilisateur sur la même page en cliquant sur le bouton en noir. L'en-tête de la page semble vide, mais le pied de page contient certains liens qui peuvent vous mener à certaines parties du site Web.

11. Médium.com :

Broche

Medium.com est un site Web populaire qui permet aux blogueurs de télécharger leurs blogs sur la plate-forme. Leur site Web parle d'articles et de blogs de divers domaines et niches. Mais leur page de connexion semble être très intéressante. Ils n'ont utilisé aucun CTA attrayant sur leur page de connexion. Au lieu de cela, la page semble avoir un design minimaliste. Vous pouvez vous connecter à leur site Web en utilisant Google, Facebook, Apple, Twitter et votre adresse e-mail. La polyvalence de la connexion sur le site Web est la meilleure partie de leur page de connexion. Vous pouvez vous inscrire sur leur site Web en cliquant sur le lien créer un. Ils n'ont pas d'autres liens dans leur en-tête et le pied de page. Seules les conditions d'utilisation et la politique de confidentialité des liens du site Web se trouvent sous le formulaire de connexion.

12. Le Washington Post :

Broche

Le Washington Post est un journal américain qui est publié quotidiennement à Washington DC, et ils ont géré le site Web sous le même nom, The Washington Post. En arrivant sur leur page de connexion, ils ont conçu un formulaire de connexion simple avec un fond bleu marine. Vous pouvez vous connecter avec votre adresse e-mail ou vous pouvez choisir de vous connecter via un lien envoyé sur votre adresse e-mail. De plus, il vous permet également de vous connecter avec Amazon, Facebook, Google et Apple. Sous le formulaire de connexion, vous pouvez également repérer le lien d'inscription. Au bas de la page de connexion, vous trouverez les liens vers la politique de confidentialité, l'aide et les pages de contact.

13. Mailchimp :

Broche

MailChimp est une société américaine qui gère les services de marketing par e-mail et d'automatisation du marketing depuis 2001. Comme vous pouvez le voir, le site Web est créé avec un fond blanc. De même, ils ont conçu leur page de connexion avec un fond blanc et le formulaire de connexion est stratégiquement placé sur le côté gauche de la page Web. Sur le côté droit, vous pouvez repérer les informations sur leur dernier podcast, The Jump. Ils ont placé leur CTA sur leur bouton de connexion. Vous ne pouvez vous connecter à leur site Web qu'en utilisant votre adresse e-mail et votre mot de passe. Il ne permet pas de se connecter via d'autres comptes de médias sociaux.

14. Séphora :

Broche

Sephora est une multinationale française qui traite avec des fabricants de cosmétiques de classe mondiale. Il propose environ 3000 marques de cosmétiques et de beauté personnelle du monde entier. Leur site Web présente tous leurs produits et la mise en page du site a été conçue avec des éléments d'interaction utilisateur en noir et blanc. La partie la plus excitante de leur site Web est leur page de connexion. Ils n'ont pas de page de connexion individuelle. Au lieu de cela, ils ont conçu une boîte contextuelle qui apparaît hors de la page lorsque vous cliquez sur le bouton de connexion. Comme MailChimp, vous avez besoin de votre adresse e-mail pour vous connecter à leur site Web. Vous ne pouvez pas vous connecter à leur site Web en utilisant des comptes de médias sociaux comme Facebook, Amazon et autres. Ils ont stratégiquement placé deux CTA dans des couleurs contrastées. Le bouton de connexion est entièrement noir tandis que le bouton Créer un compte est blanc. Les deux CTA sont les premiers à frapper vos yeux.

15. Diprella :

Broche

Diprella est un site Web communautaire qui relie tous les designers du monde entier et leur permet de partager leurs projets et de présenter leurs créations sur la plateforme. Comme il s'agit d'une communauté de designers, elle doit avoir une page de connexion époustouflante. Ils ont créé une page de connexion très créative. Vous pouvez voir deux écrans lorsque vous ouvrez la page de connexion du site Web. Sur le côté gauche, vous pouvez repérer l'écran de connexion où vous pouvez vous connecter via votre identifiant de messagerie et votre mot de passe ou vos comptes de médias sociaux comme Facebook. Mais si vous êtes un nouvel utilisateur, vous pouvez cliquer sur le bouton d'inscription sur le côté droit de la page. Lorsque vous cliquez sur le bouton d'inscription, la page de connexion se cache et la page d'inscription glisse vers la droite. Ils permettent la création d'un compte gratuitement avec les détails spécifiques qu'ils vous demandent. Le bouton d'inscription est désactivé à moins et jusqu'à ce que vous remplissiez tous les détails dans les champs de saisie. Vous pouvez également vous inscrire en utilisant des comptes de réseaux sociaux.

Les pages de connexion faisant partie intégrante, les concepteurs doivent concevoir les pages qui attirent les utilisateurs avertis d'aujourd'hui. Initialement, les mises en page étaient simples pour les pages de connexion car c'était l'un des points critiques d'interaction de l'utilisateur avec le site Web. Mais maintenant, les conventions ont changé pour le mieux et il est facile de repérer des designs passionnants partout. Ce blog capture les formulaires de connexion qui ont des designs impressionnants. Ces conceptions peuvent être utilisées comme idées inspirantes pour concevoir les formulaires de connexion à partir de zéro. Lors de la conception du formulaire de connexion, tous les soins des CTA doivent être pris et ils doivent avoir une belle apparence.