|
|
# DESIGN DE UMA TELA SENDO PREENCHIDA
|
|
|
|
|
|
Em verde, atividades que estão com um status Ok, ou seja, começam, terminam e tem outra
|
|
|
atividade depois, ou é final.
|
|
|
|
|
|
|
|
|
Em amarelo, atividade que está sendo editada atualmente, e que necessita de atividade seguinte,
|
|
|
ou ser final para ficar verde.
|
|
|
|
|
|
|
|
|
Adicionar uma nova atividade “fecha” a atividade anterior (torna ela verde).
|
|
|
|
|
|
|
|
|
O icone de excluir atividade só está disponível na ultima atividade inserida.
|
|
|
|
|
|
|
|
|
![Semana_Incompleta](/uploads/1318d41a7ff054d70b17fd66459b4673/Semana_Incompleta.png)
|
|
|
|
|
|
|
|
|
Clicar na atividade abre a lista de atividades disponíveis. As atividades são sempre as mesmas.
|
|
|
|
|
|
|
|
|
Clicar no horário abre a lista de horários para o final da atividade.
|
|
|
|
|
|
|
|
|
Temos 3 áreas básicas: navegação, agenda e botões de iniciar semana e desistir.
|
|
|
|
|
|
|
|
|
### NAVEGAÇÃO
|
|
|
|
|
|
|
|
|
Os botões de navegação mostram
|
|
|
|
|
|
|
|
|
1. Opção de ir para o dia anterior, no exemplo acima iria para domingo
|
|
|
|
|
|
|
|
|
2. Dia da semana.
|
|
|
|
|
|
|
|
|
3. Dia atual, em cinza escuro
|
|
|
|
|
|
|
|
|
4. Dias ainda sem atividades cadastradas, em cinza claro.
|
|
|
|
|
|
|
|
|
5. Ir para o próximo dia, no exemplo, terça
|
|
|
|
|
|
|
|
|
![Captura_de_Tela_2018-04-17_às_16.21.32](/uploads/08daa1d0b1cf1e656ec83fd332ec6a37/Captura_de_Tela_2018-04-17_às_16.21.32.png)
|
|
|
|
|
|
|
|
|
Dias com atividades para todas as horas ficam marcados em verde.
|
|
|
|
|
|
|
|
|
![Captura_de_Tela_2018-04-17_às_16.21.42](/uploads/dbeed83fc695b0c91730574aafe33092/Captura_de_Tela_2018-04-17_às_16.21.42.png)
|
|
|
|
|
|
|
|
|
Dias com atividades pendentes ficam marcados em amarelo.
|
|
|
|
|
|
|
|
|
![Captura_de_Tela_2018-04-17_às_16.22.25](/uploads/c7e1b836c0708ad408d739615da55455/Captura_de_Tela_2018-04-17_às_16.22.25.png)
|
|
|
|
|
|
|
|
|
Quando os dias estão prontos, ficam todos verdes.
|
|
|
|
|
|
|
|
|
Na imagem abaixo, o domingo está cinza pois é o dia que estamos visualizando.
|
|
|
|
|
|
|
|
|
![Captura_de_Tela_2018-04-17_às_16.22.39](/uploads/c5fe643145c17e3cd877f3827df60fea/Captura_de_Tela_2018-04-17_às_16.22.39.png)
|
|
|
|
|
|
|
|
|
![Captura_de_Tela_2018-04-17_às_16.22.39](/uploads/0dff777468cb2920066acd5c8c95b9d4/Captura_de_Tela_2018-04-17_às_16.22.39.png)
|
|
|
|
|
|
|
|
|
### AGENDA
|
|
|
|
|
|
|
|
|
É possível inserir uma atividade dentre as pré estabelecidas.
|
|
|
|
|
|
|
|
|
![selecionando_atividade](/uploads/f376273182e1e254365e933458cee15a/selecionando_atividade.png)
|
|
|
|
|
|
|
|
|
É possível selecionar também o horário que a atividade termina.
|
|
|
|
|
|
|
|
|
![selecionando_hora_fim](/uploads/fc70726fd60bc51d7b258c28f494ecb1/selecionando_hora_fim.png)
|
|
|
|
|
|
|
|
|
O último elemento da lista sempre é adicionar atividade.
|
|
|
|
|
|
|
|
|
A última atividade adicionada, por padrão, começa automaticamente no horário que a atividade
|
|
|
anterior termina, e tem duração de uma hora, que é alterável. A última atividade é também a
|
|
|
única que pode ser excluída.
|
|
|
|
|
|
|
|
|
![nova_atividade](/uploads/4f4fcec24c1c7ac39caa40748de7bc99/nova_atividade.png)
|
|
|
|
|
|
|
|
|
Se um dia tem muitas atividades é ativada uma barra de rolagem.
|
|
|
|
|
|
|
|
|
![dia_quase_completo_com_rolagem](/uploads/bf48b47e78145387376bb244ec149fc7/dia_quase_completo_com_rolagem.png)
|
|
|
|
|
|
|
|
|
Quando a última atividade termina no horário 00, o dia é dado por encerrado e todos os itens
|
|
|
ficam verdes
|
|
|
|
|
|
|
|
|
![dia_completo](/uploads/d810372b9e8157204e9e57977eee4607/dia_completo.png)
|
|
|
|
|
|
|
|
|
O botão de inserir atividade fica apagado (desabilitado).
|
|
|
|
|
|
|
|
|
![dia_completo_inserir_desabilitado](/uploads/e69b88edec5c907b93b773a09d7cede4/dia_completo_inserir_desabilitado.png)
|
|
|
|
|
|
|
|
|
Se uma atividade dura mais de uma hora, é possível aumentar ou diminuir sua duração. Isso
|
|
|
afeta o horário de início da próxima atividade.
|
|
|
|
|
|
|
|
|
![altera_horario_possivel](/uploads/62c449da9e3ef29d00c6440012cf5f27/altera_horario_possivel.png)
|
|
|
|
|
|
|
|
|
O aumento do horário da atividade está relacionado ao tempo disponível no dia (se o dia estiver
|
|
|
cheio, não será possível aumentar a duração de uma atividade).
|
|
|
|
|
|
|
|
|
![altera_horario_impossivel](/uploads/16597211aea5667591086758eaa5955d/altera_horario_impossivel.png)
|
|
|
|
|
|
|
|
|
### BOTÕES
|
|
|
|
|
|
|
|
|
Se a semana estiver incompleta (todos ou algum dia não tem atividade em todas as suas horas),
|
|
|
o botão de iniciar semana fica desabilitado.
|
|
|
|
|
|
|
|
|
![Captura_de_Tela_2018-04-17_às_16.22.52](/uploads/b53ec62ab7313fd7367fa194136d1207/Captura_de_Tela_2018-04-17_às_16.22.52.png)
|
|
|
|
|
|
|
|
|
Quando a semana estiver pronta, o botão muda
|
|
|
|
|
|
|
|
|
![Captura_de_Tela_2018-04-17_às_16.23.01](/uploads/6c8d98d757ead140f07a3ac2723c9385/Captura_de_Tela_2018-04-17_às_16.23.01.png)
|
|
|
|
|
|
|
|
|
Há também sempre presente a opção de desistir.
|
|
|
|
|
|
|
|
|
![Captura_de_tela_de_2018-04-20_20-30-57](/uploads/e8de51e05e958e7032f456c0a2d2d070/Captura_de_tela_de_2018-04-20_20-30-57.png)
|
|
|
|
|
|
|
|
|
Abaixo a imagem da semana pronta para ser simulada!
|
|
|
|
|
|
|
|
|
![Semana_Completa2](/uploads/6fe1525c71891591c293d9f2c1bce885/Semana_Completa2.png)
|
|
|
|
|
|
|