Design_Mockups.md

-| [Home](home) | [**Escopo**](escopo) | [Processo](processo) | [Design/Mockups](design_mockups) | [Configuração](configuracao) | [Arquitetura](arquitetura) | [Gerência](gerencia) | [Código](codigo) | [BD](Banco de Dados) | [Qualidade](qualidade) | [Frontend](frontend) | [Backend](backend) |
-| :----------: | :-------------------------------: | :------------------: | :--------------: | :--------------------------: | :--------------------: | :------------------------: | :--------------: | :---------------: | :--------------------: | :---------------: | :--------------------: |
\ No newline at end of file
+<table>
+<tr>
+<th>
+
+[Home](home)
+</th>
+<th>
+
+[**Escopo**](escopo)
+</th>
+<th>
+
+[Processo](processo)
+</th>
+<th>
+
+[Design/Mockups](design_mockups)
+</th>
+<th>
+
+[Configuração](configuracao)
+</th>
+<th>
+
+[Arquitetura](arquitetura)
+</th>
+<th>
+
+[Gerência](gerencia)
+</th>
+<th>
+
+[Código](codigo)
+</th>
+<th>
+
+[BD](Banco%20de%20Dados)
+</th>
+<th>
+
+[Qualidade](qualidade)
+</th>
+<th>
+
+[Frontend](frontend)
+</th>
+<th>
+
+[Backend](backend)
+</th>
+</tr>
+</table>
+
+Esta seção da documentação visa apresentar os mockups desenvolvidos no figma durante a Sprint 0.
+
+## Sumário
+
+[[_TOC_]]
+
+## Página de Login
+
+![Login_Page_-_Sucesso](uploads/e99eb3f8a19fad1a542bcdf9a161277d/Login_Page_-_Sucesso.jpg)
+
+![Login_Page_-_Error](uploads/7de08d3dfb449471ea36e12e06272c11/Login_Page_-_Error.jpg)
+
+## Modais de perfil
+
+Esta modal de usuário foi desenvolvida para estar presente em todas as telas, para o usuário sempre conseguir ver o número atual de aplausos que ele possui e sempre conseguir aplaudir algum outro usuário com moedas. Usuários e administradores possuem modais diferentes.
+
+Modal de usuário:
+
+![Modal_Usuário](uploads/6a07f6912511e92f82eeb80b3a66d1cc/Modal_Usu%C3%A1rio.jpg)
+
+Modal de administrador:
+
+![Modal_ADM](uploads/1cb381300c0b178653e535bcf7e2287e/Modal_ADM.jpg)
+
+## Header e menu
+
+Todas as telas, com exceção à tela de login, possuem um header com um menu de estilo _dropdown_ para permitir a transição de telas. Os menus são diferentes para as contas de usuários e administradores, visto que essas contas têm telas e propósitos diferentes.
+
+Header (aplicado a ambos): ![Header](uploads/b14c7a80daab99c16ffad248544c6f1b/Header.jpg)
+
+Menu do usuário:
+
+ ![Menu_User](uploads/80f29f13e1e88acb59fd574ed3f0c4d2/Menu_User.jpg)
+
+Menu do administrador:
+
+ ![Menu_ADM](uploads/cfbdfbe48cee2df8d7e19f6417b95984/Menu_ADM.jpg)
+
+## Usuário
+
+Nesta sessão, serão apresentadas apenas as telas referentes a usuários.
+
+### Envio de aplausos
+
+Um usuário comum pode enviar aplausos para outros usuários a qualquer momento através do botão aplaudir na sua modal de perfil. Ao clickar o botão uma modal aparece, ao estilo _pop up_, para realizar o envio de aplausos.
+
+![Envio_de_Feedback](uploads/b2030cfb1728204debf61894134674e1/Envio_de_Feedback.jpg)
+
+### Home page
+
+O protótipo para a Home page apresenta os aplausos recebidos, ordenados com os mais recentes em cima e os mais antigos em baixo.
+
+![Home_Usuário](uploads/f3ca51c4fe3629f3959ccc5fbd3bad06/Home_Usu%C3%A1rio.jpg)
+
+### Loja de recompensas
+
+A loja de recompensas é a tela para a qual o usuário é redirecionado ao clicar "Recompensas" em seu menu, a partir dela, o usuário poderá resgatar recompensas disponíveis utilizando os aplausos que recebeu de outros usuários.
+
+![Recompensas](uploads/79b52327a713aa4449b4deec0d306b38/Recompensas.jpg)
+
+Selecionar qualquer item da loja, abrirá uma modal, no estilo _pop up_, com uma breve descrição do produto, pedindo uma confirmação de resgate do item.
+
+![Modal_Recompensas](uploads/470e0d75db8f516362c9a713f4a4016c/Modal_Recompensas.jpg)
+
+Após selecionar uma opção, apresentar-se-á uma mensagem de confirmação ou de erro de acordo com a situação.
+
+![Modal_Recompensas_Sucesso](uploads/f4f323198da5048dd3e8adff3afc3eef/Modal_Recompensas_Sucesso.jpg)![Modal_Recompensas_Erro](uploads/32a88a318ecd0852d08d9a62501e2e68/Modal_Recompensas_Erro.jpg)
+
+### Feedbacks enviados
+
+O histórico de feedbacks é a tela para a qual o usuário é redirecionado ao clicar "Feedbacks enviados" em seu menu, a partir dela ele pode ver todos os feedbacks que já enviou, para quem enviou e quando enviou. Analogamente à home page, os feedbacks são organizados em ordem cronológica, com os mais recentes ao topo e os mais antigos ao fundo.
+
+![Feedbaks_Enviados](uploads/a3f79b77b3306a53011b2f3ad55439ad/Feedbaks_Enviados.jpg)
+
+### Recompensas resgatadas
+
+O histórico de recompensas é a tela para a qual o usuário é redirecionado ao clicar "Recompensas resgatadas" em seu menu, a partir dela, ele pode ver todas as recompensas que já resgatou, quando resgatou e quantos aplausos foram pagos.
+
+![Recompensas_Resgatadas](uploads/09076391395bfdf64e2da2c708db92eb/Recompensas_Resgatadas.jpg)
+
+## Adiministrador
\ No newline at end of file