15 imponujących formularzy logowania do inspiracji projektowych
Opublikowany: 2020-09-02Formularze logowania istnieją od momentu powstania koncepcji serwisu. I jest to kluczowa sekcja każdej strony internetowej. Interakcja człowieka ze stronami logowania zmieniła się z czasem. Początkowo używaliśmy adresu e-mail lub identyfikatora i hasła, aby zalogować się do systemu. Teraz mamy Touch ID w telefonie, skanowanie twarzy i inne sposoby logowania się do systemu. Z punktu widzenia projektowania formularze logowania miały bardzo nudny i płaski wygląd. Ale obecnie projektanci wymyślili imponujące i nieszablonowe projekty pełne żywych kolorów.
Ten blog koncentruje się na imponujących formularzach logowania, z których możesz eksplorować lub czerpać inspirację do tworzenia formularza logowania projektanta jako projektant. Przyjrzyjmy się stronom internetowym, które mają do dyspozycji żywe i zachwycające formularze logowania.
1. Słodkie:
Sweet to strona internetowa, która zajmuje się influencerami i artystami. Możesz być artystą lub influencerem, jeśli korzystasz z witryny. Witryna ma motyw kolorystyczny, który przypomina cukierki lodowe. Co więcej, logo serwisu zawiera również cukierki do lodów. Formularz logowania na tej stronie jest oszałamiający, a motyw koloru niebieskiego stopniowo przechodzi w różne odcienie fioletu. Możesz zalogować się do serwisu za pomocą nazwy użytkownika, numeru telefonu lub adresu e-mail. Pozwala również zalogować się przez Facebook, Twitter i Google, jeśli fokus znajduje się na którymkolwiek z pól wejściowych, odcień podkreślenia zmieni się na niebieski.
2. Zendesk:
Zendesk to strona internetowa, która zajmuje się obsługą klienta i jest znana z pracy nad problemami klientów. Ta firma ma siedzibę w Kalifornii w USA. Ich strona logowania jest bardzo minimalistyczna w swojej konstrukcji. Możesz zobaczyć tylko pole wprowadzania, w którym musisz podać nazwę swojej subdomeny. Nie pozostaje nic innego, jak odwrócić uwagę od formularza logowania. Pod formularzem logowania znajdują się inne linki. Ale na stronie nie ma linków nagłówka i stopki ani obrazów. Pozwala to skupić się tylko i wyłącznie na logowaniu do systemu.
3. Przestrzeń kwadratowa:
Squarespace to kolejna strona internetowa, która obsługuje marketing cyfrowy i ma kilka gotowych do użycia szablonów projektów. Mają nową stronę główną z wyszukanymi projektami. Ale ich strona logowania ma minimalistyczny wygląd. Ta strona logowania nie zawiera również nagłówka i stopki, które odwracałyby uwagę użytkownika od procesu logowania. W polu wejściowym zostaniesz poproszony o podanie adresu e-mail i hasła. Oprócz tego możesz również logować się za pomocą kont Google, Apple, Facebook i Twitter. Ich wezwanie do logowania jest również proste, ale skuteczne.
4. Postęp:
Headway to strona internetowa, która udostępnia dziennik zmian, aby informować klientów o konkretnej usłudze lub produkcie. Cała ich strona internetowa jest pomalowana na biało-kolorowy motyw w najprostszym możliwym projekcie. Mają jeszcze prostszą stronę logowania, na której nie ma żadnych szczegółów nagłówka ani stopki, które mogłyby cię rozpraszać. Tylko obrazek na lewym marginesie oznacza stronę logowania, na której możesz wpisać swój adres e-mail i hasło. Możesz również zalogować się za pomocą danych konta Google. Strona logowania jest prosta, z białym tłem i bez wymyślnych elementów interfejsu użytkownika.
5. VSCO:
VSCO to aplikacja do edycji zdjęć ze stroną internetową o tej samej nazwie. Witryna oferuje przewijanie paralaksy i ma nowy interfejs użytkownika. Ale formularz logowania na stronie internetowej to całkowicie biały formularz o prostym wyglądzie. Możesz zalogować się za pomocą swojego adresu e-mail lub nazwy profilu i hasła. Strona umożliwia również przejście do strony głównej VSCO, kanału informacyjnego, strony rejestracji i strony, na której można pobrać aplikację VSCO. Ma tylko logo reprezentujące społeczność na górze strony formularza logowania.
6. Kroplówka:
Drip to strona internetowa, która projektuje rzeczy z komiksów, filmów, filmów i muzyki. Podobnie jak VSCO i Squarespace, formularz logowania tej witryny jest również wykonany z motywem w kolorze białym. Na górze możesz zauważyć, że napisali: „Zaloguj się na Kickstarter”. Ale Drip jest częścią zespołu Kickstarter. Możesz zalogować się do serwisu za pomocą identyfikatora Kickstarter i jego hasła. Mają również link do zapomnianego hasła wraz z danymi logowania. Możesz również zalogować się za pomocą danych logowania na Facebooku. Podczas przewijania na dole strony możesz zobaczyć, że Drip jest częścią rodziny Kickstarter. Nie mają żadnych innych linków prowadzących tam iz powrotem do różnych stron witryny. Jeśli chcesz odwiedzić witrynę, wystarczy kliknąć logo Drip w górnej części formularza logowania.
7. Podsumowanie:
Lookback to witryna internetowa, która umożliwia użytkownikom wykonywanie różnych zadań za pośrednictwem ich aplikacji. Mają funkcjonalną, ale przejrzystą stronę formularza logowania. Napisali dużymi, pogrubionymi literami: „Hej, dobrze cię znowu widzieć!” Poniżej napisali małymi literami „Zaloguj się, aby zacząć”. Możesz zalogować się na ich stronie internetowej za pomocą swojego adresu e-mail lub przypisanej nazwy użytkownika i hasła. Mają zielony przycisk Zaloguj się, który definiuje ich przycisk CTA i łatwo zauważyć, że jest to pierwsza rzecz po otwarciu strony. Stopka strony zawiera kilka linków, ale nagłówek pozostaje pusty.
8. Wiosło:
Paddle to strona internetowa, która nie pozwala na dostęp do innych części witryny, tak jak pozwalają na to inne strony internetowe. Na ich stronie logowania znajduje się logo witryny wraz z danymi wejściowymi logowania. Możesz zalogować się na ich stronie internetowej za pomocą adresu e-mail i hasła. Niebieski przycisk logowania ma odpowiedni odcień niebieskiego, wystarczająco atrakcyjny, aby przyciągnąć uwagę użytkownika. Co więcej, ten niebieski odcień jest odpowiedni do zdefiniowania przycisku wezwania do działania. Możesz również zresetować hasło za pomocą linku, który podali pod formularzem logowania.
9. Uber:
Uber to popularny serwis do rezerwacji taksówek, a jego usługi są również dostępne w formie aplikacji mobilnej. Gigant rezerwacji taksówek zachwycił publiczność zaraz po uruchomieniu. Opracowali różne formularze logowania: jeden dla kierowcy, a drugi dla pasażerów. Przyjrzyjmy się formularzowi logowania, który strona udostępniła dla kierowców. W górnej części formularza logowania widnieje czarne logo Uber. Aby zalogować się na stronie, musisz podać swój zarejestrowany adres e-mail. Możesz podać hasło na następnej stronie po podaniu adresu e-mail i naciśnięciu przycisku Dalej. Link do rejestracji znajduje się również pod formularzem logowania. Sprytnie umieścili kolejny przycisk w ciemnym kolorze, który nie przestaje przyciągać uwagi podczas otwierania strony. I jak mówią, CTA zawsze powinno być w innym kolorze. Co więcej, CTA powinno również pojawiać się jako pierwsze w wizualnej bliskości użytkownika.
10. National Geographic:
National Geographic to strona zarządzająca amerykańską siecią telewizyjną. Jest to wspólne przedsięwzięcie Walt Disney Company i National Geographic Society. Ich strona logowania jest tak wyjątkowa, jak ich istnienie. Ich strona logowania prosi o podanie adresu e-mail i hasła. Ma minimalistyczny design bez fantazyjnych elementów, które przyciągną Twoją uwagę. Ale strategicznie umieścili przycisk logowania na żółto, który jest również ich CTA. Możesz zarejestrować się jako nowy użytkownik na tej samej stronie, klikając przycisk w kolorze czarnym. Nagłówek strony wydaje się pusty, ale stopka zawiera pewne linki, które mogą prowadzić do określonych części witryny.
11. Medium.com:
Medium.com to popularna strona internetowa, która pozwala blogerom przesyłać swoje blogi na platformę. Ich strona internetowa opowiada o artykułach i blogach z różnych dziedzin i nisz. Ale ich strona logowania wydaje się bardzo interesująca. Nie użyli żadnych atrakcyjnych CTA na swojej stronie logowania. Zamiast tego strona wydaje się mieć minimalistyczny wygląd. Możesz zalogować się na ich stronie za pomocą Google, Facebook, Apple, Twitter i swojego adresu e-mail. Najlepszą częścią ich strony logowania jest wszechstronność logowania na stronie. Możesz zarejestrować się na ich stronie internetowej, klikając link utwórz jeden. Nie mają żadnych innych linków w nagłówku i stopce strony. Tylko Regulamin i Polityka Prywatności linków do strony znajdują się pod formularzem logowania.
12. Washington Post:
The Washington Post to amerykańska gazeta, która jest publikowana codziennie w Waszyngtonie, a oni prowadzą stronę internetową pod tą samą nazwą, The Washington Post. Wchodząc na swoją stronę logowania, zaprojektowali prosty formularz logowania z granatowym tłem. Możesz zalogować się za pomocą swojego adresu e-mail lub możesz zalogować się za pomocą linku wysłanego na Twój adres e-mail. Co więcej, umożliwia również logowanie się za pomocą Amazon, Facebooka, Google i Apple. Pod formularzem logowania znajduje się również link do rejestracji. W stopce strony logowania znajdują się linki do polityki prywatności, pomocy i stron kontaktowych.
13. Szympans pocztowy:
MailChimp to amerykańska firma zajmująca się e-mail marketingiem i usługami automatyzacji marketingu od 2001 roku. Jak widać strona wykonana jest z białym tłem. Podobnie zaprojektowali swoją stronę logowania z białym tłem, a formularz logowania jest strategicznie umieszczony po lewej stronie strony internetowej. Po prawej stronie znajdują się informacje o ich najnowszym podcaście The Jump. Umieścili swoje wezwanie do działania na swoim przycisku logowania. Możesz zalogować się na ich stronie tylko za pomocą swojego adresu e-mail i hasła. Nie pozwala na logowanie za pośrednictwem innych kont mediów społecznościowych.
14. Sefora:
Sephora to francuska międzynarodowa firma, która współpracuje ze światowej klasy producentami kosmetyków. Obejmuje około 3000 marek kosmetycznych i kosmetycznych z całego świata. Ich strona internetowa prezentuje wszystkie ich produkty, a układ strony został zaprojektowany w czarno-białych elementach interakcji z użytkownikiem. Najbardziej ekscytującą częścią ich witryny jest strona logowania. Nie mają indywidualnej strony logowania. Zamiast tego zaprojektowali wyskakujące okienko, które wyskakuje ze strony po kliknięciu przycisku logowania. Podobnie jak MailChimp, potrzebujesz swojego adresu e-mail, aby zalogować się do ich witryny. Nie możesz zalogować się do ich witryny za pomocą kont mediów społecznościowych, takich jak Facebook, Amazon i inne. Umieścili strategicznie dwa CTA w kontrastujących kolorach. Przycisk logowania jest cały czarny, a przycisk Utwórz konto jest biały. Oba CTA są pierwszymi, które rzucają się w oczy.
15. Diprella:
Diprella to strona społecznościowa, która łączy wszystkich projektantów z całego świata i pozwala im dzielić się swoimi projektami i prezentować swoje projekty na platformie. Ponieważ jest to społeczność projektantów, musi mieć oszałamiającą stronę logowania. Stworzyli bardzo kreatywną stronę logowania. Po otwarciu strony logowania do witryny możesz zobaczyć dwa ekrany. Po lewej stronie możesz zobaczyć ekran logowania, na którym możesz zalogować się za pomocą swojego identyfikatora e-mail i hasła lub kont w mediach społecznościowych, takich jak Facebook. Ale jeśli jesteś nowym użytkownikiem, możesz kliknąć przycisk rejestracji po prawej stronie. Po kliknięciu przycisku rejestracji strona logowania zostanie ukryta, a strona rejestracji przesunie się w prawo. Umożliwiają utworzenie konta za darmo z określonymi szczegółami, o które Cię proszą. Przycisk rejestracji jest wyłączony, chyba że wypełnisz wszystkie dane w polach wejściowych. Możesz także zarejestrować się za pomocą kont sieci społecznościowych.
Ponieważ strony logowania są integralną częścią, projektanci muszą zaprojektować strony, które przyciągną dzisiejszych doświadczonych technologicznie użytkowników. Początkowo układy były proste dla stron logowania, ponieważ był to jeden z krytycznych punktów interakcji użytkownika z witryną. Ale teraz konwencje zmieniły się na lepsze i łatwo jest dostrzec ekscytujące projekty na całym świecie. Ten blog zawiera formularze logowania, które mają imponujący wygląd. Te projekty mogą służyć jako inspirujące pomysły do projektowania formularzy logowania od podstaw. Projektując formularz logowania należy zadbać o CTA i nadać im piękny wygląd.