CAMPUS JATAÍ
COORDENAÇÃO DOS CURSOS DE INFORMÁTICA
CURSO SUPERIOR DE TECNOLOGIA EM ANÁLISE E DESENVOLVIMENTO DE SISTEMAS
SISTEMA WEB PARA SUBMISSÃO DE
PROJETOS
DENNER ANDRADE DE SIQUEIRA
MARCELO DE LIMA ALMEIDA
Jataí
2014
SISTEMA WEB PARA SUBMISSÃO DE PROJETOS
Monografia apresentado ao Instituto Federal de Goiás / Campus Jataí, como exigência parcial para aprovação no Curso Superior Tecnológico em Sistemas de Informação.
Orientador: Prof. Fabrício Vieira Campos
Jataí
2014
Dados Internacionais de Catalogação na Publicação na (CIP) GPT/BC/UFG
S618s
Siqueira, Denner Andrade de.
Sistema WEB para submissão de projetos [manuscrito]: /Denner Andrade de Siqueira, Marcelo de Lima Almeida. - 2014.
109 f. : il.
Orientador: Prof. Fabrício Vieira Campos.
Monografia (Graduação) - Instituto Federal de Goiás, Campus Jataí, 2014.
Bibliografia.
Inclui lista de figuras, tabelas, siglas e símbolos. Anexos.
1. SisCaP (Sistema de Cadastro de Projetos) 2. Sites da WEB - desenvolvimento I. Almeida, Marcelo de Lima. II. Título.
SISTEMA WEB PARA SUBMISSÃO DE PROJETOS
Monografia apresentado ao Instituto Federal de Goiás / Campus Jataí, como exigência parcial para aprovação no Curso Superior Tecnológico em Sistemas de Informação.
Aprovado em: _______/_______/_______.
Banca examinadora
__________________________ Prof. Fabrício Vieira Campos Presidente da Banca (Orientador)
_________________________ Prof.ª Me Eliane Raimann
_________________________ Prof. Esp. Danilo Vaz Borges de Assis
quando precisávamos que nos motivaram quando as dificuldades eram mais pesadas do que podíamos suportar, que nos apoiaram até altas horas da madrugada enquanto trabalhávamos sem medir esforços nesse trabalho de conclusão de curso, que nunca nos deixou desistir dos nossos sonhos e finalmente, a todos nossos colegas no período de faculdade, onde jamais iremos esquecer os bons ensinamentos e experiência ali passados, aos parceiros e amigos que sempre estiveram na expectativa acreditando que um dia conseguiríamos conquistar tudo pelo que batalhamos.
Primeiramente a Deus, por ter nos ter dado saúde e força para superar as dificuldades e nos dar a oportunidade de vivenciar as mais variadas experiências dessa vida.
Ao Instituto Federal de Goiás, aos grandes professores do curso de Sistemas de Informação, que demonstraram paciência e dedicação nos ensinando e nos tornando melhores profissionais para o mercado de trabalho e que nos oportunizaram desfrutar desde importante horizonte superior e hoje deixar aqui os nossos inúmeros agradecimentos. Um agradecimento especial ao nosso orientador Fabrício Vieira Campos que nos auxiliou nas dificuldades encontradas ao longo do desenvolvimento deste trabalho.
As nossas famílias que sempre estiveram por trás de todo processo, desde o início à finalização do curso, nos apoiando e incentivando.
Agradecer aos amigos que é o mais complicado, pois em grande parte do desenvolvimento do trabalho nunca deixaram de nos chamar para sair, e com muito pesar nós tivemos que nos redimir, pois afinal, tínhamos um objetivo e mesmo sem a compreensão imediata hoje podemos dizer que eles entenderam os nossos motivos e estão compartilhando este momento tão importante e gratificante em nossas vidas.
“O sucesso nasce do querer, da determinação e persistência em se chegar a um objetivo. Mesmo não atingindo o alvo, quem busca e vence obstáculos, no mínimo fará coisas admiráveis.”
No Instituto Federal de Goiás (IFG) o cadastro de projetos de pesquisa ainda é muito burocrático, todos os documentos são impressos e preenchidos a mão, e entregues pessoalmente na Instituição e funcionários da instituição cuidam de todo o processo manualmente. O Objetivo do Sistema de Cadastro de Projetos (SisCaP) é informatizar todos os formulários possíveis através de um sistema Web e que possa tornar o processo mais ágil, eficaz e permitir um controle maior das informações. Com um Sistema Web, os usuários poderão acessar o sistema de qualquer lugar realizando seus cadastros e envio de documento, possibilitando assim fazer os respectivos cadastros de editais, de usuários, bem como cadastro de projetos de pesquisa, possibilitando também o acesso às informações de acordo com seu tipo de acesso em qualquer lugar e hora.
In IFG (Federal Institute of Goiás) the registration of research projects is still very bureaucratic, all documents are filled out and only the institution staff attend to the whole process. The purpose of SisCaP (Project Registration System) is to scan all possible forms through a web system which can make the process faster. Users can access the system from anywhere you have a computer that accesses the internet and make their records and access information according to their type of access, so you do not need to attend the institution to complete the registration of a project or check the notices or projects already registered. With SisCaP can be seen that all the research project registration process has been improved, and can effectively be used in IFG.
FIGURA 1-QUANTIDADE DE PESSOAS CONECTADAS A WEB NO BRASIL (G1NÚMEROS DO BRASIL) ... 15
FIGURA 2-MODELO DE ESTRUTURA DO SISTEMA WEB -(PEREIRA,2007) ... 21
FIGURA 3-COMPONENTE DA APLICAÇÃO HTTP-(CESAR,MARCOS UFRN) ... 22
FIGURA 4-PROCESSO DAS APLICAÇÕES WEB -(MICHELETTI,FLÁVIO.PROTOCOLO HTTP,2012) ... 23
FIGURA 5-REQUERIMENTOS DE UM SGBG-(VIEIRA,2010) ... 26
FIGURA 6-CICLO DE VIDA DE SOFTWARE BASEADO EM CICLOS ITERATIVOS (WAZLAWICK,2004, P.24) ... 27
FIGURA 7-REPRESENTAÇÃO DE UM ATOR ... 30
FIGURA 8-REPRESENTAÇÃO DE UM CASO DE USO ... 30
FIGURA 9-REPRESENTAÇÃO DO RELACIONAMENTO ENTRE ATOR E CASO DE USO ... 30
FIGURA 10-EXEMPLO DE CLASSE CONTENDO ATRIBUTOS E MÉTODOS DE UM CLIENTE -(GUEDES,2009) ... 31
FIGURA 11-USUÁRIO INTERAGE COM A VIEW E CONTROLLER REPASSANDO AO MODELO -(MOURÃO,2013) ... 31
FIGURA 12-VISÃO GERAL DA FERRAMENTA ASTAH COMMUNITY -(AUTORIA PRÓPRIA) ... 33
FIGURA 13-VISÃO GERAL DA FERRAMENTA MYSQLWORKBENCH -(AUTORIA PRÓPRIA) ... 34
FIGURA 14-VISÃO GERAL DO AMBIENTE DE DESENVOLVIMENTO ECLIPSE IDE.(AUTORES:PRÓPRIOS)... 35
FIGURA 15-ESTRUTURA BÁSICA DO MVC-(BRIZENO,2013) ... 36
FIGURA 16-SITE DA UFG-SAPPWEB ... 39
FIGURA 17-VISÃO GERAL DA PÁGINA INICIAL DO SISTEMA SIGPROJ (MEC–MINISTÉRIO DA EDUCAÇÃO) ... 40
FIGURA 18-VISÃO GERAL DA HOME PAGE DO SISTEMA SIGPROJ (MEC) ... 41
FIGURA 19-LOGOTIPO DO SISCAP(AUTORIA PRÓPRIA) ... 53
FIGURA 20-LAYOUT DO SITE DO INSTITUTO FEDERAL DE GOIÁS ... 54
FIGURA 21-TRECHO EXTRAÍDO DO CÓDIGO DA CLASSE PROJETO.CLASS ... 55
FIGURA 22-TRECHO EXTRAÍDO DO ARQUIVO FORM_BOLSISTA.PHP ... 56
FIGURA 23-TRECHO EXTRAÍDO DO ARQUIVO DAONOTAPERFIL.CLASS.PHP ... 57
FIGURA 24-TABELA NOTA_PERFIL ... 57
FIGURA 25-ARQUIVO DA CAMADA DE CONTROLE PESSOA.PHP ... 58
FIGURA 26-PÁGINA INICIAL DO SISCAP (FONTE:TELA DO SISCAP) ... 59
FIGURA 27-JANELA MODAL DO “CADASTRAR” PESSOA NA PÁGINA INICIAL ... 59
FIGURA 28–VALIDAÇÃO DE CAMPO, EM HTML5 ... 60
FIGURA 29-USUÁRIO BOLSISTA –CHECK-LIST ... 60
FIGURA 30–VERIFICAÇÃO DE TIPO PESSOA. ... 61
FIGURA 31-USUÁRIO BOLSISTA –PERFIL DO ESTUDANTE ... 61
FIGURA 32-USUÁRIO BOLSISTA –FORMULÁRIO (DADOS PESSOAIS) ... 62
FIGURA 33-USUÁRIO BOLSISTA –FORMULÁRIO (UPLOAD DE DOCUMENTOS) ... 62
FIGURA 34–TABELA BOLSISTA ... 63
FIGURA 35-USUÁRIO ORIENTADOR –PÁGINA HOME ... 63
FIGURA 36-USUÁRIO ORIENTADOR –PERFIL DO ORIENTADOR ... 64
FIGURA 37-USUÁRIO ORIENTADOR –FORMULÁRIO (DADOS PESSOAIS) ... 64
FIGURA 38-USUÁRIO ORIENTADOR –FORMULÁRIO (UPLOAD DE DOCUMENTOS) ... 65
FIGURA 39-USUÁRIO ORIENTADOR –LISTAGEM DOS PROJETOS CADASTRADOS ... 65
FIGURA 40-USUÁRIO ORIENTADOR –EDITAIS EM ABERTO PARA CADASTRO DE NOVO PROJETO. ... 66
FIGURA 41-USUÁRIO ORIENTADOR –FORMULÁRIO DE CADASTRO DE NOVO PROJETO. ... 67
FIGURA 42-USUÁRIO ADMINISTRADOR/PRÓ-REITORIA –LISTAGEM DOS EDITAIS CADASTRADOS ... 67
FIGURA 43-USUÁRIO ADMINISTRADOR/PRÓ-REITORIA –FORMULÁRIO NOVO EDITAL ... 68
FIGURA 44–USUÁRIO ADMINISTRADOR/PRÓ-REITORIA -CADASTRAR NOVO AVALIADOR ... 68
FIGURA 45-DIAGRAMA DE CLASSES ... 84
FIGURA 50-DIAGRAMA DE SEQUÊNCIA –MANTER EDITAL ... 88
FIGURA 51-DIAGRAMA DE SEQUÊNCIA –AVALIAR PROJETO ... 89
FIGURA 52-DIAGRAMA DE SEQUÊNCIA –EDITAL ... 90
FIGURA 53-DIAGRAMA DE SEQUÊNCIA –FALE CONOSCO ... 91
TABELA 1 - COMPARAÇÃO ENTRE UM SOFTWARE DESKTOP X SISTEMA WEB. ... 24
TABELA 2 - QUADRO COMPARATIVO DE SISTEMAS. ... 41
TABELA 3 - VISÃO GERAL DO SISTEMA SISCAP ... 42
TABELA 4 - REQUISITO CADASTRAR USUÁRIO ... 44
TABELA 5 - REQUISITO LOGAR NO SISCAP ... 45
TABELA 6 - REQUISITO AJUDA NO SISCAP ... 45
TABELA 7 - REQUISITO MANTER EDITAL ... 46
TABELA 8 - REQUISITO MANTER BOLSISTA ... 47
TABELA 9 - REQUISITO MANTER ORIENTADOR ... 48
TABELA 10 - REQUISITO MANTER PROJETOS ... 49
TABELA 11 - REQUISITO MANTER AVALIADOR ... 49
TABELA 12 - REQUISITO MANTER EQUIPE ... 50
TABELA 13 - REQUISITO ANEXAR ARQUIVOS ... 50
TABELA 14 - REQUISITO AVALIAR PROJETOS ... 50
TABELA 15 - TABELA DE REQUISITOS SUPLEMENTARES ... 51
TABELA 16 - CASOS DE USO DO SISTEMA SISCAP ... 52
TABELA 17 - EXPANSÃO DO CASO DE USO MANTER DADOS BOLSISTAS ... 75
TABELA 18 - EXPANSÃO DO CASO DE USO MANTER DADOS ORIENTADORES ... 76
TABELA 19 - EXPANSÃO DO CASO DE USO CADASTRAR USUÁRIO ... 77
TABELA 20 - EXPANSÃO DO CASO DE USO MANTER PROJETOS ... 78
TABELA 21 - EXPANSÃO DO CASO DE USO MANTER EDITAL... 79
TABELA 22 - EXPANSÃO DO CASO DE USO MANTER AVALIADOR ... 80
TABELA 23 - EXPANSÃO DO CASO DE USO AVALIAR PROJETO ... 81
TABELA 24 - EXPANSÃO DO CASO DE USO ANEXAR ARQUIVOS ... 81
API: Application Programming Interface ( Interface de Programação de Aplicativos) CASE: Computer-Aided Software Engineering (Engenharia de Software Auxiliada por Computador)
CSS: Cascading Style Sheets (Folha de Estilo em Cascata) DAO: Data Access Object (Objeto de Acesso a Dados)
HTML: HyperText Markup Language ( Linguagem de Marcação de Hipertexto) HTTP: Hypertext Transfer Protocol ( Protocolo de Transferência de Hipertexto) IDE: Integrated Development Environment (Ambiente Integrado de Desenvolvimento) IFG: Instituto Federal de Goiás
JavaEE: Java Platform, Enterprise Edition (Java Edição Empresarial) JDK: Java Development Kit (Kit de Desenvolvimento Java)
MVC: Model-view-controller (Modelo-Visão-Controle) PHP: acrônimo recursivo para PHP: Hypertext Preprocessor SGBD: Sistema Gerenciador de Banco de Dados
SISCAP: Sistema de Cadastro de Projetos
SDK: Software Development Kit (Kit de de Desenvolvimento de Aplicativos) SQL: Structure Query Language (Linguagem Estruturada de Consulta) TI: Tecnologia da Informação
UFTM: Universidade Federal do Triângulo Mineiro
UML: Unified Modeling Language (Linguagem de Modelagem Unificada) UP: Unified Process (Processo Unificado)
XML: Extensible Markup Language (Linguagem Extensível de Marcação) WWW: World Wide Web (Rede de Alcance Mundial)
1. INTRODUÇÃO ... 15 1.1. CENÁRIO ATUAL ... 15 1.2. PROBLEMA ... 16 1.3. JUSTIFICATIVA ... 18 1.4. OBJETIVO GERAL ... 19 1.5. OBJETIVO ESPECÍFICOS ... 19 2. FUNDAMENTAÇÃO TEÓRICA ... 20 2.1. SISTEMAS WEB ... 20 2.2. PROTOCOLO HTTP ... 21
2.3. SERVIDORES DE APLICAÇÕES WEB ... 23
2.4. BANCO DE DADOS... 24
2.5. SISTEMA GERENCIADOR DE BANCO DE DADOS (SGBD)... 25
2.6. PROCESSO UNIFICADO DE DESENVOLVIMENTO DO SOFTWARE ... 27
2.7. DIAGRAMAS DA UML ... 28
2.7.1. Diagrama de Casos de Uso ... 29
2.7.2. Diagrama de classes ... 30
2.7.3. Diagrama de Sequência ... 31
2.8. FERRAMENTA DE MODELAGEM ... 32
2.8.1. Astah Community ... 32
2.8.2. MySQL Workbench ... 33
2.9. AMBIENTE DE DESENVOLVIMENTO INTEGRADO (IDE) ... 34
2.10. PADRÕES DE PROJETO ... 35
2.11. LINGUAGEM DE DESENVOLVIMENTO ... 36
2.12. FERRAMENTAS UTILIZADAS NA FORMATAÇÃO DO SITE ... 36
2.12.1. HTML (Hipertext Markup Language) ... 36
2.12.2. CSS (Cascading Style Sheets) ... 37
2.12.3. Linguagem JavaScript ... 37
2.12.4. Tecnologia Ajax ... 38
2.12.5. 3.10.5 JQuery ... 38
3. TRABALHOS RELACIONADOS ... 39
3.1. SISTEMA DA UNIVERSIDADE FEDERAL DE GOIÁS (SAPPWEB) ... 39
3.2. SISTEMA DE INFORMAÇÃO E GESTÃO DE PROJETOS (SIGPROJ) ... 40
4. O PROJETO DO SISTEMA ... 42
4.1. FASES DO PROJETO ... 42
4.2. VISÃO GERAL DO SISTEMA ... 42
4.3. LEVANTAMENTO DE REQUISITOS ... 43
4.4. 5.4 ORGANIZAÇÃO DOS REQUISITOS EM CASOS DE USO ... 51
6. FUNCIONAMENTO DO SISTEMA WEB SISCAP ... 59
7. CONCLUSÃO E TRABALHOS FUTUROS ... 70
7.1. CONCLUSÃO ... 70
7.2. TRABALHOS FUTUROS ... 71
8. REFERÊNCIAS ... 72
9. APÊNDICES ... 75
9.1. EXPANSÃO DOS CASOS DE USO ... 75
9.2. MODELAGEM DO SISTEMA ... 83
9.2.1. Diagramas de Casos de uso ... 83
9.2.2. Diagrama de Classes ... 84
9.2.3. Diagramas de Sequência ... 84
1.
INTRODUÇÃO
1.1.Cenário AtualNos tempos atuais pode-se dizer que internet é o principal meio de comunicação e interação entre as pessoas. Assim pode-se afirmar que a web deixou de gerenciar apenas conteúdos em sites para agregar o gerenciamento de serviços e sistemas. Um exemplo são as instituições de ensino. A maioria delas pode-se dizer, já utiliza sistemas web de forma simplificada para realizar lançamento de notas e faltas dos alunos, expor a ementa periodicamente onde há uma integração ágil e facilitada ao seu corpo discente e docente. No Instituto Federal de Goiás (IFG) há um sistema chamado Q-Acadêmico, que realiza toda essa integração dita anteriormente e que é essencial na instituição. O sistema pode ser acessado de qualquer lugar por acadêmicos ou professores cadastrados, onde exista um computador com acesso à Internet.
Uma pesquisa feita pelo site G11 mostra a evolução da Internet através de estatísticas à quantidade de pessoas que tem acesso à Internet nas residências, no trabalho ou locais públicos nos últimos anos.
Figura 1 - Quantidade de pessoas conectadas a Web no Brasil (G1 Números do Brasil)
O desenvolvimento de um sistema web de cadastro de projetos de pesquisa para o IFG é importante para que todo processo, feito manualmente através de documentos, seja informatizado mantendo todos os documentos necessários como formulários de inscrição,
uploads e downloads de documentos que são obrigatórios para realização dos cadastros e
acompanhamento dos projetos de pesquisa com o intuito de ser um sistema eficiente e que atendera o departamento responsável por todo este processo, tanto para a parte discente e docente da instituição. De acordo com as informações apresentadas, o projeto proposto visa
um desenvolvimento de um sistema computacional de plataforma Web que seja unificado para todas as unidades da instituição, onde padronizando além do endereço de acesso também todas as funcionalidades do sistema. Para trabalhos futuros, poderá ser feito uma possível integração ao site do Instituto Federal de Goiás.
1.2.Problema
A ideia de criação do sistema para submissão de projetos se deu a partir da necessidade de agilizar o processo para cadastros de projetos de pesquisa de acordo com a necessidade do Instituto Federal de Goiás e chegou-se a seguinte conclusão: a instituição não contava com um sistema exclusivo para fazer todos os processos de cadastro de projetos de pesquisa. Os principais usuários deste sistema seriam o corpo discente e docente da Instituição. Como ainda existem muitos processos burocráticos como: adquirir toda a documentação necessária para o cadastro, logo após o preenchimento e encaminhamento ao departamento dentro da Instituição, tudo isso gera um longo prazo. Foi idealizado um sistema que traria vantagens para ambas às partes e que é de grande interesse para a GEPEX (Gerência de Projeto de Pesquisa e Extensão), pois é ela quem cuida de todo processo de submissão de projetos encaminhados à pro-reitoria, e com o sistema web ficará prático este processo. Para dar início a este trabalho foi feita uma busca detalhada sobre funcionamento da submissão de projetos dentro da instituição de ensino, através da orientação do professor Fabrício Vieira Campos e com a ajuda da administração da instituição o regulamento padrão para cadastro de projeto, editais e formulários de inscrição atuais que são utilizados para realizar o cadastramento do projeto de pesquisa.
O nome dado ao sistema foi SisCaP (Sistema de Cadastro de Projetos), por ser um nome de fácil associação ao projeto que foi proposto para desenvolvimento.
O intuito do desenvolvimento de um sistema web é que venha facilitar o processo de cadastro e acompanhamento dos projetos em geral, sendo que o mesmo poderá ser acessado de qualquer lugar onde se tenha um computador com conexão à Internet, bastando apenas entrar no sistema, fazer o cadastro e login em seguida entrar com usuário e senha para ter acesso às opções referentes ao tipo de usuário.
O layout do sistema foi definido de forma que a tela principal (index2) terá as opções de cadastrar usuário e senha, uma opção para caso o usuário esqueça a senha e os campos para
2 Página inicial de sistema Web.
que possa ser inserido o usuário e a senha para entrar no sistema. Quando o usuário acessar a opção cadastrar, na index, terá acesso a um formulário de preenchimento obrigatório referentes ao cadastro como pessoa dos tipos: Bolsista e Orientador. Após efetuar o login, o menu com todas as opções será criado dinamicamente para os quatro tipos de usuário atuais do sistema: pro-reitoria, bolsista, orientador e avaliador. As opções do menu serão básicas para o usuário bolsista, pois quem fica responsável pelo cadastro dos projetos são os orientadores. Se o usuário for do tipo orientador terá o menu com as opções referentes ao que condiz com seu usuário, e se for administrador ele terá todas as opções referentes ao administrador do sistema como cadastrado de editais, avaliadores e projetos. O avaliador ficará responsável por fazer o download dos arquivos, avaliar o projeto e atribuir uma nota. Esta nota ficará disponível para que o estudante/pesquisador, ao entrar no sistema, possa verificar sua nota e se seu projeto foi recomendado ou não recomendado.
O sistema deverá oferecer o cadastro de projetos apenas para o orientador e a pro-reitoria. Para cadastrar um projeto o mesmo deverá primeiramente selecionar um edital cadastrado pela pró-reitoria através de uma listagem de todos os editais que estão disponíveis, logo após selecionar o edital terá o formulário de cadastro de projeto onde devem ser preenchidos todos os dados necessários para o projeto. Após efetuar o cadastro do projeto, poderão ser anexados os arquivos referentes ao projeto como o parecer da chefia, declaração do bolsista, cronograma de atividades, autorização dos Pais e o próprio arquivo contendo o projeto. Os Editais ficarão disponíveis na página principal. A pró-reitoria terá a função de disponibilizar os editais no sistema através de seu perfil de administrador do sistema. A mesma terá acesso a todos os cadastros de estudantes e orientadores/coordenadores de projetos e os projetos anexados.
Mediante toda essa idealização foi que se chegou à conclusão de que o sistema web traria vantagens por ser um sistema de informática projetado para utilização através de um navegador na Internet. Pensando assim se tem as seguintes vantagens:
Facilidade de acesso: poderá acessá-lo em qualquer lugar do mundo (computador, tablet ou smartphones).
Centralização e consolidação de informações: permite que vários usuários, inclusive de outras unidades, usem o sistema simultaneamente.
Simplicidade para atualizações e manutenções: correções e novas versões são mais facilmente publicadas.
Flexibilidade de uso: já que roda na Web fica desnecessária qualquer instalação de softwares nos computadores.
Com a finalidade de se ter uma praticidade na hora de o usuário avaliador avaliar os projetos, haverá uma página onde o bolsista que realizou seu cadastro e encaminhou seu projeto juntamente com seu orientador/coordenador, possa acompanha-lo, e verificar sua nota que será atribuída por ele (avaliador). A listagem dos documentos juntamente com a nota do projeto avaliado ficará disponível no sistema, a nota anexada será de acordo com os critérios de avaliação atribuídos pelo mesmo.
É possível afirmar que a Internet tornou-se um grande mecanismo para realização de negócios. Segundo (NETO, Arilo 2014) as características da Internet que influenciaram esse crescimento são: simplicidade aos usuários; informações dinâmicas; facilidade de utilização independentemente do local que o usuário se encontra. Pode-se dizer que essas características resultam no crescimento do desenvolvimento de sistemas que utilizam este ambiente para execução, tornando esses sistemas cada vez mais complexos.
1.3.Justificativa
Da escolha do tema/problema, optou-se por desenvolver um sistema Web. Tendo em vista que o sistema será desenvolvido para a própria instituição, a pesquisa será facilitada e o material de estudo é muito vasto, já que a biblioteca do Instituto tem recurso didático necessário para o projeto final do curso, e a internet também será de grande importância para a pesquisa, pois há uma vasta gama de tutoriais que irão auxiliar na pesquisa. Ponto favorável para esse projeto é a pouca necessidade de recursos financeiros, pois o IFG tem uma biblioteca com todo o material necessário e vários laboratórios com acesso a internet que poderão ser de grande auxílio na fase de desenvolvimento do projeto.
O trabalho será de grande importância para proporcionar aquisição de experiência e conhecimento nesta área, já que para desenvolver este sistema é necessária a base de várias disciplinas ministradas durante todo o período do curso.
Este sistema será de grande significado para o Instituto, pois os usuários que terão acesso não precisarão estar na Instituição necessariamente, para poder realizar o cadastro dos formulários, realizar os anexos de seu projeto e dos documentos necessários feitos pelo orientador/pesquisar e assim ambos poderão estar acompanhando o projeto pelo sistema.
O sistema trará benefícios pelo fato de poder ser acessado de qualquer lugar não necessitando de ser instalado no computador do Instituto, somente através de um navegador de Internet. Sendo assim, as atualizações se refletem para os usuários do sistema, sem afetar nada.
1.4.Objetivo Geral
Este projeto tem o objetivo de auxiliar a Pró-Reitoria e pós-graduação no processo de cadastro e avaliação de projetos de pesquisa, tendo em vista que hoje é fundamental a informatização da Instituição para tornar o processo de atendimento mais rápido. O sistema proposto vai possibilitar melhoria nesse atendimento, sendo um sistema Web, pois onde o usuário estiver ele poderá acessar o sistema, bastando apenas conexão à Internet.
1.5.Objetivo Específicos
Para se atingir o objetivo geral, temos como base alguns objetivos específicos que foram estabelecidos:
Auxiliar a Pró-reitoria de Pesquisa, Pós-Graduação (PROPPG) do Instituto Federal de Goiás, para melhor flexibilidade no processo de cadastro e acompanhamento de projetos.
Possibilitar ao usuário bolsita e orientador o cadastro individualizado no sistema;
Possibilitar ao usuário Docente, com a função de orientador, o cadastro de projetos de pesquisa;
Possibilitar o envio de arquivos digitalizados vinculados a cada projeto (upload).
Gerenciar os projetos vinculados a cada edital. Possibilitando a visualização de cada um.
Emitir de relatórios gerenciais, por campus, áreas e projetos recomendados.
Associar o avaliador diretamente no projeto, e disponibilizar uma interface de avaliação.
2.
FUNDAMENTAÇÃO TEÓRICA
Visto que o processo de cadastro de projetos de pesquisa é algo de extrema importância tanto para parte discente quanto docente, foi preciso analisar o regulamento disponibilizado no site do Instituto e destrinchar todo processo a fim de se chegar ao início de como seria feito o levantamento de requisitos necessários para a criação do sistema web.
Assim, foram levantados todos os requisitos necessários tendo como base no regulamento fornecido pela administração do instituto, que também se encontra no site do IFG. O check list de documentos é de extrema importância, pois é através dele que a pró-reitoria confere toda documentação necessária para o cadastro do estudante no sistema (ANEXO 1), formulário de cadastro do orientador/coordenador do projeto e do estudante (ANEXO 2), formulário de perfil do estudante (ANEXO 3), formulário de perfil do orientador (ANEXO 4), o parecer do departamento responsável (ANEXO 5), o formulário padrão do projeto de pesquisa (ANEXO 6) e o formulário de avaliação do projeto que é encaminhado para a pró-reitoria (ANEXO 7).
No decorrer da elaboração do sistema de cadastro de projetos, foi utilizado o padrão MVC (Modelo-Visualização-Controle), conhecido como modelo em três camadas. Para a camada modelo foi usado o banco de dados MySQL. As linguagens de formatação CSS e
HTML usadas na camada de visualização do sistema. E para o controle do sistema foi
utilizada a linguagem de programação PHP.
O sistema SisCaP foi programado utilizando o ambiente de desenvolvimento Eclipse, juntamente com o servidor Web Apache. A modelagem dos dados levantados foi criada de acordo com a linguagem de modelagem unificada (UML), utilizando a ferramenta Astah
Community, para modelar os diagramas.
2.1.Sistemas web
Sistemas web são sistemas que são disponíveis na internet e podem ser acessados através de um navegador, e de qualquer parte do mundo. A escolha de uma arquitetura orientada para web permite que várias máquinas acessem um ambiente centralizado como mostra a figura 2:
Figura 2 - Modelo de estrutura do sistema web - (PEREIRA, 2007)
Nesta estrutura, o navegador é responsável pela interpretação da linguagem HTML (HiperText Markup Language), que envia requisições através de um protocolo de comunicação, tanto para o que realiza a requisição quanto para o provedor de dados. Esse protocolo é chamado de HTTP (Hiper Text Transfer Protocool).
Uma grande vantagem do uso de sistemas Web é a sua fácil portabilidade, podendo migrar de um ambiente para outro sem a necessidade de muitas alterações. Um sistema Web não precisa ser instalado em um computador específico e sim armazenado em um servidor e acesso de qualquer lugar do mundo como mencionado nesta sessão.
2.2.Protocolo HTTP
O protocolo HTTP é utilizado para transferência de dados de hiper-mídia (imagens, sons e textos). Esse protocolo funciona através de troca de mensagens no formato de requisição e resposta. O lado cliente faz uma requisição ao servidor que responde e desconecta em seguida.
Figura 3 - Componente da aplicação HTTP - (CESAR, Marcos UFRN)
Para esse cliente é possível citar alguns navegadores de acesso a Internet que utilizam o protocolo HTTP que são:
Chrome – Google
Internet Explorer – Microsoft
Firefox – Mozilla
Para o lado do servidor, as aplicações citadas a seguir referem-se como exemplo:
Apache – Apache Foundation;
Internet Information Services – Microsoft
Internet Application Server – Oracle
Este projeto de conclusão de curso foi baseado no navegador Chrome para o lado cliente, por ser um navegador que possui muitas vantagens em relação a outros navegadores, como ferramentas de inspecionar elementos do código fonte que facilita muito no desenvolvimento do sistema, opção de tradução automática para sites estrangeiros, interface de visual suave e rapidez para abrir páginas.
No lado servidor é usada a aplicação Apache por ser o servidor HTTP mais usado e por ser uma ferramenta gratuita de código fonte aberto.
2.3. Servidores de Aplicações web
A maioria das informações que circulam na internet esta armazenada em um banco de dados, que pode estar em qualquer parte do mundo. O servidor fica responsável por executar todas as operações quando se trata de web.
Com a chegada dos servidores de aplicações web, a criação e a distribuição de aplicações para web tem possibilitado um novo modelo de desenvolvimento. De acordo com MORAIS (1999) “existem alguns fatores que influenciaram para que se tornasse realidade”.
Primeiro deles é que a atual arquitetura de software evoluiu seus projetos, pois antes o usuário interagia com um programa que se comportava de uma maneira onde continha o código de aplicação, os dados, a interface do usuário e a comunicação.
O segundo fator é que existe uma programação totalmente organizada, no que se refere às funcionalidades citadas, onde se tem uma divisão bem clara do projeto.
O terceiro fator é o amadurecimento da Internet, permitindo uma rápida transmissão de informações e com esse crescimento é que se vieram os servidores de aplicações web.
O papel principal de um servidor de aplicação é dar suporte a sites web que usem dados dinâmicos, ou seja, dados oriundos de um banco de dados, arquivos- modelos, scripts e de outros elementos, para criar arquivos HTML dinamicamente. Os servidores de aplicações provêm a informação formatada para ser entregue aos usuários. (FEILER, Jesse. 2000).
Para que se possa entender melhor como funciona todo este processo, a figura 4 irá exemplificar e generalizar a forma de funcionamento das aplicações de sistemas web:
Figura 4 - Processo das aplicações web - (MICHELETTI, Flávio. Protocolo HTTP, 2012)
Como servidor para auxílio essencial desde projeto foi escolhido o pacote WampServer, ferramenta GPL (Licença Pública Geral) desenvolvido pela PHP team. O WampServer possui um ambiente de desenvolvimento web para Windows, sistema operacional ao qual estamos utilizando. Ele permite criar aplicações web com Apache, PHP e um banco de dados MySQL. Paralelamente, phpMyAdmin permite gerenciar facilmente o banco de dados.
Sistemas web ficam armazenados em um servidor e podem ser acessados de qualquer lugar bastando ter uma conexão com a internet e um navegador instalado, mas se não houver uma conexão ele não pode ser acessado. Diferente dos sistemas web, os sistemas Desktop são instalados na máquina do cliente e toda aplicação só poderá ser acessada na máquina local, e pode funcionar sem conexão com a internet.
Elaboramos uma tabela com a comparação simples e objetiva de um software desktop X sistema web.
Tabela 1 - Comparação entre um software Desktop X sistema web.
Desktop Sistema Web
Acesso O usuário só poderá utilizar nos hosts (máquinas) instalados.
O usuário poderá acessar em qualquer host que se tenha um navegador com conexão a Internet.
Instalação É necessário instalar o software host por host.
O sistema fica acoplado a um servidor para dar acesso aos usuários.
Infraestrutura Cada máquina necessita de uma infraestrutura bem requisitada para suportar o software nela instalada inclusive o servidor.
Somente o servidor necessita de uma boa infraestrutura para suportar a transação de informações.
Versões de atualização e Manutenção
A atualização ou manutenção deve ser feita em todos os hosts.
O sistema web pode ser atualizado ou alterado em pouco tempo apenas no servidor que está acoplado.
Fonte: Autoria própria.
2.4.Banco de Dados
As informações circulam rapidamente com a internet, e o risco de ter informações circulando é muito grande. Em meio a toda essa evolução é imprescindível à qualidade de informações. A Internet fez com que a facilidade de obtenção de dados exija cada vez mais um tratamento elaborado dos mesmos.
Um banco de dados é uma coleção de dados armazenados e inter-relacionados, representando um domínio específico. Exemplo: lista telefônica, fichas de acervo de uma biblioteca. TEOREY, Toby (2007, p. 2) diz que “[...] atende às necessidades de vários usuários dentro de uma ou mais organizações, ou seja, coleções inter-relacionadas de muitos tipos diferentes de tabelas.”. Para explicar o termo “Dado” é preciso destrincha-lo da seguinte forma:
Quais os elementos de dados?
• Disciplina : POO (Programação Orientada a Objetos)
• Período : primeiro semestre /14
• Matriculados : 30
Para TEOREY (2007, p. 2) as motivações para usar banco de dados em vez de arquivos incluem a maior disponibilidade a um conjunto diversificado de usuários, a integração de dados para facilitar o acesso e a atualização de transações complexas, e a menor redundância de dados.
2.5.Sistema Gerenciador de Banco de Dados (SGBD)
Um sistema gerenciador de banco de dados (SGBD) é um sistema genérico para manipular banco de dados:
Um SGBD admite uma visão lógica (esquema, subesquema); visão física (métodos de acesso); linguagem de definição de dados; linguagem de manipulação de dados; e utilitários importantes, como gerenciamento de transação e controle de concorrência, integridade de dados, recuperação de falhas e segurança. (TEOREY, 2007 p. 2).
O objetivo de um SGBD é fornecer um ambiente apropriado para manter e armazenar informação na base de dados de forma eficiente. Através de ferramentas de um SGBD, usuário pode:
Realizar a entrada de dados;
Consultar dados;
Figura 5 - Requerimentos de um SGBG - (VIEIRA, 2010)
Um SGBD, em geral, além de armazenar os dados armazena também os metadados (dados que contêm a definição dos próprios dados, nomeadamente, as definições das próprias tabelas, as regras de integridade e assim por diante). A figura 5 ilustra como é a aplicação dentro de um SGBD.O SGBD é responsável por:
Integridade;
Segurança;
Backup e Recovery;
Gestão de dados;
Gestão da Concorrência.
O SGBD escolhido para esse projeto foi o MySQL e a ferramenta de edição é o SQLyog. Ele é baseado na linguagem SQL (Structure Query Language). Possui duas versões, uma versão paga chamada Enterprise, e uma versão gratuita chamada Community.
No site oficial da Webyog (https://www.webyog.com/) é disponibilizado a versão mais recente do banco de dados, Enterprise, paga, e Community, gratuita e de código fonte aberto. A versão gratuita Community que foi utilizada no SisCaP serviu bem ao nosso propósito pois tem todas as funcionalidades necessárias para manipulações de banco de dados e suas tabelas como create, alter e drop tanto para o banco como as tables , e as manipulações podem ser
feitas tanto por linha de comando ou por ícones do sistema. Ele possui também opção de importar e exportar o banco de dados e opção para backup dentre muitos outros recursos que vão muito além do que é requisitado.
2.6.Processo Unificado de Desenvolvimento do Software
Para realizar o levantamento de requisitos e a descrição de toda documentação desse sistema, foi utilizado como base fundamental o processo unificado (UP) que está fortemente associado à Linguagem de Modelagem Unifica (UML), baseada no método iterativo e incremental para ilustrar os processos. Segundo WAZLAWICK (2004, p.19), “quando se usa linguagem UML [...] corresponde a produzir projetos de sistemas com elegância.”. Logo adiante ele complementa dizendo que “O software elegante é aquele cuja estrutura é intrinsecamente mais fácil de compreender, que é autodocumentado e pode ser compreendido em nível macro ou em detalhes.”.
[...] a UML não é uma linguagem de programação, e sim uma linguagem de modelagem, uma notação, cujo objetivo é auxiliar os engenheiros de software a definirem as características do sistema, tais como seus requisitos, seu comportamento, sua estrutura lógica, a dinâmica de seus processos e até mesmo suas necessidades físicas em relação ao equipamento sobre o qual o sistema deverá ser implantado. (GUEDES, 2009 p. 19).
De acordo com WAZLAWICK (2004, p. 24), “o processo unificado propõe um processo ágil, com poucos artefatos e pouca burocracia, sendo assim, existe um ciclo de vida de software dividido em quatro fases: Concepção, Elaboração, Construção e Transição”. Veja os detalhes na figura 6:
Figura 6 - Ciclo de vida de software baseado em ciclos iterativos (WAZLAWICK,2004, p.24)
O processo unificado visa tornar clara a necessidade de atribuição de tarefas aos indivíduos envolvidos diretamente no desenvolvimento do projeto. Além disso, é bom
lembrar que se deve definir o quanto antes, quais as etapas (iterações) e os artefatos que serão envolvidos no processo.
A vantagem de utilizar este ciclo de desenvolvimento do processo unificado no projeto nos da à possibilidade de aprimorar e/ou atualizar o sistema em qualquer fase do projeto para que se tenha um sistema de acordo com todas as funcionalidades que o usuário final necessita. Desta forma, o sistema SisCaP irá utilizar este ciclo de desenvolvimento, passando por essas quatro fases do processo unificado.
Segundo WAZLAWICK (2004, p.24), “é bom definir de forma clara as fases do processo unificado”.
Concepção – É a etapa na qual o analista irá buscar as primeiras informações sobre o sistema proposto para desenvolvimento. Nesta fase será feito o levantamento e organização dos requisitos e o planejamento do desenvolvimento para compreender o sistema de forma abrangente.
Elaboração – Os objetivos dessa fase é elaborar, a partir da forma documentada, um entendimento detalhado do domínio do problema e desenvolver o plano do projeto com base na análise de requisitos.
Construção – A fase de construção está relacionada à programação e teste do sistema. No final dessa fase, terá um sistema totalmente preparado e com a documentação associada pronta para a transição aos usuários.
Transição – A fase final do processo unificado esta relacionada em garantir que todos os requisitos do projeto foram atendidos e implementados corretamente, depois de pronto, então implantado.
2.7.Diagramas da UML
De acordo com GUEDES (2009), “a UML é composta de vários diagramas, tendo como objetivo fornecer múltiplas visões do sistema a ser modelado, analisando-o e modelando-o sob diversos aspectos, procurando assim atingir a completitude (qualidade) da modelagem, permitindo que cada diagrama complemente os outros”.
Os diagramas mais utilizados na UML são: diagrama de caso de uso, de classes, de sequência, de objeto, de estado, de colaboração, de atividade, de componente e o de execução.
Entre esses diagramas citados, todos irão atingir a completitude da modelagem conforme as funcionalidades do sistema, mas cada um possui sua particularidade:
Cada diagrama da UML analisa o sistema, ou parte dele, sob uma determinada óptica. É como se o sistema fosse modelado em camadas, sendo que alguns diagramas enfocam o sistema, como é o objetivo do Diagrama de Caso de Uso, enquanto outros oferecem uma visão de uma camada mais profunda do software, apresentando um enfoque mais técnico ou ainda visualizando apenas uma característica específica do sistema ou um determinado processo. A utilização de diversos diagramas permite que falhas sejam descobertas, diminuindo a possibilidade da ocorrência de erros futuros. (GUEDES, 2009, p. 30).
Ao decorrer dos estudos feitos ao longo dessa etapa do projeto, foi visto que não há a necessidade de utilizar todos esses diagramas da UML dependendo do grau de complexidade do projeto, sendo assim para o desenvolvimento desse sistema Web, foram utilizados somente três diagramas para representação dos processos do sistema SisCaP, sendo eles: Diagrama de Casos de Uso, Diagrama de Classe e o Diagrama de Sequência.
2.7.1. Diagrama de Casos de Uso
O Diagrama de Caso de Uso representa o que o sistema deve fazer do ponto de vista do usuário. Nele são representados os atores envolvidos com o sistema, o cenário em que acontece determinado caso de uso, o use case em si e a comunicação feita do usuário com o use case.
O diagrama de casos de uso é o diagrama mais geral e informal da UML, utilizado normalmente nas fases de levantamento e análise de requisitos do sistema, embora venha a ser consultado durante todo o processo de modelagem e possa servir de base para outros diagramas. (GUEDES, 2009, p. 30).
Em maiores detalhes, podemos exemplificar cada elemento citado acima:
Atores – Um ator é representado por um boneco e um rótulo com o nome do ator. Um ator é um usuário do sistema, que pode ser um usuário humano ou outro sistema. A representação desde elemento é mostrado na Figura 7.
Figura 7 - Representação de um ator
Casos de uso – Um caso de uso é representado por uma elipse e um rótulo com o nome do caso de uso. Um caso de uso define uma grande função do sistema. Veja na Figura 8.
Figura 8 - Representação de um caso de uso
Relacionamentos – Ajudam a descrever casos de uso. Entre o ator e um caso de uso há uma associação representada na Figura 9.
Figura 9 - Representação do relacionamento entre ator e caso de uso
2.7.2. Diagrama de classes
O diagrama de classes descreve os objetos e a comunicação com seus usuários. Ele descreve as informações sem referência a qualquer implementação específica. Um objeto é a representação de alguma coisa no mundo real, por exemplo, pode representar um carro como uma classe automóvel. Porém o objeto carro possui atributos idênticos entre si, como a cor, marca, placa entre várias outras. Para Gilleanes Guedes esse diagrama,
[...] é provavelmente o mais utilizado e é um dos mais importantes da UML. Serve de apoio para a maioria dos demais diagramas. Como o próprio nome diz, define a estrutura das classes utilizadas pelo sistema, determinando os atributos e métodos que cada classe tem, além de estabelecer como as classes se relacionam e trocam informações entre si. (GUEDES, 2009, p. 31). Cada classe é representada por um retângulo que contém divisões que dão o nome da classe, os atributos juntamente com os tipos desses atributos (uma palavra, um número, um valor) e outra que contém os métodos que serão executados através das funções da classe. A Figura 10 irá exemplificar esse diagrama
Figura 10 - Exemplo de classe contendo atributos e métodos de um cliente - (GUEDES, 2009)
Para que as classes possam se comunicar umas com as outras, foram criados relacionamentos, também chamados de associações. São vários os tipos de relacionamentos entre as classes, mas o mais usado são associações binárias que ficará bem explicito e de fácil compreensão no projeto do sistema, na parte de modelagem do SisCaP.
2.7.3. Diagrama de Sequência
O diagrama de sequência tem o objetivo de mostrar como as mensagens entre os objetos são trocadas no decorrer do tempo para realização de uma operação.
Segundo Guedes (2009 p. 33), “o diagrama de sequência é um diagrama comportamental que preocupa-se com a ordem temporal em que as mensagens são trocadas entre os objetos envolvidos em um determinado processo”.
É por meio da chamada de métodos disparados por mensagens enviadas entre os objetos que se determina como o processo deve se desenrolar e ser concluído.
2.8.Ferramenta de Modelagem
Foram selecionadas algumas ferramentas de desenvolvimento que foram usadas neste projeto com o intuito de melhor desempenho do software.
Como parte dos requisitos do sistema e das atividades de projetos, o sistema precisa ser modelado como um conjunto de componentes e de relações entre esses componentes. Existem tecnologias que são utilizadas para modelagem de software que usa algum tipo de notação gráfica e são apoiadas pelo uso de ferramenta CASE - Computer-Aided Sofware Enginnering, (Engenharia de Sofware Auxiliada por Computador).
Durante o processo de criação dos diagramas, foi o primeiro contato com algumas ferramentas de modelagem como DIA, com a qual é possível compor layouts, fluxogramas, organogramas e diagramas em geral, contando também com objetos para modelagem UML. Porém já existem ferramentas mais modernas e que trouxe um resultado muito mais satisfatório para o nosso projeto. A ferramenta CASE utilizada chama-se Astah Community, mais conhecida como Jude Community.
Outra ferramenta de modelagem que foi necessária no projeto para o desenvolvimento do DER (Diagrama Entidade Relacionamento) é o famoso MySQL Workbench. O Workbench é uma ferramenta gráfica criada para fazer a modelagem de dados em banco de dados MySQL. Serão abordados em seguida os conceitos de cada uma dessas ferramentas que foram necessárias para o desenvolvimento do sistema.
2.8.1. Astah Community
A ferramenta Astah Community é open source e é utilizada para desenvolvimento da modelagem de software. É flexível e extensível e contém vários recursos. Nela é possível desenvolver os diagramas necessários para nosso projeto como: diagrama de caso de uso, diagrama de classes e o diagrama de sequência, mencionados anteriormente. A Figura 12 mostra uma visão geral de como é a ferramenta e seus recursos.
Figura 12 - Visão geral da ferramenta Astah Community - (Autoria própria)
A versão mais atual do Astah Community pode ser encontrada no site http://astah.net/download, com diversos pacotes para download. A versão Community é gratuita e limitada, porém já é essencial para o desenvolvimento dos diagramas.
2.8.2. MySQL Workbench
Segundo ROCHA (2013), o “MySQL Workbench é uma ferramenta visual unificada para Arquitetos de Banco de Dados, Programadores e DBAs”.
O MySQL Workbench permite que um DBA (Administrador de Banco de Dados), desenvolvedor ou arquiteto de dados possa projetar visualmente o modelo, gerar e gerenciar um banco de dados. Ele inclui tudo o que um modelador de dados necessita para criação de modelos complexos. E para esse projeto, foi utilizado esta ferramenta para construir a DER (Diagrama Entidade Relacionamento) onde foi feito toda a arquitetura do banco de dados em forma de diagrama e em seguida, gerado o script SQL para a importação no nosso sistema gerenciador de banco de dados SQLyog mencionado no capítulo 3. A Figura 13 mostra uma visão geral da ferramenta Workbench e seus recursos para a modelagem do DER.
A versão mais atual do MySQL Workbench pode ser encontrada no site http://dev.mysql.com/downloads/workbench/, com suporte para vários sistemas operacionais como: Windows, Ubuntu Linux, MAC OS X e Fedora. A ferramenta possui sua versão Community gratuita e que atende as necessidades para o desenvolvimento da modelagem do banco de dados do sistema web SisCaP. A modelagem do sistema se encontra na seção de apendesse ao final deste trabalho (APÊNDICE 1).
2.9.Ambiente de desenvolvimento integrado (IDE)
Um ambiente de desenvolvimento IDE auxilia a rotina diária de programadores, com o objetivo de agilizar o processo de desenvolvimento de software onde se reúne características e ferramentas em um programa de computador. Geralmente os IDEs facilitam o desenvolvimento rápido de softwares, que visa maior produtividade dos desenvolvedores. Existem várias IDEs para diferentes tipos de linguagens de programação. Para desenvolver aplicações em PHP, existem IDEs com versões gratuitas como, por exemplo, o Eclipse e o Netbeans, No Eclipse basta a instalação de um plugin com suporte para linguagem PHP e é possível configurar a IDE para desenvolvimento de um sistema web. Outra ferramenta bastante utilizada para programação em PHP é o Dreamweaver.
Para o desenvolvimento desse sistema foi utilizado o Eclipse IDE, que segundo GONÇALVES (2007, p. 3) possui “características que fazem do Eclipse IDE um dos softwares de desenvolvimento mais utilizados no mundo”. Na Figura 14 é possível ter uma
noção de como é a IDE que foi utilizado no desenvolvimento de toda codificação do sistema web.
Figura 14 - Visão geral do ambiente de desenvolvimento Eclipse IDE. (Autores: Próprios)
O Eclipse possui seu código livre que chamamos de open source. A versão mais recente 4.4 se encontra no site oficial do Eclipse e poderá ser feito o download da IDE no site https://www.eclipse.org/downloads/ para os sistemas operacionais: Windows, Linux e MAC OS X.
2.10. Padrões de Projeto
Os padrões de projeto são usados para modelagem de projetos. Segundo Macoratti (2002): “Padrões de projetos são soluções para problemas que alguém um dia teve e resolveu aplicando um modelo que foi documentado e que você pode adaptar integralmente ou de acordo com necessidade de sua solução”.
Existe um padrão de projeto já muito conhecido na atualidade que é o modelo MVC (Model-View-Controller), conhecido também como modelo de três camadas.
O padrão MVC está relacionado com a arquitetura da aplicação e em como os componentes se comunicam. A arquitetura em 3 camadas está relacionada com a arquitetura do Sistema onde você divide as responsabilidades em camada de apresentação, de negócio e de acesso aos dados. Os conceitos se complementam e podem coexistir harmonicamente sem conflitos. Você pode usar o padrão MVC para a camada de apresentação de uma arquitetura em camadas. (MACORATTI, 2002).
A arquitetura MVC é composta pela camada de apresentação, onde há interação com o usuário, a camada de negócio onde fica a lógica responsável pela aplicação e a de dados que controla o acesso ao banco de dados. A Figura 15 representa esta aplicação em três camadas.
Figura 15 - Estrutura básica do MVC - (Brizeno, 2013)
2.11. Linguagem de Desenvolvimento
Para a programação do sistema SisCaP, a linguagem utilizada foi o PHP (Hipertext Preprocessor) se tratando de desenvolvimento de um sistema web. O PHP é uma linguagem de criação de scripts do lado servidor. Ele pode ser incorporado ao interpretador HTML (Hipertext Markup Language) no qual foi definido no começo deste capítulo, e não é usado para a criação do layout de uma página web.
PHP é um acrônomo de Hipertext Preprocessor (pré-processador de hipertexto), uma poderosa linguagem de programação open source, mundialmente utilizada, principalmente no ambiente web. Uma das características mais marcantes no PHP é a sua capacidade de se misturar ao HTML, tornando mais fácil a geração de páginas web dinâmicas. (SOARES, 2008, p. 28).
2.12. Ferramentas Utilizadas na Formatação do Site
Algumas tecnologias são utilizadas para o desenvolvimento web que facilitam o desenvolvimento de aplicações, elas ajudam tanto na parte de design quanto na parte de implementação.
2.12.1. HTML (Hipertext Markup Language)
Como foi abordado no capitulo 3, tópico 3.1.2, o HTML é uma linguagem para publicação de conteúdos como texto, imagens, vídeo, áudio e etc. No SisCaP está sendo utilizado o HTML5, uma evolução do HTML4 do qual ainda permanece a maioria das tags. O HTML5 possui elementos específicos para formulários como e-mail, data, hora, telefone entre outros.
Um exemplo de aplicação HTML5 utilizada no código do SisCaP:
para e-mail <input type = “mail”>; O elemento mail faz a formatação e validação do campo.
para data <input type = “date”>; O elemento date cria um campo para inserir a data em um formulário. Essa tag pode ainda exibir um calendário para o usuário selecionar a data.
para telefone <input type = “tel”>; Para o elemento tel não existe validação e nem máscara de formatação pelo fato de não existir um padrão de telefonia em todos os países.
A nova versão permite que sejam feitas alguns tipos de verificação como a citadas acima e existe ainda a tag required que quando colocada em um type input esse campo se torna obrigatório o seu preenchimento. Então muita coisa que era feita com javascript agora pode ser feita automaticamente utilizando o HTML5.
A HTML5 traz um conjunto de novos recursos para facilitar o desenvolvimento de interfaces amigáveis e acessíveis por diversos tipos de dispositivos e públicos, incluindo pessoas com deficiência. Suas novas APIs possuem recursos para acesso de banco de dados, construção de animações, figuras e equações matemáticas, acesso a dados de geolocalização, navegação off-line, recursos para arrastar/soltar conteúdos e muitos outros. (TERUEL, 2011, p. 17).
2.12.2. CSS (Cascading Style Sheets)
O CSS é usado para definir os elementos que compõe uma página, um documento, ou uma aplicação Web que será exibida para o usuário. Com o CSS é possível aumentar a interatividade de um site ou uma aplicação, pois atua mais na camada de apresentação.
Folha de estilo em cascata é um mecanismo simples para adicionar estilos (por exemplo: fontes, cores, espaçamentos aos documentos web). (SILVA, 2009 p. 24).
2.12.3. Linguagem JavaScript
É uma linguagem de programação do lado cliente, pois é o navegador que suporta toda a carga de processamento. Pelo fato de ter uma grande compatibilidade, é a linguagem de programação lado cliente mais utilizada. Com o JavaScript pode-se criar efeitos especiais, e proporcionar uma maior interatividade para o usuário.
Podemos definir o JavaScript como sendo uma linguagem de programação usada em parceria com o HTML, com a finalidade de permitir que as
páginas escritas para a Web se tornem dinâmicas e possibilitem uma interatividade com o usuário. (Oliviero, 2003, p. 11).
2.12.4. Tecnologia Ajax
Ajax é acrônimo em inglês de "Asynchronous Javascript and XML". É um conjunto de técnicas de programação que utiliza tecnologias como JavaScript e XML para carregar informações de forma assíncrona, e estas tecnologias permitem a criação de paginas mais interativas para o usuário.
[...] o uso sistemático de JavaScript e XML (entre outras tecnologias) para tornar o navegador mais interativo com o usuário, utilizando-se solicitações assíncronas de informações. Isso quer dizer que podemos utilizar o Ajax para fazer uma solicitação ao servidor web sem que seja necessário recarregar a página que estamos acessando. (NIEDERAUER, 2007, p.17).
2.12.5.3.10.5 JQuery
É uma biblioteca JavaScript criada por John Resig que serve para aumentar a interatividade com o usúario. Ela pode ser utilizada e alterada sem custo, e com ela pode ser criada interações Ajax, animações, Manipulações de eventos, Manipulação da árvore DOM do HTML.
3.
TRABALHOS RELACIONADOS
Após pesquisa feitas na internet para dar inicio ao desenvolvimento deste sistema, foram encontrados alguns sistemas de cadastro de projetos que ajudaram no amadurecimento da ideia e que foram de grande contribuição para o desenvolvimento do SisCaP.
3.1.Sistema da Universidade Federal de Goiás (SAPPWEB)
O sistema de Acompanhamento de Projetos de Pesquisa e Núcleo de Estudos e Pesquisa da UFG (SAPPWEB)3 foi criado pela Universidade Federal de Goiás, com o objetivo de controlar o cadastro de projetos e núcleos de estudos e pesquisa que são feitos pelos pesquisadores responsáveis pelos mesmos.
O cadastro de projetos é feito da seguinte forma: o pesquisador além de informar os dados do projeto, deverá incluir os arquivos do projeto, certidão de aprovação pelo Conselho Diretor da Unidade ou Coordenação de Pesquisa da Unidade, parecer do Comitê de Ética em Pesquisa dentre outros arquivos. O pesquisador só finalizará o cadastro quando todos os arquivos estiverem incluídos, cumpridas as etapas acima, o sistema irá regularizar o cadastro.
3
O sistema pode ser acessado no endereço
https://ufgnet.ufg.br/cas/login?locale=pt_BR&service=https%3A%2F%2Fufgnet.ufg.br%2F
3.2.Sistema de Informação e Gestão de Projetos (SIGProj)
O Sistema de Informação e Gestao de Projetos (SIGProj4) tem como objetivo auxiliar o planejamento, gestão, avaliação e a publicação de projetos de extensão, pesquisa, ensino e assuntos estudantis desenvolvidos e executados nas universidades brasileiras. O SIGProj está sendo desenvolvido por pesquisadores e alunos de várias universidades brasileiras (formando uma comunidade SIGProj) sob a coordenação do Ministério da Educação (MEC).
A proposta do SIGProj é agilizar o processo de envio de projetos por meio da Internet e consequente parecer técnico de comitês e câmeras, acompanhando e monitorando as atividades da proposta durante as fases de planejamento, execução e avaliação. Além de auxiliar na gestão universitária, tem como objetivo principal contribuir para democratizar todas as informações para a comunidade universitária e a sociedade provendo transparência pública.
Ao realizar o login no site do SIGProj, serão mostradas as últimas mensagens recebidas de um correio eletrônico e os editais em aberto, e ao lado direito as opções do menu como: dados pessoais, correio eletrônico e tabelas com diversas opões, como mostra na figura 18.
4 O sistema pode ser acessado no endereço http://sigproj1.mec.gov.br/
O intuito deste sistema segue o mesmo procedimento que o SisCaP, sempre manter editais, manter dados pessoais, submeter projetos dentre outros serviços que facilitam esse processo e acaba deixando de lado aquela velha burocracia, passando o processo a ser todo informatizado.
A elaboração de projetos é realizada em formulário on-line no SIGProj e diretamente pelo coordenador/tutor da proposta, nas respectivas unidades institucionais, conforme as normas de cada instituição. Para cadastrar um projeto, o coordenador deverá estar vinculado à sua instituição e ter um cadastro prévio de pesquisador no SIGProj.
Tabela 2 - Quadro comparativo de sistemas.
SIGProj SAPPWEB
Características gerais.
Pessoas de qualquer instituição podem se cadastrar no sistema.
Apenas Alunos da UFG podem se cadastrar no sistema.
Tipos de projetos Projeto de extensão e pesquisa. Projeto de pesquisa de Mestrado e Doutorado
Fonte: Próprios autores.
4.
O PROJETO DO SISTEMA
Neste capítulo é documentada a modelagem do sistema que tem a missão de gerenciar a submissão de projetos de pesquisa do Instituto Federal de Goiás, que o denominamos de SisCaP (Sistema de Cadastro de Projetos).
4.1.Fases do Projeto
Os tópicos seguintes descrevem todas as fases do desenvolvimento do projeto, desde a revisão bibliográfica até a redação deste trabalho de término de conclusão de curso. As fases do projeto foram baseadas nos conceitos do autor Wazlawick em seu livro: Análise e Projeto de Sistemas de Informação Orientados a Objetos.
4.2.Visão geral do Sistema
De acordo com Wazlawick (2004, p. 36): “A visão geral do sistema, ou sumário executivo, é um documento de texto em formato livre, onde o analista deve escrever aquilo que ele conseguiu descobrir de relevante sobre o sistema após as conversas com o usuário”. No quadro abaixo segue a visão geral do sistema SisCaP:
Tabela 3 - Visão geral do sistema SisCaP
Sistema SisCaP
Visão Geral do Sistema
O sistema de cadastro de projetos SisCaP é um sistema proposto para a coordenação de projetos da Pro-Reitoria. O sistema irá informatizar todos os procedimentos com relação ao cadastro de editais, de projetos, o cadastro de bolsistas, orientadores e avaliadores. O objetivo do sistema é ter uma agilidade no processo de submissão de projetos e controle de todas as informações relacionadas a cadastros, administrados pela Pro-Reitoria. O sistema deverá listar todos os editais cadastrados e informar a data limite para realização de cadastro de projetos para cada determinado edital.
Os usuários do sistema terão uma tela de login onde permitirá o acesso a página principal do SisCaP. Caso o usuário não tenha cadastro, ficará disponível a opção abaixo dos campos de login, onde somente bolsista e/ou orientador poderão realizar este cadastro. O cadastro dos avaliadores dos projetos será feito pela Pro-Reitoria em outro formulário.
preencherá um formulário de identificação com todos os dados pessoais e acadêmicos e fazer o upload dos documentos pessoais ficando disponível a alteração quando necessário. Também atribuirá nota de seu perfil como estudante baseado nos critérios de avaliação existentes na instituição e poderá visualizar os projetos cadastrados que foram vinculados a ele pelo orientador. As suas manipulações no sistema serão bastante limitadas, pois quem ficará como responsável por realizar todo o cadastro do projeto será o orientador/coordenador.
A Pro-Reitoria ficará responsável pelo cadastro dos avaliadores de projetos do SisCaP. Esta etapa é realizada na página principal do administrador por questões de vulnerabilidade e segurança para que nenhum outro usuário além de bolsista e orientador posso realizar o cadastro na página inicial do SisCaP, e ter acesso a avaliação e atribuição de notas nos projetos cadastrados no sistema.
O usuário orientador realizará o preenchimento do formulário de identificação e upload de seus documentos pessoais. Em outra etapa o mesmo terá acesso aos editais disponíveis e realizar o cadastro do projeto, vinculando o bolsista do projeto. O mesmo também cadastrará a equipe do projeto e a documentação como: projeto, parecer da chefia de departamento, declaração do bolsista, cronograma de atividades dentre outros arquivos. Ele terá permissão de alterar os dados do cadastro do projeto caso necessário, pois sempre existirá essa possibilidade, devido a mudanças no calendário da instituição.
Por fim, o usuário avaliador, tendo em vista que a Pro-Reitoria realizou seu cadastro de usuário, terá a missão de realizar o login no SisCaP, acessar os projetos a ele designado, lembrando que os projetos não terão vínculos de bolsista e orientador nesta etapa por questões de sigilo na hora de realizar a avaliação. O avaliador ficará com a responsabilidade de analisar os critérios de avaliação, atribuir às notas e redigir uma breve descrição de seu parecer e optar por projeto recomendado ou não recomendado.
Fonte: Próprios autores.
4.3.Levantamento de Requisitos
Encontra-se no próprio site do IFG o regulamento da PROAPP5 – Programa de Apoio à Produtividade em Pesquisa, onde se trata todo processo necessário para realização de submissão de projetos no Instituto Federal de Goiás. Assim, mediante a uma minuciosa leitura
e interpretação de todo documento é que foi possível destrinchar o que era necessário para o levantamento de requisitos do sistema.
Os requisitos são classificados em dois tipos, os Requisitos Funcionais (F) – que nada mais é que todo serviço que o sistema deve fazer; Requisitos Não-Funcionais (NF) – que são as restrições sobre os serviços. Os Requisitos Funcionais ainda podem ser classificados em dois grupos: Requisitos funcionais evidentes – que são efetuados com conhecimento do usuário; Requisitos funcionais ocultos – que são efetuados pelos sistemas sem o conhecimento explícito do usuário. Os Requisitos Não-Funcionais podem ser classificados como obrigatórios e desejados, ou seja, aparece para o usuário obrigatoriamente ou apenas quando desejar. (WAZLAWICK, 2004, p. 38-40). Nas tabelas a seguir são levantados todos os requisitos do sistema SisCaP.
Tabela 4 - Requisito cadastrar usuário
F1 Cadastrar Usuário Oculto ( )
Descrição: O sistema terá em sua página inicial a opção de cadastro de usuário onde uma das opções será o tipo de acesso no sistema como bolsista ou orientador.
Requisitos Não-Funcionais
Nome Restrição Categoria Desejável Permanente
NF 1.1 Controle de Acesso
O sistema só permitirá em sua página inicial o cadastro do usuário para tipo de acesso como bolsista ou orientador.
Segurança ( X ) ( X )
NF 1.2 Campos
Todos os interessados em submissão de projetos deverão realizar o cadastro no SisCaP.
Configuração ( X ) ( )
NF 1.3 Verificar Campos
Todos os campos de cadastro de usuário são de preenchimento obrigatório, inclusive o tipo de acesso.
Tabela 5 - Requisito logar no SisCaP
Fonte: Próprios autores.
Tabela 6 - Requisito ajuda no SisCaP
Fonte: Próprios autores.
F2 Logar no SisCaP Oculto ( )
Descrição: O sistema terá dois campos: de usuário e senha caso tenha realizado seu cadastro no SisCaP. Sendo assim, o sistema irá fazer validação de usuário e senha no banco de dados.
Requisitos Não-Funcionais
Nome Restrição Categoria Desejável Permanente
NF 2.1 Cadastro de usuário
Se o usuário não estiver cadastrado no sistema, ele deverá acessar a
opção de cadastrar. Segurança ( )
( X )
NF 2.2 Perca de senha
O sistema terá um campo com a opção para configuração de resgate de senha através de E-mail.
Segurança ( X ) ( X )
F3 Ajuda do SisCaP Oculto ( )
Descrição: O sistema disponibilizará uma tela de ajuda para aquele usuário que esquecer sua senha ou usuário, onde terá um passo a passo e um link redirecionando-o para um formulário de contato com a Pro-Reitoria.
Requisitos Não-Funcionais
Nome Restrição Categoria Desejável Permanente
NF 3.1 Verificar
O Sistema verifica se há cadastro de usuário e senha no banco de dados solicitados pelo usuário e o informa por e-mail sua senha caso aja.
