Technologia Simplificata
Introdução
Este documento especifica os requisitos do sistema Technologia Simplificata, fornecendo aos stakeholders e desenvolvedores as informações necessárias para o projeto e implementação, assim como para a realização dos testes e homologação do sistema.
O projeto consiste na criação de um sistema web voltado à área de Educação. O seu objetivo principal é apresentar conteúdos relacionados a disciplinas do curso de Ciência da Computação, de forma simples, didática e direta.
Equipe de Desenvolvimento
Gabriela Cavalcante
Produto, Front-End e Design
@gabrielacvcnt
Hugo Porto
Back-End
@hugobp51
Personas
Ana, a Estudante Universitária
  • Descrição:
  • Ana tem 21 anos e está cursando o segundo ano de Ciência da Computação em uma universidade local. Ela está interessada em aprofundar seus conhecimentos sobre programação e desenvolvimento web.
  • Necessidades e Objetivos:
  • Ana busca por materiais didáticos e de fácil compreensão que complementem suas aulas na universidade.
  • Ela procura por cursos online que abordem temas específicos da área de Ciência da Computação, como algoritmos, estruturas de dados e linguagens de programação.
  • Comportamento no Site:
  • Ana passa bastante tempo navegando pelo site, explorando os diferentes conteúdos oferecidos e lendo as descrições detalhadas de cada um.
  • Ela está interessada em se inscrever no newsletter do site para receber atualizações sobre novos cursos e conteúdos relevantes.
Pedro, o Profissional Autodidata
  • Descrição:
  • Pedro tem 30 anos e trabalha como desenvolvedor de software em uma empresa de tecnologia. Ele é autodidata e está sempre em busca de novos recursos para aprimorar suas habilidades.
  • Necessidades e Objetivos:
  • Pedro está interessado em aprender novas tecnologias e técnicas de programação que possam ser aplicadas em seu trabalho.
  • Ele busca por cursos e materiais de estudo que sejam diretos e focados em resultados práticos.
  • Comportamento no Site:
  • Pedro acessa o site em busca de cursos específicos que possam ajudá-lo a resolver problemas ou aprender sobre tecnologias emergentes.
  • Ele está interessado em recursos adicionais, como links para videoaulas e materiais de estudo complementares, que possam aprofundar seu aprendizado.
Gabi, a Professora Universitária
  • Descrição:
  • Gabi tem 30 anos e é professora universitária do curso de Ciência da Computação em uma renomada instituição de ensino. Ela é apaixonada por compartilhar conhecimento e ajudar seus alunos a alcançarem seu potencial máximo.
  • Necessidades e Objetivos:
  • Gabi está interessada em expandir sua presença online e compartilhar seu conhecimento com um público mais amplo.
  • Ela busca por uma plataforma onde possa criar e compartilhar conteúdos didáticos de forma acessível e fácil de usar.
  • Comportamento no Site:
  • Gabi utiliza o site para publicar materiais didáticos relacionados aos cursos que ministra na universidade.
  • Ela está interessada em interagir com os alunos e responder a dúvidas por meio da página de contato do site.
Maria, a Mãe Empenhada
  • Descrição:
  • Maria tem 45 anos e é mãe de uma filha adolescente de 14 anos chamada Sofia. Ela trabalha como gerente em uma empresa local e está interessada em expandir os horizontes de sua filha introduzindo-a ao mundo da Ciência da Computação.
  • Necessidades e Objetivos:
  • Maria está em busca de recursos educacionais que sejam adequados para a idade de sua filha e que possam despertar seu interesse pela Ciência da Computação.
  • Ela procura por cursos e materiais que sejam acessíveis e que abordem os conceitos de forma lúdica e envolvente.
  • Comportamento no Site:
  • Maria acessa o site em busca de cursos e conteúdos que possam ser interessantes para sua filha adolescente.
  • Ela está interessada em encontrar materiais que possam ajudar Sofia a desenvolver habilidades de pensamento computacional e resolver problemas de forma criativa.
Requisitos Funcionais
Página Inicial
História de Usuário:
Como um visitante do site, quero acessar uma página inicial que apresente de forma clara e concisa a ideia do site, para que eu possa entender rapidamente o que é oferecido e decidir explorar mais.
Critérios de Aceitação:
  • A página inicial deve ter um cabeçalho com o nome do site e um menu de navegação.
  • Deve haver uma seção introdutória que explique o propósito do site.
  • Os conteúdos em destaque devem ser apresentados de forma atraente, com links para suas páginas individuais.
  • Deve haver um formulário de inscrição na newsletter visível.
  • A seção com links para as redes sociais da professora deve estar presente.
  • Exibir 3 depoimentos de alunos em destaque.
Menu do Site
História de Usuário:
Como um visitante do site, quero acessar um menu de navegação claro e intuitivo, para que eu possa encontrar rapidamente as diferentes seções do site e pesquisar por conteúdos específicos.
Critérios de Aceitação:
  • O menu deve incluir links para as seções: Página Inicial, Sobre, Conteúdos e Contato.
  • O menu deve ser fixo no topo da página para fácil acesso durante a navegação.
  • O menu deve ser responsivo e funcionar bem em dispositivos móveis.
  • Deve haver uma área de pesquisa onde o usuário possa digitar uma palavra-chave.
  • Ao digitar uma palavra-chave e pressionar enter, o usuário deve ser redirecionado para uma página de resultados de pesquisa relevante.
Páginas Individuais dos Conteúdos
História de Usuário:
Como um estudante interessado, quero acessar páginas detalhadas para cada conteúdo, para que eu possa entender melhor o tema abordado e acessar materiais adicionais.
Critérios de Aceitação:
  • Cada página de conteúdo deve incluir uma descrição detalhada do tema.
  • Deve haver uma seção denominada "Recursos Adicionais" com materiais como texto, imagens, links para videoaulas, arquivos PDF e outros recursos relevantes.
  • O design deve ser consistente com o resto do site e incluir um botão de volta ao menu de conteúdos.
Página "Sobre"
História de Usuário:
Como um visitante do site, quero acessar uma página que explique o projeto Technologia Simplificata e forneça informações sobre a idealizadora, para que eu possa entender melhor a motivação e o contexto do site.
Critérios de Aceitação:
  • A página deve incluir uma descrição detalhada do projeto Technologia Simplificata, incluindo seus objetivos e missão.
  • Deve haver uma seção dedicada à idealizadora, destacando sua experiência, áreas de especialização e formação acadêmica.
  • A página deve incluir uma foto profissional da idealizadora.
  • Deve haver links para as redes sociais da idealizadora.
Inscrição na Newsletter
História de Usuário:
Como um visitante do site, quero me inscrever na newsletter para receber atualizações sobre novos conteúdos e materiais, para que eu possa me manter informado sobre as novidades do site.
Critérios de Aceitação:
  • Deve haver um formulário de inscrição na newsletter na página inicial, no final de cada conteúdo e na página "Sobre".
  • O formulário deve ser simples, solicitando apenas o e-mail do usuário.
  • Após a inscrição, deve haver uma mensagem de confirmação e agradecimento.
Página de Contato
História de Usuário:
Como um visitante do site, quero acessar uma página de contato onde possa enviar mensagens diretamente para a idealizadora ou equipe do site, para que eu possa tirar dúvidas ou fornecer feedback.
Critérios de Aceitação:
  • A página de contato deve incluir um formulário onde os usuários possam inserir seu nome, e-mail e mensagem.
  • Deve haver uma mensagem de confirmação de recebimento após o envio do formulário.
  • A página deve incluir informações de contato adicionais, como um endereço de e-mail para contato direto.
Exibição de Depoimentos
História de Usuário:
Como um visitante do site, quero ler depoimentos de outros usuários, para que eu possa entender a qualidade e a eficácia dos conteúdos oferecidos.
Critérios de Aceitação:
  • A página inicial deve exibir 3 depoimentos de destaque de usuários.
  • Os depoimentos devem incluir o nome do usuário, uma foto (opcional) e um breve texto do depoimento.
  • Deve haver um botão ou link para visualizar mais depoimentos, se disponíveis.
Requisitos Não Funcionais
Acessibilidade
  • Requisito Não Funcional: Garantir que o site seja acessível para todos os usuários.
  • Critérios de Aceitação:
  • Deve fornecer alternativas textuais para elementos visuais.
  • Deve ser possível navegar no site utilizando apenas o teclado.
  • Deve ser evitado o uso de elementos que possam dificultar a navegação ou compreensão do conteúdo.
Didática
  • Requisito Não Funcional: Apresentar o conteúdo de forma clara e compreensível.
  • Critérios de Aceitação:
  • Deve ser evitado o uso de linguagem técnica excessiva.
  • Os recursos adicionais fornecidos devem ser de fácil acesso e compreensão.
Desempenho
  • Requisito Não Funcional: Garantir um desempenho satisfatório do site.
  • Critérios de Aceitação:
  • O tempo de carregamento das páginas deve ser razoável.
  • Deve ser minimizado o uso de recursos pesados que possam afetar o desempenho do site.
  • O site deve ser testado em diferentes dispositivos e conexões de internet.
Segurança
  • Requisito Não Funcional: Garantir a segurança básica dos dados dos usuários.
  • Critérios de Aceitação:
  • Deve ser implementado HTTPS para proteger a comunicação entre o navegador do usuário e o servidor.
  • Deve ser aplicada a prática de sanitização e validação básica de dados para prevenir ataques comuns, como injeção de código.
  • Deve ser realizado o controle de acesso básico para proteger áreas restritas do site e dados sensíveis dos usuários.
Documentação Técnica - Design UX/UI
Design Responsivo
  • Requisito de Design: O site deve ser responsivo e adaptável a diferentes dispositivos, incluindo desktops, tablets e smartphones.
  • Critérios de Aceitação:
  • O layout e a estrutura do site devem se ajustar automaticamente para proporcionar uma experiência de usuário consistente em diferentes tamanhos de tela.
  • Os elementos de navegação, como menus e botões, devem ser fáceis de acessar e utilizar em todas as resoluções de tela.
Paleta de Cores Atraente
  • Requisito de Design: Utilizar uma paleta de cores atraente e harmoniosa em todo o site.
  • Critérios de Aceitação:
  • As cores devem ser escolhidas de forma agradável ao olhar e em conformidade com a identidade visual do site.
  • Deve haver um contraste adequado entre o texto e o fundo para garantir uma boa legibilidade.
Layout Intuitivo
  • Requisito de Design: Criar um layout intuitivo e de fácil compreensão para os usuários.
  • Critérios de Aceitação:
  • Os elementos do site devem estar dispostos de forma lógica e organizada, facilitando a navegação.
  • Deve haver consistência no design entre todas as páginas do site, incluindo a disposição de elementos como cabeçalho, menu e rodapé.
Tipografia Clara e Legível
  • Requisito de Design: Utilizar uma tipografia clara e legível em todo o site.
  • Critérios de Aceitação:
  • Deve ser escolhida uma fonte que seja fácil de ler em diferentes tamanhos e dispositivos.
  • O tamanho e o espaçamento do texto devem ser adequados para garantir uma boa legibilidade em todas as condições de visualização.
Imagens e Gráficos Relevantes
  • Requisito de Design: Utilizar imagens e gráficos relevantes e de alta qualidade em todo o site.
  • Critérios de Aceitação:
  • As imagens devem ser escolhidas com base no conteúdo e na mensagem que se deseja transmitir.
  • As imagens e gráficos devem estar otimizados para carregar rapidamente, sem comprometer a qualidade visual.
Elementos de Navegação Claros
  • Requisito de Design: Garantir que os elementos de navegação sejam claros e intuitivos para os usuários.
  • Critérios de Aceitação:
  • Os botões de navegação devem ser facilmente identificáveis e clicáveis.
  • Deve haver indicações visuais claras de links e botões interativos, como mudanças de cor ou efeitos de hover.
Foco na Usabilidade
  • Requisito de Design: Priorizar a usabilidade do site, tornando-o fácil de usar e compreender para todos os usuários.
  • Critérios de Aceitação:
  • Deve ser realizado testes de usabilidade com usuários reais para identificar e corrigir quaisquer problemas de design ou navegação.
  • O site deve ser acessível e compreensível mesmo para usuários com pouca experiência em tecnologia.
Mapa da Jornada do Usuário
Paleta de Cores
A ideia é transmitir os valores de sabedoria, criatividade, educação, acessibilidade e aprendizado. A paleta pensada combina tons vibrantes de roxo, laranja e amarelo com cores mais suaves, como verde água e branco, para criar um equilíbrio entre energia, criatividade e acessibilidade. Essas cores serão aplicadas de forma estratégica em todo o design do TS para transmitir os valores desejados e proporcionar uma experiência visualmente atraente e coesa para os usuários.
Roxo Vibrante #5b47e4 - cor primária
Esta cor será a cor principal do site, transmitindo criatividade, inovação e originalidade.
Verde Água #33d9b2 - cor secundária
O verde água é uma cor calmante e refrescante, que transmite uma sensação de tranquilidade e acessibilidade. Pode ser usado para fundos ou áreas de destaque.
Roxo Claro #8a6ae8
Uma tonalidade mais clara de roxo pode ser usada para destacar elementos importantes do design, como botões de ação e links.
Branco #ffffff
O branco é uma cor que transmite simplicidade, limpeza e clareza. Pode ser usado para espaços em branco e para garantir uma boa legibilidade do texto.
Protótipo inicial
Made with Gamma