11 modelos de tabela de preços que realmente vendem
Todo site de produtos e assinaturas de SaaS precisa de uma ótima tabela de preços. É a maneira mais fácil de compartilhar informações com possíveis compradores e explicar as diferenças em seus planos.
Mas com tantos sites executando tabelas de preços, eles podem ficar um pouco obsoletos.
Esses designs são alguns dos melhores que eu encontrei com novas tendências, esquemas de cores e uma experiência limpa que estimula a interação do usuário. Se você estiver criando uma página de tabela de preços personalizada, esses designs certamente proporcionarão algumas ideias interessantes.
1. Algólia
A busca hospedada produto SaaS Algolia tem uma limpeza página de preços com um estilo de design de material e desenhos de ícones coloridos.
Cada coluna usa uma cor diferente no cabeçalho para se destacar e criar contraste. As tabelas são bem simples, de modo que a informação é fácil de consumir num piscar de olhos.
Normalmente, você encontra botões de inscrição na parte inferior de cada coluna, mas a Algolia usa um grande CTA abaixo da tabela. Isso mantém a limpeza e reduz a necessidade de duplicar botões em várias colunas.
2. Folga
o Página de preços de folga também é bastante original com uma coluna de recurso à esquerda para rótulos. Você pode encontrar isso em muitas outras tabelas de preços, mas nem sempre com um design tão suave.
Cada linha usa marcas de seleção para mostrar quais recursos são cobertos em cada plano. Essas linhas são super espaçosas e os encabeçamentos ainda usam um fundo cinza claro para criar contraste para facilitar o skimming.
Sem mencionar que as fontes que estão usando parecem fantásticas e realmente facilitam o consumo do conteúdo.
3. Symu
Eu nunca vi recursos acinzentados em uma tabela de preços, mas Symu faz este trabalho. Cada coluna tem uma pequena barra de progresso colocada logo acima da lista de recursos, mostrando quanto você ganha com cada plano.
Isso agarra sua atenção rapidamente e as características acinzentadas também chamam sua atenção.
Meu problema com a fonte cinza claro é que é difícil de ler. Compradores em potencial podem não saber o que estão perdendo com o plano gratuito, então precisam ler a coluna "Equipe" para ver claramente todos os recursos em uma lista.
Mas a remoção visual desses recursos com uma fonte mais clara implica escassez , uma ótima ferramenta para vendas e marketing.
4. Oceano Digital
O serviço VPS Digital Ocean tem seus próprios tabela de preços rotativa porque eles oferecem tantos planos diferentes.
A maioria dos visitantes novos começará com planos mais baratos, por isso, faz sentido manter isso em mente. Mas você pode clicar ou deslizar pela lista para navegar em planos mais caros com mais energia e espaço de armazenamento.
Outro recurso que eu gosto é o botão "criar conta", que aparece apenas para o plano selecionado. Isso chama a atenção para esse plano, para que você possa compará-lo com seus vizinhos e ver o que funciona melhor para você.
5. UsabilityHub
A tabela de preços em UsabilityHub tem um design bacana com detalhes de foco para cada recurso. Contas diferentes permitem que você execute testes diferentes, mas usuários mais novos podem não entender o valor desses testes.
Se você passar o ícone de informações ao lado de cada recurso, obterá mais informações sobre o que isso significa e por que é útil. Alguns são apenas recursos como testes A / B, enquanto outros são configurações de conta, como suporte de equipe ou marca personalizada.
Para a coluna de equipe maior, você também notará que a cotação mensal aumenta automaticamente quando você adiciona mais pessoas ao plano. Isso é ótimo para equipes que desejam estimar custos e obter estimativas rápidas de software.
6. Oficina Ideal
Workshop ótimo usa muitos branding e gráficos personalizados em sua página de preços. Isso não pode adicionar diretamente à tabela em si, mas adiciona ao ambiente da página.
A principal característica que eu gosto neste design é a mudança de preço mensal / anual incorporada. Muitas vezes você verá essas informações nas páginas de preços, mas elas geralmente são muito pequenas. Isso dá aos visitantes uma falsa impressão de preços, porque os preços iniciais podem ser mais baratos, desde que o usuário queira um plano anual.
Com essa tabela de preços, você pode ver claramente o que recebe mensalmente e como comparar os custos mensais e anuais.
7. Airtable
Aqui está outro projeto que usa cores brilhantes para chamar a atenção. o Página de preços mantém as coisas simples e tenta chamar sua atenção para os preços imediatamente.
Se você olhar logo acima da mesa, verá o mesmo seletor mensal / anual. Veja como é minúsculo o suficiente para perder completamente de relance? Esse é um bom truque para as vendas, mas não é muito bom do ponto de vista do UX.
A melhor parte desta tabela é o efeito de foco adicionado em cada linha. Você pode aprender sobre cada recurso apenas pairando para descobrir qual plano oferece exatamente o que você precisa.
8. Lookback
Outro design de tabela com as informações de foco é Olhe para trás . Você não encontrará a hover tooltip em todas as linhas, mas estará visível nos itens de recursos mais complexos.
Outra pequena escolha de design que eu gosto é como cada coluna de recursos adiciona ao anterior. A coluna do plano "Pro" indica que ela oferece tudo no plano padrão, além de alguns recursos extras.
Às vezes isso pode jogar fora os visitantes que não estão lendo de perto, porque eles podem encobrir esse texto. Mas é uma ótima maneira de economizar espaço e manter suas mesas limpas.
9. BuzzSumo
Embora o design seja um tanto básico, eu tenho que dizer Tabela de preços do BuzzSumo faz um monte de coisas certas. A opção de faturamento mensal / anual está em exibição clara e você pode até ver exatamente o quanto você economizará alternando para o faturamento anual.
Sua lista de recursos parece um pouco cheia, mas é bastante simples de ler. E cada linha usa o recurso de informações instantâneas com dicas explicando o que cada recurso significa.
Minha única reclamação aqui é a estética da página. Seria mais interessante se os recursos se conectassem mais a uma tabela maior com mais bordas ou talvez com listras de zebra. Mas a experiência do usuário é excelente e é isso que mais importa em uma página de preços.
10. Litmus
A suíte de testes de e-mail Litmus existe há anos e é a escolha de fato para boletins informativos por e-mail. Deles página de preços não é muito detalhado, mas oferece apenas o suficiente para compradores em potencial.
Eles usam a tendência de rotulagem de "mais popular", destacando um plano específico para se destacar do resto. É uma opção de design que funciona bem e incentiva mais inscrições para planos intermediários em relação aos mais baratos.
Mas eu realmente gosto da quantidade de espaço que você consegue com cada linha. Os recursos são explicados diretamente na página e alguns recursos ainda têm páginas internas com mais detalhes.
Com texto limpo, bordas sólidas e muito espaço em branco Essa tabela de preços é um dos designs mais pragmáticos da minha lista.
11. Stripe
Página de preços da listra é incrivelmente simples e é difícil até mesmo chamar isso de uma tabela de preços completa. Mas é tão bem projetado que eu só tive que incluí-lo aqui.
O objetivo de qualquer tabela de preços é compartilhar informações com clientes em potencial e converter essas pessoas em clientes pagantes. O design da Stripe oferece dois planos de pagamento muito claros: pagamentos diretos ou configurações corporativas maiores.
As pessoas que olham para o Stripe não vão cair paralisia de análise tentando escolher entre cinco planos diferentes. A tabela é rápida de ler e oferece uma maneira fácil de calcular os custos.
Mas se você gostar deste design de tabela, poderá criar uma tabela de preços semelhante e lançar mais um ou dois planos no mix.
