Menos burocracia de documentos digitais com UX + CODE

Deyvid Nascimento
Jul 15, 2018 · 4 min read

"Resolveram o problema de gasto de papéis mas burocratizaram o Digital, como resolver?" (cliente)

Ano passado (2017) recebi um projeto para reestruturar um sistema de assinaturas de contratos de uma empresa de móveis planejados, o principais problemas que a loja encontrava era:

  • Enviar várias vezes o mesmo contrato para o cliente assinar em várias etapas do projeto.
  • Encontrar o cliente para realizar a assinatura, geralmente os mesmos estava em outros países durante o processo.
  • Por ser um processo vários setores dentro da empresa precisariam ter ciência do andamento do contrato, ou seja, por ser um trabalho manual existia problema do contrato se "perder" durante essas assinaturas.
  • Eles tinham um sistema de assinatura de documentos digitais porém esse sistema era lento devido tamanho dos arquivos e fotos anexadas a esse documento.
  • Sistema deles viviam fora ar, devido uso intenso, servidor deles não estava suportando as requisições.
  • Todo trâmite do contrato era manual, ou seja, dependia do usuário assinar e "saber" qual seria o próximo setor para assinar.

Solução em programação

Desenvolvemos a ferramenta utilizando o um framework php para o front end, devido sua alta produtividade, em menos 20 dias já tínhamos uma versão beta em funcionamento.

Sistema não pode ficar fora do ar NUNCA!

Segurança dos documentos

Automatização de ações repetitivas dentro da empresa

Validade Jurídica

Solução em design/usabilidade

Por se tratar de uma loja de móveis planejados, o maior público como podemos observar são pessoas com mais de 40 anos.

Personas

Maria — Usuário administrativo que envia o contrato para assinatura
32 anos, casada, 1 filho, consultora de vendas, atual no show room da empresa, enviando novas coleções para futuros clientes, e somente quando fecha a venda acessa a plataforma para envio do contrato para o cliente assinar.

As duas Regras de ouro

1 — Nenhuma ação com mais de 3 cliques de distância, exemplo:

  • Assinar contrato: Login > Tela Visualização de contratos pendentes > Assinatura do contrato
  • Verificação de fotos do projeto: Login > Visualização de contratos pendentes > Visualização dos anexos
  • Envio do contrato para assinatura: Login > Upload > Envio do contrato

2 — Antes de criar sempre leia identidade visual da aplicação

  • cor primária em todos “Call-to-action”
  • Banco de ícones padronizados para cada ação (SVG Sempre)
  • Única fonte no projeto inteiro com 12px
  • Fundos Branco, Cinza para não tirar o foco que é ler e assinar o documento
  • Grid 12 colunas
  • etc…

Resultado final

Sistema fez tanto sucesso que virou uma plataforma aberta para compra, pois observamos que o padrão que desenhamos pode atender qualquer prestador de serviço, foi batizada de Assina Fácil e está disponível na URL: https://assinafacil.com.br/

deyvin

creative software engineer

Deyvid Nascimento

Written by

Software Engineer

deyvin

deyvin

creative software engineer

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade