Her SaaS ürün ve abonelik web sitesinin mükemmel bir fiyatlandırma tablosuna ihtiyacı vardır. Bilgiyi potansiyel alıcılarla paylaşmanın en kolay yolu ve planlarınızdaki farklılıkları açıklamak.

Ancak, fiyatlandırma tablolarını çalıştıran pek çok web sitesiyle biraz bayat alabilirler.

Bu tasarımlar, yeni trendler, renk şemaları ve kullanıcı etkileşimini teşvik eden temiz bir deneyim ile bulduğum en iyilerden bazıları. Özel bir fiyatlandırma tablosu sayfası tasarlıyorsanız, bu tasarımlar size bazı harika fikirler vereceğinden emin olur.

1. Cezayir

Barındırılan arama SaaS ürünü Algolia temiz fiyatlandırma sayfası malzeme tasarım stili ve renkli ikon tasarımları ile.

Her sütun öne çıkmak ve kontrast oluşturmak için başlıkta farklı bir renk kullanır. Tablolar oldukça basittir, bu nedenle bilgilerin bir bakışta tüketilmesi kolaydır.

Genellikle her sütunun alt kısmındaki kayıt düğmeleri bulunur, ancak Algolia masanın altındaki büyük bir CTA kullanır. Bu onu daha temiz tutar ve birden çok sütun üzerinde düğmelerin çoğaltılması ihtiyacını azaltır.

01-algolia-arama-sav-fiyatlandırma masa

2. Slack

Slack pricing page Slack fiyatlandırma sayfası Ayrıca etiketler için soldaki bir özellik sütunu ile oldukça benzersizdir. Bunu diğer birçok fiyatlandırma tablosunda bulabilirsiniz, ancak her zaman böyle pürüzsüz bir tasarımla olmaz.

Her bir satır, her bir planda hangi özelliklerin kapsadığını göstermek için onay işaretlerini kullanır. Bu satırlar süper geniş ve üstbilgiler, kolay kayma için kontrast oluşturmak için açık gri bir arka plan kullanır.

Kullandıkları yazı tiplerinden bahsetmemek, fantastik görünmek ve gerçekten içeriği kolayca tüketmek.

02-gevşeme-uygulama fiyatlandırma masa

3. Symu

Fiyatlandırma tablosunda grileşmiş özellikler görmedim ama Symu bu işi yapar. Her sütun, her bir planla ne kadar aldığınızı gösteren özellikler listesinin hemen üstüne yerleştirilmiş küçük bir ilerleme çubuğuna sahiptir.

Bu, dikkatinizi daha hızlı çeker ve grileşmiş özellikler de gözünüze çarpar.

Açık gri yazı tipindeki problemim okumak zor. Potansiyel alıcılar, ücretsiz planla neleri kaçırdıklarını bilemeyebilirler. Dolayısıyla, bir listedeki tüm özellikleri açıkça görebilmek için "Ekip" sütununu okumalılar.

Ancak bu özelliklerin daha açık bir fontla görsel olarak kaldırılması kıtlık anlamına gelir Satış ve pazarlama için harika bir araç.

03-symu fiyatlandırma masa-gri renkte metin

4. Dijital Okyanus

Dijital Okyanus VPS hizmetinin kendi dönen fiyat tablosu çünkü çok farklı planlar sunuyorlar.

Yeni ziyaretçilerin çoğu daha ucuz planlarla başlayacak ve bu nedenle bu hakların görüşte kalması mantıklı. Ancak daha fazla güç ve depolama alanıyla daha yüksek fiyatlı planlara göz atmak için listeden tıklayabilir veya hızlıca kaydırabilirsiniz.

Beğendiğim bir diğer özellik, yalnızca seçilen plan için görünen “hesap oluştur” düğmesidir. Bu dikkatinizi bir plana çekiyor, böylece komşularıyla karşılaştırıp sizin için en uygun olanı görebiliyorsunuz.

04-standart damlacıkları fiyatlandırma masa

5. UsabilityHub

Fiyatlandırma tablosu UsabilityHub Her özellik için vurgulu detayları ile şık bir tasarıma sahiptir. Farklı hesaplar farklı testler yapmanıza izin verir, ancak yeni kullanıcılar bu testlerin değerini anlamayabilir.

Her bir özelliğin yanındaki bilgi simgesinin üzerine geldiğinizde, bunun ne anlama geldiği ve neden yararlı olduğu hakkında daha fazla bilgi edineceksiniz. Bazıları sadece A / B testi gibi özellikler, diğerleri ise takım desteği veya özel markalaşma gibi hesap ayarlarıdır.

Daha büyük bir takım sütunu için, plana daha fazla kişi eklediğinizde aylık teklifin otomatik olarak arttığını fark edeceksiniz. Bu, maliyetleri tahmin etmek ve yazılım için hızlı tahminler almak isteyen ekipler için mükemmeldir.

05-kullanılabilirlik-göbek-araçlar-fiyatlandırma

6. Optimal Atölye

Optimal Atölye fiyatlandırma sayfasında çok sayıda marka ve özel grafik kullanır. Bu doğrudan tablonun kendisine eklenmeyebilir, ancak sayfanın ortamına eklenir.

Bu tasarımda beğendiğim ana özellik, yerleşik aylık / yıllık fiyat anahtarıdır. Bunları genellikle fiyatlandırma sayfalarında görürsünüz, ancak genellikle çok küçüktürler. Bu, ziyaretçilere yanlış fiyatlandırma hissi verir, çünkü başlangıç ​​fiyatları, kullanıcının yıllık bir plan istediği varsayılarak daha ucuza getirilebilir.

Bu fiyatlandırma tablosuyla, ayda neler aldığınızı ve aylık ve yıllık maliyetler arasında nasıl bir karşılaştırma yapacağınızı açıkça görebilirsiniz.

06-optimum-atölye-fiyatlandırma

7. Havalı

İşte dikkat çekmek için parlak renkler kullanan başka bir tasarım. Airtable pricing page Havale fiyatlandırma sayfası işleri basit tutar ve dikkatinizi hemen fiyatlara çekmeye çalışır.

Tablonun hemen üzerinde bakarsanız, aynı aylık / yıllık anahtarı görürsünüz. Bir bakışta tamamen gözden kaçacak kadar minik görünüz mü? Bu satış için iyi bir numara ama UX perspektifinden harika değil.

Bu tablonun en iyi kısmı, her satıra eklenen hover efekti. Her bir özellik hakkında, hangi planın tam olarak ihtiyacınız olanı sunduğunu öğrenmek için gezinerek öğrenebilirsiniz.

07-airtable fiyatlandırma masa

8. Yeniden inceleme

Vurgulu bilgileri içeren başka bir tablo tasarımı Arkana bak . Her satırda hover araç ipucunu bulamazsınız, ancak en karmaşık özellik öğelerinde görünür durumdadır.

Sevdiğim bir başka küçük tasarım seçeneği, her bir özellik sütununun bir öncekine nasıl eklendiğidir. “Pro” planının sütunu, standart plandaki her şeyi birkaç ekstra özellik ile birlikte sunduğunu not eder.

Bazen bu, okumaya devam etmeyen ziyaretçileri dağıtabilir çünkü bu metin üzerinde parlak olabilir. Ancak alandan tasarruf etmenizi ve masalarınızı temiz tutmanın harika bir yoludur.

08-fiyatlandırma masa-yeniden inceleme

9. BuzzSumo

Tasarım biraz basit olmasına rağmen, BuzzSumo fiyat tablosu bir çok şeyi doğru yapar. Aylık / yıllık faturalandırma anahtarı net bir görünümdedir ve yıllık faturalandırmaya geçerek ne kadar tasarruf edeceğinizi de görebilirsiniz.

Onların özellikleri listesi biraz kalabalık hissediyor ama okumak için oldukça basit. Her satırda, her özelliğin ne anlama geldiğini açıklayan araç ipuçlarıyla vurgulu bilgi özelliği kullanılır.

Buradaki tek şikayetim sayfanın estetiğidir. Eğer özellikler daha fazla kenarlığa veya belki de zebra şeritlerine sahip daha büyük bir masaya bağlanırsa daha güzel görünür. Ama UX mükemmel ve bir fiyatlandırma sayfasında en önemli olan şey bu.

09-buzzsumo fiyatlandırma masa

10. Litmus

E-posta test Suite Litmus yıllardır olmuştur ve e-posta bültenleri için facto seçimdir. Onların fiyatlandırma sayfası çok detaylı değil ama potansiyel alıcılar için yeterli.

“En popüler” etiketleme eğilimini, özel bir planı geri kalanından öne çıkarak vurgulayarak kullanırlar. Bu, iyi çalışan ve daha ucuz olanlara yönelik orta düzeydeki planlar için daha fazla kaydı teşvik eden bir tasarım seçeneğidir.

Ama her satırda aldığınız alan miktarını gerçekten çok seviyorum. Bu özellikler, sayfada açıklanmıştır ve bazı özellikler daha ayrıntılı olarak iç sayfalara bile sahiptir.

Temiz metin, katı kenarlıklar ve bolca boşluk Bu fiyat tablosu, listemdeki en pragmatik tasarımlardan biridir.

10-turnusol-posta fiyatlandırma masa

11. Şerit

Şerit fiyatlandırma sayfası inanılmaz derecede basit ve buna tam bir fiyatlandırma tablosu bile söylemek zor. Ama çok iyi tasarlanmış, onu buraya eklemek zorunda kaldım.

Herhangi bir fiyat tablosunun amacı, bilgileri potansiyel müşterilerle paylaşmak ve bu insanları ödeme yapan müşterilere dönüştürmektir. Stripe'in tasarımı iki çok net ödeme planı sunar: Doğrudan ödemeler veya daha büyük kurumsal kurulumlar.

Stripe’ye bakan insanlar analiz felci Beş farklı plan arasında seçim yapmaya çalışıyor. Tablo hızlı okunur ve maliyetleri hesaplamanın kolay bir yolunu sunar.

Ancak bu tablo tasarımından hoşlanıyorsanız, benzer bir fiyatlandırma tablosu oluşturabilir ve miksajda bir veya iki plan daha yapabilirsiniz.

11-şerit fiyatlandırma sayfalık