Nails by Ivyy · Agendamento online e gestão Agendamento em cada detalhe.
Site, agendamento e painel de gestão de um estúdio de unhas em Curitiba, com Google Agenda, lembretes por WhatsApp e um site novo que a dona edita sozinha.
Onde eu entro
Um produto inteiro, de uma ponta à outra.
- 1
Site e agendamento
Para quem agenda
- O site novo, o catálogo e a página de cada serviço.
- Carrinho, cupons e o calendário com os horários livres.
- Entrada por código, conta da cliente e acompanhamento do pedido.
- 2
Painel da dona
Para quem atende
- Agenda, pedidos, bloqueios e horários da semana.
- Serviços, adicionais, promoções e depoimentos.
- Páginas do site, métricas de faturamento e configurações.
- 3
Motor e integrações
O que ninguém vê
- Disponibilidade, preços e o ciclo de vida do pedido.
- Google Agenda, Instagram, WhatsApp, SMS e tempo real.
- Filas, testes, imagem Docker e publicação.
- Ano
- 2026
- Papel
- Produto completo, sozinho: modelagem, back-end, painel, integrações, o site novo, testes e infraestrutura.
- Stack
- Laravel 13
- Filament 5
- Inertia
- React 19
- TypeScript
- Tailwind 4
- MySQL
- Google Calendar API
- Ably
- Docker
O problema
Os horários eram combinados por mensagem, um por um. Isso gerava conflito com os compromissos pessoais da agenda da dona, clientes que esqueciam o horário e trabalho manual para divulgar serviços, preços e promoções. O estúdio precisava de um lugar onde a cliente visse só o que está livre de verdade e a dona decidisse tudo sem depender de ninguém.
Destaques
- +80 agendamentos registrados no sistema entre abril e setembro de 2026
- +70 pedidos aceitos pela dona no painel, sem troca de mensagens
- +30 atendimentos concluídos e registrados, com o histórico de cada cliente
- Desde abril em uso real pelo estúdio, com o site novo no ar desde setembro de 2026
O que foi construído
Motor de disponibilidade
Cruza atendimentos, bloqueios de agenda e eventos do Google Agenda em uma grade de 15 minutos, calcula a duração pelos serviços e adicionais escolhidos e confere o horário de novo no momento do pedido.
Google Agenda nos dois sentidos
Integração OAuth escrita sem SDK: atendimentos vão para a agenda com a cor do status, horários ocupados voltam a cada 15 minutos e conexões perdidas são detectadas de hora em hora.
Catálogo com adicionais e promoções
Serviços com adicionais obrigatórios ou opcionais, de valor fixo ou percentual, cupons e descontos automáticos com regras de valor mínimo, período, histórico de compras e limite de uso.
Entrada sem senha
A cliente se identifica pelo e-mail ou celular e recebe um código de acesso de seis dígitos, com validade, limite de tentativas e a mesma resposta exista ou não a conta.
Pedido que a dona aprova
O agendamento chega como solicitação, a dona aceita, confirma e conclui pelo painel, e cada mudança aparece em tempo real para a cliente, inclusive no link público de acompanhamento.
Lembretes em quatro canais
E-mail, WhatsApp, SMS e notificação no site, com lembrete na véspera, envio em fila sem duplicidade e descadastro por canal.
Painel da dona
Agenda com arrastar e redimensionar, bloqueios recorrentes, horários ocupados do Google que podem ser ignorados, cores por status, motivos de cancelamento e métricas de faturamento.
Site novo, editável pela dona
Site público refeito em React com uma identidade renovada, montado por um construtor de páginas com 19 tipos de seção e pré-visualização ao vivo, em português e espanhol.
O agendamento
Um horário em quatro passos.
Do catálogo ao pedido, tudo acontece no site, sem troca de mensagens e sem criar senha.
- 1
Escolha os serviços
Catálogo com filtro por categoria e busca, com a duração e o valor de cada serviço.
- 2
Revise o pedido
O carrinho soma valor e duração, aplica o cupom e os descontos automáticos.
- 3
Escolha data e horário
O calendário mostra só os dias e horários livres para a duração total escolhida.
- 4
Entre com um código
E-mail ou celular e um código de acesso na hora. O pedido segue para a dona confirmar.
Por dentro da agenda
Um horário só aparece se estiver livre de verdade.
Toda pergunta sobre disponibilidade passa por um único serviço. O site da cliente, o carrinho e o painel da dona recebem a mesma resposta, calculada sobre uma grade de 15 minutos e uma janela de 45 dias.
- Três fontes, uma resposta
- Atendimentos, bloqueios da dona e eventos do Google Agenda entram no mesmo registro de horários ocupados. Até uma solicitação ainda não aprovada segura o horário que pediu.
- Bloqueios que se repetem
- Folgas e compromissos podem se repetir por dia, semana ou mês, a cada N intervalos, com data de fim e ocorrências puladas uma a uma.
- Google sem ingenuidade
- O marcador de “livre” do Google não é levado ao pé da letra: eventos cancelados, convites recusados, aniversários e feriados ficam de fora, e a dona pode ignorar um evento sem apagá-lo.
- Fuso horário no lugar certo
- Os horários do Google são convertidos para o fuso do estúdio, e o site lê o fuso do navegador para mostrar cada horário a quem está do outro lado.
- Rápido e discreto
- Cada fonte é consultada uma vez para o período inteiro, em vez de uma vez por dia. E só a dona sabe por que um horário está ocupado: a cliente vê apenas que ele não está disponível.
Integrações
O que acontece fora do site.
- Google Agenda
- Cada atendimento é enviado depois que o banco confirma a mudança, com o estado de cada evento guardado e a cor do status traduzida para a paleta do Google. Falhas voltam para a fila quando a conexão é refeita.
- Notificações
- Quatro canais atrás de uma única interface. Cada envio tem uma impressão digital, o que impede a mesma mensagem de sair duas vezes, e guarda o resultado e o identificador do provedor.
- Todo dia as publicações são buscadas, as imagens convertidas para WebP e guardadas no armazenamento do site. A dona escolhe no painel quais aparecem, e o que saiu do Instagram sai do site.
- Tempo real
- Pedidos novos, aprovações e notificações chegam ao painel e à conta da cliente pelo Ably, com tokens limitados aos canais de cada um. Se o serviço falhar, o pedido segue normalmente.
O site novo
Identidade renovada, editada pela dona.
Em setembro de 2026 o site público foi refeito do zero em React sobre o mesmo back-end, com uma identidade nova que parte da anterior: fundo marfim, preto, rosé só onde o olho deve ir e títulos pesados com o destaque em itálico. O site antigo segue disponível em outro endereço, pronto para voltar se for preciso.
Paleta
- Marfim
#faf6f2 - Blush
#fbe8ef - Noir
#151213 - Rosé
#e83e8c - Rosé profundo
#b52f6c
Tipografia
Instrument Sans em cada detalhe.
Seções do construtor
- Hero
- Introdução
- Destaque
- Serviços
- Em destaque
- Diferenciais
- Passos
- Resultados
- Galeria
- Depoimentos
- Sobre
- História
- Visita
- Perguntas
- Artigos
- Faixa rolante
- Chamada
- Texto
- Construtor de páginas
- Sete modelos de página com a ordem das seções já pensada. A dona liga e desliga seções, troca textos e fotos e vê o resultado ao vivo, ao lado do formulário, antes de salvar.
- Dois idiomas de verdade
- Português e espanhol com prefixo próprio e as palavras do endereço traduzidas. Um endereço no idioma errado é redirecionado, e os links do site antigo levam para o lugar certo.
- SEO desde o servidor
- Título, descrição, imagem de compartilhamento, canonical e hreflang saem prontos do servidor, sem depender do JavaScript, com dados estruturados de serviço, oferta e perguntas frequentes e um sitemap por idioma.
- Acessibilidade e privacidade
- Painel com três tamanhos de texto, alto contraste, menos animação e links destacados, aplicado antes da primeira pintura. Consentimento de cookies com versão e páginas de erro com a cara do site.
Arquitetura e qualidade
Domínio em camadas
Agenda, carrinho, pedidos, promoções, notificações e métricas vivem em módulos de domínio, com DTOs e repositórios. O painel e o site são camadas finas por cima.
Pedido transacional
O pedido confere os serviços e o horário de novo e cria o atendimento, os itens e o uso das promoções em uma única transação.
Filas
Sincronização com o Google, lembretes e envios rodam em fila, com novas tentativas e disparo só depois que o banco confirma a mudança.
Testes
149 testes cobrindo a sincronização de horários ocupados, a conexão com o Google, os bloqueios recorrentes, as métricas e as páginas do site.
Uma imagem, três processos
Imagem Docker única com FrankenPHP rodando como web, fila e monitoramento, segredos injetados na inicialização e arquivos em armazenamento compatível com S3.
Olho na produção
Pulse, rastreamento de erros, visualizador de logs e monitor de filas dentro do próprio painel, e comandos para inspecionar os eventos do Google.
Linha do tempo
Abril 2026
O primeiro site no ar
Em nove dias: catálogo com adicionais, carrinho, pedidos, painel, tempo real, publicações do Instagram, o link de acompanhamento e o primeiro deploy.
Maio 2026
Mensagens e operação
Notificações por e-mail e no site, depois WhatsApp; descontos, SEO configurável, papéis de acesso, monitoramento de erros e detecção de fuso horário.
Junho e julho
Infraestrutura e Google Agenda
Imagem com FrankenPHP, segredos, armazenamento S3 e publicação automatizada; a primeira sincronização com o Google Agenda e as imagens do Instagram guardadas no site.
Agosto e setembro
Profundidade e o site novo
Edição de atendimentos, confirmação, cupons, SMS, bloqueios, cores, métricas de faturamento e os ocupados do Google no painel. O site novo entrou no ar em 18 de setembro.
Telas
Página do serviço, com fotos, duração, valor e o resumo do atendimento.
Os quatro passos do agendamento, explicados na página inicial.
Galeria de resultados filtrada pelo tipo de serviço.
Publicações do Instagram escolhidas pela dona no painel.
Página inicial no celular. 
Serviço com a galeria de fotos no celular. Escolha do horário no celular.
Capturas do site feitas por mim. A marca, as fotos e o estúdio pertencem à Nails by Ivyy.
Resultado
O estúdio agenda pelo site desde abril de 2026 e, em setembro, ganhou um site novo. Pedidos, agenda e Google Agenda vivem no mesmo lugar, e o site é editado no painel.