Caso de estudo
Tanque
Cheio
O Tanque Cheio surgiu de um desafio acadêmico de criar uma startup em 3 meses. A equipe desenvolveu a ideia do Tanque Cheio para facilitar a vida dos motoristas, fornecendo informações em tempo real sobre postos de gasolina e preços de combustível. O objetivo não era apenas criar um projeto inovador, mas também aplicar conceitos de empreendedorismo e desenvolvimento de negócios na prática.
O Processo
O Processo de design foi separado por partes, sendo elas:
-
Research
-
Pesquisa quantitativa (Pesquisa geral com os possíveis usuários da aplicação)
-
Análise competitiva (Pesquisa sobre os pontos fortes e fracos dos concorrentes)
-
Persona (Definição básico sobre os possíveis usuários)
-
Storyboard (Um guia básico sobre os caminhos que o usuário irá percorrer na aplicação)
-
-
Prototipagem
-
Wireframes (Esboço do projeto)
-
Protótipo funcional (Protótipo básico para validarmos o projeto)
-
-
UI Design
-
Conceito visual
-
Design System
-
Protótipo interativo
-
-
Teste
-
Teste com usuário
-
Feedback e correções
-
Pesquisa Quantitativa
Seguindo todo o processo realizamos a pesquisa quantitativa, onde obtivemos 92 respostas com perguntas variadas, dentro delas tivemos os seguintes pontos:
-
Idade: O nosso público alvo não teria nenhuma distinção de idade.
-
Veículo: O nosso público alvo seriam os donos de algum tipo de veículo.
-
Escolha do posto: A maior porcentagem de todos os entrevistados disse que os maiores motivos de escolha do posto de combustível seriam preços, origem do combustível e a fidelidade do posto.
Análise Competitiva
Durante a análise, buscamos todos os possíveis competidores, diretos ou indiretos e com isso, montamos uma planilha do que a aplicação faz bem feito ou não.
Persona
Visando as pesquisas feitas, colocamos todos os dados e definimos como seria a persona do aplicativo
Storyboard Geral e Close-Up
Realizamos os 2 storyboards, um geral e um close-up, onde o geral seriam uma representação do momento em que a nossa persona iria utilizar o aplicativo e o close-up seria o uso durante a aplicação, ambos realizados no papel para ser algo mais rápido para realizar.
Wireframes
Wireframes de baixa fidelidade
Wireframes de baixa fidelidade criados no papel para um desenvolvimento mais rápido e proporcionar diferentes ideias, para uma decisão de conceito do produto.
Wireframes de média fidelidade
Wireframes de média fidelidade criados no Figma permitindo uma visualização mais precisa das interações e layout do produto
Wireframes de alta fidelidade
Protótipos de alta fidelidade realizados no Figma.
Design System: Cores e Tipografia
O vermelho e o amarelo são ideais para o app de combustível, transmitindo energia e urgência, essenciais para ajudar os usuários a economizar na compra e localizar o posto mais próximo. Essas cores garantem visibilidade, destacando informações importantes e reforçando a experiência prática e ágil do app.
A escolha da tipografia Made Tommy para o app de combustível complementa a proposta de clareza e modernidade no design. Com suas linhas limpas e legibilidade elevada, essa fonte facilita a leitura rápida, essencial para motoristas que precisam de informações claras e acessíveis em movimento. A estrutura robusta da Made Tommy transmite confiabilidade, enquanto seu estilo moderno alinha-se à identidade visual do app, reforçando a sensação de praticidade e agilidade no uso.
Protótipo Final
Considerações Finais
O desenvolvimento da aplicação começou simultaneamente à criação dos protótipos devido ao prazo final curto e ao tamanho reduzido da equipe. Por esse motivo, não foi possível realizar testes de usabilidade com usuários durante o processo.
No dia da apresentação, o projeto foi bem recebido, reconhecido como promissor e garantiu a nota máxima. Embora ainda houvesse ajustes a serem considerados, como a estrutura do banco de dados, a aplicação foi amplamente elogiada pela sua proposta e execução.
Veja mais projetos
