Crie um app de agendamento com horários definidos

Permita escolher um serviço e um horário e acompanhe os agendamentos em um só lugar.

Imagine um barbeiro conferindo mensagens entre um corte e outro. Uma pessoa quer aparar o cabelo amanhã, outra pede o mesmo horário à tarde e uma terceira ainda não disse qual serviço procura. O agendamento começa muito antes de alguém sentar na cadeira: é preciso combinar serviço, data e horário disponível.

Um app de agendamento funciona quando essas escolhas seguem uma agenda definida. Comece com regras pequenas e explícitas. Uma barbearia com uma cadeira e horários fixos tem necessidades diferentes de uma equipe que oferece serviços de durações variadas.

Resumo

Defina serviços, horários, fuso e capacidade de atendimento. Peça um seletor de horários e uma lista de agendamentos para quem atende. Faça um agendamento de teste e confira o horário ocupado. Teste tentativas de reservar o mesmo horário e revise as permissões dos registros antes de compartilhar seu app.

Inclua a regra de capacidade no pedido

Explique o que torna um horário indisponível, como o visitante se identifica e quais informações quem atende precisa consultar. Este é um exemplo fictício com uma cadeira:

Markdown
Crie um app de agendamento para uma barbearia fictícia com uma cadeira.
Ofereça corte de cabelo e barba em horários fixos de 45 minutos.
Mostre os próximos sete dias, com horários das 10h às 17h no fuso
Europe/London. Não abra aos domingos. Permita escolher serviço, dia e
horário livre e informar nome e uma observação curta. Mostre um resumo
de confirmação após o agendamento. Aceite um agendamento por horário e
mostre os ocupados como indisponíveis. Dê ao responsável uma lista em
ordem cronológica. Use agendamentos fictícios na versão inicial e
mantenha calendários externos separados.

Substitua os horários de funcionamento, o fuso e as regras dos serviços pelos seus. Para criar e compartilhar o app e configurar as permissões das coleções, consulte Crie um app interativo no seu canvas. O pedido descreve o comportamento que você quer testar, sem garantir uma cópia exata do exemplo abaixo.

Teste o exemplo da barbearia

O exemplo tem seleção de serviços, faixa de dias, horários e lista de agendamentos. Ele mostra quais horários já estão ocupados durante a escolha.

Abrir em nova aba
Um agendamento de barbearia com serviços, horários disponíveis e lista de atendimentos

Este exemplo usa dados de demonstração. Ao recarregar, suas alterações são redefinidas.

Teste estas duas ações:

  1. Escolha um serviço e um dia, selecione um horário livre e agende com um nome fictício. Encontre o atendimento na lista.
  2. Volte ao mesmo dia e confira o horário ocupado. Compare-o com um horário livre e verifique que não é possível selecionar o que já foi reservado.

Esta prévia usa dados de teste descartáveis, e as alterações são desfeitas ao recarregar. Ela não reserva um atendimento real, envia e-mails de confirmação nem sincroniza calendários externos. Os nomes na lista ilustram a visão de quem atende; no seu app, decida quem deve ter acesso aos registros.

Esclareça a próxima decisão de quem atende

Uma boa melhoria trata do que a barbearia faz depois que recebe um agendamento:

Markdown
Adicione um filtro por serviço à lista de agendamentos do responsável e
mostre a duração de cada serviço ao lado do atendimento. Preserve todos
os agendamentos existentes. Mostre uma mensagem quando nenhum
agendamento corresponder ao filtro.

Antes de usar seu app no atendimento, teste duas tentativas de reservar o mesmo horário, o primeiro e o último horário do dia e um dia fechado. Confirme o fuso exibido e o que acontece após um cancelamento. Confira as permissões das coleções para evitar que visitantes acessem dados de outras pessoas. Se a equipe precisa negociar o prazo antes de aceitar o trabalho, um formulário de solicitação é mais adequado que o agendamento imediato.

Enviar feedback

Este artigo foi útil?