Tasarım İlhamı için 15 Etkileyici Giriş Formu

Yayınlanan: 2020-09-02

Giriş formları, web sitesi kavramı ortaya çıktığından beri var olmuştur. Ve herhangi bir web sitesinin çok önemli bir bölümüdür. Giriş sayfalarıyla insan etkileşimi zamanla değişti. Başlangıçta, sisteme giriş yapmak için e-posta adresi veya ID ve şifre giriyorduk. Artık telefonda bir Dokunmatik Kimlik, yüz taraması ve sisteme giriş yapmanın diğer yolları var. Tasarım açısından bakıldığında giriş formları oldukça donuk ve düz görünümlü tasarımlara sahipti. Ancak günümüzde tasarımcılar, canlı renklerle dolu, etkileyici ve sıra dışı tasarımlarla karşımıza çıkıyor.

İçindekiler gizle
1. Tatlı:
2. Zendesk:
3. Kare boşluk:
4. İlerleme:
5. VSCO:
6. Damla:
7. Geriye Bakma:
8. Kürek:
9. Über:
10. National Geographic:
11. Medium.com:
12. Washington Post:
13. Mailchimp:
14. Sefora:
15. Diprella:

Bu blog, bir tasarımcı olarak bir tasarımcı oturum açma formu oluşturmak için keşfedebileceğiniz veya ilham alabileceğiniz etkileyici oturum açma formlarına odaklanmaktadır. Bazı canlı ve çarpıcı giriş formlarına sahip web sitelerini inceleyelim.

1. Tatlı:

Toplu iğne

Sweet, etkileyiciler ve sanatçılarla ilgilenen bir web sitesidir. Siteyi kullanıyorsanız, bir sanatçı veya etkileyici olabilirsiniz. Web sitesinde dondurma şekerine benzeyen bir renk teması var. Ayrıca sitenin logosunun oluşumunda bir de dondurma şekeri bulunmaktadır. Bu web sitesinin giriş formu, mavinin renk temasının yavaş yavaş farklı mor tonlarına geçişiyle çarpıcıdır. Web sitesine kullanıcı adı, telefon numarası veya e-posta adresi ile giriş yapabilirsiniz. Ayrıca, giriş alanlarından herhangi birine odaklanılıyorsa, Facebook, Twitter ve Google üzerinden oturum açmanıza olanak tanır, alt çizginin gölgesi maviye döner.

2. Zendesk:

Toplu iğne

Zendesk, müşteri hizmetlerini yürüten ve müşterilerin sorunları üzerinde çalıştığı bilinen bir web sitesidir. Bu şirket Kaliforniya, ABD merkezlidir. Giriş sayfası tasarımında çok minimalisttir. Yalnızca alt alan adınızın olması gereken giriş alanını görebilirsiniz. Dikkatinizi giriş formundan uzaklaştıracak başka bir şey yok. Giriş formunun altında başka bağlantılar da var. Ancak, web sitesinde üstbilgi ve altbilgi bağlantıları veya resimler yoktur. Bu, yalnızca ve yalnızca sistemde oturum açmaya odaklanmanızı sağlar.

3. Kare boşluk:

Toplu iğne

Squarespace, dijital pazarlamayı yöneten ve kullanıma hazır bazı tasarım şablonlarına sahip başka bir web sitesidir. Ayrıntılı tasarımlara sahip yeni bir ana sayfaya sahipler. Ancak, giriş sayfaları minimalist bir tasarıma sahiptir. Bu oturum açma sayfasında ayrıca, kullanıcının oturum açma işleminden dikkatini dağıtacak bir üst bilgi ve bir alt bilgi bulunmamaktadır. Giriş alanı sizden e-posta adresini ve şifreyi girmenizi ister. Bununla birlikte, Google, Apple, Facebook ve Twitter hesaplarını kullanarak da giriş yapabilirsiniz. Giriş CTA'ları da basit ama etkilidir.

4. İlerleme:

Toplu iğne

Headway, müşterileri belirli bir hizmet veya ürün hakkında bilgilendirmek için bir değişiklik günlüğü sağlayan bir web sitesidir. Web sitelerinin tamamı, mümkün olan en basit tasarımda beyaz renkli bir temayla boyanmıştır. Dikkatinizi dağıtabilecek üstbilgi veya altbilgi ayrıntılarının olmadığı daha da basit bir giriş sayfalarına sahiptirler. Sol kenarda sadece bir resim ile e-posta adresinizi ve şifrenizi girebileceğiniz bir giriş sayfası var. Ayrıca Google hesap bilgilerinizle giriş yapmanıza da izin verilir. Giriş sayfası, beyaz bir arka plan ve süslü kullanıcı arayüzü öğeleri olmadan basittir.

5. VSCO:

Toplu iğne

VSCO, aynı adı taşıyan bir web sitesine sahip bir fotoğraf düzenleme uygulamasıdır. Site paralaks kaydırma özelliğine sahiptir ve yeni bir kullanıcı arayüzüne sahiptir. Ancak, web sitesindeki giriş formu, basit bir tasarıma sahip tamamen beyaz bir formdur. E-posta adresiniz veya profil adınız ve şifrenizle giriş yapabilirsiniz. Sayfa ayrıca VSCO ana sayfasına, Feed, Kaydolma sayfasına ve VSCO uygulamasını indirmek için sayfaya gitmenizi sağlar. Yalnızca oturum açma formu sayfasının üst kısmında topluluğu temsil eden bir logoya sahiptir.

6. Damla:

Toplu iğne

Drip, çizgi roman, film, video ve müzik türlerinden şeyler tasarlayan bir web sitesidir. VSCO ve Squarespace gibi, bu web sitesinin giriş formu da beyaz renkli bir tema ile yapılmıştır. En üstte, "Kickstarter'a Giriş Yap" yazdığını görebilirsiniz. Ancak Drip, Kickstarter ekibinin bir parçasıdır. Kickstarter ID ve şifresini kullanarak siteye giriş yapabilirsiniz. Ayrıca, oturum açma ayrıntılarıyla birlikte bir şifremi unuttum bağlantısına sahiptirler. Ayrıca Facebook giriş bilgilerini kullanarak giriş yapabilirsiniz. Sayfanın alt kısmında ilerlerken Drip'in Kickstarter ailesinin bir parçası olduğunu görebilirsiniz. Web sitesinin farklı sayfalarına ileri geri giden başka bağlantıları yoktur. Siteyi ziyaret etmek istiyorsanız, giriş formunun üst kısmındaki Damla logosuna tıklamanız yeterlidir.

7. Geriye Bakma:

Toplu iğne

Lookback, kullanıcıların uygulamaları aracılığıyla çeşitli görevleri yerine getirmelerini sağlayan bir web sitesidir. İşlevsel ancak basit görünen bir giriş formu sayfası var. Büyük, kalın harflerle "Hey, seni tekrar görmek güzel!" yazdılar. Bunun altına küçük harflerle “Giriş yapmak için giriş yapın” yazmışlar. Web sitelerine e-posta adresiniz veya atanmış kullanıcı adı ve şifrenizle giriş yapabilirsiniz. CTA düğmelerini tanımlayan yeşil bir Oturum aç düğmesine sahiptirler ve sayfayı açtığınızda ilk şeyin bunu fark etmek kolaydır. Sayfanın altbilgisinde birkaç bağlantı var, ancak üstbilgi boş kalıyor.

8. Kürek:

Toplu iğne

Paddle, diğer web sitelerinin izin verdiği gibi sitenin diğer bölümlerine erişmenize izin vermeyen bir web sitesidir. Giriş sayfaları, giriş girişleriyle birlikte web sitesinin logosunu içerir. Bir e-posta adresi ve şifre kullanarak web sitelerine giriş yapabilirsiniz. Mavi oturum açma düğmesi, kullanıcının dikkatini çekecek kadar çekici, doğru mavi tonuna sahiptir. Ayrıca, bu mavi gölge, harekete geçirici mesaj düğmesini tanımlamak için doğrudur. Ayrıca giriş formunun altında verdikleri bağlantı ile şifrenizi sıfırlayabilirsiniz.

9. Über:

Toplu iğne

Uber, popüler bir taksi rezervasyon sitesidir ve hizmetleri mobil uygulama şeklinde de mevcuttur. Taksi rezervasyon devi, lansmanından hemen sonra seyirciyi fırtınaya aldı. Farklı oturum açma formları tasarladılar: biri sürücüsü için, diğeri yolcuları için. Web sitesinin sürücüler için sağladığı giriş formuna bir göz atalım. Giriş formunun üst kısmında Uber logosunu siyah olarak görebilirsiniz. Sitede oturum açmak için kayıtlı e-posta adresinizi sağlamanız gerekir. E-posta adresinizi gönderdikten sonra bir sonraki sayfada şifreyi verebilir ve sonraki butonuna basabilirsiniz. Giriş formunun altına bir kayıt bağlantısı da yerleştirilir. Sonraki butonunu, sayfayı açtığınızda dikkat çekmeyi başaramayan koyu renkte akıllıca yerleştirmişler. Ve dedikleri gibi, bir CTA her zaman farklı bir renkte olmalıdır. Ayrıca, CTA, kullanıcının görsel yakınlığında ilk görünen olmalıdır.

10. National Geographic:

Toplu iğne

National Geographic, Amerikan televizyon ağını yöneten web sitesidir. Walt Disney Company ve National Geographic Society arasındaki bir ortak girişimdir. Giriş sayfaları, varlıkları kadar benzersizdir. Giriş sayfası, e-posta adresinizi ve şifrenizi ister. Dikkatinizi çekecek süslü unsurlar içermeyen minimal bir tasarıma sahiptir. Ancak, stratejik olarak, aynı zamanda CTA'ları olan oturum açma düğmelerini sarıya yerleştirdiler. Siyah renkli butona tıklayarak aynı sayfada yeni bir kullanıcı olarak kayıt olabilirsiniz. Sayfanın üstbilgisi boş görünüyor, ancak altbilgi sizi web sitesinin belirli bölümlerine götürebilecek belirli bağlantılar içeriyor.

11. Medium.com:

Toplu iğne

Medium.com, blog yazarlarının bloglarını platforma yüklemelerini sağlayan popüler bir web sitesidir. Web siteleri, çeşitli alanlardan ve nişlerden makaleler ve bloglar hakkında konuşuyor. Ancak giriş sayfaları çok ilginç görünüyor. Giriş sayfalarında çekici bir CTA kullanmadılar. Bunun yerine, sayfa minimalist bir tasarıma sahip görünüyor. Google, Facebook, Apple, Twitter ve e-posta adresinizi kullanarak web sitelerine giriş yapabilirsiniz. Web sitesinde oturum açmanın çok yönlülüğü, oturum açma sayfalarının en iyi parçasıdır. Oluştur linkine tıklayarak web sitelerine kayıt olabilirsiniz. Üstbilgilerinde ve sayfanın altbilgilerinde başka bir bağlantı yoktur. Web sitesi bağlantılarının yalnızca Hizmet Şartları ve Gizlilik Politikası, giriş formunun altında bulunabilir.

12. Washington Post:

Toplu iğne

Washington Post, Washington DC'de günlük olarak yayınlanan bir Amerikan Gazetesidir ve aynı adla The Washington Post web sitesini yönetmektedir. Giriş sayfalarına gelince, lacivert arka plana sahip basit bir giriş formu tasarladılar. E-posta adresinizle oturum açabilir veya e-posta adresinize gönderilen bir bağlantı aracılığıyla oturum açmayı seçebilirsiniz. Ayrıca, Amazon, Facebook, Google ve Apple ile giriş yapmanızı da sağlar. Giriş formunun altında, kayıt bağlantısını da görebilirsiniz. Giriş sayfasının alt kısmında gizlilik politikası, yardım ve iletişim sayfalarının bağlantılarını bulabilirsiniz.

13. Mailchimp:

Toplu iğne

MailChimp, 2001 yılından bu yana e-posta pazarlama ve pazarlama otomasyon hizmetlerini yürüten bir Amerikan şirketidir. Gördüğünüz gibi web sitesi beyaz bir arka planla yapılmıştır. Benzer şekilde, giriş sayfalarını beyaz bir arka plana sahip olarak tasarladılar ve giriş formu stratejik olarak web sayfasının sol tarafına yerleştirildi. Sağ tarafta, en son podcastleri The Jump hakkındaki bilgileri görebilirsiniz. CTA'larını giriş düğmesine yerleştirdiler. Web sitelerine yalnızca e-posta adresinizi ve şifrenizi kullanarak giriş yapabilirsiniz. Diğer sosyal medya hesaplarından giriş yapılmasına izin vermez.

14. Sefora:

Toplu iğne

Sephora, birinci sınıf kozmetik üreticileriyle ilgilenen çok uluslu bir Fransız şirketidir. Dünyanın her yerinden yaklaşık 3000 kozmetik ve kişisel güzellik markasına sahiptir. Web siteleri tüm ürünlerini sergiliyor ve sitenin düzeni siyah beyaz kullanıcı etkileşimi öğeleriyle tasarlandı. Web sitelerinin en heyecan verici kısmı giriş sayfasıdır. Bireysel bir giriş sayfasına sahip değiller. Bunun yerine, oturum aç düğmesine tıkladığınızda sayfadan çıkan bir açılır kutu tasarladılar. MailChimp gibi, web sitelerinde oturum açmak için e-posta adresinize ihtiyacınız var. Facebook, Amazon ve diğerleri gibi sosyal medya hesaplarını kullanarak web sitelerine giriş yapamazsınız. Stratejik olarak zıt renklerde iki CTA yerleştirdiler. Hesap Oluştur düğmesi beyazken oturum açma düğmesi tamamen siyahtır. Her iki CTA da gözünüze ilk çarpanlardır.

15. Diprella:

Toplu iğne

Diprella, dünyadaki tüm tasarımcıları birbirine bağlayan ve projelerini paylaşmalarını ve tasarımlarını platformda sergilemelerini sağlayan bir topluluk web sitesidir. Tasarımcılardan oluşan bir topluluk olduğu için çarpıcı bir giriş sayfasına sahip olması gerekir. Çok yaratıcı bir giriş sayfası oluşturmuşlar. Web sitesinin giriş sayfasını açtığınızda iki ekran görebilirsiniz. Sol tarafta, e-posta kimliğiniz ve şifreniz veya Facebook gibi sosyal medya hesaplarınız üzerinden giriş yapabileceğiniz giriş ekranını görebilirsiniz. Ancak yeni bir kullanıcıysanız, sayfanın sağ tarafında bulunan kayıt ol butonuna tıklayabilirsiniz. Kaydol düğmesini tıkladığınızda, oturum açma sayfası gizlenir ve kayıt sayfası sağa kayar. Sizden istedikleri belirli ayrıntılarla ücretsiz olarak bir hesap oluşturulmasına izin verirler. Giriş alanlarındaki tüm ayrıntıları doldurmadığınız sürece kayıt düğmesi devre dışı bırakılır. Ayrıca sosyal ağ hesaplarını kullanarak da kaydolabilirsiniz.

Giriş sayfaları ayrılmaz bir parça olduğundan, tasarımcıların günümüzün teknoloji meraklısı kullanıcılarını cezbeden sayfaları tasarlaması gerekir. Başlangıçta, kullanıcının web sitesi ile etkileşiminin kritik noktalarından biri olduğu için, giriş sayfaları için düzenler basitti. Ancak şimdi, gelenekler daha iyiye doğru değişti ve heyecan verici tasarımları her yerde görmek çok kolay. Bu blog, etkileyici tasarımlara sahip giriş formlarını yakalar. Bu tasarımlar, oturum açma formlarını sıfırdan tasarlamak için ilham verici fikirler olarak kullanılabilir. Giriş formu tasarlanırken CTA'ların tüm özeni gösterilmeli ve güzel bir görünüm kazandırılmalıdır.