Introdução ao projeto semestral
O projeto semestral consiste no desenvolvimento de um sistema web completo, aplicando de forma integrada
os conceitos de orientação a objetos e os fundamentos de desenvolvimento web vistos ao longo do semestre.
A partir de um problema qualquer, o grupo deverá definir o domínio da aplicação, modelar as classes,
projetar a interface e implementar um protótipo funcional utilizando tecnologias da web (HTML, CSS,
JavaScript...).
A ideia é que você experimente o ciclo de desenvolvimento de software: levantar requisitos, modelar, projetar,
implementar, testar e documentar o sistema.
Critérios de avaliação
Aspectos de programação
- Uso adequado de objetos: criação de classes coerentes com o domínio, encapsulamento, atributos e métodos bem definidos.
- Relacionamentos entre classes (associação, agregação, herança, composição) quando fizerem sentido no contexto.
- Tratamento de exceções: uso de blocos
try/catch/finally e lançamento de exceções personalizadas quando necessário.
Banco de dados
- Implementação, entendimento e uso de um banco de dados coerente com o sistema desenvolvido.
- Atentar ao tipo dos dados.
Padrões visuais e organização de código
- Consistência básica visual entre telas (cores, tipografia, alinhamento, espaçamento, componentes de interface...).
- Importante: Organização do código em camadas (por exemplo: fronteira, controle, entidade), evite “tudo em um arquivo só”.
- Importante: Nomes significativos para classes, métodos, variáveis e pacotes; comentários pontuais e úteis.
Observação: mantenha o repositório organizado e atualizado com commits semanais e mensagens claras.
Metodologia de trabalho
1. Formação dos grupos e definição do sistema
Os estudantes deverão se organizar em duplas e escolher um sistema web a ser desenvolvido,
preferencialmente criativo, que seja atrativo/agradável para trabalharem no decorrer do semestre.
2. Escolha e registro das ferramentas
Cada grupo deve registrar as ferramentas que serão utilizadas no desenvolvimento, por exemplo: IDE, servidor de aplicação,
framework de backend, sistema de controle de versão, gerenciador de banco de dados e ferramentas de modelagem UML.
Vocês já fizeram essa atividade, reutilizem os resultados e complementem se necessário.
Exemplos de ferramentas: VS Code, IntelliJ, Eclipse, Git/GitHub, PostgreSQL/MySQL, Astah Student, Figma, Draw.io...
3. Entregas parciais e acompanhamento
Ao longo do semestre haverá entregas parciais (modelos, protótipos de tela, primeiras versões do código) para acompanhamento
da evolução do projeto e avaliação.
Descrição do projeto
A primeira etapa do projeto é a descrição textual do sistema: contextualize o problema, descreva os principais usuários,
liste as funcionalidades esperadas e explicite as restrições ou regras de negócio mais importantes.
Use linguagem clara e objetiva, o texto deve permitir que qualquer pessoa da turma
entenda o que o sistema faz e porque ele é relevante.
Diagramas UML obrigatórios
Diagrama de casos de uso
O diagrama de casos de uso descreve, de forma visual, como os diferentes atores interagem com o sistema e quais funcionalidades
(casos de uso) cada um pode executar.
Como criar um diagrama de casos de uso
- Identifique os atores: pessoas ou sistemas externos que interagem com a aplicação (ex.: Cliente, Administrador, Sistema de Pagamento).
- Liste os objetivos desses atores em relação ao sistema (ex.: “Realizar login”, “Cadastrar produto”, “Emitir relatório”).
- Desenhe o sistema como um retângulo e coloque os casos de uso (elipses) dentro dele, conectando cada caso de uso aos atores correspondentes.
- Atribua nomes simples e iniciados por verbos aos casos de uso (ex.: “Registrar nave”, “Receber alienigena”).
- Use relações de inclusão/extends apenas quando fizerem sentido e ajudarem a diminuir repetição entre casos.
Ferramentas sugeridas para o diagrama de casos de uso
- Astah Student (versão acadêmica) - permite exportar a estrutura do código após modelado.
- Draw.io / diagrams.net (online e gratuito).
- Lucidchart, Miro ou Creately (versões gratuitas limitadas).
Em todas elas você encontrará elementos prontos para atores (boneco), casos de uso (elipses) e relacionamentos.
Diagrama de classes
O diagrama de classes apresenta a estrutura estática do sistema: classes, atributos, métodos e relacionamentos.
Ele deve refletir o modelo orientado a objetos que será implementado no código.
Como criar o diagrama de classes com Astah Student
- Instale o Astah Student e crie um novo projeto UML.
- Adicione um diagrama de classes e crie as classes principais do seu domínio, definindo atributos e operações (métodos).
- Defina visibilidade (público, privado, protegido), tipos de dados e, quando necessário, classes abstratas ou interfaces.
- Modele os relacionamentos (associação, herança, etc.), incluindo multiplicidade (1, 0..1, 1..*, *..*).
- Utilize os recursos da versão estudante para gerar código base (stubs) a partir do diagrama e depois complete a implementação na IDE.
A estrutura de classes deve permitir a manipulação de objetos de forma clara, o tratamento de exceções em pontos críticos
(como operações de banco de dados) e o uso de padrões de projeto simples sempre que fizer sentido.
Interface visual e IHC
A interface deve seguir princípios básicos de IHC, priorizando usabilidade, acessibilidade e consistência.
Lembre-se de que o usuário não precisa conhecer a estrutura interna do código, mas deve conseguir usar o sistema com facilidade.
Dicas de interface
- Consistência: mantenha o mesmo padrão de cores, ícones, botões e posicionamento de elementos em todas as telas.
- Visibilidade: deixe claras as ações disponíveis (botões, links) e o estado do sistema (mensagens de sucesso, erro, carregamento).
- Feedback: sempre informe o usuário sobre o resultado de suas ações (por exemplo, mensagens de confirmação ou erro).
- Prevenção de erros: valide dados nos formulários, use máscaras quando apropriado e destaque campos obrigatórios.
- Acessibilidade: utilize textos alternativos em imagens, contraste adequado entre texto e fundo e tamanhos de fonte legíveis.
Uma boa prática é começar com um rascunho em papel ou em ferramentas de prototipação (como Figma) antes de implementar diretamente em HTML/CSS.
Banco de dados
O banco de dados deve ser planejado a partir do modelo conceitual (classes e relacionamentos), garantindo que cada entidade importante
do sistema tenha uma representação adequada em tabelas.
- Mapeie as classes principais para tabelas, e os atributos para colunas, cuidando dos tipos de dados.
- Defina chaves primárias e estrangeiras para representar os relacionamentos entre as tabelas.
- Implemente operações CRUD (criar, ler, atualizar e excluir) para as entidades do sistema.
- Trate exceções de acesso ao banco (falhas de conexão, violação de restrição, etc.) de forma amigável ao usuário.