Project management platform
Projeto plataforma de gestão de projetos
VISÃO GERAL
Este projeto surgiu como um exercício para testar minhas habilidades em Figma, experiência do usuário, criação de interfaces. Dele surgiu um arquivo completo contendo três páginas, um style guide robusto e uma documentação detalhada.
PAPEL DESEPENHADO
Design UX/UI, UX Reasearch, Design de Materiais
FERRAMENTAS UTILIZADAS
Figma, Font Awesome, Font Brief, Adobe Colors
2023
Fase inicial de estudos
O ponto de partida para o início do projeto consistiu em uma fase extensa de idealização e pesquisa. Um amplo estudo de referências e análise da concorrência no mercado foi conduzido, visando compreender os elementos essenciais que uma plataforma de gerenciamento de projetos de qualidade deve abranger em sua estrutura, bem como a melhor maneira de apresentar tais informações e funcionalidades ao usuário final. A partir dessas informações, elaborei listas detalhadas para orientar o processo de criação das interfaces.
Wireframing
Com base na pesquisa mencionada anteriormente, desenvolvi os primeiros wireframes, buscando abranger todos os insights e antecipando considerações sobre a interface e o layout. A partir desse ponto, o processo envolveu aprimorar os wireframes para otimizar a apresentação das informações e distribuí-las de maneira mais eficaz nas telas.
Fontes
A fonte DM Sans foi escolhida para manter a consistência da abordagem leve escolhida, preservando ao mesmo tempo o nível de simplicidade, legibilidade e clareza.
Cores
Uma plataforma de gestão de projetos destina-se a um uso frequente e, para muitos profissionais, representa a principal ferramenta de trabalho. Considerando essa natureza, desenvolvi uma paleta de cores baseada em tons suaves, evitando causar fadiga visual ou mental ao usuário após exposição prolongada. Dessa abordagem, originou-se uma paleta predominantemente composta por tons neutros de branco e cinza, com inclinação para nuances mais frias. As demais cores foram selecionadas para proporcionar contraste quando necessário, sem, no entanto, sobrecarregar o usuário.
Style Guide
Com as cores, tipografia e os primeiros wireframes definidos, dei início à elaboração do guia de estilo, desenvolvendo estilos e componentes que seguem a temática de leveza e clareza previamente estabelecida. Nele foi incluído vários componentes como ícones, variantes de botões e inputs utilizados e toda a estrutura do menu lateral.
Telas finais
Após a conclusão do guia de estilo, elaborei as telas finais, implementando o layout e disposição previamente desenvolvidos nos wireframes. Além disso, apliquei os estilos e componentes definidos no guia de estilo para assegurar consistência entre todas as telas.
Conclusões
Este projeto foi um exercício bastante válido para testar minhas habilidades. Foi bastante gratificante observar as telas e os conceitos tomando forma de forma gradativa desde a pesquisa inicial até a criação das telas finais.