Introdução

Nosso cliente, especialista em previdência privada, chegou com o desafio de transformarmos duas planilhas que ele desenvolveu nos últimos anos para uma plataforma mais amigável. Que chamamos de calculadoras. O objetivo foi entregar uma interface amigável para que os usuários consigam inserir os dados e visualizar os diagnósticos de forma clara.

O Qual teu plano surge como uma ferramenta de educação sobre previdência privada. Ela ajuda pessoas a tomarem a melhor decisão na hora de fazer a sua previdência privada. Faz isso através de conteúdos gratuitos disponibilizados através do blog e exclusivos para usuários que pagam uma anuidade. A exclusividade dá acesso a vídeos, apostilas e claro, assim como às calculadoras.

Flexibilidade e Autonomia

WordPress sendo uma ferramenta interativa, permite uma gama de edições aos sites sem necessitar de desenvolvedor, seguindo essa linha, nós damos total flexibilidade de edição para nossos clientes, eles tem acesso completo ao seu site. Também damos uma mãozinha, entregando junto ao projeto, um manual para guiar o cliente no seu aprendizado pelo mundo do WordPress.

Calculadoras

Primeiros Passos

Para esclarecer como o site iria funcionar, o time discutiu sobre os wireframes desenhados no flipchart e tecnologias que poderiam ser utilizadas. E a partir disso, conseguimos ter uma base sólida do que o “Qual teu plano” necessitaria para deixar de ser somente uma ideia.

Como cada projeto é único e possui níveis de dificuldade diferentes, haveria sim uma complexidade em desenvolver a melhor forma de transformar planilhas do excel em calculadoras fáceis de utilizar, mas após estudarmos e mergulharmos neste projeto conseguimos chegar em uma solução.

Design

Design

Resolvemos dividir as calculadoras por etapas, onde o usuário a preencheria com suas informações, e então o seu resultado seria calculado.

Por serem cálculos complexos que resultam em vários resultados, esse método de etapas foi o mais aceito, pela facilidade de navegar por entre as telas de preenchimento de dados e as de resultado.

A diferenciação de cor nas abas selecionados vem também para auxiliar ainda mais o usuário na sua jornada pelas calculadoras.

Ferramentas que utilizamos

 Sketch

Sketch é uma ferramenta de web design, que permite a criação de layouts de sites com fluidez, tendo também uma gama de plugins que permitem agilidade e facilidade na hora de transformar ideias em páginas com vida.

 Anima App

Anima é um plugin para o Sketch desenvolvido para exportar layouts para a web. Esse plugin permite a prototipação, possibilitando a criação de  interações reais em tela, transformando uma imagem estática em um site fluído.

 Zeplin

Zeplin é uma ferramenta que permite a interação de designer e desenvolvedor. Ele transforma certos aspectos, como número de cor, tamanhos e espaçamentos, para linhas de código, permitindo agilidade no trabalho dos desenvolvedores.

Desenvolvimento

Tecnologia da Área Restrita

Para que fosse possível monetizar as calculadoras, nosso cliente nos trouxe a ideia de criarmos uma área restrita com conteúdos exclusivos com recorrência anual.

 

Para tornar isso possível foi utilizado a composição de dois plugins WordPress. O WooCommerce e o WooCommerce Subscriptions. A união deles faz com que seja possível ter um fluxo automatizado de venda de assinaturas.

 

Uma vez que o usuário vira assinante, ele obtém o acesso à todo conteúdo exclusivo por um ano. Podendo renovar ao final do período.

 

Outra funcionalidade interessante do projeto é o programa de parcerias feito para alavancar vendas da plataforma. Foi criada uma automação de cadastro de contadores onde após validado esse cadastro, automaticamente o contador recebe um cupom de desconto para usar com seus clientes.

Tecnologia das Calculadoras

O grande desafio desse projeto foi conseguir transformar as planilhas em interfaces amigáveis. Para que isso fosse possível foram utilizadas técnicas de design responsivo que nos permitiu a chegar num resultado incrível. 

 

Conseguimos criar apenas uma versão da calculadora que se adapta a qualquer tamanho de tela. Inclusive para o formato de impressão do diagnóstico. Isso faz com que conseguimos ter uma maior agilidade no desenvolvimento e manutenção do seu código.

 

As calculadoras estão integrada com o painel administrativo do WordPress. Isso permite com que o administrador possa atualizar valores que possam variar ao longo do tempo sem que seja necessário escrever uma linha de código.

Explore mais projetos

4all

4all veio para nós com uma ideia de algo que mostrasse de forma simples e objetiva o seu papel como empresa, nosso desafio foi transformar essa ideia em um site minimalista e moderno.