Size İlham Verecek 7 Mükemmel Çok Adımlı Form Örneği

Çevrimiçi formlarınız bir kullanıcı deneyimi desteği kullanabilir mi? Bu çok adımlı form örnekleri size harika fikirler ve en iyi uygulama önerileri de verecektir. Onlara bir göz atın!

Yaklaşık okuma süresi: 7 dakika

Kimse uzun formları doldurmaktan hoşlanmaz. Biz bile form işindeyiz.

Ancak ister bir haber bültenine kaydolmak, ister ödeme yapmak veya müşteri hizmetleriyle iletişime geçmek olsun, hemen hemen her web sitesinin bir forma ihtiyacı vardır.

Peki, site oluşturucular olarak, ihtiyacımız olan bilgileri toplarken formları doldurmayı nasıl daha az zahmetli hale getirebiliriz?

Cevap çok adımlı form tasarımıdır!

İnsanları tüm sorularımızla aynı anda bombardımana tutmak yerine, bunları birden fazla sayfaya veya adıma yayacağız. Bu, çok daha iyi bir kullanıcı deneyimi sağlar ve biz yine de kullanıcıların aynı sayıda form alanını doldurmasını gizlice sağlarız.

Şimdi, web'deki yedi harika çok adımlı form örneğine daha yakından bakalım ve çıkarımlarımızı paylaşalım, böylece daha ileri giderek dönüşüm oranlarını kazanabilirsiniz!

Çok adımlı formlar ne zaman kullanılmalı (ve ne zaman kullanılmamalı)

Aşağıdakiler de dahil olmak üzere birçok durum çok adımlı bir form kullanmak için uygundur:

• İş başvuruları
• Çevrimiçi testler veya sınavlar
• Kayıt ve kayıt formları
• Sınavlar ve kurşun mıknatıslar
• Ekleme sihirbazları
• Fiyat teklifi talepleri

Ve bu sadece başımızın üstünde. Çok sayfalı form tasarımını gerçekten her şey için kullanabilirsiniz.

Ama yapmalı mısın?

Yapabiliyor olman, yapman gerektiği anlamına gelmez. Bu söz hayattaki hemen hemen her şey için doğrudur ve form oluşturma için de geçerli olduğu ortaya çıktı!

Formunuz çok kısaysa ve yalnızca birkaç alan içeriyorsa muhtemelen çok adımlı bir form kullanmamalısınız .

Yalnızca isim, e-posta adresi ve telefon numarası isteyen basit bir bülten abonelik formunu bölmek tuhaf olurdu. Gereksiz tıklamalar ekler. Formunuzu tamamlamak için ne kadar çok tıklama gerekiyorsa, kullanıcıları "Gönder"e basmadan önce kaybetme olasılığınız da o kadar artar.

Ancak tek bir sayfada olmanın faydasını görebilecek olanlar yalnızca basit formlar değildir. Bazı daha karmaşık formlar da bunu yapabilir.

Örneğin Sephora'nın ödeme sayfasında tek adımlı bir form var. ️ Şirketin ne kadar büyük olduğu göz önüne alındığında, mutlaka araştırma yapmışlar ve müşterilerinin her şeyi aynı sayfada tutmayı tercih ettiklerini bulmuşlardır.

Formun daha kısa görünmesini sağlamak, dikkat dağıtıcı unsurları sınırlamak ve alışveriş sepetini terk etmeyi azaltmak için bazı akıllı UX tasarım öğeleri kullandılar.

Bu nedenle, çok adımlı bir formun mu yoksa tek sayfalık bir formun mu kullanılacağı sorusunun yanıtı, sağduyunun ve katı verilerin birleşimine bağlıdır.

Kullanıcılarınızı herkesten daha iyi tanıyorsunuz. Kendileri için en iyi neyin işe yaradığını bulmak için istatistikleri incelemekten ve anket sonuçlarınızı analiz etmekten korkmayın!

En iyi çok adımlı form örnekleri

1. Airbnb - Kullanıcı kayıt formu

Airbnb'de bir hesap oluşturmak ve profilinizi tamamlamak, bir sonraki tatil yerinizi seçmekten daha kolay olabilir.

Form, her cihazda iyi çalışan bir tasarıma sahip, tamamen kullanıcı dostu olmakla ilgilidir. Ama mesele sadece tasarım değil. Kopya aynı zamanda adımlara devam etmeniz için hafif bir dürtme sunarken, herhangi bir adımı atlayıp daha sonra geri dönebileceğinizi de bildirir.

Bu küçük çizgi, ilk kez kullananların üzerindeki büyük baskıyı alır.

Neden onu seviyoruz:

• Mobil uyumlu, duyarlı, çok adımlı form tasarımı
• Geri düğmesi ve atlama seçeneğiyle kolay gezinme
• Ilerleme göstergesi
• Akıllı, verimli kopyalama

2. N26 - Banka hesabı oluşturma

N26 üşütmeden formunu korur. Bir bankanın müşterilerini mutlu etmek için biraz zaman ve enerji harcaması hoş değil mi?

Bu duyarlı form, ister telefonunuzda ister masaüstünüzde olun, harika görünür ve sıkıcı ama önemli bir banka hesabı açma görevinde size sorunsuz bir şekilde rehberlik eder.

Tüm adımları önceden ortaya koyuyor, bu yüzden sürpriz yok. Görüntüleme modlarını değiştirme seçeneği de kullanıcı deneyimini geliştiren hoş bir dokunuş.

Neden onu seviyoruz:

• Ilerleme göstergesi
• Adımların listesini temizle
• Kolay gezinme
• Açık mod/karanlık mod seçeneği
• İkamet edilen ülkeye dayalı seçenekler için koşullu mantık

3. Ubersuggest - Kurşun mıknatıs

SEO ve dijital pazarlamanın kralı Neil Patel, bu açılış sayfası potansiyel müşteri oluşturma formuyla (her zamanki gibi) parkın dışında kaldı.

Bu çok adımlı test formunun düzeni, kendinizi kaybolmuş veya yalnız hissetmenize neden olmadan karmaşayı ortadan kaldırır. Neil, her sorunun ardındaki güven verici açıklamalar ve net nedenlerle size yol göstermek için orada. Bunun karşılığında ajansı tonlarca nitelikli potansiyel müşteri alıyor!

Neden onu seviyoruz:

• Temiz, minimalist tasarım
• İlerleme göstergeleri
• Form seçeneklerini temizle
• Her seferinde tek soru, konuşma formu formatı
• Dost canlısı yüz ve açıklamalar

4. Stripe - Hesap kaydı ve kullanıcı katılımı

Stripe'ın bu çok adımlı form örneği, istediğiniz ve ihtiyaç duyduğunuz güvence ve geri bildirimi sunarken, hesabınızı sorunsuz bir şekilde kurmanıza yardımcı olur.

Akıllıca hazırlanmış, hizmetin kime yönelik olduğunu açıkça listeleyen ve tüm önemli finansal bilgileri güvende tutan bir form sayesinde, en başından itibaren emin ellerde olduğunuzu anlayabilirsiniz.

Neden onu seviyoruz:

• Her adımda geri bildirim
• Kullanıcılara hizmetin yararlarını hatırlatır
• Sosyal kanıt
• Şık, basit tasarım

5. Sıradan - Ürün testi

Ordinary'nin rejim oluşturucusu, çok adımlı bir formdan çok, bir cilt bakımı uzmanıyla veya kişisel alışveriş yapan biriyle sohbet etmeye benziyor. Ama hepsi bu, bir form!

Kapalı uçlu sorular sorarak ve onlara kaydırıcılar gibi basit seçenekler sunarak formu çok kısa sürede ve fazla çaba harcamadan doldurabilirsiniz. İşiniz bittiğinde, önerilen ürünleri anında sepetinize eklemek için tıklayabilirsiniz.

Keşke tüm alışveriş deneyimleri bu kadar kolay ve keyifli olsaydı!

Neden onu seviyoruz:

• İlk adımda listelenen formu doldurma zamanı
• Kişiselleştirilmiş ürün önerileri
• Koşullu mantık
• Konuşma biçimi
• Marka misyonuna uygun minimalist form tasarımı

6. Küçük Pasaportlar - Ürün testi ve ödeme

Little Passports, form doldurmayı eğlenceli bir kendin seç macerasına dönüştürüyor. Ödeme süreçlerinde sizi içine çeken çok sayıda adım var ve çocukların merakını uyandıracak farklı kitler sergileniyor. Formun her bölümü, bir abonelik kutusu seçmeyi onu almak kadar heyecan verici hale getirecek şekilde tasarlanmıştır.

Neden onu seviyoruz:

• Kişiselleştirme
• Koşullu mantık
• Ilerleme göstergesi
• Eğlenceli ve renkli tasarım

7. Geico - Fiyat teklifi talebi

Geico'nun çok adımlı sigorta teklif formu her şeyin net, anlaşılır ve hızlı olmasını sağlar. Dost canlısı küçük kertenkele maskotları, seçeneklerinize tıkladıkça sizi neşelendirmek için oradalar. Aniden sigorta işleri çok daha az korkutucu görünüyor!

Bu form hızlı ve faydalıdır. Ve sonunda, sürüngen dostumuz daha sonra takip etmek üzere nitelikli potansiyel müşteriler toplarken siz de anında fiyat teklifi alırsınız.

Neden onu seviyoruz:

• Erişilebilirlik için resimler içeren büyük radyo düğmeleri
• Duyarlı tasarım
• Kişiselleştirilmiş ürün veya hizmet
• Kişisel bilgi istemeden önce ürün seçenekleri

İyi çok adımlı form tasarımının anahtarları

Peki bu örneklerden ne öğrenebiliriz?

Ortak noktalarına bakarsak, çok adımlı birkaç UX en iyi uygulaması netleşir:

• İlerleme göstergeleri - ilerleme çubuğu, kök çizgi, numaralı adımlar, zaman tahminleri vb.
• Açık ve anlaşılır saha geri bildirimi - zorunlu alanlar, hata mesajları, onay mesajları
• Kişiselleştirme - dinamik alanlar ve özel öneriler
• Duyarlı tasarım - formların harika görünmesi ve her boyuttaki ekranda kullanımının kolay olması gerekir
• Açık uçlu soruları sınırlayın - metin alanları yerine açılır menüleri, düğmeleri, kaydırıcıları ve geçiş düğmelerini kullanın

Sitemizdeki formlarda da bu unsurlara yer vermeye çalıştık. Çok sayfalı ödeme formumuz şu şekilde ortaya çıktı. Ne düşünüyorsun? Burada kendiniz denemekten çekinmeyin.

Kendi çok adımlı formlarınızı oluşturmaya hazır mısınız?

Artık form bilgisi ve ilhamla dolu olduğunuza göre harekete geçme zamanı! Peki aklınızdaki o müthiş çok adımlı formu nasıl gerçeğe dönüştürebilirsiniz?

Elbette eklentimizi alacaksınız!

Biraz önyargılı olabiliriz ama Formidable Forms gerçekten WordPress için en iyi çok adımlı form oluşturucudur. İlerleme çubukları, form düğmeleri ve 30'dan fazla form alanı türü eklemenizi ve özelleştirmenizi sağlar.

Formidable Forms ile konuşma formları, ürün öneri testleri, hesap makineleri ve anketler bile oluşturabilirsiniz. Evet, bunların hepsini tek bir eklentide elde ediyorsunuz!

WordPress form oluşturucunuzu edinmek ve çok adımlı başyapıtlarınızı yaratmaya başlamak için aşağıya tıklayın.

Müthiş Formlar'ı kullanmaya başlayın!

14 günlük para iade garantimizle Formidable Pro'yu risksiz deneyin veya ücretsiz form oluşturucu eklentimizi kullanmaya başlayın.

Daha fazla çevrimiçi form eğlencesi için bizi Facebook, Twitter ve YouTube'da takip edin. Bir sonrakine kadar!

Çok adımlı form tasarımı hakkında daha fazla bilgi edinin

• En İyi 9 Çok Adımlı Form WordPress Eklentisi
  Devamını oku

  WordPress'te Ajax Çok Adımlı Form Nasıl Oluşturulur
  Devamını oku

  İlerleme Çubuklarıyla Çok Adımlı Form Nasıl Oluşturulur
  Devamını oku