Projeto Final de Engenharia de Software
Agenda Virtual de Contatos
Equipe: Beatriz Vidal Freire, Evellyn Gisely de Castro, Nilton Luan Guedes Barros e Paulo Victor Souza Rodrigues
Sumário
Documentação
Projeto
Nome: Agenda Telefonica Virtual Versão: 2.0 Link do Código
Editores UML usados
LucidChart e GenMyModel
Linguagem
Python, HTML, CSS e JS
Framework
Flask
Database
SQLite e SQLAlquemy
Referencias
Flask documentation (Flask-user) Github Flask User W3schools Youtube Flask User App Tea Time SQLAlchemy documentation Jinja documentation Flask WTForms documentation Stack OverFlow Video sobre diagrama de implementação Video sobre diagrama de componentes Video uml diagrams sequence Video sobre diagrama de sequencia Video sobre arquitetura mvc Video padrão mvc Video sobre diagrama de atividade Video sobre diagrama de caso de uso Tutoral diagrama de pacotes Tutorial diagrama de estados
Telas do Sistema
Tela Login
Tela Registro
Tela Inicial (contatos)
Tela Edição de Contato
Tela Individual do Contato
Tela Adição de Contato
Tela Mecanismo de Busca
Tela Filtro de Grupos
Tela Filtro de Grupos
UML
a. Desenvolver os casos de uso do sistema.
Caso de Uso - Agenda de Telefone
Caso de Uso: Criar perfil
Ator: Usuário
- O usuário acessa o site
- Cadastro seus dados
- Se os dados cumprirem os requisitos, cadastro concluído
- Se os dados não cumprirem os requisitos, cadastro cancelado/não concluído.
Caso de Uso: Adicionar contato
Ator: Usuário
- O usuário acessa o site
- Realiza o login
- Se os dados ok, segue. Se não, permanece até os dados corretos serem adicionados.
- Insere contato - Se os dados cumprirem os requisitos, cadastro concluído. Se os dados não cumprirem os requisitos, cadastro cancelado/não concluído.
Caso de Uso: Remover contato
Ator: Usuário
- O usuário acessa o site
- Realiza o login
- Se os dados ok, segue. Se não, permanece até os dados corretos serem adicionados.
- Apagar contato
Caso de Uso: Buscar contato
Ator: Usuário
- O usuário acessa o site
- Realiza o login
- Se os dados ok, segue. Se não, permanece até os dados corretos serem adicionados.
- Clica em buscar contatos
- Se o contato existir, exibir dados do contato.
- Se o contato não existir, encaminhar para opção de Inserir Contato.
b. Elaborar diagramas de sequência para os casos de uso mais importantes.
- Busca e Delete de um contato
- Adição de um novo contato
- Registro de Usuário
Diagrama de Sequência - Busca e Delete de um Contato
Diagrama de Sequência - Adicionar Novo Contato
Diagrama de Sequência - Registro de Usuário
c. Elaborar diagramas de atividade. Elabore, no mínimo, os seguintes diagramas de atividades:
- Listagem de um dado contato
- Mapa de navegação de telas
Diagrama de Atividade - Mapa de Navegação de Telas
d. Elaborar os diagramas de classe do sistema.
A seguir se encontra o digrama se classes do nosso sistema, foi a partir dele, e dos outros diagramas, que desenvolvemos o nosso projeto. A classe Usuário e a classe Contato se associam mutualmente, já as classes Grupo e Contato têm uma associação unilateral, pois somente a classe Grupo se associa a classe Contato.
e. Elaborar os diagramas de estado de um objeto Conta (Account)
f. Explicitar a arquitetura escolhida. Use, para tal, diagramas de componentes e/ou de pacotes.
A arquitetura escolhida foi a MVC, que é muito vista em aplicações para Web, onde a View é geralmente a página HTML, e o código que gera os dados dinâmicos para dentro do HTML é o Controller. E, por fim, o Model é representado pelo conteúdo de fato, geralmente armazenado em bancos de dados ou arquivos XML. Ainda que existam diferentes formas de MVC, o controle de fluxo geralmente funciona como segue:
- O usuário interage com a interface de alguma forma (por exemplo, o usuário aperta um botão)
- O Controller manipula o evento da interface do usuário através de uma rotina pré-escrita.
- O Controller acessa o Model, possivelmente atualizando-o de uma maneira apropriada, baseado na interação do usuário (por exemplo, atualizando os dados de cadastro do usuário).
- Algumas implementações de View utilizam o Model para gerar uma interface apropriada (por exemplo, mostrando na tela os dados que foram alterados juntamente com uma confirmação). O View obtém seus próprios dados do Model. O Model não toma conhecimento direto da View.
- A interface do usuário espera por próximas interações, que iniciarão o ciclo novamente.
g. Elaborar os diagramas de implantação.
Autores
- Autores do READ.ME + UML: Beatriz Vidal Freire, Evellyn Gisely de Castro, Nilton Luan Guedes Barros e Paulo Victor Souza Rodrigues
Autor do sistema e do design (Python/Flask, HTML e CSS): Beatriz Vidal Freire
Entre em contanto: Linkedin | Instagram