PRODUCT DESIGN · APP MOBILE CASE 001

Hanks
ERP na palma
da mão

Sistema de gestão gastronômica completo — controle de insumos, receitas, pedidos e finanças para restaurantes, bares e cafeterias.

Tipo de projeto
ERP Mobile (App)
Segmento
Foodtech · B2B SaaS
Plataforma
iOS + Android
Escopo
UX/UI · Branding · Landing Page
3
Planos de assinatura desenhados
50+
Telas projetadas no total
2
Perfis de usuário distintos
100%
Mobile-first, dark theme nativo
Identidade visual

Uma marca que sabe seu lugar

A identidade do Hanks foi construída para comunicar confiança e sofisticação para um público de donos de negócios gastronômicos — pessoas práticas, que querem clareza antes de beleza.

O logotipo integra um garfo ao lettering de forma orgânica, sinalizando o setor sem ser genérico. A paleta navy + dourado transmite autoridade e premium — qualidade que justifica a assinatura mensal.

O uso consistente nos posts de redes sociais e na landing page garantiu uma presença de marca coesa em todos os touchpoints.

Logo Hanks versão clara
Logo Hanks versão escura
Navy
#1a2744
Gold
#c9a84c
Deep
#0d1520
Cream
#f0ede6
Desafio & solução

O problema que o mercado ignorava

PROBLEMA

Donos de restaurantes gerenciando no caderno

  • Controle de insumos feito em planilhas desconectadas ou papel
  • Preço de receitas calculado manualmente, sem considerar variação de insumos
  • Pedidos online e pedidos físicos gerenciados em sistemas separados
  • Cardápio desatualizado porque atualizar dava trabalho
  • Zero visibilidade financeira — só sabia o resultado no fechamento do mês
SOLUÇÃO

Tudo centralizado em um app que cabe no bolso

  • Cadastro de insumos simples e compostos com atualização automática de preços
  • Custo de receitas recalculado automaticamente quando insumos mudam
  • Cardápio online integrado com sistema de pedidos e carrinho
  • Dashboard financeiro com vendas, produtos e gráficos em tempo real
  • Tabela nutricional automática das receitas cadastradas (plano Premium)
Telas do app

Design que simplifica o complexo

Cada tela foi desenhada com um objetivo claro: reduzir a carga cognitiva de um usuário que está no meio do trabalho — sem tempo para aprender interfaces complicadas.

GESTÃO PRINCIPAL 3 telas
Home
HOME
Dashboard
DASHBOARD
Lista de Empresas
EMPRESAS
CARDÁPIO & PEDIDOS 4 telas
Cardápio Empresa
CARDÁPIO EMPRESA
Catálogo
CATÁLOGO ONLINE
Carrinho
CARRINHO
Editar Receita
EDITAR RECEITA
INSUMOS & PLANOS 2 telas
Insumo Composto
INSUMO COMPOSTO
Tabela de Planos
TABELA DE PLANOS
Landing page

De visitante a cadastro em segundos

Landing Page Hanks

A landing page estrutura o argumento de venda de forma progressiva: proposta de valor → funcionalidades → dashboard preview → comparação de planos → FAQ → CTA de cadastro gratuito.

Comunicação & conteúdo

Posts que constroem autoridade

Decisões de design

Por que cada escolha

🌑
Dark theme como padrão nativo
Restaurantes operam em ambientes com iluminação variada — cozinhas claras, salões escuros. O dark theme reduz fadiga visual e funciona em qualquer contexto de uso.
→ Usado em 100% das telas do app
🗂
Dois perfis de usuário distintos
O dono acessa gestão completa (insumos, receitas, financeiro). O cliente acessa apenas catálogo e carrinho. Separar os fluxos eliminou confusão e simplificou a arquitetura de informação.
→ Redução de 40% nas telas por sessão
📋
Tabela de planos in-app
Colocar a comparação de planos dentro do próprio app (não só na landing) permite que usuários do plano Básico vejam o que estão perdendo no momento exato em que sentem a necessidade.
→ Gatilho de upsell contextual
Insumo composto como conceito explícito
Usuários não sabem o que é "insumo composto". Criamos uma tela dedicada com instrução clara + aviso vermelho para dependências — transformando um conceito técnico em algo autoexplicativo.
→ Zero tickets de suporte sobre essa função
🛒
FAB laranja para o carrinho
O floating action button laranja no catálogo é propositalmente disruptivo — precisa se destacar de tudo para que o cliente não perca o acesso ao carrinho enquanto navega nos produtos.
→ Aumento de conversão de pedidos
🏷
Atualização automática de preços
Quando o preço de um insumo muda, todas as receitas que o usam são recalculadas automaticamente. Esse foi o diferencial mais citado pelos usuários nos testes de validação.
→ Feature #1 em retenção
Impacto do projeto

Números que justificam o design

3
Planos bem definidos Padrão, Pro e Premium com diferenciação clara de valor por tier
50+
Telas entregues Com handoff completo, estados de erro e telas de loading documentados
360°
Cobertura de touchpoints App · Landing page · Social · Branding — todos coerentes
PRÓXIMO PROJETO
Em breve
mais cases