Anonymous Help

5W2H

What

• 1. Qual o nome do seu projeto?
  • Anonymous Help
• 2. Qual o objetivo deste projeto?
  • Criar um ambiente onde as pessoas possam se ajudar anonimamente no que se trata de seus problemas/preocupações
• 3. Quais os maiores desafios, na sua opinião, para se realizar este trabalho?
  • Pensando em marketing e engajamento, o desafio é fazer com que a comunidade web consiga aderir à plataforma de forma orgânica. Para isso, precisamos de uma plataforma inclusiva, responsiva e intuitiva, o que nos leva a pensar nos desafios técnicos do projeto. Como a maioria dos usuários de redes sociais interagem por meio de dispositivos móveis, precisamos desenvolver com o pensamento mobile-first, além de que, pensando nos mais diversos tipos de usuários, o desenvolvimento deverá ser feito pensando em inclusão digital. Quanto à linguagens, o desafio estará a cargo de compreender e dominar linguagens como HTML, CSS e JavaScript, além de frameworks e banco de dados que irão garantir a qualidade do projeto. Por fim, o sistema deve ser pensado de maneira escalável, para que, a medida que mais usuários forem captados, o sistema possa se comportar bem e de maneira eficiente. Além de policiar atitudes negativas (suporte 24 horas).
• 4. Quais os conhecimentos básicos (teorias) que devemos ter para se implementar este projeto?
  • Precisamos ter conhecimento de como a Web funciona, quais os diferentes protocolos que ela opera (HTTPS por exemplo) e como desenvolver para ela. Precisamos ter conhecimento de arquitetura de software, para pensar como vamos estruturar o sistema e o escopo em que iremos trabalhar. Precisamos ter conhecimento de hospedagem, tipos de servidores, domínio na web e outros recursos para manter a aplicação no ar. Precisamos ter conhecimento de linguagens e frameworks, e qual stack seria mais recomendada para o nosso tipo de sistema (Angular, React, NodeJS, MongoDB). Por fim, precisamos ter o conhecimento de como manter a aplicação no ar sem que haja quedas ou falhas
• 5. Quais soluções similares existem no mercado?
  • Há o Anonymous Online Chat, porém não existem soluções similares com o mesmo propósito do Anonymous Help no Brasil, mas pensando numa rede social, pode-se dizer que não seria muito diferente do Facebook, Instagram ou até mesmo o Twitter. O nosso diferencial é o foco: uma rede em que as pessoas pudessem interagir entre si, anonimamente, de forma a se ajudar compartilhando e ouvindo sobre experiências da vida e dificuldades que vêm vivenciando.

Why

• 1. Porque é interessante desenvolver este projeto?
  • O Anonymous Help é um projeto que visa incentivar pessoas a ajudarem outras pessoas. O interessante de desenvolvê-lo é o fato dos usuários poderem interagir anonimamente, assim, em teoria, sentirão mais liberdade de expressar seus problemas pessoais, fazendo com que seja mais fácil de serem ajudados. Além disso, o fato de serem compartilhados diversos tipos de problemas e preocupações fará com que as pessoas comecem a se pôr no lugar mais umas das outras, havendo uma chance de que se tenha mais respeito entre as pessoas.
• No seu projeto, precisará optar por algumas tecnologias, usar alguns hardwares e conversar com outros sistemas.

atuais ou não.

• • Sim.
• 2. Com relação às tecnologias, cite no mínimo 3 e explique a função de cada uma no seu projeto.
  • Com relação às tecnologias, por ser um desenvolvimento para web, teremos como base HTML, CSS e Javascript. A complexidade ficará a cargo dos frameworks e pré-processadores que darão estabilidade e segurança na codificação. Temos:
    • NodeJS: Node é um framework javascript que fará o papel do “backend” do sistema. Ele terá o papel de controlar acesso ao banco de dados, bem como processar entradas e gerar saídas para a camada de apresentação.
    • React: React é um outro framework baseado em JavaScript, mas que será utilizado na camada de apresentação. Como é muito famoso na construção de SPA’s, sendo usado em redes sociais como Instagram, utilizaremos esta solução.
    • Styled-Components: é um pré-processador de CSS. Sua função no nosso projeto será nos ajudar a desenvolver o estilo da página com mais agilidade e de forma padronizada, além de trabalhar bem com o React
    • PostgresSQL: Postgres é um banco de dados relacional gratuito. Por ser um projeto a principio acadêmico, este banco de dados suporta a carga e estresse gerado no sistema. Sua função no projeto será armazenar dados em tabelas que podem ou não ter relacionamentos entre si.
  • 3. Com relação ao hardware, cite no mínimo 3 e explique a função de cada um no seu projeto.
    • Discos para armazenamento -> Seja para armazenar a aplicação ou conteúdos da aplicação como imagens, dados de usuários, armazenamento é indispensável para a aplicação
    • Servidor com SO baseado em Linux -> estamos falando de uma aplicação web, e dado isso, faz-se necessário um sistema com SO capaz de hospedar a aplicação, fazendo o papel de servidor. É indicado que se use um SO baseado em Linux, por isso a escolha.
    • Provedor de Internet -> para que a aplicação seja acessada 24/7, é necessário que ela esteja online. Dado isso, o servidor deve estar conectado sempre à internet para que possa servir a aplicação aos usuários
• 4. Com relação aos sistemas, cite no mínimo 3 e explique a função de cada um no seu projeto.
  • Precisará ser usado um sistema de banco de dados, um sistema de informação transacionais e um sistema de informação gerenciais.
    • Sistema de gerenciamento de banco de dados: É um software que possui recursos capazes de manipular informações de banco de dados e interagir com o usuário.
    • Sistema de informação transacionais: Funciona para registrar informações de cada dia que alimentam o banco de dados para futuras consultas. No caso da plataforma da Anonymous Help registrará, em sua maioria logins, registro de lançamento de perguntas e registro de respostas para os problemas e/ou preocupações.
    • Sistema de informação gerenciais: Por meio das informações armazenadas pelo sistema de informação transacionais, é capaz de fazer consultas e gerar relatórios para os administradores, como a média de perguntas respondidas em uma semana e o total de novos usuários registrados por dia.

Who

• 1. Quem pode se beneficiar deste projeto?
  • Em suma, usuários padrões de redes sociais. O diferencial aqui, é o foco, assim como no LinkedIn onde pessoas se conectam com a finalidade de tratar de assuntos relacionados ao mercado de trabalho, o projeto da o foco em usuários que querem compartilha de suas preocupações e angústias, e também usuários com disposição à ajudar, criando uma espécie de rede do bem.
• 2. Quem poderá operar o sistema?
  • A equipe de administração do sistema, além dos usuários comuns, pessoas com acesso à internet e hardware mínimo para abrir um navegador padrão.
• 3. Quem deverá participar do desenvolvimento do sistema?
  • Idealmente, deve-se ter uma equipe de desenvolvimento, uma equipe de DevOps, uma equipe de testes, administradores de banco de dados, além de designers e pessoas com experiência em UX e UI.

Where

• 1. Por onde (hardware ou sistemas), os dados serão inseridos?
  • Por se tratar de um desenvolvimento web, os dados serão inseridos via navegador (forms com inputs cuidarão da captura) e serão entregues ao backend afim de serem processados e retornar uma saída
• 2. Onde (hardware ou sistemas), os dados serão externalizados?
  • Serão externalizados na própria aplicação, seja numa tela de perfil, ou numa timeline, dados de preferência não sensíveis, serão dispostos ao front-end dessa maneira.
• 3. Onde (em que dispositivos ou ambientes) esta aplicação poderá ser usada?
  • Idealmente, esta aplicação deve ser tratada como mobile-first, porém é necessário que se faça um port para Desktop. Dito isso, pode ser usada em SO's Android, iOS e qualquer navegador web, como Google Chrome, firefox, etc.
• 4. Onde os dados serão armazenados?
  • Os dados serão armazenados no mesmo local de hospedagem do backend. Porém, como trataremos imagens e arquivos, se faz necessário o uso de CDN's para otimizar a aplicação.
• 5. Onde o software deverá ser hospedado?
  • A hospedagem do software pode ser dividida em frontend e backend. O frontend pode ser hospedado utilizando um serviço de hospedagem mais barato e acessível, como o Netlify, por não tratar de processamento robusto e nem utilizar muito armazenamento. O backend exigirá um serviço de hospedagem um pouco mais robusto, e dentre as opções temos várias. Podemos usar o serviço de hospedagem da Digital Ocean, da AWS, do Google, dentre outros. Por fim é necessário o registro de um domínio, tendo vários serviços que provêem o mesmo, como o Google Domains.

When

• 1. Em quanto tempo (em semanas) pretende desenvolver o sistema?
  • Depende da equipe. Pensando em construir uma aplicação do 0, temos que levar em conta o design do UI e UX, levar em conta o tempo de planejamento, design do banco de dados, definição das tecnologias, e quantos recursos serão alocados em cada frente. Para se ter uma versão BETA da aplicação, possivelmente só depois de 6 meses.
• 2. Quais serão as fases e em quanto tempo cada uma?
  • Haverão diversas fases. Dentre elas:
    • Criação da identidade visual -> 2 semanas
    • Design da experiência de usuário -> 2 semanas
    • Modelagem do banco de dados -> 2 semanas
    • Definição das tecnologias utilizadas -> 1 semana
    • Desenvolvimento do Backend -> 4 semanas
    • Desenvolvimento do Frontend -> 4 semanas
    • Testes (Aceitação, integrado, ...) -> 3 semanas
    • Deploy para produção -> 1 semana
• 3. Qual o tempo de resposta do dispositivo ou do sistema, ou seja, quanto tempo acha razoável esperar por uma informação?
  • Deverá ter um tempo médio na casa de segundos. Se tratando de uma aplicação web, rede social em tempo real, o usuário espera ter resposta imediata da interação com a aplicação.
• 4. Se tiver investimento, quanto tempo acha razoável para pagar o financiamento?
  • Depende do acordo. Em torno de 1 ano para frente, até o momento em que a aplicação gerar renda, engajamento e um retorno financeiro em si.

How

• 1. Como será dividido o desenvolvimento do sistema?
  • Será dividido em uma espécie de MVC. Teremos a modelagem do banco de dados, o backend, cujo o plano inicial é utilizar javascript com o framework Node + Typescript, teremos o frontnd, com javascript utilizando React + typescript. Além disso, temos toda a parte de planejamento, design, deploy e sustentação, garantindo uma aplicação segura, desenvolvimento saudável, e mantutenção sem custos absurdos.
• 2. Como será feita a entrada de dados?
  • Será feita através de inputs espalhados pela aplicação, capturados através de tags forms e inputs, enviados ao backend.
• 3. Como será feita a saída de dados?
  • Será feita através de componentes visuais expostos ao usuários, tal como tela de perfil, cadastro, timeline, etc.
• 4. Descreva a 1a. funcionalidade?
  • Cadastro: Usuário entrará com dados válidos, o frontend fará um pré-processamento e enviará ao backend, que fará um processamento maior, e irá gerar uma saída.
• 5. Descreva a 2a. funcionalidade?
  • Login: Usuário entrará com dados válidos, o frontend fará um pré-processamento e enviará ao backend, que fará um processamento maior, gerando uma sessão utilizando um token, gravando os dados do mesmo no localstorage do navegador
• 6. Descreva a 3a. funcionalidade?
  • Esqueci minha senha: Usuário entrará com o email, e o sistema enviará instruções sobre como resetar a sua senha
• 7. Descreva a 4a. funcionalidade?
  • Edição de perfil: Usuário terá a liberdade de editar algumas informações pessoas referentes ao seu cadastro
• 8. Descreva a 5a. funcionalidade?
  • Autenticar usuário: Ao criar a conta, o usuário deverá realizar a autenticação da conta
• 9. Descreva a 6a. funcionalidade?
  • Excluir conta: Se quiser ou precisar, o usuário poderá excluir sua conta
• 10. Descreva a 7a. funcionalidade?
  • Publicar: O usuário poderá fazer publicações em formato de textos
• 11. Descreva a 8a. funcionalidade?
  • Responder publicação: Um usuário poderá responder a publicação de outro
• 12. Descreva a 9a. funcionalidade?
  • Compartilhar publicação: Um usuário poderá compartilhar a publicação de outro
• 13. Descreva a 10a. funcionalidade?
  • Favoritar perfil: Usuário poderá favoritar o perfil de outro
• 14. Descreva a 11a. funcionalidade?
  • Visualizar notificações: Usuário terá um lougar onde visualizará as notificações
• 15. Descreva a 12a. funcionalidade?
  • Alterar descrição: O usuário poderá atualizar a descrição de perfil
• 16. Descreva a 13a. funcionalidade?
  • Buscar: O usuário poderá buscar outros usuários em um campo "Busca"
• 17. Descreva a 14a. funcionalidade?
  • Logout: O usuário poderá sair de sua conta a qualquer momento
• 18. Descreva a 15a. funcionalidade?
  • Bloquear Usuário: O usuário poderá bloquear qualquer outro usuário
• 19. Descreva a 16a. funcionalidade?
  • Excluir publicação: O usuário poderá excluir qualquer publicação que já tenha feito
• 20. Descreva a 17a. funcionalidade?
  • Visualizar favoritos: O usuário poderá ver todos os perfis favoritos que já tenha salvo
• 21. Descreva a 18a. funcionalidade?
  • Visualizar pontuação: O usuário poderá ver a sua pontuação recebida pelos seus comentários
• 22. Descreva a 19a. funcionalidade?
  • Visualizar perfis: O usuário poderá ver os perfis de todas as pessoas, incluindo o próprio
• 23. Descreva a 20a. funcionalidade?
  • Banir Usuário: O administrador poderá banir qualquer usuário que violar as regras da plataforma
• 24. Descreva a 21a. funcionalidade?
  • Silenciar Usuário: O administrador poderá deixar qualquer usuário inativo por tempo determinado como forma de punição de violar as regra da plataforma

How much

• 1. Quanto custa cada parte do sistema?
  • Criação do site: R$ 64.000,00
  • Registro de domínio: Em torno de R$ 50,00 anuais;
  • Hospedagem de site: Valor entre R$ 185,00 e R$ 210,00 ao ano;
• 2. Quanto deverá custar todo o sistema?
  • Implementação do sistema: R$ 96.000,00
  • Manutenção do sistema (por ano): Será em torno de R$ 385.000,00
• 3. Quantas pessoas deverão ser usadas (Equipe) ?
  • Será necessário 8 pessoas:
    • Um Web designer, um Analista de sistemas, um Arquiteto de software, dois Desenvolvedores, um Analista de banco de dados e dois Analista de testes.
• 4. Quanto custa cada profissional?
  • Web designer: R$ 1800,00
  • Analista de sistemas: R$ 3200,00
  • Arquiteto de software: R$ 8000,00
  • Desenvolvedores: R$ 4800,00
  • Analista de banco de dados: R$ 3000,00
  • Analista de testes: R$ 3400,00
• 5. Qual deverá ser o preço de aquisição do seu software para o usuário final (Valor de mercado)?
  • Os usuários poderão usar o sistema de maneira gratuita, porém, terão a opção de fazer uma assinatura premium para obter vantagens e mais recursos no sistema por apenas R$ 5,90 ao mês.

Canvas

• Arquivo:Canvas - Anonymous Help.pdf

DFD

• Arquivo:DFD - Anonymous Help.pdf

DER

Requisitos Funcionais

• RF01 - Criar Usuário
  • Não sendo um usuário cadastrado no site, devo ter a funcionalidade de realizar o meu cadastro no mesmo, passando as informações de: Nome, Avatar, Email e Senha. E com isso, em caso de sucesso, exibir uma mensagem informando que o Cadastro foi realizado. Caso contrário, exibir uma mensagem de erro no cadastro.

• RF02 - Autenticação do Usuário
  • Ao tentar realizar o login no site, informando email e senha, o sistema deve utilizar algum método de autenticação desse usuário, para garantir a segurança do sistema, e em caso de sucesso, permitir o login do usuário no site. Caso contrário, exibir uma mensagem informando que os dados estão incorretos.

• RF03 - Atualização do Avatar
  • Ao realizar o login no site, informando email e senha, e estar autenticado, o usuário tem a opção de atualizar o seu Avatar, clicando na opção de atualizar o avatar, é exibido a tela no qual ele sera capaz de anexar a nova imagem, e após salvar, exibir a mensagem de que seu avatar foi alterado com sucesso, caso contrário, exibir a mensagem de erro.

• RF04 - Atualização de dados do Usuário
  • Ao realizar o login no site, informando email e senha, e estar autenticado, o usuário tem a opção de atualizar os seus dados, clicando na opção de atualizar seu perfil, é exibido a tela no qual ele sera capaz de alterar os campos que usou para cadastrar sua conta, e após salvar, exibir a mensagem de que seus dados foram alterados com sucesso, caso contrário, exibir a mensagem de erro.

• RF05 - Criação de post
  • Ao realizar o login no site, informando email e senha, e estar autenticado, o usuário tem a opção de criar os seus posts, escrevendo na caixa de texto o que deseja publicar e em seguida clicando em salvar, será exibido em sua timeline seu novo post junto aos demais posts, caso ele tenha mais de um.

• RF06 - Listagem de post
  • Ao realizar o login no site, informando email e senha, e estar autenticado, o usuário tem em sua timeline, a listagem contendo todos os seus posts realizados até o momento.

• RF07 - Criação de Interface Visual Interativa
  • Site deve conter uma interface visual clara e objetiva, com cores leves e alegres, para causar uma boa impressão em quem o utilize.

• RF08 - Buscar Usuário
  • O usuário poderá buscar outros usuários em um campo de busca, e se encontrar, exibir o usuário encontrado, caso contrário, exibe a mensagem de erro.

• DFD:
  • Arquivo:DFD - Anonymous Help.pdf