Case Study — GolfHub
Uma proposta para um clube de golfe parou em quatro telas no Figma. Ela virou um produto que se usa: o app do sócio e o ERP do clube, 21 telas navegáveis e um campo de golfe em 3D que se gira com o dedo.
Em 2023 propus ao Clube de Golfe de Brasília dois produtos: um app para o sócio reservar, pagar e acompanhar o próprio jogo, e um ERP para a equipe enxergar o dia do clube. A proposta parou em quatro telas no Figma. E quatro telas não mostram como é reservar um horário, pagar e jogar uma rodada.
Em 2026 transformei a proposta em algo que se usa. Deduzi as telas que faltavam a partir das regras do clube, mantive a identidade original e fiz do mapa estático do buraco uma cena 3D. É o que eu entrego: produto pensado, desenhado e funcionando, em dias.
O que eu fiz
01 — O problema
Eram dois públicos. A gestão precisava acompanhar reservas, sócios e caixa num lugar só. O sócio queria reservar, pagar e ver a evolução do próprio jogo pelo celular.
O Figma tinha a home, o mapa do buraco, a assinatura e o dashboard. Faltava o que convence: ver o fluxo inteiro funcionando, da reserva ao resumo da rodada.
02 — O protótipo
São 17 telas do app, e o que você faz fica salvo. Reserve um horário e ele vira um voucher. Jogue uma rodada e o cartão fecha a conta sozinho. Se preferir, deixe o tour passar pelas telas.
Ir direto para
Use como num celular: reserve um horário, pague com Pix e jogue uma rodada. No buraco, arraste para girar. Os dados são fictícios e ficam só no seu navegador.
03 — Decisão: o escopo
Não inventei funcionalidade. O escopo veio do que a proposta já prometia: a barra de abas, o menu e os 16 módulos do deck. Cada tela nova começou em wireframe, com a regra de negócio resolvida antes da cor. Sócio não paga green fee, convidado paga. A reserva pode ir para a mensalidade, porque o sócio já tem conta no clube. O check-in sai do próprio voucher.
01 — A home
Decisão: Uma ação principal
Primeiro, a hierarquia: quem é o sócio, onde ele joga, quando é a próxima saída e um botão só, Começar rodada.
No acabamento, o cartão do campo mostra quem está jogando agora e abre um voo pelo campo em 3D.
02 — O buraco
Decisão: O dado que o golfista usa
No tee, o golfista quer três coisas: quanto falta até a bandeira, o vento e onde a bola caiu.
É a tela mais aberta durante a rodada, por isso ganhou o 3D. Tudo em metros, com o drive desenhado sobre o fairway.
03 — A assinatura
Decisão: Prevenir o erro
Pagamento é onde um erro custa caro. A estrutura põe o cartão, o plano, a próxima cobrança e os recibos à vista.
O formulário de cartão valida número, validade e CVV enquanto você digita, e cada recibo abre o comprovante.
04 — O dashboard do ERP
Decisão: Número com contexto
Um número sozinho não diz se o dia vai bem. No wireframe, cada indicador já tinha lugar para uma referência ao lado.
No protótipo: reservas contra a previsão, ocupação por turno e receita contra a meta. Os aniversariantes vêm com a ação de mandar parabéns.
04 — Decisão: a identidade
A proposta já tinha uma cara: Inter, grafite, índigo, violeta e o verde do clube. Mantive tudo e completei o que faltava, como estados, contraste e um só conjunto de ícones. Os 16 módulos do deck ganharam endereço no app, no ERP ou nos dois.
As mesmas cores do arquivo, agora como tokens. Grafite para agir, violeta para destacar, índigo para seleção e o verde da bola na aba ativa.
Uma fonte para tudo, com os números da rodada em destaque. O DM Sans fica só no logotipo.
Iconsax Linear em todas as telas. A barra de abas, que só tinha ícones, ganhou rótulos.
Cada módulo do deck agora aponta para onde mora: no app do sócio, no ERP da gestão ou nos dois.
Os 18 buracos saem do mesmo código que monta o 3D. Cada um nasce de poucos dados, como par, distância e traçado.
O arquivo mostrava cada componente de um jeito só. O protótipo tem padrão, selecionado, cheio, inativo e foco visível.
05 — Decisão: onde investir
Se era para concentrar esforço em um lugar, era no buraco. É a tela que acompanha o sócio a rodada inteira e a que mais diferencia o produto de um sistema de reservas comum. O mapa estático virou um campo que se gira, aproxima e mira com o dedo.
O 3D tem custo, e ele foi pensado. Em aparelho sem suporte, volta o mapa plano. Com movimento reduzido ligado, a câmera não voa.
O voo pelo Campo A, o par 3 por cima do lago e a bola caindo no buraco no fim da rodada.
06 — A rodada
Ninguém quer digitar no meio do jogo. A rodada começa com três escolhas: campo, tee de saída e 9 ou 18 buracos. Depois, cada buraco se anota com tacadas, putts e fairway. O cartão usa a notação que o golfista já conhece, e o resumo mostra o que importa: o resultado contra o par, o net e os pontos. Se a rodada for interrompida, ela continua de onde parou.
07 — Reservar e pagar
A grade mostra quanto cada horário já está cheio antes de você escolher. O preço segue a regra do clube: sócio não paga green fee, convidado paga, e o carrinho entra na mesma conta. Dá para pagar com cartão, Pix ou na mensalidade. A reserva vira um voucher com QR e check-in pelo app, e pode ser cancelada sem custo até 24 horas antes.
08 — A vida no clube
Um app de clube que só serve para reservar é aberto uma vez por semana. As abas que o Figma prometia viraram motivos para voltar: o ranking do mês, aulas com o professor, torneios com vagas contadas, a loja com aluguel entregue no tee, os avisos e a carteirinha com o QR da portaria.
09 — Decisão: um sistema só
App e ERP leem os mesmos dados. O Pedro que reserva pelo celular é o sócio nº 0427 na agenda do campo, e os preços, os professores e os campos são os mesmos nos dois lados. Uma proposta que mostra isso funcionando responde à pergunta que todo gestor faz: isso conversa com o resto do clube?
Do ERP, o Figma tinha só o dashboard. A agenda do campo, a ficha do sócio e o financeiro seguem a mesma grade, e a cobrança de quem está em atraso fica a um clique.
10 — Como eu trabalhei
Escrevi o brief, defini as regras de negócio e os componentes, e coloquei agentes de IA para montar as telas em paralelo. Depois revisei uma por uma: o texto, os estados, o contraste e os números que precisam bater entre o app e o ERP.
A IA acelerou a produção. As decisões de produto ficaram comigo, e é isso que permite sair de um arquivo parado para um produto testável em dias, não em meses.
Resultado
Ferramentas
Eu levo do desenho a um produto que dá para usar e testar, com design e código, em dias.