Árvore de páginas

Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.

...

A Tela de Login é a primeira autenticação do usuário no aplicativo. Nessa tela, após o preenchimento dos campos da tela , o aplicativo conversa com o Protheus para verificar se o usuário é válido ou não. Caso seja, o TOTVS Meu Posto permite o acesso do usuário ao resto do aplicativo. Caso não, o usuário não consegue prosseguir e o seguinte alerta é exibido.

                      

Campo

Descrição
UsuárioUsuário Protheus
SenhaSenha do usuário Protheus
Exibir SenhaToggle para exibir/ocultar senha do usuário Protheus

Alias

"ALIAS" do usuário Protheus
Entrar

Acesso às outras telas do aplicativo




 

Imagem 3 – Tela de Login com Toast

Ao usar um usuário ou senha inválido, a tela apresenta um toast , um alerta notificando o usuário que há um erro com os dados inseridos nos campos da tela. Obs.: Usuário e senha válidos no Protheus são necessários para o acesso ao TOTVS Meu Posto. 


Campo

Descrição
AlertaAlerta dizendo que o usuário ou senha esta inválido.


Tela de Configuração de Contatos

...

A tela de Configuração de Contatos serve para o usuário incluir formas de contato, como nome, e-mail e/ou telefone, do supervisor dos postos de trabalho. O usuário pode incluir quantas formas de contato que ele quiser. Após a inclusão dos contatos, o usuário clica o botão “Finalizar”  para continuar para o resto do aplicativo.


Campo

Descrição
InstruçõesCard de Instruções.
ContatoCampo para inserir uma forma de contato com o supervisor dos postos.
IncluirBotão "Incluir", para inclusão dos contatos.
Contatos IncluídosQuando tiver contatos incluídos, aparecera uma lista dos contatos.
FinalizarBotão "Finalizar" que finaliza a configuração e segue para a proxima tela



Abaixo é uma imagem da tela de configuração de contato depois da inclusão de contatos.


Imagem 5 – Tela de Configuração de Contatos (contatos inclusos)

...

À medida que o usuário inclui contatos, uma lista se forma abaixo da legenda “Contatos incluídos”. Um botão “Excluir” aparece ao lado de todo contato. Ao clicar esse botão, o contato ao lado do botão é excluído da memória do aplicativo.


Campo

Descrição
ContatosLista de Contatos incluídos.
ExcluirBotão para Excluir os contatos.



Tela de Acesso do Atendente


Após o atendente ter feito login e ter configurado seus contatos, a Tela de Acesso do Atendente aparecerá. Essa tela é uma tela de autenticação do usuário do aplicativo usando o Código do Atendente e a Senha atrelada a esse código.

...

Muito parecida como a Tela de Login (Imagem 2), essa tela tem campos para o código do atendente e senha. Ela também tem o botão toggle para exibir ou ocultar a senha. Além do toggle, a tela também apresenta botões de “Ajuda”  e “Config.” que levam para as telas de Ajuda e de Configuração Geral, respectivamente. Após preencher os campos, o usuário deve clicar o botão “Entrar”  que, se o código e senha estiverem certos, leva o usuário para a próxima tela: a Tela de Check-in.   Porém, se o usuário usar um código do Atendente ou senha inválido, a tela apresenta um toast, um alerta, notificando o usuário que há um erro com os dados inseridos nos campos da tela, idêntico ao alerta na Tela de Login.


CampoDescrição
Código do AtendenteCampo para o código do atendente.
SenhaCampo para a senha do atendente.
Exibir SenhaBotão Toggle para exibir/ocultar a senha do Atendente.
EntrarBotão "Entrar" no aplicativo.
AjudaBotão "Ajuda".
ConfiguraçãoBotão "Configurar".


Tela de Check-in


Essa é a tela inicial do aplicativo após a configuração. A listagem dos postos de trabalho disponíveis, e seus respectivos horários, de entrada e saída, está presente na Tela de Check-in

...

Cada card na tela é ou de entrada ou de saída. Ao clicar nos cards, o aplicativo leva o usuário para a Tela de Detalhes Check-in/Check-out, onde o usuário completa a entrada ou saída do posto de trabalho.


CampoDescrição
Card Check-inCard de um dos Postos de Trabalho para dar entrada (check-in) e seu horario.
Card Check-outCard de um dos Postos de Trabalho para dar saída (check-out) e seu horario.
Barra de FerramentaFerramenta Tabs para a navegação dentro do aplicativo.


O Tabs, uma ferramenta de navegação entre páginas, está presente na Tela de Check-in.

Tabs


O Tabs é uma ferramenta simples, mas eficaz, para a navegação dentro de um aplicativo mobile (Imagem 7 ). Ele permite o usuário a acessar as páginas do aplicativo e mostrar a página atual onde o usuário está.

...

Quando o usuário está em uma das telas principais do aplicativo (Tela de Check-in, Tela de Agenda ou Tela de Ajuda), o ícone e nome da página entra em destaque no Tabs. Na Imagem 8, a página atual do usuário é a Tela de Check-in.


CampoDescrição
CheckinBotão "Checkin" no Tabs.
AgendaBotão "Agenda" no Tabs.
AjudaBotão "Ajuda" no Tabs.
SairBotão "Sair" no Tabs.


Para mudar de página, o usuário pode simplesmente clicar nos outros ícones do Tabs. O aplicativo levará o usuário até a página do ícone.


O último botão do Tabs, o botão “Sair”, não é um botão para a navegação dentro do aplicativo. É um botão para levar o usuário de dentro do aplicativo para fora, para a Tela de Acesso do Atendente. 

...

O alerta para a confirmação da saída do app aparece em qualquer tela quando o botão “Sair” é acionado. Caso o usuário clique no botão “Não”, a ação de saída é cancelada. Caso clique o botão “Sim”, a ação de saída é executada, e o usuário é levado à Tela de Acesso do Atendente (Imagem 6).


CampoDescrição
MensagemAlerta confirmando com usuário se ele realmente deseja sair.
NãoBotão "Não" cancela a ação de sair do aplicativo.
SimBotão "Sim" confirmada a saída do aplicativo.


Tela de Detalhes Check-in/Check-out


Quando o atendente clica nos cards dos postos de trabalho (Imagem 7), a Tela de Detalhes de Check-in/Check-out surge. A tela é idêntica para check-in (entrada) e check-out (saída) porque os processos para os dois são iguais. O processo é explicado em mais detalhe seção “Funcionalidades: Realizando um Check-in/Check-out”.

...

Imagem 10.1 – Tela de Check-in/Check-out


CampoDescrição
PostoCampo de Seleção do Posto.
íconeÍcone da self.
ComentárioCampo para comentário.
CâmeraBotão "Câmera" para tirar self.
AdicionarBotão para adicionar mais fotos.




Imagem 10.2 – Tela de Detalhes Check-in/Check-out

...

Para realizar o Check-in ou Check-out, é necessário tirar uma Selfie. Usando o botão “Câmera”, o usuário terá acesso à câmera do celular, e assim, poderá tirar a Selfie. Assim que a Selfie for tirada, ela será exibida no ícone da Selfie. Enquanto não tiver uma Selfie, o ícone da Selfie se mantém no padrão, como na imagem acima.


CampoDescrição
Fazer CheckinBotão fazer Checkin.



Caso o usuário queira informar o seu supervisor de algo no posto de trabalho, o usuário pode inserir um comentário no campo para comentário. Se o usuário quiser mostrar algo no posto de trabalho, como algum defeito em um equipamento, ele pode tirar fotos adicionais usando o botão para adicionar mais fotos. O usuário pode tirar até três fotos adicionais.


Imagem 11 – Tela de Detalhes Check-in/Check-out com foto adicional

...

Após tirar uma foto adicional, o ícone da foto é criada. Se o ícone for clicado, a foto adicional expande e ocupa a tela toda. Caso o usuário queira excluir a foto, tem um botão “Excluir” que pode ser clicado para excluir a foto. Caso o usuário queira adicionar mais novas fotos, ele pode clicar o botão para adicionar mais fotos.


CampoDescrição
ÍconeÍcone de foto adicional
ExcluirBotão "Excluir".
AdicionarBotão para adicionar mais fotos.


Se o atendente estiver na Tela de Detalhes Check-in/Check-out mas quiser trocar o posto selecionado, ele pode clicar o campo de seleção de Posto, e um Card de seleção de posto aparece.


Imagem 12.1 – Tela de Detalhes Check-in/Check-out (seleção de posto)

...

Dentro do Card de seleção de Posto, o atendente o posto que ele tinha selecionado. Caso o atendente clique o botão “Trocar”, ele volta para a Tela de Check-in, onde pode escolher outro Card para check-in ou check-out. Caso o atendente clique o botão “OK”, o Card de seleção de Posto fecha, e o atendente volta à Tela de Detalhes


CampoDescrição
CardCard de Seleção de Posto.
OpçãoOpção de Posto.
TrocarBotão "Trocar".
OKBotão "OK".


Check-in/Check-out, onde o atendente pode voltar ao processo de realizar um check-in/check-out.


Depois que o usuário estiver satisfeito com o seu check-in/check-out, ele pode finalizar o processo ao clicar no botão “Fazer Checkin”. O TOTVS Meu Posto então lançará um Card confirmando a finalização do check-in. Obs.: O app só permite a finalização se o atendente tirar uma Selfie antes.

...

O atendente pode clicar ou no botão “Sair do App”, que levará ele à Tela de Acesso do Atendente (Imagem 6), ou no botão “Continuar Navegando”, que levará o atendente de volta para a Tela de Check-in (Imagem 7). 


CampoDescrição
CardCard Pós Finalização.
SairBotão "Sair do App".
Continuar NavegandoBotão "Continuar Navegando".


Tela de Agenda


A tela de agenda serve para mostrar os pontos (entrada e saída) do dia de hoje e os do histórico para o atendente.

...

A Tela de Agenda é apenas informativa. O usuário não consegue acessar os pontos listados clicando neles na Tela de Agenda. Essa tela é apenas uma lista de todos os check-ins que tem no dia, ou que já tiveram no histórico. Para navegar dentro da lista utitlizem a rolagem da tela.


CampoDescrição
HojeAba "Hoje".
DataData de Hoje.
HistóricoAba "Histórico".
ListaLista de Check-Ins de hoje.



Caso queira ver os check-ins/check-outs passados, no histórico, clique na aba “Histórico” .

...

O atendente pode ver todos os check-ins/check-outs no histórico. Caso o check-in já tenha sido feito, um ícone “Check” aparecerá ao lado.


CampoDescrição
CheckÍcone Check.


Tela de Ajuda          

A Tela de Ajuda é onde os contatos inseridos pelo usuário estarão disponíveis depois da Tela de Configuração de Contatos. Há duas maneira de acessar a Tela de Ajuda. A primeira é via a Tela de Acesso do Atendente e a outra é via a ferramenta Tabs. Todavia, se o usuário acessar a Tela de Ajuda por meio da Tela de Acesso do Atendente, o Tabs não estará na tela, pois o usuário não está logado no aplicativo (Imagem 16). 

...

É importante notar que a lista de contatos está na tela de ajuda apenas para exibição. Não há como clicar nos contatos ou deletar eles. Para deletar os contatos, o usuário terá que ir para a Tela de Configuração Geral (Imagem 18).


CampoDescrição
ListaLista de Contatos.



Imagem 16 – Tela de Ajuda (sem contatos) via Tela de Acesso do Atendente

...

A imagem 16 é a Tela de Ajuda quando ela é acessada pela Tela de Acesso do Atendente. Já que o atendente ainda não entrou com o seu código e senha, ele não tem acesso às páginas de Check-in e Agenda, e assim, a ferramenta Tabs não está disponível. Porém, há um botão “Voltar”; Esse botão leva o usuário de volta para a Tela de Acesso do Atendente.


CampoDescrição
VoltarBotão Voltar.


Tela de Configuração Geral


Acesso à Tela de Configuração Geral é apenas possível a partir da Tela de Acesso do Atendente, clicando o botão “Config.” (Imagem 6) Ao clicar, um alerta de verificação aparece na tela, pedindo o usuário e senha do atendente, os mesmos usados na Tela de Login (Imagem 2).

...

Após informar o usuário e senha válidos, o atendente terá acesso à Tela de Configuração Geral. Nela, o usuário poderá visualizar, adicionar, ou remover contatos, visualizar dados de Login, e sair do aplicativo.


CampoDescrição
Informe o usuário e senhaAlesrta para verificação do usuário e senha.
UsuárioCampo do Usuário do Atendente.
SenhaCampo da Senha do Atendente.
CancelarBotão "Cancelar", que cancela a ação e leva o usuário de volta para a tela Acesso do Atendente.
ConfirmarBotão "Confirmar", que leva o usuário para tela de Configuração Geral, caso o usuário e senha estejam corretos. Se um dos campos estiverem inválidos, o acesso é negado.




Imagem 18 – Tela de Configuração Geral (sem contatos)


CampoDescrição
Contatos SalvosCampo "Contatos Salvos" expoe os contatos incluídos pelo Atendente.
ContatosCampo "Adicionar Novo Contato" que insere uma forma de contato com o supervisor dos postos.
ConfiguraçõesCampo "Configurações" exibe informações sobre a Empresa e Filial do Atendente.
IncluirBotão "Incluir", serve para inclusão de Contatos.



Imagem 19 – Tela de Configuração Geral (sem contatos)

...

Muito similar à Tela de Configuração de Contatos, a Tela de Configuração Geral permite o usuário a adicionar mais contatos usando o campo “Adicionar novo contato” e o botão “Incluir”. Os campos de “Configurações” e “Dados de Login” são apenas informativos, não interativos. Os campos permitem a consulta rápida dos dados de Login e configurações.


CamposDescrição
VoltarVolta para a tela anterior
Dados de LoginDados do perfil logado no aplicativo
SairVolta para a pagina inicial do aplicativo



Há também os botões “Voltar” e “Sair”. O botão “Voltar” leva o atendente de volta à Tela de Acesso do Atendente (Imagem 6), e o botão “Sair” leva o atendente de volta à Tela de Login (Imagem 2). Se o botão “Sair” for acionado, um alerta aparecerá na tela do usuário (Imagem 20;).

...

O alerta que aparece quando o usuário clica o botão “Sair” explica ao usuário que todas as informações salvas dentro do aplicativo serão apagadas. Caso o usuário clique no botão “Confirmar”, todas as informações salvas serão deletadas. Caso clique no botão “Cancelar”, as informações continuarão salvas e o usuário será levado de volta à Tela de Configuração Geral (Imagem 18 e 19).


CamposDescrição
Tem CertezaAlerta explicadno as consequencias de sair.
CancelarBotão "Cancelar", para voltar a Tela de Configuração Geral
ConfirmarBotão "Confirmar", para confirmar a saida do aplicativo para a tela de Login do Atendente.


Na imagem 18, o campo “Contatos Salvos” está vazio. Se o atendente tiver inserido contatos, os contatos serão exibidos em uma lista (Imagem 21), muito parecido com a lista de contatos na Tela de Configuração de Contatos (Imagem 5).


Imagem 21 - Tela de Configuração Geral (com contatos)

...

À medida que o usuário inclui contatos, uma lista se forma abaixo da legenda “Contatos Salvos”. Um botão “Excluir” aparece ao lado de todo contato. Ao clicar esse botão, o contato ao lado do botão é excluído da memória do aplicativo.


CampoDescrição
Contatos SalvosLista de Contatos apos inclusão.
LixeiraBotão "Excluir".


Funcionalidades

Realizando um Check-in/Check-out

...