Upload
dokien
View
214
Download
0
Embed Size (px)
Citation preview
0
D
UNIVERSIDADE TUIUTI DO PARANAacute
ESENN
Paulo Gustavo Marquetti
VOLVIMENTO DE UM SITE DINAcircMICO
A INTERNET PARA O GERDS
CURITIBA 2004
1
PAULO GUSTAVO MARQUETTI
DESENVOLVIMENTO DE UM SITE DINAcircMICO NA INTERNET PARA O GERDS
Monografia apresentada como requisitoparcial a obtenccedilatildeo do tiacutetulo deespecialista em Desenvolvimento Web daFaculdade de Ciecircncias Exatas e deTecnologia da Universidade Tuiuti doPranaacute
Orientador Prof Roberto Neacuteia Amaral
CURITIBA
2004
2
SUMAacuteRIO
1 INTRODUCcedilAtildeO 6 2 TECNOLOGIAS UTILIZADAS8
21 LINGUAGEM8 211 HTML - HyperText Markup Language8 212 PHP - Personal Home Page 12 213 Javascript16
22 PROGRAMAS 17 221 Fireworks 17 222 Dreamweaver17
23 BANCO DE DADOS 18 231 MySQL18
3 DESIGN DO SITE 20 31 DEFINICcedilAtildeO DAS CORES 20
311 A Teoria das Cores 20 312 O Disco Cromaacutetico20 313 Cores Anaacutelogas 21 314 Cores Complementares 21 315 Cores X Idade22 316 Cores utilizadas no Site 22
32 PRINCIacutePIOS DO DESIGN 22 321 Proximidade22 322 Alinhamento22 323 Repeticcedilatildeo23 324 Contraste 23
33 FRAMES 25 331 Cabeccedilalho25 332 Menu25 333 Principal 26 334 Login 26 335 Rodapeacute 26
34 PAacuteGINAS VISIacuteVEIS 27 341 Home 27 342 Cadastro de Pesquisas28 343 Alteraccedilatildeo de Pesquisas 29 344 Cadastro de Artigos 30 345 Alteraccedilatildeo de Artigos31 346 Cadastro de Notiacutecias 32 347 Alteraccedilatildeo de Notiacutecias33 348 Objetivos34 349 Estatuto35 3410 Participantes 36 3411 Colaboradores 37 3412 Visualizar Pesquisas38 3413 Visualizar Artigo 39
3
3414 Visualizar Notiacutecia 40 3415 Mural41 3416 Exclusatildeo do Mural 42 3417 Administraccedilatildeo 43 3418 Cadastro de Usuaacuterios 44 3419 Alteraccedilatildeo de Usuaacuterio 45
35 PAacuteGINAS NAtildeO VISIacuteVEIS 47 351 Conexatildeophp47 352 deleta_artigophp 47 353 deleta_muralphp 47 354 deleta_noticiaphp47 355 deleta_pesquisaphp47 356 deleta_usuaacuteriophp 47 357 grava_alteracaoartigophp 47 358 grava_alteracaonoticiaphp48 359 grava_alteracaopesquisaphp48 3510 grava_alteracaousuariophp 48 3511 grava_artigophp 48 3512 grava_notiacuteciaphp 48 3513 grava_pesquisaphp48 3514 grava_muralphp 48 3515 grava_usuaacuteriophp 48 3516 loginphp 48
4 COacuteDIGO FONTE 49 5 CONCLUSAtildeO 50 REFEREcircNCIAS52 ANEXOS 54
4
LISTA DE FIGURAS FIGURA 1 - DISCO CROMAacuteTICO 21 FIGURA 2 - REPRESENTACcedilAtildeO DOS FRAMES 25 FIGURA 3 - HOME 27 FIGURA 4 - CADASTRO DE PESQUISAS 28 FIGURA 5 - ALTERACcedilAtildeO DE PESQUISAS 29 FIGURA 6 - CADASTRO DE ARTIGOS 30 FIGURA 7 - ALTERACcedilAtildeO ARTIGOS 31 FIGURA 8 - CADASTRO DE NOTIacuteCIAS 32 FIGURA 9 - ALTERACcedilAtildeO DE NOTIacuteCIAS 33 FIGURA 10 - OBJETIVOS 34 FIGURA 11 - ESTATUTO 35 FIGURA 12 - PARTICIPANTES 36 FIGURA 13 - COLABORADORES 37 FIGURA 14 - VISUALIZAR PESQUISAS 38 FIGURA 15 - DETALHE DA PESQUISA 38 FIGURA 16 - VISUALIZAR ARTIGO 39 FIGURA 17 - DETALHE DO ARTIGO 39 FIGURA 18 - VISUALIZAR NOTIacuteCIA 40 FIGURA 19 - DETALHE DA NOTIacuteCIA 40 FIGURA 20 - MURAL 41 FIGURA 21 - EXCLUSAtildeO DO MURAL 42 FIGURA 22 - ADMINISTRACcedilAtildeO 43 FIGURA 23 - CADASTRO DE USUAacuteRIOS 44 FIGURA 24 - PESQUISA USUAacuteRIOS 45 FIGURA 25 - ALTERACcedilAtildeO DE USUAacuteRIOS 46
5
Resumo O presente trabalho aborda a anaacutelise e o desenvolvimento de um site
dinacircmico na Internet tendo como contratante o Gerds (grupo de estudos
interdisciplinar em redes de computadores e sistemas distribuiacutedos) da Universidade
Tuiuti do Paranaacute que tem por objetivo divulgar as pesquisas realizadas por alunos
professores e colaboradores participantes do grupo em questatildeo Este foi elaborado
a partir de teacutecnicas de desenvolvimento de sites e entrevistas feitas diretamente com
o contratante
Palavras-chave Desenvolvimento de site site dinacircmico PHP MySQL HTML
6
1 INTRODUCcedilAtildeO
Estima-se que hoje existam mais de 250 milhotildees de pessoas que utilizam a
Internet natildeo soacute como ferramenta de trabalho mas tambeacutem como diversatildeo e
pesquisa Essas pessoas esperam obter da plataforma Web um material de alta
qualidade (incluindo imagens animaccedilatildeo som e viacutedeo) e que esse material esteja
apresentado de forma agradaacutevel e funcionando de forma raacutepida e eficiente A
especializaccedilatildeo em Desenvolvimento Web ofereceu a preparaccedilatildeo para o trabalho no
desenvolvimento conhecimento e utilizaccedilatildeo das tecnologias multimiacutedia e Internet e
dos sistemas e aplicaccedilotildees que fazem uso dessas tecnologias
O desenvolvimento do site do Gerds (grupo de estudos interdisciplinar em
redes de computadores e sistemas distribuiacutedos) da UTP tem por objetivo divulgar o
trabalho realizado por alunos professores colaboradores e participantes dos cursos
de Engenharia da Computaccedilatildeo Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia
da Computaccedilatildeo e os cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes
de Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
universidade e a comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados
ou por transferecircncia de tecnologias inserindo professores e alunos num contexto
soacutecio-econocircmico mais amplo do que a realidade acadecircmica Essas informaccedilotildees satildeo
oferecidas pelo site atraveacutes de pesquisas artigos e notiacutecias periodicamente
atualizadas aleacutem de permitir que se desenvolva uma comunicaccedilatildeo bilateral entre os
interessados atraveacutes do cadastramento dessas pessoas no site bem como a
possibilidade de se deixar mensagens em um mural destinado a esse fim Sendo o contratante do serviccedilo o Gerds ficou definido como pessoa
responsaacutevel pela definiccedilatildeo das necessidades do site o professor Roberto Amaral
Atraveacutes de teacutecnicas de levantamento de dados (ver anexo I) foram obtidos os dados
baacutesicos necessaacuterios para o desenvolvimento do site A presente monografia estaacute estruturada em 5 capiacutetulos cujo conteuacutedo eacute
apresentado sucintamente a seguir
O Capiacutetulo 2 apresenta uma introduccedilatildeo aos conceitos das tecnologias
utilizadas enfocando sua histoacuteria e utilizaccedilatildeo na atual estrutura da Internet
O Capiacutetulo 3 apresenta a descriccedilatildeo de como foi realizado o design do site e a
funcionalidade das paacuteginas
O Capiacutetulo 4 apresenta a referecircncia ao coacutedigo fonte do trabalho
7
O Capiacutetulo 5 apresenta a conclusatildeo do trabalho
8
2 TECNOLOGIAS UTILIZADAS
De acordo com os estudados realizados as seguintes tecnologias foram
utilizadas para o desenvolvimento do site do Gerds
bull Linguagem o HTML ndash Utilizada para fazer o corpo principal das paacuteginas Adotado
por ser gratuito e amplamente utilizado na Internet
o PHP ndash Apesar do conteuacutedo apresentado nas aulas ter sido baseado
em ASP um novo estudo em linguagem PHP foi realizado em
classe e extra classe pois foi utilizado um servidor com sistema
operacional Linux com o servidor de banco de dados Apache que
interpreta somente a linguagem PHP Foi utilizado para tornar as
paacuteginas dinacircmicas e realizar a comunicaccedilatildeo com o banco de
dados
o JavaScript ndash Utilizado para criar funccedilotildees que satildeo executadas na
maacutequina do usuaacuterio Adotado por ser gratuito e amplamente
utilizado na Internet
bull Programas o Fireworks ndash Utilizado para fazer as imagens e construir a parte
visual do site Foi adotado por ser uma ferramenta que permite
trabalhar com layouts de sites de forma raacutepida e faacutecil e ter ampla
compatibilidade com o Dreamweaver
o Dreamweaver ndash Utilizado para a construccedilatildeo do site e a
programaccedilatildeo Adotado por ser uma ferramenta completa e que
permite desenvolver e administrar o site de forma raacutepida e eficiente
bull Banco de Dados o MySQL ndash Utilizado para armazenar os dados do site Adotado por
ser gratuito e amplamente utilizado em aplicaccedilotildees Web
21 Linguagem
211 HTML - HyperText Markup Language
No nuacutecleo de toda paacutegina da Web encontra-se a HyperText Markup
Language uma linguagem de diagramaccedilatildeo baseada em marcadores ou tags
9
(marcas utilizadas pela linguagem html que permitem ao browser formatar o texto
entre as tags de acordo com cada tag especiacutefica) como eacute mais comumente
conhecido A HTML eacute uma linguagem simples baseada em texto e que pode ser
visualizada em qualquer plataforma tanto em navegadores somente texto (como o
Lynx) como em navegadores mais avanccedilados (como Netscape Navigator e Internet
Explorer)
A HTML eacute na verdade apenas texto com coacutedigos de formataccedilatildeo que
especificam diferentes fontes e estilos ou ateacute mesmo outras funccedilotildees mais
avanccediladas Ela eacute muito semelhante aos antigos editores de texto que exigiam a
inserccedilatildeo de tags para especificar tipos em itaacutelico negrito ou sublinhado
O HTML nasceu em 1990 no CERN (European Council for Nuclear Research)
na Suiacuteccedila Seu criador o inglecircs Tim Berners-Lee a concebeu unicamente como uma
linguagem que serviria para interligar computadores do laboratoacuterio e outras
instituiccedilotildees de pesquisa e exibir documentos cientiacuteficos de forma simples e faacutecil de
acessar (STANEK 1996)
Em 1992 com a liberaccedilatildeo da biblioteca de desenvolvimento para WWW
(World Wide Web ou Rede de Alcance Mundial) aconteceu uma grande evoluccedilatildeo o
que foi fundamental para expansatildeo do HTML Essa biblioteca deu origem agrave
construccedilatildeo de vaacuterios browsers e servidores tornando a Web uma ferramenta viaacutevel
O MOSAIC desenvolvido por Marc Andreeson entatildeo do NCSA foi o primeiro
browser multi-plataforma que explorava completamente a capacidade de hipermiacutedia
da Web e que iniciou o crescimento explosivo da mesma Em 1993 o HTML tornou-
se disponiacutevel a milhotildees de usuaacuterios com a liberaccedilatildeo das versotildees para Mac e
Windows (STANEK 1996)
Quanto as suas especificaccedilotildees o HTML percorreu um caminho longo ateacute
chegar agrave sua atual especificaccedilatildeo Atualmente 4 especificaccedilotildees do HTML estatildeo
definidas Cada nova especificaccedilatildeo eacute compatiacutevel com as especificaccedilotildees anteriores e
incluem diversas melhorias A primeira especificaccedilatildeo do HTML que eacute a versatildeo
original foi a HTML 10 Tim Berners-Lee juntamente com David Ragget a
publicaram em 1993 Devido a sua capacidade limitada a versatildeo 10 permitia o
desenvolvimento de documentos baacutesicos Incluiacutea muacuteltiplos niacuteveis de cabeccedilalhos
exibiccedilatildeo de paraacutegrafos navegaccedilatildeo por referecircncias a hipertextos (composiccedilatildeo de
elementos de informaccedilatildeo paraacutegrafos paacuteginas imagens sequumlecircncias musicais etc e
10
ligaccedilotildees entre esses elementos indicando a passagem de um a outro) e
formataccedilotildees especiais para itens de uma lista (STANEK 1996)
A definiccedilatildeo do HTML 20 concluiacuteda em 1995 foi a primeira versatildeo
recomendada pelo IETF ndash Internet Engineering Task Force e se tornou um padratildeo
da Internet Ela oferece um melhor controle sobre os layouts dos textos
apresentados nas paacuteginas aleacutem da inclusatildeo de imagens e formulaacuterios que permite
aos desenvolvedores conseguir a participaccedilatildeo dos usuaacuterios de forma faacutecil e raacutepida
aleacutem de explorar as capacidades multimiacutedias da Web (STANEK 1996)
O HTML 30 de 1996 permite novos formatos de textos Uma de suas
caracteriacutesticas mais importantes eacute a definiccedilatildeo dos tags necessaacuterios para a criaccedilatildeo
de tabelas que permitem que os desenvolvedores apresentem as informaccedilotildees
desejadas formatadas em linhas e colunas (STANEK 1996) Durante o
desenvolvimento do HTML 30 com a rapidez da expansatildeo da Web os esforccedilos de
padronizaccedilatildeo natildeo puderam acompanhar as tendecircncias de desenvolvimento que
exigiam maiores recursos de apresentaccedilatildeo graacutefica do que o HTML 20 podia
fornecer Por isso o HTML 30 acabou natildeo sendo aprovado e em 1997 aprovou-se
uma recomendaccedilatildeo chamada HTML 32 que introduzia recursos de apresentaccedilatildeo
graacutefica no HTML (INTRODUCING 2004)
O HTML 40 de 1998 eacute uma extensatildeo do HTML 32 Essa versatildeo oferece
melhorias nos recursos de acessibilidade Quando o HTML eacute usado de forma
estruturada um documento pode se adaptar a diferentes browsers acomodar
diferentes fontes cores especiais sintetizadores de voz e dispositivos Braille Essa
adaptabilidade permite a pessoas com defeitos fiacutesicos trabalhar de forma facilitada
na Web Essa versatildeo adotou tambeacutem o Universal Character Set que usa o suporte
a convenccedilotildees internacionais permitindo a utilizaccedilatildeo de quase todas as linguagens
do mundo Outra novidade satildeo os frames (dividem a paacutegina em duas ou mais partes
ndash framesets - e satildeo geralmente usados para que um frameset permaneccedila enquanto
outros mudem baseados nos links que o usuaacuterio seleciona) Vaacuterios elementos do
HTML 32 foram considerados deprecados (candidatos a se tornarem obsoletos)
pelo HTML 40 forccedilando uma ecircnfase na separaccedilatildeo da estrutura do documento e na
apresentaccedilatildeo dos elementos que permitem definir cores fontes alinhamento
imagens de fundo e outras caracteriacutesticas da apresentaccedilatildeo da paacutegina que
dependem da plataforma onde a informaccedilatildeo eacute visualizada Essa separaccedilatildeo pocircde ser
realizada graccedilas a CSS (Cascading Style Sheets) que permite a criaccedilatildeo de folhas
11
de estilo aplicaacuteveis a vaacuterias paacuteginas de um site Se um dispositivo limitado natildeo
consegue exibir os estilos definidos no CSS ele pelo menos consegue entender a
estrutura do texto e imagens de forma que mesmo usuaacuterios com menos recursos
podem ter acesso agrave informaccedilatildeo contida na paacutegina (HTML 2004)
2111 Forma Baacutesica de um Documento HTML
Como jaacute foi citado anteriormente o HTML eacute na verdade apenas texto com
coacutedigos de formataccedilatildeo que especificam diferentes fontes e estilos Com a inserccedilatildeo
das tags o texto que estaacute compreendido entre essas marcas assume
caracteriacutesticas diferentes de acordo com cada uma delas
Cada tag informa ao browser como ele deveraacute formatar o texto que deve
estar dentro dos sinais de menor que (lt) e maior que (gt) Por exemplo ltHTMLgt
ltBODYgt
Os tags podem ser uacutenicos ou duplos com iniacutecio e fim Se forem duplos
existiraacute um tag informando que aquela formataccedilatildeo estaacute sendo encerrada Por
exemplo um tag simples pode ser representado por rdquoltbrgtrdquo que indica uma quebra
de linha Jaacute um tag duplo pode ser ltbgtltbgt indicando que o que estiver entre
esses campos deveraacute ser apresentado em negrito
A estrutura de um documento HTML apresenta os seguintes componentes
ltHTMLgt
ltHEADgtltTITLEgtTiacutetulo do DocumentoltTITLEgtltHEADgt
ltBODYgt
texto imagem links ltBODYgt
ltHTMLgt
Todo documento HTML deve estar entre os tags ltHTMLgt e ltHTMLgt A partir
daiacute esses documentos satildeo divididos em duas seccedilotildees principais a seccedilatildeo HEAD e a
seccedilatildeo BODY A HEAD conteacutem informaccedilotildees sobre o documento O tag ltTITLEgt por
exemplo define um tiacutetulo que eacute mostrado no alto da janela do browser Tudo que
estiver contido na seccedilatildeo ltBODYgt seraacute mostrado na janela principal do browser
12
Essa seccedilatildeo pode conter cabeccedilalhos paraacutegrafos listas tabelas links para outros
documentos e imagens
212 PHP - Personal Home Page
Como as paacuteginas em HTML satildeo basicamente apresentaccedilotildees de texto e
imagens com o passar do tempo surgiu a necessidade de uma interaccedilatildeo maior com
o usuaacuterio permitindo que se tivesse um histoacuterico desse usuaacuterio aleacutem da
possibilidade de se mostrar informaccedilotildees personalizadas aos mesmos Para esse
propoacutesito umas das linguagens que surgiram e que tinham forte ligaccedilatildeo com o
HTML foi o PHP
O PHP eacute uma linguagem de server-side (as paacuteginas ficam armazenadas e
satildeo executadas em um servidor onde o site estaacute localizado) e open-source (um
programa que tem seu coacutedigo fonte disponiacutevel para que qualquer pessoa que tenha
uma ideacuteia uma sugestatildeo possa ajudar no seu desenvolvimento) para criaccedilatildeo de
paacuteginas dinacircmicas para a Web Uma paacutegina dinacircmica eacute aquela que interage com o
usuaacuterio de forma que cada usuaacuterio ao visitar a paacutegina veraacute informaccedilotildees
personalizadas Os aplicativos dinacircmicos da Web satildeo predominantes nos sites
comerciais(e-commerce ndash sites de venda pela Internet) onde o conteuacutedo
apresentado eacute gerado a partir de informaccedilotildees acessadas de um banco de dados ou
outra fonte externa Sua interface permite que se incluam comandos PHP
diretamente na paacutegina HTML
O PHP sucede de um produto mais antigo chamado PHPFI PHPFI foi
criado por Rasmus Lerdorf em 1994 inicialmente como scripts (arquivos texto com
um conjunto de instruccedilotildees de uma linguagem especiacutefica nos quais estatildeo contidas
todas as instruccedilotildees que dizem o que o programa faraacute) usados para gerar estatiacutesticas
de acesso para seu curriacuteculo on line Ele nomeou esta seacuterie de scripts de ldquoPersonal
Home Page Toolsrdquo a qual adquiriu um relativo ecircxito devido a outras pessoas
pedirem a Rasmus que lhes permitisse utilizar os seus programas nas suas proacuteprias
paacuteginas Web Como mais funcionalidades foram requeridas Rasmus escreveu uma
implementaccedilatildeo em linguagem C muito maior que era capaz de comunicar-se com
uma base de dados e possibilitava a usuaacuterios o desenvolvimento simples de
aplicativos dinacircmicos para Web Devido agrave aceitaccedilatildeo do primeiro PHP e de maneira
adicional o seu criador desenhou um sistema para processar formulaacuterios ao qual
13
deu o nome de FI (Form Interpreter) e o conjunto destas duas ferramentas seria a
primeira versatildeo compacta da linguagem PHPFI Rasmus resolveu distribuir o
coacutedigo fonte do PHPFI para que todos pudessem ver e tambeacutem usaacute-lo bem como
corrigir bugs e melhorar o coacutedigo (HISTOacuteRIA 2004)
O PHPFI usava interpretaccedilotildees automaacuteticas de variaacuteveis vindas de formulaacuterio
(dados passados pelos usuaacuterios) e era embutida diretamente no coacutedigo do HTML
Poreacutem a sua sintaxe era limitada simples e um pouco inconsistente
Em 1997 PHPFI 20 a segunda versatildeo da implementaccedilatildeo em linguagem C
obteve milhares de usuaacuterios ao redor do mundo com um valor estimado de
aproximadamente 50000 domiacutenios respondendo por basicamente 1 dos domiacutenios
da Internet Enquanto isto havia milhares de pessoas contribuindo com pequenos
coacutedigos para o projeto e ainda assim o PHPFI 20 foi oficialmente lanccedilado somente
ao final de 1997 apoacutes perder a maior parte de sua vida em versotildees beta (versotildees de
um produto que satildeo distribuiacutedas para teste dos usuaacuterios antes do lanccedilamento
oficial) O PHPFI 20 foi rapidamente substituiacutedo pelas versotildees iniciais do PHP 30
(HISTOacuteRIA 2004)
O PHP 30 foi a primeira versatildeo que se assemelha ao PHP que eacute utilizado
atualmente Ela foi criada por Andi Gutmans e Zeev Suraski em 1997 e foi
totalmente reescrito apoacutes eles descobrirem que o PHPFI 20 poderia ajudaacute-los a
desenvolver suas proacuteprias aplicaccedilotildees de e-Commerce de um projeto na sua
Universidade No esforccedilo cooperativo e iniciativa de reescrever o PHPFI a partir da
base existente Andi Rasmus e Zeev decidiram unir esforccedilos e anunciar o PHP 30
como uma versatildeo oficial de seu antecessor (o PHPFI 20) (HISTOacuteRIA 2004)
O PHP 30 aleacutem de oferecer aos usuaacuterios finais uma infraestrutura soacutelida
para diversos bancos de dados protocolos e APIs a extensibilidade (possibilidade
de uso para diversos objetivos) do PHP 30 atrai dezenas de novos desenvolvedores
para se juntar e submeter novos moacutedulos Esta eacute a chave do sucesso do PHP 30
Outras caracteriacutesticas chaves introduzidas no PHP 30 foram o suporte agrave sintaxe
para orientaccedilatildeo a objetos e uma sintaxe muito mais poderosa e consistente
O PHP 30 foi oficialmente lanccedilado em Junho de 1998 depois de ter passado
aproximadamente 9 meses em testes puacuteblicos (versotildees beta) Os objetivos do
projeto eram melhorar a performance de aplicaccedilotildees complexas e melhorar a
modularidade do coacutedigo base do PHP
14
O PHP 40 acompanhado com uma seacuterie de novas caracteriacutesticas foi
oficialmente lanccedilada no iniacutecio de 2000 quase dois anos apoacutes o seu antecessor
Aleacutem da melhora na performance esta versatildeo incluiu outras caracteriacutesticas chave
como o suporte para muitos servidores Web sessotildees HTTP buffer de saiacuteda e
maneiras mais seguras de manipular entrada de dados dos usuaacuterios (HISTOacuteRIA
2004)
De acordo com o site oficial do PHP (phpnetusagephp) atualmente
aproximadamente 17 milhotildees de domiacutenios estatildeo usando PHP na Web
2121 PHP - Por que utilizar
A popularidade do PHP continua crescendo rapidamente devido a muitas
vantagens Eacute raacutepido pois devido a estar embutido no coacutedigo HTML o tempo para
processar e carregar uma paacutegina Web eacute curto Eacute graacutetis e faacutecil de usar pois os
coacutedigos PHP satildeo facilmente incluiacutedos no arquivo HTML eacute versaacutetil pois o PHP roda
em uma grande variedade de sistemas operacionais eacute muito seguro pois se o
coacutedigo for escrito corretamente o usuaacuterio natildeo iraacute enxergar o coacutedigo PHP aleacutem de
ser customizaacutevel pois a licenccedila open-source permite aos programadores
modificarem o PHP adicionando ou modificando as caracteriacutesticas necessaacuterias ao
seu proacuteprio desenvolvimento
Devido ao PHP ser executado no servidor ele pode dinamicamente criar o
coacutedigo HTML que iraacute gerar a paacutegina Web permitindo que os usuaacuterios individuais
vejam paacuteginas customizadas Os visitantes da paacutegina Web vecircem a saiacuteda gerada
pelos scripts mas natildeo os scripts propriamente ditos tornando-o muito seguro
O PHP consegue trabalhar com ldquosessotildeesrdquo ou seja para executar
determinadas accedilotildees (fazer um download por exemplo) o usuaacuterio deve estar
identificado no site O PHP permite que se crie uma ldquosessatildeordquo que identifica cada
usuaacuterio no sistema aleacutem de outros dados referentes ao mesmo Se o usuaacuterio tentar
entrar em uma paacutegina especiacutefica primeiramente eacute verificado se existe uma sessatildeo
para o mesmo Se natildeo existir eacute mostrada uma mensagem de acesso proibido Se a
sessatildeo for vaacutelida os outros paracircmetros do usuaacuterio (salvos na sessatildeo) podem ser
verificados e validados caso necessaacuterio
2122 PHP - Como Funciona
15
Segundo Janet Valade (VALADE2004) O coacutedigo PHP eacute embutido no coacutedigo
HTML As tags do HTML satildeo usadas para incluir a linguagem PHP na linguagem
HTML Quando o PHP estaacute instalado o servidor Web eacute configurado para procurar
por coacutedigo PHP embutido em arquivos com extensotildees especiacuteficas (php ou phtml)
Quando o servidor recebe uma requisiccedilatildeo para um arquivo com uma dessas
extensotildees ele envia o coacutedigo HTML como estaacute mas o coacutedigo PHP eacute processado
pelo software antes de ser enviado ao solicitante Quando a linguagem PHP eacute
processada a saiacuteda consiste de coacutedigo HTML Os coacutedigos PHP natildeo satildeo incluiacutedos
no HTML enviado ao browser por isso o coacutedigo PHP eacute seguro e transparente para o
usuaacuterio Quando um browser eacute apontado para um arquivo HTML o servidor envia o
arquivo ao browser O browser processa o arquivo e mostra a paacutegina descrita pelos
tags HTML do arquivo Quando um Web browser eacute apontado para um arquivo PHP
o servidor procura por seccedilotildees PHP no arquivo e os processa enviando o resultado
do processamento ao browser Esses satildeo os passos seguidos pelo servidor para
processar um arquivo PHP
1 O servidor inicia a procura no arquivo em modo HTML Ele assume que o
coacutedigo eacute HTML e os envia ao browser sem nenhum processamento
2 O servidor web continua em modo HTML ateacute encontrar um tag de abertura do
PHP (lt)
3 Quando o servidor encontra um tag de abertura do PHP alterna para modo
PHP assume que todos os comandos subsequumlentes satildeo desse tipo e os
executa Se o comando gera uma saiacuteda a envia ao browser
4 O servidor continua em modo PHP ateacute encontrar um tag de fechamento do
PHP (gt)
5 Quando o servidor encontra um tag de fechamento do PHP retorna ao modo
HTML e repete o ciclo
2123 Forma Baacutesica de um Documento PHP
O PHP eacute embutido diretamente no programa HTML Seus comandos satildeo
delimitados pelos tags lt e gt Dentro dos tags de abertura e fechamento do PHP
satildeo incluiacutedos comandos especiacuteficos que satildeo interpretados pela linguagem A sintaxe
eacute bastante parecida com a da linguagem C Por exemplo
ltHTMLgt
16
ltHEADgtltTITLEgtTeste PHPltTITLEgtltHEADgt
ltBODYgt
ltpgt Linha HTML
lt
$id = $_GET[id]
if ($id = 1)
echo ldquoltpgtUsuaacuterio Nordm 1ltpgtrdquo
else
echo ldquoltpgt Usuaacuterio Nordm 2ltpgtrdquo
gt
ltBODYgt
ltHTMLgt
213 Javascript
Javascript eacute uma linguagem criada pela Netscape que serve basicamente
para aumentar os recursos do navegador
Todas as paacuteginas escritas com HTML satildeo estaacuteticas Conseguem fazer com
que o browser apenas leia o que haacute no coacutedigo e reproduza aquele conjunto de
instruccedilotildees Um dos principais recursos do Javascript eacute a possibilidade de fazer com
que a paacutegina HTML seja dinacircmica ou seja capaz de fazer com que o usuaacuterio possa
interagir com a paacutegina ou usar outros recursos para fazer com que o documento
Web se altere sem necessidade de um novo carregamento de paacutegina
O Javascript eacute uma linguagem de programaccedilatildeo que funciona interativamente
com o coacutedigo HTML O Javascript consegue ler entender e manipular os objetos de
uma paacutegina HTML tendo a facilidade necessaacuteria para alteraacute-los automaticamente
quando programado Satildeo inseridos nas paacuteginas de uma maneira peculiar podendo
ter apenas uma aacuterea para scripts ou espalhados pelo coacutedigo do jeito que melhor se
adapte agraves necessidades de cada usuaacuterio Diferentemente da linguagem PHP o
Javascript eacute uma linguagem client-side (as paacuteginas satildeo armazenadas e executadas
na maacutequina cliente) (LOURENCcedilO 2000)
17
22 Programas
221 Fireworks
O Fireworks eacute uma ferramenta de produccedilatildeo graacutefica para criaccedilatildeo de interfaces
e imagens Web com interaccedilatildeo em vaacuterias linguagens scripts (como php cfml html
xml Xhtml) podendo montar sites atraveacutes de desenhos O Fireworks consegue
combinar muito bem recursos vetoriais (como o ajuste de textos recursos praacuteticos
de desenho e ediccedilatildeo de noacutes) com os recursos aplicados a bitmaps ou imagens
(como o tratamento de cores e ferramentas de efeitos)
Tambeacutem permite trabalhar com layouts de sites sendo que pode-se
transformar o layout em uma paacutegina HTML usando o recurso de slices (fatias) O
programa permite que vocecirc divida o layout inteiro em vaacuterias imagens de acordo com
as aacutereas especiacuteficas que se deseja criar Apoacutes essa divisatildeo cada uma dessas aacutereas
eacute exportada com um formato de arquivo e com uma compactaccedilatildeo especiacutefica
podendo gerar o HTML com as imagens (ou fatias) nos seus devidos lugares e
posiccedilotildees ou mesmo exporta-las para o Dreamweaver Sua outra vantagem eacute a
possibilidade de se trabalhar com os behaviors (comportamentos) Com os
bahaviors pode-se criar rollovers (menus interativos) e menus pop ups (menus que
abrem outros sub-menus de acordo com cada item) estilizados
Como o Fireworks foi inicialmente projetado para a Web permite tambeacutem a
exportaccedilatildeo de imagens para a rede Esses recursos incluem a total otimizaccedilatildeo de
cada formato de arquivo a ser exportado bem como GIFS e JPEGS Aleacutem disso
pode-se fazer uma comparaccedilatildeo visual e do tamanho do arquivo simultaneamente
de ateacute 4 formatos ou configuraccedilotildees de exportaccedilotildees e tambeacutem salvar as mesmas
configuraccedilotildees para usar mais tarde em outros arquivos (CARACTERIacuteSTICAS
2004)
222 Dreamweaver
O Dreamweaver eacute um editor profissional de HTML utilizado para projetar
codificar e desenvolver sites paacuteginas e aplicaccedilotildees Web Permite que se trabalhe as
paacuteginas HTML de forma manual ou em um ambiente de ediccedilatildeo visual fornecendo
ferramentas uacuteteis para esses fins O Dreamweaver tambeacutem permite que se construa
aplicaccedilotildees Web dinacircmicas usando linguagens que rodam nos servidores (PHP
nesse caso) (PAGE 2004) Algumas das facilidades do Dreamweaver satildeo
18
bull Administraccedilatildeo remota do site e arquivos fonte localmente
bull Operaccedilatildeo em CSS (Cascade Style Sheets)
bull Geraccedilatildeo automatizada de rotinas em Javascript
bull Formulaacuterios
bull Criaccedilatildeo e uso de templates (modelos)
bull Gerenciamento completo do site e seus componentes (por exemplo se um
arquivo de imagem for movido de um sub-diretoacuterio para outro todo o site eacute
reparado automaticamente)
bull Apresentaccedilatildeo do mapa do site com diferentes niacuteveis de detalhamento
bull Behaviors (comportamentos que depois podem ser reaproveitados) com
rotinas de JavaScript
bull Manipulaccedilatildeo de tabelas
bull Rollover de imagens
bull Administraccedilatildeo do site a partir da barra de menu
bull Reparo automaacutetico do site a partir da mudanccedila de endereccedilo ou nome de
uma miacutedia ou link em geral
23 Banco de Dados
231 MySQL
O MySQL eacute um SGDB (ou sistema gerenciador de banco de dados) que eacute
desenvolvido e distribuiacutedo pela MySQL AB a empresa fundada pelos suecos David
Axmark Allan Larsson e Michael Widenius Ele derivou de outro banco de dados o
mSQL Pelo fato do mesmo natildeo ser raacutepido nem flexiacutevel o suficiente para as suas
necessidades os suecos resolveram criar um novo banco de dados utilizando a
interface API (application programming interface - conjunto de rotinas padronizadas
que a aplicaccedilatildeo utiliza para efetuar seus serviccedilos) do proacuteprio mSQL utilizada para
facilitar a portabilidade de coacutedigos escritos do mSQL para o MySQL
Escrito em C e C++ e testado em vaacuterias plataformas diferentes o MySQL
possui um sistema de alocaccedilatildeo de memoacuteria baseado em processos que permite a
execuccedilatildeo de tarefas paralelas tornando-o extremamente raacutepido e eficiente Ele eacute um
banco de dados do tipo SQL (Structured Query Language) e por isso possui as
caracteriacutesticas dos principais bancos de dados do tipo SQL como operadores e
funccedilotildees agrupamentos joins (junccedilotildees de tabelas) aceita vaacuterios tipos de campos
19
suportando registros de tamanhos fixos ou variaacuteveis controla a seguranccedila dos
dados aleacutem de poder armazenar uma grande quantidade de dados chegando a
quantidades superiores a 50000000 de registros Aleacutem disso o MySQL eacute multi-
usuaacuterio (programas de mais de um usuaacuterio podem estar em execuccedilatildeo) eacute multi-
tarefa (eacute capaz de executar vaacuterios programas simultaneamente mesmo que a
maacutequina possua somente um processador) e open-source
Esse servidor de banco de dados eacute considerado como o mais raacutepido entre os
de sua categoria tanto para grandes volumes de dados como pequenos Poreacutem
como ele foi criado para ser extremamente aacutegil teve-se de descartar certos aspectos
das especificaccedilotildees SQL e foi decidido natildeo se implementar caracteriacutesticas que geram
muita demanda de recursos como os triggers que satildeo uma porccedilatildeo de coacutedigo
armazenado que se executa quando eacute realizada uma operaccedilatildeo (atualizaccedilatildeo
inclusatildeo etc) com o banco de dados Naturalmente comprovar a proacutepria existecircncia
do trigger e executaacute-lo consome recursos e tempo
As principais vantagens do MySQL satildeo a baixa demanda de recursos de
hardware a simplicidade de administraccedilatildeo e a otimizaccedilatildeo para as aplicaccedilotildees tiacutepicas
da web onde ocorrem mais consultas do que atualizaccedilotildees (MySQL 2004)
20
3 DESIGN DO SITE
Atraveacutes de um briefing (anexo 1) pode-se chegar a algumas conclusotildees que
influenciaram na escolha da forma de apresentaccedilatildeo das paacuteginas e levaram a
definiccedilatildeo de quais cores imagens e forma o site seria apresentado aos usuaacuterios
31 DEFINICcedilAtildeO DAS CORES
311 A Teoria das Cores
O que se convencionou chamar de Teoria das Cores de Leonardo da Vinci
satildeo as formulaccedilotildees histoacutericas esparsas contidas em seus escritos e reunidas no livro
Tratado da Pintura e da Paisagem ndash Sombra e Luz que satildeo anotaccedilotildees recolhidas
pelo artista ao longo de anos de observaccedilatildeo e eacute a teoria mais corrente sendo um
dos legados do renascimento para as artes visuais (TEORIA 2004)
312 O Disco Cromaacutetico
O disco cromaacutetico natildeo eacute um instrumento cientiacutefico de classificaccedilatildeo de cores
mas eacute muito uacutetil no entendimento da teoria das cores As cores se dividem em
primaacuterias secundaacuterias e terciaacuterias (TEORIA 2004)
Pode-se reproduzir qualquer sensaccedilatildeo de cor misturando-se aditivamente
diversas quantidades de vermelho azul e verde Por isso conhecem-se essas cores
como cores primaacuterias (ENCARTA 2000) Combinado-se duas cores primaacuterias
obtemos as cores secundaacuterias resultando no laranja (amarelo com vermelho) verde
(azul com amarelo) e violeta (vermelho com azul) As cores terciaacuterias satildeo obtidas
pela mistura de uma primaacuteria com uma ou mais secundaacuterias (TEORIA 2004)
21
A figura 1 apresenta a representaccedilatildeo graacutefica do disco cromaacutetico
FIGURA 1 ndash DISCO CROMAacuteTICO
313 Cores Anaacutelogas
Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores anaacutelogas satildeo as
cores dispostas lado a lado no disco cromaacutetico Satildeo anaacutelogas porque haacute nelas uma
mesma cor baacutesica e satildeo usadas para dar a sensaccedilatildeo de uniformidade Observando
a figura 1 visualiza-se que a cor anaacuteloga do amarelo eacute o laranja por exemplo
314 Cores Complementares Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores complementares
satildeo aquelas que encontram-se sempre em posiccedilotildees opostas no disco cromaacutetico As
cores complementares satildeo usadas para dar forccedila e equiliacutebrio a um trabalho criando
contrastes Observando a figura 1 visualiza-se que a cor complementar do
vermelho eacute o verde e do laranja eacute o azul por exemplo
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
1
PAULO GUSTAVO MARQUETTI
DESENVOLVIMENTO DE UM SITE DINAcircMICO NA INTERNET PARA O GERDS
Monografia apresentada como requisitoparcial a obtenccedilatildeo do tiacutetulo deespecialista em Desenvolvimento Web daFaculdade de Ciecircncias Exatas e deTecnologia da Universidade Tuiuti doPranaacute
Orientador Prof Roberto Neacuteia Amaral
CURITIBA
2004
2
SUMAacuteRIO
1 INTRODUCcedilAtildeO 6 2 TECNOLOGIAS UTILIZADAS8
21 LINGUAGEM8 211 HTML - HyperText Markup Language8 212 PHP - Personal Home Page 12 213 Javascript16
22 PROGRAMAS 17 221 Fireworks 17 222 Dreamweaver17
23 BANCO DE DADOS 18 231 MySQL18
3 DESIGN DO SITE 20 31 DEFINICcedilAtildeO DAS CORES 20
311 A Teoria das Cores 20 312 O Disco Cromaacutetico20 313 Cores Anaacutelogas 21 314 Cores Complementares 21 315 Cores X Idade22 316 Cores utilizadas no Site 22
32 PRINCIacutePIOS DO DESIGN 22 321 Proximidade22 322 Alinhamento22 323 Repeticcedilatildeo23 324 Contraste 23
33 FRAMES 25 331 Cabeccedilalho25 332 Menu25 333 Principal 26 334 Login 26 335 Rodapeacute 26
34 PAacuteGINAS VISIacuteVEIS 27 341 Home 27 342 Cadastro de Pesquisas28 343 Alteraccedilatildeo de Pesquisas 29 344 Cadastro de Artigos 30 345 Alteraccedilatildeo de Artigos31 346 Cadastro de Notiacutecias 32 347 Alteraccedilatildeo de Notiacutecias33 348 Objetivos34 349 Estatuto35 3410 Participantes 36 3411 Colaboradores 37 3412 Visualizar Pesquisas38 3413 Visualizar Artigo 39
3
3414 Visualizar Notiacutecia 40 3415 Mural41 3416 Exclusatildeo do Mural 42 3417 Administraccedilatildeo 43 3418 Cadastro de Usuaacuterios 44 3419 Alteraccedilatildeo de Usuaacuterio 45
35 PAacuteGINAS NAtildeO VISIacuteVEIS 47 351 Conexatildeophp47 352 deleta_artigophp 47 353 deleta_muralphp 47 354 deleta_noticiaphp47 355 deleta_pesquisaphp47 356 deleta_usuaacuteriophp 47 357 grava_alteracaoartigophp 47 358 grava_alteracaonoticiaphp48 359 grava_alteracaopesquisaphp48 3510 grava_alteracaousuariophp 48 3511 grava_artigophp 48 3512 grava_notiacuteciaphp 48 3513 grava_pesquisaphp48 3514 grava_muralphp 48 3515 grava_usuaacuteriophp 48 3516 loginphp 48
4 COacuteDIGO FONTE 49 5 CONCLUSAtildeO 50 REFEREcircNCIAS52 ANEXOS 54
4
LISTA DE FIGURAS FIGURA 1 - DISCO CROMAacuteTICO 21 FIGURA 2 - REPRESENTACcedilAtildeO DOS FRAMES 25 FIGURA 3 - HOME 27 FIGURA 4 - CADASTRO DE PESQUISAS 28 FIGURA 5 - ALTERACcedilAtildeO DE PESQUISAS 29 FIGURA 6 - CADASTRO DE ARTIGOS 30 FIGURA 7 - ALTERACcedilAtildeO ARTIGOS 31 FIGURA 8 - CADASTRO DE NOTIacuteCIAS 32 FIGURA 9 - ALTERACcedilAtildeO DE NOTIacuteCIAS 33 FIGURA 10 - OBJETIVOS 34 FIGURA 11 - ESTATUTO 35 FIGURA 12 - PARTICIPANTES 36 FIGURA 13 - COLABORADORES 37 FIGURA 14 - VISUALIZAR PESQUISAS 38 FIGURA 15 - DETALHE DA PESQUISA 38 FIGURA 16 - VISUALIZAR ARTIGO 39 FIGURA 17 - DETALHE DO ARTIGO 39 FIGURA 18 - VISUALIZAR NOTIacuteCIA 40 FIGURA 19 - DETALHE DA NOTIacuteCIA 40 FIGURA 20 - MURAL 41 FIGURA 21 - EXCLUSAtildeO DO MURAL 42 FIGURA 22 - ADMINISTRACcedilAtildeO 43 FIGURA 23 - CADASTRO DE USUAacuteRIOS 44 FIGURA 24 - PESQUISA USUAacuteRIOS 45 FIGURA 25 - ALTERACcedilAtildeO DE USUAacuteRIOS 46
5
Resumo O presente trabalho aborda a anaacutelise e o desenvolvimento de um site
dinacircmico na Internet tendo como contratante o Gerds (grupo de estudos
interdisciplinar em redes de computadores e sistemas distribuiacutedos) da Universidade
Tuiuti do Paranaacute que tem por objetivo divulgar as pesquisas realizadas por alunos
professores e colaboradores participantes do grupo em questatildeo Este foi elaborado
a partir de teacutecnicas de desenvolvimento de sites e entrevistas feitas diretamente com
o contratante
Palavras-chave Desenvolvimento de site site dinacircmico PHP MySQL HTML
6
1 INTRODUCcedilAtildeO
Estima-se que hoje existam mais de 250 milhotildees de pessoas que utilizam a
Internet natildeo soacute como ferramenta de trabalho mas tambeacutem como diversatildeo e
pesquisa Essas pessoas esperam obter da plataforma Web um material de alta
qualidade (incluindo imagens animaccedilatildeo som e viacutedeo) e que esse material esteja
apresentado de forma agradaacutevel e funcionando de forma raacutepida e eficiente A
especializaccedilatildeo em Desenvolvimento Web ofereceu a preparaccedilatildeo para o trabalho no
desenvolvimento conhecimento e utilizaccedilatildeo das tecnologias multimiacutedia e Internet e
dos sistemas e aplicaccedilotildees que fazem uso dessas tecnologias
O desenvolvimento do site do Gerds (grupo de estudos interdisciplinar em
redes de computadores e sistemas distribuiacutedos) da UTP tem por objetivo divulgar o
trabalho realizado por alunos professores colaboradores e participantes dos cursos
de Engenharia da Computaccedilatildeo Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia
da Computaccedilatildeo e os cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes
de Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
universidade e a comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados
ou por transferecircncia de tecnologias inserindo professores e alunos num contexto
soacutecio-econocircmico mais amplo do que a realidade acadecircmica Essas informaccedilotildees satildeo
oferecidas pelo site atraveacutes de pesquisas artigos e notiacutecias periodicamente
atualizadas aleacutem de permitir que se desenvolva uma comunicaccedilatildeo bilateral entre os
interessados atraveacutes do cadastramento dessas pessoas no site bem como a
possibilidade de se deixar mensagens em um mural destinado a esse fim Sendo o contratante do serviccedilo o Gerds ficou definido como pessoa
responsaacutevel pela definiccedilatildeo das necessidades do site o professor Roberto Amaral
Atraveacutes de teacutecnicas de levantamento de dados (ver anexo I) foram obtidos os dados
baacutesicos necessaacuterios para o desenvolvimento do site A presente monografia estaacute estruturada em 5 capiacutetulos cujo conteuacutedo eacute
apresentado sucintamente a seguir
O Capiacutetulo 2 apresenta uma introduccedilatildeo aos conceitos das tecnologias
utilizadas enfocando sua histoacuteria e utilizaccedilatildeo na atual estrutura da Internet
O Capiacutetulo 3 apresenta a descriccedilatildeo de como foi realizado o design do site e a
funcionalidade das paacuteginas
O Capiacutetulo 4 apresenta a referecircncia ao coacutedigo fonte do trabalho
7
O Capiacutetulo 5 apresenta a conclusatildeo do trabalho
8
2 TECNOLOGIAS UTILIZADAS
De acordo com os estudados realizados as seguintes tecnologias foram
utilizadas para o desenvolvimento do site do Gerds
bull Linguagem o HTML ndash Utilizada para fazer o corpo principal das paacuteginas Adotado
por ser gratuito e amplamente utilizado na Internet
o PHP ndash Apesar do conteuacutedo apresentado nas aulas ter sido baseado
em ASP um novo estudo em linguagem PHP foi realizado em
classe e extra classe pois foi utilizado um servidor com sistema
operacional Linux com o servidor de banco de dados Apache que
interpreta somente a linguagem PHP Foi utilizado para tornar as
paacuteginas dinacircmicas e realizar a comunicaccedilatildeo com o banco de
dados
o JavaScript ndash Utilizado para criar funccedilotildees que satildeo executadas na
maacutequina do usuaacuterio Adotado por ser gratuito e amplamente
utilizado na Internet
bull Programas o Fireworks ndash Utilizado para fazer as imagens e construir a parte
visual do site Foi adotado por ser uma ferramenta que permite
trabalhar com layouts de sites de forma raacutepida e faacutecil e ter ampla
compatibilidade com o Dreamweaver
o Dreamweaver ndash Utilizado para a construccedilatildeo do site e a
programaccedilatildeo Adotado por ser uma ferramenta completa e que
permite desenvolver e administrar o site de forma raacutepida e eficiente
bull Banco de Dados o MySQL ndash Utilizado para armazenar os dados do site Adotado por
ser gratuito e amplamente utilizado em aplicaccedilotildees Web
21 Linguagem
211 HTML - HyperText Markup Language
No nuacutecleo de toda paacutegina da Web encontra-se a HyperText Markup
Language uma linguagem de diagramaccedilatildeo baseada em marcadores ou tags
9
(marcas utilizadas pela linguagem html que permitem ao browser formatar o texto
entre as tags de acordo com cada tag especiacutefica) como eacute mais comumente
conhecido A HTML eacute uma linguagem simples baseada em texto e que pode ser
visualizada em qualquer plataforma tanto em navegadores somente texto (como o
Lynx) como em navegadores mais avanccedilados (como Netscape Navigator e Internet
Explorer)
A HTML eacute na verdade apenas texto com coacutedigos de formataccedilatildeo que
especificam diferentes fontes e estilos ou ateacute mesmo outras funccedilotildees mais
avanccediladas Ela eacute muito semelhante aos antigos editores de texto que exigiam a
inserccedilatildeo de tags para especificar tipos em itaacutelico negrito ou sublinhado
O HTML nasceu em 1990 no CERN (European Council for Nuclear Research)
na Suiacuteccedila Seu criador o inglecircs Tim Berners-Lee a concebeu unicamente como uma
linguagem que serviria para interligar computadores do laboratoacuterio e outras
instituiccedilotildees de pesquisa e exibir documentos cientiacuteficos de forma simples e faacutecil de
acessar (STANEK 1996)
Em 1992 com a liberaccedilatildeo da biblioteca de desenvolvimento para WWW
(World Wide Web ou Rede de Alcance Mundial) aconteceu uma grande evoluccedilatildeo o
que foi fundamental para expansatildeo do HTML Essa biblioteca deu origem agrave
construccedilatildeo de vaacuterios browsers e servidores tornando a Web uma ferramenta viaacutevel
O MOSAIC desenvolvido por Marc Andreeson entatildeo do NCSA foi o primeiro
browser multi-plataforma que explorava completamente a capacidade de hipermiacutedia
da Web e que iniciou o crescimento explosivo da mesma Em 1993 o HTML tornou-
se disponiacutevel a milhotildees de usuaacuterios com a liberaccedilatildeo das versotildees para Mac e
Windows (STANEK 1996)
Quanto as suas especificaccedilotildees o HTML percorreu um caminho longo ateacute
chegar agrave sua atual especificaccedilatildeo Atualmente 4 especificaccedilotildees do HTML estatildeo
definidas Cada nova especificaccedilatildeo eacute compatiacutevel com as especificaccedilotildees anteriores e
incluem diversas melhorias A primeira especificaccedilatildeo do HTML que eacute a versatildeo
original foi a HTML 10 Tim Berners-Lee juntamente com David Ragget a
publicaram em 1993 Devido a sua capacidade limitada a versatildeo 10 permitia o
desenvolvimento de documentos baacutesicos Incluiacutea muacuteltiplos niacuteveis de cabeccedilalhos
exibiccedilatildeo de paraacutegrafos navegaccedilatildeo por referecircncias a hipertextos (composiccedilatildeo de
elementos de informaccedilatildeo paraacutegrafos paacuteginas imagens sequumlecircncias musicais etc e
10
ligaccedilotildees entre esses elementos indicando a passagem de um a outro) e
formataccedilotildees especiais para itens de uma lista (STANEK 1996)
A definiccedilatildeo do HTML 20 concluiacuteda em 1995 foi a primeira versatildeo
recomendada pelo IETF ndash Internet Engineering Task Force e se tornou um padratildeo
da Internet Ela oferece um melhor controle sobre os layouts dos textos
apresentados nas paacuteginas aleacutem da inclusatildeo de imagens e formulaacuterios que permite
aos desenvolvedores conseguir a participaccedilatildeo dos usuaacuterios de forma faacutecil e raacutepida
aleacutem de explorar as capacidades multimiacutedias da Web (STANEK 1996)
O HTML 30 de 1996 permite novos formatos de textos Uma de suas
caracteriacutesticas mais importantes eacute a definiccedilatildeo dos tags necessaacuterios para a criaccedilatildeo
de tabelas que permitem que os desenvolvedores apresentem as informaccedilotildees
desejadas formatadas em linhas e colunas (STANEK 1996) Durante o
desenvolvimento do HTML 30 com a rapidez da expansatildeo da Web os esforccedilos de
padronizaccedilatildeo natildeo puderam acompanhar as tendecircncias de desenvolvimento que
exigiam maiores recursos de apresentaccedilatildeo graacutefica do que o HTML 20 podia
fornecer Por isso o HTML 30 acabou natildeo sendo aprovado e em 1997 aprovou-se
uma recomendaccedilatildeo chamada HTML 32 que introduzia recursos de apresentaccedilatildeo
graacutefica no HTML (INTRODUCING 2004)
O HTML 40 de 1998 eacute uma extensatildeo do HTML 32 Essa versatildeo oferece
melhorias nos recursos de acessibilidade Quando o HTML eacute usado de forma
estruturada um documento pode se adaptar a diferentes browsers acomodar
diferentes fontes cores especiais sintetizadores de voz e dispositivos Braille Essa
adaptabilidade permite a pessoas com defeitos fiacutesicos trabalhar de forma facilitada
na Web Essa versatildeo adotou tambeacutem o Universal Character Set que usa o suporte
a convenccedilotildees internacionais permitindo a utilizaccedilatildeo de quase todas as linguagens
do mundo Outra novidade satildeo os frames (dividem a paacutegina em duas ou mais partes
ndash framesets - e satildeo geralmente usados para que um frameset permaneccedila enquanto
outros mudem baseados nos links que o usuaacuterio seleciona) Vaacuterios elementos do
HTML 32 foram considerados deprecados (candidatos a se tornarem obsoletos)
pelo HTML 40 forccedilando uma ecircnfase na separaccedilatildeo da estrutura do documento e na
apresentaccedilatildeo dos elementos que permitem definir cores fontes alinhamento
imagens de fundo e outras caracteriacutesticas da apresentaccedilatildeo da paacutegina que
dependem da plataforma onde a informaccedilatildeo eacute visualizada Essa separaccedilatildeo pocircde ser
realizada graccedilas a CSS (Cascading Style Sheets) que permite a criaccedilatildeo de folhas
11
de estilo aplicaacuteveis a vaacuterias paacuteginas de um site Se um dispositivo limitado natildeo
consegue exibir os estilos definidos no CSS ele pelo menos consegue entender a
estrutura do texto e imagens de forma que mesmo usuaacuterios com menos recursos
podem ter acesso agrave informaccedilatildeo contida na paacutegina (HTML 2004)
2111 Forma Baacutesica de um Documento HTML
Como jaacute foi citado anteriormente o HTML eacute na verdade apenas texto com
coacutedigos de formataccedilatildeo que especificam diferentes fontes e estilos Com a inserccedilatildeo
das tags o texto que estaacute compreendido entre essas marcas assume
caracteriacutesticas diferentes de acordo com cada uma delas
Cada tag informa ao browser como ele deveraacute formatar o texto que deve
estar dentro dos sinais de menor que (lt) e maior que (gt) Por exemplo ltHTMLgt
ltBODYgt
Os tags podem ser uacutenicos ou duplos com iniacutecio e fim Se forem duplos
existiraacute um tag informando que aquela formataccedilatildeo estaacute sendo encerrada Por
exemplo um tag simples pode ser representado por rdquoltbrgtrdquo que indica uma quebra
de linha Jaacute um tag duplo pode ser ltbgtltbgt indicando que o que estiver entre
esses campos deveraacute ser apresentado em negrito
A estrutura de um documento HTML apresenta os seguintes componentes
ltHTMLgt
ltHEADgtltTITLEgtTiacutetulo do DocumentoltTITLEgtltHEADgt
ltBODYgt
texto imagem links ltBODYgt
ltHTMLgt
Todo documento HTML deve estar entre os tags ltHTMLgt e ltHTMLgt A partir
daiacute esses documentos satildeo divididos em duas seccedilotildees principais a seccedilatildeo HEAD e a
seccedilatildeo BODY A HEAD conteacutem informaccedilotildees sobre o documento O tag ltTITLEgt por
exemplo define um tiacutetulo que eacute mostrado no alto da janela do browser Tudo que
estiver contido na seccedilatildeo ltBODYgt seraacute mostrado na janela principal do browser
12
Essa seccedilatildeo pode conter cabeccedilalhos paraacutegrafos listas tabelas links para outros
documentos e imagens
212 PHP - Personal Home Page
Como as paacuteginas em HTML satildeo basicamente apresentaccedilotildees de texto e
imagens com o passar do tempo surgiu a necessidade de uma interaccedilatildeo maior com
o usuaacuterio permitindo que se tivesse um histoacuterico desse usuaacuterio aleacutem da
possibilidade de se mostrar informaccedilotildees personalizadas aos mesmos Para esse
propoacutesito umas das linguagens que surgiram e que tinham forte ligaccedilatildeo com o
HTML foi o PHP
O PHP eacute uma linguagem de server-side (as paacuteginas ficam armazenadas e
satildeo executadas em um servidor onde o site estaacute localizado) e open-source (um
programa que tem seu coacutedigo fonte disponiacutevel para que qualquer pessoa que tenha
uma ideacuteia uma sugestatildeo possa ajudar no seu desenvolvimento) para criaccedilatildeo de
paacuteginas dinacircmicas para a Web Uma paacutegina dinacircmica eacute aquela que interage com o
usuaacuterio de forma que cada usuaacuterio ao visitar a paacutegina veraacute informaccedilotildees
personalizadas Os aplicativos dinacircmicos da Web satildeo predominantes nos sites
comerciais(e-commerce ndash sites de venda pela Internet) onde o conteuacutedo
apresentado eacute gerado a partir de informaccedilotildees acessadas de um banco de dados ou
outra fonte externa Sua interface permite que se incluam comandos PHP
diretamente na paacutegina HTML
O PHP sucede de um produto mais antigo chamado PHPFI PHPFI foi
criado por Rasmus Lerdorf em 1994 inicialmente como scripts (arquivos texto com
um conjunto de instruccedilotildees de uma linguagem especiacutefica nos quais estatildeo contidas
todas as instruccedilotildees que dizem o que o programa faraacute) usados para gerar estatiacutesticas
de acesso para seu curriacuteculo on line Ele nomeou esta seacuterie de scripts de ldquoPersonal
Home Page Toolsrdquo a qual adquiriu um relativo ecircxito devido a outras pessoas
pedirem a Rasmus que lhes permitisse utilizar os seus programas nas suas proacuteprias
paacuteginas Web Como mais funcionalidades foram requeridas Rasmus escreveu uma
implementaccedilatildeo em linguagem C muito maior que era capaz de comunicar-se com
uma base de dados e possibilitava a usuaacuterios o desenvolvimento simples de
aplicativos dinacircmicos para Web Devido agrave aceitaccedilatildeo do primeiro PHP e de maneira
adicional o seu criador desenhou um sistema para processar formulaacuterios ao qual
13
deu o nome de FI (Form Interpreter) e o conjunto destas duas ferramentas seria a
primeira versatildeo compacta da linguagem PHPFI Rasmus resolveu distribuir o
coacutedigo fonte do PHPFI para que todos pudessem ver e tambeacutem usaacute-lo bem como
corrigir bugs e melhorar o coacutedigo (HISTOacuteRIA 2004)
O PHPFI usava interpretaccedilotildees automaacuteticas de variaacuteveis vindas de formulaacuterio
(dados passados pelos usuaacuterios) e era embutida diretamente no coacutedigo do HTML
Poreacutem a sua sintaxe era limitada simples e um pouco inconsistente
Em 1997 PHPFI 20 a segunda versatildeo da implementaccedilatildeo em linguagem C
obteve milhares de usuaacuterios ao redor do mundo com um valor estimado de
aproximadamente 50000 domiacutenios respondendo por basicamente 1 dos domiacutenios
da Internet Enquanto isto havia milhares de pessoas contribuindo com pequenos
coacutedigos para o projeto e ainda assim o PHPFI 20 foi oficialmente lanccedilado somente
ao final de 1997 apoacutes perder a maior parte de sua vida em versotildees beta (versotildees de
um produto que satildeo distribuiacutedas para teste dos usuaacuterios antes do lanccedilamento
oficial) O PHPFI 20 foi rapidamente substituiacutedo pelas versotildees iniciais do PHP 30
(HISTOacuteRIA 2004)
O PHP 30 foi a primeira versatildeo que se assemelha ao PHP que eacute utilizado
atualmente Ela foi criada por Andi Gutmans e Zeev Suraski em 1997 e foi
totalmente reescrito apoacutes eles descobrirem que o PHPFI 20 poderia ajudaacute-los a
desenvolver suas proacuteprias aplicaccedilotildees de e-Commerce de um projeto na sua
Universidade No esforccedilo cooperativo e iniciativa de reescrever o PHPFI a partir da
base existente Andi Rasmus e Zeev decidiram unir esforccedilos e anunciar o PHP 30
como uma versatildeo oficial de seu antecessor (o PHPFI 20) (HISTOacuteRIA 2004)
O PHP 30 aleacutem de oferecer aos usuaacuterios finais uma infraestrutura soacutelida
para diversos bancos de dados protocolos e APIs a extensibilidade (possibilidade
de uso para diversos objetivos) do PHP 30 atrai dezenas de novos desenvolvedores
para se juntar e submeter novos moacutedulos Esta eacute a chave do sucesso do PHP 30
Outras caracteriacutesticas chaves introduzidas no PHP 30 foram o suporte agrave sintaxe
para orientaccedilatildeo a objetos e uma sintaxe muito mais poderosa e consistente
O PHP 30 foi oficialmente lanccedilado em Junho de 1998 depois de ter passado
aproximadamente 9 meses em testes puacuteblicos (versotildees beta) Os objetivos do
projeto eram melhorar a performance de aplicaccedilotildees complexas e melhorar a
modularidade do coacutedigo base do PHP
14
O PHP 40 acompanhado com uma seacuterie de novas caracteriacutesticas foi
oficialmente lanccedilada no iniacutecio de 2000 quase dois anos apoacutes o seu antecessor
Aleacutem da melhora na performance esta versatildeo incluiu outras caracteriacutesticas chave
como o suporte para muitos servidores Web sessotildees HTTP buffer de saiacuteda e
maneiras mais seguras de manipular entrada de dados dos usuaacuterios (HISTOacuteRIA
2004)
De acordo com o site oficial do PHP (phpnetusagephp) atualmente
aproximadamente 17 milhotildees de domiacutenios estatildeo usando PHP na Web
2121 PHP - Por que utilizar
A popularidade do PHP continua crescendo rapidamente devido a muitas
vantagens Eacute raacutepido pois devido a estar embutido no coacutedigo HTML o tempo para
processar e carregar uma paacutegina Web eacute curto Eacute graacutetis e faacutecil de usar pois os
coacutedigos PHP satildeo facilmente incluiacutedos no arquivo HTML eacute versaacutetil pois o PHP roda
em uma grande variedade de sistemas operacionais eacute muito seguro pois se o
coacutedigo for escrito corretamente o usuaacuterio natildeo iraacute enxergar o coacutedigo PHP aleacutem de
ser customizaacutevel pois a licenccedila open-source permite aos programadores
modificarem o PHP adicionando ou modificando as caracteriacutesticas necessaacuterias ao
seu proacuteprio desenvolvimento
Devido ao PHP ser executado no servidor ele pode dinamicamente criar o
coacutedigo HTML que iraacute gerar a paacutegina Web permitindo que os usuaacuterios individuais
vejam paacuteginas customizadas Os visitantes da paacutegina Web vecircem a saiacuteda gerada
pelos scripts mas natildeo os scripts propriamente ditos tornando-o muito seguro
O PHP consegue trabalhar com ldquosessotildeesrdquo ou seja para executar
determinadas accedilotildees (fazer um download por exemplo) o usuaacuterio deve estar
identificado no site O PHP permite que se crie uma ldquosessatildeordquo que identifica cada
usuaacuterio no sistema aleacutem de outros dados referentes ao mesmo Se o usuaacuterio tentar
entrar em uma paacutegina especiacutefica primeiramente eacute verificado se existe uma sessatildeo
para o mesmo Se natildeo existir eacute mostrada uma mensagem de acesso proibido Se a
sessatildeo for vaacutelida os outros paracircmetros do usuaacuterio (salvos na sessatildeo) podem ser
verificados e validados caso necessaacuterio
2122 PHP - Como Funciona
15
Segundo Janet Valade (VALADE2004) O coacutedigo PHP eacute embutido no coacutedigo
HTML As tags do HTML satildeo usadas para incluir a linguagem PHP na linguagem
HTML Quando o PHP estaacute instalado o servidor Web eacute configurado para procurar
por coacutedigo PHP embutido em arquivos com extensotildees especiacuteficas (php ou phtml)
Quando o servidor recebe uma requisiccedilatildeo para um arquivo com uma dessas
extensotildees ele envia o coacutedigo HTML como estaacute mas o coacutedigo PHP eacute processado
pelo software antes de ser enviado ao solicitante Quando a linguagem PHP eacute
processada a saiacuteda consiste de coacutedigo HTML Os coacutedigos PHP natildeo satildeo incluiacutedos
no HTML enviado ao browser por isso o coacutedigo PHP eacute seguro e transparente para o
usuaacuterio Quando um browser eacute apontado para um arquivo HTML o servidor envia o
arquivo ao browser O browser processa o arquivo e mostra a paacutegina descrita pelos
tags HTML do arquivo Quando um Web browser eacute apontado para um arquivo PHP
o servidor procura por seccedilotildees PHP no arquivo e os processa enviando o resultado
do processamento ao browser Esses satildeo os passos seguidos pelo servidor para
processar um arquivo PHP
1 O servidor inicia a procura no arquivo em modo HTML Ele assume que o
coacutedigo eacute HTML e os envia ao browser sem nenhum processamento
2 O servidor web continua em modo HTML ateacute encontrar um tag de abertura do
PHP (lt)
3 Quando o servidor encontra um tag de abertura do PHP alterna para modo
PHP assume que todos os comandos subsequumlentes satildeo desse tipo e os
executa Se o comando gera uma saiacuteda a envia ao browser
4 O servidor continua em modo PHP ateacute encontrar um tag de fechamento do
PHP (gt)
5 Quando o servidor encontra um tag de fechamento do PHP retorna ao modo
HTML e repete o ciclo
2123 Forma Baacutesica de um Documento PHP
O PHP eacute embutido diretamente no programa HTML Seus comandos satildeo
delimitados pelos tags lt e gt Dentro dos tags de abertura e fechamento do PHP
satildeo incluiacutedos comandos especiacuteficos que satildeo interpretados pela linguagem A sintaxe
eacute bastante parecida com a da linguagem C Por exemplo
ltHTMLgt
16
ltHEADgtltTITLEgtTeste PHPltTITLEgtltHEADgt
ltBODYgt
ltpgt Linha HTML
lt
$id = $_GET[id]
if ($id = 1)
echo ldquoltpgtUsuaacuterio Nordm 1ltpgtrdquo
else
echo ldquoltpgt Usuaacuterio Nordm 2ltpgtrdquo
gt
ltBODYgt
ltHTMLgt
213 Javascript
Javascript eacute uma linguagem criada pela Netscape que serve basicamente
para aumentar os recursos do navegador
Todas as paacuteginas escritas com HTML satildeo estaacuteticas Conseguem fazer com
que o browser apenas leia o que haacute no coacutedigo e reproduza aquele conjunto de
instruccedilotildees Um dos principais recursos do Javascript eacute a possibilidade de fazer com
que a paacutegina HTML seja dinacircmica ou seja capaz de fazer com que o usuaacuterio possa
interagir com a paacutegina ou usar outros recursos para fazer com que o documento
Web se altere sem necessidade de um novo carregamento de paacutegina
O Javascript eacute uma linguagem de programaccedilatildeo que funciona interativamente
com o coacutedigo HTML O Javascript consegue ler entender e manipular os objetos de
uma paacutegina HTML tendo a facilidade necessaacuteria para alteraacute-los automaticamente
quando programado Satildeo inseridos nas paacuteginas de uma maneira peculiar podendo
ter apenas uma aacuterea para scripts ou espalhados pelo coacutedigo do jeito que melhor se
adapte agraves necessidades de cada usuaacuterio Diferentemente da linguagem PHP o
Javascript eacute uma linguagem client-side (as paacuteginas satildeo armazenadas e executadas
na maacutequina cliente) (LOURENCcedilO 2000)
17
22 Programas
221 Fireworks
O Fireworks eacute uma ferramenta de produccedilatildeo graacutefica para criaccedilatildeo de interfaces
e imagens Web com interaccedilatildeo em vaacuterias linguagens scripts (como php cfml html
xml Xhtml) podendo montar sites atraveacutes de desenhos O Fireworks consegue
combinar muito bem recursos vetoriais (como o ajuste de textos recursos praacuteticos
de desenho e ediccedilatildeo de noacutes) com os recursos aplicados a bitmaps ou imagens
(como o tratamento de cores e ferramentas de efeitos)
Tambeacutem permite trabalhar com layouts de sites sendo que pode-se
transformar o layout em uma paacutegina HTML usando o recurso de slices (fatias) O
programa permite que vocecirc divida o layout inteiro em vaacuterias imagens de acordo com
as aacutereas especiacuteficas que se deseja criar Apoacutes essa divisatildeo cada uma dessas aacutereas
eacute exportada com um formato de arquivo e com uma compactaccedilatildeo especiacutefica
podendo gerar o HTML com as imagens (ou fatias) nos seus devidos lugares e
posiccedilotildees ou mesmo exporta-las para o Dreamweaver Sua outra vantagem eacute a
possibilidade de se trabalhar com os behaviors (comportamentos) Com os
bahaviors pode-se criar rollovers (menus interativos) e menus pop ups (menus que
abrem outros sub-menus de acordo com cada item) estilizados
Como o Fireworks foi inicialmente projetado para a Web permite tambeacutem a
exportaccedilatildeo de imagens para a rede Esses recursos incluem a total otimizaccedilatildeo de
cada formato de arquivo a ser exportado bem como GIFS e JPEGS Aleacutem disso
pode-se fazer uma comparaccedilatildeo visual e do tamanho do arquivo simultaneamente
de ateacute 4 formatos ou configuraccedilotildees de exportaccedilotildees e tambeacutem salvar as mesmas
configuraccedilotildees para usar mais tarde em outros arquivos (CARACTERIacuteSTICAS
2004)
222 Dreamweaver
O Dreamweaver eacute um editor profissional de HTML utilizado para projetar
codificar e desenvolver sites paacuteginas e aplicaccedilotildees Web Permite que se trabalhe as
paacuteginas HTML de forma manual ou em um ambiente de ediccedilatildeo visual fornecendo
ferramentas uacuteteis para esses fins O Dreamweaver tambeacutem permite que se construa
aplicaccedilotildees Web dinacircmicas usando linguagens que rodam nos servidores (PHP
nesse caso) (PAGE 2004) Algumas das facilidades do Dreamweaver satildeo
18
bull Administraccedilatildeo remota do site e arquivos fonte localmente
bull Operaccedilatildeo em CSS (Cascade Style Sheets)
bull Geraccedilatildeo automatizada de rotinas em Javascript
bull Formulaacuterios
bull Criaccedilatildeo e uso de templates (modelos)
bull Gerenciamento completo do site e seus componentes (por exemplo se um
arquivo de imagem for movido de um sub-diretoacuterio para outro todo o site eacute
reparado automaticamente)
bull Apresentaccedilatildeo do mapa do site com diferentes niacuteveis de detalhamento
bull Behaviors (comportamentos que depois podem ser reaproveitados) com
rotinas de JavaScript
bull Manipulaccedilatildeo de tabelas
bull Rollover de imagens
bull Administraccedilatildeo do site a partir da barra de menu
bull Reparo automaacutetico do site a partir da mudanccedila de endereccedilo ou nome de
uma miacutedia ou link em geral
23 Banco de Dados
231 MySQL
O MySQL eacute um SGDB (ou sistema gerenciador de banco de dados) que eacute
desenvolvido e distribuiacutedo pela MySQL AB a empresa fundada pelos suecos David
Axmark Allan Larsson e Michael Widenius Ele derivou de outro banco de dados o
mSQL Pelo fato do mesmo natildeo ser raacutepido nem flexiacutevel o suficiente para as suas
necessidades os suecos resolveram criar um novo banco de dados utilizando a
interface API (application programming interface - conjunto de rotinas padronizadas
que a aplicaccedilatildeo utiliza para efetuar seus serviccedilos) do proacuteprio mSQL utilizada para
facilitar a portabilidade de coacutedigos escritos do mSQL para o MySQL
Escrito em C e C++ e testado em vaacuterias plataformas diferentes o MySQL
possui um sistema de alocaccedilatildeo de memoacuteria baseado em processos que permite a
execuccedilatildeo de tarefas paralelas tornando-o extremamente raacutepido e eficiente Ele eacute um
banco de dados do tipo SQL (Structured Query Language) e por isso possui as
caracteriacutesticas dos principais bancos de dados do tipo SQL como operadores e
funccedilotildees agrupamentos joins (junccedilotildees de tabelas) aceita vaacuterios tipos de campos
19
suportando registros de tamanhos fixos ou variaacuteveis controla a seguranccedila dos
dados aleacutem de poder armazenar uma grande quantidade de dados chegando a
quantidades superiores a 50000000 de registros Aleacutem disso o MySQL eacute multi-
usuaacuterio (programas de mais de um usuaacuterio podem estar em execuccedilatildeo) eacute multi-
tarefa (eacute capaz de executar vaacuterios programas simultaneamente mesmo que a
maacutequina possua somente um processador) e open-source
Esse servidor de banco de dados eacute considerado como o mais raacutepido entre os
de sua categoria tanto para grandes volumes de dados como pequenos Poreacutem
como ele foi criado para ser extremamente aacutegil teve-se de descartar certos aspectos
das especificaccedilotildees SQL e foi decidido natildeo se implementar caracteriacutesticas que geram
muita demanda de recursos como os triggers que satildeo uma porccedilatildeo de coacutedigo
armazenado que se executa quando eacute realizada uma operaccedilatildeo (atualizaccedilatildeo
inclusatildeo etc) com o banco de dados Naturalmente comprovar a proacutepria existecircncia
do trigger e executaacute-lo consome recursos e tempo
As principais vantagens do MySQL satildeo a baixa demanda de recursos de
hardware a simplicidade de administraccedilatildeo e a otimizaccedilatildeo para as aplicaccedilotildees tiacutepicas
da web onde ocorrem mais consultas do que atualizaccedilotildees (MySQL 2004)
20
3 DESIGN DO SITE
Atraveacutes de um briefing (anexo 1) pode-se chegar a algumas conclusotildees que
influenciaram na escolha da forma de apresentaccedilatildeo das paacuteginas e levaram a
definiccedilatildeo de quais cores imagens e forma o site seria apresentado aos usuaacuterios
31 DEFINICcedilAtildeO DAS CORES
311 A Teoria das Cores
O que se convencionou chamar de Teoria das Cores de Leonardo da Vinci
satildeo as formulaccedilotildees histoacutericas esparsas contidas em seus escritos e reunidas no livro
Tratado da Pintura e da Paisagem ndash Sombra e Luz que satildeo anotaccedilotildees recolhidas
pelo artista ao longo de anos de observaccedilatildeo e eacute a teoria mais corrente sendo um
dos legados do renascimento para as artes visuais (TEORIA 2004)
312 O Disco Cromaacutetico
O disco cromaacutetico natildeo eacute um instrumento cientiacutefico de classificaccedilatildeo de cores
mas eacute muito uacutetil no entendimento da teoria das cores As cores se dividem em
primaacuterias secundaacuterias e terciaacuterias (TEORIA 2004)
Pode-se reproduzir qualquer sensaccedilatildeo de cor misturando-se aditivamente
diversas quantidades de vermelho azul e verde Por isso conhecem-se essas cores
como cores primaacuterias (ENCARTA 2000) Combinado-se duas cores primaacuterias
obtemos as cores secundaacuterias resultando no laranja (amarelo com vermelho) verde
(azul com amarelo) e violeta (vermelho com azul) As cores terciaacuterias satildeo obtidas
pela mistura de uma primaacuteria com uma ou mais secundaacuterias (TEORIA 2004)
21
A figura 1 apresenta a representaccedilatildeo graacutefica do disco cromaacutetico
FIGURA 1 ndash DISCO CROMAacuteTICO
313 Cores Anaacutelogas
Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores anaacutelogas satildeo as
cores dispostas lado a lado no disco cromaacutetico Satildeo anaacutelogas porque haacute nelas uma
mesma cor baacutesica e satildeo usadas para dar a sensaccedilatildeo de uniformidade Observando
a figura 1 visualiza-se que a cor anaacuteloga do amarelo eacute o laranja por exemplo
314 Cores Complementares Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores complementares
satildeo aquelas que encontram-se sempre em posiccedilotildees opostas no disco cromaacutetico As
cores complementares satildeo usadas para dar forccedila e equiliacutebrio a um trabalho criando
contrastes Observando a figura 1 visualiza-se que a cor complementar do
vermelho eacute o verde e do laranja eacute o azul por exemplo
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
2
SUMAacuteRIO
1 INTRODUCcedilAtildeO 6 2 TECNOLOGIAS UTILIZADAS8
21 LINGUAGEM8 211 HTML - HyperText Markup Language8 212 PHP - Personal Home Page 12 213 Javascript16
22 PROGRAMAS 17 221 Fireworks 17 222 Dreamweaver17
23 BANCO DE DADOS 18 231 MySQL18
3 DESIGN DO SITE 20 31 DEFINICcedilAtildeO DAS CORES 20
311 A Teoria das Cores 20 312 O Disco Cromaacutetico20 313 Cores Anaacutelogas 21 314 Cores Complementares 21 315 Cores X Idade22 316 Cores utilizadas no Site 22
32 PRINCIacutePIOS DO DESIGN 22 321 Proximidade22 322 Alinhamento22 323 Repeticcedilatildeo23 324 Contraste 23
33 FRAMES 25 331 Cabeccedilalho25 332 Menu25 333 Principal 26 334 Login 26 335 Rodapeacute 26
34 PAacuteGINAS VISIacuteVEIS 27 341 Home 27 342 Cadastro de Pesquisas28 343 Alteraccedilatildeo de Pesquisas 29 344 Cadastro de Artigos 30 345 Alteraccedilatildeo de Artigos31 346 Cadastro de Notiacutecias 32 347 Alteraccedilatildeo de Notiacutecias33 348 Objetivos34 349 Estatuto35 3410 Participantes 36 3411 Colaboradores 37 3412 Visualizar Pesquisas38 3413 Visualizar Artigo 39
3
3414 Visualizar Notiacutecia 40 3415 Mural41 3416 Exclusatildeo do Mural 42 3417 Administraccedilatildeo 43 3418 Cadastro de Usuaacuterios 44 3419 Alteraccedilatildeo de Usuaacuterio 45
35 PAacuteGINAS NAtildeO VISIacuteVEIS 47 351 Conexatildeophp47 352 deleta_artigophp 47 353 deleta_muralphp 47 354 deleta_noticiaphp47 355 deleta_pesquisaphp47 356 deleta_usuaacuteriophp 47 357 grava_alteracaoartigophp 47 358 grava_alteracaonoticiaphp48 359 grava_alteracaopesquisaphp48 3510 grava_alteracaousuariophp 48 3511 grava_artigophp 48 3512 grava_notiacuteciaphp 48 3513 grava_pesquisaphp48 3514 grava_muralphp 48 3515 grava_usuaacuteriophp 48 3516 loginphp 48
4 COacuteDIGO FONTE 49 5 CONCLUSAtildeO 50 REFEREcircNCIAS52 ANEXOS 54
4
LISTA DE FIGURAS FIGURA 1 - DISCO CROMAacuteTICO 21 FIGURA 2 - REPRESENTACcedilAtildeO DOS FRAMES 25 FIGURA 3 - HOME 27 FIGURA 4 - CADASTRO DE PESQUISAS 28 FIGURA 5 - ALTERACcedilAtildeO DE PESQUISAS 29 FIGURA 6 - CADASTRO DE ARTIGOS 30 FIGURA 7 - ALTERACcedilAtildeO ARTIGOS 31 FIGURA 8 - CADASTRO DE NOTIacuteCIAS 32 FIGURA 9 - ALTERACcedilAtildeO DE NOTIacuteCIAS 33 FIGURA 10 - OBJETIVOS 34 FIGURA 11 - ESTATUTO 35 FIGURA 12 - PARTICIPANTES 36 FIGURA 13 - COLABORADORES 37 FIGURA 14 - VISUALIZAR PESQUISAS 38 FIGURA 15 - DETALHE DA PESQUISA 38 FIGURA 16 - VISUALIZAR ARTIGO 39 FIGURA 17 - DETALHE DO ARTIGO 39 FIGURA 18 - VISUALIZAR NOTIacuteCIA 40 FIGURA 19 - DETALHE DA NOTIacuteCIA 40 FIGURA 20 - MURAL 41 FIGURA 21 - EXCLUSAtildeO DO MURAL 42 FIGURA 22 - ADMINISTRACcedilAtildeO 43 FIGURA 23 - CADASTRO DE USUAacuteRIOS 44 FIGURA 24 - PESQUISA USUAacuteRIOS 45 FIGURA 25 - ALTERACcedilAtildeO DE USUAacuteRIOS 46
5
Resumo O presente trabalho aborda a anaacutelise e o desenvolvimento de um site
dinacircmico na Internet tendo como contratante o Gerds (grupo de estudos
interdisciplinar em redes de computadores e sistemas distribuiacutedos) da Universidade
Tuiuti do Paranaacute que tem por objetivo divulgar as pesquisas realizadas por alunos
professores e colaboradores participantes do grupo em questatildeo Este foi elaborado
a partir de teacutecnicas de desenvolvimento de sites e entrevistas feitas diretamente com
o contratante
Palavras-chave Desenvolvimento de site site dinacircmico PHP MySQL HTML
6
1 INTRODUCcedilAtildeO
Estima-se que hoje existam mais de 250 milhotildees de pessoas que utilizam a
Internet natildeo soacute como ferramenta de trabalho mas tambeacutem como diversatildeo e
pesquisa Essas pessoas esperam obter da plataforma Web um material de alta
qualidade (incluindo imagens animaccedilatildeo som e viacutedeo) e que esse material esteja
apresentado de forma agradaacutevel e funcionando de forma raacutepida e eficiente A
especializaccedilatildeo em Desenvolvimento Web ofereceu a preparaccedilatildeo para o trabalho no
desenvolvimento conhecimento e utilizaccedilatildeo das tecnologias multimiacutedia e Internet e
dos sistemas e aplicaccedilotildees que fazem uso dessas tecnologias
O desenvolvimento do site do Gerds (grupo de estudos interdisciplinar em
redes de computadores e sistemas distribuiacutedos) da UTP tem por objetivo divulgar o
trabalho realizado por alunos professores colaboradores e participantes dos cursos
de Engenharia da Computaccedilatildeo Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia
da Computaccedilatildeo e os cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes
de Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
universidade e a comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados
ou por transferecircncia de tecnologias inserindo professores e alunos num contexto
soacutecio-econocircmico mais amplo do que a realidade acadecircmica Essas informaccedilotildees satildeo
oferecidas pelo site atraveacutes de pesquisas artigos e notiacutecias periodicamente
atualizadas aleacutem de permitir que se desenvolva uma comunicaccedilatildeo bilateral entre os
interessados atraveacutes do cadastramento dessas pessoas no site bem como a
possibilidade de se deixar mensagens em um mural destinado a esse fim Sendo o contratante do serviccedilo o Gerds ficou definido como pessoa
responsaacutevel pela definiccedilatildeo das necessidades do site o professor Roberto Amaral
Atraveacutes de teacutecnicas de levantamento de dados (ver anexo I) foram obtidos os dados
baacutesicos necessaacuterios para o desenvolvimento do site A presente monografia estaacute estruturada em 5 capiacutetulos cujo conteuacutedo eacute
apresentado sucintamente a seguir
O Capiacutetulo 2 apresenta uma introduccedilatildeo aos conceitos das tecnologias
utilizadas enfocando sua histoacuteria e utilizaccedilatildeo na atual estrutura da Internet
O Capiacutetulo 3 apresenta a descriccedilatildeo de como foi realizado o design do site e a
funcionalidade das paacuteginas
O Capiacutetulo 4 apresenta a referecircncia ao coacutedigo fonte do trabalho
7
O Capiacutetulo 5 apresenta a conclusatildeo do trabalho
8
2 TECNOLOGIAS UTILIZADAS
De acordo com os estudados realizados as seguintes tecnologias foram
utilizadas para o desenvolvimento do site do Gerds
bull Linguagem o HTML ndash Utilizada para fazer o corpo principal das paacuteginas Adotado
por ser gratuito e amplamente utilizado na Internet
o PHP ndash Apesar do conteuacutedo apresentado nas aulas ter sido baseado
em ASP um novo estudo em linguagem PHP foi realizado em
classe e extra classe pois foi utilizado um servidor com sistema
operacional Linux com o servidor de banco de dados Apache que
interpreta somente a linguagem PHP Foi utilizado para tornar as
paacuteginas dinacircmicas e realizar a comunicaccedilatildeo com o banco de
dados
o JavaScript ndash Utilizado para criar funccedilotildees que satildeo executadas na
maacutequina do usuaacuterio Adotado por ser gratuito e amplamente
utilizado na Internet
bull Programas o Fireworks ndash Utilizado para fazer as imagens e construir a parte
visual do site Foi adotado por ser uma ferramenta que permite
trabalhar com layouts de sites de forma raacutepida e faacutecil e ter ampla
compatibilidade com o Dreamweaver
o Dreamweaver ndash Utilizado para a construccedilatildeo do site e a
programaccedilatildeo Adotado por ser uma ferramenta completa e que
permite desenvolver e administrar o site de forma raacutepida e eficiente
bull Banco de Dados o MySQL ndash Utilizado para armazenar os dados do site Adotado por
ser gratuito e amplamente utilizado em aplicaccedilotildees Web
21 Linguagem
211 HTML - HyperText Markup Language
No nuacutecleo de toda paacutegina da Web encontra-se a HyperText Markup
Language uma linguagem de diagramaccedilatildeo baseada em marcadores ou tags
9
(marcas utilizadas pela linguagem html que permitem ao browser formatar o texto
entre as tags de acordo com cada tag especiacutefica) como eacute mais comumente
conhecido A HTML eacute uma linguagem simples baseada em texto e que pode ser
visualizada em qualquer plataforma tanto em navegadores somente texto (como o
Lynx) como em navegadores mais avanccedilados (como Netscape Navigator e Internet
Explorer)
A HTML eacute na verdade apenas texto com coacutedigos de formataccedilatildeo que
especificam diferentes fontes e estilos ou ateacute mesmo outras funccedilotildees mais
avanccediladas Ela eacute muito semelhante aos antigos editores de texto que exigiam a
inserccedilatildeo de tags para especificar tipos em itaacutelico negrito ou sublinhado
O HTML nasceu em 1990 no CERN (European Council for Nuclear Research)
na Suiacuteccedila Seu criador o inglecircs Tim Berners-Lee a concebeu unicamente como uma
linguagem que serviria para interligar computadores do laboratoacuterio e outras
instituiccedilotildees de pesquisa e exibir documentos cientiacuteficos de forma simples e faacutecil de
acessar (STANEK 1996)
Em 1992 com a liberaccedilatildeo da biblioteca de desenvolvimento para WWW
(World Wide Web ou Rede de Alcance Mundial) aconteceu uma grande evoluccedilatildeo o
que foi fundamental para expansatildeo do HTML Essa biblioteca deu origem agrave
construccedilatildeo de vaacuterios browsers e servidores tornando a Web uma ferramenta viaacutevel
O MOSAIC desenvolvido por Marc Andreeson entatildeo do NCSA foi o primeiro
browser multi-plataforma que explorava completamente a capacidade de hipermiacutedia
da Web e que iniciou o crescimento explosivo da mesma Em 1993 o HTML tornou-
se disponiacutevel a milhotildees de usuaacuterios com a liberaccedilatildeo das versotildees para Mac e
Windows (STANEK 1996)
Quanto as suas especificaccedilotildees o HTML percorreu um caminho longo ateacute
chegar agrave sua atual especificaccedilatildeo Atualmente 4 especificaccedilotildees do HTML estatildeo
definidas Cada nova especificaccedilatildeo eacute compatiacutevel com as especificaccedilotildees anteriores e
incluem diversas melhorias A primeira especificaccedilatildeo do HTML que eacute a versatildeo
original foi a HTML 10 Tim Berners-Lee juntamente com David Ragget a
publicaram em 1993 Devido a sua capacidade limitada a versatildeo 10 permitia o
desenvolvimento de documentos baacutesicos Incluiacutea muacuteltiplos niacuteveis de cabeccedilalhos
exibiccedilatildeo de paraacutegrafos navegaccedilatildeo por referecircncias a hipertextos (composiccedilatildeo de
elementos de informaccedilatildeo paraacutegrafos paacuteginas imagens sequumlecircncias musicais etc e
10
ligaccedilotildees entre esses elementos indicando a passagem de um a outro) e
formataccedilotildees especiais para itens de uma lista (STANEK 1996)
A definiccedilatildeo do HTML 20 concluiacuteda em 1995 foi a primeira versatildeo
recomendada pelo IETF ndash Internet Engineering Task Force e se tornou um padratildeo
da Internet Ela oferece um melhor controle sobre os layouts dos textos
apresentados nas paacuteginas aleacutem da inclusatildeo de imagens e formulaacuterios que permite
aos desenvolvedores conseguir a participaccedilatildeo dos usuaacuterios de forma faacutecil e raacutepida
aleacutem de explorar as capacidades multimiacutedias da Web (STANEK 1996)
O HTML 30 de 1996 permite novos formatos de textos Uma de suas
caracteriacutesticas mais importantes eacute a definiccedilatildeo dos tags necessaacuterios para a criaccedilatildeo
de tabelas que permitem que os desenvolvedores apresentem as informaccedilotildees
desejadas formatadas em linhas e colunas (STANEK 1996) Durante o
desenvolvimento do HTML 30 com a rapidez da expansatildeo da Web os esforccedilos de
padronizaccedilatildeo natildeo puderam acompanhar as tendecircncias de desenvolvimento que
exigiam maiores recursos de apresentaccedilatildeo graacutefica do que o HTML 20 podia
fornecer Por isso o HTML 30 acabou natildeo sendo aprovado e em 1997 aprovou-se
uma recomendaccedilatildeo chamada HTML 32 que introduzia recursos de apresentaccedilatildeo
graacutefica no HTML (INTRODUCING 2004)
O HTML 40 de 1998 eacute uma extensatildeo do HTML 32 Essa versatildeo oferece
melhorias nos recursos de acessibilidade Quando o HTML eacute usado de forma
estruturada um documento pode se adaptar a diferentes browsers acomodar
diferentes fontes cores especiais sintetizadores de voz e dispositivos Braille Essa
adaptabilidade permite a pessoas com defeitos fiacutesicos trabalhar de forma facilitada
na Web Essa versatildeo adotou tambeacutem o Universal Character Set que usa o suporte
a convenccedilotildees internacionais permitindo a utilizaccedilatildeo de quase todas as linguagens
do mundo Outra novidade satildeo os frames (dividem a paacutegina em duas ou mais partes
ndash framesets - e satildeo geralmente usados para que um frameset permaneccedila enquanto
outros mudem baseados nos links que o usuaacuterio seleciona) Vaacuterios elementos do
HTML 32 foram considerados deprecados (candidatos a se tornarem obsoletos)
pelo HTML 40 forccedilando uma ecircnfase na separaccedilatildeo da estrutura do documento e na
apresentaccedilatildeo dos elementos que permitem definir cores fontes alinhamento
imagens de fundo e outras caracteriacutesticas da apresentaccedilatildeo da paacutegina que
dependem da plataforma onde a informaccedilatildeo eacute visualizada Essa separaccedilatildeo pocircde ser
realizada graccedilas a CSS (Cascading Style Sheets) que permite a criaccedilatildeo de folhas
11
de estilo aplicaacuteveis a vaacuterias paacuteginas de um site Se um dispositivo limitado natildeo
consegue exibir os estilos definidos no CSS ele pelo menos consegue entender a
estrutura do texto e imagens de forma que mesmo usuaacuterios com menos recursos
podem ter acesso agrave informaccedilatildeo contida na paacutegina (HTML 2004)
2111 Forma Baacutesica de um Documento HTML
Como jaacute foi citado anteriormente o HTML eacute na verdade apenas texto com
coacutedigos de formataccedilatildeo que especificam diferentes fontes e estilos Com a inserccedilatildeo
das tags o texto que estaacute compreendido entre essas marcas assume
caracteriacutesticas diferentes de acordo com cada uma delas
Cada tag informa ao browser como ele deveraacute formatar o texto que deve
estar dentro dos sinais de menor que (lt) e maior que (gt) Por exemplo ltHTMLgt
ltBODYgt
Os tags podem ser uacutenicos ou duplos com iniacutecio e fim Se forem duplos
existiraacute um tag informando que aquela formataccedilatildeo estaacute sendo encerrada Por
exemplo um tag simples pode ser representado por rdquoltbrgtrdquo que indica uma quebra
de linha Jaacute um tag duplo pode ser ltbgtltbgt indicando que o que estiver entre
esses campos deveraacute ser apresentado em negrito
A estrutura de um documento HTML apresenta os seguintes componentes
ltHTMLgt
ltHEADgtltTITLEgtTiacutetulo do DocumentoltTITLEgtltHEADgt
ltBODYgt
texto imagem links ltBODYgt
ltHTMLgt
Todo documento HTML deve estar entre os tags ltHTMLgt e ltHTMLgt A partir
daiacute esses documentos satildeo divididos em duas seccedilotildees principais a seccedilatildeo HEAD e a
seccedilatildeo BODY A HEAD conteacutem informaccedilotildees sobre o documento O tag ltTITLEgt por
exemplo define um tiacutetulo que eacute mostrado no alto da janela do browser Tudo que
estiver contido na seccedilatildeo ltBODYgt seraacute mostrado na janela principal do browser
12
Essa seccedilatildeo pode conter cabeccedilalhos paraacutegrafos listas tabelas links para outros
documentos e imagens
212 PHP - Personal Home Page
Como as paacuteginas em HTML satildeo basicamente apresentaccedilotildees de texto e
imagens com o passar do tempo surgiu a necessidade de uma interaccedilatildeo maior com
o usuaacuterio permitindo que se tivesse um histoacuterico desse usuaacuterio aleacutem da
possibilidade de se mostrar informaccedilotildees personalizadas aos mesmos Para esse
propoacutesito umas das linguagens que surgiram e que tinham forte ligaccedilatildeo com o
HTML foi o PHP
O PHP eacute uma linguagem de server-side (as paacuteginas ficam armazenadas e
satildeo executadas em um servidor onde o site estaacute localizado) e open-source (um
programa que tem seu coacutedigo fonte disponiacutevel para que qualquer pessoa que tenha
uma ideacuteia uma sugestatildeo possa ajudar no seu desenvolvimento) para criaccedilatildeo de
paacuteginas dinacircmicas para a Web Uma paacutegina dinacircmica eacute aquela que interage com o
usuaacuterio de forma que cada usuaacuterio ao visitar a paacutegina veraacute informaccedilotildees
personalizadas Os aplicativos dinacircmicos da Web satildeo predominantes nos sites
comerciais(e-commerce ndash sites de venda pela Internet) onde o conteuacutedo
apresentado eacute gerado a partir de informaccedilotildees acessadas de um banco de dados ou
outra fonte externa Sua interface permite que se incluam comandos PHP
diretamente na paacutegina HTML
O PHP sucede de um produto mais antigo chamado PHPFI PHPFI foi
criado por Rasmus Lerdorf em 1994 inicialmente como scripts (arquivos texto com
um conjunto de instruccedilotildees de uma linguagem especiacutefica nos quais estatildeo contidas
todas as instruccedilotildees que dizem o que o programa faraacute) usados para gerar estatiacutesticas
de acesso para seu curriacuteculo on line Ele nomeou esta seacuterie de scripts de ldquoPersonal
Home Page Toolsrdquo a qual adquiriu um relativo ecircxito devido a outras pessoas
pedirem a Rasmus que lhes permitisse utilizar os seus programas nas suas proacuteprias
paacuteginas Web Como mais funcionalidades foram requeridas Rasmus escreveu uma
implementaccedilatildeo em linguagem C muito maior que era capaz de comunicar-se com
uma base de dados e possibilitava a usuaacuterios o desenvolvimento simples de
aplicativos dinacircmicos para Web Devido agrave aceitaccedilatildeo do primeiro PHP e de maneira
adicional o seu criador desenhou um sistema para processar formulaacuterios ao qual
13
deu o nome de FI (Form Interpreter) e o conjunto destas duas ferramentas seria a
primeira versatildeo compacta da linguagem PHPFI Rasmus resolveu distribuir o
coacutedigo fonte do PHPFI para que todos pudessem ver e tambeacutem usaacute-lo bem como
corrigir bugs e melhorar o coacutedigo (HISTOacuteRIA 2004)
O PHPFI usava interpretaccedilotildees automaacuteticas de variaacuteveis vindas de formulaacuterio
(dados passados pelos usuaacuterios) e era embutida diretamente no coacutedigo do HTML
Poreacutem a sua sintaxe era limitada simples e um pouco inconsistente
Em 1997 PHPFI 20 a segunda versatildeo da implementaccedilatildeo em linguagem C
obteve milhares de usuaacuterios ao redor do mundo com um valor estimado de
aproximadamente 50000 domiacutenios respondendo por basicamente 1 dos domiacutenios
da Internet Enquanto isto havia milhares de pessoas contribuindo com pequenos
coacutedigos para o projeto e ainda assim o PHPFI 20 foi oficialmente lanccedilado somente
ao final de 1997 apoacutes perder a maior parte de sua vida em versotildees beta (versotildees de
um produto que satildeo distribuiacutedas para teste dos usuaacuterios antes do lanccedilamento
oficial) O PHPFI 20 foi rapidamente substituiacutedo pelas versotildees iniciais do PHP 30
(HISTOacuteRIA 2004)
O PHP 30 foi a primeira versatildeo que se assemelha ao PHP que eacute utilizado
atualmente Ela foi criada por Andi Gutmans e Zeev Suraski em 1997 e foi
totalmente reescrito apoacutes eles descobrirem que o PHPFI 20 poderia ajudaacute-los a
desenvolver suas proacuteprias aplicaccedilotildees de e-Commerce de um projeto na sua
Universidade No esforccedilo cooperativo e iniciativa de reescrever o PHPFI a partir da
base existente Andi Rasmus e Zeev decidiram unir esforccedilos e anunciar o PHP 30
como uma versatildeo oficial de seu antecessor (o PHPFI 20) (HISTOacuteRIA 2004)
O PHP 30 aleacutem de oferecer aos usuaacuterios finais uma infraestrutura soacutelida
para diversos bancos de dados protocolos e APIs a extensibilidade (possibilidade
de uso para diversos objetivos) do PHP 30 atrai dezenas de novos desenvolvedores
para se juntar e submeter novos moacutedulos Esta eacute a chave do sucesso do PHP 30
Outras caracteriacutesticas chaves introduzidas no PHP 30 foram o suporte agrave sintaxe
para orientaccedilatildeo a objetos e uma sintaxe muito mais poderosa e consistente
O PHP 30 foi oficialmente lanccedilado em Junho de 1998 depois de ter passado
aproximadamente 9 meses em testes puacuteblicos (versotildees beta) Os objetivos do
projeto eram melhorar a performance de aplicaccedilotildees complexas e melhorar a
modularidade do coacutedigo base do PHP
14
O PHP 40 acompanhado com uma seacuterie de novas caracteriacutesticas foi
oficialmente lanccedilada no iniacutecio de 2000 quase dois anos apoacutes o seu antecessor
Aleacutem da melhora na performance esta versatildeo incluiu outras caracteriacutesticas chave
como o suporte para muitos servidores Web sessotildees HTTP buffer de saiacuteda e
maneiras mais seguras de manipular entrada de dados dos usuaacuterios (HISTOacuteRIA
2004)
De acordo com o site oficial do PHP (phpnetusagephp) atualmente
aproximadamente 17 milhotildees de domiacutenios estatildeo usando PHP na Web
2121 PHP - Por que utilizar
A popularidade do PHP continua crescendo rapidamente devido a muitas
vantagens Eacute raacutepido pois devido a estar embutido no coacutedigo HTML o tempo para
processar e carregar uma paacutegina Web eacute curto Eacute graacutetis e faacutecil de usar pois os
coacutedigos PHP satildeo facilmente incluiacutedos no arquivo HTML eacute versaacutetil pois o PHP roda
em uma grande variedade de sistemas operacionais eacute muito seguro pois se o
coacutedigo for escrito corretamente o usuaacuterio natildeo iraacute enxergar o coacutedigo PHP aleacutem de
ser customizaacutevel pois a licenccedila open-source permite aos programadores
modificarem o PHP adicionando ou modificando as caracteriacutesticas necessaacuterias ao
seu proacuteprio desenvolvimento
Devido ao PHP ser executado no servidor ele pode dinamicamente criar o
coacutedigo HTML que iraacute gerar a paacutegina Web permitindo que os usuaacuterios individuais
vejam paacuteginas customizadas Os visitantes da paacutegina Web vecircem a saiacuteda gerada
pelos scripts mas natildeo os scripts propriamente ditos tornando-o muito seguro
O PHP consegue trabalhar com ldquosessotildeesrdquo ou seja para executar
determinadas accedilotildees (fazer um download por exemplo) o usuaacuterio deve estar
identificado no site O PHP permite que se crie uma ldquosessatildeordquo que identifica cada
usuaacuterio no sistema aleacutem de outros dados referentes ao mesmo Se o usuaacuterio tentar
entrar em uma paacutegina especiacutefica primeiramente eacute verificado se existe uma sessatildeo
para o mesmo Se natildeo existir eacute mostrada uma mensagem de acesso proibido Se a
sessatildeo for vaacutelida os outros paracircmetros do usuaacuterio (salvos na sessatildeo) podem ser
verificados e validados caso necessaacuterio
2122 PHP - Como Funciona
15
Segundo Janet Valade (VALADE2004) O coacutedigo PHP eacute embutido no coacutedigo
HTML As tags do HTML satildeo usadas para incluir a linguagem PHP na linguagem
HTML Quando o PHP estaacute instalado o servidor Web eacute configurado para procurar
por coacutedigo PHP embutido em arquivos com extensotildees especiacuteficas (php ou phtml)
Quando o servidor recebe uma requisiccedilatildeo para um arquivo com uma dessas
extensotildees ele envia o coacutedigo HTML como estaacute mas o coacutedigo PHP eacute processado
pelo software antes de ser enviado ao solicitante Quando a linguagem PHP eacute
processada a saiacuteda consiste de coacutedigo HTML Os coacutedigos PHP natildeo satildeo incluiacutedos
no HTML enviado ao browser por isso o coacutedigo PHP eacute seguro e transparente para o
usuaacuterio Quando um browser eacute apontado para um arquivo HTML o servidor envia o
arquivo ao browser O browser processa o arquivo e mostra a paacutegina descrita pelos
tags HTML do arquivo Quando um Web browser eacute apontado para um arquivo PHP
o servidor procura por seccedilotildees PHP no arquivo e os processa enviando o resultado
do processamento ao browser Esses satildeo os passos seguidos pelo servidor para
processar um arquivo PHP
1 O servidor inicia a procura no arquivo em modo HTML Ele assume que o
coacutedigo eacute HTML e os envia ao browser sem nenhum processamento
2 O servidor web continua em modo HTML ateacute encontrar um tag de abertura do
PHP (lt)
3 Quando o servidor encontra um tag de abertura do PHP alterna para modo
PHP assume que todos os comandos subsequumlentes satildeo desse tipo e os
executa Se o comando gera uma saiacuteda a envia ao browser
4 O servidor continua em modo PHP ateacute encontrar um tag de fechamento do
PHP (gt)
5 Quando o servidor encontra um tag de fechamento do PHP retorna ao modo
HTML e repete o ciclo
2123 Forma Baacutesica de um Documento PHP
O PHP eacute embutido diretamente no programa HTML Seus comandos satildeo
delimitados pelos tags lt e gt Dentro dos tags de abertura e fechamento do PHP
satildeo incluiacutedos comandos especiacuteficos que satildeo interpretados pela linguagem A sintaxe
eacute bastante parecida com a da linguagem C Por exemplo
ltHTMLgt
16
ltHEADgtltTITLEgtTeste PHPltTITLEgtltHEADgt
ltBODYgt
ltpgt Linha HTML
lt
$id = $_GET[id]
if ($id = 1)
echo ldquoltpgtUsuaacuterio Nordm 1ltpgtrdquo
else
echo ldquoltpgt Usuaacuterio Nordm 2ltpgtrdquo
gt
ltBODYgt
ltHTMLgt
213 Javascript
Javascript eacute uma linguagem criada pela Netscape que serve basicamente
para aumentar os recursos do navegador
Todas as paacuteginas escritas com HTML satildeo estaacuteticas Conseguem fazer com
que o browser apenas leia o que haacute no coacutedigo e reproduza aquele conjunto de
instruccedilotildees Um dos principais recursos do Javascript eacute a possibilidade de fazer com
que a paacutegina HTML seja dinacircmica ou seja capaz de fazer com que o usuaacuterio possa
interagir com a paacutegina ou usar outros recursos para fazer com que o documento
Web se altere sem necessidade de um novo carregamento de paacutegina
O Javascript eacute uma linguagem de programaccedilatildeo que funciona interativamente
com o coacutedigo HTML O Javascript consegue ler entender e manipular os objetos de
uma paacutegina HTML tendo a facilidade necessaacuteria para alteraacute-los automaticamente
quando programado Satildeo inseridos nas paacuteginas de uma maneira peculiar podendo
ter apenas uma aacuterea para scripts ou espalhados pelo coacutedigo do jeito que melhor se
adapte agraves necessidades de cada usuaacuterio Diferentemente da linguagem PHP o
Javascript eacute uma linguagem client-side (as paacuteginas satildeo armazenadas e executadas
na maacutequina cliente) (LOURENCcedilO 2000)
17
22 Programas
221 Fireworks
O Fireworks eacute uma ferramenta de produccedilatildeo graacutefica para criaccedilatildeo de interfaces
e imagens Web com interaccedilatildeo em vaacuterias linguagens scripts (como php cfml html
xml Xhtml) podendo montar sites atraveacutes de desenhos O Fireworks consegue
combinar muito bem recursos vetoriais (como o ajuste de textos recursos praacuteticos
de desenho e ediccedilatildeo de noacutes) com os recursos aplicados a bitmaps ou imagens
(como o tratamento de cores e ferramentas de efeitos)
Tambeacutem permite trabalhar com layouts de sites sendo que pode-se
transformar o layout em uma paacutegina HTML usando o recurso de slices (fatias) O
programa permite que vocecirc divida o layout inteiro em vaacuterias imagens de acordo com
as aacutereas especiacuteficas que se deseja criar Apoacutes essa divisatildeo cada uma dessas aacutereas
eacute exportada com um formato de arquivo e com uma compactaccedilatildeo especiacutefica
podendo gerar o HTML com as imagens (ou fatias) nos seus devidos lugares e
posiccedilotildees ou mesmo exporta-las para o Dreamweaver Sua outra vantagem eacute a
possibilidade de se trabalhar com os behaviors (comportamentos) Com os
bahaviors pode-se criar rollovers (menus interativos) e menus pop ups (menus que
abrem outros sub-menus de acordo com cada item) estilizados
Como o Fireworks foi inicialmente projetado para a Web permite tambeacutem a
exportaccedilatildeo de imagens para a rede Esses recursos incluem a total otimizaccedilatildeo de
cada formato de arquivo a ser exportado bem como GIFS e JPEGS Aleacutem disso
pode-se fazer uma comparaccedilatildeo visual e do tamanho do arquivo simultaneamente
de ateacute 4 formatos ou configuraccedilotildees de exportaccedilotildees e tambeacutem salvar as mesmas
configuraccedilotildees para usar mais tarde em outros arquivos (CARACTERIacuteSTICAS
2004)
222 Dreamweaver
O Dreamweaver eacute um editor profissional de HTML utilizado para projetar
codificar e desenvolver sites paacuteginas e aplicaccedilotildees Web Permite que se trabalhe as
paacuteginas HTML de forma manual ou em um ambiente de ediccedilatildeo visual fornecendo
ferramentas uacuteteis para esses fins O Dreamweaver tambeacutem permite que se construa
aplicaccedilotildees Web dinacircmicas usando linguagens que rodam nos servidores (PHP
nesse caso) (PAGE 2004) Algumas das facilidades do Dreamweaver satildeo
18
bull Administraccedilatildeo remota do site e arquivos fonte localmente
bull Operaccedilatildeo em CSS (Cascade Style Sheets)
bull Geraccedilatildeo automatizada de rotinas em Javascript
bull Formulaacuterios
bull Criaccedilatildeo e uso de templates (modelos)
bull Gerenciamento completo do site e seus componentes (por exemplo se um
arquivo de imagem for movido de um sub-diretoacuterio para outro todo o site eacute
reparado automaticamente)
bull Apresentaccedilatildeo do mapa do site com diferentes niacuteveis de detalhamento
bull Behaviors (comportamentos que depois podem ser reaproveitados) com
rotinas de JavaScript
bull Manipulaccedilatildeo de tabelas
bull Rollover de imagens
bull Administraccedilatildeo do site a partir da barra de menu
bull Reparo automaacutetico do site a partir da mudanccedila de endereccedilo ou nome de
uma miacutedia ou link em geral
23 Banco de Dados
231 MySQL
O MySQL eacute um SGDB (ou sistema gerenciador de banco de dados) que eacute
desenvolvido e distribuiacutedo pela MySQL AB a empresa fundada pelos suecos David
Axmark Allan Larsson e Michael Widenius Ele derivou de outro banco de dados o
mSQL Pelo fato do mesmo natildeo ser raacutepido nem flexiacutevel o suficiente para as suas
necessidades os suecos resolveram criar um novo banco de dados utilizando a
interface API (application programming interface - conjunto de rotinas padronizadas
que a aplicaccedilatildeo utiliza para efetuar seus serviccedilos) do proacuteprio mSQL utilizada para
facilitar a portabilidade de coacutedigos escritos do mSQL para o MySQL
Escrito em C e C++ e testado em vaacuterias plataformas diferentes o MySQL
possui um sistema de alocaccedilatildeo de memoacuteria baseado em processos que permite a
execuccedilatildeo de tarefas paralelas tornando-o extremamente raacutepido e eficiente Ele eacute um
banco de dados do tipo SQL (Structured Query Language) e por isso possui as
caracteriacutesticas dos principais bancos de dados do tipo SQL como operadores e
funccedilotildees agrupamentos joins (junccedilotildees de tabelas) aceita vaacuterios tipos de campos
19
suportando registros de tamanhos fixos ou variaacuteveis controla a seguranccedila dos
dados aleacutem de poder armazenar uma grande quantidade de dados chegando a
quantidades superiores a 50000000 de registros Aleacutem disso o MySQL eacute multi-
usuaacuterio (programas de mais de um usuaacuterio podem estar em execuccedilatildeo) eacute multi-
tarefa (eacute capaz de executar vaacuterios programas simultaneamente mesmo que a
maacutequina possua somente um processador) e open-source
Esse servidor de banco de dados eacute considerado como o mais raacutepido entre os
de sua categoria tanto para grandes volumes de dados como pequenos Poreacutem
como ele foi criado para ser extremamente aacutegil teve-se de descartar certos aspectos
das especificaccedilotildees SQL e foi decidido natildeo se implementar caracteriacutesticas que geram
muita demanda de recursos como os triggers que satildeo uma porccedilatildeo de coacutedigo
armazenado que se executa quando eacute realizada uma operaccedilatildeo (atualizaccedilatildeo
inclusatildeo etc) com o banco de dados Naturalmente comprovar a proacutepria existecircncia
do trigger e executaacute-lo consome recursos e tempo
As principais vantagens do MySQL satildeo a baixa demanda de recursos de
hardware a simplicidade de administraccedilatildeo e a otimizaccedilatildeo para as aplicaccedilotildees tiacutepicas
da web onde ocorrem mais consultas do que atualizaccedilotildees (MySQL 2004)
20
3 DESIGN DO SITE
Atraveacutes de um briefing (anexo 1) pode-se chegar a algumas conclusotildees que
influenciaram na escolha da forma de apresentaccedilatildeo das paacuteginas e levaram a
definiccedilatildeo de quais cores imagens e forma o site seria apresentado aos usuaacuterios
31 DEFINICcedilAtildeO DAS CORES
311 A Teoria das Cores
O que se convencionou chamar de Teoria das Cores de Leonardo da Vinci
satildeo as formulaccedilotildees histoacutericas esparsas contidas em seus escritos e reunidas no livro
Tratado da Pintura e da Paisagem ndash Sombra e Luz que satildeo anotaccedilotildees recolhidas
pelo artista ao longo de anos de observaccedilatildeo e eacute a teoria mais corrente sendo um
dos legados do renascimento para as artes visuais (TEORIA 2004)
312 O Disco Cromaacutetico
O disco cromaacutetico natildeo eacute um instrumento cientiacutefico de classificaccedilatildeo de cores
mas eacute muito uacutetil no entendimento da teoria das cores As cores se dividem em
primaacuterias secundaacuterias e terciaacuterias (TEORIA 2004)
Pode-se reproduzir qualquer sensaccedilatildeo de cor misturando-se aditivamente
diversas quantidades de vermelho azul e verde Por isso conhecem-se essas cores
como cores primaacuterias (ENCARTA 2000) Combinado-se duas cores primaacuterias
obtemos as cores secundaacuterias resultando no laranja (amarelo com vermelho) verde
(azul com amarelo) e violeta (vermelho com azul) As cores terciaacuterias satildeo obtidas
pela mistura de uma primaacuteria com uma ou mais secundaacuterias (TEORIA 2004)
21
A figura 1 apresenta a representaccedilatildeo graacutefica do disco cromaacutetico
FIGURA 1 ndash DISCO CROMAacuteTICO
313 Cores Anaacutelogas
Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores anaacutelogas satildeo as
cores dispostas lado a lado no disco cromaacutetico Satildeo anaacutelogas porque haacute nelas uma
mesma cor baacutesica e satildeo usadas para dar a sensaccedilatildeo de uniformidade Observando
a figura 1 visualiza-se que a cor anaacuteloga do amarelo eacute o laranja por exemplo
314 Cores Complementares Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores complementares
satildeo aquelas que encontram-se sempre em posiccedilotildees opostas no disco cromaacutetico As
cores complementares satildeo usadas para dar forccedila e equiliacutebrio a um trabalho criando
contrastes Observando a figura 1 visualiza-se que a cor complementar do
vermelho eacute o verde e do laranja eacute o azul por exemplo
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
3
3414 Visualizar Notiacutecia 40 3415 Mural41 3416 Exclusatildeo do Mural 42 3417 Administraccedilatildeo 43 3418 Cadastro de Usuaacuterios 44 3419 Alteraccedilatildeo de Usuaacuterio 45
35 PAacuteGINAS NAtildeO VISIacuteVEIS 47 351 Conexatildeophp47 352 deleta_artigophp 47 353 deleta_muralphp 47 354 deleta_noticiaphp47 355 deleta_pesquisaphp47 356 deleta_usuaacuteriophp 47 357 grava_alteracaoartigophp 47 358 grava_alteracaonoticiaphp48 359 grava_alteracaopesquisaphp48 3510 grava_alteracaousuariophp 48 3511 grava_artigophp 48 3512 grava_notiacuteciaphp 48 3513 grava_pesquisaphp48 3514 grava_muralphp 48 3515 grava_usuaacuteriophp 48 3516 loginphp 48
4 COacuteDIGO FONTE 49 5 CONCLUSAtildeO 50 REFEREcircNCIAS52 ANEXOS 54
4
LISTA DE FIGURAS FIGURA 1 - DISCO CROMAacuteTICO 21 FIGURA 2 - REPRESENTACcedilAtildeO DOS FRAMES 25 FIGURA 3 - HOME 27 FIGURA 4 - CADASTRO DE PESQUISAS 28 FIGURA 5 - ALTERACcedilAtildeO DE PESQUISAS 29 FIGURA 6 - CADASTRO DE ARTIGOS 30 FIGURA 7 - ALTERACcedilAtildeO ARTIGOS 31 FIGURA 8 - CADASTRO DE NOTIacuteCIAS 32 FIGURA 9 - ALTERACcedilAtildeO DE NOTIacuteCIAS 33 FIGURA 10 - OBJETIVOS 34 FIGURA 11 - ESTATUTO 35 FIGURA 12 - PARTICIPANTES 36 FIGURA 13 - COLABORADORES 37 FIGURA 14 - VISUALIZAR PESQUISAS 38 FIGURA 15 - DETALHE DA PESQUISA 38 FIGURA 16 - VISUALIZAR ARTIGO 39 FIGURA 17 - DETALHE DO ARTIGO 39 FIGURA 18 - VISUALIZAR NOTIacuteCIA 40 FIGURA 19 - DETALHE DA NOTIacuteCIA 40 FIGURA 20 - MURAL 41 FIGURA 21 - EXCLUSAtildeO DO MURAL 42 FIGURA 22 - ADMINISTRACcedilAtildeO 43 FIGURA 23 - CADASTRO DE USUAacuteRIOS 44 FIGURA 24 - PESQUISA USUAacuteRIOS 45 FIGURA 25 - ALTERACcedilAtildeO DE USUAacuteRIOS 46
5
Resumo O presente trabalho aborda a anaacutelise e o desenvolvimento de um site
dinacircmico na Internet tendo como contratante o Gerds (grupo de estudos
interdisciplinar em redes de computadores e sistemas distribuiacutedos) da Universidade
Tuiuti do Paranaacute que tem por objetivo divulgar as pesquisas realizadas por alunos
professores e colaboradores participantes do grupo em questatildeo Este foi elaborado
a partir de teacutecnicas de desenvolvimento de sites e entrevistas feitas diretamente com
o contratante
Palavras-chave Desenvolvimento de site site dinacircmico PHP MySQL HTML
6
1 INTRODUCcedilAtildeO
Estima-se que hoje existam mais de 250 milhotildees de pessoas que utilizam a
Internet natildeo soacute como ferramenta de trabalho mas tambeacutem como diversatildeo e
pesquisa Essas pessoas esperam obter da plataforma Web um material de alta
qualidade (incluindo imagens animaccedilatildeo som e viacutedeo) e que esse material esteja
apresentado de forma agradaacutevel e funcionando de forma raacutepida e eficiente A
especializaccedilatildeo em Desenvolvimento Web ofereceu a preparaccedilatildeo para o trabalho no
desenvolvimento conhecimento e utilizaccedilatildeo das tecnologias multimiacutedia e Internet e
dos sistemas e aplicaccedilotildees que fazem uso dessas tecnologias
O desenvolvimento do site do Gerds (grupo de estudos interdisciplinar em
redes de computadores e sistemas distribuiacutedos) da UTP tem por objetivo divulgar o
trabalho realizado por alunos professores colaboradores e participantes dos cursos
de Engenharia da Computaccedilatildeo Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia
da Computaccedilatildeo e os cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes
de Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
universidade e a comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados
ou por transferecircncia de tecnologias inserindo professores e alunos num contexto
soacutecio-econocircmico mais amplo do que a realidade acadecircmica Essas informaccedilotildees satildeo
oferecidas pelo site atraveacutes de pesquisas artigos e notiacutecias periodicamente
atualizadas aleacutem de permitir que se desenvolva uma comunicaccedilatildeo bilateral entre os
interessados atraveacutes do cadastramento dessas pessoas no site bem como a
possibilidade de se deixar mensagens em um mural destinado a esse fim Sendo o contratante do serviccedilo o Gerds ficou definido como pessoa
responsaacutevel pela definiccedilatildeo das necessidades do site o professor Roberto Amaral
Atraveacutes de teacutecnicas de levantamento de dados (ver anexo I) foram obtidos os dados
baacutesicos necessaacuterios para o desenvolvimento do site A presente monografia estaacute estruturada em 5 capiacutetulos cujo conteuacutedo eacute
apresentado sucintamente a seguir
O Capiacutetulo 2 apresenta uma introduccedilatildeo aos conceitos das tecnologias
utilizadas enfocando sua histoacuteria e utilizaccedilatildeo na atual estrutura da Internet
O Capiacutetulo 3 apresenta a descriccedilatildeo de como foi realizado o design do site e a
funcionalidade das paacuteginas
O Capiacutetulo 4 apresenta a referecircncia ao coacutedigo fonte do trabalho
7
O Capiacutetulo 5 apresenta a conclusatildeo do trabalho
8
2 TECNOLOGIAS UTILIZADAS
De acordo com os estudados realizados as seguintes tecnologias foram
utilizadas para o desenvolvimento do site do Gerds
bull Linguagem o HTML ndash Utilizada para fazer o corpo principal das paacuteginas Adotado
por ser gratuito e amplamente utilizado na Internet
o PHP ndash Apesar do conteuacutedo apresentado nas aulas ter sido baseado
em ASP um novo estudo em linguagem PHP foi realizado em
classe e extra classe pois foi utilizado um servidor com sistema
operacional Linux com o servidor de banco de dados Apache que
interpreta somente a linguagem PHP Foi utilizado para tornar as
paacuteginas dinacircmicas e realizar a comunicaccedilatildeo com o banco de
dados
o JavaScript ndash Utilizado para criar funccedilotildees que satildeo executadas na
maacutequina do usuaacuterio Adotado por ser gratuito e amplamente
utilizado na Internet
bull Programas o Fireworks ndash Utilizado para fazer as imagens e construir a parte
visual do site Foi adotado por ser uma ferramenta que permite
trabalhar com layouts de sites de forma raacutepida e faacutecil e ter ampla
compatibilidade com o Dreamweaver
o Dreamweaver ndash Utilizado para a construccedilatildeo do site e a
programaccedilatildeo Adotado por ser uma ferramenta completa e que
permite desenvolver e administrar o site de forma raacutepida e eficiente
bull Banco de Dados o MySQL ndash Utilizado para armazenar os dados do site Adotado por
ser gratuito e amplamente utilizado em aplicaccedilotildees Web
21 Linguagem
211 HTML - HyperText Markup Language
No nuacutecleo de toda paacutegina da Web encontra-se a HyperText Markup
Language uma linguagem de diagramaccedilatildeo baseada em marcadores ou tags
9
(marcas utilizadas pela linguagem html que permitem ao browser formatar o texto
entre as tags de acordo com cada tag especiacutefica) como eacute mais comumente
conhecido A HTML eacute uma linguagem simples baseada em texto e que pode ser
visualizada em qualquer plataforma tanto em navegadores somente texto (como o
Lynx) como em navegadores mais avanccedilados (como Netscape Navigator e Internet
Explorer)
A HTML eacute na verdade apenas texto com coacutedigos de formataccedilatildeo que
especificam diferentes fontes e estilos ou ateacute mesmo outras funccedilotildees mais
avanccediladas Ela eacute muito semelhante aos antigos editores de texto que exigiam a
inserccedilatildeo de tags para especificar tipos em itaacutelico negrito ou sublinhado
O HTML nasceu em 1990 no CERN (European Council for Nuclear Research)
na Suiacuteccedila Seu criador o inglecircs Tim Berners-Lee a concebeu unicamente como uma
linguagem que serviria para interligar computadores do laboratoacuterio e outras
instituiccedilotildees de pesquisa e exibir documentos cientiacuteficos de forma simples e faacutecil de
acessar (STANEK 1996)
Em 1992 com a liberaccedilatildeo da biblioteca de desenvolvimento para WWW
(World Wide Web ou Rede de Alcance Mundial) aconteceu uma grande evoluccedilatildeo o
que foi fundamental para expansatildeo do HTML Essa biblioteca deu origem agrave
construccedilatildeo de vaacuterios browsers e servidores tornando a Web uma ferramenta viaacutevel
O MOSAIC desenvolvido por Marc Andreeson entatildeo do NCSA foi o primeiro
browser multi-plataforma que explorava completamente a capacidade de hipermiacutedia
da Web e que iniciou o crescimento explosivo da mesma Em 1993 o HTML tornou-
se disponiacutevel a milhotildees de usuaacuterios com a liberaccedilatildeo das versotildees para Mac e
Windows (STANEK 1996)
Quanto as suas especificaccedilotildees o HTML percorreu um caminho longo ateacute
chegar agrave sua atual especificaccedilatildeo Atualmente 4 especificaccedilotildees do HTML estatildeo
definidas Cada nova especificaccedilatildeo eacute compatiacutevel com as especificaccedilotildees anteriores e
incluem diversas melhorias A primeira especificaccedilatildeo do HTML que eacute a versatildeo
original foi a HTML 10 Tim Berners-Lee juntamente com David Ragget a
publicaram em 1993 Devido a sua capacidade limitada a versatildeo 10 permitia o
desenvolvimento de documentos baacutesicos Incluiacutea muacuteltiplos niacuteveis de cabeccedilalhos
exibiccedilatildeo de paraacutegrafos navegaccedilatildeo por referecircncias a hipertextos (composiccedilatildeo de
elementos de informaccedilatildeo paraacutegrafos paacuteginas imagens sequumlecircncias musicais etc e
10
ligaccedilotildees entre esses elementos indicando a passagem de um a outro) e
formataccedilotildees especiais para itens de uma lista (STANEK 1996)
A definiccedilatildeo do HTML 20 concluiacuteda em 1995 foi a primeira versatildeo
recomendada pelo IETF ndash Internet Engineering Task Force e se tornou um padratildeo
da Internet Ela oferece um melhor controle sobre os layouts dos textos
apresentados nas paacuteginas aleacutem da inclusatildeo de imagens e formulaacuterios que permite
aos desenvolvedores conseguir a participaccedilatildeo dos usuaacuterios de forma faacutecil e raacutepida
aleacutem de explorar as capacidades multimiacutedias da Web (STANEK 1996)
O HTML 30 de 1996 permite novos formatos de textos Uma de suas
caracteriacutesticas mais importantes eacute a definiccedilatildeo dos tags necessaacuterios para a criaccedilatildeo
de tabelas que permitem que os desenvolvedores apresentem as informaccedilotildees
desejadas formatadas em linhas e colunas (STANEK 1996) Durante o
desenvolvimento do HTML 30 com a rapidez da expansatildeo da Web os esforccedilos de
padronizaccedilatildeo natildeo puderam acompanhar as tendecircncias de desenvolvimento que
exigiam maiores recursos de apresentaccedilatildeo graacutefica do que o HTML 20 podia
fornecer Por isso o HTML 30 acabou natildeo sendo aprovado e em 1997 aprovou-se
uma recomendaccedilatildeo chamada HTML 32 que introduzia recursos de apresentaccedilatildeo
graacutefica no HTML (INTRODUCING 2004)
O HTML 40 de 1998 eacute uma extensatildeo do HTML 32 Essa versatildeo oferece
melhorias nos recursos de acessibilidade Quando o HTML eacute usado de forma
estruturada um documento pode se adaptar a diferentes browsers acomodar
diferentes fontes cores especiais sintetizadores de voz e dispositivos Braille Essa
adaptabilidade permite a pessoas com defeitos fiacutesicos trabalhar de forma facilitada
na Web Essa versatildeo adotou tambeacutem o Universal Character Set que usa o suporte
a convenccedilotildees internacionais permitindo a utilizaccedilatildeo de quase todas as linguagens
do mundo Outra novidade satildeo os frames (dividem a paacutegina em duas ou mais partes
ndash framesets - e satildeo geralmente usados para que um frameset permaneccedila enquanto
outros mudem baseados nos links que o usuaacuterio seleciona) Vaacuterios elementos do
HTML 32 foram considerados deprecados (candidatos a se tornarem obsoletos)
pelo HTML 40 forccedilando uma ecircnfase na separaccedilatildeo da estrutura do documento e na
apresentaccedilatildeo dos elementos que permitem definir cores fontes alinhamento
imagens de fundo e outras caracteriacutesticas da apresentaccedilatildeo da paacutegina que
dependem da plataforma onde a informaccedilatildeo eacute visualizada Essa separaccedilatildeo pocircde ser
realizada graccedilas a CSS (Cascading Style Sheets) que permite a criaccedilatildeo de folhas
11
de estilo aplicaacuteveis a vaacuterias paacuteginas de um site Se um dispositivo limitado natildeo
consegue exibir os estilos definidos no CSS ele pelo menos consegue entender a
estrutura do texto e imagens de forma que mesmo usuaacuterios com menos recursos
podem ter acesso agrave informaccedilatildeo contida na paacutegina (HTML 2004)
2111 Forma Baacutesica de um Documento HTML
Como jaacute foi citado anteriormente o HTML eacute na verdade apenas texto com
coacutedigos de formataccedilatildeo que especificam diferentes fontes e estilos Com a inserccedilatildeo
das tags o texto que estaacute compreendido entre essas marcas assume
caracteriacutesticas diferentes de acordo com cada uma delas
Cada tag informa ao browser como ele deveraacute formatar o texto que deve
estar dentro dos sinais de menor que (lt) e maior que (gt) Por exemplo ltHTMLgt
ltBODYgt
Os tags podem ser uacutenicos ou duplos com iniacutecio e fim Se forem duplos
existiraacute um tag informando que aquela formataccedilatildeo estaacute sendo encerrada Por
exemplo um tag simples pode ser representado por rdquoltbrgtrdquo que indica uma quebra
de linha Jaacute um tag duplo pode ser ltbgtltbgt indicando que o que estiver entre
esses campos deveraacute ser apresentado em negrito
A estrutura de um documento HTML apresenta os seguintes componentes
ltHTMLgt
ltHEADgtltTITLEgtTiacutetulo do DocumentoltTITLEgtltHEADgt
ltBODYgt
texto imagem links ltBODYgt
ltHTMLgt
Todo documento HTML deve estar entre os tags ltHTMLgt e ltHTMLgt A partir
daiacute esses documentos satildeo divididos em duas seccedilotildees principais a seccedilatildeo HEAD e a
seccedilatildeo BODY A HEAD conteacutem informaccedilotildees sobre o documento O tag ltTITLEgt por
exemplo define um tiacutetulo que eacute mostrado no alto da janela do browser Tudo que
estiver contido na seccedilatildeo ltBODYgt seraacute mostrado na janela principal do browser
12
Essa seccedilatildeo pode conter cabeccedilalhos paraacutegrafos listas tabelas links para outros
documentos e imagens
212 PHP - Personal Home Page
Como as paacuteginas em HTML satildeo basicamente apresentaccedilotildees de texto e
imagens com o passar do tempo surgiu a necessidade de uma interaccedilatildeo maior com
o usuaacuterio permitindo que se tivesse um histoacuterico desse usuaacuterio aleacutem da
possibilidade de se mostrar informaccedilotildees personalizadas aos mesmos Para esse
propoacutesito umas das linguagens que surgiram e que tinham forte ligaccedilatildeo com o
HTML foi o PHP
O PHP eacute uma linguagem de server-side (as paacuteginas ficam armazenadas e
satildeo executadas em um servidor onde o site estaacute localizado) e open-source (um
programa que tem seu coacutedigo fonte disponiacutevel para que qualquer pessoa que tenha
uma ideacuteia uma sugestatildeo possa ajudar no seu desenvolvimento) para criaccedilatildeo de
paacuteginas dinacircmicas para a Web Uma paacutegina dinacircmica eacute aquela que interage com o
usuaacuterio de forma que cada usuaacuterio ao visitar a paacutegina veraacute informaccedilotildees
personalizadas Os aplicativos dinacircmicos da Web satildeo predominantes nos sites
comerciais(e-commerce ndash sites de venda pela Internet) onde o conteuacutedo
apresentado eacute gerado a partir de informaccedilotildees acessadas de um banco de dados ou
outra fonte externa Sua interface permite que se incluam comandos PHP
diretamente na paacutegina HTML
O PHP sucede de um produto mais antigo chamado PHPFI PHPFI foi
criado por Rasmus Lerdorf em 1994 inicialmente como scripts (arquivos texto com
um conjunto de instruccedilotildees de uma linguagem especiacutefica nos quais estatildeo contidas
todas as instruccedilotildees que dizem o que o programa faraacute) usados para gerar estatiacutesticas
de acesso para seu curriacuteculo on line Ele nomeou esta seacuterie de scripts de ldquoPersonal
Home Page Toolsrdquo a qual adquiriu um relativo ecircxito devido a outras pessoas
pedirem a Rasmus que lhes permitisse utilizar os seus programas nas suas proacuteprias
paacuteginas Web Como mais funcionalidades foram requeridas Rasmus escreveu uma
implementaccedilatildeo em linguagem C muito maior que era capaz de comunicar-se com
uma base de dados e possibilitava a usuaacuterios o desenvolvimento simples de
aplicativos dinacircmicos para Web Devido agrave aceitaccedilatildeo do primeiro PHP e de maneira
adicional o seu criador desenhou um sistema para processar formulaacuterios ao qual
13
deu o nome de FI (Form Interpreter) e o conjunto destas duas ferramentas seria a
primeira versatildeo compacta da linguagem PHPFI Rasmus resolveu distribuir o
coacutedigo fonte do PHPFI para que todos pudessem ver e tambeacutem usaacute-lo bem como
corrigir bugs e melhorar o coacutedigo (HISTOacuteRIA 2004)
O PHPFI usava interpretaccedilotildees automaacuteticas de variaacuteveis vindas de formulaacuterio
(dados passados pelos usuaacuterios) e era embutida diretamente no coacutedigo do HTML
Poreacutem a sua sintaxe era limitada simples e um pouco inconsistente
Em 1997 PHPFI 20 a segunda versatildeo da implementaccedilatildeo em linguagem C
obteve milhares de usuaacuterios ao redor do mundo com um valor estimado de
aproximadamente 50000 domiacutenios respondendo por basicamente 1 dos domiacutenios
da Internet Enquanto isto havia milhares de pessoas contribuindo com pequenos
coacutedigos para o projeto e ainda assim o PHPFI 20 foi oficialmente lanccedilado somente
ao final de 1997 apoacutes perder a maior parte de sua vida em versotildees beta (versotildees de
um produto que satildeo distribuiacutedas para teste dos usuaacuterios antes do lanccedilamento
oficial) O PHPFI 20 foi rapidamente substituiacutedo pelas versotildees iniciais do PHP 30
(HISTOacuteRIA 2004)
O PHP 30 foi a primeira versatildeo que se assemelha ao PHP que eacute utilizado
atualmente Ela foi criada por Andi Gutmans e Zeev Suraski em 1997 e foi
totalmente reescrito apoacutes eles descobrirem que o PHPFI 20 poderia ajudaacute-los a
desenvolver suas proacuteprias aplicaccedilotildees de e-Commerce de um projeto na sua
Universidade No esforccedilo cooperativo e iniciativa de reescrever o PHPFI a partir da
base existente Andi Rasmus e Zeev decidiram unir esforccedilos e anunciar o PHP 30
como uma versatildeo oficial de seu antecessor (o PHPFI 20) (HISTOacuteRIA 2004)
O PHP 30 aleacutem de oferecer aos usuaacuterios finais uma infraestrutura soacutelida
para diversos bancos de dados protocolos e APIs a extensibilidade (possibilidade
de uso para diversos objetivos) do PHP 30 atrai dezenas de novos desenvolvedores
para se juntar e submeter novos moacutedulos Esta eacute a chave do sucesso do PHP 30
Outras caracteriacutesticas chaves introduzidas no PHP 30 foram o suporte agrave sintaxe
para orientaccedilatildeo a objetos e uma sintaxe muito mais poderosa e consistente
O PHP 30 foi oficialmente lanccedilado em Junho de 1998 depois de ter passado
aproximadamente 9 meses em testes puacuteblicos (versotildees beta) Os objetivos do
projeto eram melhorar a performance de aplicaccedilotildees complexas e melhorar a
modularidade do coacutedigo base do PHP
14
O PHP 40 acompanhado com uma seacuterie de novas caracteriacutesticas foi
oficialmente lanccedilada no iniacutecio de 2000 quase dois anos apoacutes o seu antecessor
Aleacutem da melhora na performance esta versatildeo incluiu outras caracteriacutesticas chave
como o suporte para muitos servidores Web sessotildees HTTP buffer de saiacuteda e
maneiras mais seguras de manipular entrada de dados dos usuaacuterios (HISTOacuteRIA
2004)
De acordo com o site oficial do PHP (phpnetusagephp) atualmente
aproximadamente 17 milhotildees de domiacutenios estatildeo usando PHP na Web
2121 PHP - Por que utilizar
A popularidade do PHP continua crescendo rapidamente devido a muitas
vantagens Eacute raacutepido pois devido a estar embutido no coacutedigo HTML o tempo para
processar e carregar uma paacutegina Web eacute curto Eacute graacutetis e faacutecil de usar pois os
coacutedigos PHP satildeo facilmente incluiacutedos no arquivo HTML eacute versaacutetil pois o PHP roda
em uma grande variedade de sistemas operacionais eacute muito seguro pois se o
coacutedigo for escrito corretamente o usuaacuterio natildeo iraacute enxergar o coacutedigo PHP aleacutem de
ser customizaacutevel pois a licenccedila open-source permite aos programadores
modificarem o PHP adicionando ou modificando as caracteriacutesticas necessaacuterias ao
seu proacuteprio desenvolvimento
Devido ao PHP ser executado no servidor ele pode dinamicamente criar o
coacutedigo HTML que iraacute gerar a paacutegina Web permitindo que os usuaacuterios individuais
vejam paacuteginas customizadas Os visitantes da paacutegina Web vecircem a saiacuteda gerada
pelos scripts mas natildeo os scripts propriamente ditos tornando-o muito seguro
O PHP consegue trabalhar com ldquosessotildeesrdquo ou seja para executar
determinadas accedilotildees (fazer um download por exemplo) o usuaacuterio deve estar
identificado no site O PHP permite que se crie uma ldquosessatildeordquo que identifica cada
usuaacuterio no sistema aleacutem de outros dados referentes ao mesmo Se o usuaacuterio tentar
entrar em uma paacutegina especiacutefica primeiramente eacute verificado se existe uma sessatildeo
para o mesmo Se natildeo existir eacute mostrada uma mensagem de acesso proibido Se a
sessatildeo for vaacutelida os outros paracircmetros do usuaacuterio (salvos na sessatildeo) podem ser
verificados e validados caso necessaacuterio
2122 PHP - Como Funciona
15
Segundo Janet Valade (VALADE2004) O coacutedigo PHP eacute embutido no coacutedigo
HTML As tags do HTML satildeo usadas para incluir a linguagem PHP na linguagem
HTML Quando o PHP estaacute instalado o servidor Web eacute configurado para procurar
por coacutedigo PHP embutido em arquivos com extensotildees especiacuteficas (php ou phtml)
Quando o servidor recebe uma requisiccedilatildeo para um arquivo com uma dessas
extensotildees ele envia o coacutedigo HTML como estaacute mas o coacutedigo PHP eacute processado
pelo software antes de ser enviado ao solicitante Quando a linguagem PHP eacute
processada a saiacuteda consiste de coacutedigo HTML Os coacutedigos PHP natildeo satildeo incluiacutedos
no HTML enviado ao browser por isso o coacutedigo PHP eacute seguro e transparente para o
usuaacuterio Quando um browser eacute apontado para um arquivo HTML o servidor envia o
arquivo ao browser O browser processa o arquivo e mostra a paacutegina descrita pelos
tags HTML do arquivo Quando um Web browser eacute apontado para um arquivo PHP
o servidor procura por seccedilotildees PHP no arquivo e os processa enviando o resultado
do processamento ao browser Esses satildeo os passos seguidos pelo servidor para
processar um arquivo PHP
1 O servidor inicia a procura no arquivo em modo HTML Ele assume que o
coacutedigo eacute HTML e os envia ao browser sem nenhum processamento
2 O servidor web continua em modo HTML ateacute encontrar um tag de abertura do
PHP (lt)
3 Quando o servidor encontra um tag de abertura do PHP alterna para modo
PHP assume que todos os comandos subsequumlentes satildeo desse tipo e os
executa Se o comando gera uma saiacuteda a envia ao browser
4 O servidor continua em modo PHP ateacute encontrar um tag de fechamento do
PHP (gt)
5 Quando o servidor encontra um tag de fechamento do PHP retorna ao modo
HTML e repete o ciclo
2123 Forma Baacutesica de um Documento PHP
O PHP eacute embutido diretamente no programa HTML Seus comandos satildeo
delimitados pelos tags lt e gt Dentro dos tags de abertura e fechamento do PHP
satildeo incluiacutedos comandos especiacuteficos que satildeo interpretados pela linguagem A sintaxe
eacute bastante parecida com a da linguagem C Por exemplo
ltHTMLgt
16
ltHEADgtltTITLEgtTeste PHPltTITLEgtltHEADgt
ltBODYgt
ltpgt Linha HTML
lt
$id = $_GET[id]
if ($id = 1)
echo ldquoltpgtUsuaacuterio Nordm 1ltpgtrdquo
else
echo ldquoltpgt Usuaacuterio Nordm 2ltpgtrdquo
gt
ltBODYgt
ltHTMLgt
213 Javascript
Javascript eacute uma linguagem criada pela Netscape que serve basicamente
para aumentar os recursos do navegador
Todas as paacuteginas escritas com HTML satildeo estaacuteticas Conseguem fazer com
que o browser apenas leia o que haacute no coacutedigo e reproduza aquele conjunto de
instruccedilotildees Um dos principais recursos do Javascript eacute a possibilidade de fazer com
que a paacutegina HTML seja dinacircmica ou seja capaz de fazer com que o usuaacuterio possa
interagir com a paacutegina ou usar outros recursos para fazer com que o documento
Web se altere sem necessidade de um novo carregamento de paacutegina
O Javascript eacute uma linguagem de programaccedilatildeo que funciona interativamente
com o coacutedigo HTML O Javascript consegue ler entender e manipular os objetos de
uma paacutegina HTML tendo a facilidade necessaacuteria para alteraacute-los automaticamente
quando programado Satildeo inseridos nas paacuteginas de uma maneira peculiar podendo
ter apenas uma aacuterea para scripts ou espalhados pelo coacutedigo do jeito que melhor se
adapte agraves necessidades de cada usuaacuterio Diferentemente da linguagem PHP o
Javascript eacute uma linguagem client-side (as paacuteginas satildeo armazenadas e executadas
na maacutequina cliente) (LOURENCcedilO 2000)
17
22 Programas
221 Fireworks
O Fireworks eacute uma ferramenta de produccedilatildeo graacutefica para criaccedilatildeo de interfaces
e imagens Web com interaccedilatildeo em vaacuterias linguagens scripts (como php cfml html
xml Xhtml) podendo montar sites atraveacutes de desenhos O Fireworks consegue
combinar muito bem recursos vetoriais (como o ajuste de textos recursos praacuteticos
de desenho e ediccedilatildeo de noacutes) com os recursos aplicados a bitmaps ou imagens
(como o tratamento de cores e ferramentas de efeitos)
Tambeacutem permite trabalhar com layouts de sites sendo que pode-se
transformar o layout em uma paacutegina HTML usando o recurso de slices (fatias) O
programa permite que vocecirc divida o layout inteiro em vaacuterias imagens de acordo com
as aacutereas especiacuteficas que se deseja criar Apoacutes essa divisatildeo cada uma dessas aacutereas
eacute exportada com um formato de arquivo e com uma compactaccedilatildeo especiacutefica
podendo gerar o HTML com as imagens (ou fatias) nos seus devidos lugares e
posiccedilotildees ou mesmo exporta-las para o Dreamweaver Sua outra vantagem eacute a
possibilidade de se trabalhar com os behaviors (comportamentos) Com os
bahaviors pode-se criar rollovers (menus interativos) e menus pop ups (menus que
abrem outros sub-menus de acordo com cada item) estilizados
Como o Fireworks foi inicialmente projetado para a Web permite tambeacutem a
exportaccedilatildeo de imagens para a rede Esses recursos incluem a total otimizaccedilatildeo de
cada formato de arquivo a ser exportado bem como GIFS e JPEGS Aleacutem disso
pode-se fazer uma comparaccedilatildeo visual e do tamanho do arquivo simultaneamente
de ateacute 4 formatos ou configuraccedilotildees de exportaccedilotildees e tambeacutem salvar as mesmas
configuraccedilotildees para usar mais tarde em outros arquivos (CARACTERIacuteSTICAS
2004)
222 Dreamweaver
O Dreamweaver eacute um editor profissional de HTML utilizado para projetar
codificar e desenvolver sites paacuteginas e aplicaccedilotildees Web Permite que se trabalhe as
paacuteginas HTML de forma manual ou em um ambiente de ediccedilatildeo visual fornecendo
ferramentas uacuteteis para esses fins O Dreamweaver tambeacutem permite que se construa
aplicaccedilotildees Web dinacircmicas usando linguagens que rodam nos servidores (PHP
nesse caso) (PAGE 2004) Algumas das facilidades do Dreamweaver satildeo
18
bull Administraccedilatildeo remota do site e arquivos fonte localmente
bull Operaccedilatildeo em CSS (Cascade Style Sheets)
bull Geraccedilatildeo automatizada de rotinas em Javascript
bull Formulaacuterios
bull Criaccedilatildeo e uso de templates (modelos)
bull Gerenciamento completo do site e seus componentes (por exemplo se um
arquivo de imagem for movido de um sub-diretoacuterio para outro todo o site eacute
reparado automaticamente)
bull Apresentaccedilatildeo do mapa do site com diferentes niacuteveis de detalhamento
bull Behaviors (comportamentos que depois podem ser reaproveitados) com
rotinas de JavaScript
bull Manipulaccedilatildeo de tabelas
bull Rollover de imagens
bull Administraccedilatildeo do site a partir da barra de menu
bull Reparo automaacutetico do site a partir da mudanccedila de endereccedilo ou nome de
uma miacutedia ou link em geral
23 Banco de Dados
231 MySQL
O MySQL eacute um SGDB (ou sistema gerenciador de banco de dados) que eacute
desenvolvido e distribuiacutedo pela MySQL AB a empresa fundada pelos suecos David
Axmark Allan Larsson e Michael Widenius Ele derivou de outro banco de dados o
mSQL Pelo fato do mesmo natildeo ser raacutepido nem flexiacutevel o suficiente para as suas
necessidades os suecos resolveram criar um novo banco de dados utilizando a
interface API (application programming interface - conjunto de rotinas padronizadas
que a aplicaccedilatildeo utiliza para efetuar seus serviccedilos) do proacuteprio mSQL utilizada para
facilitar a portabilidade de coacutedigos escritos do mSQL para o MySQL
Escrito em C e C++ e testado em vaacuterias plataformas diferentes o MySQL
possui um sistema de alocaccedilatildeo de memoacuteria baseado em processos que permite a
execuccedilatildeo de tarefas paralelas tornando-o extremamente raacutepido e eficiente Ele eacute um
banco de dados do tipo SQL (Structured Query Language) e por isso possui as
caracteriacutesticas dos principais bancos de dados do tipo SQL como operadores e
funccedilotildees agrupamentos joins (junccedilotildees de tabelas) aceita vaacuterios tipos de campos
19
suportando registros de tamanhos fixos ou variaacuteveis controla a seguranccedila dos
dados aleacutem de poder armazenar uma grande quantidade de dados chegando a
quantidades superiores a 50000000 de registros Aleacutem disso o MySQL eacute multi-
usuaacuterio (programas de mais de um usuaacuterio podem estar em execuccedilatildeo) eacute multi-
tarefa (eacute capaz de executar vaacuterios programas simultaneamente mesmo que a
maacutequina possua somente um processador) e open-source
Esse servidor de banco de dados eacute considerado como o mais raacutepido entre os
de sua categoria tanto para grandes volumes de dados como pequenos Poreacutem
como ele foi criado para ser extremamente aacutegil teve-se de descartar certos aspectos
das especificaccedilotildees SQL e foi decidido natildeo se implementar caracteriacutesticas que geram
muita demanda de recursos como os triggers que satildeo uma porccedilatildeo de coacutedigo
armazenado que se executa quando eacute realizada uma operaccedilatildeo (atualizaccedilatildeo
inclusatildeo etc) com o banco de dados Naturalmente comprovar a proacutepria existecircncia
do trigger e executaacute-lo consome recursos e tempo
As principais vantagens do MySQL satildeo a baixa demanda de recursos de
hardware a simplicidade de administraccedilatildeo e a otimizaccedilatildeo para as aplicaccedilotildees tiacutepicas
da web onde ocorrem mais consultas do que atualizaccedilotildees (MySQL 2004)
20
3 DESIGN DO SITE
Atraveacutes de um briefing (anexo 1) pode-se chegar a algumas conclusotildees que
influenciaram na escolha da forma de apresentaccedilatildeo das paacuteginas e levaram a
definiccedilatildeo de quais cores imagens e forma o site seria apresentado aos usuaacuterios
31 DEFINICcedilAtildeO DAS CORES
311 A Teoria das Cores
O que se convencionou chamar de Teoria das Cores de Leonardo da Vinci
satildeo as formulaccedilotildees histoacutericas esparsas contidas em seus escritos e reunidas no livro
Tratado da Pintura e da Paisagem ndash Sombra e Luz que satildeo anotaccedilotildees recolhidas
pelo artista ao longo de anos de observaccedilatildeo e eacute a teoria mais corrente sendo um
dos legados do renascimento para as artes visuais (TEORIA 2004)
312 O Disco Cromaacutetico
O disco cromaacutetico natildeo eacute um instrumento cientiacutefico de classificaccedilatildeo de cores
mas eacute muito uacutetil no entendimento da teoria das cores As cores se dividem em
primaacuterias secundaacuterias e terciaacuterias (TEORIA 2004)
Pode-se reproduzir qualquer sensaccedilatildeo de cor misturando-se aditivamente
diversas quantidades de vermelho azul e verde Por isso conhecem-se essas cores
como cores primaacuterias (ENCARTA 2000) Combinado-se duas cores primaacuterias
obtemos as cores secundaacuterias resultando no laranja (amarelo com vermelho) verde
(azul com amarelo) e violeta (vermelho com azul) As cores terciaacuterias satildeo obtidas
pela mistura de uma primaacuteria com uma ou mais secundaacuterias (TEORIA 2004)
21
A figura 1 apresenta a representaccedilatildeo graacutefica do disco cromaacutetico
FIGURA 1 ndash DISCO CROMAacuteTICO
313 Cores Anaacutelogas
Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores anaacutelogas satildeo as
cores dispostas lado a lado no disco cromaacutetico Satildeo anaacutelogas porque haacute nelas uma
mesma cor baacutesica e satildeo usadas para dar a sensaccedilatildeo de uniformidade Observando
a figura 1 visualiza-se que a cor anaacuteloga do amarelo eacute o laranja por exemplo
314 Cores Complementares Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores complementares
satildeo aquelas que encontram-se sempre em posiccedilotildees opostas no disco cromaacutetico As
cores complementares satildeo usadas para dar forccedila e equiliacutebrio a um trabalho criando
contrastes Observando a figura 1 visualiza-se que a cor complementar do
vermelho eacute o verde e do laranja eacute o azul por exemplo
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
4
LISTA DE FIGURAS FIGURA 1 - DISCO CROMAacuteTICO 21 FIGURA 2 - REPRESENTACcedilAtildeO DOS FRAMES 25 FIGURA 3 - HOME 27 FIGURA 4 - CADASTRO DE PESQUISAS 28 FIGURA 5 - ALTERACcedilAtildeO DE PESQUISAS 29 FIGURA 6 - CADASTRO DE ARTIGOS 30 FIGURA 7 - ALTERACcedilAtildeO ARTIGOS 31 FIGURA 8 - CADASTRO DE NOTIacuteCIAS 32 FIGURA 9 - ALTERACcedilAtildeO DE NOTIacuteCIAS 33 FIGURA 10 - OBJETIVOS 34 FIGURA 11 - ESTATUTO 35 FIGURA 12 - PARTICIPANTES 36 FIGURA 13 - COLABORADORES 37 FIGURA 14 - VISUALIZAR PESQUISAS 38 FIGURA 15 - DETALHE DA PESQUISA 38 FIGURA 16 - VISUALIZAR ARTIGO 39 FIGURA 17 - DETALHE DO ARTIGO 39 FIGURA 18 - VISUALIZAR NOTIacuteCIA 40 FIGURA 19 - DETALHE DA NOTIacuteCIA 40 FIGURA 20 - MURAL 41 FIGURA 21 - EXCLUSAtildeO DO MURAL 42 FIGURA 22 - ADMINISTRACcedilAtildeO 43 FIGURA 23 - CADASTRO DE USUAacuteRIOS 44 FIGURA 24 - PESQUISA USUAacuteRIOS 45 FIGURA 25 - ALTERACcedilAtildeO DE USUAacuteRIOS 46
5
Resumo O presente trabalho aborda a anaacutelise e o desenvolvimento de um site
dinacircmico na Internet tendo como contratante o Gerds (grupo de estudos
interdisciplinar em redes de computadores e sistemas distribuiacutedos) da Universidade
Tuiuti do Paranaacute que tem por objetivo divulgar as pesquisas realizadas por alunos
professores e colaboradores participantes do grupo em questatildeo Este foi elaborado
a partir de teacutecnicas de desenvolvimento de sites e entrevistas feitas diretamente com
o contratante
Palavras-chave Desenvolvimento de site site dinacircmico PHP MySQL HTML
6
1 INTRODUCcedilAtildeO
Estima-se que hoje existam mais de 250 milhotildees de pessoas que utilizam a
Internet natildeo soacute como ferramenta de trabalho mas tambeacutem como diversatildeo e
pesquisa Essas pessoas esperam obter da plataforma Web um material de alta
qualidade (incluindo imagens animaccedilatildeo som e viacutedeo) e que esse material esteja
apresentado de forma agradaacutevel e funcionando de forma raacutepida e eficiente A
especializaccedilatildeo em Desenvolvimento Web ofereceu a preparaccedilatildeo para o trabalho no
desenvolvimento conhecimento e utilizaccedilatildeo das tecnologias multimiacutedia e Internet e
dos sistemas e aplicaccedilotildees que fazem uso dessas tecnologias
O desenvolvimento do site do Gerds (grupo de estudos interdisciplinar em
redes de computadores e sistemas distribuiacutedos) da UTP tem por objetivo divulgar o
trabalho realizado por alunos professores colaboradores e participantes dos cursos
de Engenharia da Computaccedilatildeo Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia
da Computaccedilatildeo e os cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes
de Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
universidade e a comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados
ou por transferecircncia de tecnologias inserindo professores e alunos num contexto
soacutecio-econocircmico mais amplo do que a realidade acadecircmica Essas informaccedilotildees satildeo
oferecidas pelo site atraveacutes de pesquisas artigos e notiacutecias periodicamente
atualizadas aleacutem de permitir que se desenvolva uma comunicaccedilatildeo bilateral entre os
interessados atraveacutes do cadastramento dessas pessoas no site bem como a
possibilidade de se deixar mensagens em um mural destinado a esse fim Sendo o contratante do serviccedilo o Gerds ficou definido como pessoa
responsaacutevel pela definiccedilatildeo das necessidades do site o professor Roberto Amaral
Atraveacutes de teacutecnicas de levantamento de dados (ver anexo I) foram obtidos os dados
baacutesicos necessaacuterios para o desenvolvimento do site A presente monografia estaacute estruturada em 5 capiacutetulos cujo conteuacutedo eacute
apresentado sucintamente a seguir
O Capiacutetulo 2 apresenta uma introduccedilatildeo aos conceitos das tecnologias
utilizadas enfocando sua histoacuteria e utilizaccedilatildeo na atual estrutura da Internet
O Capiacutetulo 3 apresenta a descriccedilatildeo de como foi realizado o design do site e a
funcionalidade das paacuteginas
O Capiacutetulo 4 apresenta a referecircncia ao coacutedigo fonte do trabalho
7
O Capiacutetulo 5 apresenta a conclusatildeo do trabalho
8
2 TECNOLOGIAS UTILIZADAS
De acordo com os estudados realizados as seguintes tecnologias foram
utilizadas para o desenvolvimento do site do Gerds
bull Linguagem o HTML ndash Utilizada para fazer o corpo principal das paacuteginas Adotado
por ser gratuito e amplamente utilizado na Internet
o PHP ndash Apesar do conteuacutedo apresentado nas aulas ter sido baseado
em ASP um novo estudo em linguagem PHP foi realizado em
classe e extra classe pois foi utilizado um servidor com sistema
operacional Linux com o servidor de banco de dados Apache que
interpreta somente a linguagem PHP Foi utilizado para tornar as
paacuteginas dinacircmicas e realizar a comunicaccedilatildeo com o banco de
dados
o JavaScript ndash Utilizado para criar funccedilotildees que satildeo executadas na
maacutequina do usuaacuterio Adotado por ser gratuito e amplamente
utilizado na Internet
bull Programas o Fireworks ndash Utilizado para fazer as imagens e construir a parte
visual do site Foi adotado por ser uma ferramenta que permite
trabalhar com layouts de sites de forma raacutepida e faacutecil e ter ampla
compatibilidade com o Dreamweaver
o Dreamweaver ndash Utilizado para a construccedilatildeo do site e a
programaccedilatildeo Adotado por ser uma ferramenta completa e que
permite desenvolver e administrar o site de forma raacutepida e eficiente
bull Banco de Dados o MySQL ndash Utilizado para armazenar os dados do site Adotado por
ser gratuito e amplamente utilizado em aplicaccedilotildees Web
21 Linguagem
211 HTML - HyperText Markup Language
No nuacutecleo de toda paacutegina da Web encontra-se a HyperText Markup
Language uma linguagem de diagramaccedilatildeo baseada em marcadores ou tags
9
(marcas utilizadas pela linguagem html que permitem ao browser formatar o texto
entre as tags de acordo com cada tag especiacutefica) como eacute mais comumente
conhecido A HTML eacute uma linguagem simples baseada em texto e que pode ser
visualizada em qualquer plataforma tanto em navegadores somente texto (como o
Lynx) como em navegadores mais avanccedilados (como Netscape Navigator e Internet
Explorer)
A HTML eacute na verdade apenas texto com coacutedigos de formataccedilatildeo que
especificam diferentes fontes e estilos ou ateacute mesmo outras funccedilotildees mais
avanccediladas Ela eacute muito semelhante aos antigos editores de texto que exigiam a
inserccedilatildeo de tags para especificar tipos em itaacutelico negrito ou sublinhado
O HTML nasceu em 1990 no CERN (European Council for Nuclear Research)
na Suiacuteccedila Seu criador o inglecircs Tim Berners-Lee a concebeu unicamente como uma
linguagem que serviria para interligar computadores do laboratoacuterio e outras
instituiccedilotildees de pesquisa e exibir documentos cientiacuteficos de forma simples e faacutecil de
acessar (STANEK 1996)
Em 1992 com a liberaccedilatildeo da biblioteca de desenvolvimento para WWW
(World Wide Web ou Rede de Alcance Mundial) aconteceu uma grande evoluccedilatildeo o
que foi fundamental para expansatildeo do HTML Essa biblioteca deu origem agrave
construccedilatildeo de vaacuterios browsers e servidores tornando a Web uma ferramenta viaacutevel
O MOSAIC desenvolvido por Marc Andreeson entatildeo do NCSA foi o primeiro
browser multi-plataforma que explorava completamente a capacidade de hipermiacutedia
da Web e que iniciou o crescimento explosivo da mesma Em 1993 o HTML tornou-
se disponiacutevel a milhotildees de usuaacuterios com a liberaccedilatildeo das versotildees para Mac e
Windows (STANEK 1996)
Quanto as suas especificaccedilotildees o HTML percorreu um caminho longo ateacute
chegar agrave sua atual especificaccedilatildeo Atualmente 4 especificaccedilotildees do HTML estatildeo
definidas Cada nova especificaccedilatildeo eacute compatiacutevel com as especificaccedilotildees anteriores e
incluem diversas melhorias A primeira especificaccedilatildeo do HTML que eacute a versatildeo
original foi a HTML 10 Tim Berners-Lee juntamente com David Ragget a
publicaram em 1993 Devido a sua capacidade limitada a versatildeo 10 permitia o
desenvolvimento de documentos baacutesicos Incluiacutea muacuteltiplos niacuteveis de cabeccedilalhos
exibiccedilatildeo de paraacutegrafos navegaccedilatildeo por referecircncias a hipertextos (composiccedilatildeo de
elementos de informaccedilatildeo paraacutegrafos paacuteginas imagens sequumlecircncias musicais etc e
10
ligaccedilotildees entre esses elementos indicando a passagem de um a outro) e
formataccedilotildees especiais para itens de uma lista (STANEK 1996)
A definiccedilatildeo do HTML 20 concluiacuteda em 1995 foi a primeira versatildeo
recomendada pelo IETF ndash Internet Engineering Task Force e se tornou um padratildeo
da Internet Ela oferece um melhor controle sobre os layouts dos textos
apresentados nas paacuteginas aleacutem da inclusatildeo de imagens e formulaacuterios que permite
aos desenvolvedores conseguir a participaccedilatildeo dos usuaacuterios de forma faacutecil e raacutepida
aleacutem de explorar as capacidades multimiacutedias da Web (STANEK 1996)
O HTML 30 de 1996 permite novos formatos de textos Uma de suas
caracteriacutesticas mais importantes eacute a definiccedilatildeo dos tags necessaacuterios para a criaccedilatildeo
de tabelas que permitem que os desenvolvedores apresentem as informaccedilotildees
desejadas formatadas em linhas e colunas (STANEK 1996) Durante o
desenvolvimento do HTML 30 com a rapidez da expansatildeo da Web os esforccedilos de
padronizaccedilatildeo natildeo puderam acompanhar as tendecircncias de desenvolvimento que
exigiam maiores recursos de apresentaccedilatildeo graacutefica do que o HTML 20 podia
fornecer Por isso o HTML 30 acabou natildeo sendo aprovado e em 1997 aprovou-se
uma recomendaccedilatildeo chamada HTML 32 que introduzia recursos de apresentaccedilatildeo
graacutefica no HTML (INTRODUCING 2004)
O HTML 40 de 1998 eacute uma extensatildeo do HTML 32 Essa versatildeo oferece
melhorias nos recursos de acessibilidade Quando o HTML eacute usado de forma
estruturada um documento pode se adaptar a diferentes browsers acomodar
diferentes fontes cores especiais sintetizadores de voz e dispositivos Braille Essa
adaptabilidade permite a pessoas com defeitos fiacutesicos trabalhar de forma facilitada
na Web Essa versatildeo adotou tambeacutem o Universal Character Set que usa o suporte
a convenccedilotildees internacionais permitindo a utilizaccedilatildeo de quase todas as linguagens
do mundo Outra novidade satildeo os frames (dividem a paacutegina em duas ou mais partes
ndash framesets - e satildeo geralmente usados para que um frameset permaneccedila enquanto
outros mudem baseados nos links que o usuaacuterio seleciona) Vaacuterios elementos do
HTML 32 foram considerados deprecados (candidatos a se tornarem obsoletos)
pelo HTML 40 forccedilando uma ecircnfase na separaccedilatildeo da estrutura do documento e na
apresentaccedilatildeo dos elementos que permitem definir cores fontes alinhamento
imagens de fundo e outras caracteriacutesticas da apresentaccedilatildeo da paacutegina que
dependem da plataforma onde a informaccedilatildeo eacute visualizada Essa separaccedilatildeo pocircde ser
realizada graccedilas a CSS (Cascading Style Sheets) que permite a criaccedilatildeo de folhas
11
de estilo aplicaacuteveis a vaacuterias paacuteginas de um site Se um dispositivo limitado natildeo
consegue exibir os estilos definidos no CSS ele pelo menos consegue entender a
estrutura do texto e imagens de forma que mesmo usuaacuterios com menos recursos
podem ter acesso agrave informaccedilatildeo contida na paacutegina (HTML 2004)
2111 Forma Baacutesica de um Documento HTML
Como jaacute foi citado anteriormente o HTML eacute na verdade apenas texto com
coacutedigos de formataccedilatildeo que especificam diferentes fontes e estilos Com a inserccedilatildeo
das tags o texto que estaacute compreendido entre essas marcas assume
caracteriacutesticas diferentes de acordo com cada uma delas
Cada tag informa ao browser como ele deveraacute formatar o texto que deve
estar dentro dos sinais de menor que (lt) e maior que (gt) Por exemplo ltHTMLgt
ltBODYgt
Os tags podem ser uacutenicos ou duplos com iniacutecio e fim Se forem duplos
existiraacute um tag informando que aquela formataccedilatildeo estaacute sendo encerrada Por
exemplo um tag simples pode ser representado por rdquoltbrgtrdquo que indica uma quebra
de linha Jaacute um tag duplo pode ser ltbgtltbgt indicando que o que estiver entre
esses campos deveraacute ser apresentado em negrito
A estrutura de um documento HTML apresenta os seguintes componentes
ltHTMLgt
ltHEADgtltTITLEgtTiacutetulo do DocumentoltTITLEgtltHEADgt
ltBODYgt
texto imagem links ltBODYgt
ltHTMLgt
Todo documento HTML deve estar entre os tags ltHTMLgt e ltHTMLgt A partir
daiacute esses documentos satildeo divididos em duas seccedilotildees principais a seccedilatildeo HEAD e a
seccedilatildeo BODY A HEAD conteacutem informaccedilotildees sobre o documento O tag ltTITLEgt por
exemplo define um tiacutetulo que eacute mostrado no alto da janela do browser Tudo que
estiver contido na seccedilatildeo ltBODYgt seraacute mostrado na janela principal do browser
12
Essa seccedilatildeo pode conter cabeccedilalhos paraacutegrafos listas tabelas links para outros
documentos e imagens
212 PHP - Personal Home Page
Como as paacuteginas em HTML satildeo basicamente apresentaccedilotildees de texto e
imagens com o passar do tempo surgiu a necessidade de uma interaccedilatildeo maior com
o usuaacuterio permitindo que se tivesse um histoacuterico desse usuaacuterio aleacutem da
possibilidade de se mostrar informaccedilotildees personalizadas aos mesmos Para esse
propoacutesito umas das linguagens que surgiram e que tinham forte ligaccedilatildeo com o
HTML foi o PHP
O PHP eacute uma linguagem de server-side (as paacuteginas ficam armazenadas e
satildeo executadas em um servidor onde o site estaacute localizado) e open-source (um
programa que tem seu coacutedigo fonte disponiacutevel para que qualquer pessoa que tenha
uma ideacuteia uma sugestatildeo possa ajudar no seu desenvolvimento) para criaccedilatildeo de
paacuteginas dinacircmicas para a Web Uma paacutegina dinacircmica eacute aquela que interage com o
usuaacuterio de forma que cada usuaacuterio ao visitar a paacutegina veraacute informaccedilotildees
personalizadas Os aplicativos dinacircmicos da Web satildeo predominantes nos sites
comerciais(e-commerce ndash sites de venda pela Internet) onde o conteuacutedo
apresentado eacute gerado a partir de informaccedilotildees acessadas de um banco de dados ou
outra fonte externa Sua interface permite que se incluam comandos PHP
diretamente na paacutegina HTML
O PHP sucede de um produto mais antigo chamado PHPFI PHPFI foi
criado por Rasmus Lerdorf em 1994 inicialmente como scripts (arquivos texto com
um conjunto de instruccedilotildees de uma linguagem especiacutefica nos quais estatildeo contidas
todas as instruccedilotildees que dizem o que o programa faraacute) usados para gerar estatiacutesticas
de acesso para seu curriacuteculo on line Ele nomeou esta seacuterie de scripts de ldquoPersonal
Home Page Toolsrdquo a qual adquiriu um relativo ecircxito devido a outras pessoas
pedirem a Rasmus que lhes permitisse utilizar os seus programas nas suas proacuteprias
paacuteginas Web Como mais funcionalidades foram requeridas Rasmus escreveu uma
implementaccedilatildeo em linguagem C muito maior que era capaz de comunicar-se com
uma base de dados e possibilitava a usuaacuterios o desenvolvimento simples de
aplicativos dinacircmicos para Web Devido agrave aceitaccedilatildeo do primeiro PHP e de maneira
adicional o seu criador desenhou um sistema para processar formulaacuterios ao qual
13
deu o nome de FI (Form Interpreter) e o conjunto destas duas ferramentas seria a
primeira versatildeo compacta da linguagem PHPFI Rasmus resolveu distribuir o
coacutedigo fonte do PHPFI para que todos pudessem ver e tambeacutem usaacute-lo bem como
corrigir bugs e melhorar o coacutedigo (HISTOacuteRIA 2004)
O PHPFI usava interpretaccedilotildees automaacuteticas de variaacuteveis vindas de formulaacuterio
(dados passados pelos usuaacuterios) e era embutida diretamente no coacutedigo do HTML
Poreacutem a sua sintaxe era limitada simples e um pouco inconsistente
Em 1997 PHPFI 20 a segunda versatildeo da implementaccedilatildeo em linguagem C
obteve milhares de usuaacuterios ao redor do mundo com um valor estimado de
aproximadamente 50000 domiacutenios respondendo por basicamente 1 dos domiacutenios
da Internet Enquanto isto havia milhares de pessoas contribuindo com pequenos
coacutedigos para o projeto e ainda assim o PHPFI 20 foi oficialmente lanccedilado somente
ao final de 1997 apoacutes perder a maior parte de sua vida em versotildees beta (versotildees de
um produto que satildeo distribuiacutedas para teste dos usuaacuterios antes do lanccedilamento
oficial) O PHPFI 20 foi rapidamente substituiacutedo pelas versotildees iniciais do PHP 30
(HISTOacuteRIA 2004)
O PHP 30 foi a primeira versatildeo que se assemelha ao PHP que eacute utilizado
atualmente Ela foi criada por Andi Gutmans e Zeev Suraski em 1997 e foi
totalmente reescrito apoacutes eles descobrirem que o PHPFI 20 poderia ajudaacute-los a
desenvolver suas proacuteprias aplicaccedilotildees de e-Commerce de um projeto na sua
Universidade No esforccedilo cooperativo e iniciativa de reescrever o PHPFI a partir da
base existente Andi Rasmus e Zeev decidiram unir esforccedilos e anunciar o PHP 30
como uma versatildeo oficial de seu antecessor (o PHPFI 20) (HISTOacuteRIA 2004)
O PHP 30 aleacutem de oferecer aos usuaacuterios finais uma infraestrutura soacutelida
para diversos bancos de dados protocolos e APIs a extensibilidade (possibilidade
de uso para diversos objetivos) do PHP 30 atrai dezenas de novos desenvolvedores
para se juntar e submeter novos moacutedulos Esta eacute a chave do sucesso do PHP 30
Outras caracteriacutesticas chaves introduzidas no PHP 30 foram o suporte agrave sintaxe
para orientaccedilatildeo a objetos e uma sintaxe muito mais poderosa e consistente
O PHP 30 foi oficialmente lanccedilado em Junho de 1998 depois de ter passado
aproximadamente 9 meses em testes puacuteblicos (versotildees beta) Os objetivos do
projeto eram melhorar a performance de aplicaccedilotildees complexas e melhorar a
modularidade do coacutedigo base do PHP
14
O PHP 40 acompanhado com uma seacuterie de novas caracteriacutesticas foi
oficialmente lanccedilada no iniacutecio de 2000 quase dois anos apoacutes o seu antecessor
Aleacutem da melhora na performance esta versatildeo incluiu outras caracteriacutesticas chave
como o suporte para muitos servidores Web sessotildees HTTP buffer de saiacuteda e
maneiras mais seguras de manipular entrada de dados dos usuaacuterios (HISTOacuteRIA
2004)
De acordo com o site oficial do PHP (phpnetusagephp) atualmente
aproximadamente 17 milhotildees de domiacutenios estatildeo usando PHP na Web
2121 PHP - Por que utilizar
A popularidade do PHP continua crescendo rapidamente devido a muitas
vantagens Eacute raacutepido pois devido a estar embutido no coacutedigo HTML o tempo para
processar e carregar uma paacutegina Web eacute curto Eacute graacutetis e faacutecil de usar pois os
coacutedigos PHP satildeo facilmente incluiacutedos no arquivo HTML eacute versaacutetil pois o PHP roda
em uma grande variedade de sistemas operacionais eacute muito seguro pois se o
coacutedigo for escrito corretamente o usuaacuterio natildeo iraacute enxergar o coacutedigo PHP aleacutem de
ser customizaacutevel pois a licenccedila open-source permite aos programadores
modificarem o PHP adicionando ou modificando as caracteriacutesticas necessaacuterias ao
seu proacuteprio desenvolvimento
Devido ao PHP ser executado no servidor ele pode dinamicamente criar o
coacutedigo HTML que iraacute gerar a paacutegina Web permitindo que os usuaacuterios individuais
vejam paacuteginas customizadas Os visitantes da paacutegina Web vecircem a saiacuteda gerada
pelos scripts mas natildeo os scripts propriamente ditos tornando-o muito seguro
O PHP consegue trabalhar com ldquosessotildeesrdquo ou seja para executar
determinadas accedilotildees (fazer um download por exemplo) o usuaacuterio deve estar
identificado no site O PHP permite que se crie uma ldquosessatildeordquo que identifica cada
usuaacuterio no sistema aleacutem de outros dados referentes ao mesmo Se o usuaacuterio tentar
entrar em uma paacutegina especiacutefica primeiramente eacute verificado se existe uma sessatildeo
para o mesmo Se natildeo existir eacute mostrada uma mensagem de acesso proibido Se a
sessatildeo for vaacutelida os outros paracircmetros do usuaacuterio (salvos na sessatildeo) podem ser
verificados e validados caso necessaacuterio
2122 PHP - Como Funciona
15
Segundo Janet Valade (VALADE2004) O coacutedigo PHP eacute embutido no coacutedigo
HTML As tags do HTML satildeo usadas para incluir a linguagem PHP na linguagem
HTML Quando o PHP estaacute instalado o servidor Web eacute configurado para procurar
por coacutedigo PHP embutido em arquivos com extensotildees especiacuteficas (php ou phtml)
Quando o servidor recebe uma requisiccedilatildeo para um arquivo com uma dessas
extensotildees ele envia o coacutedigo HTML como estaacute mas o coacutedigo PHP eacute processado
pelo software antes de ser enviado ao solicitante Quando a linguagem PHP eacute
processada a saiacuteda consiste de coacutedigo HTML Os coacutedigos PHP natildeo satildeo incluiacutedos
no HTML enviado ao browser por isso o coacutedigo PHP eacute seguro e transparente para o
usuaacuterio Quando um browser eacute apontado para um arquivo HTML o servidor envia o
arquivo ao browser O browser processa o arquivo e mostra a paacutegina descrita pelos
tags HTML do arquivo Quando um Web browser eacute apontado para um arquivo PHP
o servidor procura por seccedilotildees PHP no arquivo e os processa enviando o resultado
do processamento ao browser Esses satildeo os passos seguidos pelo servidor para
processar um arquivo PHP
1 O servidor inicia a procura no arquivo em modo HTML Ele assume que o
coacutedigo eacute HTML e os envia ao browser sem nenhum processamento
2 O servidor web continua em modo HTML ateacute encontrar um tag de abertura do
PHP (lt)
3 Quando o servidor encontra um tag de abertura do PHP alterna para modo
PHP assume que todos os comandos subsequumlentes satildeo desse tipo e os
executa Se o comando gera uma saiacuteda a envia ao browser
4 O servidor continua em modo PHP ateacute encontrar um tag de fechamento do
PHP (gt)
5 Quando o servidor encontra um tag de fechamento do PHP retorna ao modo
HTML e repete o ciclo
2123 Forma Baacutesica de um Documento PHP
O PHP eacute embutido diretamente no programa HTML Seus comandos satildeo
delimitados pelos tags lt e gt Dentro dos tags de abertura e fechamento do PHP
satildeo incluiacutedos comandos especiacuteficos que satildeo interpretados pela linguagem A sintaxe
eacute bastante parecida com a da linguagem C Por exemplo
ltHTMLgt
16
ltHEADgtltTITLEgtTeste PHPltTITLEgtltHEADgt
ltBODYgt
ltpgt Linha HTML
lt
$id = $_GET[id]
if ($id = 1)
echo ldquoltpgtUsuaacuterio Nordm 1ltpgtrdquo
else
echo ldquoltpgt Usuaacuterio Nordm 2ltpgtrdquo
gt
ltBODYgt
ltHTMLgt
213 Javascript
Javascript eacute uma linguagem criada pela Netscape que serve basicamente
para aumentar os recursos do navegador
Todas as paacuteginas escritas com HTML satildeo estaacuteticas Conseguem fazer com
que o browser apenas leia o que haacute no coacutedigo e reproduza aquele conjunto de
instruccedilotildees Um dos principais recursos do Javascript eacute a possibilidade de fazer com
que a paacutegina HTML seja dinacircmica ou seja capaz de fazer com que o usuaacuterio possa
interagir com a paacutegina ou usar outros recursos para fazer com que o documento
Web se altere sem necessidade de um novo carregamento de paacutegina
O Javascript eacute uma linguagem de programaccedilatildeo que funciona interativamente
com o coacutedigo HTML O Javascript consegue ler entender e manipular os objetos de
uma paacutegina HTML tendo a facilidade necessaacuteria para alteraacute-los automaticamente
quando programado Satildeo inseridos nas paacuteginas de uma maneira peculiar podendo
ter apenas uma aacuterea para scripts ou espalhados pelo coacutedigo do jeito que melhor se
adapte agraves necessidades de cada usuaacuterio Diferentemente da linguagem PHP o
Javascript eacute uma linguagem client-side (as paacuteginas satildeo armazenadas e executadas
na maacutequina cliente) (LOURENCcedilO 2000)
17
22 Programas
221 Fireworks
O Fireworks eacute uma ferramenta de produccedilatildeo graacutefica para criaccedilatildeo de interfaces
e imagens Web com interaccedilatildeo em vaacuterias linguagens scripts (como php cfml html
xml Xhtml) podendo montar sites atraveacutes de desenhos O Fireworks consegue
combinar muito bem recursos vetoriais (como o ajuste de textos recursos praacuteticos
de desenho e ediccedilatildeo de noacutes) com os recursos aplicados a bitmaps ou imagens
(como o tratamento de cores e ferramentas de efeitos)
Tambeacutem permite trabalhar com layouts de sites sendo que pode-se
transformar o layout em uma paacutegina HTML usando o recurso de slices (fatias) O
programa permite que vocecirc divida o layout inteiro em vaacuterias imagens de acordo com
as aacutereas especiacuteficas que se deseja criar Apoacutes essa divisatildeo cada uma dessas aacutereas
eacute exportada com um formato de arquivo e com uma compactaccedilatildeo especiacutefica
podendo gerar o HTML com as imagens (ou fatias) nos seus devidos lugares e
posiccedilotildees ou mesmo exporta-las para o Dreamweaver Sua outra vantagem eacute a
possibilidade de se trabalhar com os behaviors (comportamentos) Com os
bahaviors pode-se criar rollovers (menus interativos) e menus pop ups (menus que
abrem outros sub-menus de acordo com cada item) estilizados
Como o Fireworks foi inicialmente projetado para a Web permite tambeacutem a
exportaccedilatildeo de imagens para a rede Esses recursos incluem a total otimizaccedilatildeo de
cada formato de arquivo a ser exportado bem como GIFS e JPEGS Aleacutem disso
pode-se fazer uma comparaccedilatildeo visual e do tamanho do arquivo simultaneamente
de ateacute 4 formatos ou configuraccedilotildees de exportaccedilotildees e tambeacutem salvar as mesmas
configuraccedilotildees para usar mais tarde em outros arquivos (CARACTERIacuteSTICAS
2004)
222 Dreamweaver
O Dreamweaver eacute um editor profissional de HTML utilizado para projetar
codificar e desenvolver sites paacuteginas e aplicaccedilotildees Web Permite que se trabalhe as
paacuteginas HTML de forma manual ou em um ambiente de ediccedilatildeo visual fornecendo
ferramentas uacuteteis para esses fins O Dreamweaver tambeacutem permite que se construa
aplicaccedilotildees Web dinacircmicas usando linguagens que rodam nos servidores (PHP
nesse caso) (PAGE 2004) Algumas das facilidades do Dreamweaver satildeo
18
bull Administraccedilatildeo remota do site e arquivos fonte localmente
bull Operaccedilatildeo em CSS (Cascade Style Sheets)
bull Geraccedilatildeo automatizada de rotinas em Javascript
bull Formulaacuterios
bull Criaccedilatildeo e uso de templates (modelos)
bull Gerenciamento completo do site e seus componentes (por exemplo se um
arquivo de imagem for movido de um sub-diretoacuterio para outro todo o site eacute
reparado automaticamente)
bull Apresentaccedilatildeo do mapa do site com diferentes niacuteveis de detalhamento
bull Behaviors (comportamentos que depois podem ser reaproveitados) com
rotinas de JavaScript
bull Manipulaccedilatildeo de tabelas
bull Rollover de imagens
bull Administraccedilatildeo do site a partir da barra de menu
bull Reparo automaacutetico do site a partir da mudanccedila de endereccedilo ou nome de
uma miacutedia ou link em geral
23 Banco de Dados
231 MySQL
O MySQL eacute um SGDB (ou sistema gerenciador de banco de dados) que eacute
desenvolvido e distribuiacutedo pela MySQL AB a empresa fundada pelos suecos David
Axmark Allan Larsson e Michael Widenius Ele derivou de outro banco de dados o
mSQL Pelo fato do mesmo natildeo ser raacutepido nem flexiacutevel o suficiente para as suas
necessidades os suecos resolveram criar um novo banco de dados utilizando a
interface API (application programming interface - conjunto de rotinas padronizadas
que a aplicaccedilatildeo utiliza para efetuar seus serviccedilos) do proacuteprio mSQL utilizada para
facilitar a portabilidade de coacutedigos escritos do mSQL para o MySQL
Escrito em C e C++ e testado em vaacuterias plataformas diferentes o MySQL
possui um sistema de alocaccedilatildeo de memoacuteria baseado em processos que permite a
execuccedilatildeo de tarefas paralelas tornando-o extremamente raacutepido e eficiente Ele eacute um
banco de dados do tipo SQL (Structured Query Language) e por isso possui as
caracteriacutesticas dos principais bancos de dados do tipo SQL como operadores e
funccedilotildees agrupamentos joins (junccedilotildees de tabelas) aceita vaacuterios tipos de campos
19
suportando registros de tamanhos fixos ou variaacuteveis controla a seguranccedila dos
dados aleacutem de poder armazenar uma grande quantidade de dados chegando a
quantidades superiores a 50000000 de registros Aleacutem disso o MySQL eacute multi-
usuaacuterio (programas de mais de um usuaacuterio podem estar em execuccedilatildeo) eacute multi-
tarefa (eacute capaz de executar vaacuterios programas simultaneamente mesmo que a
maacutequina possua somente um processador) e open-source
Esse servidor de banco de dados eacute considerado como o mais raacutepido entre os
de sua categoria tanto para grandes volumes de dados como pequenos Poreacutem
como ele foi criado para ser extremamente aacutegil teve-se de descartar certos aspectos
das especificaccedilotildees SQL e foi decidido natildeo se implementar caracteriacutesticas que geram
muita demanda de recursos como os triggers que satildeo uma porccedilatildeo de coacutedigo
armazenado que se executa quando eacute realizada uma operaccedilatildeo (atualizaccedilatildeo
inclusatildeo etc) com o banco de dados Naturalmente comprovar a proacutepria existecircncia
do trigger e executaacute-lo consome recursos e tempo
As principais vantagens do MySQL satildeo a baixa demanda de recursos de
hardware a simplicidade de administraccedilatildeo e a otimizaccedilatildeo para as aplicaccedilotildees tiacutepicas
da web onde ocorrem mais consultas do que atualizaccedilotildees (MySQL 2004)
20
3 DESIGN DO SITE
Atraveacutes de um briefing (anexo 1) pode-se chegar a algumas conclusotildees que
influenciaram na escolha da forma de apresentaccedilatildeo das paacuteginas e levaram a
definiccedilatildeo de quais cores imagens e forma o site seria apresentado aos usuaacuterios
31 DEFINICcedilAtildeO DAS CORES
311 A Teoria das Cores
O que se convencionou chamar de Teoria das Cores de Leonardo da Vinci
satildeo as formulaccedilotildees histoacutericas esparsas contidas em seus escritos e reunidas no livro
Tratado da Pintura e da Paisagem ndash Sombra e Luz que satildeo anotaccedilotildees recolhidas
pelo artista ao longo de anos de observaccedilatildeo e eacute a teoria mais corrente sendo um
dos legados do renascimento para as artes visuais (TEORIA 2004)
312 O Disco Cromaacutetico
O disco cromaacutetico natildeo eacute um instrumento cientiacutefico de classificaccedilatildeo de cores
mas eacute muito uacutetil no entendimento da teoria das cores As cores se dividem em
primaacuterias secundaacuterias e terciaacuterias (TEORIA 2004)
Pode-se reproduzir qualquer sensaccedilatildeo de cor misturando-se aditivamente
diversas quantidades de vermelho azul e verde Por isso conhecem-se essas cores
como cores primaacuterias (ENCARTA 2000) Combinado-se duas cores primaacuterias
obtemos as cores secundaacuterias resultando no laranja (amarelo com vermelho) verde
(azul com amarelo) e violeta (vermelho com azul) As cores terciaacuterias satildeo obtidas
pela mistura de uma primaacuteria com uma ou mais secundaacuterias (TEORIA 2004)
21
A figura 1 apresenta a representaccedilatildeo graacutefica do disco cromaacutetico
FIGURA 1 ndash DISCO CROMAacuteTICO
313 Cores Anaacutelogas
Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores anaacutelogas satildeo as
cores dispostas lado a lado no disco cromaacutetico Satildeo anaacutelogas porque haacute nelas uma
mesma cor baacutesica e satildeo usadas para dar a sensaccedilatildeo de uniformidade Observando
a figura 1 visualiza-se que a cor anaacuteloga do amarelo eacute o laranja por exemplo
314 Cores Complementares Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores complementares
satildeo aquelas que encontram-se sempre em posiccedilotildees opostas no disco cromaacutetico As
cores complementares satildeo usadas para dar forccedila e equiliacutebrio a um trabalho criando
contrastes Observando a figura 1 visualiza-se que a cor complementar do
vermelho eacute o verde e do laranja eacute o azul por exemplo
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
5
Resumo O presente trabalho aborda a anaacutelise e o desenvolvimento de um site
dinacircmico na Internet tendo como contratante o Gerds (grupo de estudos
interdisciplinar em redes de computadores e sistemas distribuiacutedos) da Universidade
Tuiuti do Paranaacute que tem por objetivo divulgar as pesquisas realizadas por alunos
professores e colaboradores participantes do grupo em questatildeo Este foi elaborado
a partir de teacutecnicas de desenvolvimento de sites e entrevistas feitas diretamente com
o contratante
Palavras-chave Desenvolvimento de site site dinacircmico PHP MySQL HTML
6
1 INTRODUCcedilAtildeO
Estima-se que hoje existam mais de 250 milhotildees de pessoas que utilizam a
Internet natildeo soacute como ferramenta de trabalho mas tambeacutem como diversatildeo e
pesquisa Essas pessoas esperam obter da plataforma Web um material de alta
qualidade (incluindo imagens animaccedilatildeo som e viacutedeo) e que esse material esteja
apresentado de forma agradaacutevel e funcionando de forma raacutepida e eficiente A
especializaccedilatildeo em Desenvolvimento Web ofereceu a preparaccedilatildeo para o trabalho no
desenvolvimento conhecimento e utilizaccedilatildeo das tecnologias multimiacutedia e Internet e
dos sistemas e aplicaccedilotildees que fazem uso dessas tecnologias
O desenvolvimento do site do Gerds (grupo de estudos interdisciplinar em
redes de computadores e sistemas distribuiacutedos) da UTP tem por objetivo divulgar o
trabalho realizado por alunos professores colaboradores e participantes dos cursos
de Engenharia da Computaccedilatildeo Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia
da Computaccedilatildeo e os cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes
de Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
universidade e a comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados
ou por transferecircncia de tecnologias inserindo professores e alunos num contexto
soacutecio-econocircmico mais amplo do que a realidade acadecircmica Essas informaccedilotildees satildeo
oferecidas pelo site atraveacutes de pesquisas artigos e notiacutecias periodicamente
atualizadas aleacutem de permitir que se desenvolva uma comunicaccedilatildeo bilateral entre os
interessados atraveacutes do cadastramento dessas pessoas no site bem como a
possibilidade de se deixar mensagens em um mural destinado a esse fim Sendo o contratante do serviccedilo o Gerds ficou definido como pessoa
responsaacutevel pela definiccedilatildeo das necessidades do site o professor Roberto Amaral
Atraveacutes de teacutecnicas de levantamento de dados (ver anexo I) foram obtidos os dados
baacutesicos necessaacuterios para o desenvolvimento do site A presente monografia estaacute estruturada em 5 capiacutetulos cujo conteuacutedo eacute
apresentado sucintamente a seguir
O Capiacutetulo 2 apresenta uma introduccedilatildeo aos conceitos das tecnologias
utilizadas enfocando sua histoacuteria e utilizaccedilatildeo na atual estrutura da Internet
O Capiacutetulo 3 apresenta a descriccedilatildeo de como foi realizado o design do site e a
funcionalidade das paacuteginas
O Capiacutetulo 4 apresenta a referecircncia ao coacutedigo fonte do trabalho
7
O Capiacutetulo 5 apresenta a conclusatildeo do trabalho
8
2 TECNOLOGIAS UTILIZADAS
De acordo com os estudados realizados as seguintes tecnologias foram
utilizadas para o desenvolvimento do site do Gerds
bull Linguagem o HTML ndash Utilizada para fazer o corpo principal das paacuteginas Adotado
por ser gratuito e amplamente utilizado na Internet
o PHP ndash Apesar do conteuacutedo apresentado nas aulas ter sido baseado
em ASP um novo estudo em linguagem PHP foi realizado em
classe e extra classe pois foi utilizado um servidor com sistema
operacional Linux com o servidor de banco de dados Apache que
interpreta somente a linguagem PHP Foi utilizado para tornar as
paacuteginas dinacircmicas e realizar a comunicaccedilatildeo com o banco de
dados
o JavaScript ndash Utilizado para criar funccedilotildees que satildeo executadas na
maacutequina do usuaacuterio Adotado por ser gratuito e amplamente
utilizado na Internet
bull Programas o Fireworks ndash Utilizado para fazer as imagens e construir a parte
visual do site Foi adotado por ser uma ferramenta que permite
trabalhar com layouts de sites de forma raacutepida e faacutecil e ter ampla
compatibilidade com o Dreamweaver
o Dreamweaver ndash Utilizado para a construccedilatildeo do site e a
programaccedilatildeo Adotado por ser uma ferramenta completa e que
permite desenvolver e administrar o site de forma raacutepida e eficiente
bull Banco de Dados o MySQL ndash Utilizado para armazenar os dados do site Adotado por
ser gratuito e amplamente utilizado em aplicaccedilotildees Web
21 Linguagem
211 HTML - HyperText Markup Language
No nuacutecleo de toda paacutegina da Web encontra-se a HyperText Markup
Language uma linguagem de diagramaccedilatildeo baseada em marcadores ou tags
9
(marcas utilizadas pela linguagem html que permitem ao browser formatar o texto
entre as tags de acordo com cada tag especiacutefica) como eacute mais comumente
conhecido A HTML eacute uma linguagem simples baseada em texto e que pode ser
visualizada em qualquer plataforma tanto em navegadores somente texto (como o
Lynx) como em navegadores mais avanccedilados (como Netscape Navigator e Internet
Explorer)
A HTML eacute na verdade apenas texto com coacutedigos de formataccedilatildeo que
especificam diferentes fontes e estilos ou ateacute mesmo outras funccedilotildees mais
avanccediladas Ela eacute muito semelhante aos antigos editores de texto que exigiam a
inserccedilatildeo de tags para especificar tipos em itaacutelico negrito ou sublinhado
O HTML nasceu em 1990 no CERN (European Council for Nuclear Research)
na Suiacuteccedila Seu criador o inglecircs Tim Berners-Lee a concebeu unicamente como uma
linguagem que serviria para interligar computadores do laboratoacuterio e outras
instituiccedilotildees de pesquisa e exibir documentos cientiacuteficos de forma simples e faacutecil de
acessar (STANEK 1996)
Em 1992 com a liberaccedilatildeo da biblioteca de desenvolvimento para WWW
(World Wide Web ou Rede de Alcance Mundial) aconteceu uma grande evoluccedilatildeo o
que foi fundamental para expansatildeo do HTML Essa biblioteca deu origem agrave
construccedilatildeo de vaacuterios browsers e servidores tornando a Web uma ferramenta viaacutevel
O MOSAIC desenvolvido por Marc Andreeson entatildeo do NCSA foi o primeiro
browser multi-plataforma que explorava completamente a capacidade de hipermiacutedia
da Web e que iniciou o crescimento explosivo da mesma Em 1993 o HTML tornou-
se disponiacutevel a milhotildees de usuaacuterios com a liberaccedilatildeo das versotildees para Mac e
Windows (STANEK 1996)
Quanto as suas especificaccedilotildees o HTML percorreu um caminho longo ateacute
chegar agrave sua atual especificaccedilatildeo Atualmente 4 especificaccedilotildees do HTML estatildeo
definidas Cada nova especificaccedilatildeo eacute compatiacutevel com as especificaccedilotildees anteriores e
incluem diversas melhorias A primeira especificaccedilatildeo do HTML que eacute a versatildeo
original foi a HTML 10 Tim Berners-Lee juntamente com David Ragget a
publicaram em 1993 Devido a sua capacidade limitada a versatildeo 10 permitia o
desenvolvimento de documentos baacutesicos Incluiacutea muacuteltiplos niacuteveis de cabeccedilalhos
exibiccedilatildeo de paraacutegrafos navegaccedilatildeo por referecircncias a hipertextos (composiccedilatildeo de
elementos de informaccedilatildeo paraacutegrafos paacuteginas imagens sequumlecircncias musicais etc e
10
ligaccedilotildees entre esses elementos indicando a passagem de um a outro) e
formataccedilotildees especiais para itens de uma lista (STANEK 1996)
A definiccedilatildeo do HTML 20 concluiacuteda em 1995 foi a primeira versatildeo
recomendada pelo IETF ndash Internet Engineering Task Force e se tornou um padratildeo
da Internet Ela oferece um melhor controle sobre os layouts dos textos
apresentados nas paacuteginas aleacutem da inclusatildeo de imagens e formulaacuterios que permite
aos desenvolvedores conseguir a participaccedilatildeo dos usuaacuterios de forma faacutecil e raacutepida
aleacutem de explorar as capacidades multimiacutedias da Web (STANEK 1996)
O HTML 30 de 1996 permite novos formatos de textos Uma de suas
caracteriacutesticas mais importantes eacute a definiccedilatildeo dos tags necessaacuterios para a criaccedilatildeo
de tabelas que permitem que os desenvolvedores apresentem as informaccedilotildees
desejadas formatadas em linhas e colunas (STANEK 1996) Durante o
desenvolvimento do HTML 30 com a rapidez da expansatildeo da Web os esforccedilos de
padronizaccedilatildeo natildeo puderam acompanhar as tendecircncias de desenvolvimento que
exigiam maiores recursos de apresentaccedilatildeo graacutefica do que o HTML 20 podia
fornecer Por isso o HTML 30 acabou natildeo sendo aprovado e em 1997 aprovou-se
uma recomendaccedilatildeo chamada HTML 32 que introduzia recursos de apresentaccedilatildeo
graacutefica no HTML (INTRODUCING 2004)
O HTML 40 de 1998 eacute uma extensatildeo do HTML 32 Essa versatildeo oferece
melhorias nos recursos de acessibilidade Quando o HTML eacute usado de forma
estruturada um documento pode se adaptar a diferentes browsers acomodar
diferentes fontes cores especiais sintetizadores de voz e dispositivos Braille Essa
adaptabilidade permite a pessoas com defeitos fiacutesicos trabalhar de forma facilitada
na Web Essa versatildeo adotou tambeacutem o Universal Character Set que usa o suporte
a convenccedilotildees internacionais permitindo a utilizaccedilatildeo de quase todas as linguagens
do mundo Outra novidade satildeo os frames (dividem a paacutegina em duas ou mais partes
ndash framesets - e satildeo geralmente usados para que um frameset permaneccedila enquanto
outros mudem baseados nos links que o usuaacuterio seleciona) Vaacuterios elementos do
HTML 32 foram considerados deprecados (candidatos a se tornarem obsoletos)
pelo HTML 40 forccedilando uma ecircnfase na separaccedilatildeo da estrutura do documento e na
apresentaccedilatildeo dos elementos que permitem definir cores fontes alinhamento
imagens de fundo e outras caracteriacutesticas da apresentaccedilatildeo da paacutegina que
dependem da plataforma onde a informaccedilatildeo eacute visualizada Essa separaccedilatildeo pocircde ser
realizada graccedilas a CSS (Cascading Style Sheets) que permite a criaccedilatildeo de folhas
11
de estilo aplicaacuteveis a vaacuterias paacuteginas de um site Se um dispositivo limitado natildeo
consegue exibir os estilos definidos no CSS ele pelo menos consegue entender a
estrutura do texto e imagens de forma que mesmo usuaacuterios com menos recursos
podem ter acesso agrave informaccedilatildeo contida na paacutegina (HTML 2004)
2111 Forma Baacutesica de um Documento HTML
Como jaacute foi citado anteriormente o HTML eacute na verdade apenas texto com
coacutedigos de formataccedilatildeo que especificam diferentes fontes e estilos Com a inserccedilatildeo
das tags o texto que estaacute compreendido entre essas marcas assume
caracteriacutesticas diferentes de acordo com cada uma delas
Cada tag informa ao browser como ele deveraacute formatar o texto que deve
estar dentro dos sinais de menor que (lt) e maior que (gt) Por exemplo ltHTMLgt
ltBODYgt
Os tags podem ser uacutenicos ou duplos com iniacutecio e fim Se forem duplos
existiraacute um tag informando que aquela formataccedilatildeo estaacute sendo encerrada Por
exemplo um tag simples pode ser representado por rdquoltbrgtrdquo que indica uma quebra
de linha Jaacute um tag duplo pode ser ltbgtltbgt indicando que o que estiver entre
esses campos deveraacute ser apresentado em negrito
A estrutura de um documento HTML apresenta os seguintes componentes
ltHTMLgt
ltHEADgtltTITLEgtTiacutetulo do DocumentoltTITLEgtltHEADgt
ltBODYgt
texto imagem links ltBODYgt
ltHTMLgt
Todo documento HTML deve estar entre os tags ltHTMLgt e ltHTMLgt A partir
daiacute esses documentos satildeo divididos em duas seccedilotildees principais a seccedilatildeo HEAD e a
seccedilatildeo BODY A HEAD conteacutem informaccedilotildees sobre o documento O tag ltTITLEgt por
exemplo define um tiacutetulo que eacute mostrado no alto da janela do browser Tudo que
estiver contido na seccedilatildeo ltBODYgt seraacute mostrado na janela principal do browser
12
Essa seccedilatildeo pode conter cabeccedilalhos paraacutegrafos listas tabelas links para outros
documentos e imagens
212 PHP - Personal Home Page
Como as paacuteginas em HTML satildeo basicamente apresentaccedilotildees de texto e
imagens com o passar do tempo surgiu a necessidade de uma interaccedilatildeo maior com
o usuaacuterio permitindo que se tivesse um histoacuterico desse usuaacuterio aleacutem da
possibilidade de se mostrar informaccedilotildees personalizadas aos mesmos Para esse
propoacutesito umas das linguagens que surgiram e que tinham forte ligaccedilatildeo com o
HTML foi o PHP
O PHP eacute uma linguagem de server-side (as paacuteginas ficam armazenadas e
satildeo executadas em um servidor onde o site estaacute localizado) e open-source (um
programa que tem seu coacutedigo fonte disponiacutevel para que qualquer pessoa que tenha
uma ideacuteia uma sugestatildeo possa ajudar no seu desenvolvimento) para criaccedilatildeo de
paacuteginas dinacircmicas para a Web Uma paacutegina dinacircmica eacute aquela que interage com o
usuaacuterio de forma que cada usuaacuterio ao visitar a paacutegina veraacute informaccedilotildees
personalizadas Os aplicativos dinacircmicos da Web satildeo predominantes nos sites
comerciais(e-commerce ndash sites de venda pela Internet) onde o conteuacutedo
apresentado eacute gerado a partir de informaccedilotildees acessadas de um banco de dados ou
outra fonte externa Sua interface permite que se incluam comandos PHP
diretamente na paacutegina HTML
O PHP sucede de um produto mais antigo chamado PHPFI PHPFI foi
criado por Rasmus Lerdorf em 1994 inicialmente como scripts (arquivos texto com
um conjunto de instruccedilotildees de uma linguagem especiacutefica nos quais estatildeo contidas
todas as instruccedilotildees que dizem o que o programa faraacute) usados para gerar estatiacutesticas
de acesso para seu curriacuteculo on line Ele nomeou esta seacuterie de scripts de ldquoPersonal
Home Page Toolsrdquo a qual adquiriu um relativo ecircxito devido a outras pessoas
pedirem a Rasmus que lhes permitisse utilizar os seus programas nas suas proacuteprias
paacuteginas Web Como mais funcionalidades foram requeridas Rasmus escreveu uma
implementaccedilatildeo em linguagem C muito maior que era capaz de comunicar-se com
uma base de dados e possibilitava a usuaacuterios o desenvolvimento simples de
aplicativos dinacircmicos para Web Devido agrave aceitaccedilatildeo do primeiro PHP e de maneira
adicional o seu criador desenhou um sistema para processar formulaacuterios ao qual
13
deu o nome de FI (Form Interpreter) e o conjunto destas duas ferramentas seria a
primeira versatildeo compacta da linguagem PHPFI Rasmus resolveu distribuir o
coacutedigo fonte do PHPFI para que todos pudessem ver e tambeacutem usaacute-lo bem como
corrigir bugs e melhorar o coacutedigo (HISTOacuteRIA 2004)
O PHPFI usava interpretaccedilotildees automaacuteticas de variaacuteveis vindas de formulaacuterio
(dados passados pelos usuaacuterios) e era embutida diretamente no coacutedigo do HTML
Poreacutem a sua sintaxe era limitada simples e um pouco inconsistente
Em 1997 PHPFI 20 a segunda versatildeo da implementaccedilatildeo em linguagem C
obteve milhares de usuaacuterios ao redor do mundo com um valor estimado de
aproximadamente 50000 domiacutenios respondendo por basicamente 1 dos domiacutenios
da Internet Enquanto isto havia milhares de pessoas contribuindo com pequenos
coacutedigos para o projeto e ainda assim o PHPFI 20 foi oficialmente lanccedilado somente
ao final de 1997 apoacutes perder a maior parte de sua vida em versotildees beta (versotildees de
um produto que satildeo distribuiacutedas para teste dos usuaacuterios antes do lanccedilamento
oficial) O PHPFI 20 foi rapidamente substituiacutedo pelas versotildees iniciais do PHP 30
(HISTOacuteRIA 2004)
O PHP 30 foi a primeira versatildeo que se assemelha ao PHP que eacute utilizado
atualmente Ela foi criada por Andi Gutmans e Zeev Suraski em 1997 e foi
totalmente reescrito apoacutes eles descobrirem que o PHPFI 20 poderia ajudaacute-los a
desenvolver suas proacuteprias aplicaccedilotildees de e-Commerce de um projeto na sua
Universidade No esforccedilo cooperativo e iniciativa de reescrever o PHPFI a partir da
base existente Andi Rasmus e Zeev decidiram unir esforccedilos e anunciar o PHP 30
como uma versatildeo oficial de seu antecessor (o PHPFI 20) (HISTOacuteRIA 2004)
O PHP 30 aleacutem de oferecer aos usuaacuterios finais uma infraestrutura soacutelida
para diversos bancos de dados protocolos e APIs a extensibilidade (possibilidade
de uso para diversos objetivos) do PHP 30 atrai dezenas de novos desenvolvedores
para se juntar e submeter novos moacutedulos Esta eacute a chave do sucesso do PHP 30
Outras caracteriacutesticas chaves introduzidas no PHP 30 foram o suporte agrave sintaxe
para orientaccedilatildeo a objetos e uma sintaxe muito mais poderosa e consistente
O PHP 30 foi oficialmente lanccedilado em Junho de 1998 depois de ter passado
aproximadamente 9 meses em testes puacuteblicos (versotildees beta) Os objetivos do
projeto eram melhorar a performance de aplicaccedilotildees complexas e melhorar a
modularidade do coacutedigo base do PHP
14
O PHP 40 acompanhado com uma seacuterie de novas caracteriacutesticas foi
oficialmente lanccedilada no iniacutecio de 2000 quase dois anos apoacutes o seu antecessor
Aleacutem da melhora na performance esta versatildeo incluiu outras caracteriacutesticas chave
como o suporte para muitos servidores Web sessotildees HTTP buffer de saiacuteda e
maneiras mais seguras de manipular entrada de dados dos usuaacuterios (HISTOacuteRIA
2004)
De acordo com o site oficial do PHP (phpnetusagephp) atualmente
aproximadamente 17 milhotildees de domiacutenios estatildeo usando PHP na Web
2121 PHP - Por que utilizar
A popularidade do PHP continua crescendo rapidamente devido a muitas
vantagens Eacute raacutepido pois devido a estar embutido no coacutedigo HTML o tempo para
processar e carregar uma paacutegina Web eacute curto Eacute graacutetis e faacutecil de usar pois os
coacutedigos PHP satildeo facilmente incluiacutedos no arquivo HTML eacute versaacutetil pois o PHP roda
em uma grande variedade de sistemas operacionais eacute muito seguro pois se o
coacutedigo for escrito corretamente o usuaacuterio natildeo iraacute enxergar o coacutedigo PHP aleacutem de
ser customizaacutevel pois a licenccedila open-source permite aos programadores
modificarem o PHP adicionando ou modificando as caracteriacutesticas necessaacuterias ao
seu proacuteprio desenvolvimento
Devido ao PHP ser executado no servidor ele pode dinamicamente criar o
coacutedigo HTML que iraacute gerar a paacutegina Web permitindo que os usuaacuterios individuais
vejam paacuteginas customizadas Os visitantes da paacutegina Web vecircem a saiacuteda gerada
pelos scripts mas natildeo os scripts propriamente ditos tornando-o muito seguro
O PHP consegue trabalhar com ldquosessotildeesrdquo ou seja para executar
determinadas accedilotildees (fazer um download por exemplo) o usuaacuterio deve estar
identificado no site O PHP permite que se crie uma ldquosessatildeordquo que identifica cada
usuaacuterio no sistema aleacutem de outros dados referentes ao mesmo Se o usuaacuterio tentar
entrar em uma paacutegina especiacutefica primeiramente eacute verificado se existe uma sessatildeo
para o mesmo Se natildeo existir eacute mostrada uma mensagem de acesso proibido Se a
sessatildeo for vaacutelida os outros paracircmetros do usuaacuterio (salvos na sessatildeo) podem ser
verificados e validados caso necessaacuterio
2122 PHP - Como Funciona
15
Segundo Janet Valade (VALADE2004) O coacutedigo PHP eacute embutido no coacutedigo
HTML As tags do HTML satildeo usadas para incluir a linguagem PHP na linguagem
HTML Quando o PHP estaacute instalado o servidor Web eacute configurado para procurar
por coacutedigo PHP embutido em arquivos com extensotildees especiacuteficas (php ou phtml)
Quando o servidor recebe uma requisiccedilatildeo para um arquivo com uma dessas
extensotildees ele envia o coacutedigo HTML como estaacute mas o coacutedigo PHP eacute processado
pelo software antes de ser enviado ao solicitante Quando a linguagem PHP eacute
processada a saiacuteda consiste de coacutedigo HTML Os coacutedigos PHP natildeo satildeo incluiacutedos
no HTML enviado ao browser por isso o coacutedigo PHP eacute seguro e transparente para o
usuaacuterio Quando um browser eacute apontado para um arquivo HTML o servidor envia o
arquivo ao browser O browser processa o arquivo e mostra a paacutegina descrita pelos
tags HTML do arquivo Quando um Web browser eacute apontado para um arquivo PHP
o servidor procura por seccedilotildees PHP no arquivo e os processa enviando o resultado
do processamento ao browser Esses satildeo os passos seguidos pelo servidor para
processar um arquivo PHP
1 O servidor inicia a procura no arquivo em modo HTML Ele assume que o
coacutedigo eacute HTML e os envia ao browser sem nenhum processamento
2 O servidor web continua em modo HTML ateacute encontrar um tag de abertura do
PHP (lt)
3 Quando o servidor encontra um tag de abertura do PHP alterna para modo
PHP assume que todos os comandos subsequumlentes satildeo desse tipo e os
executa Se o comando gera uma saiacuteda a envia ao browser
4 O servidor continua em modo PHP ateacute encontrar um tag de fechamento do
PHP (gt)
5 Quando o servidor encontra um tag de fechamento do PHP retorna ao modo
HTML e repete o ciclo
2123 Forma Baacutesica de um Documento PHP
O PHP eacute embutido diretamente no programa HTML Seus comandos satildeo
delimitados pelos tags lt e gt Dentro dos tags de abertura e fechamento do PHP
satildeo incluiacutedos comandos especiacuteficos que satildeo interpretados pela linguagem A sintaxe
eacute bastante parecida com a da linguagem C Por exemplo
ltHTMLgt
16
ltHEADgtltTITLEgtTeste PHPltTITLEgtltHEADgt
ltBODYgt
ltpgt Linha HTML
lt
$id = $_GET[id]
if ($id = 1)
echo ldquoltpgtUsuaacuterio Nordm 1ltpgtrdquo
else
echo ldquoltpgt Usuaacuterio Nordm 2ltpgtrdquo
gt
ltBODYgt
ltHTMLgt
213 Javascript
Javascript eacute uma linguagem criada pela Netscape que serve basicamente
para aumentar os recursos do navegador
Todas as paacuteginas escritas com HTML satildeo estaacuteticas Conseguem fazer com
que o browser apenas leia o que haacute no coacutedigo e reproduza aquele conjunto de
instruccedilotildees Um dos principais recursos do Javascript eacute a possibilidade de fazer com
que a paacutegina HTML seja dinacircmica ou seja capaz de fazer com que o usuaacuterio possa
interagir com a paacutegina ou usar outros recursos para fazer com que o documento
Web se altere sem necessidade de um novo carregamento de paacutegina
O Javascript eacute uma linguagem de programaccedilatildeo que funciona interativamente
com o coacutedigo HTML O Javascript consegue ler entender e manipular os objetos de
uma paacutegina HTML tendo a facilidade necessaacuteria para alteraacute-los automaticamente
quando programado Satildeo inseridos nas paacuteginas de uma maneira peculiar podendo
ter apenas uma aacuterea para scripts ou espalhados pelo coacutedigo do jeito que melhor se
adapte agraves necessidades de cada usuaacuterio Diferentemente da linguagem PHP o
Javascript eacute uma linguagem client-side (as paacuteginas satildeo armazenadas e executadas
na maacutequina cliente) (LOURENCcedilO 2000)
17
22 Programas
221 Fireworks
O Fireworks eacute uma ferramenta de produccedilatildeo graacutefica para criaccedilatildeo de interfaces
e imagens Web com interaccedilatildeo em vaacuterias linguagens scripts (como php cfml html
xml Xhtml) podendo montar sites atraveacutes de desenhos O Fireworks consegue
combinar muito bem recursos vetoriais (como o ajuste de textos recursos praacuteticos
de desenho e ediccedilatildeo de noacutes) com os recursos aplicados a bitmaps ou imagens
(como o tratamento de cores e ferramentas de efeitos)
Tambeacutem permite trabalhar com layouts de sites sendo que pode-se
transformar o layout em uma paacutegina HTML usando o recurso de slices (fatias) O
programa permite que vocecirc divida o layout inteiro em vaacuterias imagens de acordo com
as aacutereas especiacuteficas que se deseja criar Apoacutes essa divisatildeo cada uma dessas aacutereas
eacute exportada com um formato de arquivo e com uma compactaccedilatildeo especiacutefica
podendo gerar o HTML com as imagens (ou fatias) nos seus devidos lugares e
posiccedilotildees ou mesmo exporta-las para o Dreamweaver Sua outra vantagem eacute a
possibilidade de se trabalhar com os behaviors (comportamentos) Com os
bahaviors pode-se criar rollovers (menus interativos) e menus pop ups (menus que
abrem outros sub-menus de acordo com cada item) estilizados
Como o Fireworks foi inicialmente projetado para a Web permite tambeacutem a
exportaccedilatildeo de imagens para a rede Esses recursos incluem a total otimizaccedilatildeo de
cada formato de arquivo a ser exportado bem como GIFS e JPEGS Aleacutem disso
pode-se fazer uma comparaccedilatildeo visual e do tamanho do arquivo simultaneamente
de ateacute 4 formatos ou configuraccedilotildees de exportaccedilotildees e tambeacutem salvar as mesmas
configuraccedilotildees para usar mais tarde em outros arquivos (CARACTERIacuteSTICAS
2004)
222 Dreamweaver
O Dreamweaver eacute um editor profissional de HTML utilizado para projetar
codificar e desenvolver sites paacuteginas e aplicaccedilotildees Web Permite que se trabalhe as
paacuteginas HTML de forma manual ou em um ambiente de ediccedilatildeo visual fornecendo
ferramentas uacuteteis para esses fins O Dreamweaver tambeacutem permite que se construa
aplicaccedilotildees Web dinacircmicas usando linguagens que rodam nos servidores (PHP
nesse caso) (PAGE 2004) Algumas das facilidades do Dreamweaver satildeo
18
bull Administraccedilatildeo remota do site e arquivos fonte localmente
bull Operaccedilatildeo em CSS (Cascade Style Sheets)
bull Geraccedilatildeo automatizada de rotinas em Javascript
bull Formulaacuterios
bull Criaccedilatildeo e uso de templates (modelos)
bull Gerenciamento completo do site e seus componentes (por exemplo se um
arquivo de imagem for movido de um sub-diretoacuterio para outro todo o site eacute
reparado automaticamente)
bull Apresentaccedilatildeo do mapa do site com diferentes niacuteveis de detalhamento
bull Behaviors (comportamentos que depois podem ser reaproveitados) com
rotinas de JavaScript
bull Manipulaccedilatildeo de tabelas
bull Rollover de imagens
bull Administraccedilatildeo do site a partir da barra de menu
bull Reparo automaacutetico do site a partir da mudanccedila de endereccedilo ou nome de
uma miacutedia ou link em geral
23 Banco de Dados
231 MySQL
O MySQL eacute um SGDB (ou sistema gerenciador de banco de dados) que eacute
desenvolvido e distribuiacutedo pela MySQL AB a empresa fundada pelos suecos David
Axmark Allan Larsson e Michael Widenius Ele derivou de outro banco de dados o
mSQL Pelo fato do mesmo natildeo ser raacutepido nem flexiacutevel o suficiente para as suas
necessidades os suecos resolveram criar um novo banco de dados utilizando a
interface API (application programming interface - conjunto de rotinas padronizadas
que a aplicaccedilatildeo utiliza para efetuar seus serviccedilos) do proacuteprio mSQL utilizada para
facilitar a portabilidade de coacutedigos escritos do mSQL para o MySQL
Escrito em C e C++ e testado em vaacuterias plataformas diferentes o MySQL
possui um sistema de alocaccedilatildeo de memoacuteria baseado em processos que permite a
execuccedilatildeo de tarefas paralelas tornando-o extremamente raacutepido e eficiente Ele eacute um
banco de dados do tipo SQL (Structured Query Language) e por isso possui as
caracteriacutesticas dos principais bancos de dados do tipo SQL como operadores e
funccedilotildees agrupamentos joins (junccedilotildees de tabelas) aceita vaacuterios tipos de campos
19
suportando registros de tamanhos fixos ou variaacuteveis controla a seguranccedila dos
dados aleacutem de poder armazenar uma grande quantidade de dados chegando a
quantidades superiores a 50000000 de registros Aleacutem disso o MySQL eacute multi-
usuaacuterio (programas de mais de um usuaacuterio podem estar em execuccedilatildeo) eacute multi-
tarefa (eacute capaz de executar vaacuterios programas simultaneamente mesmo que a
maacutequina possua somente um processador) e open-source
Esse servidor de banco de dados eacute considerado como o mais raacutepido entre os
de sua categoria tanto para grandes volumes de dados como pequenos Poreacutem
como ele foi criado para ser extremamente aacutegil teve-se de descartar certos aspectos
das especificaccedilotildees SQL e foi decidido natildeo se implementar caracteriacutesticas que geram
muita demanda de recursos como os triggers que satildeo uma porccedilatildeo de coacutedigo
armazenado que se executa quando eacute realizada uma operaccedilatildeo (atualizaccedilatildeo
inclusatildeo etc) com o banco de dados Naturalmente comprovar a proacutepria existecircncia
do trigger e executaacute-lo consome recursos e tempo
As principais vantagens do MySQL satildeo a baixa demanda de recursos de
hardware a simplicidade de administraccedilatildeo e a otimizaccedilatildeo para as aplicaccedilotildees tiacutepicas
da web onde ocorrem mais consultas do que atualizaccedilotildees (MySQL 2004)
20
3 DESIGN DO SITE
Atraveacutes de um briefing (anexo 1) pode-se chegar a algumas conclusotildees que
influenciaram na escolha da forma de apresentaccedilatildeo das paacuteginas e levaram a
definiccedilatildeo de quais cores imagens e forma o site seria apresentado aos usuaacuterios
31 DEFINICcedilAtildeO DAS CORES
311 A Teoria das Cores
O que se convencionou chamar de Teoria das Cores de Leonardo da Vinci
satildeo as formulaccedilotildees histoacutericas esparsas contidas em seus escritos e reunidas no livro
Tratado da Pintura e da Paisagem ndash Sombra e Luz que satildeo anotaccedilotildees recolhidas
pelo artista ao longo de anos de observaccedilatildeo e eacute a teoria mais corrente sendo um
dos legados do renascimento para as artes visuais (TEORIA 2004)
312 O Disco Cromaacutetico
O disco cromaacutetico natildeo eacute um instrumento cientiacutefico de classificaccedilatildeo de cores
mas eacute muito uacutetil no entendimento da teoria das cores As cores se dividem em
primaacuterias secundaacuterias e terciaacuterias (TEORIA 2004)
Pode-se reproduzir qualquer sensaccedilatildeo de cor misturando-se aditivamente
diversas quantidades de vermelho azul e verde Por isso conhecem-se essas cores
como cores primaacuterias (ENCARTA 2000) Combinado-se duas cores primaacuterias
obtemos as cores secundaacuterias resultando no laranja (amarelo com vermelho) verde
(azul com amarelo) e violeta (vermelho com azul) As cores terciaacuterias satildeo obtidas
pela mistura de uma primaacuteria com uma ou mais secundaacuterias (TEORIA 2004)
21
A figura 1 apresenta a representaccedilatildeo graacutefica do disco cromaacutetico
FIGURA 1 ndash DISCO CROMAacuteTICO
313 Cores Anaacutelogas
Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores anaacutelogas satildeo as
cores dispostas lado a lado no disco cromaacutetico Satildeo anaacutelogas porque haacute nelas uma
mesma cor baacutesica e satildeo usadas para dar a sensaccedilatildeo de uniformidade Observando
a figura 1 visualiza-se que a cor anaacuteloga do amarelo eacute o laranja por exemplo
314 Cores Complementares Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores complementares
satildeo aquelas que encontram-se sempre em posiccedilotildees opostas no disco cromaacutetico As
cores complementares satildeo usadas para dar forccedila e equiliacutebrio a um trabalho criando
contrastes Observando a figura 1 visualiza-se que a cor complementar do
vermelho eacute o verde e do laranja eacute o azul por exemplo
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
6
1 INTRODUCcedilAtildeO
Estima-se que hoje existam mais de 250 milhotildees de pessoas que utilizam a
Internet natildeo soacute como ferramenta de trabalho mas tambeacutem como diversatildeo e
pesquisa Essas pessoas esperam obter da plataforma Web um material de alta
qualidade (incluindo imagens animaccedilatildeo som e viacutedeo) e que esse material esteja
apresentado de forma agradaacutevel e funcionando de forma raacutepida e eficiente A
especializaccedilatildeo em Desenvolvimento Web ofereceu a preparaccedilatildeo para o trabalho no
desenvolvimento conhecimento e utilizaccedilatildeo das tecnologias multimiacutedia e Internet e
dos sistemas e aplicaccedilotildees que fazem uso dessas tecnologias
O desenvolvimento do site do Gerds (grupo de estudos interdisciplinar em
redes de computadores e sistemas distribuiacutedos) da UTP tem por objetivo divulgar o
trabalho realizado por alunos professores colaboradores e participantes dos cursos
de Engenharia da Computaccedilatildeo Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia
da Computaccedilatildeo e os cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes
de Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
universidade e a comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados
ou por transferecircncia de tecnologias inserindo professores e alunos num contexto
soacutecio-econocircmico mais amplo do que a realidade acadecircmica Essas informaccedilotildees satildeo
oferecidas pelo site atraveacutes de pesquisas artigos e notiacutecias periodicamente
atualizadas aleacutem de permitir que se desenvolva uma comunicaccedilatildeo bilateral entre os
interessados atraveacutes do cadastramento dessas pessoas no site bem como a
possibilidade de se deixar mensagens em um mural destinado a esse fim Sendo o contratante do serviccedilo o Gerds ficou definido como pessoa
responsaacutevel pela definiccedilatildeo das necessidades do site o professor Roberto Amaral
Atraveacutes de teacutecnicas de levantamento de dados (ver anexo I) foram obtidos os dados
baacutesicos necessaacuterios para o desenvolvimento do site A presente monografia estaacute estruturada em 5 capiacutetulos cujo conteuacutedo eacute
apresentado sucintamente a seguir
O Capiacutetulo 2 apresenta uma introduccedilatildeo aos conceitos das tecnologias
utilizadas enfocando sua histoacuteria e utilizaccedilatildeo na atual estrutura da Internet
O Capiacutetulo 3 apresenta a descriccedilatildeo de como foi realizado o design do site e a
funcionalidade das paacuteginas
O Capiacutetulo 4 apresenta a referecircncia ao coacutedigo fonte do trabalho
7
O Capiacutetulo 5 apresenta a conclusatildeo do trabalho
8
2 TECNOLOGIAS UTILIZADAS
De acordo com os estudados realizados as seguintes tecnologias foram
utilizadas para o desenvolvimento do site do Gerds
bull Linguagem o HTML ndash Utilizada para fazer o corpo principal das paacuteginas Adotado
por ser gratuito e amplamente utilizado na Internet
o PHP ndash Apesar do conteuacutedo apresentado nas aulas ter sido baseado
em ASP um novo estudo em linguagem PHP foi realizado em
classe e extra classe pois foi utilizado um servidor com sistema
operacional Linux com o servidor de banco de dados Apache que
interpreta somente a linguagem PHP Foi utilizado para tornar as
paacuteginas dinacircmicas e realizar a comunicaccedilatildeo com o banco de
dados
o JavaScript ndash Utilizado para criar funccedilotildees que satildeo executadas na
maacutequina do usuaacuterio Adotado por ser gratuito e amplamente
utilizado na Internet
bull Programas o Fireworks ndash Utilizado para fazer as imagens e construir a parte
visual do site Foi adotado por ser uma ferramenta que permite
trabalhar com layouts de sites de forma raacutepida e faacutecil e ter ampla
compatibilidade com o Dreamweaver
o Dreamweaver ndash Utilizado para a construccedilatildeo do site e a
programaccedilatildeo Adotado por ser uma ferramenta completa e que
permite desenvolver e administrar o site de forma raacutepida e eficiente
bull Banco de Dados o MySQL ndash Utilizado para armazenar os dados do site Adotado por
ser gratuito e amplamente utilizado em aplicaccedilotildees Web
21 Linguagem
211 HTML - HyperText Markup Language
No nuacutecleo de toda paacutegina da Web encontra-se a HyperText Markup
Language uma linguagem de diagramaccedilatildeo baseada em marcadores ou tags
9
(marcas utilizadas pela linguagem html que permitem ao browser formatar o texto
entre as tags de acordo com cada tag especiacutefica) como eacute mais comumente
conhecido A HTML eacute uma linguagem simples baseada em texto e que pode ser
visualizada em qualquer plataforma tanto em navegadores somente texto (como o
Lynx) como em navegadores mais avanccedilados (como Netscape Navigator e Internet
Explorer)
A HTML eacute na verdade apenas texto com coacutedigos de formataccedilatildeo que
especificam diferentes fontes e estilos ou ateacute mesmo outras funccedilotildees mais
avanccediladas Ela eacute muito semelhante aos antigos editores de texto que exigiam a
inserccedilatildeo de tags para especificar tipos em itaacutelico negrito ou sublinhado
O HTML nasceu em 1990 no CERN (European Council for Nuclear Research)
na Suiacuteccedila Seu criador o inglecircs Tim Berners-Lee a concebeu unicamente como uma
linguagem que serviria para interligar computadores do laboratoacuterio e outras
instituiccedilotildees de pesquisa e exibir documentos cientiacuteficos de forma simples e faacutecil de
acessar (STANEK 1996)
Em 1992 com a liberaccedilatildeo da biblioteca de desenvolvimento para WWW
(World Wide Web ou Rede de Alcance Mundial) aconteceu uma grande evoluccedilatildeo o
que foi fundamental para expansatildeo do HTML Essa biblioteca deu origem agrave
construccedilatildeo de vaacuterios browsers e servidores tornando a Web uma ferramenta viaacutevel
O MOSAIC desenvolvido por Marc Andreeson entatildeo do NCSA foi o primeiro
browser multi-plataforma que explorava completamente a capacidade de hipermiacutedia
da Web e que iniciou o crescimento explosivo da mesma Em 1993 o HTML tornou-
se disponiacutevel a milhotildees de usuaacuterios com a liberaccedilatildeo das versotildees para Mac e
Windows (STANEK 1996)
Quanto as suas especificaccedilotildees o HTML percorreu um caminho longo ateacute
chegar agrave sua atual especificaccedilatildeo Atualmente 4 especificaccedilotildees do HTML estatildeo
definidas Cada nova especificaccedilatildeo eacute compatiacutevel com as especificaccedilotildees anteriores e
incluem diversas melhorias A primeira especificaccedilatildeo do HTML que eacute a versatildeo
original foi a HTML 10 Tim Berners-Lee juntamente com David Ragget a
publicaram em 1993 Devido a sua capacidade limitada a versatildeo 10 permitia o
desenvolvimento de documentos baacutesicos Incluiacutea muacuteltiplos niacuteveis de cabeccedilalhos
exibiccedilatildeo de paraacutegrafos navegaccedilatildeo por referecircncias a hipertextos (composiccedilatildeo de
elementos de informaccedilatildeo paraacutegrafos paacuteginas imagens sequumlecircncias musicais etc e
10
ligaccedilotildees entre esses elementos indicando a passagem de um a outro) e
formataccedilotildees especiais para itens de uma lista (STANEK 1996)
A definiccedilatildeo do HTML 20 concluiacuteda em 1995 foi a primeira versatildeo
recomendada pelo IETF ndash Internet Engineering Task Force e se tornou um padratildeo
da Internet Ela oferece um melhor controle sobre os layouts dos textos
apresentados nas paacuteginas aleacutem da inclusatildeo de imagens e formulaacuterios que permite
aos desenvolvedores conseguir a participaccedilatildeo dos usuaacuterios de forma faacutecil e raacutepida
aleacutem de explorar as capacidades multimiacutedias da Web (STANEK 1996)
O HTML 30 de 1996 permite novos formatos de textos Uma de suas
caracteriacutesticas mais importantes eacute a definiccedilatildeo dos tags necessaacuterios para a criaccedilatildeo
de tabelas que permitem que os desenvolvedores apresentem as informaccedilotildees
desejadas formatadas em linhas e colunas (STANEK 1996) Durante o
desenvolvimento do HTML 30 com a rapidez da expansatildeo da Web os esforccedilos de
padronizaccedilatildeo natildeo puderam acompanhar as tendecircncias de desenvolvimento que
exigiam maiores recursos de apresentaccedilatildeo graacutefica do que o HTML 20 podia
fornecer Por isso o HTML 30 acabou natildeo sendo aprovado e em 1997 aprovou-se
uma recomendaccedilatildeo chamada HTML 32 que introduzia recursos de apresentaccedilatildeo
graacutefica no HTML (INTRODUCING 2004)
O HTML 40 de 1998 eacute uma extensatildeo do HTML 32 Essa versatildeo oferece
melhorias nos recursos de acessibilidade Quando o HTML eacute usado de forma
estruturada um documento pode se adaptar a diferentes browsers acomodar
diferentes fontes cores especiais sintetizadores de voz e dispositivos Braille Essa
adaptabilidade permite a pessoas com defeitos fiacutesicos trabalhar de forma facilitada
na Web Essa versatildeo adotou tambeacutem o Universal Character Set que usa o suporte
a convenccedilotildees internacionais permitindo a utilizaccedilatildeo de quase todas as linguagens
do mundo Outra novidade satildeo os frames (dividem a paacutegina em duas ou mais partes
ndash framesets - e satildeo geralmente usados para que um frameset permaneccedila enquanto
outros mudem baseados nos links que o usuaacuterio seleciona) Vaacuterios elementos do
HTML 32 foram considerados deprecados (candidatos a se tornarem obsoletos)
pelo HTML 40 forccedilando uma ecircnfase na separaccedilatildeo da estrutura do documento e na
apresentaccedilatildeo dos elementos que permitem definir cores fontes alinhamento
imagens de fundo e outras caracteriacutesticas da apresentaccedilatildeo da paacutegina que
dependem da plataforma onde a informaccedilatildeo eacute visualizada Essa separaccedilatildeo pocircde ser
realizada graccedilas a CSS (Cascading Style Sheets) que permite a criaccedilatildeo de folhas
11
de estilo aplicaacuteveis a vaacuterias paacuteginas de um site Se um dispositivo limitado natildeo
consegue exibir os estilos definidos no CSS ele pelo menos consegue entender a
estrutura do texto e imagens de forma que mesmo usuaacuterios com menos recursos
podem ter acesso agrave informaccedilatildeo contida na paacutegina (HTML 2004)
2111 Forma Baacutesica de um Documento HTML
Como jaacute foi citado anteriormente o HTML eacute na verdade apenas texto com
coacutedigos de formataccedilatildeo que especificam diferentes fontes e estilos Com a inserccedilatildeo
das tags o texto que estaacute compreendido entre essas marcas assume
caracteriacutesticas diferentes de acordo com cada uma delas
Cada tag informa ao browser como ele deveraacute formatar o texto que deve
estar dentro dos sinais de menor que (lt) e maior que (gt) Por exemplo ltHTMLgt
ltBODYgt
Os tags podem ser uacutenicos ou duplos com iniacutecio e fim Se forem duplos
existiraacute um tag informando que aquela formataccedilatildeo estaacute sendo encerrada Por
exemplo um tag simples pode ser representado por rdquoltbrgtrdquo que indica uma quebra
de linha Jaacute um tag duplo pode ser ltbgtltbgt indicando que o que estiver entre
esses campos deveraacute ser apresentado em negrito
A estrutura de um documento HTML apresenta os seguintes componentes
ltHTMLgt
ltHEADgtltTITLEgtTiacutetulo do DocumentoltTITLEgtltHEADgt
ltBODYgt
texto imagem links ltBODYgt
ltHTMLgt
Todo documento HTML deve estar entre os tags ltHTMLgt e ltHTMLgt A partir
daiacute esses documentos satildeo divididos em duas seccedilotildees principais a seccedilatildeo HEAD e a
seccedilatildeo BODY A HEAD conteacutem informaccedilotildees sobre o documento O tag ltTITLEgt por
exemplo define um tiacutetulo que eacute mostrado no alto da janela do browser Tudo que
estiver contido na seccedilatildeo ltBODYgt seraacute mostrado na janela principal do browser
12
Essa seccedilatildeo pode conter cabeccedilalhos paraacutegrafos listas tabelas links para outros
documentos e imagens
212 PHP - Personal Home Page
Como as paacuteginas em HTML satildeo basicamente apresentaccedilotildees de texto e
imagens com o passar do tempo surgiu a necessidade de uma interaccedilatildeo maior com
o usuaacuterio permitindo que se tivesse um histoacuterico desse usuaacuterio aleacutem da
possibilidade de se mostrar informaccedilotildees personalizadas aos mesmos Para esse
propoacutesito umas das linguagens que surgiram e que tinham forte ligaccedilatildeo com o
HTML foi o PHP
O PHP eacute uma linguagem de server-side (as paacuteginas ficam armazenadas e
satildeo executadas em um servidor onde o site estaacute localizado) e open-source (um
programa que tem seu coacutedigo fonte disponiacutevel para que qualquer pessoa que tenha
uma ideacuteia uma sugestatildeo possa ajudar no seu desenvolvimento) para criaccedilatildeo de
paacuteginas dinacircmicas para a Web Uma paacutegina dinacircmica eacute aquela que interage com o
usuaacuterio de forma que cada usuaacuterio ao visitar a paacutegina veraacute informaccedilotildees
personalizadas Os aplicativos dinacircmicos da Web satildeo predominantes nos sites
comerciais(e-commerce ndash sites de venda pela Internet) onde o conteuacutedo
apresentado eacute gerado a partir de informaccedilotildees acessadas de um banco de dados ou
outra fonte externa Sua interface permite que se incluam comandos PHP
diretamente na paacutegina HTML
O PHP sucede de um produto mais antigo chamado PHPFI PHPFI foi
criado por Rasmus Lerdorf em 1994 inicialmente como scripts (arquivos texto com
um conjunto de instruccedilotildees de uma linguagem especiacutefica nos quais estatildeo contidas
todas as instruccedilotildees que dizem o que o programa faraacute) usados para gerar estatiacutesticas
de acesso para seu curriacuteculo on line Ele nomeou esta seacuterie de scripts de ldquoPersonal
Home Page Toolsrdquo a qual adquiriu um relativo ecircxito devido a outras pessoas
pedirem a Rasmus que lhes permitisse utilizar os seus programas nas suas proacuteprias
paacuteginas Web Como mais funcionalidades foram requeridas Rasmus escreveu uma
implementaccedilatildeo em linguagem C muito maior que era capaz de comunicar-se com
uma base de dados e possibilitava a usuaacuterios o desenvolvimento simples de
aplicativos dinacircmicos para Web Devido agrave aceitaccedilatildeo do primeiro PHP e de maneira
adicional o seu criador desenhou um sistema para processar formulaacuterios ao qual
13
deu o nome de FI (Form Interpreter) e o conjunto destas duas ferramentas seria a
primeira versatildeo compacta da linguagem PHPFI Rasmus resolveu distribuir o
coacutedigo fonte do PHPFI para que todos pudessem ver e tambeacutem usaacute-lo bem como
corrigir bugs e melhorar o coacutedigo (HISTOacuteRIA 2004)
O PHPFI usava interpretaccedilotildees automaacuteticas de variaacuteveis vindas de formulaacuterio
(dados passados pelos usuaacuterios) e era embutida diretamente no coacutedigo do HTML
Poreacutem a sua sintaxe era limitada simples e um pouco inconsistente
Em 1997 PHPFI 20 a segunda versatildeo da implementaccedilatildeo em linguagem C
obteve milhares de usuaacuterios ao redor do mundo com um valor estimado de
aproximadamente 50000 domiacutenios respondendo por basicamente 1 dos domiacutenios
da Internet Enquanto isto havia milhares de pessoas contribuindo com pequenos
coacutedigos para o projeto e ainda assim o PHPFI 20 foi oficialmente lanccedilado somente
ao final de 1997 apoacutes perder a maior parte de sua vida em versotildees beta (versotildees de
um produto que satildeo distribuiacutedas para teste dos usuaacuterios antes do lanccedilamento
oficial) O PHPFI 20 foi rapidamente substituiacutedo pelas versotildees iniciais do PHP 30
(HISTOacuteRIA 2004)
O PHP 30 foi a primeira versatildeo que se assemelha ao PHP que eacute utilizado
atualmente Ela foi criada por Andi Gutmans e Zeev Suraski em 1997 e foi
totalmente reescrito apoacutes eles descobrirem que o PHPFI 20 poderia ajudaacute-los a
desenvolver suas proacuteprias aplicaccedilotildees de e-Commerce de um projeto na sua
Universidade No esforccedilo cooperativo e iniciativa de reescrever o PHPFI a partir da
base existente Andi Rasmus e Zeev decidiram unir esforccedilos e anunciar o PHP 30
como uma versatildeo oficial de seu antecessor (o PHPFI 20) (HISTOacuteRIA 2004)
O PHP 30 aleacutem de oferecer aos usuaacuterios finais uma infraestrutura soacutelida
para diversos bancos de dados protocolos e APIs a extensibilidade (possibilidade
de uso para diversos objetivos) do PHP 30 atrai dezenas de novos desenvolvedores
para se juntar e submeter novos moacutedulos Esta eacute a chave do sucesso do PHP 30
Outras caracteriacutesticas chaves introduzidas no PHP 30 foram o suporte agrave sintaxe
para orientaccedilatildeo a objetos e uma sintaxe muito mais poderosa e consistente
O PHP 30 foi oficialmente lanccedilado em Junho de 1998 depois de ter passado
aproximadamente 9 meses em testes puacuteblicos (versotildees beta) Os objetivos do
projeto eram melhorar a performance de aplicaccedilotildees complexas e melhorar a
modularidade do coacutedigo base do PHP
14
O PHP 40 acompanhado com uma seacuterie de novas caracteriacutesticas foi
oficialmente lanccedilada no iniacutecio de 2000 quase dois anos apoacutes o seu antecessor
Aleacutem da melhora na performance esta versatildeo incluiu outras caracteriacutesticas chave
como o suporte para muitos servidores Web sessotildees HTTP buffer de saiacuteda e
maneiras mais seguras de manipular entrada de dados dos usuaacuterios (HISTOacuteRIA
2004)
De acordo com o site oficial do PHP (phpnetusagephp) atualmente
aproximadamente 17 milhotildees de domiacutenios estatildeo usando PHP na Web
2121 PHP - Por que utilizar
A popularidade do PHP continua crescendo rapidamente devido a muitas
vantagens Eacute raacutepido pois devido a estar embutido no coacutedigo HTML o tempo para
processar e carregar uma paacutegina Web eacute curto Eacute graacutetis e faacutecil de usar pois os
coacutedigos PHP satildeo facilmente incluiacutedos no arquivo HTML eacute versaacutetil pois o PHP roda
em uma grande variedade de sistemas operacionais eacute muito seguro pois se o
coacutedigo for escrito corretamente o usuaacuterio natildeo iraacute enxergar o coacutedigo PHP aleacutem de
ser customizaacutevel pois a licenccedila open-source permite aos programadores
modificarem o PHP adicionando ou modificando as caracteriacutesticas necessaacuterias ao
seu proacuteprio desenvolvimento
Devido ao PHP ser executado no servidor ele pode dinamicamente criar o
coacutedigo HTML que iraacute gerar a paacutegina Web permitindo que os usuaacuterios individuais
vejam paacuteginas customizadas Os visitantes da paacutegina Web vecircem a saiacuteda gerada
pelos scripts mas natildeo os scripts propriamente ditos tornando-o muito seguro
O PHP consegue trabalhar com ldquosessotildeesrdquo ou seja para executar
determinadas accedilotildees (fazer um download por exemplo) o usuaacuterio deve estar
identificado no site O PHP permite que se crie uma ldquosessatildeordquo que identifica cada
usuaacuterio no sistema aleacutem de outros dados referentes ao mesmo Se o usuaacuterio tentar
entrar em uma paacutegina especiacutefica primeiramente eacute verificado se existe uma sessatildeo
para o mesmo Se natildeo existir eacute mostrada uma mensagem de acesso proibido Se a
sessatildeo for vaacutelida os outros paracircmetros do usuaacuterio (salvos na sessatildeo) podem ser
verificados e validados caso necessaacuterio
2122 PHP - Como Funciona
15
Segundo Janet Valade (VALADE2004) O coacutedigo PHP eacute embutido no coacutedigo
HTML As tags do HTML satildeo usadas para incluir a linguagem PHP na linguagem
HTML Quando o PHP estaacute instalado o servidor Web eacute configurado para procurar
por coacutedigo PHP embutido em arquivos com extensotildees especiacuteficas (php ou phtml)
Quando o servidor recebe uma requisiccedilatildeo para um arquivo com uma dessas
extensotildees ele envia o coacutedigo HTML como estaacute mas o coacutedigo PHP eacute processado
pelo software antes de ser enviado ao solicitante Quando a linguagem PHP eacute
processada a saiacuteda consiste de coacutedigo HTML Os coacutedigos PHP natildeo satildeo incluiacutedos
no HTML enviado ao browser por isso o coacutedigo PHP eacute seguro e transparente para o
usuaacuterio Quando um browser eacute apontado para um arquivo HTML o servidor envia o
arquivo ao browser O browser processa o arquivo e mostra a paacutegina descrita pelos
tags HTML do arquivo Quando um Web browser eacute apontado para um arquivo PHP
o servidor procura por seccedilotildees PHP no arquivo e os processa enviando o resultado
do processamento ao browser Esses satildeo os passos seguidos pelo servidor para
processar um arquivo PHP
1 O servidor inicia a procura no arquivo em modo HTML Ele assume que o
coacutedigo eacute HTML e os envia ao browser sem nenhum processamento
2 O servidor web continua em modo HTML ateacute encontrar um tag de abertura do
PHP (lt)
3 Quando o servidor encontra um tag de abertura do PHP alterna para modo
PHP assume que todos os comandos subsequumlentes satildeo desse tipo e os
executa Se o comando gera uma saiacuteda a envia ao browser
4 O servidor continua em modo PHP ateacute encontrar um tag de fechamento do
PHP (gt)
5 Quando o servidor encontra um tag de fechamento do PHP retorna ao modo
HTML e repete o ciclo
2123 Forma Baacutesica de um Documento PHP
O PHP eacute embutido diretamente no programa HTML Seus comandos satildeo
delimitados pelos tags lt e gt Dentro dos tags de abertura e fechamento do PHP
satildeo incluiacutedos comandos especiacuteficos que satildeo interpretados pela linguagem A sintaxe
eacute bastante parecida com a da linguagem C Por exemplo
ltHTMLgt
16
ltHEADgtltTITLEgtTeste PHPltTITLEgtltHEADgt
ltBODYgt
ltpgt Linha HTML
lt
$id = $_GET[id]
if ($id = 1)
echo ldquoltpgtUsuaacuterio Nordm 1ltpgtrdquo
else
echo ldquoltpgt Usuaacuterio Nordm 2ltpgtrdquo
gt
ltBODYgt
ltHTMLgt
213 Javascript
Javascript eacute uma linguagem criada pela Netscape que serve basicamente
para aumentar os recursos do navegador
Todas as paacuteginas escritas com HTML satildeo estaacuteticas Conseguem fazer com
que o browser apenas leia o que haacute no coacutedigo e reproduza aquele conjunto de
instruccedilotildees Um dos principais recursos do Javascript eacute a possibilidade de fazer com
que a paacutegina HTML seja dinacircmica ou seja capaz de fazer com que o usuaacuterio possa
interagir com a paacutegina ou usar outros recursos para fazer com que o documento
Web se altere sem necessidade de um novo carregamento de paacutegina
O Javascript eacute uma linguagem de programaccedilatildeo que funciona interativamente
com o coacutedigo HTML O Javascript consegue ler entender e manipular os objetos de
uma paacutegina HTML tendo a facilidade necessaacuteria para alteraacute-los automaticamente
quando programado Satildeo inseridos nas paacuteginas de uma maneira peculiar podendo
ter apenas uma aacuterea para scripts ou espalhados pelo coacutedigo do jeito que melhor se
adapte agraves necessidades de cada usuaacuterio Diferentemente da linguagem PHP o
Javascript eacute uma linguagem client-side (as paacuteginas satildeo armazenadas e executadas
na maacutequina cliente) (LOURENCcedilO 2000)
17
22 Programas
221 Fireworks
O Fireworks eacute uma ferramenta de produccedilatildeo graacutefica para criaccedilatildeo de interfaces
e imagens Web com interaccedilatildeo em vaacuterias linguagens scripts (como php cfml html
xml Xhtml) podendo montar sites atraveacutes de desenhos O Fireworks consegue
combinar muito bem recursos vetoriais (como o ajuste de textos recursos praacuteticos
de desenho e ediccedilatildeo de noacutes) com os recursos aplicados a bitmaps ou imagens
(como o tratamento de cores e ferramentas de efeitos)
Tambeacutem permite trabalhar com layouts de sites sendo que pode-se
transformar o layout em uma paacutegina HTML usando o recurso de slices (fatias) O
programa permite que vocecirc divida o layout inteiro em vaacuterias imagens de acordo com
as aacutereas especiacuteficas que se deseja criar Apoacutes essa divisatildeo cada uma dessas aacutereas
eacute exportada com um formato de arquivo e com uma compactaccedilatildeo especiacutefica
podendo gerar o HTML com as imagens (ou fatias) nos seus devidos lugares e
posiccedilotildees ou mesmo exporta-las para o Dreamweaver Sua outra vantagem eacute a
possibilidade de se trabalhar com os behaviors (comportamentos) Com os
bahaviors pode-se criar rollovers (menus interativos) e menus pop ups (menus que
abrem outros sub-menus de acordo com cada item) estilizados
Como o Fireworks foi inicialmente projetado para a Web permite tambeacutem a
exportaccedilatildeo de imagens para a rede Esses recursos incluem a total otimizaccedilatildeo de
cada formato de arquivo a ser exportado bem como GIFS e JPEGS Aleacutem disso
pode-se fazer uma comparaccedilatildeo visual e do tamanho do arquivo simultaneamente
de ateacute 4 formatos ou configuraccedilotildees de exportaccedilotildees e tambeacutem salvar as mesmas
configuraccedilotildees para usar mais tarde em outros arquivos (CARACTERIacuteSTICAS
2004)
222 Dreamweaver
O Dreamweaver eacute um editor profissional de HTML utilizado para projetar
codificar e desenvolver sites paacuteginas e aplicaccedilotildees Web Permite que se trabalhe as
paacuteginas HTML de forma manual ou em um ambiente de ediccedilatildeo visual fornecendo
ferramentas uacuteteis para esses fins O Dreamweaver tambeacutem permite que se construa
aplicaccedilotildees Web dinacircmicas usando linguagens que rodam nos servidores (PHP
nesse caso) (PAGE 2004) Algumas das facilidades do Dreamweaver satildeo
18
bull Administraccedilatildeo remota do site e arquivos fonte localmente
bull Operaccedilatildeo em CSS (Cascade Style Sheets)
bull Geraccedilatildeo automatizada de rotinas em Javascript
bull Formulaacuterios
bull Criaccedilatildeo e uso de templates (modelos)
bull Gerenciamento completo do site e seus componentes (por exemplo se um
arquivo de imagem for movido de um sub-diretoacuterio para outro todo o site eacute
reparado automaticamente)
bull Apresentaccedilatildeo do mapa do site com diferentes niacuteveis de detalhamento
bull Behaviors (comportamentos que depois podem ser reaproveitados) com
rotinas de JavaScript
bull Manipulaccedilatildeo de tabelas
bull Rollover de imagens
bull Administraccedilatildeo do site a partir da barra de menu
bull Reparo automaacutetico do site a partir da mudanccedila de endereccedilo ou nome de
uma miacutedia ou link em geral
23 Banco de Dados
231 MySQL
O MySQL eacute um SGDB (ou sistema gerenciador de banco de dados) que eacute
desenvolvido e distribuiacutedo pela MySQL AB a empresa fundada pelos suecos David
Axmark Allan Larsson e Michael Widenius Ele derivou de outro banco de dados o
mSQL Pelo fato do mesmo natildeo ser raacutepido nem flexiacutevel o suficiente para as suas
necessidades os suecos resolveram criar um novo banco de dados utilizando a
interface API (application programming interface - conjunto de rotinas padronizadas
que a aplicaccedilatildeo utiliza para efetuar seus serviccedilos) do proacuteprio mSQL utilizada para
facilitar a portabilidade de coacutedigos escritos do mSQL para o MySQL
Escrito em C e C++ e testado em vaacuterias plataformas diferentes o MySQL
possui um sistema de alocaccedilatildeo de memoacuteria baseado em processos que permite a
execuccedilatildeo de tarefas paralelas tornando-o extremamente raacutepido e eficiente Ele eacute um
banco de dados do tipo SQL (Structured Query Language) e por isso possui as
caracteriacutesticas dos principais bancos de dados do tipo SQL como operadores e
funccedilotildees agrupamentos joins (junccedilotildees de tabelas) aceita vaacuterios tipos de campos
19
suportando registros de tamanhos fixos ou variaacuteveis controla a seguranccedila dos
dados aleacutem de poder armazenar uma grande quantidade de dados chegando a
quantidades superiores a 50000000 de registros Aleacutem disso o MySQL eacute multi-
usuaacuterio (programas de mais de um usuaacuterio podem estar em execuccedilatildeo) eacute multi-
tarefa (eacute capaz de executar vaacuterios programas simultaneamente mesmo que a
maacutequina possua somente um processador) e open-source
Esse servidor de banco de dados eacute considerado como o mais raacutepido entre os
de sua categoria tanto para grandes volumes de dados como pequenos Poreacutem
como ele foi criado para ser extremamente aacutegil teve-se de descartar certos aspectos
das especificaccedilotildees SQL e foi decidido natildeo se implementar caracteriacutesticas que geram
muita demanda de recursos como os triggers que satildeo uma porccedilatildeo de coacutedigo
armazenado que se executa quando eacute realizada uma operaccedilatildeo (atualizaccedilatildeo
inclusatildeo etc) com o banco de dados Naturalmente comprovar a proacutepria existecircncia
do trigger e executaacute-lo consome recursos e tempo
As principais vantagens do MySQL satildeo a baixa demanda de recursos de
hardware a simplicidade de administraccedilatildeo e a otimizaccedilatildeo para as aplicaccedilotildees tiacutepicas
da web onde ocorrem mais consultas do que atualizaccedilotildees (MySQL 2004)
20
3 DESIGN DO SITE
Atraveacutes de um briefing (anexo 1) pode-se chegar a algumas conclusotildees que
influenciaram na escolha da forma de apresentaccedilatildeo das paacuteginas e levaram a
definiccedilatildeo de quais cores imagens e forma o site seria apresentado aos usuaacuterios
31 DEFINICcedilAtildeO DAS CORES
311 A Teoria das Cores
O que se convencionou chamar de Teoria das Cores de Leonardo da Vinci
satildeo as formulaccedilotildees histoacutericas esparsas contidas em seus escritos e reunidas no livro
Tratado da Pintura e da Paisagem ndash Sombra e Luz que satildeo anotaccedilotildees recolhidas
pelo artista ao longo de anos de observaccedilatildeo e eacute a teoria mais corrente sendo um
dos legados do renascimento para as artes visuais (TEORIA 2004)
312 O Disco Cromaacutetico
O disco cromaacutetico natildeo eacute um instrumento cientiacutefico de classificaccedilatildeo de cores
mas eacute muito uacutetil no entendimento da teoria das cores As cores se dividem em
primaacuterias secundaacuterias e terciaacuterias (TEORIA 2004)
Pode-se reproduzir qualquer sensaccedilatildeo de cor misturando-se aditivamente
diversas quantidades de vermelho azul e verde Por isso conhecem-se essas cores
como cores primaacuterias (ENCARTA 2000) Combinado-se duas cores primaacuterias
obtemos as cores secundaacuterias resultando no laranja (amarelo com vermelho) verde
(azul com amarelo) e violeta (vermelho com azul) As cores terciaacuterias satildeo obtidas
pela mistura de uma primaacuteria com uma ou mais secundaacuterias (TEORIA 2004)
21
A figura 1 apresenta a representaccedilatildeo graacutefica do disco cromaacutetico
FIGURA 1 ndash DISCO CROMAacuteTICO
313 Cores Anaacutelogas
Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores anaacutelogas satildeo as
cores dispostas lado a lado no disco cromaacutetico Satildeo anaacutelogas porque haacute nelas uma
mesma cor baacutesica e satildeo usadas para dar a sensaccedilatildeo de uniformidade Observando
a figura 1 visualiza-se que a cor anaacuteloga do amarelo eacute o laranja por exemplo
314 Cores Complementares Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores complementares
satildeo aquelas que encontram-se sempre em posiccedilotildees opostas no disco cromaacutetico As
cores complementares satildeo usadas para dar forccedila e equiliacutebrio a um trabalho criando
contrastes Observando a figura 1 visualiza-se que a cor complementar do
vermelho eacute o verde e do laranja eacute o azul por exemplo
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
7
O Capiacutetulo 5 apresenta a conclusatildeo do trabalho
8
2 TECNOLOGIAS UTILIZADAS
De acordo com os estudados realizados as seguintes tecnologias foram
utilizadas para o desenvolvimento do site do Gerds
bull Linguagem o HTML ndash Utilizada para fazer o corpo principal das paacuteginas Adotado
por ser gratuito e amplamente utilizado na Internet
o PHP ndash Apesar do conteuacutedo apresentado nas aulas ter sido baseado
em ASP um novo estudo em linguagem PHP foi realizado em
classe e extra classe pois foi utilizado um servidor com sistema
operacional Linux com o servidor de banco de dados Apache que
interpreta somente a linguagem PHP Foi utilizado para tornar as
paacuteginas dinacircmicas e realizar a comunicaccedilatildeo com o banco de
dados
o JavaScript ndash Utilizado para criar funccedilotildees que satildeo executadas na
maacutequina do usuaacuterio Adotado por ser gratuito e amplamente
utilizado na Internet
bull Programas o Fireworks ndash Utilizado para fazer as imagens e construir a parte
visual do site Foi adotado por ser uma ferramenta que permite
trabalhar com layouts de sites de forma raacutepida e faacutecil e ter ampla
compatibilidade com o Dreamweaver
o Dreamweaver ndash Utilizado para a construccedilatildeo do site e a
programaccedilatildeo Adotado por ser uma ferramenta completa e que
permite desenvolver e administrar o site de forma raacutepida e eficiente
bull Banco de Dados o MySQL ndash Utilizado para armazenar os dados do site Adotado por
ser gratuito e amplamente utilizado em aplicaccedilotildees Web
21 Linguagem
211 HTML - HyperText Markup Language
No nuacutecleo de toda paacutegina da Web encontra-se a HyperText Markup
Language uma linguagem de diagramaccedilatildeo baseada em marcadores ou tags
9
(marcas utilizadas pela linguagem html que permitem ao browser formatar o texto
entre as tags de acordo com cada tag especiacutefica) como eacute mais comumente
conhecido A HTML eacute uma linguagem simples baseada em texto e que pode ser
visualizada em qualquer plataforma tanto em navegadores somente texto (como o
Lynx) como em navegadores mais avanccedilados (como Netscape Navigator e Internet
Explorer)
A HTML eacute na verdade apenas texto com coacutedigos de formataccedilatildeo que
especificam diferentes fontes e estilos ou ateacute mesmo outras funccedilotildees mais
avanccediladas Ela eacute muito semelhante aos antigos editores de texto que exigiam a
inserccedilatildeo de tags para especificar tipos em itaacutelico negrito ou sublinhado
O HTML nasceu em 1990 no CERN (European Council for Nuclear Research)
na Suiacuteccedila Seu criador o inglecircs Tim Berners-Lee a concebeu unicamente como uma
linguagem que serviria para interligar computadores do laboratoacuterio e outras
instituiccedilotildees de pesquisa e exibir documentos cientiacuteficos de forma simples e faacutecil de
acessar (STANEK 1996)
Em 1992 com a liberaccedilatildeo da biblioteca de desenvolvimento para WWW
(World Wide Web ou Rede de Alcance Mundial) aconteceu uma grande evoluccedilatildeo o
que foi fundamental para expansatildeo do HTML Essa biblioteca deu origem agrave
construccedilatildeo de vaacuterios browsers e servidores tornando a Web uma ferramenta viaacutevel
O MOSAIC desenvolvido por Marc Andreeson entatildeo do NCSA foi o primeiro
browser multi-plataforma que explorava completamente a capacidade de hipermiacutedia
da Web e que iniciou o crescimento explosivo da mesma Em 1993 o HTML tornou-
se disponiacutevel a milhotildees de usuaacuterios com a liberaccedilatildeo das versotildees para Mac e
Windows (STANEK 1996)
Quanto as suas especificaccedilotildees o HTML percorreu um caminho longo ateacute
chegar agrave sua atual especificaccedilatildeo Atualmente 4 especificaccedilotildees do HTML estatildeo
definidas Cada nova especificaccedilatildeo eacute compatiacutevel com as especificaccedilotildees anteriores e
incluem diversas melhorias A primeira especificaccedilatildeo do HTML que eacute a versatildeo
original foi a HTML 10 Tim Berners-Lee juntamente com David Ragget a
publicaram em 1993 Devido a sua capacidade limitada a versatildeo 10 permitia o
desenvolvimento de documentos baacutesicos Incluiacutea muacuteltiplos niacuteveis de cabeccedilalhos
exibiccedilatildeo de paraacutegrafos navegaccedilatildeo por referecircncias a hipertextos (composiccedilatildeo de
elementos de informaccedilatildeo paraacutegrafos paacuteginas imagens sequumlecircncias musicais etc e
10
ligaccedilotildees entre esses elementos indicando a passagem de um a outro) e
formataccedilotildees especiais para itens de uma lista (STANEK 1996)
A definiccedilatildeo do HTML 20 concluiacuteda em 1995 foi a primeira versatildeo
recomendada pelo IETF ndash Internet Engineering Task Force e se tornou um padratildeo
da Internet Ela oferece um melhor controle sobre os layouts dos textos
apresentados nas paacuteginas aleacutem da inclusatildeo de imagens e formulaacuterios que permite
aos desenvolvedores conseguir a participaccedilatildeo dos usuaacuterios de forma faacutecil e raacutepida
aleacutem de explorar as capacidades multimiacutedias da Web (STANEK 1996)
O HTML 30 de 1996 permite novos formatos de textos Uma de suas
caracteriacutesticas mais importantes eacute a definiccedilatildeo dos tags necessaacuterios para a criaccedilatildeo
de tabelas que permitem que os desenvolvedores apresentem as informaccedilotildees
desejadas formatadas em linhas e colunas (STANEK 1996) Durante o
desenvolvimento do HTML 30 com a rapidez da expansatildeo da Web os esforccedilos de
padronizaccedilatildeo natildeo puderam acompanhar as tendecircncias de desenvolvimento que
exigiam maiores recursos de apresentaccedilatildeo graacutefica do que o HTML 20 podia
fornecer Por isso o HTML 30 acabou natildeo sendo aprovado e em 1997 aprovou-se
uma recomendaccedilatildeo chamada HTML 32 que introduzia recursos de apresentaccedilatildeo
graacutefica no HTML (INTRODUCING 2004)
O HTML 40 de 1998 eacute uma extensatildeo do HTML 32 Essa versatildeo oferece
melhorias nos recursos de acessibilidade Quando o HTML eacute usado de forma
estruturada um documento pode se adaptar a diferentes browsers acomodar
diferentes fontes cores especiais sintetizadores de voz e dispositivos Braille Essa
adaptabilidade permite a pessoas com defeitos fiacutesicos trabalhar de forma facilitada
na Web Essa versatildeo adotou tambeacutem o Universal Character Set que usa o suporte
a convenccedilotildees internacionais permitindo a utilizaccedilatildeo de quase todas as linguagens
do mundo Outra novidade satildeo os frames (dividem a paacutegina em duas ou mais partes
ndash framesets - e satildeo geralmente usados para que um frameset permaneccedila enquanto
outros mudem baseados nos links que o usuaacuterio seleciona) Vaacuterios elementos do
HTML 32 foram considerados deprecados (candidatos a se tornarem obsoletos)
pelo HTML 40 forccedilando uma ecircnfase na separaccedilatildeo da estrutura do documento e na
apresentaccedilatildeo dos elementos que permitem definir cores fontes alinhamento
imagens de fundo e outras caracteriacutesticas da apresentaccedilatildeo da paacutegina que
dependem da plataforma onde a informaccedilatildeo eacute visualizada Essa separaccedilatildeo pocircde ser
realizada graccedilas a CSS (Cascading Style Sheets) que permite a criaccedilatildeo de folhas
11
de estilo aplicaacuteveis a vaacuterias paacuteginas de um site Se um dispositivo limitado natildeo
consegue exibir os estilos definidos no CSS ele pelo menos consegue entender a
estrutura do texto e imagens de forma que mesmo usuaacuterios com menos recursos
podem ter acesso agrave informaccedilatildeo contida na paacutegina (HTML 2004)
2111 Forma Baacutesica de um Documento HTML
Como jaacute foi citado anteriormente o HTML eacute na verdade apenas texto com
coacutedigos de formataccedilatildeo que especificam diferentes fontes e estilos Com a inserccedilatildeo
das tags o texto que estaacute compreendido entre essas marcas assume
caracteriacutesticas diferentes de acordo com cada uma delas
Cada tag informa ao browser como ele deveraacute formatar o texto que deve
estar dentro dos sinais de menor que (lt) e maior que (gt) Por exemplo ltHTMLgt
ltBODYgt
Os tags podem ser uacutenicos ou duplos com iniacutecio e fim Se forem duplos
existiraacute um tag informando que aquela formataccedilatildeo estaacute sendo encerrada Por
exemplo um tag simples pode ser representado por rdquoltbrgtrdquo que indica uma quebra
de linha Jaacute um tag duplo pode ser ltbgtltbgt indicando que o que estiver entre
esses campos deveraacute ser apresentado em negrito
A estrutura de um documento HTML apresenta os seguintes componentes
ltHTMLgt
ltHEADgtltTITLEgtTiacutetulo do DocumentoltTITLEgtltHEADgt
ltBODYgt
texto imagem links ltBODYgt
ltHTMLgt
Todo documento HTML deve estar entre os tags ltHTMLgt e ltHTMLgt A partir
daiacute esses documentos satildeo divididos em duas seccedilotildees principais a seccedilatildeo HEAD e a
seccedilatildeo BODY A HEAD conteacutem informaccedilotildees sobre o documento O tag ltTITLEgt por
exemplo define um tiacutetulo que eacute mostrado no alto da janela do browser Tudo que
estiver contido na seccedilatildeo ltBODYgt seraacute mostrado na janela principal do browser
12
Essa seccedilatildeo pode conter cabeccedilalhos paraacutegrafos listas tabelas links para outros
documentos e imagens
212 PHP - Personal Home Page
Como as paacuteginas em HTML satildeo basicamente apresentaccedilotildees de texto e
imagens com o passar do tempo surgiu a necessidade de uma interaccedilatildeo maior com
o usuaacuterio permitindo que se tivesse um histoacuterico desse usuaacuterio aleacutem da
possibilidade de se mostrar informaccedilotildees personalizadas aos mesmos Para esse
propoacutesito umas das linguagens que surgiram e que tinham forte ligaccedilatildeo com o
HTML foi o PHP
O PHP eacute uma linguagem de server-side (as paacuteginas ficam armazenadas e
satildeo executadas em um servidor onde o site estaacute localizado) e open-source (um
programa que tem seu coacutedigo fonte disponiacutevel para que qualquer pessoa que tenha
uma ideacuteia uma sugestatildeo possa ajudar no seu desenvolvimento) para criaccedilatildeo de
paacuteginas dinacircmicas para a Web Uma paacutegina dinacircmica eacute aquela que interage com o
usuaacuterio de forma que cada usuaacuterio ao visitar a paacutegina veraacute informaccedilotildees
personalizadas Os aplicativos dinacircmicos da Web satildeo predominantes nos sites
comerciais(e-commerce ndash sites de venda pela Internet) onde o conteuacutedo
apresentado eacute gerado a partir de informaccedilotildees acessadas de um banco de dados ou
outra fonte externa Sua interface permite que se incluam comandos PHP
diretamente na paacutegina HTML
O PHP sucede de um produto mais antigo chamado PHPFI PHPFI foi
criado por Rasmus Lerdorf em 1994 inicialmente como scripts (arquivos texto com
um conjunto de instruccedilotildees de uma linguagem especiacutefica nos quais estatildeo contidas
todas as instruccedilotildees que dizem o que o programa faraacute) usados para gerar estatiacutesticas
de acesso para seu curriacuteculo on line Ele nomeou esta seacuterie de scripts de ldquoPersonal
Home Page Toolsrdquo a qual adquiriu um relativo ecircxito devido a outras pessoas
pedirem a Rasmus que lhes permitisse utilizar os seus programas nas suas proacuteprias
paacuteginas Web Como mais funcionalidades foram requeridas Rasmus escreveu uma
implementaccedilatildeo em linguagem C muito maior que era capaz de comunicar-se com
uma base de dados e possibilitava a usuaacuterios o desenvolvimento simples de
aplicativos dinacircmicos para Web Devido agrave aceitaccedilatildeo do primeiro PHP e de maneira
adicional o seu criador desenhou um sistema para processar formulaacuterios ao qual
13
deu o nome de FI (Form Interpreter) e o conjunto destas duas ferramentas seria a
primeira versatildeo compacta da linguagem PHPFI Rasmus resolveu distribuir o
coacutedigo fonte do PHPFI para que todos pudessem ver e tambeacutem usaacute-lo bem como
corrigir bugs e melhorar o coacutedigo (HISTOacuteRIA 2004)
O PHPFI usava interpretaccedilotildees automaacuteticas de variaacuteveis vindas de formulaacuterio
(dados passados pelos usuaacuterios) e era embutida diretamente no coacutedigo do HTML
Poreacutem a sua sintaxe era limitada simples e um pouco inconsistente
Em 1997 PHPFI 20 a segunda versatildeo da implementaccedilatildeo em linguagem C
obteve milhares de usuaacuterios ao redor do mundo com um valor estimado de
aproximadamente 50000 domiacutenios respondendo por basicamente 1 dos domiacutenios
da Internet Enquanto isto havia milhares de pessoas contribuindo com pequenos
coacutedigos para o projeto e ainda assim o PHPFI 20 foi oficialmente lanccedilado somente
ao final de 1997 apoacutes perder a maior parte de sua vida em versotildees beta (versotildees de
um produto que satildeo distribuiacutedas para teste dos usuaacuterios antes do lanccedilamento
oficial) O PHPFI 20 foi rapidamente substituiacutedo pelas versotildees iniciais do PHP 30
(HISTOacuteRIA 2004)
O PHP 30 foi a primeira versatildeo que se assemelha ao PHP que eacute utilizado
atualmente Ela foi criada por Andi Gutmans e Zeev Suraski em 1997 e foi
totalmente reescrito apoacutes eles descobrirem que o PHPFI 20 poderia ajudaacute-los a
desenvolver suas proacuteprias aplicaccedilotildees de e-Commerce de um projeto na sua
Universidade No esforccedilo cooperativo e iniciativa de reescrever o PHPFI a partir da
base existente Andi Rasmus e Zeev decidiram unir esforccedilos e anunciar o PHP 30
como uma versatildeo oficial de seu antecessor (o PHPFI 20) (HISTOacuteRIA 2004)
O PHP 30 aleacutem de oferecer aos usuaacuterios finais uma infraestrutura soacutelida
para diversos bancos de dados protocolos e APIs a extensibilidade (possibilidade
de uso para diversos objetivos) do PHP 30 atrai dezenas de novos desenvolvedores
para se juntar e submeter novos moacutedulos Esta eacute a chave do sucesso do PHP 30
Outras caracteriacutesticas chaves introduzidas no PHP 30 foram o suporte agrave sintaxe
para orientaccedilatildeo a objetos e uma sintaxe muito mais poderosa e consistente
O PHP 30 foi oficialmente lanccedilado em Junho de 1998 depois de ter passado
aproximadamente 9 meses em testes puacuteblicos (versotildees beta) Os objetivos do
projeto eram melhorar a performance de aplicaccedilotildees complexas e melhorar a
modularidade do coacutedigo base do PHP
14
O PHP 40 acompanhado com uma seacuterie de novas caracteriacutesticas foi
oficialmente lanccedilada no iniacutecio de 2000 quase dois anos apoacutes o seu antecessor
Aleacutem da melhora na performance esta versatildeo incluiu outras caracteriacutesticas chave
como o suporte para muitos servidores Web sessotildees HTTP buffer de saiacuteda e
maneiras mais seguras de manipular entrada de dados dos usuaacuterios (HISTOacuteRIA
2004)
De acordo com o site oficial do PHP (phpnetusagephp) atualmente
aproximadamente 17 milhotildees de domiacutenios estatildeo usando PHP na Web
2121 PHP - Por que utilizar
A popularidade do PHP continua crescendo rapidamente devido a muitas
vantagens Eacute raacutepido pois devido a estar embutido no coacutedigo HTML o tempo para
processar e carregar uma paacutegina Web eacute curto Eacute graacutetis e faacutecil de usar pois os
coacutedigos PHP satildeo facilmente incluiacutedos no arquivo HTML eacute versaacutetil pois o PHP roda
em uma grande variedade de sistemas operacionais eacute muito seguro pois se o
coacutedigo for escrito corretamente o usuaacuterio natildeo iraacute enxergar o coacutedigo PHP aleacutem de
ser customizaacutevel pois a licenccedila open-source permite aos programadores
modificarem o PHP adicionando ou modificando as caracteriacutesticas necessaacuterias ao
seu proacuteprio desenvolvimento
Devido ao PHP ser executado no servidor ele pode dinamicamente criar o
coacutedigo HTML que iraacute gerar a paacutegina Web permitindo que os usuaacuterios individuais
vejam paacuteginas customizadas Os visitantes da paacutegina Web vecircem a saiacuteda gerada
pelos scripts mas natildeo os scripts propriamente ditos tornando-o muito seguro
O PHP consegue trabalhar com ldquosessotildeesrdquo ou seja para executar
determinadas accedilotildees (fazer um download por exemplo) o usuaacuterio deve estar
identificado no site O PHP permite que se crie uma ldquosessatildeordquo que identifica cada
usuaacuterio no sistema aleacutem de outros dados referentes ao mesmo Se o usuaacuterio tentar
entrar em uma paacutegina especiacutefica primeiramente eacute verificado se existe uma sessatildeo
para o mesmo Se natildeo existir eacute mostrada uma mensagem de acesso proibido Se a
sessatildeo for vaacutelida os outros paracircmetros do usuaacuterio (salvos na sessatildeo) podem ser
verificados e validados caso necessaacuterio
2122 PHP - Como Funciona
15
Segundo Janet Valade (VALADE2004) O coacutedigo PHP eacute embutido no coacutedigo
HTML As tags do HTML satildeo usadas para incluir a linguagem PHP na linguagem
HTML Quando o PHP estaacute instalado o servidor Web eacute configurado para procurar
por coacutedigo PHP embutido em arquivos com extensotildees especiacuteficas (php ou phtml)
Quando o servidor recebe uma requisiccedilatildeo para um arquivo com uma dessas
extensotildees ele envia o coacutedigo HTML como estaacute mas o coacutedigo PHP eacute processado
pelo software antes de ser enviado ao solicitante Quando a linguagem PHP eacute
processada a saiacuteda consiste de coacutedigo HTML Os coacutedigos PHP natildeo satildeo incluiacutedos
no HTML enviado ao browser por isso o coacutedigo PHP eacute seguro e transparente para o
usuaacuterio Quando um browser eacute apontado para um arquivo HTML o servidor envia o
arquivo ao browser O browser processa o arquivo e mostra a paacutegina descrita pelos
tags HTML do arquivo Quando um Web browser eacute apontado para um arquivo PHP
o servidor procura por seccedilotildees PHP no arquivo e os processa enviando o resultado
do processamento ao browser Esses satildeo os passos seguidos pelo servidor para
processar um arquivo PHP
1 O servidor inicia a procura no arquivo em modo HTML Ele assume que o
coacutedigo eacute HTML e os envia ao browser sem nenhum processamento
2 O servidor web continua em modo HTML ateacute encontrar um tag de abertura do
PHP (lt)
3 Quando o servidor encontra um tag de abertura do PHP alterna para modo
PHP assume que todos os comandos subsequumlentes satildeo desse tipo e os
executa Se o comando gera uma saiacuteda a envia ao browser
4 O servidor continua em modo PHP ateacute encontrar um tag de fechamento do
PHP (gt)
5 Quando o servidor encontra um tag de fechamento do PHP retorna ao modo
HTML e repete o ciclo
2123 Forma Baacutesica de um Documento PHP
O PHP eacute embutido diretamente no programa HTML Seus comandos satildeo
delimitados pelos tags lt e gt Dentro dos tags de abertura e fechamento do PHP
satildeo incluiacutedos comandos especiacuteficos que satildeo interpretados pela linguagem A sintaxe
eacute bastante parecida com a da linguagem C Por exemplo
ltHTMLgt
16
ltHEADgtltTITLEgtTeste PHPltTITLEgtltHEADgt
ltBODYgt
ltpgt Linha HTML
lt
$id = $_GET[id]
if ($id = 1)
echo ldquoltpgtUsuaacuterio Nordm 1ltpgtrdquo
else
echo ldquoltpgt Usuaacuterio Nordm 2ltpgtrdquo
gt
ltBODYgt
ltHTMLgt
213 Javascript
Javascript eacute uma linguagem criada pela Netscape que serve basicamente
para aumentar os recursos do navegador
Todas as paacuteginas escritas com HTML satildeo estaacuteticas Conseguem fazer com
que o browser apenas leia o que haacute no coacutedigo e reproduza aquele conjunto de
instruccedilotildees Um dos principais recursos do Javascript eacute a possibilidade de fazer com
que a paacutegina HTML seja dinacircmica ou seja capaz de fazer com que o usuaacuterio possa
interagir com a paacutegina ou usar outros recursos para fazer com que o documento
Web se altere sem necessidade de um novo carregamento de paacutegina
O Javascript eacute uma linguagem de programaccedilatildeo que funciona interativamente
com o coacutedigo HTML O Javascript consegue ler entender e manipular os objetos de
uma paacutegina HTML tendo a facilidade necessaacuteria para alteraacute-los automaticamente
quando programado Satildeo inseridos nas paacuteginas de uma maneira peculiar podendo
ter apenas uma aacuterea para scripts ou espalhados pelo coacutedigo do jeito que melhor se
adapte agraves necessidades de cada usuaacuterio Diferentemente da linguagem PHP o
Javascript eacute uma linguagem client-side (as paacuteginas satildeo armazenadas e executadas
na maacutequina cliente) (LOURENCcedilO 2000)
17
22 Programas
221 Fireworks
O Fireworks eacute uma ferramenta de produccedilatildeo graacutefica para criaccedilatildeo de interfaces
e imagens Web com interaccedilatildeo em vaacuterias linguagens scripts (como php cfml html
xml Xhtml) podendo montar sites atraveacutes de desenhos O Fireworks consegue
combinar muito bem recursos vetoriais (como o ajuste de textos recursos praacuteticos
de desenho e ediccedilatildeo de noacutes) com os recursos aplicados a bitmaps ou imagens
(como o tratamento de cores e ferramentas de efeitos)
Tambeacutem permite trabalhar com layouts de sites sendo que pode-se
transformar o layout em uma paacutegina HTML usando o recurso de slices (fatias) O
programa permite que vocecirc divida o layout inteiro em vaacuterias imagens de acordo com
as aacutereas especiacuteficas que se deseja criar Apoacutes essa divisatildeo cada uma dessas aacutereas
eacute exportada com um formato de arquivo e com uma compactaccedilatildeo especiacutefica
podendo gerar o HTML com as imagens (ou fatias) nos seus devidos lugares e
posiccedilotildees ou mesmo exporta-las para o Dreamweaver Sua outra vantagem eacute a
possibilidade de se trabalhar com os behaviors (comportamentos) Com os
bahaviors pode-se criar rollovers (menus interativos) e menus pop ups (menus que
abrem outros sub-menus de acordo com cada item) estilizados
Como o Fireworks foi inicialmente projetado para a Web permite tambeacutem a
exportaccedilatildeo de imagens para a rede Esses recursos incluem a total otimizaccedilatildeo de
cada formato de arquivo a ser exportado bem como GIFS e JPEGS Aleacutem disso
pode-se fazer uma comparaccedilatildeo visual e do tamanho do arquivo simultaneamente
de ateacute 4 formatos ou configuraccedilotildees de exportaccedilotildees e tambeacutem salvar as mesmas
configuraccedilotildees para usar mais tarde em outros arquivos (CARACTERIacuteSTICAS
2004)
222 Dreamweaver
O Dreamweaver eacute um editor profissional de HTML utilizado para projetar
codificar e desenvolver sites paacuteginas e aplicaccedilotildees Web Permite que se trabalhe as
paacuteginas HTML de forma manual ou em um ambiente de ediccedilatildeo visual fornecendo
ferramentas uacuteteis para esses fins O Dreamweaver tambeacutem permite que se construa
aplicaccedilotildees Web dinacircmicas usando linguagens que rodam nos servidores (PHP
nesse caso) (PAGE 2004) Algumas das facilidades do Dreamweaver satildeo
18
bull Administraccedilatildeo remota do site e arquivos fonte localmente
bull Operaccedilatildeo em CSS (Cascade Style Sheets)
bull Geraccedilatildeo automatizada de rotinas em Javascript
bull Formulaacuterios
bull Criaccedilatildeo e uso de templates (modelos)
bull Gerenciamento completo do site e seus componentes (por exemplo se um
arquivo de imagem for movido de um sub-diretoacuterio para outro todo o site eacute
reparado automaticamente)
bull Apresentaccedilatildeo do mapa do site com diferentes niacuteveis de detalhamento
bull Behaviors (comportamentos que depois podem ser reaproveitados) com
rotinas de JavaScript
bull Manipulaccedilatildeo de tabelas
bull Rollover de imagens
bull Administraccedilatildeo do site a partir da barra de menu
bull Reparo automaacutetico do site a partir da mudanccedila de endereccedilo ou nome de
uma miacutedia ou link em geral
23 Banco de Dados
231 MySQL
O MySQL eacute um SGDB (ou sistema gerenciador de banco de dados) que eacute
desenvolvido e distribuiacutedo pela MySQL AB a empresa fundada pelos suecos David
Axmark Allan Larsson e Michael Widenius Ele derivou de outro banco de dados o
mSQL Pelo fato do mesmo natildeo ser raacutepido nem flexiacutevel o suficiente para as suas
necessidades os suecos resolveram criar um novo banco de dados utilizando a
interface API (application programming interface - conjunto de rotinas padronizadas
que a aplicaccedilatildeo utiliza para efetuar seus serviccedilos) do proacuteprio mSQL utilizada para
facilitar a portabilidade de coacutedigos escritos do mSQL para o MySQL
Escrito em C e C++ e testado em vaacuterias plataformas diferentes o MySQL
possui um sistema de alocaccedilatildeo de memoacuteria baseado em processos que permite a
execuccedilatildeo de tarefas paralelas tornando-o extremamente raacutepido e eficiente Ele eacute um
banco de dados do tipo SQL (Structured Query Language) e por isso possui as
caracteriacutesticas dos principais bancos de dados do tipo SQL como operadores e
funccedilotildees agrupamentos joins (junccedilotildees de tabelas) aceita vaacuterios tipos de campos
19
suportando registros de tamanhos fixos ou variaacuteveis controla a seguranccedila dos
dados aleacutem de poder armazenar uma grande quantidade de dados chegando a
quantidades superiores a 50000000 de registros Aleacutem disso o MySQL eacute multi-
usuaacuterio (programas de mais de um usuaacuterio podem estar em execuccedilatildeo) eacute multi-
tarefa (eacute capaz de executar vaacuterios programas simultaneamente mesmo que a
maacutequina possua somente um processador) e open-source
Esse servidor de banco de dados eacute considerado como o mais raacutepido entre os
de sua categoria tanto para grandes volumes de dados como pequenos Poreacutem
como ele foi criado para ser extremamente aacutegil teve-se de descartar certos aspectos
das especificaccedilotildees SQL e foi decidido natildeo se implementar caracteriacutesticas que geram
muita demanda de recursos como os triggers que satildeo uma porccedilatildeo de coacutedigo
armazenado que se executa quando eacute realizada uma operaccedilatildeo (atualizaccedilatildeo
inclusatildeo etc) com o banco de dados Naturalmente comprovar a proacutepria existecircncia
do trigger e executaacute-lo consome recursos e tempo
As principais vantagens do MySQL satildeo a baixa demanda de recursos de
hardware a simplicidade de administraccedilatildeo e a otimizaccedilatildeo para as aplicaccedilotildees tiacutepicas
da web onde ocorrem mais consultas do que atualizaccedilotildees (MySQL 2004)
20
3 DESIGN DO SITE
Atraveacutes de um briefing (anexo 1) pode-se chegar a algumas conclusotildees que
influenciaram na escolha da forma de apresentaccedilatildeo das paacuteginas e levaram a
definiccedilatildeo de quais cores imagens e forma o site seria apresentado aos usuaacuterios
31 DEFINICcedilAtildeO DAS CORES
311 A Teoria das Cores
O que se convencionou chamar de Teoria das Cores de Leonardo da Vinci
satildeo as formulaccedilotildees histoacutericas esparsas contidas em seus escritos e reunidas no livro
Tratado da Pintura e da Paisagem ndash Sombra e Luz que satildeo anotaccedilotildees recolhidas
pelo artista ao longo de anos de observaccedilatildeo e eacute a teoria mais corrente sendo um
dos legados do renascimento para as artes visuais (TEORIA 2004)
312 O Disco Cromaacutetico
O disco cromaacutetico natildeo eacute um instrumento cientiacutefico de classificaccedilatildeo de cores
mas eacute muito uacutetil no entendimento da teoria das cores As cores se dividem em
primaacuterias secundaacuterias e terciaacuterias (TEORIA 2004)
Pode-se reproduzir qualquer sensaccedilatildeo de cor misturando-se aditivamente
diversas quantidades de vermelho azul e verde Por isso conhecem-se essas cores
como cores primaacuterias (ENCARTA 2000) Combinado-se duas cores primaacuterias
obtemos as cores secundaacuterias resultando no laranja (amarelo com vermelho) verde
(azul com amarelo) e violeta (vermelho com azul) As cores terciaacuterias satildeo obtidas
pela mistura de uma primaacuteria com uma ou mais secundaacuterias (TEORIA 2004)
21
A figura 1 apresenta a representaccedilatildeo graacutefica do disco cromaacutetico
FIGURA 1 ndash DISCO CROMAacuteTICO
313 Cores Anaacutelogas
Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores anaacutelogas satildeo as
cores dispostas lado a lado no disco cromaacutetico Satildeo anaacutelogas porque haacute nelas uma
mesma cor baacutesica e satildeo usadas para dar a sensaccedilatildeo de uniformidade Observando
a figura 1 visualiza-se que a cor anaacuteloga do amarelo eacute o laranja por exemplo
314 Cores Complementares Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores complementares
satildeo aquelas que encontram-se sempre em posiccedilotildees opostas no disco cromaacutetico As
cores complementares satildeo usadas para dar forccedila e equiliacutebrio a um trabalho criando
contrastes Observando a figura 1 visualiza-se que a cor complementar do
vermelho eacute o verde e do laranja eacute o azul por exemplo
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
8
2 TECNOLOGIAS UTILIZADAS
De acordo com os estudados realizados as seguintes tecnologias foram
utilizadas para o desenvolvimento do site do Gerds
bull Linguagem o HTML ndash Utilizada para fazer o corpo principal das paacuteginas Adotado
por ser gratuito e amplamente utilizado na Internet
o PHP ndash Apesar do conteuacutedo apresentado nas aulas ter sido baseado
em ASP um novo estudo em linguagem PHP foi realizado em
classe e extra classe pois foi utilizado um servidor com sistema
operacional Linux com o servidor de banco de dados Apache que
interpreta somente a linguagem PHP Foi utilizado para tornar as
paacuteginas dinacircmicas e realizar a comunicaccedilatildeo com o banco de
dados
o JavaScript ndash Utilizado para criar funccedilotildees que satildeo executadas na
maacutequina do usuaacuterio Adotado por ser gratuito e amplamente
utilizado na Internet
bull Programas o Fireworks ndash Utilizado para fazer as imagens e construir a parte
visual do site Foi adotado por ser uma ferramenta que permite
trabalhar com layouts de sites de forma raacutepida e faacutecil e ter ampla
compatibilidade com o Dreamweaver
o Dreamweaver ndash Utilizado para a construccedilatildeo do site e a
programaccedilatildeo Adotado por ser uma ferramenta completa e que
permite desenvolver e administrar o site de forma raacutepida e eficiente
bull Banco de Dados o MySQL ndash Utilizado para armazenar os dados do site Adotado por
ser gratuito e amplamente utilizado em aplicaccedilotildees Web
21 Linguagem
211 HTML - HyperText Markup Language
No nuacutecleo de toda paacutegina da Web encontra-se a HyperText Markup
Language uma linguagem de diagramaccedilatildeo baseada em marcadores ou tags
9
(marcas utilizadas pela linguagem html que permitem ao browser formatar o texto
entre as tags de acordo com cada tag especiacutefica) como eacute mais comumente
conhecido A HTML eacute uma linguagem simples baseada em texto e que pode ser
visualizada em qualquer plataforma tanto em navegadores somente texto (como o
Lynx) como em navegadores mais avanccedilados (como Netscape Navigator e Internet
Explorer)
A HTML eacute na verdade apenas texto com coacutedigos de formataccedilatildeo que
especificam diferentes fontes e estilos ou ateacute mesmo outras funccedilotildees mais
avanccediladas Ela eacute muito semelhante aos antigos editores de texto que exigiam a
inserccedilatildeo de tags para especificar tipos em itaacutelico negrito ou sublinhado
O HTML nasceu em 1990 no CERN (European Council for Nuclear Research)
na Suiacuteccedila Seu criador o inglecircs Tim Berners-Lee a concebeu unicamente como uma
linguagem que serviria para interligar computadores do laboratoacuterio e outras
instituiccedilotildees de pesquisa e exibir documentos cientiacuteficos de forma simples e faacutecil de
acessar (STANEK 1996)
Em 1992 com a liberaccedilatildeo da biblioteca de desenvolvimento para WWW
(World Wide Web ou Rede de Alcance Mundial) aconteceu uma grande evoluccedilatildeo o
que foi fundamental para expansatildeo do HTML Essa biblioteca deu origem agrave
construccedilatildeo de vaacuterios browsers e servidores tornando a Web uma ferramenta viaacutevel
O MOSAIC desenvolvido por Marc Andreeson entatildeo do NCSA foi o primeiro
browser multi-plataforma que explorava completamente a capacidade de hipermiacutedia
da Web e que iniciou o crescimento explosivo da mesma Em 1993 o HTML tornou-
se disponiacutevel a milhotildees de usuaacuterios com a liberaccedilatildeo das versotildees para Mac e
Windows (STANEK 1996)
Quanto as suas especificaccedilotildees o HTML percorreu um caminho longo ateacute
chegar agrave sua atual especificaccedilatildeo Atualmente 4 especificaccedilotildees do HTML estatildeo
definidas Cada nova especificaccedilatildeo eacute compatiacutevel com as especificaccedilotildees anteriores e
incluem diversas melhorias A primeira especificaccedilatildeo do HTML que eacute a versatildeo
original foi a HTML 10 Tim Berners-Lee juntamente com David Ragget a
publicaram em 1993 Devido a sua capacidade limitada a versatildeo 10 permitia o
desenvolvimento de documentos baacutesicos Incluiacutea muacuteltiplos niacuteveis de cabeccedilalhos
exibiccedilatildeo de paraacutegrafos navegaccedilatildeo por referecircncias a hipertextos (composiccedilatildeo de
elementos de informaccedilatildeo paraacutegrafos paacuteginas imagens sequumlecircncias musicais etc e
10
ligaccedilotildees entre esses elementos indicando a passagem de um a outro) e
formataccedilotildees especiais para itens de uma lista (STANEK 1996)
A definiccedilatildeo do HTML 20 concluiacuteda em 1995 foi a primeira versatildeo
recomendada pelo IETF ndash Internet Engineering Task Force e se tornou um padratildeo
da Internet Ela oferece um melhor controle sobre os layouts dos textos
apresentados nas paacuteginas aleacutem da inclusatildeo de imagens e formulaacuterios que permite
aos desenvolvedores conseguir a participaccedilatildeo dos usuaacuterios de forma faacutecil e raacutepida
aleacutem de explorar as capacidades multimiacutedias da Web (STANEK 1996)
O HTML 30 de 1996 permite novos formatos de textos Uma de suas
caracteriacutesticas mais importantes eacute a definiccedilatildeo dos tags necessaacuterios para a criaccedilatildeo
de tabelas que permitem que os desenvolvedores apresentem as informaccedilotildees
desejadas formatadas em linhas e colunas (STANEK 1996) Durante o
desenvolvimento do HTML 30 com a rapidez da expansatildeo da Web os esforccedilos de
padronizaccedilatildeo natildeo puderam acompanhar as tendecircncias de desenvolvimento que
exigiam maiores recursos de apresentaccedilatildeo graacutefica do que o HTML 20 podia
fornecer Por isso o HTML 30 acabou natildeo sendo aprovado e em 1997 aprovou-se
uma recomendaccedilatildeo chamada HTML 32 que introduzia recursos de apresentaccedilatildeo
graacutefica no HTML (INTRODUCING 2004)
O HTML 40 de 1998 eacute uma extensatildeo do HTML 32 Essa versatildeo oferece
melhorias nos recursos de acessibilidade Quando o HTML eacute usado de forma
estruturada um documento pode se adaptar a diferentes browsers acomodar
diferentes fontes cores especiais sintetizadores de voz e dispositivos Braille Essa
adaptabilidade permite a pessoas com defeitos fiacutesicos trabalhar de forma facilitada
na Web Essa versatildeo adotou tambeacutem o Universal Character Set que usa o suporte
a convenccedilotildees internacionais permitindo a utilizaccedilatildeo de quase todas as linguagens
do mundo Outra novidade satildeo os frames (dividem a paacutegina em duas ou mais partes
ndash framesets - e satildeo geralmente usados para que um frameset permaneccedila enquanto
outros mudem baseados nos links que o usuaacuterio seleciona) Vaacuterios elementos do
HTML 32 foram considerados deprecados (candidatos a se tornarem obsoletos)
pelo HTML 40 forccedilando uma ecircnfase na separaccedilatildeo da estrutura do documento e na
apresentaccedilatildeo dos elementos que permitem definir cores fontes alinhamento
imagens de fundo e outras caracteriacutesticas da apresentaccedilatildeo da paacutegina que
dependem da plataforma onde a informaccedilatildeo eacute visualizada Essa separaccedilatildeo pocircde ser
realizada graccedilas a CSS (Cascading Style Sheets) que permite a criaccedilatildeo de folhas
11
de estilo aplicaacuteveis a vaacuterias paacuteginas de um site Se um dispositivo limitado natildeo
consegue exibir os estilos definidos no CSS ele pelo menos consegue entender a
estrutura do texto e imagens de forma que mesmo usuaacuterios com menos recursos
podem ter acesso agrave informaccedilatildeo contida na paacutegina (HTML 2004)
2111 Forma Baacutesica de um Documento HTML
Como jaacute foi citado anteriormente o HTML eacute na verdade apenas texto com
coacutedigos de formataccedilatildeo que especificam diferentes fontes e estilos Com a inserccedilatildeo
das tags o texto que estaacute compreendido entre essas marcas assume
caracteriacutesticas diferentes de acordo com cada uma delas
Cada tag informa ao browser como ele deveraacute formatar o texto que deve
estar dentro dos sinais de menor que (lt) e maior que (gt) Por exemplo ltHTMLgt
ltBODYgt
Os tags podem ser uacutenicos ou duplos com iniacutecio e fim Se forem duplos
existiraacute um tag informando que aquela formataccedilatildeo estaacute sendo encerrada Por
exemplo um tag simples pode ser representado por rdquoltbrgtrdquo que indica uma quebra
de linha Jaacute um tag duplo pode ser ltbgtltbgt indicando que o que estiver entre
esses campos deveraacute ser apresentado em negrito
A estrutura de um documento HTML apresenta os seguintes componentes
ltHTMLgt
ltHEADgtltTITLEgtTiacutetulo do DocumentoltTITLEgtltHEADgt
ltBODYgt
texto imagem links ltBODYgt
ltHTMLgt
Todo documento HTML deve estar entre os tags ltHTMLgt e ltHTMLgt A partir
daiacute esses documentos satildeo divididos em duas seccedilotildees principais a seccedilatildeo HEAD e a
seccedilatildeo BODY A HEAD conteacutem informaccedilotildees sobre o documento O tag ltTITLEgt por
exemplo define um tiacutetulo que eacute mostrado no alto da janela do browser Tudo que
estiver contido na seccedilatildeo ltBODYgt seraacute mostrado na janela principal do browser
12
Essa seccedilatildeo pode conter cabeccedilalhos paraacutegrafos listas tabelas links para outros
documentos e imagens
212 PHP - Personal Home Page
Como as paacuteginas em HTML satildeo basicamente apresentaccedilotildees de texto e
imagens com o passar do tempo surgiu a necessidade de uma interaccedilatildeo maior com
o usuaacuterio permitindo que se tivesse um histoacuterico desse usuaacuterio aleacutem da
possibilidade de se mostrar informaccedilotildees personalizadas aos mesmos Para esse
propoacutesito umas das linguagens que surgiram e que tinham forte ligaccedilatildeo com o
HTML foi o PHP
O PHP eacute uma linguagem de server-side (as paacuteginas ficam armazenadas e
satildeo executadas em um servidor onde o site estaacute localizado) e open-source (um
programa que tem seu coacutedigo fonte disponiacutevel para que qualquer pessoa que tenha
uma ideacuteia uma sugestatildeo possa ajudar no seu desenvolvimento) para criaccedilatildeo de
paacuteginas dinacircmicas para a Web Uma paacutegina dinacircmica eacute aquela que interage com o
usuaacuterio de forma que cada usuaacuterio ao visitar a paacutegina veraacute informaccedilotildees
personalizadas Os aplicativos dinacircmicos da Web satildeo predominantes nos sites
comerciais(e-commerce ndash sites de venda pela Internet) onde o conteuacutedo
apresentado eacute gerado a partir de informaccedilotildees acessadas de um banco de dados ou
outra fonte externa Sua interface permite que se incluam comandos PHP
diretamente na paacutegina HTML
O PHP sucede de um produto mais antigo chamado PHPFI PHPFI foi
criado por Rasmus Lerdorf em 1994 inicialmente como scripts (arquivos texto com
um conjunto de instruccedilotildees de uma linguagem especiacutefica nos quais estatildeo contidas
todas as instruccedilotildees que dizem o que o programa faraacute) usados para gerar estatiacutesticas
de acesso para seu curriacuteculo on line Ele nomeou esta seacuterie de scripts de ldquoPersonal
Home Page Toolsrdquo a qual adquiriu um relativo ecircxito devido a outras pessoas
pedirem a Rasmus que lhes permitisse utilizar os seus programas nas suas proacuteprias
paacuteginas Web Como mais funcionalidades foram requeridas Rasmus escreveu uma
implementaccedilatildeo em linguagem C muito maior que era capaz de comunicar-se com
uma base de dados e possibilitava a usuaacuterios o desenvolvimento simples de
aplicativos dinacircmicos para Web Devido agrave aceitaccedilatildeo do primeiro PHP e de maneira
adicional o seu criador desenhou um sistema para processar formulaacuterios ao qual
13
deu o nome de FI (Form Interpreter) e o conjunto destas duas ferramentas seria a
primeira versatildeo compacta da linguagem PHPFI Rasmus resolveu distribuir o
coacutedigo fonte do PHPFI para que todos pudessem ver e tambeacutem usaacute-lo bem como
corrigir bugs e melhorar o coacutedigo (HISTOacuteRIA 2004)
O PHPFI usava interpretaccedilotildees automaacuteticas de variaacuteveis vindas de formulaacuterio
(dados passados pelos usuaacuterios) e era embutida diretamente no coacutedigo do HTML
Poreacutem a sua sintaxe era limitada simples e um pouco inconsistente
Em 1997 PHPFI 20 a segunda versatildeo da implementaccedilatildeo em linguagem C
obteve milhares de usuaacuterios ao redor do mundo com um valor estimado de
aproximadamente 50000 domiacutenios respondendo por basicamente 1 dos domiacutenios
da Internet Enquanto isto havia milhares de pessoas contribuindo com pequenos
coacutedigos para o projeto e ainda assim o PHPFI 20 foi oficialmente lanccedilado somente
ao final de 1997 apoacutes perder a maior parte de sua vida em versotildees beta (versotildees de
um produto que satildeo distribuiacutedas para teste dos usuaacuterios antes do lanccedilamento
oficial) O PHPFI 20 foi rapidamente substituiacutedo pelas versotildees iniciais do PHP 30
(HISTOacuteRIA 2004)
O PHP 30 foi a primeira versatildeo que se assemelha ao PHP que eacute utilizado
atualmente Ela foi criada por Andi Gutmans e Zeev Suraski em 1997 e foi
totalmente reescrito apoacutes eles descobrirem que o PHPFI 20 poderia ajudaacute-los a
desenvolver suas proacuteprias aplicaccedilotildees de e-Commerce de um projeto na sua
Universidade No esforccedilo cooperativo e iniciativa de reescrever o PHPFI a partir da
base existente Andi Rasmus e Zeev decidiram unir esforccedilos e anunciar o PHP 30
como uma versatildeo oficial de seu antecessor (o PHPFI 20) (HISTOacuteRIA 2004)
O PHP 30 aleacutem de oferecer aos usuaacuterios finais uma infraestrutura soacutelida
para diversos bancos de dados protocolos e APIs a extensibilidade (possibilidade
de uso para diversos objetivos) do PHP 30 atrai dezenas de novos desenvolvedores
para se juntar e submeter novos moacutedulos Esta eacute a chave do sucesso do PHP 30
Outras caracteriacutesticas chaves introduzidas no PHP 30 foram o suporte agrave sintaxe
para orientaccedilatildeo a objetos e uma sintaxe muito mais poderosa e consistente
O PHP 30 foi oficialmente lanccedilado em Junho de 1998 depois de ter passado
aproximadamente 9 meses em testes puacuteblicos (versotildees beta) Os objetivos do
projeto eram melhorar a performance de aplicaccedilotildees complexas e melhorar a
modularidade do coacutedigo base do PHP
14
O PHP 40 acompanhado com uma seacuterie de novas caracteriacutesticas foi
oficialmente lanccedilada no iniacutecio de 2000 quase dois anos apoacutes o seu antecessor
Aleacutem da melhora na performance esta versatildeo incluiu outras caracteriacutesticas chave
como o suporte para muitos servidores Web sessotildees HTTP buffer de saiacuteda e
maneiras mais seguras de manipular entrada de dados dos usuaacuterios (HISTOacuteRIA
2004)
De acordo com o site oficial do PHP (phpnetusagephp) atualmente
aproximadamente 17 milhotildees de domiacutenios estatildeo usando PHP na Web
2121 PHP - Por que utilizar
A popularidade do PHP continua crescendo rapidamente devido a muitas
vantagens Eacute raacutepido pois devido a estar embutido no coacutedigo HTML o tempo para
processar e carregar uma paacutegina Web eacute curto Eacute graacutetis e faacutecil de usar pois os
coacutedigos PHP satildeo facilmente incluiacutedos no arquivo HTML eacute versaacutetil pois o PHP roda
em uma grande variedade de sistemas operacionais eacute muito seguro pois se o
coacutedigo for escrito corretamente o usuaacuterio natildeo iraacute enxergar o coacutedigo PHP aleacutem de
ser customizaacutevel pois a licenccedila open-source permite aos programadores
modificarem o PHP adicionando ou modificando as caracteriacutesticas necessaacuterias ao
seu proacuteprio desenvolvimento
Devido ao PHP ser executado no servidor ele pode dinamicamente criar o
coacutedigo HTML que iraacute gerar a paacutegina Web permitindo que os usuaacuterios individuais
vejam paacuteginas customizadas Os visitantes da paacutegina Web vecircem a saiacuteda gerada
pelos scripts mas natildeo os scripts propriamente ditos tornando-o muito seguro
O PHP consegue trabalhar com ldquosessotildeesrdquo ou seja para executar
determinadas accedilotildees (fazer um download por exemplo) o usuaacuterio deve estar
identificado no site O PHP permite que se crie uma ldquosessatildeordquo que identifica cada
usuaacuterio no sistema aleacutem de outros dados referentes ao mesmo Se o usuaacuterio tentar
entrar em uma paacutegina especiacutefica primeiramente eacute verificado se existe uma sessatildeo
para o mesmo Se natildeo existir eacute mostrada uma mensagem de acesso proibido Se a
sessatildeo for vaacutelida os outros paracircmetros do usuaacuterio (salvos na sessatildeo) podem ser
verificados e validados caso necessaacuterio
2122 PHP - Como Funciona
15
Segundo Janet Valade (VALADE2004) O coacutedigo PHP eacute embutido no coacutedigo
HTML As tags do HTML satildeo usadas para incluir a linguagem PHP na linguagem
HTML Quando o PHP estaacute instalado o servidor Web eacute configurado para procurar
por coacutedigo PHP embutido em arquivos com extensotildees especiacuteficas (php ou phtml)
Quando o servidor recebe uma requisiccedilatildeo para um arquivo com uma dessas
extensotildees ele envia o coacutedigo HTML como estaacute mas o coacutedigo PHP eacute processado
pelo software antes de ser enviado ao solicitante Quando a linguagem PHP eacute
processada a saiacuteda consiste de coacutedigo HTML Os coacutedigos PHP natildeo satildeo incluiacutedos
no HTML enviado ao browser por isso o coacutedigo PHP eacute seguro e transparente para o
usuaacuterio Quando um browser eacute apontado para um arquivo HTML o servidor envia o
arquivo ao browser O browser processa o arquivo e mostra a paacutegina descrita pelos
tags HTML do arquivo Quando um Web browser eacute apontado para um arquivo PHP
o servidor procura por seccedilotildees PHP no arquivo e os processa enviando o resultado
do processamento ao browser Esses satildeo os passos seguidos pelo servidor para
processar um arquivo PHP
1 O servidor inicia a procura no arquivo em modo HTML Ele assume que o
coacutedigo eacute HTML e os envia ao browser sem nenhum processamento
2 O servidor web continua em modo HTML ateacute encontrar um tag de abertura do
PHP (lt)
3 Quando o servidor encontra um tag de abertura do PHP alterna para modo
PHP assume que todos os comandos subsequumlentes satildeo desse tipo e os
executa Se o comando gera uma saiacuteda a envia ao browser
4 O servidor continua em modo PHP ateacute encontrar um tag de fechamento do
PHP (gt)
5 Quando o servidor encontra um tag de fechamento do PHP retorna ao modo
HTML e repete o ciclo
2123 Forma Baacutesica de um Documento PHP
O PHP eacute embutido diretamente no programa HTML Seus comandos satildeo
delimitados pelos tags lt e gt Dentro dos tags de abertura e fechamento do PHP
satildeo incluiacutedos comandos especiacuteficos que satildeo interpretados pela linguagem A sintaxe
eacute bastante parecida com a da linguagem C Por exemplo
ltHTMLgt
16
ltHEADgtltTITLEgtTeste PHPltTITLEgtltHEADgt
ltBODYgt
ltpgt Linha HTML
lt
$id = $_GET[id]
if ($id = 1)
echo ldquoltpgtUsuaacuterio Nordm 1ltpgtrdquo
else
echo ldquoltpgt Usuaacuterio Nordm 2ltpgtrdquo
gt
ltBODYgt
ltHTMLgt
213 Javascript
Javascript eacute uma linguagem criada pela Netscape que serve basicamente
para aumentar os recursos do navegador
Todas as paacuteginas escritas com HTML satildeo estaacuteticas Conseguem fazer com
que o browser apenas leia o que haacute no coacutedigo e reproduza aquele conjunto de
instruccedilotildees Um dos principais recursos do Javascript eacute a possibilidade de fazer com
que a paacutegina HTML seja dinacircmica ou seja capaz de fazer com que o usuaacuterio possa
interagir com a paacutegina ou usar outros recursos para fazer com que o documento
Web se altere sem necessidade de um novo carregamento de paacutegina
O Javascript eacute uma linguagem de programaccedilatildeo que funciona interativamente
com o coacutedigo HTML O Javascript consegue ler entender e manipular os objetos de
uma paacutegina HTML tendo a facilidade necessaacuteria para alteraacute-los automaticamente
quando programado Satildeo inseridos nas paacuteginas de uma maneira peculiar podendo
ter apenas uma aacuterea para scripts ou espalhados pelo coacutedigo do jeito que melhor se
adapte agraves necessidades de cada usuaacuterio Diferentemente da linguagem PHP o
Javascript eacute uma linguagem client-side (as paacuteginas satildeo armazenadas e executadas
na maacutequina cliente) (LOURENCcedilO 2000)
17
22 Programas
221 Fireworks
O Fireworks eacute uma ferramenta de produccedilatildeo graacutefica para criaccedilatildeo de interfaces
e imagens Web com interaccedilatildeo em vaacuterias linguagens scripts (como php cfml html
xml Xhtml) podendo montar sites atraveacutes de desenhos O Fireworks consegue
combinar muito bem recursos vetoriais (como o ajuste de textos recursos praacuteticos
de desenho e ediccedilatildeo de noacutes) com os recursos aplicados a bitmaps ou imagens
(como o tratamento de cores e ferramentas de efeitos)
Tambeacutem permite trabalhar com layouts de sites sendo que pode-se
transformar o layout em uma paacutegina HTML usando o recurso de slices (fatias) O
programa permite que vocecirc divida o layout inteiro em vaacuterias imagens de acordo com
as aacutereas especiacuteficas que se deseja criar Apoacutes essa divisatildeo cada uma dessas aacutereas
eacute exportada com um formato de arquivo e com uma compactaccedilatildeo especiacutefica
podendo gerar o HTML com as imagens (ou fatias) nos seus devidos lugares e
posiccedilotildees ou mesmo exporta-las para o Dreamweaver Sua outra vantagem eacute a
possibilidade de se trabalhar com os behaviors (comportamentos) Com os
bahaviors pode-se criar rollovers (menus interativos) e menus pop ups (menus que
abrem outros sub-menus de acordo com cada item) estilizados
Como o Fireworks foi inicialmente projetado para a Web permite tambeacutem a
exportaccedilatildeo de imagens para a rede Esses recursos incluem a total otimizaccedilatildeo de
cada formato de arquivo a ser exportado bem como GIFS e JPEGS Aleacutem disso
pode-se fazer uma comparaccedilatildeo visual e do tamanho do arquivo simultaneamente
de ateacute 4 formatos ou configuraccedilotildees de exportaccedilotildees e tambeacutem salvar as mesmas
configuraccedilotildees para usar mais tarde em outros arquivos (CARACTERIacuteSTICAS
2004)
222 Dreamweaver
O Dreamweaver eacute um editor profissional de HTML utilizado para projetar
codificar e desenvolver sites paacuteginas e aplicaccedilotildees Web Permite que se trabalhe as
paacuteginas HTML de forma manual ou em um ambiente de ediccedilatildeo visual fornecendo
ferramentas uacuteteis para esses fins O Dreamweaver tambeacutem permite que se construa
aplicaccedilotildees Web dinacircmicas usando linguagens que rodam nos servidores (PHP
nesse caso) (PAGE 2004) Algumas das facilidades do Dreamweaver satildeo
18
bull Administraccedilatildeo remota do site e arquivos fonte localmente
bull Operaccedilatildeo em CSS (Cascade Style Sheets)
bull Geraccedilatildeo automatizada de rotinas em Javascript
bull Formulaacuterios
bull Criaccedilatildeo e uso de templates (modelos)
bull Gerenciamento completo do site e seus componentes (por exemplo se um
arquivo de imagem for movido de um sub-diretoacuterio para outro todo o site eacute
reparado automaticamente)
bull Apresentaccedilatildeo do mapa do site com diferentes niacuteveis de detalhamento
bull Behaviors (comportamentos que depois podem ser reaproveitados) com
rotinas de JavaScript
bull Manipulaccedilatildeo de tabelas
bull Rollover de imagens
bull Administraccedilatildeo do site a partir da barra de menu
bull Reparo automaacutetico do site a partir da mudanccedila de endereccedilo ou nome de
uma miacutedia ou link em geral
23 Banco de Dados
231 MySQL
O MySQL eacute um SGDB (ou sistema gerenciador de banco de dados) que eacute
desenvolvido e distribuiacutedo pela MySQL AB a empresa fundada pelos suecos David
Axmark Allan Larsson e Michael Widenius Ele derivou de outro banco de dados o
mSQL Pelo fato do mesmo natildeo ser raacutepido nem flexiacutevel o suficiente para as suas
necessidades os suecos resolveram criar um novo banco de dados utilizando a
interface API (application programming interface - conjunto de rotinas padronizadas
que a aplicaccedilatildeo utiliza para efetuar seus serviccedilos) do proacuteprio mSQL utilizada para
facilitar a portabilidade de coacutedigos escritos do mSQL para o MySQL
Escrito em C e C++ e testado em vaacuterias plataformas diferentes o MySQL
possui um sistema de alocaccedilatildeo de memoacuteria baseado em processos que permite a
execuccedilatildeo de tarefas paralelas tornando-o extremamente raacutepido e eficiente Ele eacute um
banco de dados do tipo SQL (Structured Query Language) e por isso possui as
caracteriacutesticas dos principais bancos de dados do tipo SQL como operadores e
funccedilotildees agrupamentos joins (junccedilotildees de tabelas) aceita vaacuterios tipos de campos
19
suportando registros de tamanhos fixos ou variaacuteveis controla a seguranccedila dos
dados aleacutem de poder armazenar uma grande quantidade de dados chegando a
quantidades superiores a 50000000 de registros Aleacutem disso o MySQL eacute multi-
usuaacuterio (programas de mais de um usuaacuterio podem estar em execuccedilatildeo) eacute multi-
tarefa (eacute capaz de executar vaacuterios programas simultaneamente mesmo que a
maacutequina possua somente um processador) e open-source
Esse servidor de banco de dados eacute considerado como o mais raacutepido entre os
de sua categoria tanto para grandes volumes de dados como pequenos Poreacutem
como ele foi criado para ser extremamente aacutegil teve-se de descartar certos aspectos
das especificaccedilotildees SQL e foi decidido natildeo se implementar caracteriacutesticas que geram
muita demanda de recursos como os triggers que satildeo uma porccedilatildeo de coacutedigo
armazenado que se executa quando eacute realizada uma operaccedilatildeo (atualizaccedilatildeo
inclusatildeo etc) com o banco de dados Naturalmente comprovar a proacutepria existecircncia
do trigger e executaacute-lo consome recursos e tempo
As principais vantagens do MySQL satildeo a baixa demanda de recursos de
hardware a simplicidade de administraccedilatildeo e a otimizaccedilatildeo para as aplicaccedilotildees tiacutepicas
da web onde ocorrem mais consultas do que atualizaccedilotildees (MySQL 2004)
20
3 DESIGN DO SITE
Atraveacutes de um briefing (anexo 1) pode-se chegar a algumas conclusotildees que
influenciaram na escolha da forma de apresentaccedilatildeo das paacuteginas e levaram a
definiccedilatildeo de quais cores imagens e forma o site seria apresentado aos usuaacuterios
31 DEFINICcedilAtildeO DAS CORES
311 A Teoria das Cores
O que se convencionou chamar de Teoria das Cores de Leonardo da Vinci
satildeo as formulaccedilotildees histoacutericas esparsas contidas em seus escritos e reunidas no livro
Tratado da Pintura e da Paisagem ndash Sombra e Luz que satildeo anotaccedilotildees recolhidas
pelo artista ao longo de anos de observaccedilatildeo e eacute a teoria mais corrente sendo um
dos legados do renascimento para as artes visuais (TEORIA 2004)
312 O Disco Cromaacutetico
O disco cromaacutetico natildeo eacute um instrumento cientiacutefico de classificaccedilatildeo de cores
mas eacute muito uacutetil no entendimento da teoria das cores As cores se dividem em
primaacuterias secundaacuterias e terciaacuterias (TEORIA 2004)
Pode-se reproduzir qualquer sensaccedilatildeo de cor misturando-se aditivamente
diversas quantidades de vermelho azul e verde Por isso conhecem-se essas cores
como cores primaacuterias (ENCARTA 2000) Combinado-se duas cores primaacuterias
obtemos as cores secundaacuterias resultando no laranja (amarelo com vermelho) verde
(azul com amarelo) e violeta (vermelho com azul) As cores terciaacuterias satildeo obtidas
pela mistura de uma primaacuteria com uma ou mais secundaacuterias (TEORIA 2004)
21
A figura 1 apresenta a representaccedilatildeo graacutefica do disco cromaacutetico
FIGURA 1 ndash DISCO CROMAacuteTICO
313 Cores Anaacutelogas
Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores anaacutelogas satildeo as
cores dispostas lado a lado no disco cromaacutetico Satildeo anaacutelogas porque haacute nelas uma
mesma cor baacutesica e satildeo usadas para dar a sensaccedilatildeo de uniformidade Observando
a figura 1 visualiza-se que a cor anaacuteloga do amarelo eacute o laranja por exemplo
314 Cores Complementares Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores complementares
satildeo aquelas que encontram-se sempre em posiccedilotildees opostas no disco cromaacutetico As
cores complementares satildeo usadas para dar forccedila e equiliacutebrio a um trabalho criando
contrastes Observando a figura 1 visualiza-se que a cor complementar do
vermelho eacute o verde e do laranja eacute o azul por exemplo
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
9
(marcas utilizadas pela linguagem html que permitem ao browser formatar o texto
entre as tags de acordo com cada tag especiacutefica) como eacute mais comumente
conhecido A HTML eacute uma linguagem simples baseada em texto e que pode ser
visualizada em qualquer plataforma tanto em navegadores somente texto (como o
Lynx) como em navegadores mais avanccedilados (como Netscape Navigator e Internet
Explorer)
A HTML eacute na verdade apenas texto com coacutedigos de formataccedilatildeo que
especificam diferentes fontes e estilos ou ateacute mesmo outras funccedilotildees mais
avanccediladas Ela eacute muito semelhante aos antigos editores de texto que exigiam a
inserccedilatildeo de tags para especificar tipos em itaacutelico negrito ou sublinhado
O HTML nasceu em 1990 no CERN (European Council for Nuclear Research)
na Suiacuteccedila Seu criador o inglecircs Tim Berners-Lee a concebeu unicamente como uma
linguagem que serviria para interligar computadores do laboratoacuterio e outras
instituiccedilotildees de pesquisa e exibir documentos cientiacuteficos de forma simples e faacutecil de
acessar (STANEK 1996)
Em 1992 com a liberaccedilatildeo da biblioteca de desenvolvimento para WWW
(World Wide Web ou Rede de Alcance Mundial) aconteceu uma grande evoluccedilatildeo o
que foi fundamental para expansatildeo do HTML Essa biblioteca deu origem agrave
construccedilatildeo de vaacuterios browsers e servidores tornando a Web uma ferramenta viaacutevel
O MOSAIC desenvolvido por Marc Andreeson entatildeo do NCSA foi o primeiro
browser multi-plataforma que explorava completamente a capacidade de hipermiacutedia
da Web e que iniciou o crescimento explosivo da mesma Em 1993 o HTML tornou-
se disponiacutevel a milhotildees de usuaacuterios com a liberaccedilatildeo das versotildees para Mac e
Windows (STANEK 1996)
Quanto as suas especificaccedilotildees o HTML percorreu um caminho longo ateacute
chegar agrave sua atual especificaccedilatildeo Atualmente 4 especificaccedilotildees do HTML estatildeo
definidas Cada nova especificaccedilatildeo eacute compatiacutevel com as especificaccedilotildees anteriores e
incluem diversas melhorias A primeira especificaccedilatildeo do HTML que eacute a versatildeo
original foi a HTML 10 Tim Berners-Lee juntamente com David Ragget a
publicaram em 1993 Devido a sua capacidade limitada a versatildeo 10 permitia o
desenvolvimento de documentos baacutesicos Incluiacutea muacuteltiplos niacuteveis de cabeccedilalhos
exibiccedilatildeo de paraacutegrafos navegaccedilatildeo por referecircncias a hipertextos (composiccedilatildeo de
elementos de informaccedilatildeo paraacutegrafos paacuteginas imagens sequumlecircncias musicais etc e
10
ligaccedilotildees entre esses elementos indicando a passagem de um a outro) e
formataccedilotildees especiais para itens de uma lista (STANEK 1996)
A definiccedilatildeo do HTML 20 concluiacuteda em 1995 foi a primeira versatildeo
recomendada pelo IETF ndash Internet Engineering Task Force e se tornou um padratildeo
da Internet Ela oferece um melhor controle sobre os layouts dos textos
apresentados nas paacuteginas aleacutem da inclusatildeo de imagens e formulaacuterios que permite
aos desenvolvedores conseguir a participaccedilatildeo dos usuaacuterios de forma faacutecil e raacutepida
aleacutem de explorar as capacidades multimiacutedias da Web (STANEK 1996)
O HTML 30 de 1996 permite novos formatos de textos Uma de suas
caracteriacutesticas mais importantes eacute a definiccedilatildeo dos tags necessaacuterios para a criaccedilatildeo
de tabelas que permitem que os desenvolvedores apresentem as informaccedilotildees
desejadas formatadas em linhas e colunas (STANEK 1996) Durante o
desenvolvimento do HTML 30 com a rapidez da expansatildeo da Web os esforccedilos de
padronizaccedilatildeo natildeo puderam acompanhar as tendecircncias de desenvolvimento que
exigiam maiores recursos de apresentaccedilatildeo graacutefica do que o HTML 20 podia
fornecer Por isso o HTML 30 acabou natildeo sendo aprovado e em 1997 aprovou-se
uma recomendaccedilatildeo chamada HTML 32 que introduzia recursos de apresentaccedilatildeo
graacutefica no HTML (INTRODUCING 2004)
O HTML 40 de 1998 eacute uma extensatildeo do HTML 32 Essa versatildeo oferece
melhorias nos recursos de acessibilidade Quando o HTML eacute usado de forma
estruturada um documento pode se adaptar a diferentes browsers acomodar
diferentes fontes cores especiais sintetizadores de voz e dispositivos Braille Essa
adaptabilidade permite a pessoas com defeitos fiacutesicos trabalhar de forma facilitada
na Web Essa versatildeo adotou tambeacutem o Universal Character Set que usa o suporte
a convenccedilotildees internacionais permitindo a utilizaccedilatildeo de quase todas as linguagens
do mundo Outra novidade satildeo os frames (dividem a paacutegina em duas ou mais partes
ndash framesets - e satildeo geralmente usados para que um frameset permaneccedila enquanto
outros mudem baseados nos links que o usuaacuterio seleciona) Vaacuterios elementos do
HTML 32 foram considerados deprecados (candidatos a se tornarem obsoletos)
pelo HTML 40 forccedilando uma ecircnfase na separaccedilatildeo da estrutura do documento e na
apresentaccedilatildeo dos elementos que permitem definir cores fontes alinhamento
imagens de fundo e outras caracteriacutesticas da apresentaccedilatildeo da paacutegina que
dependem da plataforma onde a informaccedilatildeo eacute visualizada Essa separaccedilatildeo pocircde ser
realizada graccedilas a CSS (Cascading Style Sheets) que permite a criaccedilatildeo de folhas
11
de estilo aplicaacuteveis a vaacuterias paacuteginas de um site Se um dispositivo limitado natildeo
consegue exibir os estilos definidos no CSS ele pelo menos consegue entender a
estrutura do texto e imagens de forma que mesmo usuaacuterios com menos recursos
podem ter acesso agrave informaccedilatildeo contida na paacutegina (HTML 2004)
2111 Forma Baacutesica de um Documento HTML
Como jaacute foi citado anteriormente o HTML eacute na verdade apenas texto com
coacutedigos de formataccedilatildeo que especificam diferentes fontes e estilos Com a inserccedilatildeo
das tags o texto que estaacute compreendido entre essas marcas assume
caracteriacutesticas diferentes de acordo com cada uma delas
Cada tag informa ao browser como ele deveraacute formatar o texto que deve
estar dentro dos sinais de menor que (lt) e maior que (gt) Por exemplo ltHTMLgt
ltBODYgt
Os tags podem ser uacutenicos ou duplos com iniacutecio e fim Se forem duplos
existiraacute um tag informando que aquela formataccedilatildeo estaacute sendo encerrada Por
exemplo um tag simples pode ser representado por rdquoltbrgtrdquo que indica uma quebra
de linha Jaacute um tag duplo pode ser ltbgtltbgt indicando que o que estiver entre
esses campos deveraacute ser apresentado em negrito
A estrutura de um documento HTML apresenta os seguintes componentes
ltHTMLgt
ltHEADgtltTITLEgtTiacutetulo do DocumentoltTITLEgtltHEADgt
ltBODYgt
texto imagem links ltBODYgt
ltHTMLgt
Todo documento HTML deve estar entre os tags ltHTMLgt e ltHTMLgt A partir
daiacute esses documentos satildeo divididos em duas seccedilotildees principais a seccedilatildeo HEAD e a
seccedilatildeo BODY A HEAD conteacutem informaccedilotildees sobre o documento O tag ltTITLEgt por
exemplo define um tiacutetulo que eacute mostrado no alto da janela do browser Tudo que
estiver contido na seccedilatildeo ltBODYgt seraacute mostrado na janela principal do browser
12
Essa seccedilatildeo pode conter cabeccedilalhos paraacutegrafos listas tabelas links para outros
documentos e imagens
212 PHP - Personal Home Page
Como as paacuteginas em HTML satildeo basicamente apresentaccedilotildees de texto e
imagens com o passar do tempo surgiu a necessidade de uma interaccedilatildeo maior com
o usuaacuterio permitindo que se tivesse um histoacuterico desse usuaacuterio aleacutem da
possibilidade de se mostrar informaccedilotildees personalizadas aos mesmos Para esse
propoacutesito umas das linguagens que surgiram e que tinham forte ligaccedilatildeo com o
HTML foi o PHP
O PHP eacute uma linguagem de server-side (as paacuteginas ficam armazenadas e
satildeo executadas em um servidor onde o site estaacute localizado) e open-source (um
programa que tem seu coacutedigo fonte disponiacutevel para que qualquer pessoa que tenha
uma ideacuteia uma sugestatildeo possa ajudar no seu desenvolvimento) para criaccedilatildeo de
paacuteginas dinacircmicas para a Web Uma paacutegina dinacircmica eacute aquela que interage com o
usuaacuterio de forma que cada usuaacuterio ao visitar a paacutegina veraacute informaccedilotildees
personalizadas Os aplicativos dinacircmicos da Web satildeo predominantes nos sites
comerciais(e-commerce ndash sites de venda pela Internet) onde o conteuacutedo
apresentado eacute gerado a partir de informaccedilotildees acessadas de um banco de dados ou
outra fonte externa Sua interface permite que se incluam comandos PHP
diretamente na paacutegina HTML
O PHP sucede de um produto mais antigo chamado PHPFI PHPFI foi
criado por Rasmus Lerdorf em 1994 inicialmente como scripts (arquivos texto com
um conjunto de instruccedilotildees de uma linguagem especiacutefica nos quais estatildeo contidas
todas as instruccedilotildees que dizem o que o programa faraacute) usados para gerar estatiacutesticas
de acesso para seu curriacuteculo on line Ele nomeou esta seacuterie de scripts de ldquoPersonal
Home Page Toolsrdquo a qual adquiriu um relativo ecircxito devido a outras pessoas
pedirem a Rasmus que lhes permitisse utilizar os seus programas nas suas proacuteprias
paacuteginas Web Como mais funcionalidades foram requeridas Rasmus escreveu uma
implementaccedilatildeo em linguagem C muito maior que era capaz de comunicar-se com
uma base de dados e possibilitava a usuaacuterios o desenvolvimento simples de
aplicativos dinacircmicos para Web Devido agrave aceitaccedilatildeo do primeiro PHP e de maneira
adicional o seu criador desenhou um sistema para processar formulaacuterios ao qual
13
deu o nome de FI (Form Interpreter) e o conjunto destas duas ferramentas seria a
primeira versatildeo compacta da linguagem PHPFI Rasmus resolveu distribuir o
coacutedigo fonte do PHPFI para que todos pudessem ver e tambeacutem usaacute-lo bem como
corrigir bugs e melhorar o coacutedigo (HISTOacuteRIA 2004)
O PHPFI usava interpretaccedilotildees automaacuteticas de variaacuteveis vindas de formulaacuterio
(dados passados pelos usuaacuterios) e era embutida diretamente no coacutedigo do HTML
Poreacutem a sua sintaxe era limitada simples e um pouco inconsistente
Em 1997 PHPFI 20 a segunda versatildeo da implementaccedilatildeo em linguagem C
obteve milhares de usuaacuterios ao redor do mundo com um valor estimado de
aproximadamente 50000 domiacutenios respondendo por basicamente 1 dos domiacutenios
da Internet Enquanto isto havia milhares de pessoas contribuindo com pequenos
coacutedigos para o projeto e ainda assim o PHPFI 20 foi oficialmente lanccedilado somente
ao final de 1997 apoacutes perder a maior parte de sua vida em versotildees beta (versotildees de
um produto que satildeo distribuiacutedas para teste dos usuaacuterios antes do lanccedilamento
oficial) O PHPFI 20 foi rapidamente substituiacutedo pelas versotildees iniciais do PHP 30
(HISTOacuteRIA 2004)
O PHP 30 foi a primeira versatildeo que se assemelha ao PHP que eacute utilizado
atualmente Ela foi criada por Andi Gutmans e Zeev Suraski em 1997 e foi
totalmente reescrito apoacutes eles descobrirem que o PHPFI 20 poderia ajudaacute-los a
desenvolver suas proacuteprias aplicaccedilotildees de e-Commerce de um projeto na sua
Universidade No esforccedilo cooperativo e iniciativa de reescrever o PHPFI a partir da
base existente Andi Rasmus e Zeev decidiram unir esforccedilos e anunciar o PHP 30
como uma versatildeo oficial de seu antecessor (o PHPFI 20) (HISTOacuteRIA 2004)
O PHP 30 aleacutem de oferecer aos usuaacuterios finais uma infraestrutura soacutelida
para diversos bancos de dados protocolos e APIs a extensibilidade (possibilidade
de uso para diversos objetivos) do PHP 30 atrai dezenas de novos desenvolvedores
para se juntar e submeter novos moacutedulos Esta eacute a chave do sucesso do PHP 30
Outras caracteriacutesticas chaves introduzidas no PHP 30 foram o suporte agrave sintaxe
para orientaccedilatildeo a objetos e uma sintaxe muito mais poderosa e consistente
O PHP 30 foi oficialmente lanccedilado em Junho de 1998 depois de ter passado
aproximadamente 9 meses em testes puacuteblicos (versotildees beta) Os objetivos do
projeto eram melhorar a performance de aplicaccedilotildees complexas e melhorar a
modularidade do coacutedigo base do PHP
14
O PHP 40 acompanhado com uma seacuterie de novas caracteriacutesticas foi
oficialmente lanccedilada no iniacutecio de 2000 quase dois anos apoacutes o seu antecessor
Aleacutem da melhora na performance esta versatildeo incluiu outras caracteriacutesticas chave
como o suporte para muitos servidores Web sessotildees HTTP buffer de saiacuteda e
maneiras mais seguras de manipular entrada de dados dos usuaacuterios (HISTOacuteRIA
2004)
De acordo com o site oficial do PHP (phpnetusagephp) atualmente
aproximadamente 17 milhotildees de domiacutenios estatildeo usando PHP na Web
2121 PHP - Por que utilizar
A popularidade do PHP continua crescendo rapidamente devido a muitas
vantagens Eacute raacutepido pois devido a estar embutido no coacutedigo HTML o tempo para
processar e carregar uma paacutegina Web eacute curto Eacute graacutetis e faacutecil de usar pois os
coacutedigos PHP satildeo facilmente incluiacutedos no arquivo HTML eacute versaacutetil pois o PHP roda
em uma grande variedade de sistemas operacionais eacute muito seguro pois se o
coacutedigo for escrito corretamente o usuaacuterio natildeo iraacute enxergar o coacutedigo PHP aleacutem de
ser customizaacutevel pois a licenccedila open-source permite aos programadores
modificarem o PHP adicionando ou modificando as caracteriacutesticas necessaacuterias ao
seu proacuteprio desenvolvimento
Devido ao PHP ser executado no servidor ele pode dinamicamente criar o
coacutedigo HTML que iraacute gerar a paacutegina Web permitindo que os usuaacuterios individuais
vejam paacuteginas customizadas Os visitantes da paacutegina Web vecircem a saiacuteda gerada
pelos scripts mas natildeo os scripts propriamente ditos tornando-o muito seguro
O PHP consegue trabalhar com ldquosessotildeesrdquo ou seja para executar
determinadas accedilotildees (fazer um download por exemplo) o usuaacuterio deve estar
identificado no site O PHP permite que se crie uma ldquosessatildeordquo que identifica cada
usuaacuterio no sistema aleacutem de outros dados referentes ao mesmo Se o usuaacuterio tentar
entrar em uma paacutegina especiacutefica primeiramente eacute verificado se existe uma sessatildeo
para o mesmo Se natildeo existir eacute mostrada uma mensagem de acesso proibido Se a
sessatildeo for vaacutelida os outros paracircmetros do usuaacuterio (salvos na sessatildeo) podem ser
verificados e validados caso necessaacuterio
2122 PHP - Como Funciona
15
Segundo Janet Valade (VALADE2004) O coacutedigo PHP eacute embutido no coacutedigo
HTML As tags do HTML satildeo usadas para incluir a linguagem PHP na linguagem
HTML Quando o PHP estaacute instalado o servidor Web eacute configurado para procurar
por coacutedigo PHP embutido em arquivos com extensotildees especiacuteficas (php ou phtml)
Quando o servidor recebe uma requisiccedilatildeo para um arquivo com uma dessas
extensotildees ele envia o coacutedigo HTML como estaacute mas o coacutedigo PHP eacute processado
pelo software antes de ser enviado ao solicitante Quando a linguagem PHP eacute
processada a saiacuteda consiste de coacutedigo HTML Os coacutedigos PHP natildeo satildeo incluiacutedos
no HTML enviado ao browser por isso o coacutedigo PHP eacute seguro e transparente para o
usuaacuterio Quando um browser eacute apontado para um arquivo HTML o servidor envia o
arquivo ao browser O browser processa o arquivo e mostra a paacutegina descrita pelos
tags HTML do arquivo Quando um Web browser eacute apontado para um arquivo PHP
o servidor procura por seccedilotildees PHP no arquivo e os processa enviando o resultado
do processamento ao browser Esses satildeo os passos seguidos pelo servidor para
processar um arquivo PHP
1 O servidor inicia a procura no arquivo em modo HTML Ele assume que o
coacutedigo eacute HTML e os envia ao browser sem nenhum processamento
2 O servidor web continua em modo HTML ateacute encontrar um tag de abertura do
PHP (lt)
3 Quando o servidor encontra um tag de abertura do PHP alterna para modo
PHP assume que todos os comandos subsequumlentes satildeo desse tipo e os
executa Se o comando gera uma saiacuteda a envia ao browser
4 O servidor continua em modo PHP ateacute encontrar um tag de fechamento do
PHP (gt)
5 Quando o servidor encontra um tag de fechamento do PHP retorna ao modo
HTML e repete o ciclo
2123 Forma Baacutesica de um Documento PHP
O PHP eacute embutido diretamente no programa HTML Seus comandos satildeo
delimitados pelos tags lt e gt Dentro dos tags de abertura e fechamento do PHP
satildeo incluiacutedos comandos especiacuteficos que satildeo interpretados pela linguagem A sintaxe
eacute bastante parecida com a da linguagem C Por exemplo
ltHTMLgt
16
ltHEADgtltTITLEgtTeste PHPltTITLEgtltHEADgt
ltBODYgt
ltpgt Linha HTML
lt
$id = $_GET[id]
if ($id = 1)
echo ldquoltpgtUsuaacuterio Nordm 1ltpgtrdquo
else
echo ldquoltpgt Usuaacuterio Nordm 2ltpgtrdquo
gt
ltBODYgt
ltHTMLgt
213 Javascript
Javascript eacute uma linguagem criada pela Netscape que serve basicamente
para aumentar os recursos do navegador
Todas as paacuteginas escritas com HTML satildeo estaacuteticas Conseguem fazer com
que o browser apenas leia o que haacute no coacutedigo e reproduza aquele conjunto de
instruccedilotildees Um dos principais recursos do Javascript eacute a possibilidade de fazer com
que a paacutegina HTML seja dinacircmica ou seja capaz de fazer com que o usuaacuterio possa
interagir com a paacutegina ou usar outros recursos para fazer com que o documento
Web se altere sem necessidade de um novo carregamento de paacutegina
O Javascript eacute uma linguagem de programaccedilatildeo que funciona interativamente
com o coacutedigo HTML O Javascript consegue ler entender e manipular os objetos de
uma paacutegina HTML tendo a facilidade necessaacuteria para alteraacute-los automaticamente
quando programado Satildeo inseridos nas paacuteginas de uma maneira peculiar podendo
ter apenas uma aacuterea para scripts ou espalhados pelo coacutedigo do jeito que melhor se
adapte agraves necessidades de cada usuaacuterio Diferentemente da linguagem PHP o
Javascript eacute uma linguagem client-side (as paacuteginas satildeo armazenadas e executadas
na maacutequina cliente) (LOURENCcedilO 2000)
17
22 Programas
221 Fireworks
O Fireworks eacute uma ferramenta de produccedilatildeo graacutefica para criaccedilatildeo de interfaces
e imagens Web com interaccedilatildeo em vaacuterias linguagens scripts (como php cfml html
xml Xhtml) podendo montar sites atraveacutes de desenhos O Fireworks consegue
combinar muito bem recursos vetoriais (como o ajuste de textos recursos praacuteticos
de desenho e ediccedilatildeo de noacutes) com os recursos aplicados a bitmaps ou imagens
(como o tratamento de cores e ferramentas de efeitos)
Tambeacutem permite trabalhar com layouts de sites sendo que pode-se
transformar o layout em uma paacutegina HTML usando o recurso de slices (fatias) O
programa permite que vocecirc divida o layout inteiro em vaacuterias imagens de acordo com
as aacutereas especiacuteficas que se deseja criar Apoacutes essa divisatildeo cada uma dessas aacutereas
eacute exportada com um formato de arquivo e com uma compactaccedilatildeo especiacutefica
podendo gerar o HTML com as imagens (ou fatias) nos seus devidos lugares e
posiccedilotildees ou mesmo exporta-las para o Dreamweaver Sua outra vantagem eacute a
possibilidade de se trabalhar com os behaviors (comportamentos) Com os
bahaviors pode-se criar rollovers (menus interativos) e menus pop ups (menus que
abrem outros sub-menus de acordo com cada item) estilizados
Como o Fireworks foi inicialmente projetado para a Web permite tambeacutem a
exportaccedilatildeo de imagens para a rede Esses recursos incluem a total otimizaccedilatildeo de
cada formato de arquivo a ser exportado bem como GIFS e JPEGS Aleacutem disso
pode-se fazer uma comparaccedilatildeo visual e do tamanho do arquivo simultaneamente
de ateacute 4 formatos ou configuraccedilotildees de exportaccedilotildees e tambeacutem salvar as mesmas
configuraccedilotildees para usar mais tarde em outros arquivos (CARACTERIacuteSTICAS
2004)
222 Dreamweaver
O Dreamweaver eacute um editor profissional de HTML utilizado para projetar
codificar e desenvolver sites paacuteginas e aplicaccedilotildees Web Permite que se trabalhe as
paacuteginas HTML de forma manual ou em um ambiente de ediccedilatildeo visual fornecendo
ferramentas uacuteteis para esses fins O Dreamweaver tambeacutem permite que se construa
aplicaccedilotildees Web dinacircmicas usando linguagens que rodam nos servidores (PHP
nesse caso) (PAGE 2004) Algumas das facilidades do Dreamweaver satildeo
18
bull Administraccedilatildeo remota do site e arquivos fonte localmente
bull Operaccedilatildeo em CSS (Cascade Style Sheets)
bull Geraccedilatildeo automatizada de rotinas em Javascript
bull Formulaacuterios
bull Criaccedilatildeo e uso de templates (modelos)
bull Gerenciamento completo do site e seus componentes (por exemplo se um
arquivo de imagem for movido de um sub-diretoacuterio para outro todo o site eacute
reparado automaticamente)
bull Apresentaccedilatildeo do mapa do site com diferentes niacuteveis de detalhamento
bull Behaviors (comportamentos que depois podem ser reaproveitados) com
rotinas de JavaScript
bull Manipulaccedilatildeo de tabelas
bull Rollover de imagens
bull Administraccedilatildeo do site a partir da barra de menu
bull Reparo automaacutetico do site a partir da mudanccedila de endereccedilo ou nome de
uma miacutedia ou link em geral
23 Banco de Dados
231 MySQL
O MySQL eacute um SGDB (ou sistema gerenciador de banco de dados) que eacute
desenvolvido e distribuiacutedo pela MySQL AB a empresa fundada pelos suecos David
Axmark Allan Larsson e Michael Widenius Ele derivou de outro banco de dados o
mSQL Pelo fato do mesmo natildeo ser raacutepido nem flexiacutevel o suficiente para as suas
necessidades os suecos resolveram criar um novo banco de dados utilizando a
interface API (application programming interface - conjunto de rotinas padronizadas
que a aplicaccedilatildeo utiliza para efetuar seus serviccedilos) do proacuteprio mSQL utilizada para
facilitar a portabilidade de coacutedigos escritos do mSQL para o MySQL
Escrito em C e C++ e testado em vaacuterias plataformas diferentes o MySQL
possui um sistema de alocaccedilatildeo de memoacuteria baseado em processos que permite a
execuccedilatildeo de tarefas paralelas tornando-o extremamente raacutepido e eficiente Ele eacute um
banco de dados do tipo SQL (Structured Query Language) e por isso possui as
caracteriacutesticas dos principais bancos de dados do tipo SQL como operadores e
funccedilotildees agrupamentos joins (junccedilotildees de tabelas) aceita vaacuterios tipos de campos
19
suportando registros de tamanhos fixos ou variaacuteveis controla a seguranccedila dos
dados aleacutem de poder armazenar uma grande quantidade de dados chegando a
quantidades superiores a 50000000 de registros Aleacutem disso o MySQL eacute multi-
usuaacuterio (programas de mais de um usuaacuterio podem estar em execuccedilatildeo) eacute multi-
tarefa (eacute capaz de executar vaacuterios programas simultaneamente mesmo que a
maacutequina possua somente um processador) e open-source
Esse servidor de banco de dados eacute considerado como o mais raacutepido entre os
de sua categoria tanto para grandes volumes de dados como pequenos Poreacutem
como ele foi criado para ser extremamente aacutegil teve-se de descartar certos aspectos
das especificaccedilotildees SQL e foi decidido natildeo se implementar caracteriacutesticas que geram
muita demanda de recursos como os triggers que satildeo uma porccedilatildeo de coacutedigo
armazenado que se executa quando eacute realizada uma operaccedilatildeo (atualizaccedilatildeo
inclusatildeo etc) com o banco de dados Naturalmente comprovar a proacutepria existecircncia
do trigger e executaacute-lo consome recursos e tempo
As principais vantagens do MySQL satildeo a baixa demanda de recursos de
hardware a simplicidade de administraccedilatildeo e a otimizaccedilatildeo para as aplicaccedilotildees tiacutepicas
da web onde ocorrem mais consultas do que atualizaccedilotildees (MySQL 2004)
20
3 DESIGN DO SITE
Atraveacutes de um briefing (anexo 1) pode-se chegar a algumas conclusotildees que
influenciaram na escolha da forma de apresentaccedilatildeo das paacuteginas e levaram a
definiccedilatildeo de quais cores imagens e forma o site seria apresentado aos usuaacuterios
31 DEFINICcedilAtildeO DAS CORES
311 A Teoria das Cores
O que se convencionou chamar de Teoria das Cores de Leonardo da Vinci
satildeo as formulaccedilotildees histoacutericas esparsas contidas em seus escritos e reunidas no livro
Tratado da Pintura e da Paisagem ndash Sombra e Luz que satildeo anotaccedilotildees recolhidas
pelo artista ao longo de anos de observaccedilatildeo e eacute a teoria mais corrente sendo um
dos legados do renascimento para as artes visuais (TEORIA 2004)
312 O Disco Cromaacutetico
O disco cromaacutetico natildeo eacute um instrumento cientiacutefico de classificaccedilatildeo de cores
mas eacute muito uacutetil no entendimento da teoria das cores As cores se dividem em
primaacuterias secundaacuterias e terciaacuterias (TEORIA 2004)
Pode-se reproduzir qualquer sensaccedilatildeo de cor misturando-se aditivamente
diversas quantidades de vermelho azul e verde Por isso conhecem-se essas cores
como cores primaacuterias (ENCARTA 2000) Combinado-se duas cores primaacuterias
obtemos as cores secundaacuterias resultando no laranja (amarelo com vermelho) verde
(azul com amarelo) e violeta (vermelho com azul) As cores terciaacuterias satildeo obtidas
pela mistura de uma primaacuteria com uma ou mais secundaacuterias (TEORIA 2004)
21
A figura 1 apresenta a representaccedilatildeo graacutefica do disco cromaacutetico
FIGURA 1 ndash DISCO CROMAacuteTICO
313 Cores Anaacutelogas
Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores anaacutelogas satildeo as
cores dispostas lado a lado no disco cromaacutetico Satildeo anaacutelogas porque haacute nelas uma
mesma cor baacutesica e satildeo usadas para dar a sensaccedilatildeo de uniformidade Observando
a figura 1 visualiza-se que a cor anaacuteloga do amarelo eacute o laranja por exemplo
314 Cores Complementares Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores complementares
satildeo aquelas que encontram-se sempre em posiccedilotildees opostas no disco cromaacutetico As
cores complementares satildeo usadas para dar forccedila e equiliacutebrio a um trabalho criando
contrastes Observando a figura 1 visualiza-se que a cor complementar do
vermelho eacute o verde e do laranja eacute o azul por exemplo
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
10
ligaccedilotildees entre esses elementos indicando a passagem de um a outro) e
formataccedilotildees especiais para itens de uma lista (STANEK 1996)
A definiccedilatildeo do HTML 20 concluiacuteda em 1995 foi a primeira versatildeo
recomendada pelo IETF ndash Internet Engineering Task Force e se tornou um padratildeo
da Internet Ela oferece um melhor controle sobre os layouts dos textos
apresentados nas paacuteginas aleacutem da inclusatildeo de imagens e formulaacuterios que permite
aos desenvolvedores conseguir a participaccedilatildeo dos usuaacuterios de forma faacutecil e raacutepida
aleacutem de explorar as capacidades multimiacutedias da Web (STANEK 1996)
O HTML 30 de 1996 permite novos formatos de textos Uma de suas
caracteriacutesticas mais importantes eacute a definiccedilatildeo dos tags necessaacuterios para a criaccedilatildeo
de tabelas que permitem que os desenvolvedores apresentem as informaccedilotildees
desejadas formatadas em linhas e colunas (STANEK 1996) Durante o
desenvolvimento do HTML 30 com a rapidez da expansatildeo da Web os esforccedilos de
padronizaccedilatildeo natildeo puderam acompanhar as tendecircncias de desenvolvimento que
exigiam maiores recursos de apresentaccedilatildeo graacutefica do que o HTML 20 podia
fornecer Por isso o HTML 30 acabou natildeo sendo aprovado e em 1997 aprovou-se
uma recomendaccedilatildeo chamada HTML 32 que introduzia recursos de apresentaccedilatildeo
graacutefica no HTML (INTRODUCING 2004)
O HTML 40 de 1998 eacute uma extensatildeo do HTML 32 Essa versatildeo oferece
melhorias nos recursos de acessibilidade Quando o HTML eacute usado de forma
estruturada um documento pode se adaptar a diferentes browsers acomodar
diferentes fontes cores especiais sintetizadores de voz e dispositivos Braille Essa
adaptabilidade permite a pessoas com defeitos fiacutesicos trabalhar de forma facilitada
na Web Essa versatildeo adotou tambeacutem o Universal Character Set que usa o suporte
a convenccedilotildees internacionais permitindo a utilizaccedilatildeo de quase todas as linguagens
do mundo Outra novidade satildeo os frames (dividem a paacutegina em duas ou mais partes
ndash framesets - e satildeo geralmente usados para que um frameset permaneccedila enquanto
outros mudem baseados nos links que o usuaacuterio seleciona) Vaacuterios elementos do
HTML 32 foram considerados deprecados (candidatos a se tornarem obsoletos)
pelo HTML 40 forccedilando uma ecircnfase na separaccedilatildeo da estrutura do documento e na
apresentaccedilatildeo dos elementos que permitem definir cores fontes alinhamento
imagens de fundo e outras caracteriacutesticas da apresentaccedilatildeo da paacutegina que
dependem da plataforma onde a informaccedilatildeo eacute visualizada Essa separaccedilatildeo pocircde ser
realizada graccedilas a CSS (Cascading Style Sheets) que permite a criaccedilatildeo de folhas
11
de estilo aplicaacuteveis a vaacuterias paacuteginas de um site Se um dispositivo limitado natildeo
consegue exibir os estilos definidos no CSS ele pelo menos consegue entender a
estrutura do texto e imagens de forma que mesmo usuaacuterios com menos recursos
podem ter acesso agrave informaccedilatildeo contida na paacutegina (HTML 2004)
2111 Forma Baacutesica de um Documento HTML
Como jaacute foi citado anteriormente o HTML eacute na verdade apenas texto com
coacutedigos de formataccedilatildeo que especificam diferentes fontes e estilos Com a inserccedilatildeo
das tags o texto que estaacute compreendido entre essas marcas assume
caracteriacutesticas diferentes de acordo com cada uma delas
Cada tag informa ao browser como ele deveraacute formatar o texto que deve
estar dentro dos sinais de menor que (lt) e maior que (gt) Por exemplo ltHTMLgt
ltBODYgt
Os tags podem ser uacutenicos ou duplos com iniacutecio e fim Se forem duplos
existiraacute um tag informando que aquela formataccedilatildeo estaacute sendo encerrada Por
exemplo um tag simples pode ser representado por rdquoltbrgtrdquo que indica uma quebra
de linha Jaacute um tag duplo pode ser ltbgtltbgt indicando que o que estiver entre
esses campos deveraacute ser apresentado em negrito
A estrutura de um documento HTML apresenta os seguintes componentes
ltHTMLgt
ltHEADgtltTITLEgtTiacutetulo do DocumentoltTITLEgtltHEADgt
ltBODYgt
texto imagem links ltBODYgt
ltHTMLgt
Todo documento HTML deve estar entre os tags ltHTMLgt e ltHTMLgt A partir
daiacute esses documentos satildeo divididos em duas seccedilotildees principais a seccedilatildeo HEAD e a
seccedilatildeo BODY A HEAD conteacutem informaccedilotildees sobre o documento O tag ltTITLEgt por
exemplo define um tiacutetulo que eacute mostrado no alto da janela do browser Tudo que
estiver contido na seccedilatildeo ltBODYgt seraacute mostrado na janela principal do browser
12
Essa seccedilatildeo pode conter cabeccedilalhos paraacutegrafos listas tabelas links para outros
documentos e imagens
212 PHP - Personal Home Page
Como as paacuteginas em HTML satildeo basicamente apresentaccedilotildees de texto e
imagens com o passar do tempo surgiu a necessidade de uma interaccedilatildeo maior com
o usuaacuterio permitindo que se tivesse um histoacuterico desse usuaacuterio aleacutem da
possibilidade de se mostrar informaccedilotildees personalizadas aos mesmos Para esse
propoacutesito umas das linguagens que surgiram e que tinham forte ligaccedilatildeo com o
HTML foi o PHP
O PHP eacute uma linguagem de server-side (as paacuteginas ficam armazenadas e
satildeo executadas em um servidor onde o site estaacute localizado) e open-source (um
programa que tem seu coacutedigo fonte disponiacutevel para que qualquer pessoa que tenha
uma ideacuteia uma sugestatildeo possa ajudar no seu desenvolvimento) para criaccedilatildeo de
paacuteginas dinacircmicas para a Web Uma paacutegina dinacircmica eacute aquela que interage com o
usuaacuterio de forma que cada usuaacuterio ao visitar a paacutegina veraacute informaccedilotildees
personalizadas Os aplicativos dinacircmicos da Web satildeo predominantes nos sites
comerciais(e-commerce ndash sites de venda pela Internet) onde o conteuacutedo
apresentado eacute gerado a partir de informaccedilotildees acessadas de um banco de dados ou
outra fonte externa Sua interface permite que se incluam comandos PHP
diretamente na paacutegina HTML
O PHP sucede de um produto mais antigo chamado PHPFI PHPFI foi
criado por Rasmus Lerdorf em 1994 inicialmente como scripts (arquivos texto com
um conjunto de instruccedilotildees de uma linguagem especiacutefica nos quais estatildeo contidas
todas as instruccedilotildees que dizem o que o programa faraacute) usados para gerar estatiacutesticas
de acesso para seu curriacuteculo on line Ele nomeou esta seacuterie de scripts de ldquoPersonal
Home Page Toolsrdquo a qual adquiriu um relativo ecircxito devido a outras pessoas
pedirem a Rasmus que lhes permitisse utilizar os seus programas nas suas proacuteprias
paacuteginas Web Como mais funcionalidades foram requeridas Rasmus escreveu uma
implementaccedilatildeo em linguagem C muito maior que era capaz de comunicar-se com
uma base de dados e possibilitava a usuaacuterios o desenvolvimento simples de
aplicativos dinacircmicos para Web Devido agrave aceitaccedilatildeo do primeiro PHP e de maneira
adicional o seu criador desenhou um sistema para processar formulaacuterios ao qual
13
deu o nome de FI (Form Interpreter) e o conjunto destas duas ferramentas seria a
primeira versatildeo compacta da linguagem PHPFI Rasmus resolveu distribuir o
coacutedigo fonte do PHPFI para que todos pudessem ver e tambeacutem usaacute-lo bem como
corrigir bugs e melhorar o coacutedigo (HISTOacuteRIA 2004)
O PHPFI usava interpretaccedilotildees automaacuteticas de variaacuteveis vindas de formulaacuterio
(dados passados pelos usuaacuterios) e era embutida diretamente no coacutedigo do HTML
Poreacutem a sua sintaxe era limitada simples e um pouco inconsistente
Em 1997 PHPFI 20 a segunda versatildeo da implementaccedilatildeo em linguagem C
obteve milhares de usuaacuterios ao redor do mundo com um valor estimado de
aproximadamente 50000 domiacutenios respondendo por basicamente 1 dos domiacutenios
da Internet Enquanto isto havia milhares de pessoas contribuindo com pequenos
coacutedigos para o projeto e ainda assim o PHPFI 20 foi oficialmente lanccedilado somente
ao final de 1997 apoacutes perder a maior parte de sua vida em versotildees beta (versotildees de
um produto que satildeo distribuiacutedas para teste dos usuaacuterios antes do lanccedilamento
oficial) O PHPFI 20 foi rapidamente substituiacutedo pelas versotildees iniciais do PHP 30
(HISTOacuteRIA 2004)
O PHP 30 foi a primeira versatildeo que se assemelha ao PHP que eacute utilizado
atualmente Ela foi criada por Andi Gutmans e Zeev Suraski em 1997 e foi
totalmente reescrito apoacutes eles descobrirem que o PHPFI 20 poderia ajudaacute-los a
desenvolver suas proacuteprias aplicaccedilotildees de e-Commerce de um projeto na sua
Universidade No esforccedilo cooperativo e iniciativa de reescrever o PHPFI a partir da
base existente Andi Rasmus e Zeev decidiram unir esforccedilos e anunciar o PHP 30
como uma versatildeo oficial de seu antecessor (o PHPFI 20) (HISTOacuteRIA 2004)
O PHP 30 aleacutem de oferecer aos usuaacuterios finais uma infraestrutura soacutelida
para diversos bancos de dados protocolos e APIs a extensibilidade (possibilidade
de uso para diversos objetivos) do PHP 30 atrai dezenas de novos desenvolvedores
para se juntar e submeter novos moacutedulos Esta eacute a chave do sucesso do PHP 30
Outras caracteriacutesticas chaves introduzidas no PHP 30 foram o suporte agrave sintaxe
para orientaccedilatildeo a objetos e uma sintaxe muito mais poderosa e consistente
O PHP 30 foi oficialmente lanccedilado em Junho de 1998 depois de ter passado
aproximadamente 9 meses em testes puacuteblicos (versotildees beta) Os objetivos do
projeto eram melhorar a performance de aplicaccedilotildees complexas e melhorar a
modularidade do coacutedigo base do PHP
14
O PHP 40 acompanhado com uma seacuterie de novas caracteriacutesticas foi
oficialmente lanccedilada no iniacutecio de 2000 quase dois anos apoacutes o seu antecessor
Aleacutem da melhora na performance esta versatildeo incluiu outras caracteriacutesticas chave
como o suporte para muitos servidores Web sessotildees HTTP buffer de saiacuteda e
maneiras mais seguras de manipular entrada de dados dos usuaacuterios (HISTOacuteRIA
2004)
De acordo com o site oficial do PHP (phpnetusagephp) atualmente
aproximadamente 17 milhotildees de domiacutenios estatildeo usando PHP na Web
2121 PHP - Por que utilizar
A popularidade do PHP continua crescendo rapidamente devido a muitas
vantagens Eacute raacutepido pois devido a estar embutido no coacutedigo HTML o tempo para
processar e carregar uma paacutegina Web eacute curto Eacute graacutetis e faacutecil de usar pois os
coacutedigos PHP satildeo facilmente incluiacutedos no arquivo HTML eacute versaacutetil pois o PHP roda
em uma grande variedade de sistemas operacionais eacute muito seguro pois se o
coacutedigo for escrito corretamente o usuaacuterio natildeo iraacute enxergar o coacutedigo PHP aleacutem de
ser customizaacutevel pois a licenccedila open-source permite aos programadores
modificarem o PHP adicionando ou modificando as caracteriacutesticas necessaacuterias ao
seu proacuteprio desenvolvimento
Devido ao PHP ser executado no servidor ele pode dinamicamente criar o
coacutedigo HTML que iraacute gerar a paacutegina Web permitindo que os usuaacuterios individuais
vejam paacuteginas customizadas Os visitantes da paacutegina Web vecircem a saiacuteda gerada
pelos scripts mas natildeo os scripts propriamente ditos tornando-o muito seguro
O PHP consegue trabalhar com ldquosessotildeesrdquo ou seja para executar
determinadas accedilotildees (fazer um download por exemplo) o usuaacuterio deve estar
identificado no site O PHP permite que se crie uma ldquosessatildeordquo que identifica cada
usuaacuterio no sistema aleacutem de outros dados referentes ao mesmo Se o usuaacuterio tentar
entrar em uma paacutegina especiacutefica primeiramente eacute verificado se existe uma sessatildeo
para o mesmo Se natildeo existir eacute mostrada uma mensagem de acesso proibido Se a
sessatildeo for vaacutelida os outros paracircmetros do usuaacuterio (salvos na sessatildeo) podem ser
verificados e validados caso necessaacuterio
2122 PHP - Como Funciona
15
Segundo Janet Valade (VALADE2004) O coacutedigo PHP eacute embutido no coacutedigo
HTML As tags do HTML satildeo usadas para incluir a linguagem PHP na linguagem
HTML Quando o PHP estaacute instalado o servidor Web eacute configurado para procurar
por coacutedigo PHP embutido em arquivos com extensotildees especiacuteficas (php ou phtml)
Quando o servidor recebe uma requisiccedilatildeo para um arquivo com uma dessas
extensotildees ele envia o coacutedigo HTML como estaacute mas o coacutedigo PHP eacute processado
pelo software antes de ser enviado ao solicitante Quando a linguagem PHP eacute
processada a saiacuteda consiste de coacutedigo HTML Os coacutedigos PHP natildeo satildeo incluiacutedos
no HTML enviado ao browser por isso o coacutedigo PHP eacute seguro e transparente para o
usuaacuterio Quando um browser eacute apontado para um arquivo HTML o servidor envia o
arquivo ao browser O browser processa o arquivo e mostra a paacutegina descrita pelos
tags HTML do arquivo Quando um Web browser eacute apontado para um arquivo PHP
o servidor procura por seccedilotildees PHP no arquivo e os processa enviando o resultado
do processamento ao browser Esses satildeo os passos seguidos pelo servidor para
processar um arquivo PHP
1 O servidor inicia a procura no arquivo em modo HTML Ele assume que o
coacutedigo eacute HTML e os envia ao browser sem nenhum processamento
2 O servidor web continua em modo HTML ateacute encontrar um tag de abertura do
PHP (lt)
3 Quando o servidor encontra um tag de abertura do PHP alterna para modo
PHP assume que todos os comandos subsequumlentes satildeo desse tipo e os
executa Se o comando gera uma saiacuteda a envia ao browser
4 O servidor continua em modo PHP ateacute encontrar um tag de fechamento do
PHP (gt)
5 Quando o servidor encontra um tag de fechamento do PHP retorna ao modo
HTML e repete o ciclo
2123 Forma Baacutesica de um Documento PHP
O PHP eacute embutido diretamente no programa HTML Seus comandos satildeo
delimitados pelos tags lt e gt Dentro dos tags de abertura e fechamento do PHP
satildeo incluiacutedos comandos especiacuteficos que satildeo interpretados pela linguagem A sintaxe
eacute bastante parecida com a da linguagem C Por exemplo
ltHTMLgt
16
ltHEADgtltTITLEgtTeste PHPltTITLEgtltHEADgt
ltBODYgt
ltpgt Linha HTML
lt
$id = $_GET[id]
if ($id = 1)
echo ldquoltpgtUsuaacuterio Nordm 1ltpgtrdquo
else
echo ldquoltpgt Usuaacuterio Nordm 2ltpgtrdquo
gt
ltBODYgt
ltHTMLgt
213 Javascript
Javascript eacute uma linguagem criada pela Netscape que serve basicamente
para aumentar os recursos do navegador
Todas as paacuteginas escritas com HTML satildeo estaacuteticas Conseguem fazer com
que o browser apenas leia o que haacute no coacutedigo e reproduza aquele conjunto de
instruccedilotildees Um dos principais recursos do Javascript eacute a possibilidade de fazer com
que a paacutegina HTML seja dinacircmica ou seja capaz de fazer com que o usuaacuterio possa
interagir com a paacutegina ou usar outros recursos para fazer com que o documento
Web se altere sem necessidade de um novo carregamento de paacutegina
O Javascript eacute uma linguagem de programaccedilatildeo que funciona interativamente
com o coacutedigo HTML O Javascript consegue ler entender e manipular os objetos de
uma paacutegina HTML tendo a facilidade necessaacuteria para alteraacute-los automaticamente
quando programado Satildeo inseridos nas paacuteginas de uma maneira peculiar podendo
ter apenas uma aacuterea para scripts ou espalhados pelo coacutedigo do jeito que melhor se
adapte agraves necessidades de cada usuaacuterio Diferentemente da linguagem PHP o
Javascript eacute uma linguagem client-side (as paacuteginas satildeo armazenadas e executadas
na maacutequina cliente) (LOURENCcedilO 2000)
17
22 Programas
221 Fireworks
O Fireworks eacute uma ferramenta de produccedilatildeo graacutefica para criaccedilatildeo de interfaces
e imagens Web com interaccedilatildeo em vaacuterias linguagens scripts (como php cfml html
xml Xhtml) podendo montar sites atraveacutes de desenhos O Fireworks consegue
combinar muito bem recursos vetoriais (como o ajuste de textos recursos praacuteticos
de desenho e ediccedilatildeo de noacutes) com os recursos aplicados a bitmaps ou imagens
(como o tratamento de cores e ferramentas de efeitos)
Tambeacutem permite trabalhar com layouts de sites sendo que pode-se
transformar o layout em uma paacutegina HTML usando o recurso de slices (fatias) O
programa permite que vocecirc divida o layout inteiro em vaacuterias imagens de acordo com
as aacutereas especiacuteficas que se deseja criar Apoacutes essa divisatildeo cada uma dessas aacutereas
eacute exportada com um formato de arquivo e com uma compactaccedilatildeo especiacutefica
podendo gerar o HTML com as imagens (ou fatias) nos seus devidos lugares e
posiccedilotildees ou mesmo exporta-las para o Dreamweaver Sua outra vantagem eacute a
possibilidade de se trabalhar com os behaviors (comportamentos) Com os
bahaviors pode-se criar rollovers (menus interativos) e menus pop ups (menus que
abrem outros sub-menus de acordo com cada item) estilizados
Como o Fireworks foi inicialmente projetado para a Web permite tambeacutem a
exportaccedilatildeo de imagens para a rede Esses recursos incluem a total otimizaccedilatildeo de
cada formato de arquivo a ser exportado bem como GIFS e JPEGS Aleacutem disso
pode-se fazer uma comparaccedilatildeo visual e do tamanho do arquivo simultaneamente
de ateacute 4 formatos ou configuraccedilotildees de exportaccedilotildees e tambeacutem salvar as mesmas
configuraccedilotildees para usar mais tarde em outros arquivos (CARACTERIacuteSTICAS
2004)
222 Dreamweaver
O Dreamweaver eacute um editor profissional de HTML utilizado para projetar
codificar e desenvolver sites paacuteginas e aplicaccedilotildees Web Permite que se trabalhe as
paacuteginas HTML de forma manual ou em um ambiente de ediccedilatildeo visual fornecendo
ferramentas uacuteteis para esses fins O Dreamweaver tambeacutem permite que se construa
aplicaccedilotildees Web dinacircmicas usando linguagens que rodam nos servidores (PHP
nesse caso) (PAGE 2004) Algumas das facilidades do Dreamweaver satildeo
18
bull Administraccedilatildeo remota do site e arquivos fonte localmente
bull Operaccedilatildeo em CSS (Cascade Style Sheets)
bull Geraccedilatildeo automatizada de rotinas em Javascript
bull Formulaacuterios
bull Criaccedilatildeo e uso de templates (modelos)
bull Gerenciamento completo do site e seus componentes (por exemplo se um
arquivo de imagem for movido de um sub-diretoacuterio para outro todo o site eacute
reparado automaticamente)
bull Apresentaccedilatildeo do mapa do site com diferentes niacuteveis de detalhamento
bull Behaviors (comportamentos que depois podem ser reaproveitados) com
rotinas de JavaScript
bull Manipulaccedilatildeo de tabelas
bull Rollover de imagens
bull Administraccedilatildeo do site a partir da barra de menu
bull Reparo automaacutetico do site a partir da mudanccedila de endereccedilo ou nome de
uma miacutedia ou link em geral
23 Banco de Dados
231 MySQL
O MySQL eacute um SGDB (ou sistema gerenciador de banco de dados) que eacute
desenvolvido e distribuiacutedo pela MySQL AB a empresa fundada pelos suecos David
Axmark Allan Larsson e Michael Widenius Ele derivou de outro banco de dados o
mSQL Pelo fato do mesmo natildeo ser raacutepido nem flexiacutevel o suficiente para as suas
necessidades os suecos resolveram criar um novo banco de dados utilizando a
interface API (application programming interface - conjunto de rotinas padronizadas
que a aplicaccedilatildeo utiliza para efetuar seus serviccedilos) do proacuteprio mSQL utilizada para
facilitar a portabilidade de coacutedigos escritos do mSQL para o MySQL
Escrito em C e C++ e testado em vaacuterias plataformas diferentes o MySQL
possui um sistema de alocaccedilatildeo de memoacuteria baseado em processos que permite a
execuccedilatildeo de tarefas paralelas tornando-o extremamente raacutepido e eficiente Ele eacute um
banco de dados do tipo SQL (Structured Query Language) e por isso possui as
caracteriacutesticas dos principais bancos de dados do tipo SQL como operadores e
funccedilotildees agrupamentos joins (junccedilotildees de tabelas) aceita vaacuterios tipos de campos
19
suportando registros de tamanhos fixos ou variaacuteveis controla a seguranccedila dos
dados aleacutem de poder armazenar uma grande quantidade de dados chegando a
quantidades superiores a 50000000 de registros Aleacutem disso o MySQL eacute multi-
usuaacuterio (programas de mais de um usuaacuterio podem estar em execuccedilatildeo) eacute multi-
tarefa (eacute capaz de executar vaacuterios programas simultaneamente mesmo que a
maacutequina possua somente um processador) e open-source
Esse servidor de banco de dados eacute considerado como o mais raacutepido entre os
de sua categoria tanto para grandes volumes de dados como pequenos Poreacutem
como ele foi criado para ser extremamente aacutegil teve-se de descartar certos aspectos
das especificaccedilotildees SQL e foi decidido natildeo se implementar caracteriacutesticas que geram
muita demanda de recursos como os triggers que satildeo uma porccedilatildeo de coacutedigo
armazenado que se executa quando eacute realizada uma operaccedilatildeo (atualizaccedilatildeo
inclusatildeo etc) com o banco de dados Naturalmente comprovar a proacutepria existecircncia
do trigger e executaacute-lo consome recursos e tempo
As principais vantagens do MySQL satildeo a baixa demanda de recursos de
hardware a simplicidade de administraccedilatildeo e a otimizaccedilatildeo para as aplicaccedilotildees tiacutepicas
da web onde ocorrem mais consultas do que atualizaccedilotildees (MySQL 2004)
20
3 DESIGN DO SITE
Atraveacutes de um briefing (anexo 1) pode-se chegar a algumas conclusotildees que
influenciaram na escolha da forma de apresentaccedilatildeo das paacuteginas e levaram a
definiccedilatildeo de quais cores imagens e forma o site seria apresentado aos usuaacuterios
31 DEFINICcedilAtildeO DAS CORES
311 A Teoria das Cores
O que se convencionou chamar de Teoria das Cores de Leonardo da Vinci
satildeo as formulaccedilotildees histoacutericas esparsas contidas em seus escritos e reunidas no livro
Tratado da Pintura e da Paisagem ndash Sombra e Luz que satildeo anotaccedilotildees recolhidas
pelo artista ao longo de anos de observaccedilatildeo e eacute a teoria mais corrente sendo um
dos legados do renascimento para as artes visuais (TEORIA 2004)
312 O Disco Cromaacutetico
O disco cromaacutetico natildeo eacute um instrumento cientiacutefico de classificaccedilatildeo de cores
mas eacute muito uacutetil no entendimento da teoria das cores As cores se dividem em
primaacuterias secundaacuterias e terciaacuterias (TEORIA 2004)
Pode-se reproduzir qualquer sensaccedilatildeo de cor misturando-se aditivamente
diversas quantidades de vermelho azul e verde Por isso conhecem-se essas cores
como cores primaacuterias (ENCARTA 2000) Combinado-se duas cores primaacuterias
obtemos as cores secundaacuterias resultando no laranja (amarelo com vermelho) verde
(azul com amarelo) e violeta (vermelho com azul) As cores terciaacuterias satildeo obtidas
pela mistura de uma primaacuteria com uma ou mais secundaacuterias (TEORIA 2004)
21
A figura 1 apresenta a representaccedilatildeo graacutefica do disco cromaacutetico
FIGURA 1 ndash DISCO CROMAacuteTICO
313 Cores Anaacutelogas
Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores anaacutelogas satildeo as
cores dispostas lado a lado no disco cromaacutetico Satildeo anaacutelogas porque haacute nelas uma
mesma cor baacutesica e satildeo usadas para dar a sensaccedilatildeo de uniformidade Observando
a figura 1 visualiza-se que a cor anaacuteloga do amarelo eacute o laranja por exemplo
314 Cores Complementares Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores complementares
satildeo aquelas que encontram-se sempre em posiccedilotildees opostas no disco cromaacutetico As
cores complementares satildeo usadas para dar forccedila e equiliacutebrio a um trabalho criando
contrastes Observando a figura 1 visualiza-se que a cor complementar do
vermelho eacute o verde e do laranja eacute o azul por exemplo
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
11
de estilo aplicaacuteveis a vaacuterias paacuteginas de um site Se um dispositivo limitado natildeo
consegue exibir os estilos definidos no CSS ele pelo menos consegue entender a
estrutura do texto e imagens de forma que mesmo usuaacuterios com menos recursos
podem ter acesso agrave informaccedilatildeo contida na paacutegina (HTML 2004)
2111 Forma Baacutesica de um Documento HTML
Como jaacute foi citado anteriormente o HTML eacute na verdade apenas texto com
coacutedigos de formataccedilatildeo que especificam diferentes fontes e estilos Com a inserccedilatildeo
das tags o texto que estaacute compreendido entre essas marcas assume
caracteriacutesticas diferentes de acordo com cada uma delas
Cada tag informa ao browser como ele deveraacute formatar o texto que deve
estar dentro dos sinais de menor que (lt) e maior que (gt) Por exemplo ltHTMLgt
ltBODYgt
Os tags podem ser uacutenicos ou duplos com iniacutecio e fim Se forem duplos
existiraacute um tag informando que aquela formataccedilatildeo estaacute sendo encerrada Por
exemplo um tag simples pode ser representado por rdquoltbrgtrdquo que indica uma quebra
de linha Jaacute um tag duplo pode ser ltbgtltbgt indicando que o que estiver entre
esses campos deveraacute ser apresentado em negrito
A estrutura de um documento HTML apresenta os seguintes componentes
ltHTMLgt
ltHEADgtltTITLEgtTiacutetulo do DocumentoltTITLEgtltHEADgt
ltBODYgt
texto imagem links ltBODYgt
ltHTMLgt
Todo documento HTML deve estar entre os tags ltHTMLgt e ltHTMLgt A partir
daiacute esses documentos satildeo divididos em duas seccedilotildees principais a seccedilatildeo HEAD e a
seccedilatildeo BODY A HEAD conteacutem informaccedilotildees sobre o documento O tag ltTITLEgt por
exemplo define um tiacutetulo que eacute mostrado no alto da janela do browser Tudo que
estiver contido na seccedilatildeo ltBODYgt seraacute mostrado na janela principal do browser
12
Essa seccedilatildeo pode conter cabeccedilalhos paraacutegrafos listas tabelas links para outros
documentos e imagens
212 PHP - Personal Home Page
Como as paacuteginas em HTML satildeo basicamente apresentaccedilotildees de texto e
imagens com o passar do tempo surgiu a necessidade de uma interaccedilatildeo maior com
o usuaacuterio permitindo que se tivesse um histoacuterico desse usuaacuterio aleacutem da
possibilidade de se mostrar informaccedilotildees personalizadas aos mesmos Para esse
propoacutesito umas das linguagens que surgiram e que tinham forte ligaccedilatildeo com o
HTML foi o PHP
O PHP eacute uma linguagem de server-side (as paacuteginas ficam armazenadas e
satildeo executadas em um servidor onde o site estaacute localizado) e open-source (um
programa que tem seu coacutedigo fonte disponiacutevel para que qualquer pessoa que tenha
uma ideacuteia uma sugestatildeo possa ajudar no seu desenvolvimento) para criaccedilatildeo de
paacuteginas dinacircmicas para a Web Uma paacutegina dinacircmica eacute aquela que interage com o
usuaacuterio de forma que cada usuaacuterio ao visitar a paacutegina veraacute informaccedilotildees
personalizadas Os aplicativos dinacircmicos da Web satildeo predominantes nos sites
comerciais(e-commerce ndash sites de venda pela Internet) onde o conteuacutedo
apresentado eacute gerado a partir de informaccedilotildees acessadas de um banco de dados ou
outra fonte externa Sua interface permite que se incluam comandos PHP
diretamente na paacutegina HTML
O PHP sucede de um produto mais antigo chamado PHPFI PHPFI foi
criado por Rasmus Lerdorf em 1994 inicialmente como scripts (arquivos texto com
um conjunto de instruccedilotildees de uma linguagem especiacutefica nos quais estatildeo contidas
todas as instruccedilotildees que dizem o que o programa faraacute) usados para gerar estatiacutesticas
de acesso para seu curriacuteculo on line Ele nomeou esta seacuterie de scripts de ldquoPersonal
Home Page Toolsrdquo a qual adquiriu um relativo ecircxito devido a outras pessoas
pedirem a Rasmus que lhes permitisse utilizar os seus programas nas suas proacuteprias
paacuteginas Web Como mais funcionalidades foram requeridas Rasmus escreveu uma
implementaccedilatildeo em linguagem C muito maior que era capaz de comunicar-se com
uma base de dados e possibilitava a usuaacuterios o desenvolvimento simples de
aplicativos dinacircmicos para Web Devido agrave aceitaccedilatildeo do primeiro PHP e de maneira
adicional o seu criador desenhou um sistema para processar formulaacuterios ao qual
13
deu o nome de FI (Form Interpreter) e o conjunto destas duas ferramentas seria a
primeira versatildeo compacta da linguagem PHPFI Rasmus resolveu distribuir o
coacutedigo fonte do PHPFI para que todos pudessem ver e tambeacutem usaacute-lo bem como
corrigir bugs e melhorar o coacutedigo (HISTOacuteRIA 2004)
O PHPFI usava interpretaccedilotildees automaacuteticas de variaacuteveis vindas de formulaacuterio
(dados passados pelos usuaacuterios) e era embutida diretamente no coacutedigo do HTML
Poreacutem a sua sintaxe era limitada simples e um pouco inconsistente
Em 1997 PHPFI 20 a segunda versatildeo da implementaccedilatildeo em linguagem C
obteve milhares de usuaacuterios ao redor do mundo com um valor estimado de
aproximadamente 50000 domiacutenios respondendo por basicamente 1 dos domiacutenios
da Internet Enquanto isto havia milhares de pessoas contribuindo com pequenos
coacutedigos para o projeto e ainda assim o PHPFI 20 foi oficialmente lanccedilado somente
ao final de 1997 apoacutes perder a maior parte de sua vida em versotildees beta (versotildees de
um produto que satildeo distribuiacutedas para teste dos usuaacuterios antes do lanccedilamento
oficial) O PHPFI 20 foi rapidamente substituiacutedo pelas versotildees iniciais do PHP 30
(HISTOacuteRIA 2004)
O PHP 30 foi a primeira versatildeo que se assemelha ao PHP que eacute utilizado
atualmente Ela foi criada por Andi Gutmans e Zeev Suraski em 1997 e foi
totalmente reescrito apoacutes eles descobrirem que o PHPFI 20 poderia ajudaacute-los a
desenvolver suas proacuteprias aplicaccedilotildees de e-Commerce de um projeto na sua
Universidade No esforccedilo cooperativo e iniciativa de reescrever o PHPFI a partir da
base existente Andi Rasmus e Zeev decidiram unir esforccedilos e anunciar o PHP 30
como uma versatildeo oficial de seu antecessor (o PHPFI 20) (HISTOacuteRIA 2004)
O PHP 30 aleacutem de oferecer aos usuaacuterios finais uma infraestrutura soacutelida
para diversos bancos de dados protocolos e APIs a extensibilidade (possibilidade
de uso para diversos objetivos) do PHP 30 atrai dezenas de novos desenvolvedores
para se juntar e submeter novos moacutedulos Esta eacute a chave do sucesso do PHP 30
Outras caracteriacutesticas chaves introduzidas no PHP 30 foram o suporte agrave sintaxe
para orientaccedilatildeo a objetos e uma sintaxe muito mais poderosa e consistente
O PHP 30 foi oficialmente lanccedilado em Junho de 1998 depois de ter passado
aproximadamente 9 meses em testes puacuteblicos (versotildees beta) Os objetivos do
projeto eram melhorar a performance de aplicaccedilotildees complexas e melhorar a
modularidade do coacutedigo base do PHP
14
O PHP 40 acompanhado com uma seacuterie de novas caracteriacutesticas foi
oficialmente lanccedilada no iniacutecio de 2000 quase dois anos apoacutes o seu antecessor
Aleacutem da melhora na performance esta versatildeo incluiu outras caracteriacutesticas chave
como o suporte para muitos servidores Web sessotildees HTTP buffer de saiacuteda e
maneiras mais seguras de manipular entrada de dados dos usuaacuterios (HISTOacuteRIA
2004)
De acordo com o site oficial do PHP (phpnetusagephp) atualmente
aproximadamente 17 milhotildees de domiacutenios estatildeo usando PHP na Web
2121 PHP - Por que utilizar
A popularidade do PHP continua crescendo rapidamente devido a muitas
vantagens Eacute raacutepido pois devido a estar embutido no coacutedigo HTML o tempo para
processar e carregar uma paacutegina Web eacute curto Eacute graacutetis e faacutecil de usar pois os
coacutedigos PHP satildeo facilmente incluiacutedos no arquivo HTML eacute versaacutetil pois o PHP roda
em uma grande variedade de sistemas operacionais eacute muito seguro pois se o
coacutedigo for escrito corretamente o usuaacuterio natildeo iraacute enxergar o coacutedigo PHP aleacutem de
ser customizaacutevel pois a licenccedila open-source permite aos programadores
modificarem o PHP adicionando ou modificando as caracteriacutesticas necessaacuterias ao
seu proacuteprio desenvolvimento
Devido ao PHP ser executado no servidor ele pode dinamicamente criar o
coacutedigo HTML que iraacute gerar a paacutegina Web permitindo que os usuaacuterios individuais
vejam paacuteginas customizadas Os visitantes da paacutegina Web vecircem a saiacuteda gerada
pelos scripts mas natildeo os scripts propriamente ditos tornando-o muito seguro
O PHP consegue trabalhar com ldquosessotildeesrdquo ou seja para executar
determinadas accedilotildees (fazer um download por exemplo) o usuaacuterio deve estar
identificado no site O PHP permite que se crie uma ldquosessatildeordquo que identifica cada
usuaacuterio no sistema aleacutem de outros dados referentes ao mesmo Se o usuaacuterio tentar
entrar em uma paacutegina especiacutefica primeiramente eacute verificado se existe uma sessatildeo
para o mesmo Se natildeo existir eacute mostrada uma mensagem de acesso proibido Se a
sessatildeo for vaacutelida os outros paracircmetros do usuaacuterio (salvos na sessatildeo) podem ser
verificados e validados caso necessaacuterio
2122 PHP - Como Funciona
15
Segundo Janet Valade (VALADE2004) O coacutedigo PHP eacute embutido no coacutedigo
HTML As tags do HTML satildeo usadas para incluir a linguagem PHP na linguagem
HTML Quando o PHP estaacute instalado o servidor Web eacute configurado para procurar
por coacutedigo PHP embutido em arquivos com extensotildees especiacuteficas (php ou phtml)
Quando o servidor recebe uma requisiccedilatildeo para um arquivo com uma dessas
extensotildees ele envia o coacutedigo HTML como estaacute mas o coacutedigo PHP eacute processado
pelo software antes de ser enviado ao solicitante Quando a linguagem PHP eacute
processada a saiacuteda consiste de coacutedigo HTML Os coacutedigos PHP natildeo satildeo incluiacutedos
no HTML enviado ao browser por isso o coacutedigo PHP eacute seguro e transparente para o
usuaacuterio Quando um browser eacute apontado para um arquivo HTML o servidor envia o
arquivo ao browser O browser processa o arquivo e mostra a paacutegina descrita pelos
tags HTML do arquivo Quando um Web browser eacute apontado para um arquivo PHP
o servidor procura por seccedilotildees PHP no arquivo e os processa enviando o resultado
do processamento ao browser Esses satildeo os passos seguidos pelo servidor para
processar um arquivo PHP
1 O servidor inicia a procura no arquivo em modo HTML Ele assume que o
coacutedigo eacute HTML e os envia ao browser sem nenhum processamento
2 O servidor web continua em modo HTML ateacute encontrar um tag de abertura do
PHP (lt)
3 Quando o servidor encontra um tag de abertura do PHP alterna para modo
PHP assume que todos os comandos subsequumlentes satildeo desse tipo e os
executa Se o comando gera uma saiacuteda a envia ao browser
4 O servidor continua em modo PHP ateacute encontrar um tag de fechamento do
PHP (gt)
5 Quando o servidor encontra um tag de fechamento do PHP retorna ao modo
HTML e repete o ciclo
2123 Forma Baacutesica de um Documento PHP
O PHP eacute embutido diretamente no programa HTML Seus comandos satildeo
delimitados pelos tags lt e gt Dentro dos tags de abertura e fechamento do PHP
satildeo incluiacutedos comandos especiacuteficos que satildeo interpretados pela linguagem A sintaxe
eacute bastante parecida com a da linguagem C Por exemplo
ltHTMLgt
16
ltHEADgtltTITLEgtTeste PHPltTITLEgtltHEADgt
ltBODYgt
ltpgt Linha HTML
lt
$id = $_GET[id]
if ($id = 1)
echo ldquoltpgtUsuaacuterio Nordm 1ltpgtrdquo
else
echo ldquoltpgt Usuaacuterio Nordm 2ltpgtrdquo
gt
ltBODYgt
ltHTMLgt
213 Javascript
Javascript eacute uma linguagem criada pela Netscape que serve basicamente
para aumentar os recursos do navegador
Todas as paacuteginas escritas com HTML satildeo estaacuteticas Conseguem fazer com
que o browser apenas leia o que haacute no coacutedigo e reproduza aquele conjunto de
instruccedilotildees Um dos principais recursos do Javascript eacute a possibilidade de fazer com
que a paacutegina HTML seja dinacircmica ou seja capaz de fazer com que o usuaacuterio possa
interagir com a paacutegina ou usar outros recursos para fazer com que o documento
Web se altere sem necessidade de um novo carregamento de paacutegina
O Javascript eacute uma linguagem de programaccedilatildeo que funciona interativamente
com o coacutedigo HTML O Javascript consegue ler entender e manipular os objetos de
uma paacutegina HTML tendo a facilidade necessaacuteria para alteraacute-los automaticamente
quando programado Satildeo inseridos nas paacuteginas de uma maneira peculiar podendo
ter apenas uma aacuterea para scripts ou espalhados pelo coacutedigo do jeito que melhor se
adapte agraves necessidades de cada usuaacuterio Diferentemente da linguagem PHP o
Javascript eacute uma linguagem client-side (as paacuteginas satildeo armazenadas e executadas
na maacutequina cliente) (LOURENCcedilO 2000)
17
22 Programas
221 Fireworks
O Fireworks eacute uma ferramenta de produccedilatildeo graacutefica para criaccedilatildeo de interfaces
e imagens Web com interaccedilatildeo em vaacuterias linguagens scripts (como php cfml html
xml Xhtml) podendo montar sites atraveacutes de desenhos O Fireworks consegue
combinar muito bem recursos vetoriais (como o ajuste de textos recursos praacuteticos
de desenho e ediccedilatildeo de noacutes) com os recursos aplicados a bitmaps ou imagens
(como o tratamento de cores e ferramentas de efeitos)
Tambeacutem permite trabalhar com layouts de sites sendo que pode-se
transformar o layout em uma paacutegina HTML usando o recurso de slices (fatias) O
programa permite que vocecirc divida o layout inteiro em vaacuterias imagens de acordo com
as aacutereas especiacuteficas que se deseja criar Apoacutes essa divisatildeo cada uma dessas aacutereas
eacute exportada com um formato de arquivo e com uma compactaccedilatildeo especiacutefica
podendo gerar o HTML com as imagens (ou fatias) nos seus devidos lugares e
posiccedilotildees ou mesmo exporta-las para o Dreamweaver Sua outra vantagem eacute a
possibilidade de se trabalhar com os behaviors (comportamentos) Com os
bahaviors pode-se criar rollovers (menus interativos) e menus pop ups (menus que
abrem outros sub-menus de acordo com cada item) estilizados
Como o Fireworks foi inicialmente projetado para a Web permite tambeacutem a
exportaccedilatildeo de imagens para a rede Esses recursos incluem a total otimizaccedilatildeo de
cada formato de arquivo a ser exportado bem como GIFS e JPEGS Aleacutem disso
pode-se fazer uma comparaccedilatildeo visual e do tamanho do arquivo simultaneamente
de ateacute 4 formatos ou configuraccedilotildees de exportaccedilotildees e tambeacutem salvar as mesmas
configuraccedilotildees para usar mais tarde em outros arquivos (CARACTERIacuteSTICAS
2004)
222 Dreamweaver
O Dreamweaver eacute um editor profissional de HTML utilizado para projetar
codificar e desenvolver sites paacuteginas e aplicaccedilotildees Web Permite que se trabalhe as
paacuteginas HTML de forma manual ou em um ambiente de ediccedilatildeo visual fornecendo
ferramentas uacuteteis para esses fins O Dreamweaver tambeacutem permite que se construa
aplicaccedilotildees Web dinacircmicas usando linguagens que rodam nos servidores (PHP
nesse caso) (PAGE 2004) Algumas das facilidades do Dreamweaver satildeo
18
bull Administraccedilatildeo remota do site e arquivos fonte localmente
bull Operaccedilatildeo em CSS (Cascade Style Sheets)
bull Geraccedilatildeo automatizada de rotinas em Javascript
bull Formulaacuterios
bull Criaccedilatildeo e uso de templates (modelos)
bull Gerenciamento completo do site e seus componentes (por exemplo se um
arquivo de imagem for movido de um sub-diretoacuterio para outro todo o site eacute
reparado automaticamente)
bull Apresentaccedilatildeo do mapa do site com diferentes niacuteveis de detalhamento
bull Behaviors (comportamentos que depois podem ser reaproveitados) com
rotinas de JavaScript
bull Manipulaccedilatildeo de tabelas
bull Rollover de imagens
bull Administraccedilatildeo do site a partir da barra de menu
bull Reparo automaacutetico do site a partir da mudanccedila de endereccedilo ou nome de
uma miacutedia ou link em geral
23 Banco de Dados
231 MySQL
O MySQL eacute um SGDB (ou sistema gerenciador de banco de dados) que eacute
desenvolvido e distribuiacutedo pela MySQL AB a empresa fundada pelos suecos David
Axmark Allan Larsson e Michael Widenius Ele derivou de outro banco de dados o
mSQL Pelo fato do mesmo natildeo ser raacutepido nem flexiacutevel o suficiente para as suas
necessidades os suecos resolveram criar um novo banco de dados utilizando a
interface API (application programming interface - conjunto de rotinas padronizadas
que a aplicaccedilatildeo utiliza para efetuar seus serviccedilos) do proacuteprio mSQL utilizada para
facilitar a portabilidade de coacutedigos escritos do mSQL para o MySQL
Escrito em C e C++ e testado em vaacuterias plataformas diferentes o MySQL
possui um sistema de alocaccedilatildeo de memoacuteria baseado em processos que permite a
execuccedilatildeo de tarefas paralelas tornando-o extremamente raacutepido e eficiente Ele eacute um
banco de dados do tipo SQL (Structured Query Language) e por isso possui as
caracteriacutesticas dos principais bancos de dados do tipo SQL como operadores e
funccedilotildees agrupamentos joins (junccedilotildees de tabelas) aceita vaacuterios tipos de campos
19
suportando registros de tamanhos fixos ou variaacuteveis controla a seguranccedila dos
dados aleacutem de poder armazenar uma grande quantidade de dados chegando a
quantidades superiores a 50000000 de registros Aleacutem disso o MySQL eacute multi-
usuaacuterio (programas de mais de um usuaacuterio podem estar em execuccedilatildeo) eacute multi-
tarefa (eacute capaz de executar vaacuterios programas simultaneamente mesmo que a
maacutequina possua somente um processador) e open-source
Esse servidor de banco de dados eacute considerado como o mais raacutepido entre os
de sua categoria tanto para grandes volumes de dados como pequenos Poreacutem
como ele foi criado para ser extremamente aacutegil teve-se de descartar certos aspectos
das especificaccedilotildees SQL e foi decidido natildeo se implementar caracteriacutesticas que geram
muita demanda de recursos como os triggers que satildeo uma porccedilatildeo de coacutedigo
armazenado que se executa quando eacute realizada uma operaccedilatildeo (atualizaccedilatildeo
inclusatildeo etc) com o banco de dados Naturalmente comprovar a proacutepria existecircncia
do trigger e executaacute-lo consome recursos e tempo
As principais vantagens do MySQL satildeo a baixa demanda de recursos de
hardware a simplicidade de administraccedilatildeo e a otimizaccedilatildeo para as aplicaccedilotildees tiacutepicas
da web onde ocorrem mais consultas do que atualizaccedilotildees (MySQL 2004)
20
3 DESIGN DO SITE
Atraveacutes de um briefing (anexo 1) pode-se chegar a algumas conclusotildees que
influenciaram na escolha da forma de apresentaccedilatildeo das paacuteginas e levaram a
definiccedilatildeo de quais cores imagens e forma o site seria apresentado aos usuaacuterios
31 DEFINICcedilAtildeO DAS CORES
311 A Teoria das Cores
O que se convencionou chamar de Teoria das Cores de Leonardo da Vinci
satildeo as formulaccedilotildees histoacutericas esparsas contidas em seus escritos e reunidas no livro
Tratado da Pintura e da Paisagem ndash Sombra e Luz que satildeo anotaccedilotildees recolhidas
pelo artista ao longo de anos de observaccedilatildeo e eacute a teoria mais corrente sendo um
dos legados do renascimento para as artes visuais (TEORIA 2004)
312 O Disco Cromaacutetico
O disco cromaacutetico natildeo eacute um instrumento cientiacutefico de classificaccedilatildeo de cores
mas eacute muito uacutetil no entendimento da teoria das cores As cores se dividem em
primaacuterias secundaacuterias e terciaacuterias (TEORIA 2004)
Pode-se reproduzir qualquer sensaccedilatildeo de cor misturando-se aditivamente
diversas quantidades de vermelho azul e verde Por isso conhecem-se essas cores
como cores primaacuterias (ENCARTA 2000) Combinado-se duas cores primaacuterias
obtemos as cores secundaacuterias resultando no laranja (amarelo com vermelho) verde
(azul com amarelo) e violeta (vermelho com azul) As cores terciaacuterias satildeo obtidas
pela mistura de uma primaacuteria com uma ou mais secundaacuterias (TEORIA 2004)
21
A figura 1 apresenta a representaccedilatildeo graacutefica do disco cromaacutetico
FIGURA 1 ndash DISCO CROMAacuteTICO
313 Cores Anaacutelogas
Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores anaacutelogas satildeo as
cores dispostas lado a lado no disco cromaacutetico Satildeo anaacutelogas porque haacute nelas uma
mesma cor baacutesica e satildeo usadas para dar a sensaccedilatildeo de uniformidade Observando
a figura 1 visualiza-se que a cor anaacuteloga do amarelo eacute o laranja por exemplo
314 Cores Complementares Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores complementares
satildeo aquelas que encontram-se sempre em posiccedilotildees opostas no disco cromaacutetico As
cores complementares satildeo usadas para dar forccedila e equiliacutebrio a um trabalho criando
contrastes Observando a figura 1 visualiza-se que a cor complementar do
vermelho eacute o verde e do laranja eacute o azul por exemplo
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
12
Essa seccedilatildeo pode conter cabeccedilalhos paraacutegrafos listas tabelas links para outros
documentos e imagens
212 PHP - Personal Home Page
Como as paacuteginas em HTML satildeo basicamente apresentaccedilotildees de texto e
imagens com o passar do tempo surgiu a necessidade de uma interaccedilatildeo maior com
o usuaacuterio permitindo que se tivesse um histoacuterico desse usuaacuterio aleacutem da
possibilidade de se mostrar informaccedilotildees personalizadas aos mesmos Para esse
propoacutesito umas das linguagens que surgiram e que tinham forte ligaccedilatildeo com o
HTML foi o PHP
O PHP eacute uma linguagem de server-side (as paacuteginas ficam armazenadas e
satildeo executadas em um servidor onde o site estaacute localizado) e open-source (um
programa que tem seu coacutedigo fonte disponiacutevel para que qualquer pessoa que tenha
uma ideacuteia uma sugestatildeo possa ajudar no seu desenvolvimento) para criaccedilatildeo de
paacuteginas dinacircmicas para a Web Uma paacutegina dinacircmica eacute aquela que interage com o
usuaacuterio de forma que cada usuaacuterio ao visitar a paacutegina veraacute informaccedilotildees
personalizadas Os aplicativos dinacircmicos da Web satildeo predominantes nos sites
comerciais(e-commerce ndash sites de venda pela Internet) onde o conteuacutedo
apresentado eacute gerado a partir de informaccedilotildees acessadas de um banco de dados ou
outra fonte externa Sua interface permite que se incluam comandos PHP
diretamente na paacutegina HTML
O PHP sucede de um produto mais antigo chamado PHPFI PHPFI foi
criado por Rasmus Lerdorf em 1994 inicialmente como scripts (arquivos texto com
um conjunto de instruccedilotildees de uma linguagem especiacutefica nos quais estatildeo contidas
todas as instruccedilotildees que dizem o que o programa faraacute) usados para gerar estatiacutesticas
de acesso para seu curriacuteculo on line Ele nomeou esta seacuterie de scripts de ldquoPersonal
Home Page Toolsrdquo a qual adquiriu um relativo ecircxito devido a outras pessoas
pedirem a Rasmus que lhes permitisse utilizar os seus programas nas suas proacuteprias
paacuteginas Web Como mais funcionalidades foram requeridas Rasmus escreveu uma
implementaccedilatildeo em linguagem C muito maior que era capaz de comunicar-se com
uma base de dados e possibilitava a usuaacuterios o desenvolvimento simples de
aplicativos dinacircmicos para Web Devido agrave aceitaccedilatildeo do primeiro PHP e de maneira
adicional o seu criador desenhou um sistema para processar formulaacuterios ao qual
13
deu o nome de FI (Form Interpreter) e o conjunto destas duas ferramentas seria a
primeira versatildeo compacta da linguagem PHPFI Rasmus resolveu distribuir o
coacutedigo fonte do PHPFI para que todos pudessem ver e tambeacutem usaacute-lo bem como
corrigir bugs e melhorar o coacutedigo (HISTOacuteRIA 2004)
O PHPFI usava interpretaccedilotildees automaacuteticas de variaacuteveis vindas de formulaacuterio
(dados passados pelos usuaacuterios) e era embutida diretamente no coacutedigo do HTML
Poreacutem a sua sintaxe era limitada simples e um pouco inconsistente
Em 1997 PHPFI 20 a segunda versatildeo da implementaccedilatildeo em linguagem C
obteve milhares de usuaacuterios ao redor do mundo com um valor estimado de
aproximadamente 50000 domiacutenios respondendo por basicamente 1 dos domiacutenios
da Internet Enquanto isto havia milhares de pessoas contribuindo com pequenos
coacutedigos para o projeto e ainda assim o PHPFI 20 foi oficialmente lanccedilado somente
ao final de 1997 apoacutes perder a maior parte de sua vida em versotildees beta (versotildees de
um produto que satildeo distribuiacutedas para teste dos usuaacuterios antes do lanccedilamento
oficial) O PHPFI 20 foi rapidamente substituiacutedo pelas versotildees iniciais do PHP 30
(HISTOacuteRIA 2004)
O PHP 30 foi a primeira versatildeo que se assemelha ao PHP que eacute utilizado
atualmente Ela foi criada por Andi Gutmans e Zeev Suraski em 1997 e foi
totalmente reescrito apoacutes eles descobrirem que o PHPFI 20 poderia ajudaacute-los a
desenvolver suas proacuteprias aplicaccedilotildees de e-Commerce de um projeto na sua
Universidade No esforccedilo cooperativo e iniciativa de reescrever o PHPFI a partir da
base existente Andi Rasmus e Zeev decidiram unir esforccedilos e anunciar o PHP 30
como uma versatildeo oficial de seu antecessor (o PHPFI 20) (HISTOacuteRIA 2004)
O PHP 30 aleacutem de oferecer aos usuaacuterios finais uma infraestrutura soacutelida
para diversos bancos de dados protocolos e APIs a extensibilidade (possibilidade
de uso para diversos objetivos) do PHP 30 atrai dezenas de novos desenvolvedores
para se juntar e submeter novos moacutedulos Esta eacute a chave do sucesso do PHP 30
Outras caracteriacutesticas chaves introduzidas no PHP 30 foram o suporte agrave sintaxe
para orientaccedilatildeo a objetos e uma sintaxe muito mais poderosa e consistente
O PHP 30 foi oficialmente lanccedilado em Junho de 1998 depois de ter passado
aproximadamente 9 meses em testes puacuteblicos (versotildees beta) Os objetivos do
projeto eram melhorar a performance de aplicaccedilotildees complexas e melhorar a
modularidade do coacutedigo base do PHP
14
O PHP 40 acompanhado com uma seacuterie de novas caracteriacutesticas foi
oficialmente lanccedilada no iniacutecio de 2000 quase dois anos apoacutes o seu antecessor
Aleacutem da melhora na performance esta versatildeo incluiu outras caracteriacutesticas chave
como o suporte para muitos servidores Web sessotildees HTTP buffer de saiacuteda e
maneiras mais seguras de manipular entrada de dados dos usuaacuterios (HISTOacuteRIA
2004)
De acordo com o site oficial do PHP (phpnetusagephp) atualmente
aproximadamente 17 milhotildees de domiacutenios estatildeo usando PHP na Web
2121 PHP - Por que utilizar
A popularidade do PHP continua crescendo rapidamente devido a muitas
vantagens Eacute raacutepido pois devido a estar embutido no coacutedigo HTML o tempo para
processar e carregar uma paacutegina Web eacute curto Eacute graacutetis e faacutecil de usar pois os
coacutedigos PHP satildeo facilmente incluiacutedos no arquivo HTML eacute versaacutetil pois o PHP roda
em uma grande variedade de sistemas operacionais eacute muito seguro pois se o
coacutedigo for escrito corretamente o usuaacuterio natildeo iraacute enxergar o coacutedigo PHP aleacutem de
ser customizaacutevel pois a licenccedila open-source permite aos programadores
modificarem o PHP adicionando ou modificando as caracteriacutesticas necessaacuterias ao
seu proacuteprio desenvolvimento
Devido ao PHP ser executado no servidor ele pode dinamicamente criar o
coacutedigo HTML que iraacute gerar a paacutegina Web permitindo que os usuaacuterios individuais
vejam paacuteginas customizadas Os visitantes da paacutegina Web vecircem a saiacuteda gerada
pelos scripts mas natildeo os scripts propriamente ditos tornando-o muito seguro
O PHP consegue trabalhar com ldquosessotildeesrdquo ou seja para executar
determinadas accedilotildees (fazer um download por exemplo) o usuaacuterio deve estar
identificado no site O PHP permite que se crie uma ldquosessatildeordquo que identifica cada
usuaacuterio no sistema aleacutem de outros dados referentes ao mesmo Se o usuaacuterio tentar
entrar em uma paacutegina especiacutefica primeiramente eacute verificado se existe uma sessatildeo
para o mesmo Se natildeo existir eacute mostrada uma mensagem de acesso proibido Se a
sessatildeo for vaacutelida os outros paracircmetros do usuaacuterio (salvos na sessatildeo) podem ser
verificados e validados caso necessaacuterio
2122 PHP - Como Funciona
15
Segundo Janet Valade (VALADE2004) O coacutedigo PHP eacute embutido no coacutedigo
HTML As tags do HTML satildeo usadas para incluir a linguagem PHP na linguagem
HTML Quando o PHP estaacute instalado o servidor Web eacute configurado para procurar
por coacutedigo PHP embutido em arquivos com extensotildees especiacuteficas (php ou phtml)
Quando o servidor recebe uma requisiccedilatildeo para um arquivo com uma dessas
extensotildees ele envia o coacutedigo HTML como estaacute mas o coacutedigo PHP eacute processado
pelo software antes de ser enviado ao solicitante Quando a linguagem PHP eacute
processada a saiacuteda consiste de coacutedigo HTML Os coacutedigos PHP natildeo satildeo incluiacutedos
no HTML enviado ao browser por isso o coacutedigo PHP eacute seguro e transparente para o
usuaacuterio Quando um browser eacute apontado para um arquivo HTML o servidor envia o
arquivo ao browser O browser processa o arquivo e mostra a paacutegina descrita pelos
tags HTML do arquivo Quando um Web browser eacute apontado para um arquivo PHP
o servidor procura por seccedilotildees PHP no arquivo e os processa enviando o resultado
do processamento ao browser Esses satildeo os passos seguidos pelo servidor para
processar um arquivo PHP
1 O servidor inicia a procura no arquivo em modo HTML Ele assume que o
coacutedigo eacute HTML e os envia ao browser sem nenhum processamento
2 O servidor web continua em modo HTML ateacute encontrar um tag de abertura do
PHP (lt)
3 Quando o servidor encontra um tag de abertura do PHP alterna para modo
PHP assume que todos os comandos subsequumlentes satildeo desse tipo e os
executa Se o comando gera uma saiacuteda a envia ao browser
4 O servidor continua em modo PHP ateacute encontrar um tag de fechamento do
PHP (gt)
5 Quando o servidor encontra um tag de fechamento do PHP retorna ao modo
HTML e repete o ciclo
2123 Forma Baacutesica de um Documento PHP
O PHP eacute embutido diretamente no programa HTML Seus comandos satildeo
delimitados pelos tags lt e gt Dentro dos tags de abertura e fechamento do PHP
satildeo incluiacutedos comandos especiacuteficos que satildeo interpretados pela linguagem A sintaxe
eacute bastante parecida com a da linguagem C Por exemplo
ltHTMLgt
16
ltHEADgtltTITLEgtTeste PHPltTITLEgtltHEADgt
ltBODYgt
ltpgt Linha HTML
lt
$id = $_GET[id]
if ($id = 1)
echo ldquoltpgtUsuaacuterio Nordm 1ltpgtrdquo
else
echo ldquoltpgt Usuaacuterio Nordm 2ltpgtrdquo
gt
ltBODYgt
ltHTMLgt
213 Javascript
Javascript eacute uma linguagem criada pela Netscape que serve basicamente
para aumentar os recursos do navegador
Todas as paacuteginas escritas com HTML satildeo estaacuteticas Conseguem fazer com
que o browser apenas leia o que haacute no coacutedigo e reproduza aquele conjunto de
instruccedilotildees Um dos principais recursos do Javascript eacute a possibilidade de fazer com
que a paacutegina HTML seja dinacircmica ou seja capaz de fazer com que o usuaacuterio possa
interagir com a paacutegina ou usar outros recursos para fazer com que o documento
Web se altere sem necessidade de um novo carregamento de paacutegina
O Javascript eacute uma linguagem de programaccedilatildeo que funciona interativamente
com o coacutedigo HTML O Javascript consegue ler entender e manipular os objetos de
uma paacutegina HTML tendo a facilidade necessaacuteria para alteraacute-los automaticamente
quando programado Satildeo inseridos nas paacuteginas de uma maneira peculiar podendo
ter apenas uma aacuterea para scripts ou espalhados pelo coacutedigo do jeito que melhor se
adapte agraves necessidades de cada usuaacuterio Diferentemente da linguagem PHP o
Javascript eacute uma linguagem client-side (as paacuteginas satildeo armazenadas e executadas
na maacutequina cliente) (LOURENCcedilO 2000)
17
22 Programas
221 Fireworks
O Fireworks eacute uma ferramenta de produccedilatildeo graacutefica para criaccedilatildeo de interfaces
e imagens Web com interaccedilatildeo em vaacuterias linguagens scripts (como php cfml html
xml Xhtml) podendo montar sites atraveacutes de desenhos O Fireworks consegue
combinar muito bem recursos vetoriais (como o ajuste de textos recursos praacuteticos
de desenho e ediccedilatildeo de noacutes) com os recursos aplicados a bitmaps ou imagens
(como o tratamento de cores e ferramentas de efeitos)
Tambeacutem permite trabalhar com layouts de sites sendo que pode-se
transformar o layout em uma paacutegina HTML usando o recurso de slices (fatias) O
programa permite que vocecirc divida o layout inteiro em vaacuterias imagens de acordo com
as aacutereas especiacuteficas que se deseja criar Apoacutes essa divisatildeo cada uma dessas aacutereas
eacute exportada com um formato de arquivo e com uma compactaccedilatildeo especiacutefica
podendo gerar o HTML com as imagens (ou fatias) nos seus devidos lugares e
posiccedilotildees ou mesmo exporta-las para o Dreamweaver Sua outra vantagem eacute a
possibilidade de se trabalhar com os behaviors (comportamentos) Com os
bahaviors pode-se criar rollovers (menus interativos) e menus pop ups (menus que
abrem outros sub-menus de acordo com cada item) estilizados
Como o Fireworks foi inicialmente projetado para a Web permite tambeacutem a
exportaccedilatildeo de imagens para a rede Esses recursos incluem a total otimizaccedilatildeo de
cada formato de arquivo a ser exportado bem como GIFS e JPEGS Aleacutem disso
pode-se fazer uma comparaccedilatildeo visual e do tamanho do arquivo simultaneamente
de ateacute 4 formatos ou configuraccedilotildees de exportaccedilotildees e tambeacutem salvar as mesmas
configuraccedilotildees para usar mais tarde em outros arquivos (CARACTERIacuteSTICAS
2004)
222 Dreamweaver
O Dreamweaver eacute um editor profissional de HTML utilizado para projetar
codificar e desenvolver sites paacuteginas e aplicaccedilotildees Web Permite que se trabalhe as
paacuteginas HTML de forma manual ou em um ambiente de ediccedilatildeo visual fornecendo
ferramentas uacuteteis para esses fins O Dreamweaver tambeacutem permite que se construa
aplicaccedilotildees Web dinacircmicas usando linguagens que rodam nos servidores (PHP
nesse caso) (PAGE 2004) Algumas das facilidades do Dreamweaver satildeo
18
bull Administraccedilatildeo remota do site e arquivos fonte localmente
bull Operaccedilatildeo em CSS (Cascade Style Sheets)
bull Geraccedilatildeo automatizada de rotinas em Javascript
bull Formulaacuterios
bull Criaccedilatildeo e uso de templates (modelos)
bull Gerenciamento completo do site e seus componentes (por exemplo se um
arquivo de imagem for movido de um sub-diretoacuterio para outro todo o site eacute
reparado automaticamente)
bull Apresentaccedilatildeo do mapa do site com diferentes niacuteveis de detalhamento
bull Behaviors (comportamentos que depois podem ser reaproveitados) com
rotinas de JavaScript
bull Manipulaccedilatildeo de tabelas
bull Rollover de imagens
bull Administraccedilatildeo do site a partir da barra de menu
bull Reparo automaacutetico do site a partir da mudanccedila de endereccedilo ou nome de
uma miacutedia ou link em geral
23 Banco de Dados
231 MySQL
O MySQL eacute um SGDB (ou sistema gerenciador de banco de dados) que eacute
desenvolvido e distribuiacutedo pela MySQL AB a empresa fundada pelos suecos David
Axmark Allan Larsson e Michael Widenius Ele derivou de outro banco de dados o
mSQL Pelo fato do mesmo natildeo ser raacutepido nem flexiacutevel o suficiente para as suas
necessidades os suecos resolveram criar um novo banco de dados utilizando a
interface API (application programming interface - conjunto de rotinas padronizadas
que a aplicaccedilatildeo utiliza para efetuar seus serviccedilos) do proacuteprio mSQL utilizada para
facilitar a portabilidade de coacutedigos escritos do mSQL para o MySQL
Escrito em C e C++ e testado em vaacuterias plataformas diferentes o MySQL
possui um sistema de alocaccedilatildeo de memoacuteria baseado em processos que permite a
execuccedilatildeo de tarefas paralelas tornando-o extremamente raacutepido e eficiente Ele eacute um
banco de dados do tipo SQL (Structured Query Language) e por isso possui as
caracteriacutesticas dos principais bancos de dados do tipo SQL como operadores e
funccedilotildees agrupamentos joins (junccedilotildees de tabelas) aceita vaacuterios tipos de campos
19
suportando registros de tamanhos fixos ou variaacuteveis controla a seguranccedila dos
dados aleacutem de poder armazenar uma grande quantidade de dados chegando a
quantidades superiores a 50000000 de registros Aleacutem disso o MySQL eacute multi-
usuaacuterio (programas de mais de um usuaacuterio podem estar em execuccedilatildeo) eacute multi-
tarefa (eacute capaz de executar vaacuterios programas simultaneamente mesmo que a
maacutequina possua somente um processador) e open-source
Esse servidor de banco de dados eacute considerado como o mais raacutepido entre os
de sua categoria tanto para grandes volumes de dados como pequenos Poreacutem
como ele foi criado para ser extremamente aacutegil teve-se de descartar certos aspectos
das especificaccedilotildees SQL e foi decidido natildeo se implementar caracteriacutesticas que geram
muita demanda de recursos como os triggers que satildeo uma porccedilatildeo de coacutedigo
armazenado que se executa quando eacute realizada uma operaccedilatildeo (atualizaccedilatildeo
inclusatildeo etc) com o banco de dados Naturalmente comprovar a proacutepria existecircncia
do trigger e executaacute-lo consome recursos e tempo
As principais vantagens do MySQL satildeo a baixa demanda de recursos de
hardware a simplicidade de administraccedilatildeo e a otimizaccedilatildeo para as aplicaccedilotildees tiacutepicas
da web onde ocorrem mais consultas do que atualizaccedilotildees (MySQL 2004)
20
3 DESIGN DO SITE
Atraveacutes de um briefing (anexo 1) pode-se chegar a algumas conclusotildees que
influenciaram na escolha da forma de apresentaccedilatildeo das paacuteginas e levaram a
definiccedilatildeo de quais cores imagens e forma o site seria apresentado aos usuaacuterios
31 DEFINICcedilAtildeO DAS CORES
311 A Teoria das Cores
O que se convencionou chamar de Teoria das Cores de Leonardo da Vinci
satildeo as formulaccedilotildees histoacutericas esparsas contidas em seus escritos e reunidas no livro
Tratado da Pintura e da Paisagem ndash Sombra e Luz que satildeo anotaccedilotildees recolhidas
pelo artista ao longo de anos de observaccedilatildeo e eacute a teoria mais corrente sendo um
dos legados do renascimento para as artes visuais (TEORIA 2004)
312 O Disco Cromaacutetico
O disco cromaacutetico natildeo eacute um instrumento cientiacutefico de classificaccedilatildeo de cores
mas eacute muito uacutetil no entendimento da teoria das cores As cores se dividem em
primaacuterias secundaacuterias e terciaacuterias (TEORIA 2004)
Pode-se reproduzir qualquer sensaccedilatildeo de cor misturando-se aditivamente
diversas quantidades de vermelho azul e verde Por isso conhecem-se essas cores
como cores primaacuterias (ENCARTA 2000) Combinado-se duas cores primaacuterias
obtemos as cores secundaacuterias resultando no laranja (amarelo com vermelho) verde
(azul com amarelo) e violeta (vermelho com azul) As cores terciaacuterias satildeo obtidas
pela mistura de uma primaacuteria com uma ou mais secundaacuterias (TEORIA 2004)
21
A figura 1 apresenta a representaccedilatildeo graacutefica do disco cromaacutetico
FIGURA 1 ndash DISCO CROMAacuteTICO
313 Cores Anaacutelogas
Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores anaacutelogas satildeo as
cores dispostas lado a lado no disco cromaacutetico Satildeo anaacutelogas porque haacute nelas uma
mesma cor baacutesica e satildeo usadas para dar a sensaccedilatildeo de uniformidade Observando
a figura 1 visualiza-se que a cor anaacuteloga do amarelo eacute o laranja por exemplo
314 Cores Complementares Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores complementares
satildeo aquelas que encontram-se sempre em posiccedilotildees opostas no disco cromaacutetico As
cores complementares satildeo usadas para dar forccedila e equiliacutebrio a um trabalho criando
contrastes Observando a figura 1 visualiza-se que a cor complementar do
vermelho eacute o verde e do laranja eacute o azul por exemplo
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
13
deu o nome de FI (Form Interpreter) e o conjunto destas duas ferramentas seria a
primeira versatildeo compacta da linguagem PHPFI Rasmus resolveu distribuir o
coacutedigo fonte do PHPFI para que todos pudessem ver e tambeacutem usaacute-lo bem como
corrigir bugs e melhorar o coacutedigo (HISTOacuteRIA 2004)
O PHPFI usava interpretaccedilotildees automaacuteticas de variaacuteveis vindas de formulaacuterio
(dados passados pelos usuaacuterios) e era embutida diretamente no coacutedigo do HTML
Poreacutem a sua sintaxe era limitada simples e um pouco inconsistente
Em 1997 PHPFI 20 a segunda versatildeo da implementaccedilatildeo em linguagem C
obteve milhares de usuaacuterios ao redor do mundo com um valor estimado de
aproximadamente 50000 domiacutenios respondendo por basicamente 1 dos domiacutenios
da Internet Enquanto isto havia milhares de pessoas contribuindo com pequenos
coacutedigos para o projeto e ainda assim o PHPFI 20 foi oficialmente lanccedilado somente
ao final de 1997 apoacutes perder a maior parte de sua vida em versotildees beta (versotildees de
um produto que satildeo distribuiacutedas para teste dos usuaacuterios antes do lanccedilamento
oficial) O PHPFI 20 foi rapidamente substituiacutedo pelas versotildees iniciais do PHP 30
(HISTOacuteRIA 2004)
O PHP 30 foi a primeira versatildeo que se assemelha ao PHP que eacute utilizado
atualmente Ela foi criada por Andi Gutmans e Zeev Suraski em 1997 e foi
totalmente reescrito apoacutes eles descobrirem que o PHPFI 20 poderia ajudaacute-los a
desenvolver suas proacuteprias aplicaccedilotildees de e-Commerce de um projeto na sua
Universidade No esforccedilo cooperativo e iniciativa de reescrever o PHPFI a partir da
base existente Andi Rasmus e Zeev decidiram unir esforccedilos e anunciar o PHP 30
como uma versatildeo oficial de seu antecessor (o PHPFI 20) (HISTOacuteRIA 2004)
O PHP 30 aleacutem de oferecer aos usuaacuterios finais uma infraestrutura soacutelida
para diversos bancos de dados protocolos e APIs a extensibilidade (possibilidade
de uso para diversos objetivos) do PHP 30 atrai dezenas de novos desenvolvedores
para se juntar e submeter novos moacutedulos Esta eacute a chave do sucesso do PHP 30
Outras caracteriacutesticas chaves introduzidas no PHP 30 foram o suporte agrave sintaxe
para orientaccedilatildeo a objetos e uma sintaxe muito mais poderosa e consistente
O PHP 30 foi oficialmente lanccedilado em Junho de 1998 depois de ter passado
aproximadamente 9 meses em testes puacuteblicos (versotildees beta) Os objetivos do
projeto eram melhorar a performance de aplicaccedilotildees complexas e melhorar a
modularidade do coacutedigo base do PHP
14
O PHP 40 acompanhado com uma seacuterie de novas caracteriacutesticas foi
oficialmente lanccedilada no iniacutecio de 2000 quase dois anos apoacutes o seu antecessor
Aleacutem da melhora na performance esta versatildeo incluiu outras caracteriacutesticas chave
como o suporte para muitos servidores Web sessotildees HTTP buffer de saiacuteda e
maneiras mais seguras de manipular entrada de dados dos usuaacuterios (HISTOacuteRIA
2004)
De acordo com o site oficial do PHP (phpnetusagephp) atualmente
aproximadamente 17 milhotildees de domiacutenios estatildeo usando PHP na Web
2121 PHP - Por que utilizar
A popularidade do PHP continua crescendo rapidamente devido a muitas
vantagens Eacute raacutepido pois devido a estar embutido no coacutedigo HTML o tempo para
processar e carregar uma paacutegina Web eacute curto Eacute graacutetis e faacutecil de usar pois os
coacutedigos PHP satildeo facilmente incluiacutedos no arquivo HTML eacute versaacutetil pois o PHP roda
em uma grande variedade de sistemas operacionais eacute muito seguro pois se o
coacutedigo for escrito corretamente o usuaacuterio natildeo iraacute enxergar o coacutedigo PHP aleacutem de
ser customizaacutevel pois a licenccedila open-source permite aos programadores
modificarem o PHP adicionando ou modificando as caracteriacutesticas necessaacuterias ao
seu proacuteprio desenvolvimento
Devido ao PHP ser executado no servidor ele pode dinamicamente criar o
coacutedigo HTML que iraacute gerar a paacutegina Web permitindo que os usuaacuterios individuais
vejam paacuteginas customizadas Os visitantes da paacutegina Web vecircem a saiacuteda gerada
pelos scripts mas natildeo os scripts propriamente ditos tornando-o muito seguro
O PHP consegue trabalhar com ldquosessotildeesrdquo ou seja para executar
determinadas accedilotildees (fazer um download por exemplo) o usuaacuterio deve estar
identificado no site O PHP permite que se crie uma ldquosessatildeordquo que identifica cada
usuaacuterio no sistema aleacutem de outros dados referentes ao mesmo Se o usuaacuterio tentar
entrar em uma paacutegina especiacutefica primeiramente eacute verificado se existe uma sessatildeo
para o mesmo Se natildeo existir eacute mostrada uma mensagem de acesso proibido Se a
sessatildeo for vaacutelida os outros paracircmetros do usuaacuterio (salvos na sessatildeo) podem ser
verificados e validados caso necessaacuterio
2122 PHP - Como Funciona
15
Segundo Janet Valade (VALADE2004) O coacutedigo PHP eacute embutido no coacutedigo
HTML As tags do HTML satildeo usadas para incluir a linguagem PHP na linguagem
HTML Quando o PHP estaacute instalado o servidor Web eacute configurado para procurar
por coacutedigo PHP embutido em arquivos com extensotildees especiacuteficas (php ou phtml)
Quando o servidor recebe uma requisiccedilatildeo para um arquivo com uma dessas
extensotildees ele envia o coacutedigo HTML como estaacute mas o coacutedigo PHP eacute processado
pelo software antes de ser enviado ao solicitante Quando a linguagem PHP eacute
processada a saiacuteda consiste de coacutedigo HTML Os coacutedigos PHP natildeo satildeo incluiacutedos
no HTML enviado ao browser por isso o coacutedigo PHP eacute seguro e transparente para o
usuaacuterio Quando um browser eacute apontado para um arquivo HTML o servidor envia o
arquivo ao browser O browser processa o arquivo e mostra a paacutegina descrita pelos
tags HTML do arquivo Quando um Web browser eacute apontado para um arquivo PHP
o servidor procura por seccedilotildees PHP no arquivo e os processa enviando o resultado
do processamento ao browser Esses satildeo os passos seguidos pelo servidor para
processar um arquivo PHP
1 O servidor inicia a procura no arquivo em modo HTML Ele assume que o
coacutedigo eacute HTML e os envia ao browser sem nenhum processamento
2 O servidor web continua em modo HTML ateacute encontrar um tag de abertura do
PHP (lt)
3 Quando o servidor encontra um tag de abertura do PHP alterna para modo
PHP assume que todos os comandos subsequumlentes satildeo desse tipo e os
executa Se o comando gera uma saiacuteda a envia ao browser
4 O servidor continua em modo PHP ateacute encontrar um tag de fechamento do
PHP (gt)
5 Quando o servidor encontra um tag de fechamento do PHP retorna ao modo
HTML e repete o ciclo
2123 Forma Baacutesica de um Documento PHP
O PHP eacute embutido diretamente no programa HTML Seus comandos satildeo
delimitados pelos tags lt e gt Dentro dos tags de abertura e fechamento do PHP
satildeo incluiacutedos comandos especiacuteficos que satildeo interpretados pela linguagem A sintaxe
eacute bastante parecida com a da linguagem C Por exemplo
ltHTMLgt
16
ltHEADgtltTITLEgtTeste PHPltTITLEgtltHEADgt
ltBODYgt
ltpgt Linha HTML
lt
$id = $_GET[id]
if ($id = 1)
echo ldquoltpgtUsuaacuterio Nordm 1ltpgtrdquo
else
echo ldquoltpgt Usuaacuterio Nordm 2ltpgtrdquo
gt
ltBODYgt
ltHTMLgt
213 Javascript
Javascript eacute uma linguagem criada pela Netscape que serve basicamente
para aumentar os recursos do navegador
Todas as paacuteginas escritas com HTML satildeo estaacuteticas Conseguem fazer com
que o browser apenas leia o que haacute no coacutedigo e reproduza aquele conjunto de
instruccedilotildees Um dos principais recursos do Javascript eacute a possibilidade de fazer com
que a paacutegina HTML seja dinacircmica ou seja capaz de fazer com que o usuaacuterio possa
interagir com a paacutegina ou usar outros recursos para fazer com que o documento
Web se altere sem necessidade de um novo carregamento de paacutegina
O Javascript eacute uma linguagem de programaccedilatildeo que funciona interativamente
com o coacutedigo HTML O Javascript consegue ler entender e manipular os objetos de
uma paacutegina HTML tendo a facilidade necessaacuteria para alteraacute-los automaticamente
quando programado Satildeo inseridos nas paacuteginas de uma maneira peculiar podendo
ter apenas uma aacuterea para scripts ou espalhados pelo coacutedigo do jeito que melhor se
adapte agraves necessidades de cada usuaacuterio Diferentemente da linguagem PHP o
Javascript eacute uma linguagem client-side (as paacuteginas satildeo armazenadas e executadas
na maacutequina cliente) (LOURENCcedilO 2000)
17
22 Programas
221 Fireworks
O Fireworks eacute uma ferramenta de produccedilatildeo graacutefica para criaccedilatildeo de interfaces
e imagens Web com interaccedilatildeo em vaacuterias linguagens scripts (como php cfml html
xml Xhtml) podendo montar sites atraveacutes de desenhos O Fireworks consegue
combinar muito bem recursos vetoriais (como o ajuste de textos recursos praacuteticos
de desenho e ediccedilatildeo de noacutes) com os recursos aplicados a bitmaps ou imagens
(como o tratamento de cores e ferramentas de efeitos)
Tambeacutem permite trabalhar com layouts de sites sendo que pode-se
transformar o layout em uma paacutegina HTML usando o recurso de slices (fatias) O
programa permite que vocecirc divida o layout inteiro em vaacuterias imagens de acordo com
as aacutereas especiacuteficas que se deseja criar Apoacutes essa divisatildeo cada uma dessas aacutereas
eacute exportada com um formato de arquivo e com uma compactaccedilatildeo especiacutefica
podendo gerar o HTML com as imagens (ou fatias) nos seus devidos lugares e
posiccedilotildees ou mesmo exporta-las para o Dreamweaver Sua outra vantagem eacute a
possibilidade de se trabalhar com os behaviors (comportamentos) Com os
bahaviors pode-se criar rollovers (menus interativos) e menus pop ups (menus que
abrem outros sub-menus de acordo com cada item) estilizados
Como o Fireworks foi inicialmente projetado para a Web permite tambeacutem a
exportaccedilatildeo de imagens para a rede Esses recursos incluem a total otimizaccedilatildeo de
cada formato de arquivo a ser exportado bem como GIFS e JPEGS Aleacutem disso
pode-se fazer uma comparaccedilatildeo visual e do tamanho do arquivo simultaneamente
de ateacute 4 formatos ou configuraccedilotildees de exportaccedilotildees e tambeacutem salvar as mesmas
configuraccedilotildees para usar mais tarde em outros arquivos (CARACTERIacuteSTICAS
2004)
222 Dreamweaver
O Dreamweaver eacute um editor profissional de HTML utilizado para projetar
codificar e desenvolver sites paacuteginas e aplicaccedilotildees Web Permite que se trabalhe as
paacuteginas HTML de forma manual ou em um ambiente de ediccedilatildeo visual fornecendo
ferramentas uacuteteis para esses fins O Dreamweaver tambeacutem permite que se construa
aplicaccedilotildees Web dinacircmicas usando linguagens que rodam nos servidores (PHP
nesse caso) (PAGE 2004) Algumas das facilidades do Dreamweaver satildeo
18
bull Administraccedilatildeo remota do site e arquivos fonte localmente
bull Operaccedilatildeo em CSS (Cascade Style Sheets)
bull Geraccedilatildeo automatizada de rotinas em Javascript
bull Formulaacuterios
bull Criaccedilatildeo e uso de templates (modelos)
bull Gerenciamento completo do site e seus componentes (por exemplo se um
arquivo de imagem for movido de um sub-diretoacuterio para outro todo o site eacute
reparado automaticamente)
bull Apresentaccedilatildeo do mapa do site com diferentes niacuteveis de detalhamento
bull Behaviors (comportamentos que depois podem ser reaproveitados) com
rotinas de JavaScript
bull Manipulaccedilatildeo de tabelas
bull Rollover de imagens
bull Administraccedilatildeo do site a partir da barra de menu
bull Reparo automaacutetico do site a partir da mudanccedila de endereccedilo ou nome de
uma miacutedia ou link em geral
23 Banco de Dados
231 MySQL
O MySQL eacute um SGDB (ou sistema gerenciador de banco de dados) que eacute
desenvolvido e distribuiacutedo pela MySQL AB a empresa fundada pelos suecos David
Axmark Allan Larsson e Michael Widenius Ele derivou de outro banco de dados o
mSQL Pelo fato do mesmo natildeo ser raacutepido nem flexiacutevel o suficiente para as suas
necessidades os suecos resolveram criar um novo banco de dados utilizando a
interface API (application programming interface - conjunto de rotinas padronizadas
que a aplicaccedilatildeo utiliza para efetuar seus serviccedilos) do proacuteprio mSQL utilizada para
facilitar a portabilidade de coacutedigos escritos do mSQL para o MySQL
Escrito em C e C++ e testado em vaacuterias plataformas diferentes o MySQL
possui um sistema de alocaccedilatildeo de memoacuteria baseado em processos que permite a
execuccedilatildeo de tarefas paralelas tornando-o extremamente raacutepido e eficiente Ele eacute um
banco de dados do tipo SQL (Structured Query Language) e por isso possui as
caracteriacutesticas dos principais bancos de dados do tipo SQL como operadores e
funccedilotildees agrupamentos joins (junccedilotildees de tabelas) aceita vaacuterios tipos de campos
19
suportando registros de tamanhos fixos ou variaacuteveis controla a seguranccedila dos
dados aleacutem de poder armazenar uma grande quantidade de dados chegando a
quantidades superiores a 50000000 de registros Aleacutem disso o MySQL eacute multi-
usuaacuterio (programas de mais de um usuaacuterio podem estar em execuccedilatildeo) eacute multi-
tarefa (eacute capaz de executar vaacuterios programas simultaneamente mesmo que a
maacutequina possua somente um processador) e open-source
Esse servidor de banco de dados eacute considerado como o mais raacutepido entre os
de sua categoria tanto para grandes volumes de dados como pequenos Poreacutem
como ele foi criado para ser extremamente aacutegil teve-se de descartar certos aspectos
das especificaccedilotildees SQL e foi decidido natildeo se implementar caracteriacutesticas que geram
muita demanda de recursos como os triggers que satildeo uma porccedilatildeo de coacutedigo
armazenado que se executa quando eacute realizada uma operaccedilatildeo (atualizaccedilatildeo
inclusatildeo etc) com o banco de dados Naturalmente comprovar a proacutepria existecircncia
do trigger e executaacute-lo consome recursos e tempo
As principais vantagens do MySQL satildeo a baixa demanda de recursos de
hardware a simplicidade de administraccedilatildeo e a otimizaccedilatildeo para as aplicaccedilotildees tiacutepicas
da web onde ocorrem mais consultas do que atualizaccedilotildees (MySQL 2004)
20
3 DESIGN DO SITE
Atraveacutes de um briefing (anexo 1) pode-se chegar a algumas conclusotildees que
influenciaram na escolha da forma de apresentaccedilatildeo das paacuteginas e levaram a
definiccedilatildeo de quais cores imagens e forma o site seria apresentado aos usuaacuterios
31 DEFINICcedilAtildeO DAS CORES
311 A Teoria das Cores
O que se convencionou chamar de Teoria das Cores de Leonardo da Vinci
satildeo as formulaccedilotildees histoacutericas esparsas contidas em seus escritos e reunidas no livro
Tratado da Pintura e da Paisagem ndash Sombra e Luz que satildeo anotaccedilotildees recolhidas
pelo artista ao longo de anos de observaccedilatildeo e eacute a teoria mais corrente sendo um
dos legados do renascimento para as artes visuais (TEORIA 2004)
312 O Disco Cromaacutetico
O disco cromaacutetico natildeo eacute um instrumento cientiacutefico de classificaccedilatildeo de cores
mas eacute muito uacutetil no entendimento da teoria das cores As cores se dividem em
primaacuterias secundaacuterias e terciaacuterias (TEORIA 2004)
Pode-se reproduzir qualquer sensaccedilatildeo de cor misturando-se aditivamente
diversas quantidades de vermelho azul e verde Por isso conhecem-se essas cores
como cores primaacuterias (ENCARTA 2000) Combinado-se duas cores primaacuterias
obtemos as cores secundaacuterias resultando no laranja (amarelo com vermelho) verde
(azul com amarelo) e violeta (vermelho com azul) As cores terciaacuterias satildeo obtidas
pela mistura de uma primaacuteria com uma ou mais secundaacuterias (TEORIA 2004)
21
A figura 1 apresenta a representaccedilatildeo graacutefica do disco cromaacutetico
FIGURA 1 ndash DISCO CROMAacuteTICO
313 Cores Anaacutelogas
Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores anaacutelogas satildeo as
cores dispostas lado a lado no disco cromaacutetico Satildeo anaacutelogas porque haacute nelas uma
mesma cor baacutesica e satildeo usadas para dar a sensaccedilatildeo de uniformidade Observando
a figura 1 visualiza-se que a cor anaacuteloga do amarelo eacute o laranja por exemplo
314 Cores Complementares Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores complementares
satildeo aquelas que encontram-se sempre em posiccedilotildees opostas no disco cromaacutetico As
cores complementares satildeo usadas para dar forccedila e equiliacutebrio a um trabalho criando
contrastes Observando a figura 1 visualiza-se que a cor complementar do
vermelho eacute o verde e do laranja eacute o azul por exemplo
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
14
O PHP 40 acompanhado com uma seacuterie de novas caracteriacutesticas foi
oficialmente lanccedilada no iniacutecio de 2000 quase dois anos apoacutes o seu antecessor
Aleacutem da melhora na performance esta versatildeo incluiu outras caracteriacutesticas chave
como o suporte para muitos servidores Web sessotildees HTTP buffer de saiacuteda e
maneiras mais seguras de manipular entrada de dados dos usuaacuterios (HISTOacuteRIA
2004)
De acordo com o site oficial do PHP (phpnetusagephp) atualmente
aproximadamente 17 milhotildees de domiacutenios estatildeo usando PHP na Web
2121 PHP - Por que utilizar
A popularidade do PHP continua crescendo rapidamente devido a muitas
vantagens Eacute raacutepido pois devido a estar embutido no coacutedigo HTML o tempo para
processar e carregar uma paacutegina Web eacute curto Eacute graacutetis e faacutecil de usar pois os
coacutedigos PHP satildeo facilmente incluiacutedos no arquivo HTML eacute versaacutetil pois o PHP roda
em uma grande variedade de sistemas operacionais eacute muito seguro pois se o
coacutedigo for escrito corretamente o usuaacuterio natildeo iraacute enxergar o coacutedigo PHP aleacutem de
ser customizaacutevel pois a licenccedila open-source permite aos programadores
modificarem o PHP adicionando ou modificando as caracteriacutesticas necessaacuterias ao
seu proacuteprio desenvolvimento
Devido ao PHP ser executado no servidor ele pode dinamicamente criar o
coacutedigo HTML que iraacute gerar a paacutegina Web permitindo que os usuaacuterios individuais
vejam paacuteginas customizadas Os visitantes da paacutegina Web vecircem a saiacuteda gerada
pelos scripts mas natildeo os scripts propriamente ditos tornando-o muito seguro
O PHP consegue trabalhar com ldquosessotildeesrdquo ou seja para executar
determinadas accedilotildees (fazer um download por exemplo) o usuaacuterio deve estar
identificado no site O PHP permite que se crie uma ldquosessatildeordquo que identifica cada
usuaacuterio no sistema aleacutem de outros dados referentes ao mesmo Se o usuaacuterio tentar
entrar em uma paacutegina especiacutefica primeiramente eacute verificado se existe uma sessatildeo
para o mesmo Se natildeo existir eacute mostrada uma mensagem de acesso proibido Se a
sessatildeo for vaacutelida os outros paracircmetros do usuaacuterio (salvos na sessatildeo) podem ser
verificados e validados caso necessaacuterio
2122 PHP - Como Funciona
15
Segundo Janet Valade (VALADE2004) O coacutedigo PHP eacute embutido no coacutedigo
HTML As tags do HTML satildeo usadas para incluir a linguagem PHP na linguagem
HTML Quando o PHP estaacute instalado o servidor Web eacute configurado para procurar
por coacutedigo PHP embutido em arquivos com extensotildees especiacuteficas (php ou phtml)
Quando o servidor recebe uma requisiccedilatildeo para um arquivo com uma dessas
extensotildees ele envia o coacutedigo HTML como estaacute mas o coacutedigo PHP eacute processado
pelo software antes de ser enviado ao solicitante Quando a linguagem PHP eacute
processada a saiacuteda consiste de coacutedigo HTML Os coacutedigos PHP natildeo satildeo incluiacutedos
no HTML enviado ao browser por isso o coacutedigo PHP eacute seguro e transparente para o
usuaacuterio Quando um browser eacute apontado para um arquivo HTML o servidor envia o
arquivo ao browser O browser processa o arquivo e mostra a paacutegina descrita pelos
tags HTML do arquivo Quando um Web browser eacute apontado para um arquivo PHP
o servidor procura por seccedilotildees PHP no arquivo e os processa enviando o resultado
do processamento ao browser Esses satildeo os passos seguidos pelo servidor para
processar um arquivo PHP
1 O servidor inicia a procura no arquivo em modo HTML Ele assume que o
coacutedigo eacute HTML e os envia ao browser sem nenhum processamento
2 O servidor web continua em modo HTML ateacute encontrar um tag de abertura do
PHP (lt)
3 Quando o servidor encontra um tag de abertura do PHP alterna para modo
PHP assume que todos os comandos subsequumlentes satildeo desse tipo e os
executa Se o comando gera uma saiacuteda a envia ao browser
4 O servidor continua em modo PHP ateacute encontrar um tag de fechamento do
PHP (gt)
5 Quando o servidor encontra um tag de fechamento do PHP retorna ao modo
HTML e repete o ciclo
2123 Forma Baacutesica de um Documento PHP
O PHP eacute embutido diretamente no programa HTML Seus comandos satildeo
delimitados pelos tags lt e gt Dentro dos tags de abertura e fechamento do PHP
satildeo incluiacutedos comandos especiacuteficos que satildeo interpretados pela linguagem A sintaxe
eacute bastante parecida com a da linguagem C Por exemplo
ltHTMLgt
16
ltHEADgtltTITLEgtTeste PHPltTITLEgtltHEADgt
ltBODYgt
ltpgt Linha HTML
lt
$id = $_GET[id]
if ($id = 1)
echo ldquoltpgtUsuaacuterio Nordm 1ltpgtrdquo
else
echo ldquoltpgt Usuaacuterio Nordm 2ltpgtrdquo
gt
ltBODYgt
ltHTMLgt
213 Javascript
Javascript eacute uma linguagem criada pela Netscape que serve basicamente
para aumentar os recursos do navegador
Todas as paacuteginas escritas com HTML satildeo estaacuteticas Conseguem fazer com
que o browser apenas leia o que haacute no coacutedigo e reproduza aquele conjunto de
instruccedilotildees Um dos principais recursos do Javascript eacute a possibilidade de fazer com
que a paacutegina HTML seja dinacircmica ou seja capaz de fazer com que o usuaacuterio possa
interagir com a paacutegina ou usar outros recursos para fazer com que o documento
Web se altere sem necessidade de um novo carregamento de paacutegina
O Javascript eacute uma linguagem de programaccedilatildeo que funciona interativamente
com o coacutedigo HTML O Javascript consegue ler entender e manipular os objetos de
uma paacutegina HTML tendo a facilidade necessaacuteria para alteraacute-los automaticamente
quando programado Satildeo inseridos nas paacuteginas de uma maneira peculiar podendo
ter apenas uma aacuterea para scripts ou espalhados pelo coacutedigo do jeito que melhor se
adapte agraves necessidades de cada usuaacuterio Diferentemente da linguagem PHP o
Javascript eacute uma linguagem client-side (as paacuteginas satildeo armazenadas e executadas
na maacutequina cliente) (LOURENCcedilO 2000)
17
22 Programas
221 Fireworks
O Fireworks eacute uma ferramenta de produccedilatildeo graacutefica para criaccedilatildeo de interfaces
e imagens Web com interaccedilatildeo em vaacuterias linguagens scripts (como php cfml html
xml Xhtml) podendo montar sites atraveacutes de desenhos O Fireworks consegue
combinar muito bem recursos vetoriais (como o ajuste de textos recursos praacuteticos
de desenho e ediccedilatildeo de noacutes) com os recursos aplicados a bitmaps ou imagens
(como o tratamento de cores e ferramentas de efeitos)
Tambeacutem permite trabalhar com layouts de sites sendo que pode-se
transformar o layout em uma paacutegina HTML usando o recurso de slices (fatias) O
programa permite que vocecirc divida o layout inteiro em vaacuterias imagens de acordo com
as aacutereas especiacuteficas que se deseja criar Apoacutes essa divisatildeo cada uma dessas aacutereas
eacute exportada com um formato de arquivo e com uma compactaccedilatildeo especiacutefica
podendo gerar o HTML com as imagens (ou fatias) nos seus devidos lugares e
posiccedilotildees ou mesmo exporta-las para o Dreamweaver Sua outra vantagem eacute a
possibilidade de se trabalhar com os behaviors (comportamentos) Com os
bahaviors pode-se criar rollovers (menus interativos) e menus pop ups (menus que
abrem outros sub-menus de acordo com cada item) estilizados
Como o Fireworks foi inicialmente projetado para a Web permite tambeacutem a
exportaccedilatildeo de imagens para a rede Esses recursos incluem a total otimizaccedilatildeo de
cada formato de arquivo a ser exportado bem como GIFS e JPEGS Aleacutem disso
pode-se fazer uma comparaccedilatildeo visual e do tamanho do arquivo simultaneamente
de ateacute 4 formatos ou configuraccedilotildees de exportaccedilotildees e tambeacutem salvar as mesmas
configuraccedilotildees para usar mais tarde em outros arquivos (CARACTERIacuteSTICAS
2004)
222 Dreamweaver
O Dreamweaver eacute um editor profissional de HTML utilizado para projetar
codificar e desenvolver sites paacuteginas e aplicaccedilotildees Web Permite que se trabalhe as
paacuteginas HTML de forma manual ou em um ambiente de ediccedilatildeo visual fornecendo
ferramentas uacuteteis para esses fins O Dreamweaver tambeacutem permite que se construa
aplicaccedilotildees Web dinacircmicas usando linguagens que rodam nos servidores (PHP
nesse caso) (PAGE 2004) Algumas das facilidades do Dreamweaver satildeo
18
bull Administraccedilatildeo remota do site e arquivos fonte localmente
bull Operaccedilatildeo em CSS (Cascade Style Sheets)
bull Geraccedilatildeo automatizada de rotinas em Javascript
bull Formulaacuterios
bull Criaccedilatildeo e uso de templates (modelos)
bull Gerenciamento completo do site e seus componentes (por exemplo se um
arquivo de imagem for movido de um sub-diretoacuterio para outro todo o site eacute
reparado automaticamente)
bull Apresentaccedilatildeo do mapa do site com diferentes niacuteveis de detalhamento
bull Behaviors (comportamentos que depois podem ser reaproveitados) com
rotinas de JavaScript
bull Manipulaccedilatildeo de tabelas
bull Rollover de imagens
bull Administraccedilatildeo do site a partir da barra de menu
bull Reparo automaacutetico do site a partir da mudanccedila de endereccedilo ou nome de
uma miacutedia ou link em geral
23 Banco de Dados
231 MySQL
O MySQL eacute um SGDB (ou sistema gerenciador de banco de dados) que eacute
desenvolvido e distribuiacutedo pela MySQL AB a empresa fundada pelos suecos David
Axmark Allan Larsson e Michael Widenius Ele derivou de outro banco de dados o
mSQL Pelo fato do mesmo natildeo ser raacutepido nem flexiacutevel o suficiente para as suas
necessidades os suecos resolveram criar um novo banco de dados utilizando a
interface API (application programming interface - conjunto de rotinas padronizadas
que a aplicaccedilatildeo utiliza para efetuar seus serviccedilos) do proacuteprio mSQL utilizada para
facilitar a portabilidade de coacutedigos escritos do mSQL para o MySQL
Escrito em C e C++ e testado em vaacuterias plataformas diferentes o MySQL
possui um sistema de alocaccedilatildeo de memoacuteria baseado em processos que permite a
execuccedilatildeo de tarefas paralelas tornando-o extremamente raacutepido e eficiente Ele eacute um
banco de dados do tipo SQL (Structured Query Language) e por isso possui as
caracteriacutesticas dos principais bancos de dados do tipo SQL como operadores e
funccedilotildees agrupamentos joins (junccedilotildees de tabelas) aceita vaacuterios tipos de campos
19
suportando registros de tamanhos fixos ou variaacuteveis controla a seguranccedila dos
dados aleacutem de poder armazenar uma grande quantidade de dados chegando a
quantidades superiores a 50000000 de registros Aleacutem disso o MySQL eacute multi-
usuaacuterio (programas de mais de um usuaacuterio podem estar em execuccedilatildeo) eacute multi-
tarefa (eacute capaz de executar vaacuterios programas simultaneamente mesmo que a
maacutequina possua somente um processador) e open-source
Esse servidor de banco de dados eacute considerado como o mais raacutepido entre os
de sua categoria tanto para grandes volumes de dados como pequenos Poreacutem
como ele foi criado para ser extremamente aacutegil teve-se de descartar certos aspectos
das especificaccedilotildees SQL e foi decidido natildeo se implementar caracteriacutesticas que geram
muita demanda de recursos como os triggers que satildeo uma porccedilatildeo de coacutedigo
armazenado que se executa quando eacute realizada uma operaccedilatildeo (atualizaccedilatildeo
inclusatildeo etc) com o banco de dados Naturalmente comprovar a proacutepria existecircncia
do trigger e executaacute-lo consome recursos e tempo
As principais vantagens do MySQL satildeo a baixa demanda de recursos de
hardware a simplicidade de administraccedilatildeo e a otimizaccedilatildeo para as aplicaccedilotildees tiacutepicas
da web onde ocorrem mais consultas do que atualizaccedilotildees (MySQL 2004)
20
3 DESIGN DO SITE
Atraveacutes de um briefing (anexo 1) pode-se chegar a algumas conclusotildees que
influenciaram na escolha da forma de apresentaccedilatildeo das paacuteginas e levaram a
definiccedilatildeo de quais cores imagens e forma o site seria apresentado aos usuaacuterios
31 DEFINICcedilAtildeO DAS CORES
311 A Teoria das Cores
O que se convencionou chamar de Teoria das Cores de Leonardo da Vinci
satildeo as formulaccedilotildees histoacutericas esparsas contidas em seus escritos e reunidas no livro
Tratado da Pintura e da Paisagem ndash Sombra e Luz que satildeo anotaccedilotildees recolhidas
pelo artista ao longo de anos de observaccedilatildeo e eacute a teoria mais corrente sendo um
dos legados do renascimento para as artes visuais (TEORIA 2004)
312 O Disco Cromaacutetico
O disco cromaacutetico natildeo eacute um instrumento cientiacutefico de classificaccedilatildeo de cores
mas eacute muito uacutetil no entendimento da teoria das cores As cores se dividem em
primaacuterias secundaacuterias e terciaacuterias (TEORIA 2004)
Pode-se reproduzir qualquer sensaccedilatildeo de cor misturando-se aditivamente
diversas quantidades de vermelho azul e verde Por isso conhecem-se essas cores
como cores primaacuterias (ENCARTA 2000) Combinado-se duas cores primaacuterias
obtemos as cores secundaacuterias resultando no laranja (amarelo com vermelho) verde
(azul com amarelo) e violeta (vermelho com azul) As cores terciaacuterias satildeo obtidas
pela mistura de uma primaacuteria com uma ou mais secundaacuterias (TEORIA 2004)
21
A figura 1 apresenta a representaccedilatildeo graacutefica do disco cromaacutetico
FIGURA 1 ndash DISCO CROMAacuteTICO
313 Cores Anaacutelogas
Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores anaacutelogas satildeo as
cores dispostas lado a lado no disco cromaacutetico Satildeo anaacutelogas porque haacute nelas uma
mesma cor baacutesica e satildeo usadas para dar a sensaccedilatildeo de uniformidade Observando
a figura 1 visualiza-se que a cor anaacuteloga do amarelo eacute o laranja por exemplo
314 Cores Complementares Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores complementares
satildeo aquelas que encontram-se sempre em posiccedilotildees opostas no disco cromaacutetico As
cores complementares satildeo usadas para dar forccedila e equiliacutebrio a um trabalho criando
contrastes Observando a figura 1 visualiza-se que a cor complementar do
vermelho eacute o verde e do laranja eacute o azul por exemplo
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
15
Segundo Janet Valade (VALADE2004) O coacutedigo PHP eacute embutido no coacutedigo
HTML As tags do HTML satildeo usadas para incluir a linguagem PHP na linguagem
HTML Quando o PHP estaacute instalado o servidor Web eacute configurado para procurar
por coacutedigo PHP embutido em arquivos com extensotildees especiacuteficas (php ou phtml)
Quando o servidor recebe uma requisiccedilatildeo para um arquivo com uma dessas
extensotildees ele envia o coacutedigo HTML como estaacute mas o coacutedigo PHP eacute processado
pelo software antes de ser enviado ao solicitante Quando a linguagem PHP eacute
processada a saiacuteda consiste de coacutedigo HTML Os coacutedigos PHP natildeo satildeo incluiacutedos
no HTML enviado ao browser por isso o coacutedigo PHP eacute seguro e transparente para o
usuaacuterio Quando um browser eacute apontado para um arquivo HTML o servidor envia o
arquivo ao browser O browser processa o arquivo e mostra a paacutegina descrita pelos
tags HTML do arquivo Quando um Web browser eacute apontado para um arquivo PHP
o servidor procura por seccedilotildees PHP no arquivo e os processa enviando o resultado
do processamento ao browser Esses satildeo os passos seguidos pelo servidor para
processar um arquivo PHP
1 O servidor inicia a procura no arquivo em modo HTML Ele assume que o
coacutedigo eacute HTML e os envia ao browser sem nenhum processamento
2 O servidor web continua em modo HTML ateacute encontrar um tag de abertura do
PHP (lt)
3 Quando o servidor encontra um tag de abertura do PHP alterna para modo
PHP assume que todos os comandos subsequumlentes satildeo desse tipo e os
executa Se o comando gera uma saiacuteda a envia ao browser
4 O servidor continua em modo PHP ateacute encontrar um tag de fechamento do
PHP (gt)
5 Quando o servidor encontra um tag de fechamento do PHP retorna ao modo
HTML e repete o ciclo
2123 Forma Baacutesica de um Documento PHP
O PHP eacute embutido diretamente no programa HTML Seus comandos satildeo
delimitados pelos tags lt e gt Dentro dos tags de abertura e fechamento do PHP
satildeo incluiacutedos comandos especiacuteficos que satildeo interpretados pela linguagem A sintaxe
eacute bastante parecida com a da linguagem C Por exemplo
ltHTMLgt
16
ltHEADgtltTITLEgtTeste PHPltTITLEgtltHEADgt
ltBODYgt
ltpgt Linha HTML
lt
$id = $_GET[id]
if ($id = 1)
echo ldquoltpgtUsuaacuterio Nordm 1ltpgtrdquo
else
echo ldquoltpgt Usuaacuterio Nordm 2ltpgtrdquo
gt
ltBODYgt
ltHTMLgt
213 Javascript
Javascript eacute uma linguagem criada pela Netscape que serve basicamente
para aumentar os recursos do navegador
Todas as paacuteginas escritas com HTML satildeo estaacuteticas Conseguem fazer com
que o browser apenas leia o que haacute no coacutedigo e reproduza aquele conjunto de
instruccedilotildees Um dos principais recursos do Javascript eacute a possibilidade de fazer com
que a paacutegina HTML seja dinacircmica ou seja capaz de fazer com que o usuaacuterio possa
interagir com a paacutegina ou usar outros recursos para fazer com que o documento
Web se altere sem necessidade de um novo carregamento de paacutegina
O Javascript eacute uma linguagem de programaccedilatildeo que funciona interativamente
com o coacutedigo HTML O Javascript consegue ler entender e manipular os objetos de
uma paacutegina HTML tendo a facilidade necessaacuteria para alteraacute-los automaticamente
quando programado Satildeo inseridos nas paacuteginas de uma maneira peculiar podendo
ter apenas uma aacuterea para scripts ou espalhados pelo coacutedigo do jeito que melhor se
adapte agraves necessidades de cada usuaacuterio Diferentemente da linguagem PHP o
Javascript eacute uma linguagem client-side (as paacuteginas satildeo armazenadas e executadas
na maacutequina cliente) (LOURENCcedilO 2000)
17
22 Programas
221 Fireworks
O Fireworks eacute uma ferramenta de produccedilatildeo graacutefica para criaccedilatildeo de interfaces
e imagens Web com interaccedilatildeo em vaacuterias linguagens scripts (como php cfml html
xml Xhtml) podendo montar sites atraveacutes de desenhos O Fireworks consegue
combinar muito bem recursos vetoriais (como o ajuste de textos recursos praacuteticos
de desenho e ediccedilatildeo de noacutes) com os recursos aplicados a bitmaps ou imagens
(como o tratamento de cores e ferramentas de efeitos)
Tambeacutem permite trabalhar com layouts de sites sendo que pode-se
transformar o layout em uma paacutegina HTML usando o recurso de slices (fatias) O
programa permite que vocecirc divida o layout inteiro em vaacuterias imagens de acordo com
as aacutereas especiacuteficas que se deseja criar Apoacutes essa divisatildeo cada uma dessas aacutereas
eacute exportada com um formato de arquivo e com uma compactaccedilatildeo especiacutefica
podendo gerar o HTML com as imagens (ou fatias) nos seus devidos lugares e
posiccedilotildees ou mesmo exporta-las para o Dreamweaver Sua outra vantagem eacute a
possibilidade de se trabalhar com os behaviors (comportamentos) Com os
bahaviors pode-se criar rollovers (menus interativos) e menus pop ups (menus que
abrem outros sub-menus de acordo com cada item) estilizados
Como o Fireworks foi inicialmente projetado para a Web permite tambeacutem a
exportaccedilatildeo de imagens para a rede Esses recursos incluem a total otimizaccedilatildeo de
cada formato de arquivo a ser exportado bem como GIFS e JPEGS Aleacutem disso
pode-se fazer uma comparaccedilatildeo visual e do tamanho do arquivo simultaneamente
de ateacute 4 formatos ou configuraccedilotildees de exportaccedilotildees e tambeacutem salvar as mesmas
configuraccedilotildees para usar mais tarde em outros arquivos (CARACTERIacuteSTICAS
2004)
222 Dreamweaver
O Dreamweaver eacute um editor profissional de HTML utilizado para projetar
codificar e desenvolver sites paacuteginas e aplicaccedilotildees Web Permite que se trabalhe as
paacuteginas HTML de forma manual ou em um ambiente de ediccedilatildeo visual fornecendo
ferramentas uacuteteis para esses fins O Dreamweaver tambeacutem permite que se construa
aplicaccedilotildees Web dinacircmicas usando linguagens que rodam nos servidores (PHP
nesse caso) (PAGE 2004) Algumas das facilidades do Dreamweaver satildeo
18
bull Administraccedilatildeo remota do site e arquivos fonte localmente
bull Operaccedilatildeo em CSS (Cascade Style Sheets)
bull Geraccedilatildeo automatizada de rotinas em Javascript
bull Formulaacuterios
bull Criaccedilatildeo e uso de templates (modelos)
bull Gerenciamento completo do site e seus componentes (por exemplo se um
arquivo de imagem for movido de um sub-diretoacuterio para outro todo o site eacute
reparado automaticamente)
bull Apresentaccedilatildeo do mapa do site com diferentes niacuteveis de detalhamento
bull Behaviors (comportamentos que depois podem ser reaproveitados) com
rotinas de JavaScript
bull Manipulaccedilatildeo de tabelas
bull Rollover de imagens
bull Administraccedilatildeo do site a partir da barra de menu
bull Reparo automaacutetico do site a partir da mudanccedila de endereccedilo ou nome de
uma miacutedia ou link em geral
23 Banco de Dados
231 MySQL
O MySQL eacute um SGDB (ou sistema gerenciador de banco de dados) que eacute
desenvolvido e distribuiacutedo pela MySQL AB a empresa fundada pelos suecos David
Axmark Allan Larsson e Michael Widenius Ele derivou de outro banco de dados o
mSQL Pelo fato do mesmo natildeo ser raacutepido nem flexiacutevel o suficiente para as suas
necessidades os suecos resolveram criar um novo banco de dados utilizando a
interface API (application programming interface - conjunto de rotinas padronizadas
que a aplicaccedilatildeo utiliza para efetuar seus serviccedilos) do proacuteprio mSQL utilizada para
facilitar a portabilidade de coacutedigos escritos do mSQL para o MySQL
Escrito em C e C++ e testado em vaacuterias plataformas diferentes o MySQL
possui um sistema de alocaccedilatildeo de memoacuteria baseado em processos que permite a
execuccedilatildeo de tarefas paralelas tornando-o extremamente raacutepido e eficiente Ele eacute um
banco de dados do tipo SQL (Structured Query Language) e por isso possui as
caracteriacutesticas dos principais bancos de dados do tipo SQL como operadores e
funccedilotildees agrupamentos joins (junccedilotildees de tabelas) aceita vaacuterios tipos de campos
19
suportando registros de tamanhos fixos ou variaacuteveis controla a seguranccedila dos
dados aleacutem de poder armazenar uma grande quantidade de dados chegando a
quantidades superiores a 50000000 de registros Aleacutem disso o MySQL eacute multi-
usuaacuterio (programas de mais de um usuaacuterio podem estar em execuccedilatildeo) eacute multi-
tarefa (eacute capaz de executar vaacuterios programas simultaneamente mesmo que a
maacutequina possua somente um processador) e open-source
Esse servidor de banco de dados eacute considerado como o mais raacutepido entre os
de sua categoria tanto para grandes volumes de dados como pequenos Poreacutem
como ele foi criado para ser extremamente aacutegil teve-se de descartar certos aspectos
das especificaccedilotildees SQL e foi decidido natildeo se implementar caracteriacutesticas que geram
muita demanda de recursos como os triggers que satildeo uma porccedilatildeo de coacutedigo
armazenado que se executa quando eacute realizada uma operaccedilatildeo (atualizaccedilatildeo
inclusatildeo etc) com o banco de dados Naturalmente comprovar a proacutepria existecircncia
do trigger e executaacute-lo consome recursos e tempo
As principais vantagens do MySQL satildeo a baixa demanda de recursos de
hardware a simplicidade de administraccedilatildeo e a otimizaccedilatildeo para as aplicaccedilotildees tiacutepicas
da web onde ocorrem mais consultas do que atualizaccedilotildees (MySQL 2004)
20
3 DESIGN DO SITE
Atraveacutes de um briefing (anexo 1) pode-se chegar a algumas conclusotildees que
influenciaram na escolha da forma de apresentaccedilatildeo das paacuteginas e levaram a
definiccedilatildeo de quais cores imagens e forma o site seria apresentado aos usuaacuterios
31 DEFINICcedilAtildeO DAS CORES
311 A Teoria das Cores
O que se convencionou chamar de Teoria das Cores de Leonardo da Vinci
satildeo as formulaccedilotildees histoacutericas esparsas contidas em seus escritos e reunidas no livro
Tratado da Pintura e da Paisagem ndash Sombra e Luz que satildeo anotaccedilotildees recolhidas
pelo artista ao longo de anos de observaccedilatildeo e eacute a teoria mais corrente sendo um
dos legados do renascimento para as artes visuais (TEORIA 2004)
312 O Disco Cromaacutetico
O disco cromaacutetico natildeo eacute um instrumento cientiacutefico de classificaccedilatildeo de cores
mas eacute muito uacutetil no entendimento da teoria das cores As cores se dividem em
primaacuterias secundaacuterias e terciaacuterias (TEORIA 2004)
Pode-se reproduzir qualquer sensaccedilatildeo de cor misturando-se aditivamente
diversas quantidades de vermelho azul e verde Por isso conhecem-se essas cores
como cores primaacuterias (ENCARTA 2000) Combinado-se duas cores primaacuterias
obtemos as cores secundaacuterias resultando no laranja (amarelo com vermelho) verde
(azul com amarelo) e violeta (vermelho com azul) As cores terciaacuterias satildeo obtidas
pela mistura de uma primaacuteria com uma ou mais secundaacuterias (TEORIA 2004)
21
A figura 1 apresenta a representaccedilatildeo graacutefica do disco cromaacutetico
FIGURA 1 ndash DISCO CROMAacuteTICO
313 Cores Anaacutelogas
Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores anaacutelogas satildeo as
cores dispostas lado a lado no disco cromaacutetico Satildeo anaacutelogas porque haacute nelas uma
mesma cor baacutesica e satildeo usadas para dar a sensaccedilatildeo de uniformidade Observando
a figura 1 visualiza-se que a cor anaacuteloga do amarelo eacute o laranja por exemplo
314 Cores Complementares Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores complementares
satildeo aquelas que encontram-se sempre em posiccedilotildees opostas no disco cromaacutetico As
cores complementares satildeo usadas para dar forccedila e equiliacutebrio a um trabalho criando
contrastes Observando a figura 1 visualiza-se que a cor complementar do
vermelho eacute o verde e do laranja eacute o azul por exemplo
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
16
ltHEADgtltTITLEgtTeste PHPltTITLEgtltHEADgt
ltBODYgt
ltpgt Linha HTML
lt
$id = $_GET[id]
if ($id = 1)
echo ldquoltpgtUsuaacuterio Nordm 1ltpgtrdquo
else
echo ldquoltpgt Usuaacuterio Nordm 2ltpgtrdquo
gt
ltBODYgt
ltHTMLgt
213 Javascript
Javascript eacute uma linguagem criada pela Netscape que serve basicamente
para aumentar os recursos do navegador
Todas as paacuteginas escritas com HTML satildeo estaacuteticas Conseguem fazer com
que o browser apenas leia o que haacute no coacutedigo e reproduza aquele conjunto de
instruccedilotildees Um dos principais recursos do Javascript eacute a possibilidade de fazer com
que a paacutegina HTML seja dinacircmica ou seja capaz de fazer com que o usuaacuterio possa
interagir com a paacutegina ou usar outros recursos para fazer com que o documento
Web se altere sem necessidade de um novo carregamento de paacutegina
O Javascript eacute uma linguagem de programaccedilatildeo que funciona interativamente
com o coacutedigo HTML O Javascript consegue ler entender e manipular os objetos de
uma paacutegina HTML tendo a facilidade necessaacuteria para alteraacute-los automaticamente
quando programado Satildeo inseridos nas paacuteginas de uma maneira peculiar podendo
ter apenas uma aacuterea para scripts ou espalhados pelo coacutedigo do jeito que melhor se
adapte agraves necessidades de cada usuaacuterio Diferentemente da linguagem PHP o
Javascript eacute uma linguagem client-side (as paacuteginas satildeo armazenadas e executadas
na maacutequina cliente) (LOURENCcedilO 2000)
17
22 Programas
221 Fireworks
O Fireworks eacute uma ferramenta de produccedilatildeo graacutefica para criaccedilatildeo de interfaces
e imagens Web com interaccedilatildeo em vaacuterias linguagens scripts (como php cfml html
xml Xhtml) podendo montar sites atraveacutes de desenhos O Fireworks consegue
combinar muito bem recursos vetoriais (como o ajuste de textos recursos praacuteticos
de desenho e ediccedilatildeo de noacutes) com os recursos aplicados a bitmaps ou imagens
(como o tratamento de cores e ferramentas de efeitos)
Tambeacutem permite trabalhar com layouts de sites sendo que pode-se
transformar o layout em uma paacutegina HTML usando o recurso de slices (fatias) O
programa permite que vocecirc divida o layout inteiro em vaacuterias imagens de acordo com
as aacutereas especiacuteficas que se deseja criar Apoacutes essa divisatildeo cada uma dessas aacutereas
eacute exportada com um formato de arquivo e com uma compactaccedilatildeo especiacutefica
podendo gerar o HTML com as imagens (ou fatias) nos seus devidos lugares e
posiccedilotildees ou mesmo exporta-las para o Dreamweaver Sua outra vantagem eacute a
possibilidade de se trabalhar com os behaviors (comportamentos) Com os
bahaviors pode-se criar rollovers (menus interativos) e menus pop ups (menus que
abrem outros sub-menus de acordo com cada item) estilizados
Como o Fireworks foi inicialmente projetado para a Web permite tambeacutem a
exportaccedilatildeo de imagens para a rede Esses recursos incluem a total otimizaccedilatildeo de
cada formato de arquivo a ser exportado bem como GIFS e JPEGS Aleacutem disso
pode-se fazer uma comparaccedilatildeo visual e do tamanho do arquivo simultaneamente
de ateacute 4 formatos ou configuraccedilotildees de exportaccedilotildees e tambeacutem salvar as mesmas
configuraccedilotildees para usar mais tarde em outros arquivos (CARACTERIacuteSTICAS
2004)
222 Dreamweaver
O Dreamweaver eacute um editor profissional de HTML utilizado para projetar
codificar e desenvolver sites paacuteginas e aplicaccedilotildees Web Permite que se trabalhe as
paacuteginas HTML de forma manual ou em um ambiente de ediccedilatildeo visual fornecendo
ferramentas uacuteteis para esses fins O Dreamweaver tambeacutem permite que se construa
aplicaccedilotildees Web dinacircmicas usando linguagens que rodam nos servidores (PHP
nesse caso) (PAGE 2004) Algumas das facilidades do Dreamweaver satildeo
18
bull Administraccedilatildeo remota do site e arquivos fonte localmente
bull Operaccedilatildeo em CSS (Cascade Style Sheets)
bull Geraccedilatildeo automatizada de rotinas em Javascript
bull Formulaacuterios
bull Criaccedilatildeo e uso de templates (modelos)
bull Gerenciamento completo do site e seus componentes (por exemplo se um
arquivo de imagem for movido de um sub-diretoacuterio para outro todo o site eacute
reparado automaticamente)
bull Apresentaccedilatildeo do mapa do site com diferentes niacuteveis de detalhamento
bull Behaviors (comportamentos que depois podem ser reaproveitados) com
rotinas de JavaScript
bull Manipulaccedilatildeo de tabelas
bull Rollover de imagens
bull Administraccedilatildeo do site a partir da barra de menu
bull Reparo automaacutetico do site a partir da mudanccedila de endereccedilo ou nome de
uma miacutedia ou link em geral
23 Banco de Dados
231 MySQL
O MySQL eacute um SGDB (ou sistema gerenciador de banco de dados) que eacute
desenvolvido e distribuiacutedo pela MySQL AB a empresa fundada pelos suecos David
Axmark Allan Larsson e Michael Widenius Ele derivou de outro banco de dados o
mSQL Pelo fato do mesmo natildeo ser raacutepido nem flexiacutevel o suficiente para as suas
necessidades os suecos resolveram criar um novo banco de dados utilizando a
interface API (application programming interface - conjunto de rotinas padronizadas
que a aplicaccedilatildeo utiliza para efetuar seus serviccedilos) do proacuteprio mSQL utilizada para
facilitar a portabilidade de coacutedigos escritos do mSQL para o MySQL
Escrito em C e C++ e testado em vaacuterias plataformas diferentes o MySQL
possui um sistema de alocaccedilatildeo de memoacuteria baseado em processos que permite a
execuccedilatildeo de tarefas paralelas tornando-o extremamente raacutepido e eficiente Ele eacute um
banco de dados do tipo SQL (Structured Query Language) e por isso possui as
caracteriacutesticas dos principais bancos de dados do tipo SQL como operadores e
funccedilotildees agrupamentos joins (junccedilotildees de tabelas) aceita vaacuterios tipos de campos
19
suportando registros de tamanhos fixos ou variaacuteveis controla a seguranccedila dos
dados aleacutem de poder armazenar uma grande quantidade de dados chegando a
quantidades superiores a 50000000 de registros Aleacutem disso o MySQL eacute multi-
usuaacuterio (programas de mais de um usuaacuterio podem estar em execuccedilatildeo) eacute multi-
tarefa (eacute capaz de executar vaacuterios programas simultaneamente mesmo que a
maacutequina possua somente um processador) e open-source
Esse servidor de banco de dados eacute considerado como o mais raacutepido entre os
de sua categoria tanto para grandes volumes de dados como pequenos Poreacutem
como ele foi criado para ser extremamente aacutegil teve-se de descartar certos aspectos
das especificaccedilotildees SQL e foi decidido natildeo se implementar caracteriacutesticas que geram
muita demanda de recursos como os triggers que satildeo uma porccedilatildeo de coacutedigo
armazenado que se executa quando eacute realizada uma operaccedilatildeo (atualizaccedilatildeo
inclusatildeo etc) com o banco de dados Naturalmente comprovar a proacutepria existecircncia
do trigger e executaacute-lo consome recursos e tempo
As principais vantagens do MySQL satildeo a baixa demanda de recursos de
hardware a simplicidade de administraccedilatildeo e a otimizaccedilatildeo para as aplicaccedilotildees tiacutepicas
da web onde ocorrem mais consultas do que atualizaccedilotildees (MySQL 2004)
20
3 DESIGN DO SITE
Atraveacutes de um briefing (anexo 1) pode-se chegar a algumas conclusotildees que
influenciaram na escolha da forma de apresentaccedilatildeo das paacuteginas e levaram a
definiccedilatildeo de quais cores imagens e forma o site seria apresentado aos usuaacuterios
31 DEFINICcedilAtildeO DAS CORES
311 A Teoria das Cores
O que se convencionou chamar de Teoria das Cores de Leonardo da Vinci
satildeo as formulaccedilotildees histoacutericas esparsas contidas em seus escritos e reunidas no livro
Tratado da Pintura e da Paisagem ndash Sombra e Luz que satildeo anotaccedilotildees recolhidas
pelo artista ao longo de anos de observaccedilatildeo e eacute a teoria mais corrente sendo um
dos legados do renascimento para as artes visuais (TEORIA 2004)
312 O Disco Cromaacutetico
O disco cromaacutetico natildeo eacute um instrumento cientiacutefico de classificaccedilatildeo de cores
mas eacute muito uacutetil no entendimento da teoria das cores As cores se dividem em
primaacuterias secundaacuterias e terciaacuterias (TEORIA 2004)
Pode-se reproduzir qualquer sensaccedilatildeo de cor misturando-se aditivamente
diversas quantidades de vermelho azul e verde Por isso conhecem-se essas cores
como cores primaacuterias (ENCARTA 2000) Combinado-se duas cores primaacuterias
obtemos as cores secundaacuterias resultando no laranja (amarelo com vermelho) verde
(azul com amarelo) e violeta (vermelho com azul) As cores terciaacuterias satildeo obtidas
pela mistura de uma primaacuteria com uma ou mais secundaacuterias (TEORIA 2004)
21
A figura 1 apresenta a representaccedilatildeo graacutefica do disco cromaacutetico
FIGURA 1 ndash DISCO CROMAacuteTICO
313 Cores Anaacutelogas
Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores anaacutelogas satildeo as
cores dispostas lado a lado no disco cromaacutetico Satildeo anaacutelogas porque haacute nelas uma
mesma cor baacutesica e satildeo usadas para dar a sensaccedilatildeo de uniformidade Observando
a figura 1 visualiza-se que a cor anaacuteloga do amarelo eacute o laranja por exemplo
314 Cores Complementares Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores complementares
satildeo aquelas que encontram-se sempre em posiccedilotildees opostas no disco cromaacutetico As
cores complementares satildeo usadas para dar forccedila e equiliacutebrio a um trabalho criando
contrastes Observando a figura 1 visualiza-se que a cor complementar do
vermelho eacute o verde e do laranja eacute o azul por exemplo
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
17
22 Programas
221 Fireworks
O Fireworks eacute uma ferramenta de produccedilatildeo graacutefica para criaccedilatildeo de interfaces
e imagens Web com interaccedilatildeo em vaacuterias linguagens scripts (como php cfml html
xml Xhtml) podendo montar sites atraveacutes de desenhos O Fireworks consegue
combinar muito bem recursos vetoriais (como o ajuste de textos recursos praacuteticos
de desenho e ediccedilatildeo de noacutes) com os recursos aplicados a bitmaps ou imagens
(como o tratamento de cores e ferramentas de efeitos)
Tambeacutem permite trabalhar com layouts de sites sendo que pode-se
transformar o layout em uma paacutegina HTML usando o recurso de slices (fatias) O
programa permite que vocecirc divida o layout inteiro em vaacuterias imagens de acordo com
as aacutereas especiacuteficas que se deseja criar Apoacutes essa divisatildeo cada uma dessas aacutereas
eacute exportada com um formato de arquivo e com uma compactaccedilatildeo especiacutefica
podendo gerar o HTML com as imagens (ou fatias) nos seus devidos lugares e
posiccedilotildees ou mesmo exporta-las para o Dreamweaver Sua outra vantagem eacute a
possibilidade de se trabalhar com os behaviors (comportamentos) Com os
bahaviors pode-se criar rollovers (menus interativos) e menus pop ups (menus que
abrem outros sub-menus de acordo com cada item) estilizados
Como o Fireworks foi inicialmente projetado para a Web permite tambeacutem a
exportaccedilatildeo de imagens para a rede Esses recursos incluem a total otimizaccedilatildeo de
cada formato de arquivo a ser exportado bem como GIFS e JPEGS Aleacutem disso
pode-se fazer uma comparaccedilatildeo visual e do tamanho do arquivo simultaneamente
de ateacute 4 formatos ou configuraccedilotildees de exportaccedilotildees e tambeacutem salvar as mesmas
configuraccedilotildees para usar mais tarde em outros arquivos (CARACTERIacuteSTICAS
2004)
222 Dreamweaver
O Dreamweaver eacute um editor profissional de HTML utilizado para projetar
codificar e desenvolver sites paacuteginas e aplicaccedilotildees Web Permite que se trabalhe as
paacuteginas HTML de forma manual ou em um ambiente de ediccedilatildeo visual fornecendo
ferramentas uacuteteis para esses fins O Dreamweaver tambeacutem permite que se construa
aplicaccedilotildees Web dinacircmicas usando linguagens que rodam nos servidores (PHP
nesse caso) (PAGE 2004) Algumas das facilidades do Dreamweaver satildeo
18
bull Administraccedilatildeo remota do site e arquivos fonte localmente
bull Operaccedilatildeo em CSS (Cascade Style Sheets)
bull Geraccedilatildeo automatizada de rotinas em Javascript
bull Formulaacuterios
bull Criaccedilatildeo e uso de templates (modelos)
bull Gerenciamento completo do site e seus componentes (por exemplo se um
arquivo de imagem for movido de um sub-diretoacuterio para outro todo o site eacute
reparado automaticamente)
bull Apresentaccedilatildeo do mapa do site com diferentes niacuteveis de detalhamento
bull Behaviors (comportamentos que depois podem ser reaproveitados) com
rotinas de JavaScript
bull Manipulaccedilatildeo de tabelas
bull Rollover de imagens
bull Administraccedilatildeo do site a partir da barra de menu
bull Reparo automaacutetico do site a partir da mudanccedila de endereccedilo ou nome de
uma miacutedia ou link em geral
23 Banco de Dados
231 MySQL
O MySQL eacute um SGDB (ou sistema gerenciador de banco de dados) que eacute
desenvolvido e distribuiacutedo pela MySQL AB a empresa fundada pelos suecos David
Axmark Allan Larsson e Michael Widenius Ele derivou de outro banco de dados o
mSQL Pelo fato do mesmo natildeo ser raacutepido nem flexiacutevel o suficiente para as suas
necessidades os suecos resolveram criar um novo banco de dados utilizando a
interface API (application programming interface - conjunto de rotinas padronizadas
que a aplicaccedilatildeo utiliza para efetuar seus serviccedilos) do proacuteprio mSQL utilizada para
facilitar a portabilidade de coacutedigos escritos do mSQL para o MySQL
Escrito em C e C++ e testado em vaacuterias plataformas diferentes o MySQL
possui um sistema de alocaccedilatildeo de memoacuteria baseado em processos que permite a
execuccedilatildeo de tarefas paralelas tornando-o extremamente raacutepido e eficiente Ele eacute um
banco de dados do tipo SQL (Structured Query Language) e por isso possui as
caracteriacutesticas dos principais bancos de dados do tipo SQL como operadores e
funccedilotildees agrupamentos joins (junccedilotildees de tabelas) aceita vaacuterios tipos de campos
19
suportando registros de tamanhos fixos ou variaacuteveis controla a seguranccedila dos
dados aleacutem de poder armazenar uma grande quantidade de dados chegando a
quantidades superiores a 50000000 de registros Aleacutem disso o MySQL eacute multi-
usuaacuterio (programas de mais de um usuaacuterio podem estar em execuccedilatildeo) eacute multi-
tarefa (eacute capaz de executar vaacuterios programas simultaneamente mesmo que a
maacutequina possua somente um processador) e open-source
Esse servidor de banco de dados eacute considerado como o mais raacutepido entre os
de sua categoria tanto para grandes volumes de dados como pequenos Poreacutem
como ele foi criado para ser extremamente aacutegil teve-se de descartar certos aspectos
das especificaccedilotildees SQL e foi decidido natildeo se implementar caracteriacutesticas que geram
muita demanda de recursos como os triggers que satildeo uma porccedilatildeo de coacutedigo
armazenado que se executa quando eacute realizada uma operaccedilatildeo (atualizaccedilatildeo
inclusatildeo etc) com o banco de dados Naturalmente comprovar a proacutepria existecircncia
do trigger e executaacute-lo consome recursos e tempo
As principais vantagens do MySQL satildeo a baixa demanda de recursos de
hardware a simplicidade de administraccedilatildeo e a otimizaccedilatildeo para as aplicaccedilotildees tiacutepicas
da web onde ocorrem mais consultas do que atualizaccedilotildees (MySQL 2004)
20
3 DESIGN DO SITE
Atraveacutes de um briefing (anexo 1) pode-se chegar a algumas conclusotildees que
influenciaram na escolha da forma de apresentaccedilatildeo das paacuteginas e levaram a
definiccedilatildeo de quais cores imagens e forma o site seria apresentado aos usuaacuterios
31 DEFINICcedilAtildeO DAS CORES
311 A Teoria das Cores
O que se convencionou chamar de Teoria das Cores de Leonardo da Vinci
satildeo as formulaccedilotildees histoacutericas esparsas contidas em seus escritos e reunidas no livro
Tratado da Pintura e da Paisagem ndash Sombra e Luz que satildeo anotaccedilotildees recolhidas
pelo artista ao longo de anos de observaccedilatildeo e eacute a teoria mais corrente sendo um
dos legados do renascimento para as artes visuais (TEORIA 2004)
312 O Disco Cromaacutetico
O disco cromaacutetico natildeo eacute um instrumento cientiacutefico de classificaccedilatildeo de cores
mas eacute muito uacutetil no entendimento da teoria das cores As cores se dividem em
primaacuterias secundaacuterias e terciaacuterias (TEORIA 2004)
Pode-se reproduzir qualquer sensaccedilatildeo de cor misturando-se aditivamente
diversas quantidades de vermelho azul e verde Por isso conhecem-se essas cores
como cores primaacuterias (ENCARTA 2000) Combinado-se duas cores primaacuterias
obtemos as cores secundaacuterias resultando no laranja (amarelo com vermelho) verde
(azul com amarelo) e violeta (vermelho com azul) As cores terciaacuterias satildeo obtidas
pela mistura de uma primaacuteria com uma ou mais secundaacuterias (TEORIA 2004)
21
A figura 1 apresenta a representaccedilatildeo graacutefica do disco cromaacutetico
FIGURA 1 ndash DISCO CROMAacuteTICO
313 Cores Anaacutelogas
Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores anaacutelogas satildeo as
cores dispostas lado a lado no disco cromaacutetico Satildeo anaacutelogas porque haacute nelas uma
mesma cor baacutesica e satildeo usadas para dar a sensaccedilatildeo de uniformidade Observando
a figura 1 visualiza-se que a cor anaacuteloga do amarelo eacute o laranja por exemplo
314 Cores Complementares Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores complementares
satildeo aquelas que encontram-se sempre em posiccedilotildees opostas no disco cromaacutetico As
cores complementares satildeo usadas para dar forccedila e equiliacutebrio a um trabalho criando
contrastes Observando a figura 1 visualiza-se que a cor complementar do
vermelho eacute o verde e do laranja eacute o azul por exemplo
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
18
bull Administraccedilatildeo remota do site e arquivos fonte localmente
bull Operaccedilatildeo em CSS (Cascade Style Sheets)
bull Geraccedilatildeo automatizada de rotinas em Javascript
bull Formulaacuterios
bull Criaccedilatildeo e uso de templates (modelos)
bull Gerenciamento completo do site e seus componentes (por exemplo se um
arquivo de imagem for movido de um sub-diretoacuterio para outro todo o site eacute
reparado automaticamente)
bull Apresentaccedilatildeo do mapa do site com diferentes niacuteveis de detalhamento
bull Behaviors (comportamentos que depois podem ser reaproveitados) com
rotinas de JavaScript
bull Manipulaccedilatildeo de tabelas
bull Rollover de imagens
bull Administraccedilatildeo do site a partir da barra de menu
bull Reparo automaacutetico do site a partir da mudanccedila de endereccedilo ou nome de
uma miacutedia ou link em geral
23 Banco de Dados
231 MySQL
O MySQL eacute um SGDB (ou sistema gerenciador de banco de dados) que eacute
desenvolvido e distribuiacutedo pela MySQL AB a empresa fundada pelos suecos David
Axmark Allan Larsson e Michael Widenius Ele derivou de outro banco de dados o
mSQL Pelo fato do mesmo natildeo ser raacutepido nem flexiacutevel o suficiente para as suas
necessidades os suecos resolveram criar um novo banco de dados utilizando a
interface API (application programming interface - conjunto de rotinas padronizadas
que a aplicaccedilatildeo utiliza para efetuar seus serviccedilos) do proacuteprio mSQL utilizada para
facilitar a portabilidade de coacutedigos escritos do mSQL para o MySQL
Escrito em C e C++ e testado em vaacuterias plataformas diferentes o MySQL
possui um sistema de alocaccedilatildeo de memoacuteria baseado em processos que permite a
execuccedilatildeo de tarefas paralelas tornando-o extremamente raacutepido e eficiente Ele eacute um
banco de dados do tipo SQL (Structured Query Language) e por isso possui as
caracteriacutesticas dos principais bancos de dados do tipo SQL como operadores e
funccedilotildees agrupamentos joins (junccedilotildees de tabelas) aceita vaacuterios tipos de campos
19
suportando registros de tamanhos fixos ou variaacuteveis controla a seguranccedila dos
dados aleacutem de poder armazenar uma grande quantidade de dados chegando a
quantidades superiores a 50000000 de registros Aleacutem disso o MySQL eacute multi-
usuaacuterio (programas de mais de um usuaacuterio podem estar em execuccedilatildeo) eacute multi-
tarefa (eacute capaz de executar vaacuterios programas simultaneamente mesmo que a
maacutequina possua somente um processador) e open-source
Esse servidor de banco de dados eacute considerado como o mais raacutepido entre os
de sua categoria tanto para grandes volumes de dados como pequenos Poreacutem
como ele foi criado para ser extremamente aacutegil teve-se de descartar certos aspectos
das especificaccedilotildees SQL e foi decidido natildeo se implementar caracteriacutesticas que geram
muita demanda de recursos como os triggers que satildeo uma porccedilatildeo de coacutedigo
armazenado que se executa quando eacute realizada uma operaccedilatildeo (atualizaccedilatildeo
inclusatildeo etc) com o banco de dados Naturalmente comprovar a proacutepria existecircncia
do trigger e executaacute-lo consome recursos e tempo
As principais vantagens do MySQL satildeo a baixa demanda de recursos de
hardware a simplicidade de administraccedilatildeo e a otimizaccedilatildeo para as aplicaccedilotildees tiacutepicas
da web onde ocorrem mais consultas do que atualizaccedilotildees (MySQL 2004)
20
3 DESIGN DO SITE
Atraveacutes de um briefing (anexo 1) pode-se chegar a algumas conclusotildees que
influenciaram na escolha da forma de apresentaccedilatildeo das paacuteginas e levaram a
definiccedilatildeo de quais cores imagens e forma o site seria apresentado aos usuaacuterios
31 DEFINICcedilAtildeO DAS CORES
311 A Teoria das Cores
O que se convencionou chamar de Teoria das Cores de Leonardo da Vinci
satildeo as formulaccedilotildees histoacutericas esparsas contidas em seus escritos e reunidas no livro
Tratado da Pintura e da Paisagem ndash Sombra e Luz que satildeo anotaccedilotildees recolhidas
pelo artista ao longo de anos de observaccedilatildeo e eacute a teoria mais corrente sendo um
dos legados do renascimento para as artes visuais (TEORIA 2004)
312 O Disco Cromaacutetico
O disco cromaacutetico natildeo eacute um instrumento cientiacutefico de classificaccedilatildeo de cores
mas eacute muito uacutetil no entendimento da teoria das cores As cores se dividem em
primaacuterias secundaacuterias e terciaacuterias (TEORIA 2004)
Pode-se reproduzir qualquer sensaccedilatildeo de cor misturando-se aditivamente
diversas quantidades de vermelho azul e verde Por isso conhecem-se essas cores
como cores primaacuterias (ENCARTA 2000) Combinado-se duas cores primaacuterias
obtemos as cores secundaacuterias resultando no laranja (amarelo com vermelho) verde
(azul com amarelo) e violeta (vermelho com azul) As cores terciaacuterias satildeo obtidas
pela mistura de uma primaacuteria com uma ou mais secundaacuterias (TEORIA 2004)
21
A figura 1 apresenta a representaccedilatildeo graacutefica do disco cromaacutetico
FIGURA 1 ndash DISCO CROMAacuteTICO
313 Cores Anaacutelogas
Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores anaacutelogas satildeo as
cores dispostas lado a lado no disco cromaacutetico Satildeo anaacutelogas porque haacute nelas uma
mesma cor baacutesica e satildeo usadas para dar a sensaccedilatildeo de uniformidade Observando
a figura 1 visualiza-se que a cor anaacuteloga do amarelo eacute o laranja por exemplo
314 Cores Complementares Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores complementares
satildeo aquelas que encontram-se sempre em posiccedilotildees opostas no disco cromaacutetico As
cores complementares satildeo usadas para dar forccedila e equiliacutebrio a um trabalho criando
contrastes Observando a figura 1 visualiza-se que a cor complementar do
vermelho eacute o verde e do laranja eacute o azul por exemplo
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
19
suportando registros de tamanhos fixos ou variaacuteveis controla a seguranccedila dos
dados aleacutem de poder armazenar uma grande quantidade de dados chegando a
quantidades superiores a 50000000 de registros Aleacutem disso o MySQL eacute multi-
usuaacuterio (programas de mais de um usuaacuterio podem estar em execuccedilatildeo) eacute multi-
tarefa (eacute capaz de executar vaacuterios programas simultaneamente mesmo que a
maacutequina possua somente um processador) e open-source
Esse servidor de banco de dados eacute considerado como o mais raacutepido entre os
de sua categoria tanto para grandes volumes de dados como pequenos Poreacutem
como ele foi criado para ser extremamente aacutegil teve-se de descartar certos aspectos
das especificaccedilotildees SQL e foi decidido natildeo se implementar caracteriacutesticas que geram
muita demanda de recursos como os triggers que satildeo uma porccedilatildeo de coacutedigo
armazenado que se executa quando eacute realizada uma operaccedilatildeo (atualizaccedilatildeo
inclusatildeo etc) com o banco de dados Naturalmente comprovar a proacutepria existecircncia
do trigger e executaacute-lo consome recursos e tempo
As principais vantagens do MySQL satildeo a baixa demanda de recursos de
hardware a simplicidade de administraccedilatildeo e a otimizaccedilatildeo para as aplicaccedilotildees tiacutepicas
da web onde ocorrem mais consultas do que atualizaccedilotildees (MySQL 2004)
20
3 DESIGN DO SITE
Atraveacutes de um briefing (anexo 1) pode-se chegar a algumas conclusotildees que
influenciaram na escolha da forma de apresentaccedilatildeo das paacuteginas e levaram a
definiccedilatildeo de quais cores imagens e forma o site seria apresentado aos usuaacuterios
31 DEFINICcedilAtildeO DAS CORES
311 A Teoria das Cores
O que se convencionou chamar de Teoria das Cores de Leonardo da Vinci
satildeo as formulaccedilotildees histoacutericas esparsas contidas em seus escritos e reunidas no livro
Tratado da Pintura e da Paisagem ndash Sombra e Luz que satildeo anotaccedilotildees recolhidas
pelo artista ao longo de anos de observaccedilatildeo e eacute a teoria mais corrente sendo um
dos legados do renascimento para as artes visuais (TEORIA 2004)
312 O Disco Cromaacutetico
O disco cromaacutetico natildeo eacute um instrumento cientiacutefico de classificaccedilatildeo de cores
mas eacute muito uacutetil no entendimento da teoria das cores As cores se dividem em
primaacuterias secundaacuterias e terciaacuterias (TEORIA 2004)
Pode-se reproduzir qualquer sensaccedilatildeo de cor misturando-se aditivamente
diversas quantidades de vermelho azul e verde Por isso conhecem-se essas cores
como cores primaacuterias (ENCARTA 2000) Combinado-se duas cores primaacuterias
obtemos as cores secundaacuterias resultando no laranja (amarelo com vermelho) verde
(azul com amarelo) e violeta (vermelho com azul) As cores terciaacuterias satildeo obtidas
pela mistura de uma primaacuteria com uma ou mais secundaacuterias (TEORIA 2004)
21
A figura 1 apresenta a representaccedilatildeo graacutefica do disco cromaacutetico
FIGURA 1 ndash DISCO CROMAacuteTICO
313 Cores Anaacutelogas
Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores anaacutelogas satildeo as
cores dispostas lado a lado no disco cromaacutetico Satildeo anaacutelogas porque haacute nelas uma
mesma cor baacutesica e satildeo usadas para dar a sensaccedilatildeo de uniformidade Observando
a figura 1 visualiza-se que a cor anaacuteloga do amarelo eacute o laranja por exemplo
314 Cores Complementares Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores complementares
satildeo aquelas que encontram-se sempre em posiccedilotildees opostas no disco cromaacutetico As
cores complementares satildeo usadas para dar forccedila e equiliacutebrio a um trabalho criando
contrastes Observando a figura 1 visualiza-se que a cor complementar do
vermelho eacute o verde e do laranja eacute o azul por exemplo
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
20
3 DESIGN DO SITE
Atraveacutes de um briefing (anexo 1) pode-se chegar a algumas conclusotildees que
influenciaram na escolha da forma de apresentaccedilatildeo das paacuteginas e levaram a
definiccedilatildeo de quais cores imagens e forma o site seria apresentado aos usuaacuterios
31 DEFINICcedilAtildeO DAS CORES
311 A Teoria das Cores
O que se convencionou chamar de Teoria das Cores de Leonardo da Vinci
satildeo as formulaccedilotildees histoacutericas esparsas contidas em seus escritos e reunidas no livro
Tratado da Pintura e da Paisagem ndash Sombra e Luz que satildeo anotaccedilotildees recolhidas
pelo artista ao longo de anos de observaccedilatildeo e eacute a teoria mais corrente sendo um
dos legados do renascimento para as artes visuais (TEORIA 2004)
312 O Disco Cromaacutetico
O disco cromaacutetico natildeo eacute um instrumento cientiacutefico de classificaccedilatildeo de cores
mas eacute muito uacutetil no entendimento da teoria das cores As cores se dividem em
primaacuterias secundaacuterias e terciaacuterias (TEORIA 2004)
Pode-se reproduzir qualquer sensaccedilatildeo de cor misturando-se aditivamente
diversas quantidades de vermelho azul e verde Por isso conhecem-se essas cores
como cores primaacuterias (ENCARTA 2000) Combinado-se duas cores primaacuterias
obtemos as cores secundaacuterias resultando no laranja (amarelo com vermelho) verde
(azul com amarelo) e violeta (vermelho com azul) As cores terciaacuterias satildeo obtidas
pela mistura de uma primaacuteria com uma ou mais secundaacuterias (TEORIA 2004)
21
A figura 1 apresenta a representaccedilatildeo graacutefica do disco cromaacutetico
FIGURA 1 ndash DISCO CROMAacuteTICO
313 Cores Anaacutelogas
Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores anaacutelogas satildeo as
cores dispostas lado a lado no disco cromaacutetico Satildeo anaacutelogas porque haacute nelas uma
mesma cor baacutesica e satildeo usadas para dar a sensaccedilatildeo de uniformidade Observando
a figura 1 visualiza-se que a cor anaacuteloga do amarelo eacute o laranja por exemplo
314 Cores Complementares Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores complementares
satildeo aquelas que encontram-se sempre em posiccedilotildees opostas no disco cromaacutetico As
cores complementares satildeo usadas para dar forccedila e equiliacutebrio a um trabalho criando
contrastes Observando a figura 1 visualiza-se que a cor complementar do
vermelho eacute o verde e do laranja eacute o azul por exemplo
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
21
A figura 1 apresenta a representaccedilatildeo graacutefica do disco cromaacutetico
FIGURA 1 ndash DISCO CROMAacuteTICO
313 Cores Anaacutelogas
Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores anaacutelogas satildeo as
cores dispostas lado a lado no disco cromaacutetico Satildeo anaacutelogas porque haacute nelas uma
mesma cor baacutesica e satildeo usadas para dar a sensaccedilatildeo de uniformidade Observando
a figura 1 visualiza-se que a cor anaacuteloga do amarelo eacute o laranja por exemplo
314 Cores Complementares Segundo Berenice Gonccedilalves (GONCcedilALVES 2003) cores complementares
satildeo aquelas que encontram-se sempre em posiccedilotildees opostas no disco cromaacutetico As
cores complementares satildeo usadas para dar forccedila e equiliacutebrio a um trabalho criando
contrastes Observando a figura 1 visualiza-se que a cor complementar do
vermelho eacute o verde e do laranja eacute o azul por exemplo
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
22
315 Cores X Idade
Segundo estudos realizados cada faixa etaacuteria tem preferecircncia por uma cor
especiacutefica que combina com as caracteriacutesticas de cada idade O vermelho eacute a cor
preferida pelas pessoas de 1 a 10 anos pois indica espontaneidade O alaranjado eacute
a cor preferida das pessoas entre 11 a 20 anos porque indica animaccedilatildeo excitaccedilatildeo e
aventura O amarelo eacute a cor preferida das pessoas com a faixa etaacuteria entre 21 a 30
anos pois fornece a sensaccedilatildeo de forccedila potecircncia arrogacircncia As pessoas no
periacuteodo de 30 a 40 anos gostam do verde que indica a calma a tranquumlilidade o
relaxamento As pessoas na faixa de 41 aos 50 anos preferem a cor anil ou lilaacutes que
indica o misticismo a calma agrave estabilidade As pessoas com mais de 60 anos
preferem a cor violeta pois estatildeo na idade do saber da experiecircncia (BITENCOURT
2003)
316 Cores utilizadas no Site
Apesar do puacuteblico alvo ser formado por alunos pesquisadores empresas e a
comunidade externa teriacutea-se uma ecircnfase maior nos alunos que teriam uma
representaccedilatildeo aproximada de 60 de acessos ao site (briefing) Por isso foi decido
que deveria se utilizar o amarelo como cor principal Poreacutem para efeito visual mais
agradaacutevel foi utilizado o laranja que eacute uma cor anaacuteloga ao amarelo
Consequumlentemente a segunda cor predominante eacute o azul que eacute a cor
complementar do laranja
32 PRINCIacutePIOS DO DESIGN
321 Proximidade
Segundo o princiacutepio da proximidade (WILLIAMS 1995) itens relacionados entre
si devem ser agrupados e aproximados uns dos outros para que sejam vistos como
um conjunto coeso e natildeo como um emaranhado de partes sem ligaccedilatildeo Itens ou
conjuntos de informaccedilotildees que natildeo estatildeo relacionados entre si natildeo devem estar
proacuteximos Nas paacuteginas do Gerds podemos observar a proximidade nos
agrupamentos feitos por cada frame especiacutefico
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
23
322 Alinhamento
Segundo o princiacutepio do alinhamento (WILLIAMS 1995) nada deve ser colocado
arbitrariamente em uma paacutegina Cada item deve ter uma conexatildeo visual com algo na
paacutegina Quando os itens satildeo alinhados na paacutegina haacute uma unidade coesa mais
forte Mesmo quando os elementos estiverem fisicamente separados uns dos outros
se estiverem alinhados haveraacute uma linha invisiacutevel conectando-os tanto em relaccedilatildeo
aos seus olhos quanto a sua mente Apesar de posicionar alguns elementos
separadamente indicando suas ligaccedilotildees de acordo com o princiacutepio da proximidade
eacute o princiacutepio do alinhamento que avisaraacute ao leitor que mesmo natildeo estando
proacuteximos os itens fazem parte do mesmo material Nas paacuteginas do Gerds podemos
observar o alinhamento feito pelos frames e tambeacutem pela disposiccedilatildeo das linhas e
das figuras existentes na paacutegina principal (home)
323 Repeticcedilatildeo
O princiacutepio da repeticcedilatildeo (WILLIAMS 1995) afirma que algum aspecto do
design deve repetir-se no material inteiro O elemento repetitivo pode ser uma fonte
em negrito uma linha grossa algum sinal de toacutepico um elemento do design algum
formato especiacutefico ou relaccedilotildees espaciais Quando cria-se tiacutetulos com mesmo
tamanho e mesmo peso quando coloca-se um fio a meia polegada do final de cada
paacutegina quando usa-se o mesmo sinal de toacutepico em cada listagem referente ao
mesmo trabalho A repeticcedilatildeo pode ser considerada como consistecircncia Ao olhar
para um jornal de oito paacuteginas eacute justamente a repeticcedilatildeo de alguns elementos que
faz com que cada uma dessas oito paacuteginas pareccedila pertencer ao mesmo jornal
Poreacutem a repeticcedilatildeo vai aleacutem da simples consistecircncia eacute um esforccedilo consciente para
unificar todos os elementos do design No site do Gerds podemos observar a
repeticcedilatildeo nos formatos e cores das linhas na construccedilatildeo das figuras das paacuteginas
nos bototildees e nas cores e fontes utilizadas
324 Contraste
O contraste eacute uma das maneiras mais eficazes de acrescentar algum atrativo
visual a uma paacutegina (algo que realmente faccedila com que uma pessoa queira olhar
para ela) criando uma hierarquia organizacional entre diferentes elementos
(WILLIAMS 1995) A regra importante que deve ser lembrada eacute a de que para o
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
24
contraste ser realmente eficaz ele deve ser forte Cria-se o contraste quando dois
elementos satildeo diferentes Se eles diferirem um pouco mas natildeo muito natildeo
aconteceraacute o contraste e sim um conflito Uma letra grande pode ser contrastada
com uma pequena uma fonte em estilo antigo com uma fonte em negrito uma linha
fina com uma grossa uma textura aacutespera com uma lisa um elemento horizontal (por
exemplo uma longa linha de texto) com um elemento vertical (por exemplo uma
coluna estreita de texto) linhas muito espaccediladas com linhas bem proacuteximas uma
figura pequena com uma figura grande No site do Gerds podemos observar o
contraste na combinaccedilatildeo das fontes do frame de menu nas cores e formatos dos
bototildees na formataccedilatildeo do cabeccedilalho e no formato das figuras exibidas no topo de
cada paacutegina mostrada no frame principal
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
25
33 FRAMES
Os frames dividem a paacutegina em 5 framesets e satildeo usados para que um
frameset permaneccedila inalterado enquanto os outros mudam de acordo com as accedilotildees
tomadas pelos usuaacuterios Cada frame do site Gerds estaacute representado na figura 2
Cabeccedilalho Principal
Menu
FIGURA 2 ndash REPRESENTACcedilAtildeO DOS FRAMES
Rodapeacute Login
331 Cabeccedilalho
Eacute o cabeccedilalho do site que foi divido em 3 partes Essa divisatildeo natildeo eacute visiacutevel para
o usuaacuterio poreacutem a parte do meio tem seu tamanho ajustado de acordo com a
resoluccedilatildeo da tela Isso permite que o site possa ser apresentado em diferentes
resoluccedilotildees sem grandes alteraccedilotildees no visual
332 Menu
Aqui os usuaacuterios podem navegar pelo site clicando nos bototildees que alteram
seu formato quando o mouse e passando por cima Eacute pelo menu que se abre as
principais paacuteginas do site
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
26
333 Principal
Aqui satildeo carregadas as paacuteginas do site A maioria dos links abrem as paacuteginas
nesse espaccedilo
334 Login
Nesse frame encontra-se a parte responsaacutevel pela realizaccedilatildeo do login do usuaacuterio
bem como links raacutepidos para paacuteginas de interesse do grupo Assim que o login eacute
feito o frame exibe algumas informaccedilotildees referentes aos dados do usuaacuterio conectado
no sistema
335 Rodapeacute
Possui o link para a paacutegina inicial Tambeacutem tem seu tamanho ajustado para
diferentes resoluccedilotildees
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
27
34 PAacuteGINAS VISIacuteVEIS
341 Home
A figura 3 demonstra a primeira paacutegina a ser mostrada Carrega uma breve
definiccedilatildeo do Gerds aleacutem de mostrar uma cacircmera de viacutedeo que estaacute ligada durante
24 horas monitorando o laboratoacuterio de redes da UTP Exibe tambeacutem as uacuteltimas
notiacutecias cadastradas no sistema (on-line)
FIGURA 3 ndash HOME
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
28
342 Cadastro de Pesquisas
A tela de cadastro de pesquisas representada pela figura 4 possibilita o
cadastramento de pesquisas efetuadas no Gerds Informa-se a data o Tiacutetulo uma
descriccedilatildeo e os participantes da mesma Implementa a parte de upload de arquivos
ou seja o arquivo que conteacutem a pesquisa completa (em qualquer formato desejado)
seraacute salvo no servidor possibilitando download posterior aos interessados
FIGURA 4 ndash CADASTRO DE PESQUISAS
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
29
343 Alteraccedilatildeo de Pesquisas
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de pesquisas representada pela figura 5 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das pesquisas gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a pesquisa que teraacute seus dados
modificados Para tanto o administrador pode filtrar as pesquisas pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 5 ndash ALTERACcedilAtildeO DE PESQUISAS
Apoacutes a escolha da pesquisa o usuaacuterio cadastrado como administrador do
sistema pode atualizar os dados mostrados na tela exatamente como no cadastro
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
30
344 Cadastro de Artigos
A tela de cadastro de artigos representada pela figura 6 Possibilita o
cadastramento de artigos que tenham relaccedilatildeo com o Gerds por alunos ou
professores (complemento de aula ou artigos interessantes) Informa-se a data o
tiacutetulo e uma descriccedilatildeo do artigo Implementa a parte de upload (envio de arquivos da
maacutequina cliente para a maacutequina servidora da aplicaccedilatildeo) de arquivos ou seja o
arquivo que conteacutem o artigo completo (em qualquer formato desejado) seraacute salvo no
servidor possibilitando download (envio de arquivos da maacutequina servidora da
aplicaccedilatildeo para a maacutequina cliente) posterior aos interessados
FIGURA 6 ndash CADASTRO DE ARTIGOS
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
31
345 Alteraccedilatildeo de Artigos
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de artigos representada pela figura 7 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo dos artigos gravados previamente
Inicialmente eacute necessaacuterio que se escolha qual artigo teraacute seus dados modificados
Para tanto o administrador pode filtrar os artigos pelo seu tiacutetulo escrevendo o tiacutetulo
desejado (completo ou parcial) e clicar em pesquisar ou clicar diretamente no link
desejado
FIGURA 7 ndash ALTERACcedilAtildeO ARTIGOS
Apoacutes a escolha do artigo o administrador pode atualizar os dados mostrados
na tela exatamente como no cadastro do mesmo
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
32
346 Cadastro de Notiacutecias
A tela de cadastro de notiacutecias representada pela figura 8 possibilita o
cadastramento de notiacutecias interessantes aos usuaacuterios do Gerds Informa-se a data
da notiacutecia o tiacutetulo e a descriccedilatildeo completa da mesma
FIGURA 8 ndash CADASTRO DE NOTIacuteCIAS
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
33
347 Alteraccedilatildeo de Notiacutecias
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
de alteraccedilatildeo de notiacutecias representada pela figura 9 Essa tela permite ao
administrador do sistema realizar a alteraccedilatildeo das notiacutecias gravadas previamente
Inicialmente eacute necessaacuterio que se escolha qual eacute a notiacutecia que teraacute seus dados
modificados Para tanto o administrador pode filtrar as notiacutecias pelo seu tiacutetulo
escrevendo o tiacutetulo desejado (completo ou parcial) e clicar em pesquisar ou clicar
diretamente no link desejado
FIGURA 9 ndash ALTERACcedilAtildeO DE NOTIacuteCIAS
Apoacutes a escolha da notiacutecia o administrado pode atualizar os dados mostrados
na tela exatamente como no cadastro da mesma
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
34
348 Objetivos
A paacutegina de objetivos representada pela figura 10 descreve os objetivos do
Gerds perante seus participantes informando as metas que o grupo espera atingir
FIGURA 10 ndash OBJETIVOS
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
35
349 Estatuto
A paacutegina de estatuto representada pela figura 11 descreve o estatuto que
informa o que eacute o Gerds o que representa quais as entidades envolvidas
FIGURA 11 ndash ESTATUTO
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
36
3410 Participantes
A paacutegina de participantes representada pela figura 12 mostra todos os
usuaacuterios cadastrados no site desde que o mesmo natildeo seja um usuaacuterio externo
Aqui pode-se visualizar o nome do participante seu e-mail sua paacutegina pessoal na
Internet bem como a qual tipo de usuaacuterio o participante estaacute relacionado (se eacute um
professor um aluno ou um estagiaacuterio)
FIGURA 12 ndash PARTICIPANTES
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
37
3411 Colaboradores
A paacutegina de colaboradores representada pela figura 13 mostra quais satildeo os
colaboradores do Gerds ou seja os grupos pessoas ou empresas que possuem
alguma relaccedilatildeo ativa com o Gerds e que colaboram de alguma forma para o bom
funcionamento do grupo
FIGURA 13 ndash COLABORADORES
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
38
3412 Visualizar Pesquisas
A paacutegina de visualizaccedilatildeo de pesquisas representada pela figura 14 permite
aos usuaacuterios visualizarem de forma detalhada as pesquisas realizadas no Gerds e
cadastradas previamente mostrando os tiacutetulos das pesquisas realizadas com suas
respectivas datas
FIGURA 14 ndash VISUALIZAR PESQUISAS
Ao clicar no tiacutetulo da pesquisa eacute aberta entatildeo a paacutegina que descreve a
pesquisa e seus detalhes representada pela figura 15 Permite tambeacutem o download
da pesquisa completa na forma em que foi salva por quem a cadastrou
FIGURA 15 ndash DETALHE DA PESQUISA
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
39
3413 Visualizar Artigo
A tela de visualizaccedilatildeo de artigos representada pela figura 16 permite aos
usuaacuterios visualizarem de forma detalhada os artigos de interesse ao Gerds que
foram cadastrados previamente mostrando o tiacutetulo dos artigos com suas respectivas
datas
FIGURA 16 ndash VISUALIZAR ARTIGO
Ao clicar no tiacutetulo do artigo eacute aberta entatildeo a paacutegina que descreve o artigo em
seus detalhes representada pela figura 17 permite tambeacutem o download do artigo
completo na forma em que foi salva por quem o cadastrou
FIGURA 17 ndash DETALHE DO ARTIGO
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
40
3414 Visualizar Notiacutecia
A paacutegina de visualizaccedilatildeo de notiacutecias representada pela figura 18 permite aos
usuaacuterios visualizarem de forma detalhada as notiacutecias de interesse ao Gerds que
foram cadastradas previamente mostrando os tiacutetulos das notiacutecias com suas
respectivas datas
FIGURA 18 ndash VISUALIZAR NOTIacuteCIA
Ao clicar no tiacutetulo da notiacutecia eacute aberta entatildeo a paacutegina que descreve a notiacutecia
em seus detalhes representada pela figura 19
FIGURA 19 ndash DETALHE DA NOTIacuteCIA
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
41
3415 Mural
A tela de mural representado pela figura 20 exibe um mural de mensagens
onde os usuaacuterios cadastrados poderatildeo deixar as suas mensagens para visualizaccedilatildeo
geral
FIGURA 20 ndash MURAL
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
42
3416 Exclusatildeo do Mural A tela de mural representado pela figura 21 permite que o administrador do
sistema exclua uma mensagem especiacutefica ou todas as mensagens que jaacute tiveram
sua data expirada
FIGURA 21 ndash EXCLUSAtildeO DO MURAL
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
43
3417 Administraccedilatildeo
Paacutegina para a administraccedilatildeo do sistema representada pela figura 22 O
usuaacuterio logado com a permissatildeo de administrador do sistema poderaacute ter acesso as
paacuteginas que permitiratildeo incluir alterar e excluir o que for necessaacuterio ao bom
funcionamento do sistema
FIGURA 22 ndash ADMINISTRACcedilAtildeO
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
44
3418 Cadastro de Usuaacuterios
A paacutegina de cadastro de usuaacuterios representada pela figura 23 permite a um
novo usuaacuterio criar uma conta no sistema
FIGURA 23 ndash CADASTRO DE USUAacuteRIOS
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
45
3419 Alteraccedilatildeo de Usuaacuterio
A partir da tela de administraccedilatildeo (figura 22) pode-se fazer a chamada da tela
que permite ao administrador do sistema realizar a alteraccedilatildeo dos dados do usuaacuterio
representada pela figura 24 Inicialmente eacute necessaacuterio que se escolha qual eacute o
usuaacuterio que teraacute seus dados modificados Para tanto o administrador pode clicar
diretamente no link desejado ou filtrar os usuaacuterios pelo nome escrevendo o nome
desejado (completo ou parcial) e clicar em pesquisar
FIGURA 24 ndash PESQUISA USUAacuteRIOS
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
46
Apoacutes a escolha do usuaacuterio o administrado pode atualizar os dados do usuaacuterio
mostrado na tela representada pela figura 25
FIGURA 25 ndash ALTERACcedilAtildeO DE USUAacuteRIOS
Essa operaccedilatildeo permite que o administrador possa realizar duas modificaccedilotildees
importantes nos dados do usuaacuterio em questatildeo Todo usuaacuterio cadastrado inicialmente
no sistema tem o campo ldquoTipo de Usuaacuteriordquo marcado como ldquoexternordquo Existem muitas
operaccedilotildees permitidas somente a professores e estagiaacuterios Aqui o administrador
pode mudar o tipo do usuaacuterio de acordo com suas atribuiccedilotildees no Gerds Outra
modificaccedilatildeo importante eacute a possibilidade do usuaacuterio receber os poderes de
administrador do sistema independente de qual seja o seu tipo cadastrado
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
47
35 PAacuteGINAS NAtildeO VISIacuteVEIS
351 Conexatildeophp
Paacutegina que faz a conexatildeo com o banco de dados Todas as paacuteginas que
fazem acesso ao banco utilizam essa paacutegina Aqui eacute informado qual eacute o nome do
banco de dados que seraacute utilizado pelo sistema aleacutem do usuaacuterio e da senha
cadastradas no servidor do banco de dados Caso natildeo se consiga uma conexatildeo
uma mensagem de erro eacute enviada ao usuaacuterio
352 deleta_artigophp
Paacutegina que exclui o artigo escolhido pelo administrador de acordo com seu
identificador Remove natildeo soacute o registro do banco de dados como o arquivo fiacutesico do
documento relacionado ao artigo
353 deleta_muralphp
Paacutegina que exclui a mensagem do mural escolhida pelo administrador de
acordo com seu identificador
354 deleta_noticiaphp
Paacutegina que exclui a notiacutecia escolhida pelo administrador de acordo com seu
identificador
355 deleta_pesquisaphp
Paacutegina que exclui a pesquisa escolhida pelo administrador de acordo com
seu identificador Remove natildeo soacute o registro do banco de dados como o arquivo
fiacutesico do documento relacionado agrave pesquisa
356 deleta_usuaacuteriophp
Paacutegina que exclui o usuaacuterio escolhido pelo administrador de acordo com seu
identificador
357 grava_alteracaoartigophp
Paacutegina que grava as alteraccedilotildees feitas no artigo atraveacutes da paacutegina descrita no
item no item 325 - Alteraccedilatildeo de Artigos
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
48
358 grava_alteracaonoticiaphp
Paacutegina que grava as alteraccedilotildees feitas na notiacutecia atraveacutes da paacutegina descrita no
item no item 327 - Alteraccedilatildeo de Notiacutecias
359 grava_alteracaopesquisaphp
Paacutegina que grava as alteraccedilotildees feitas na pesquisa atraveacutes da paacutegina descrita
no item no item 323 - Alteraccedilatildeo de Pesquisa
3510 grava_alteracaousuariophp
Paacutegina que grava as alteraccedilotildees feitas no usuaacuterio atraveacutes da paacutegina descrita
no item no item 3219 - Alteraccedilatildeo de Usuaacuterio
3511 grava_artigophp
Paacutegina que grava o artigo de acordo com os dados passados pela paacutegina
que insere os artigos descrita no item 324 ndash Cadastro de Artigos
3512 grava_notiacuteciaphp
Paacutegina que grava a notiacutecia de acordo com os dados passados pela paacutegina
que insere as notiacutecias descrita no item 326 ndash Cadastro de Notiacutecias
3513 grava_pesquisaphp
Paacutegina que grava a pesquisa de acordo com os dados passados pela paacutegina
que insere as pesquisas descrita no item 322 - Cadastro de Pesquisa
3514 grava_muralphp
Paacutegina que grava o mural de acordo com os dados passados pela paacutegina
que insere o mural descrita no item 3215 - Mural
3515 grava_usuaacuteriophp
Paacutegina que grava os usuaacuterios de acordo com os dados passados pela paacutegina
que insere os usuaacuterios descrita no item 3218 - Cadastro de Usuaacuterios
3516 loginphp
Paacutegina que faz a validaccedilatildeo de login e da senha informada pelo usuaacuterio Aqui
satildeo criadas as sessotildees do sistema que carregam pelo site as informaccedilotildees dos
usuaacuterios
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
49
4 COacuteDIGO FONTE
Pelo fato do coacutedigo fonte do site Gerds ser muito extenso o mesmo estaacute
disponiacutevel no cd-rom que faz parte da documentaccedilatildeo deste trabalho
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
50
5 CONCLUSAtildeO
A Internet eacute uma poderosa ferramenta de trabalho utilizada por milhotildees de
pessoas no mundo todo como ferramenta de trabalho diversatildeo e pesquisa Ela pode
e deve ser usada como forma de estreitar a ligaccedilatildeo entre a universidade e a
comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos especializados ou por
transferecircncia de tecnologias mostrando uma realidade diferente aos acadecircmicos e
oferecendo vantagens agrave populaccedilatildeo aproximando-a cada vez mais das novas
tecnologias
Como a carecircncia por essas novas tecnologias eacute grande procura-se
desenvolver avanccedilos que possam ser oferecidos de forma faacutecil e mais barata a esse
puacuteblico Aiacute desponta o avanccedilo conseguido pelos produtos chamados open-source
que contam com a colaboraccedilatildeo mundial em seu desenvolvimento e de forma
gratuita oferecendo alguns produtos de qualidade igual ou superior aos pagos Pelo
fato desses produtos serem gratuitos a possibilidade dessa tecnologia ser
transferida eacute muito maior do que se tivesse um grande custo embutido nessa
transferecircncia
Um grande exemplo disso eacute a combinaccedilatildeo HTMLPHPMySQL que satildeo
tecnologias open-source amplamente utilizadas na Internet e possuem qualidades
excepcionais na construccedilatildeo e exibiccedilatildeo de paacuteginas para a Web
Com o auxiacutelio das ferramentas pagas utilizadas principalmente para a
construccedilatildeo dessas paacuteginas como os produtos da Macromedia (Dreamweaver e
Fireworks) eacute possiacutevel desenvolver sites de altiacutessima qualidade oferecendo o que haacute
de mais moderno nessa aacuterea gastando pouco e atendendo todas as necessidades
tanto do contratante quanto dos usuaacuterios
O site do Gerds foi construiacutedo seguindo esses princiacutepios e utilizando teacutecnicas
de obtenccedilatildeo de dados e designer foi possiacutevel criar um site que procura atender as
especificaccedilotildees do contratante de forma raacutepida barata e eficiente proporcionando
aos seus usuaacuterios um canal de comunicaccedilatildeo entre os alunos e o corpo docente da
Tuiuti participante desse grupo de estudos com os usuaacuterios interessados nos
projetos desse grupo permitindo que a informaccedilatildeo possa trafegar em ambos os
sentidos
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
51
Pode-se sugerir como elementos a serem abordados em trabalhos futuros os
seguintes mapeamentos
bull Utilizar o programa Macromedia Flash para apresentar animaccedilotildees aos
usuaacuterios tornando o site mais atrativo e interativo
bull Mudar o layout do site para se adequar ao padratildeo que estaacute sendo
desenvolvido para as outras paacuteginas que englobam o site do Gerds
bull Alterar a posiccedilatildeo da cacircmera posicionada no laboratoacuterio do Gerds atraveacutes
da proacutepria paacutegina
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
52
REFEREcircNCIAS BITENCOURT Eliane Design de Sites ndash Universidade Tuiuti do Paranaacute 2003 CARACTERIacuteSTICAS do Fireworks 2004 Disponiacutevel em httpwwwmacromediacomsoftwarefireworksproductinfofeatures Acesso em 08 dez 2004 GONCcedilALVES Elizabeth Fundamentos para o estudo da cor Disponiacutevel em httpwwwcev2003hpgigcombraulaluzecorapostila1doc Acesso em 06 dez 2004 GRAHAM Ian S HTML 40 Sourcebook EUA John Wiley amp Sons 4ordf ediccedilatildeo 1998 GREENSPAN Jay BULGER Brad MySQLPHP Database Applicatiions EUA MampT Books 2001 HARRIS Andy PHPMySQL Programming for the Absolute Beginner EUA Premier Press 2003 HISTOacuteRIA do PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004
Disponiacutevel em httpphpplanetmirrorcommanualpt_BRhistoryphp Acesso em 01
jan 2004
HTML 40 Reference 2004 Disponiacutevel em httpwwwhtmlhelpcom reference
html40 Acesso em 30 nov 2004
INTRODUCING HTML 32 2004 Disponiacutevel em httpwwww3orgMarkUpWilbur
Acesso em 30 nov 2004
LOURENCcedilO Rodrigo Aprenda Javascript Brasil 2004 Disponiacutevel em httpwwwterracombrinformaticaajudaestilowebwebdesignjavascripthtm Acesso em 05122004 MYSQL manual de referecircncia Brasil versatildeo 501-alpha 2004 Disponiacutevel em httpdevmysqlcomdocmysqlptindexhtml Acesso em 01 jan 2004 OLIVEIRA Marcelo Colunas sobre Dreamweaver Brasil 2004 Disponiacutevel em
httpwwwimasterscombr
PAGE Christine Dreamweaver MX 2004 EUA Editora Campus 2004
PHP manual de referecircncia Brasil atualizado em 18 de julho de 2004 Disponiacutevel em
httpphpplanetmirrorcommanualpt_BRindexphp Acesso em 01 jan 2004
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
53
SCRIPTS PHP Scripts variados em PHP Brasil 2004 Disponiacutevel em
httpwwwphpbrasilcomscriptsindexphp
STANEK Robert William HTMLCGISGMLVRMLJAVA ndash Web Publishing - Unleashed EUA Samsnet Publishing 1996 TEORIA das cores Disponiacutevel em httpwwwgeocitiescomstrani_felicitaindexhtm Acesso em 05122004 VALADE Janet PHP 5 for Dummies EUA Wiley Publishing Inc 2004
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
54
ANEXOS Briefing
Entrevistador Paulo Gustavo Marquetti Entrevistado Roberto Neia Amaral Data 012004
A Qual a ecircnfase do projeto
O Desenvolvimento do site do GERDS foi contratado com o objetivo de
divulgar o trabalho realizado por alunos professores colaboradores e
participantes dos cursos de Engenharia da Computaccedilatildeo Engenharia Eleacutetrica
Bacharelado em Sistemas de Informaccedilatildeo Ciecircncia da Computaccedilatildeo e os
cursos de Poacutes Graduaccedilatildeo em Desenvolvimento Web e Redes de
Computadores e Seguranccedila de Redes visando estreitar a ligaccedilatildeo entre a
Universidade e a Comunidade seja atraveacutes da prestaccedilatildeo de serviccedilos
especializados ou por transferecircncia de tecnologias inserindo professores e
alunos num contexto soacutecio-econocircmico mais amplo do que a realidade
acadecircmica
B Qual seraacute a forma do site
O site deveraacute ser dinacircmico e natildeo estaacutetico pois deveraacute ter atualizaccedilotildees
constantes de dados Seraacute um site de acesso diaacuterio
C Qual seraacute o puacuteblico alvo
Teraacute como puacuteblico alvo alunos pesquisadores empresas e a
comunidade mas com uma ecircnfase maior dos alunos (uma representaccedilatildeo de
aproximadamente 60)
D O que eacute mais importante ressaltar no site
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
55
O que eacute o GERDS
Quais os objetivos do Gerds
Quem satildeo os participantes do Gerds
Pesquisas realizadas pelos participantes
Artigos de interesse dos participantes e da comunidade em geral
Notiacutecias referentes ao Gerds
Mural de mensagens para comunicaccedilatildeo entre os participantes
E Qual tipo de material seraacute utilizado no site
Basicamente o site seraacute composto por texto e algumas imagens Deseja-
se futuramente implantar uma cacircmera de viacutedeo no laboratoacuterio de redes da
UTP (que eacute utilizada como ldquosederdquo do Gerds) que iraacute monitorar o ambiente nas
24 horas diaacuterias
F Qual a quantidade de registros
A quantidade de registros natildeo deveraacute ser muito grande salvo a parte do mural
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
56
Dicionaacuterio de dados
O dicionaacuterio de dados conteacutem a descriccedilatildeo do banco de dados incluindo suas tabelas campos chaves e relacionamentos ARTIGO
Campo Tamanho Descriccedilatildeo PKAI id_artigo Int(11) Coacutedigo que identifica o artigo
dt_artigo Date Data do artigo tit_artigo Varchar(50) Tiacutetulo do artigo desc_artigo Varchar(100) Descriccedilatildeo do artigo arq_artigo Varchar(50) Nome do arquivo aonde estaacute gravado o artigo
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo artigo
MURAL
Campo Tamanho Descriccedilatildeo PKAI id_mural Int(11) Coacutedigo que identifica a mensagem no mural
dt_mural Datetime Data e hora da mensagem no mural dt_expmural Date Data em que expira a mensagem do mural desc_mural Varchar(250) Texto da mensagem do mural
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pelo mural
email_mural Varchar(30) e-mail do usuaacuterio que deveraacute aparecer no mural
NOTIacuteCIAS
Campo Tamanho Descriccedilatildeo PKAI id_noticias Int(11) Coacutedigo que identifica a notiacutecia
FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel pela notiacutecia
dt_noticia Datetime Data da notiacutecia desc_noticia Varchar(250) Texto de descriccedilatildeo da notiacuteca tit_noticia Varchar(150) Tiacutetulo da notiacutecia dt_expnoticia Date Data em que expira a notiacutecia
PESQUISA
Campo Tamanho Descriccedilatildeo PKAI id_pesq Int(11) Coacutedigo que identifica a pesquisa
dt_pesq Date Data da pesquisa tit_pesq Varchar(50) Tiacutetulo da pesquisa desc_pesq Varchar(100) Texto de descriccedilatildeo da pesquisa arq_pesq Varchar(50) Nome do arquivo aonde estaacute gravada a
pesquisa FK id_usuario Int(11) Coacutedigo que identifica o usuaacuterio responsaacutevel
pela notiacutecia part_pesq Varchar(200) Nome dos participantes da pesquisa
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema
57
USUARIOS Campo Tamanho Descriccedilatildeo
PKAI id_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
nome_usuario Varchar(50) Descriccedilatildeo do tipo de usuaacuterio login_usuario Varchar(8) Login do usuaacuterio
FK tipo_usuario Int(11) Coacutedigo que identifica o tipo de usuaacuterio
mensagem_usuario Varchar(200) Mensagem a ser mostrada ao usuaacuterio
email_usuario Varchar(50) Email do usuaacuterio home_usuario Varchar(50) Paacutegina pessoal do usuaacuterio senha_usuario Varchar(20) Senha do usuaacuterio dt_ult_acesso_usuario Date Data do uacuteltimo acesso do usuaacuterio
ao site qt_acesso_usuario Int(11) Quantidade de acessos do
usuaacuterio fl_administrador Char(1) Indica se o usuaacuterio eacute ou natildeo um
administrador do sistema