Terceiro projeto realizado para o Bootcamp da Laboratória. O objetivo consiste em uma rede social responsiva destinada a unir mulheres na tecnologia. O projeto permite a interação das usuárias através da criação de postagens, curtidas, edição e exclusão das mesmas. As usuárias acessam a aplicação através da criação de contas e login autenticados pelo Firebase. Todo o desenvolvimento foi realizado em SPA, Mobile First e com 100% de cobertura nos testes.
Acesse o projeto: aqui.
Desenvolvido por
Patricia Adania de Oliveira
Linkedin | Github
Angelina Melo
Linkedin | Github
Ana Leticia B. Prince
Linkedin | Github
- 1. Definição de Produto 🗒️
- 2. Histórias de Usuários 📌
- 3. Protótipo Versão Desktop 📽️
- 4. Protótipo Versão Mobile 📽️
- 5. Interface💻
- 6. Testes 📊
- 7. Checklists de Objetivos Alcançados 🏆
O projeto desenvolvido visa atender mulheres que estão no meio tecnológico, proporcionando um apoio mútuo onde as usuárias se sintam acolhidas, compartilhem suas vivências e possam ser apoio uma das outras. Assim, Code Girls proporciona uma troca de experiências de suma importância para o crescimento profissional e pessoal de todas.
Após análise dos requisitos do projeto e também do cenário escolhido para o desenvolvimento da aplicação, criou-se as histórias de usuários.
Tela 1: Histórias de usuários.
Desenvolveu-se protótipos de alta fidelidade usando o Figma. Para isso, foi pensado em todas as interações das usuárias na aplicação, para que assim, pudessem ter autonima na utilização da mesma.
Tela 1: Tela inicial de login para desktop.
Tela 2: Tela de cadastro.
Tela 3: Tela inicial após login da usuária.
Tela 4: Tela de publicação.
A responsividade da aplicação foi inserida desde o início com os conceitos de Mobile First. Para isso, adaptamos toda a aplicação para telas menores e para que a experiência das usuárias não fossem afetadas e permanecessem com as mesmas funcionalidades da versão desktop.
Tela 1: Tela de cadastro e login versão mobile.
Tela 2: Demais telas versão mobile.
A interface levou em conta todas as histórias de usuários desenvolvidas bem como a fidelidade ao protótipo criado.
Tela 1: Tela principal da aplicação desenvolvida.
O projeto foi entregue com 100% de cobertura dos testes. Utilizou-se mocks para a realização dos testes das funções do Firebase.
Tela 1: Testes realizados.
- [:star2:] Usar VanillaJS.
- [:star2:] UI: É responsivo.
- [:star2:] Passa pelo linter.
- [:star2:] Passa pelos testes (npm test).
- [:star2:] Ser uma Single Pages Application (SPA).
- [:star2:] Inclui histórias de usuário no README.md.
- [:star2:] Autenticação com Firebase e uso do Firestore.
- [:star2:] Inclui uma definição de produto clara e informativa no README.md.
- [:star2:] Inclui rascunho da solução (protótipo de alta fidelidade) no README.md.
- [:star2:] Atender ao CRUD (Create, Reade, Update and Delete) utilizando o Firebase.
- [:star2:] Testes unitários cobrem um mínimo de 70% de statements, functions, lines e branches.