Neste artigo vamos explicar como efetuar a configuração completa do dispositivo emissor de senhas.
Aqui você encontrará instruções detalhadas sobre como cadastrar o emissor, definir a resolução da tela, organizar o fluxo de telas e configurar cada componente disponível.
Criar novo cadastro
- No menu lateral, selecione Configuração → Canais → Presencial → Editor de dispositivo de emissão → Novo dispositivo.
- Será exibida uma janela onde deverá ser inserido o nome do dispositivo.
.png)
Definir resolução da tela
- Escolha a resolução compatível com o hardware (ex.: 800x1280).
- Essa configuração garante que os componentes sejam renderizados corretamente.
.png)
Nomear a tela inicial
- Defina um nome único para a tela inicial (ex.: “Tela Principal”).
- Esse nome será usado para organizar o fluxo e identificar a tela no editor.
- Para as demais telas é interessante definir um "tempo de exibição". Caso esse tempo passe, o emissor retorna à tela inicial.
É possível cadastrar (ou copiar) várias telas, porém o que define sua ordem é a navegação definida pelos componentes (botões, textos e imagens).
.png)
Componentes de edição
Durante a edição das telas do dispositivo emissor, o usuário conta com a janela flutuante chamada Ferramentas.
Essa janela pode ser movida livremente para qualquer parte da interface do editor, oferecendo flexibilidade na organização do espaço de trabalho.
Na janela Ferramentas, cada componente disponível é representado por um ícone específico.
Ao clicar sobre o ícone desejado (botão, texto, imagem ou campo de entrada), o componente é imediatamente inserido na tela em edição, ficando pronto para ser configurado conforme as necessidades do fluxo de atendimento.
.png)
Botão
- Propriedades gerais: conteúdo, cores, tamanho, posição (x, y, z).
- Estilos visuais: cor normal e cor ativa (pressionado).
- Navegação: próxima tela e disparo de fluxo.
- Variáveis: podem ser associadas ao botão para enviar dados ao fluxo.
.png)
Imagem
- Fonte: upload direto ou indicação de URL.
- Propriedades: tamanho, posição, alinhamento.
- Variáveis: podem ser vinculadas para transmitir informações ao fluxo.
- Uso comum: logotipos, ícones, fundo da tela.
Uma imagem também pode ser utilizada como botão de ação ou navegação!
.png)
Texto
- Conteúdo: mensagens informativas ou instruções.
- Formatação: fonte, tamanho, cor, alinhamento.
- Posição: coordenadas (x, y, z) para definir exibição.
- Variáveis: podem ser usadas para exibir dados dinâmicos (ex.: número da senha).
Um texto também pode ser utilizado como botão de ação ou navegação!
.png)
Campo de texto (input)
- Função: coleta de dados do cliente (ex.: inscrição, nome, código).
- Propriedades: tamanho, cor, posição, texto de placeholder.
- Validação: pode incluir regras para garantir entrada correta.
- Variáveis: dados inseridos são enviados ao fluxo de atendimento.
.png)
Organizar telas
- Crie múltiplas telas com diferentes componentes.
- Defina a ordem de exibição e a lógica de navegação entre elas utilizando o campo "Tela de destino" de cada componente.
.png)
Preview e validação
- Utilize o modo de pré-visualização para validar o layout.
- Confira cada botão, campo e navegação entre telas para garantir que os dados sejam exibidos corretamente.
.png)
Ao clicar no botão de pré-visualização, o sistema entrará em modo "tela-cheia" e exibirá a configuração aplicada no momento. Todas as navegações e configurações podem ser validadas antes de enviar para o dispositivo real.
.png)
Boas práticas
- Utilize cores contrastantes para destacar botões ativos.
- Nomeie telas e componentes de forma clara e padronizada.
- Teste sempre em dispositivos reais para validar a experiência.
- Crie uma tela inicial com todos os componentes, configure-a e para as demais telas utilize o recurso de "clonar" a tela para diminuir o re-trabalho da configuração.
- Ao final da configuração é indicado que exista um componente que tenha como destino um fluxo de atendimento Presencial. Dessa forma a senha será impressa e o cliente direcionado ao atendimento.