... | ... | @@ -2,24 +2,20 @@ |
|
|
| :----------: | :-------------------------------: | :------------------: | :--------------: | :--------------------------: | :--------------------: | :------------------------: | :--------------: | :---------------: | :--------------------: | ------------: |
|
|
|
## Sumário
|
|
|
|
|
|
1. [Descrição](#descricao)
|
|
|
2. [Identidade Visual](#idvisual)
|
|
|
1. [Descrição](#descrição)
|
|
|
2. [Identidade Visual](#identidade-visual)
|
|
|
3. [Mockups](#mockups)
|
|
|
4. [Fluxo de Tela Alunos](#faluno)
|
|
|
5. [Fluxo de Tela Professores](#fprof)
|
|
|
6. [Fluxo de Tela Admin](#fadmin)
|
|
|
7. [Versão Final das Telas](#vfinal)
|
|
|
4. [Fluxo de Tela Alunos](#fluxo-aluno)
|
|
|
5. [Fluxo de Tela Professores](#fluxo-professor)
|
|
|
6. [Fluxo de Tela Admin](#fluxo-admin)
|
|
|
7. [Versão Final das Telas](#versão-final)
|
|
|
|
|
|
*******
|
|
|
|
|
|
<div id='descricao'/>
|
|
|
|
|
|
## Descrição
|
|
|
|
|
|
Durante o perido da Sprint 0, foram desenvolvidas pelos AGES III de Frontend as telas da aplicação, feitas na ferramenta Figma, em um trabalho colaborativo com os demais colegas.
|
|
|
|
|
|
<div id='idvisual'/>
|
|
|
|
|
|
### Identidade Visual
|
|
|
|
|
|
O primeiro passso antes de dar inicio no desenvolvimento dos protótipos de tela, foi definir uma identidade visual atrelada ao projeto, algo que serviria como guia para as cores, fontes e logotipo que seriam utilizados futuramente. Abaixo, a definição de identidade visual do projeto feita:
|
... | ... | @@ -30,7 +26,6 @@ O primeiro passso antes de dar inicio no desenvolvimento dos protótipos de tela |
|
|
|
|
|
![DEF_IACC](uploads/7c62c00de9baa821de8bc7b071e95ee0/DEF_IACC.png)
|
|
|
|
|
|
<div id='mockups'/>
|
|
|
|
|
|
## Mockups
|
|
|
|
... | ... | @@ -46,8 +41,6 @@ Os Mockups da aplicação pode ser vistos em sua integridade na página do Figma |
|
|
|
|
|
Na tela de cadastro, alem dos campos esperados de cadastro, é possivel ver um botão de Dropdown associaddo as turmas já pré cadastradas na aplicação pelo admin da aplicação, que o aluno pode selecionar.
|
|
|
|
|
|
<div id='faluno'/>
|
|
|
|
|
|
### Fluxo Aluno
|
|
|
|
|
|
#### Lista Autoavalições
|
... | ... | @@ -66,8 +59,6 @@ Na tela de Autoavaliações, é possivel ver as autoavaliações feitas pelo alu |
|
|
|
|
|
Unica diferença existente entre a tela de Visualização e Edição de Autoavaliações é a prensença de campos editáveis e de um botão de Salvar/Finalizar.
|
|
|
|
|
|
<div id='fprof'/>
|
|
|
|
|
|
### Fluxo Professor
|
|
|
|
|
|
#### Listagem de Turmas
|
... | ... | @@ -102,8 +93,6 @@ O Professor pode ver as suas Avaliações do Aluno selecionado na tela anterior, |
|
|
|
|
|
A Avaliação do professor é baseada em um questionário de 10 perguntas. Cada uma dessas perguntas recebe um ponto. Cada campo oferece a oportunidade do professor de deixar um comentário. Ao final, é oferecido ao professor um campo de observações, onde ele pode adicionar as anotações que achar necessárias. A unica diferença entre a tela de visualização e edição, é novamente a presença do campo editável e o botão de Salvar/Finalizar.
|
|
|
|
|
|
<div id='fadmin'/>
|
|
|
|
|
|
### Fluxo Admin
|
|
|
|
|
|
O Usuário Admin da aplicação é definido como um professor com nivel de acesso superior, logo, muitas de suas telas são similares as telas de professor, somente com opções extras que englobam seu nivel.
|
... | ... | @@ -168,6 +157,5 @@ O Usuário Admin pode clicar no card de um aluno e ser levado para a tela das av |
|
|
|
|
|
Os Mockups apresentados acima são meramente uma base para o que as telas da aplicação irão se assemelhar em sua versão final. É bom ressaltar que são sujeitas a mudanças durante o desenvolvimento da aplicação para entrar em conformidade com futuras adições/edições/exclusões que vierem a ser feitas.
|
|
|
|
|
|
<div id='vfinal'/>
|
|
|
|
|
|
## Versão Final |
|
|
\ No newline at end of file |