Skip to content

GitLab

  • Menu
Projects Groups Snippets
    • Loading...
  • Help
    • Help
    • Support
    • Community forum
    • Submit feedback
    • Contribute to GitLab
  • Sign in
  • W wiki
  • Project information
    • Project information
    • Activity
    • Labels
    • Planning hierarchy
    • Members
  • Repository
    • Repository
    • Files
    • Commits
    • Branches
    • Tags
    • Contributors
    • Graph
    • Compare
  • Issues 12
    • Issues 12
    • List
    • Boards
    • Service Desk
    • Milestones
  • Merge requests 0
    • Merge requests 0
  • CI/CD
    • CI/CD
    • Pipelines
    • Jobs
    • Schedules
  • Deployments
    • Deployments
    • Environments
    • Releases
  • Monitor
    • Monitor
    • Incidents
  • Packages & Registries
    • Packages & Registries
    • Package Registry
    • Infrastructure Registry
  • Analytics
    • Analytics
    • Value stream
    • CI/CD
    • Repository
  • Wiki
    • Wiki
  • Snippets
    • Snippets
  • Activity
  • Graph
  • Create a new issue
  • Jobs
  • Commits
  • Issue Boards
Collapse sidebar
  • Gendrify ID
  • wiki
  • Wiki
  • design_mockups

design_mockups · Changes

Page history
Adicionado protótipos de baixa e alta fidelidade authored Oct 01, 2023 by Lucas Tashan Porto Ramos's avatar Lucas Tashan Porto Ramos
Hide whitespace changes
Inline Side-by-side
design_mockups.md
View page @ da1a25a8
|   [Início](home)   | [Cronograma](escopo) | [Procedimentos](processo) | Design_de_Telas | [Configuração](configuracao) | [Arquitetura](arquitetura) | [Banco_de_Dados](banco_dados) | [Qualidade](qualidade) | [Instruções_de_Uso](utilizacao) | | [**Home**](home) | [Escopo e Cronograma](escopo e cronograma) | [Processo](processo) | [Design/Mockups](design_mockups) | [Configuração](configuracao) | [Arquitetura](arquitetura) | [Código](codigo) | [BD](banco_dados) | [Qualidade](qualidade) | [Utilização](utilizacao) |
| -- | -- | -- | -- | -- | -- | -- | -- | -- | | :--------------: | :---------------------------: | :------------------: | :--------------: | :--------------------------: | :------------------------: | :--------------: | :---------------: | :--------------------: | :----------------------: |
# Design de Telas # Design de Telas
...@@ -8,3 +8,51 @@ ...@@ -8,3 +8,51 @@
Esta seção apresentará todos os estilos e telas pertinentes ao Design do Sistema, sejam eles escolhas do time ou solicitações dos Stakeholders. Esta seção apresentará todos os estilos e telas pertinentes ao Design do Sistema, sejam eles escolhas do time ou solicitações dos Stakeholders.
Tudo pode ser acessado através deste link: [**Link para o Figma**](https://www.figma.com/file/QvBOyiYxaZmlfgs4Fh9B6n/GID---ages?type=design&node-id=0-1&mode=design&t=qsladYXj2tmhyFOR-0). Tudo pode ser acessado através deste link: [**Link para o Figma**](https://www.figma.com/file/QvBOyiYxaZmlfgs4Fh9B6n/GID---ages?type=design&node-id=0-1&mode=design&t=qsladYXj2tmhyFOR-0).
## Mockups base do projeto
Os stakeholders vieram do Torneio Empreendedor realizado pelo IDEAR PUCRS, onde eles desenvolveram os mockups da sua aplicação. Esses mockups foram usados como base para os mockups desenvolvidos com mais detalhes pelo nosso time.\
Link do FIGMA do stakeholders: [Link](https://www.figma.com/proto/qQ6POVDClzCHkw38E8EF0M/GID?node-id=9-8&starting-point-node-id=9%3A8)
## Protótipo de baixa fidelidade
Inicialmente o time desenvolveu o protótipo de baixa fidelidade, para facilitar a visualização do fluxo de telas da aplicação. Abaixo está uma imagem com o protótipo de baixa fidelidade desenvolvido:\
![image](uploads/610c66824b77419f3750b51ee58a2233/image.png)
## Protótipo de alta fidelidade
Com base no protótipo de baixa fidelidade o time partiu para o Figma para desenvolver o protótipo de alta fidelidade, este com mais riqueza de detalhes. Como visto no protótipo de baixa fidelidade temos 3 fluxos de usuários: O fluxo de usuário comum, o de prestador de serviço e o administrador.
### Fluxo de usuário
#### Login
Abaixo o fluxo de login do usuário:
![image](uploads/6733cbc3be86030580aae0de0dfaccfa/image.png)
#### Primeiro acesso
Quando o usuário realiza o primeiro acesso, ele deve escolher o estado e a cidade em que ele está, para que os serviços que ele busca sejam da região que ele reside. Abaixo o fluxo de escolha de estado e cidade:\
![image](uploads/5f49e44501d280189effb125385d4324/image.png)
#### Navegando por Documentação
Após escolher sua cidade, o usuário pode buscar por orientações em sua jornada de documentação e transição. Abaixo o fluxo de documentações:\
![image](uploads/14cde4fdb49f1aeae86e6a7a60142aac/image.png)
#### Navegando por Serviços
O usuário também pode buscar por serviços como: psicologia, jurídico e etc. Abaixo o fluxo de serviços que o usuário pode acessar:\
![image](uploads/da65024195c06d892c0fdca81f4c07a9/image.png)
#### Navegando por Profissionais
Uma maneira alternativa para o usuário buscar por serviços. Abaixo o fluxo de profissionais que o usuário pode buscar:\
![image](uploads/63672fcd8ff8b995a49d9958c64a4920/image.png)
### Fluxo de prestador de serviço
#### Login e registro
O prestador de serviço pode fazer uma solicitação de cadastro de conta, a conta então é analisada pelo administrador do sistema, se aceita, o prestador de serviço poderá então fazer login nela. Abaixo o fluxo de cadastro de conta e login:\
![image](uploads/31d44b7c2c44d93255947e1ffbade5e6/image.png) \
![image](uploads/7406443f9a2897f11a5a27bc8f05bf3d/image.png)
#### Home
Após o login, temos então a tela home do prestador de serviço, onde ele vai poder cadastar/editar os seus serviços prestados. Abaixo o fluxo:\
![image](uploads/94a93dabac9b0b964e4964ab3d0d1d15/image.png)
### Fluxo do administrador
O administrador terá uma conta cadastrada direto no banco de dados, assim terá apenas o fluxo de login e realização de sua atividade de aceitar solicitações de cadastro de prestador de serviço, isso ele fará na sua home.
#### Home
![image](uploads/8c68b0453f7ee14492aba4ea78f26914/image.png)
\ No newline at end of file
Clone repository
  • arquitetura
  • banco_dados
  • codigo
  • design_mockups
  • escopo e cronograma
  • Home
  • processo