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 1
    • Issues 1
    • 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
  • Easy Choose
  • Wiki
  • Wiki
  • design_mockups

Last edited by Lorenzo Turcato Oliveira Jun 17, 2024
Page history

design_mockups

Home Escopo Processos Design e Mockups Configuração Arquitetura Gerência Código Banco de Dados Qualidade

Essa seção contempla os protótipos desenvolvidos para o projeto EASY CHOOSE.

Protótipos de Baixo Nível (Excalidraw)

Link: https://excalidraw.com/#room=324ddf9a261277182d44,9TKc9rZOvZo5xRsZcnnYrg

Primeiramente, optamos por desenvolver os protótipos em baixo nível para esboçar uma ideia inicial dos fluxos e da estruturação das telas. Para isso, foi usado o Excalidraw, uma ferramenta específica para desenvolver protótipos de baixa fidelidade. A figura a seguir ilustra os resultados obtidos:

image

Protótipos de Alto Nível (Figma)

Link: https://www.figma.com/file/HgjNSM8GDnEhqze3qKanyZ/EASY-CHOOSE-Mockups-(MaterialUI)?type=design&node-id=4213-1335&mode=design&t=X0vGllL8OMoo12Kb-0

Após criados os protótipos de baixo nível, a equipe se mobilizou para começar os protótipos de alto nível na ferramente Figma com base nos protótipos de baixa fidelidade. Inicialmente optamos por um design neutro, que seguia a identidade visual existente do EASY CHOOSE:

image

Porém, após apresentar as telas desenvolvidas aos clientes ao final da Sprint 0, estes solicitaram mudanças para que as telas fosse mais visualmente apelativas, mais vibrantes, para que os usuários tivessem a sua atenção prendida. Levando isso em conta que decidimos optar por utilizar cores verdes, que remetem a um estilo de vida saudável, e os resultados podem ser vistos na figura abaixo:

image

Além, disso também criamos protótipos de telas para os painéis de lojista e administrador, os quais mantiveram o aspecto neutro e foram aceitos de primeira vista pelos clientes:

  • Painel do Lojista image

  • Painel do Administrador image

Dump Figma

O arquivo contendo todo o projeto Figma pode ser baixado por aqui

Clone repository
  • Banco de Dados
  • arquitetura
  • codigo
  • configuracao
  • design_mockups
  • escopo
  • gerencia
  • Home
  • processos
  • qualidade