I
Engenharia de produção não é sobre fábrica — é sobre fluxo.
O mesmo vocabulário que descreve uma linha de montagem descreve o ciclo do pedido: tempo de setup, gargalo, retrabalho, refugo. O software só herdou os verbos.
Prancha 00 · Memória de produtoEdição corrente · MMXXVI
Memorial
do Produto.
How a concrete factory earned its own atlas.
Este não é um manual. É o registro editorial de como o sistema foi observado, desenhado e construído — escrito para arquitetos, diretores e quem chega aqui pela primeira vez querendo entender o método antes do produto.
Autor
Carlos Eduardo
Disciplina
Engenharia de Produção
Cliente
Arte Piso · Belém/PA
Estado
Em produção · v1.1
Sumário
Quatorze capítulos, três atos, um autor.
Um mapa para percorrer o memorial na ordem — ou saltar direto ao capítulo que interessa. Cada entrada guarda um artefato do processo.
I
Ato Um
A origem — a fábrica antes do software.
Observation before code.
Capítulo I
Carta do
idealizador
idealizador
A hand-written
opening.
Manuscrito · 2024
“Um orçamento é um processo produtivo. Processo produtivo se modela, se cronometra e se refina — foi isso que fiz aqui.”
Sou engenheiro de produção. Meu ofício é olhar uma operação, entender onde o tempo escapa e redesenhar o fluxo antes de propor qualquer ferramenta. Quando encontrei o ciclo do pedido dessa fábrica de concreto, reconheci ali os mesmos sintomas de uma linha de montagem sem método: retrabalho, refugo, gargalos invisíveis e um cliente esperando resposta.
A plataforma que você tem em mãos é a materialização desse redesenho. Fui, ao mesmo tempo, pesquisador, arquiteto, designer, engenheiro e redator. Cada tela, cada linha de código e cada palavra passou pela minha mão — não por preciosismo, mas porque coerência é o único atalho para um produto que soa inteiro.
Este memorial é o registro público desse trabalho. Não escrevi um posfácio bonito; escrevi a documentação que eu gostaria de ter encontrado ao chegar em qualquer sistema sério.
Carlos Eduardo
Engenheiro de Produção · Idealizador e autor · Brasil
Capítulo IIO problema
Observação · 2024
O pedido sumia entre o flyer impresso e o último áudio de WhatsApp.
Em três visitas à fábrica, observamos a mesma cena: o vendedor abria um catálogo em PDF de 32 páginas, fotografava o item, copiava medidas para o WhatsApp, fazia conta de cabeça e enviava por escrito uma proposta que voltava em dúvida três horas depois.
O cliente — arquiteto, mestre de obras ou dono de casa — recebia a contagem em peças, sem saber quantos metros quadrados cobria, sem ficha técnica, sem protocolo. O orçamento existia, mas era invisível para auditoria, comparação ou impressão.
“A conta eu sei fazer. O problema é provar para o cliente que a conta está certa.”
II
Ato Dois
O método — princípios, processo e decisões.
Every decision, written down.
Capítulo IIIManifesto
Seis princípios. Cada decisão da plataforma pode ser explicada por um deles.
- I
Linguagem de fábrica, não de software
Cada palavra na interface foi escolhida para soar familiar a quem orça e assenta concreto. O sistema não pede ao operador que aprenda informática — ele aprende a operação.
- II
O orçamento é o produto
Tudo converge para uma única peça final: uma proposta limpa, com protocolo, dimensões, fotos e condições comerciais. O resto é caminho para chegar lá.
- III
Persistência sem servidor primeiro
Carrinho, favoritos, comparador e cadastro vivem no dispositivo do cliente. O sistema funciona em obra com sinal instável — sincroniza quando quiser, não quando precisar.
- IV
Mobile-first como verdade, não como opção
A operação acontece em pé, com uma mão segurando o celular. Alvos de toque, barra inferior, safe-areas e tipografia fluida foram desenhadas antes do desktop.
- V
Conformidade técnica visível
Normas brasileiras (NBR 16537, 9781, 6136) não ficam escondidas — aparecem nos cards, na ficha técnica e na imagem do orçamento. É confiança auditável.
- VI
Acabamento autoral em cada superfície
Tipografia editorial, grades técnicas, animações de rolagem narrativas. A plataforma evita a estética genérica de templates — tem ritmo, identidade e voz.
Capítulo IVProcesso
Antes de uma única linha de código, oito fases de método.
A engenharia foi a última etapa, não a primeira. Cada fase abaixo gerou um artefato — anotação, planilha, esboço ou protótipo — antes de virar tela.
Discovery → Delivery
- Fase 01Observação
Três visitas à fábrica acompanhando pedidos, descargas e retornos de obra.
- Fase 02Entrevistas
Conversas com vendedor de balcão, motorista e cliente arquiteto sobre o ciclo do pedido.
- Fase 03Mapeamento
Desenho do fluxo atual em papel: do flyer impresso ao WhatsApp pulverizado.
- Fase 04Modelagem
Estrutura de dados dos 18 produtos, com SKU, rendimento, peso e norma.
- Fase 05Prototipação
Telas estáticas validadas com a equipe comercial antes de qualquer linha de código.
- Fase 06Implementação
Construção em ciclos curtos, com publicação a cada nova capacidade testada em obra.
- Fase 07Validação em campo
Pedidos reais emitidos pelo sistema e conferidos contra a planilha antiga.
- Fase 08Refinamento
Polimento editorial, microcopy, animações de rolagem e geração de imagem do orçamento.
Capítulo VDecisões arquiteturais
Seis decisões registradas. Cada uma com motivo, não apenas com escolha.
Em vez de listar tecnologias, registramos por que cada uma entrou — uma adaptação do formato Architectural Decision Record para leitores não técnicos.
ADR-001
TanStack Start em vez de Next.js
Decisão · Roteador tipado, SSR opcional, deploy em Edge Worker.
Por quê · Páginas com peso baixo, navegação previsível e tipagem fim-a-fim. Sem dependência de plataforma proprietária.
ADR-002
Estado do orçamento no localStorage
Decisão · Carrinho, memória de cálculo e cadastro persistem no dispositivo.
Por quê · A obra não tem sinal. O cliente monta o pedido offline e envia quando reencontra rede — sem perda de trabalho.
ADR-003
Orçamento como imagem PNG
Decisão · Renderização offscreen via html-to-image, com QR code embutido.
Por quê · WhatsApp comprime e desorganiza texto longo. Uma imagem entrega protocolo, itens e contato em um único toque.
ADR-004
Calculadora acoplada ao carrinho
Decisão · Cada item carrega sua memória de cálculo (área, linear, perda, mínimo de 20 peças).
Por quê · Recalcular fora do carrinho gerava divergência. Aqui o número exibido é sempre o número que será cobrado.
ADR-005
Integração ViaCEP no cadastro
Decisão · Busca de endereço por CEP com preenchimento automático e validação de CPF/CNPJ.
Por quê · Orçamento sem endereço completo é orçamento que volta. A fricção do preenchimento foi reduzida a um campo.
ADR-006
Mobile-first com BottomNav nativo
Decisão · Barra inferior fixa com 4 ações, respeitando safe-area-inset e gestos.
Por quê · O ambiente real de uso é o celular em pé, ao lado da pilha de peças. O desktop é consequência, não premissa.
Capítulo VILinha do tempo
Dez versões públicas. Cada uma testada em obra.
v0.1 → v1.1
- v0.1
Esqueleto editorial
Roteamento, paleta e tipografia. Catálogo estático em grade.
- v0.2
Calculadora
Engine de rendimento por m² e linear, com margem de perda configurável.
- v0.3
Carrinho e drawer
Itens persistentes, totais ao vivo, exportação para WhatsApp.
- v0.4
Imagem do orçamento
Card PNG em alta resolução, protocolo AP-XXXXXX e QR code.
- v0.5
Cadastro completo
CEP, CPF/CNPJ, e-mail e medidor de completude do pedido.
- v0.6
Mobile-first nativo
BottomNav, safe-areas, alvos de toque de 44 px e feedback tátil.
- v0.7
Coreografia de scroll
Reveals com variantes, stagger nos grids e parallax sutil.
- v0.8
Identidade Catálogo de Produção
Tipografia mono, grades técnicas, vozes editoriais reescritas.
- v1.0
Publicação em produção
Primeira versão em uso pela equipe comercial, com pedidos reais emitidos.
- v1.1
Memorial autoral publicado
Esta página — o processo, as decisões e a autoria registrados em forma editorial.
Capítulo VIIBastidores
Cinco notas de rodapé que o produto nunca conta sozinho.
01
Nota 01
O primeiro protótipo foi de papel.
Antes de qualquer tela em código, o fluxo do pedido foi rascunhado em folha A3 e conferido com o vendedor de balcão. Só depois virou wireframe.
02
Nota 02
O nome interno do projeto era ‘Prancha’.
A referência veio das pranchas técnicas de engenharia. Sobreviveu no vocabulário da capa e nos rótulos ‘Prancha 01’, ‘Prancha 02’ ao longo do site.
03
Nota 03
A paleta dourada nasceu de um selo NBR.
O primeiro moodboard foi um envelope pardo com selos de conformidade. O ouro 871 C entrou como cor de autoridade — não como enfeite.
04
Nota 04
O protocolo AP-XXXXXX foi decidido em cinco minutos.
Um debate curto entre número sequencial e hash. Ganhou o sequencial curto — mais fácil de ditar por telefone quando o cliente liga cobrando.
05
Nota 05
A calculadora tem mínimo de 20 peças por design.
Não é regra de negócio arbitrária: é o mínimo real que a fábrica embala e transporta sem prejuízo. O software só respeita a operação.
Capítulo VIIIEngenharia
Stack explicada para quem não escreve código.
Cada tecnologia foi escolhida com uma pergunta em mente: o que ela permite que o operador faça mais rápido?
Stack · 2026
- TanStack Start + React 19
- Páginas tipadas, SSR opcional e deploy serverless.
- Tailwind v4 + tokens em OKLCH
- Paleta consistente, sem cores fora do sistema.
- Motion + IntersectionObserver
- Animação de rolagem narrativa, com respeito a prefers-reduced-motion.
- html-to-image + qrcode
- Geração da imagem final do orçamento, dentro do navegador.
- ViaCEP + máscaras de CPF/CNPJ
- Cadastro em segundos, sem digitar endereço completo.
- localStorage versionado
- Persistência do pedido entre sessões, sem servidor obrigatório.
III
Ato Três
A assinatura — autor, valores e continuidade.
Signed by hand.
Capítulo IXO autor
Idealização · Autoria integral
Carlos
Eduardo.
The author's signature.
Engenheiro de Produção
Brasil
Idealizei, desenhei e construí este produto do primeiro esboço à v1.1 — sozinho, por escolha metodológica. Um autor único garante coerência entre observação, decisão e implementação.
Autoria assinada · Vol. 01
Produto & Processo
- Idealização
- Definição da tese: transformar orçamento em ativo editorial.
- Pesquisa e entrevistas
- Vendedor de balcão, motorista e cliente final, em ambiente real.
- Descoberta do problema
- Diagnóstico do ciclo do pedido, do flyer ao áudio de WhatsApp.
- Engenharia de processos
- Modelagem do fluxo em fases, com artefato por etapa.
- Modelagem operacional
- 18 SKUs, rendimentos, perdas, mínimos e normas técnicas.
Arquitetura & Design
- Levantamento de requisitos
- Do desejo comercial à especificação verificável.
- Arquitetura funcional
- Rotas tipadas, camadas offline-first, geração de imagem.
- UX e UI
- Fluxos, telas, alvos de toque e coreografia de rolagem.
- Design system
- Tokens OKLCH, tipografia editorial, gramática visual própria.
- Prototipação
- Iteração em telas antes da primeira linha de código.
Construção & Continuidade
- Desenvolvimento
- Implementação integral em React 19, TanStack Start e Tailwind v4.
- Validação em campo
- Pedidos reais auditados contra a planilha antiga.
- Refinamento contínuo
- Microcopy, motion, acessibilidade e polimento por versão.
- Documentação e memorial
- Este registro editorial, escrito à mão, sem template.
Capítulo XMétricas do projeto
O memorial em números honestos.
0
produtos catalogados
0
capítulos editoriais
0
rotas tipadas
0
ADRs registrados
0
versões publicadas
0
autor responsável
Capítulo XIAprendizados
Quatro lições que ficaram do processo — e que o produto carrega.
II
O menor produto viável era uma proposta imprimível.
Não bastava calcular certo. O cliente precisava fotografar, encaminhar e imprimir sem reformatar. A imagem PNG do orçamento nasceu como consequência direta desse critério.
III
Local venceu servidor porque o problema era latência, não sincronização.
Adiar o servidor foi decisão de engenharia de processos, não preguiça técnica. Três segundos de resposta em obra valiam mais do que qualquer painel administrativo.
IV
Documentar em público é parte do produto.
Este memorial não é posfácio. É o artefato que sustenta a autoria, orienta a próxima versão e serve de convite para quem chega ao projeto pela primeira vez.
Capítulo XIIValores
Cinco palavras
esculpidas na pedra.
Non-negotiable, by design.
- Ofício
- Fazer bem-feito o suficiente para ser assinado.
- Verdade
- Se a fábrica não faz, o sistema não vende.
- Cadência
- Publicar cedo, refinar sempre, quebrar raramente.
- Herança
- Deixar o código legível para quem chegar depois.
- Serviço
- O operador vem antes da elegância técnica.
Capítulo XIIICréditos autorais
Todas as disciplinas, uma única assinatura.
Este projeto é integralmente autoral. A tabela ao lado credita, por disciplina, quem respondeu por cada frente — do primeiro esboço à publicação deste memorial.
Colofão · Vol. 01
DisciplinaResponsável
- Idealização e direção de produto
- Carlos Eduardo
- Pesquisa, entrevistas e descoberta
- Carlos Eduardo
- Engenharia de processos e modelagem
- Carlos Eduardo
- Arquitetura funcional e engenharia de software
- Carlos Eduardo
- UX, UI e design system
- Carlos Eduardo
- UX writing e voz editorial
- Carlos Eduardo
- Validação em campo e refinamentos
- Carlos Eduardo
- Documentação e memorial autoral
- Carlos Eduardo
Cliente real · Arte Piso · Belém/PA · reapresentado como peça de portfólio,
com dados de contato do proprietário removidos.
Agradecimentos
À equipe da Arte Piso, pela paciência durante as rodadas de observação na linha de produção e pelo acesso ao histórico de pedidos. Aos primeiros clientes que aceitaram emitir orçamentos pelo sistema enquanto a planilha antiga ainda existia como rede de segurança.
Referências de método
ABNT NBR 16537, 9781 e 6136 para o catálogo. Inclusive Components de Heydon Pickering para acessibilidade. Refactoring UI de Adam Wathan para hierarquia tipográfica. Cadernos de campo originais para tudo o mais.
Capítulo XIVRoadmap
O que vem depois do volume 01.
O memorial fecha o ciclo de fundação. As próximas versões saem da fundação para a operação contínua — sempre publicadas com nota de versão.
Próximos volumes
- v1.2
Histórico do cliente
Recuperar orçamentos anteriores pelo número de WhatsApp, sem login.
- v1.3
Painel da fábrica
Recepção dos pedidos no balcão com confirmação, separação e baixa de estoque.
- v1.4
Calculadora por planta
Importar PDF de planta baixa e medir áreas diretamente sobre o desenho.
- v1.5
Catálogo internacional
Versão em inglês e espanhol para construtoras com obras na fronteira norte.
Fim do Volume 01.
Concebido, escrito e assinado por Carlos Eduardo.
Edição
01
Versão
1.1
Idioma
PT-BR
Autor
Carlos Eduardo
Formação
Eng. de Produção
País
Brasil
Cliente real
Arte Piso · Belém/PA
Licença
Uso demonstrativo