Atarefados

O Atarefados foi meu projeto de conclusão de curso em Design na UFES, defendido em outubro de 2021. A ferramenta foi desenvolvida para auxiliar designers a estimar o tempo gasto em seus projetos, utilizando o método de gestão de tarefas GTD (Getting Things Done).

A ideia da plataforma é permitir estruturar e categorizar tarefas já realizadas, gerando estimativas de tempo para novas atividades com base na experiência prévia do usuário. Assim, ajuda a reduzir a ansiedade e melhorar o planejamento, alinhando-se aos princípios do GTD. O principal intuito é ajudar designers no início da carreira a dimensionar seus projetos e com base nisso conseguir precificar seu trabalho de maneira justa.
Atualmente, o Atarefados possui uma MVP disponível online que já está funcional para múltiplos usuários. Ao realizar o login, os usuários conseguem cadastrar suas tarefas realizadas e, com base nos dados inseridos, visualizam uma estimativa do tempo necessário para concluir tarefas futuras, considerando a duração média das tarefas anteriores. Além disso, é possível gerar relatórios que oferecem uma visão geral dos projetos em andamento, categorizados por cliente e tipo.

O desafio

O principal desafio do projeto foi transformar os princípios do método GTD (Getting Things Done) em uma interface intuitiva e funcional. Envolvendo tanto o design da experiência do usuário quanto a implementação do código da plataforma, garantindo que a ferramenta refletisse a estrutura e a lógica do método de forma acessível e eficiente. O objetivo era entregar um MVP totalmente utilizável, onde todas as funções essenciais estivessem utilizáveis e alinhadas à proposta inicial.

Informações do projeto

📌 Período:

Setembro de 2020 a outubro de 2021

 

⚠️ Restrições:

A principal restrição do projeto foi o tempo. Todo o desenvolvimento da MVP e a redação do TCC precisaram ser concluídos em apenas dois semestres, exigindo uma abordagem ágil e foco na entrega das funcionalidades essenciais dentro do prazo.

 

🛠️ Tecnologias utilizadas:

Adobe XD, HTML, CSS, JavaScript, Bootstrap, PHP, MySql.

 

🎯 Minha atuação:

Sob a orientação do professor responsável, conduzi todas as etapas do projeto, incluindo pesquisa, concepção da interface, desenvolvimento do código e documentação do TCC.

O processo

Desk research e benchmarking:

Para embasar o desenvolvimento da plataforma, realizei uma revisão de literatura sobre o método GTD (Getting Things Done) e analisei o Guia para Dimensionamento de Projetos da ADG Brasil (Associação de Designers Gráficos do Brasil). A partir desses estudos, elaborei uma lista com 11 critérios para avaliar as principais ferramentas utilizadas por designers no gerenciamento de tarefas:

 

Critérios do Guia ADG

1. Permitir que o usuário estime o prazo de execução do projeto.

2. Considerar a experiência do designer no cálculo de tempo.

3. Possibilitar a inserção ou cálculo do custo/hora do designer.

Critérios do Método GTD

 4. Permitir listar as tarefas pendentes e em andamento.

 5. Possibilitar a definição de datas para as tarefas.

 6. Incluir a funcionalidade de “próximas ações”.

 7. Permitir a inserção ou estimativa do tempo de execução de cada tarefa.

Critérios técnicos e gerais

 8. Ser acessível via web.

 9. Oferecer funcionalidade offline.

 10. Disponibilizar interface em português.

 11. Garantir que todas as funcionalidades sejam gratuitas.

 

Dentre esses critérios, os mais relevantes para este projeto foram os de número 3, 7 e 8, pois garantem a aplicação dos princípios do GTD para gestão de tempo em ferramentas acessíveis de qualquer lugar.

 

A análise dos critérios mostrou que o Post-it foi a ferramenta mais alinhada aos requisitos, oferecendo flexibilidade para diferentes métodos de organização. Em seguida, o Clockify destacou-se pelo registro preciso do tempo de execução, mas com a limitação do idioma (na época da análise disponível apenas em inglês). 

Nenhuma das ferramentas analisadas gerava previsões automáticas de tempo com base em dados anteriores, e poucas consideravam a experiência prévia do designer. Com base nesses resultados, a plataforma Atarefados foi projetada para integrar essas funcionalidades, oferecendo um gerenciamento de tarefas mais completo e adaptado às necessidades dos designers. A partir da analise foi definido o escopo do projeto

Definição de Escopo
  • Inclusão de campo para o usuário inserir o tempo gasto em cada tarefa.

  • Permitir edição e inserção de novas tarefas a qualquer momento.

  • Possibilidade de registrar múltiplos períodos de tempo para uma mesma tarefa, usando a funcionalidade “continuar tarefa”.

  • Exibição de relatórios detalhados.

  • Estimativa da duração de tarefas futuras baseada nos dados inseridos.

  • Padronização de tarefas, clientes e projetos através de cadastro.

  • Ferramenta gratuita e em Português

Arquitetura da Informação

Após o estudo, foi iniciado o desenvolvimento da interface e do sistema. A arquitetura foi definida com base em um mapa de fluxo, delineando a estrutura das páginas. A jornada do usuário segue a seguinte sequência:

  • Acesso inicial ao site com explicação sobre o sistema, login ou cadastro.

  • Criação obrigatória de cliente, tipo e projeto após o primeiro login.

  • Redirecionamento para a página “painel”, onde o usuário pode visualizar as tarefas cadastradas ou a mensagem de ausência de tarefas. A aba de criação de tarefas será aberta, com acesso à opção de continuar tarefas e menu lateral com links para outras páginas: relatórios, tipos, clientes, projetos e editar perfil.

Prototipação e Construção de Design System

Após definir a arquitetura, foi criado um protótipo inicial no Adobe XD, que auxiliou na definição da hierarquia de informações e na definição dos padrões gráficos. 

A escolha dos ícones foi baseada na biblioteca Boxicons, pela sua gratuidade e facilidade de uso. Para a tipografia, optou-se por uma fonte padrão sem serifa, buscando legibilidade e simplicidade. A paleta de cores foi cuidadosamente selecionada para conferir ao sistema uma sensação dinâmica e amigável, utilizando roxo, laranja e cinza, garantindo tanto boa legibilidade quanto uma hierarquia visual clara.

Botões: Botões primários em laranja com texto branco, e ao passar o mouse, fundo roxo. Botões secundários com borda laranja e fundo transparente, mudando para laranja com texto branco ao passar o mouse.

 

Menu: Fundo roxo com ícones brancos, destacando a página atual com uma caixa branca de bordas arredondadas e opacidade de 20%.

Abas: Abas de “Criar” e “Continuar Tarefa” com fundo roxo, diferenciando da área de listagem de tarefas, que usa fundo branco.

Textos e Links: Texto em cinza, com destaque em laranja para elementos importantes, como links.

Desenvolvimento

A MVP foi construída com HTML, CSS, PHP, JavaScript e MySQL. O banco de dados relacional MySQL armazena os dados em tabelas, acessados e manipulados através de SQL para garantir integridade e eficiência no gerenciamento de informações.

Gravei este vídeo para compartilhar com os participantes de um teste piloto da plataforma, nele dou um contexto maior sobre o funcionamento da plataforma.  🙂 

Ela também pode ser acessada em: https://www.atarefados.com.br/

Desafios e possibilidades futuras:

Um dos maiores desafios durante o desenvolvimento deste projeto foi a construção do código, especialmente ao utilizar as linguagens PHP e JavaScript, com as quais eu tinha pouca experiência prévia. Minha familiaridade com essas linguagens foi limitada a uma breve introdução durante uma disciplina da minha primeira graduação, o que demandou um esforço extra para superar a curva de aprendizado e garantir a funcionalidade adequada da ferramenta.

Sempre que necessário, continuo utilizando a ferramenta para aprimorá-la e torná-la mais robusta, com o objetivo de liberar o uso para um número maior de usuários. Algumas das possibilidades futuras que vejo são permitir o planejamento das tarefas com estimativas das etapas do projeto, tornar os relatórios mais abrangentes, e implementar um cálculo de tempo estimado mais preciso, considerando diversas variáveis, como o tipo e o projeto selecionado. Além disso, uma possibilidade também seria integrar IA generativa para realizar previsões simuladas, oferecendo aos usuários estimativas mais dinâmicas e ajustadas conforme o comportamento do projeto.

 
Identidade Visual

Magalhães e Martins

O projeto se inicio de uma demanda da Amanda e do Filipe de atualizar o site e deixar ele mais moderno e traduzindo melhor o trabalho que eles desempenham atualmente, visto que o site tinha sido desenvolvido a muitos anos.

Veja o projeto »
UX/UI

Atarefados

No Atarefados ao cadastrar suas tarefas, você indica no campo duração o tempo que demorou para finaliza-las e a partir deste, a plataforma te dará uma previsão de quanto tempo você precisara para finalizar novas tarefas.

Veja o projeto »
UX/UI

Acesso cidadão

O redesign do portal do acesso cidadão foi um projeto de pesquisa da Prodest realizado em parceria com o LOOP – Ufes. O projeto consistiu na avaliação e desenvolvimento de uma proposta de melhoria para a interface do Acesso cidadão.

Veja o projeto »