PimpAPP / pimpapp-api

API REST utilizada no pimp
8 stars 3 forks source link

Frontend: home catador #45

Closed BrenoCastroAlves closed 7 years ago

BrenoCastroAlves commented 7 years ago

Número do requisito/issue: RQ045 Sprint: SP032017

Descrição breve do requisito/solicitação: Criação da página Home do catador.

Descrição completa: O primeiro elemento da Home é o cabeçalho, que contém o ícone do Reco, na esquerda, e o thumbnail que leva ao perfil do usuario, na direita ;

A parte central da tela é ocupada pelo mapa, centrado na posição do usuário.

Ao redor estão os ícones das coletas abertas e, com mais destaque, o de coletas marcadas por esse catador.

As coletas marcadas pelo catador possuem, além do ícone, um relógio de contagem regressiva com o tempo marcado para a coleta. Este ícone tem quatro versões: "coleta normal", "coleta atrasada" (entre - 30m e +6h), "confirmar coleta" (+6h01) e "coleta cancelada" (cancelamento manual).

Antes do rodapé, o botão Reco, que encaminha a ação.

A home é uma página vertical, é possível rolar ela para baixo. No primeiro viewport está uma seta indicando que o fluxo continua para baixo.

Finalmente, o rodapé traz o menu, com cinco itens. Ele tem posição fixada, seguirá no pé de boa parte das páginas deste projeto.

O menu do catador é diferente do gerador. O quarto botão não é "materiais" e sim "vídeo".

Ao scrollar verticalmente, o usuário irá acessar uma lista com duas áreas: coletas marcadas e coletas próximos. Primeiro mostramos as coletas marcadas, o mais importante para o usuário catador. Ali estará um cartão resumindo cada coleta, apontando distância, materiais e horário marcado.

Aqui, como nos ícones, os cartões possuem quatro versões "coleta normal", "coleta atrasada" (entre - 30m e +6h), "confirmar coleta" (+6h01) e "coleta cancelada" (cancelamento manual).

Após isso, uma lista das 10 coletas mais próximas.

No pé da página, o botão "+10" carrega as próximas 10 coletas abertas mais próximas. Caso não haja mais catadores num raio de 5km, o botão se transforma em em um convite com texto e link para a página de cadastro.

Entradas:

Clicar no ícone home no menu reload a home.

Thumbnail abre balao com o perfil da coleta aberta sobre a tela.

O botão Reco carrega para Resíduos Carrocel.

O botao "seta pra baixo" desliza para cima a lista de coletas marcadas e catadores próximos.

É possível ligar ou mandar whatsapp diretamente para o gerador de uma coleta marcada a partir da lista de coletas marcadas da home.

Rolar a página até o final carrega mais 10 coletas abertas mais próximas

Processamentos:

Mapa centrado no usuário.

botão recentrar mapa.

sem botão zoom in out.

Ícones do mapa são clicáveis e abrem um balão resumo sobre o ponto.

O botão Reco leva para a a página Resíduo 1

Os botões do menu carregam para suas respectivas páginas estáticas.

Scroll vertical levando para lista de coletas marcadas e coletas abertas mais próximos, até 5km do catador.

ìcones e lista de coletas marcadas possuem quatro tipos: "coleta normal", "coleta atrasada" (entre - 30m e +6h), "confirmar coleta" (+6h01) e "coleta cancelada" (cancelamento manual)

Saídas:

Moqup da tela de cadastro: https://docs.google.com/document/d/1GBc92woKXD6X0Qt3lweKAo43GD7fyeJ8hZZHC3F0IOs/edit#heading=h.bit8v4lltn2h

Observações complementares:

Especificação aprovada por: