- 1. Resumo do projeto
- 2. Definição de produto
- 3. Histórias de usuário
- 4. Desenho da Interface de Usuário
- 5. Testes manuais e de usabilidade
- 6. Considerações Técnicas
O projeto Burguer Queen foi o quarto projeto desenvolvido no bootcamp da Laboratoria. O seu principal objetivo era aprender a construir uma interface web usando o framework React. Dessa forma, deveria-se desenvolver uma interface para uma hamburgueria, com o objetivo de realizar pedidos utilizando um tablet, e enviá-los para a cozinha para que sejam preparados de forma ordenada e eficiente. O projeto deveria ter duas áreas: interface (cliente) e API (servidor), de modo que a interface se integrasse com a API.
A partir disso, desenvolveu-se uma interface web para a Hamburgreen: a sua eco-hamburgueria predileta. A Hamburgreen é uma hamburgueria 100% eco-friendly pensada na sustentabilidade do planeta e construída para fazer não somente o seu cliente feliz, mas a natureza também. Ela utiliza energias renováveis de usinas solares e de biogás do Piauí; todos os seus materiais são recicláveis e todo o lixo gerado é descartado de acordo com as normas de reciclagem.
Hamburgreen: a sua eco-hamburgueria predileta. A Hamburgreen é uma hamburgueria 100% eco-friendly pensada na sustentabilidade do planeta e construída para fazer não somente o seu cliente feliz, mas a natureza também. Ela utiliza energias renováveis de usinas solares e de biogás do Piauí; todos os seus materiais são recicláveis e todo o lixo gerado é descartado de acordo com as normas de reciclagem.
"Eu, como garçom/garçonete quero entrar no sistema de pedidos."
O que deve acontecer para satisfazer as necessidades do usuário?
- Acessar uma tela de login.
- Inserir email e senha.
- Receber mensagens de erros compreensíveis, conforme o erro e as informações inseridas.
- Entrar no sistema de pedidos caso as credenciais forem corretas.
O acordado abaixo deve acontecer para dizer que a história está terminada:
- Você deve ter recebido code review de pelo menos uma parceira.
- Fez testes unitários e, além disso, testou seu produto manualmente.
- Você fez testes de usabilidade e incorporou o feedback do usuário.
- Você deu deploy de seu aplicativo e marcou sua versão (tag git).
"Eu como garçom/garçonete quero poder anotar o pedido de um cliente para não depender da minha memória, saber quanto cobrar e poder enviar os pedidos para a cozinha para serem preparados em ordem."
O que deve acontecer para satisfazer as necessidades do usuário?
- Anotar o nome do cliente.
- Adicionar produtos aos pedidos.
- Excluir produtos.
- Ver resumo e o total da compra.
- Enviar o pedido para a cozinha (guardar em algum banco de dados).
- Funcionar bem em um tablet.
O acordado abaixo deve acontecer para dizer que a história está terminada:
- Você deve ter recebido code review de pelo menos uma parceira.
- Fez testes unitários e, além disso, testou seu produto manualmente.
- Você fez testes de usabilidade e incorporou o feedback do usuário.
- Você deu deploy de seu aplicativo e marcou sua versão (tag git).
"Eu como chefe de cozinha quero ver os pedidos dos clientes em ordem, poder marcar que estão prontos e poder notificar os garçons/garçonetes que o pedido está pronto para ser entregue ao cliente."
- Ver os pedidos ordenados à medida em que são feitos.
- Marcar os pedidos que foram preparados e estão prontos para serem servidos.
- Ver o tempo que levou para preparar o pedido desde que chegou, até ser marcado como concluído.
- Você deve ter recebido code review de pelo menos uma parceira.
- Fez testes unitários e, além disso, testou seu produto manualmente.
- Você fez testes de usabilidade e incorporou o feedback do usuário.
- Você deu deploy de seu aplicativo e marcou sua versão (tag git).
"Eu como garçom/garçonete quero ver os pedidos que estão prontos para entregá-los rapidamente aos clientes."
- Ver a lista de pedidos prontos para servir.
- Marcar os pedidos que foram entregues.
- Você deve ter recebido code review de pelo menos uma parceira.
- Fez testes unitários e, além disso, testou seu produto manualmente.
- Você fez testes de usabilidade e incorporou o feedback do usuário.
- Você deu deploy de seu aplicativo e marcou sua versão (tag git).
- Os dados devem ser mantidos intactos, mesmo depois que um pedido for finalizado. Tudo isso para poder ter estatísticas no futuro.
O protótipo de alta fidelidade foi construído utilizando a ferramenta Figma. Você pode conferí-lo inteiramente aqui.
Na elaboração do protótipo, foram realizados algumas alterações e incorporações após receber feedbacks de melhoria de usuários. Dentre elas, estão:
- Aumentar o tamanho dos botões;
- Trocar a cor de fundo para um preto que não seja a cor pura, para evitar cansar a vista do usuário;
- Mudança na ordem de apresentação dos pedidos da cozinha para que fique mais intuitiva;