Ficha Técnica
Papel
Criador e desenvolvedor
Stack
Toda planning tem aquele momento: "quantos pontos vale essa task?" — e a resposta muda dependendo de quem fala primeiro. O Poker Planning resolve o viés de ancoragem do jeito clássico: todo mundo vota em segredo, as cartas viram ao mesmo tempo. Sem cadastro, sem instalação: cria a sala, manda o link, o time vota.
Como funciona
- Crie uma sala com nome personalizado — o link é compartilhável na hora (com Web Share API e copiar-link).
- Cada participante entra com um nome (identidade leve via
localStorage, sem login). - Todos votam no deck Fibonacci (1 a 89, mais
?e☕pro cafezinho) — cada um vê a própria carta, as dos outros ficam viradas. - Flip! Contagem regressiva de 3 segundos animada e as cartas viram juntas.
- Resultado: histograma da distribuição de votos + média dos valores numéricos. Um clique reinicia a rodada.
Com i18n en/pt e layout de mesa que distribui os participantes ao redor (topo/laterais/baixo) conforme o tamanho do time.
Arquitetura
O desafio técnico central: Next.js App Router não expõe servidor WebSocket. A solução foi inverter o controle — um servidor Node próprio que hospeda o Next e o Socket.io no mesmo processo HTTP.
Visão de componentes:
Fluxo de uma rodada:
Decisões técnicas que valem a pena contar
Servidor autoritativo, estado efêmero. Cada sala vive num objeto em memória no servidor — participantes, votos, estado de reveal. Todo evento devolve a sala inteira via broadcast (session_update), então qualquer cliente re-sincroniza com uma única mensagem. Salas de planning são efêmeras por natureza: persistência aqui seria complexidade sem benefício.
Saída no meio do reveal. Se alguém cai da sala com as cartas abertas, remover na hora apagaria um voto que o time está discutindo. A solução: com a sala revelada, quem desconecta vai pra uma lista de remoção pendente e só sai de verdade na próxima rodada — o histograma nunca muda embaixo do time.
Reveal coreografado. O flip envolve três tempos: o clique marca a sala como revelada no servidor, o broadcast dispara a contagem regressiva de 3s em cada cliente, e só então o resultado aparece. O drama do "3... 2... 1..." é feature, não firula — é o que faz todo mundo olhar pra tela ao mesmo tempo.
Stack
Next.js 15 (App Router) + React 19 · Express + Socket.io 4 no mesmo processo · TypeScript · Tailwind · framer-motion · i18next (en/pt).
Status
No ar em poker.racoelho.com.br e em uso em plannings reais. No radar: papel de moderador (hoje qualquer um pode virar as cartas), deck configurável e o termômetro de consenso que já existe no código esperando a vez dele.
Curtiu o projeto?
Se quiser conversar sobre esse projeto, arquitetura ou uma oportunidade de trabalho, é só me chamar. 🚀
contato@racoelho.com.br