SISTEMA DE ENSINO PRESENCIAL CONECTADO

ANALISE E DESENVOLVIMENTO DE SISTEMAS

LUCAS MACHADO BORGES

PORTIFLIO INDIVIDUAL II - 2 SEMESTRE

FUNDAMENTOS DE TECNOLOGIA DA INFORMAO

RONDNIA RO
2017
 LUCAS MACHADO BORGES

PORTIFLIO INDIVIDUAL II - 2 SEMESTRE

FUNDAMENTOS DE TECNOLOGIA DA INFORMAO

Atividade Interdisciplinar Individual apresentado

Universidade Norte do Paran - UNOPAR, como
requisito parcial para a obteno de mdia bimestral nas
disciplinas de Introduo Ao Desenvolvimento De
Sistemas Web, Lgica E Tcnicas De Programao,
Metodologia Cientfica E Processo De Negcio E
Software.

Orientadores:
Prof. Merris Mozer
Prof. Anderson Macedo
Prof. Marco Hisatomi
Prof. Anderson Macedo

RONDNIA RO
2017
 SUMRIO

1 INTRODUO.......................................................................................................3
2 OBJETIVO..............................................................................................................4
3 DESENVOLVIMENTO...........................................................................................5
3.1 Prottipo do TELECINE MOZER.....................................................................5
3.1.1 Tela inicial.......................................................................................................5
3.1.2 Tela de listagem de filmes ao cliente..............................................................6
3.1.3 Tela de exibio de detalhes do filme.............................................................7
3.1.4 Tela de visualizao do histrico do cliente...................................................8
3.1.5 Tela de visualizao do histrico do administrador........................................9
4 CONCLUSO......................................................................................................10
REFERNCIAS...........................................................................................................11
 3

1 INTRODUO

Este trabalho aborda os assuntos do 2 semestre do curso superior

de tecnologia em anlise e desenvolvimento de sistemas. Seus principais assuntos
derivam do contedo estudado, sendo eles: a aplicao do HTML, atravs de
comandos para um documento HTML juntamente com o CSS para organizao do
layout, proporcionando uma pagina mais leve, dinmica e de fcil modificao e
manuteno. Apresentando de um modo panormico como seria o prottipo de um
sistema voltado para locao de filmes on-line.
 4

2 OBJETIVO

Com base no cenrio do estudo de caso Telecine Mozer proposto,

objetivo elaborar um prottipo de interface, levando em considerao os critrios
bsicos de elaborao de interfaces, somado ao que foi aprendido sobre HTML e
CSS, de modo a proporcionar maior facilidade de navegao com uma interface
leve, objetiva, clara e de fcil modificao e manuteno.
Objetivando ainda, melhor aprofundamento no conhecimento das
tcnicas de codificao aprendidas neste semestre, irei aplicar e analisar quais
opes melhor se encaixam dentro do prottipo do caso de uso proposto, buscando
apresentar um prottipo que siga um layout padro e apresentando modelos para
tela inicial, listagem de filmes, detalhes de filme escolhido e informaes de alguns
indicadores tanto para o cliente como para o administrador.
 5

3 DESENVOLVIMENTO

3.1 PROTTIPO DO TELECINE MOZER

3.1.1 Tela inicial

Figura 1 Prottipo da tela inicial do Telecine Mozer

A tela inicial consiste em uma apresentao geral do site, do que e

de como funciona e apenas com as opes de logar para quem j cadastrado e de
cadastrar para quem ainda no assinante. Os termos de contrato, maior
detalhamento das taxas e formas de pagamento estaro disponveis para quem
pretende assinar aps clicar em "entrar" abaixo de "assinar agora". A biblioteca de
filmes do site s estar disponvel apos a concluso do cadastro ou para quem j for
assinante e entrar pela opo com login e senha.
 6

O cliente s conseguira efetuar o login caso seu boleto mensal de

pagamento esteja em dia, pois a cada ms, no fechamento da fatura, ser gerada
uma nova senha, que s ser valida apos confirmao do pagamento da
mensalidade.

3.1.2 Tela de listagem de filmes ao cliente

Figura 2 Prottipo da tela de listagem de filmes

Apos efetuado o login ou concludo o cadastro (caso de novos

assinantes), o site abrira em uma pagina com no maximo 10 filmes listados, tendo
abaixo a opo de numrica de paginas seguintes, logo acima estaro as opes de
filtro, que por padro, o filtro inicial ser exibio aleatria, logo aps as opes de
filtro fica a opo de busca por nome do titulo do filme buscado.
Entre as opes de filtro estaro as opes para listar 5 ou 10 filmes
por pagina, seguido de opes por ordem alfabtica, por categoria, por preo
 7

crescente e decrescente, lanamento, ou mais assistidos.

cada filme na lista apresentara apenas a imagem da capa, nome, e a
opo de detalhes, e esta ultima ser responsvel por apresentar informaes
detalhadas do filme assim como varias opes como verificar disponibilidade de
horrios, preos e efetuar aluguel.
Apos o login, ao lado direito do site, estar disponvel as opo de
cadastro, extrato, histrico, busca e atendimento, para que o cliente possa ter
controle sobre todas as suas informaes.

3.1.3 Tela de exibio de detalhes do filme

Figura 3 Prottipo da tela de detalhes do filme selecionado

Ao clicar na opo detalhes de um determinado filme, ser

apresentada uma pagina com o titulo do filme, data de lanamento, direo, elenco
principal, gnero, preo, sinopse, opo de alugar, verificar horrios e assistir trailer.
Abaixo dos detalhes, ter um boto para que o cliente retorne para a lista.
 8

Cada filme locado ser automaticamente acrescentado ao histrico e

o seu valor acrescentado sua fatura, e podero ser consultados na opo de extrato
e histrico.

3.1.4 Tela de visualizao do histrico do cliente

Figura 4 Prottipo da tela histrico do cliente

Na tela de visualizao do histrico, o cliente poder ver o histrico

de suas locaes organizado por filtros de ordem alfabtica, por gnero, datas
especificas ou intervalo de datas, o que ir lhe proporcionar um melhor controle dos
ttulos alugados ou facilitar uma relocao de um titulo que j tenha assistido.
 9

3.1.5 Tela de visualizao do histrico do administrador

Figura 5 Prottipo da tela histrico do administrador

Nas opes do administrador, na opo histrico, o administrador

ter disponvel filtros que lhe proporcionaram acesso as informao da
movimentao das locaes do site, dos cliente cadastrados, das locaes de cada
cliente, dos filmes, de quantas locaes um determinado titulo teve, pode listar em
ordem crescente a quantidade de locaes dos filmes ou dos clientes, sendo
possvel identificar os clientes que mais locaro filmes em uma determinada semana
ou ms, ou qual o filme mais alugado em uma determinada semana, ms ou perodo
de tempo, tornando possvel elaborar uma lista de clientes mais fieis, assim como
organizar os filmes por ordens como mais assistidos para oferecer bnus ou
promoes.
O administrador ter ainda opes como configuraes,
contabilidade, gerenciamento e atendimento, para que o mesmo possa ter um
controle mais claro das informaes que necessita.
 10

4 CONCLUSO

O prottipo apresentado, visando uma melhor performance na

facilidade de navegao e maior ganho de desempenho, foi projetado em HTML e
CSS, o que proporciona ganhos considerveis no apenas na velocidade de
carregamento da pagina, o que a torna leve tambm para navegao em
dispositivos moveis, mas tambm facilita a modificao, atualizao e manuteno
do site, pois o CSS proporciona uma boa organizao do layout geral da pagina sem
que seja necessrio modificar cada pagina individualmente, diminuindo tambm a
quantidade de cdigo das paginas, que por sua vez, facilita a leitura e interpretao
do cdigo para o programador.
Podemos ainda, neste trabalho, conhecer um pouco mais sobre o
que , na pratica, desenvolvimento de interfaces, e aplicao de linguagens HTML e
CSS estudadas, o que nos oferece uma maior familiarizao.
Por fim, atravs da realizao das atividades propostas, podemos
aplicar as matrias estudadas na pratica, servindo tambm tanto para o crescimento
profissional e como orientaes para elaborao de prottipos, manuais, propostas,
desenvolvimento e analise das atividades de uma forma mais estruturada e
organizada, o que proporciona um melhor entendimento das disciplinas, nos
preparando melhor para o mercado de trabalho.
 11

REFERNCIAS

Foram utilizados os livros impressos e as web-aulas das disciplinas abordadas

https://pt.wikipedia.org

http://www.w3schools.com/

http://www.w3schools.com/css/

http://pt-br.html.net/tutorials/css/

http://pt.slideshare.net/RafaelQueiroz8/guia-para-ferramenta-pencil

http://www.miltondesigner.com.br/como-usar-o-pencil-wireframe/