Faculdade de Tecnologia de Carapicuba

FATEC

MARIA CRISTINA CEROSI

SITE PESSOAL

Trabalho
apresentado
como parte dos requisitos da
disciplina Padres e Projetos
de Stios para Internet I e II,
sob a orientao da Profa. Ana
Carolina Nicolosi da Rocha
Gracioso.

Carapicuba
Junho - 2013

1. ESCOPO
Este projeto sobre o desenvolvimento de um site pessoal para
apresentao de projetos, dados profissionais, educacionais e formas de
contato.
O site tem como objetivo no somente apresentar os aspectos
profissionais mas tambm alguns aspectos pessoais.
O site ter um layout padro para todas as pginas, o banner superior,
um menu lateral e o rodap. No banner ter meu nome e os cones para
conexo a redes sociais. O menu ser feito de forma que tenha uma
navegao fcil. O rodap apresentar as informaes de confeco do site e
um menu bem simples. Todo o site ser desenvolvido em HTML5, CSS3 e
JavaScript.
Na pgina home teremos uma apresentao mais pessoal com assuntos
de interesse: um vdeo do you to be, duas msicas, livros atuais e links para
noticias que considero importantes.
Tem duas pginas diferentes para dados, uma para dados educacionais
e outra para dados profissionais, as duas tem uma opo de download de
currculo profissional.
Ter uma pgina chamada vida que ir apresentar de maneira concisa
aspectos pessoais e que considero importantes, essa pgina ter outras duas
sub-pginas, as duas tero uma galeria de fotos, uma sobre minhas viagens e
outra

sobre

famlia,

hobbys

pets.

Deixei

encaminhado

para

desenvolvimento posterior de uma pgina inteira para cada um dos assuntos,

mas agora no consigo me dedicar ao artesanato e quero acrescentar fatos
posteriores que viro a aumentar as pginas.
A pgina de contato oferece meus dados atravs de hcard e tambm um
formulrio para contato direto.
J a pgina blogs ir direcionar aos links dos blogs que possuo, um
sobre minhas atividades com artesanato e o outro feito a pedido da disciplina
de PPSI I e II.

2. MAPA DO SITE

3. WIREFRAMES E DETALHAMENTO DAS PGINAS

3.1 PGINA HOME

Esta pgina deve evidenciar uma parte da minha vida no momento em

que qualquer pessoa acessar. Que livros estou lendo, que msicas estou
ouvindo e quais filmes quero assistir. Alm de links para notcias que qualifico
como importantes para aquele momento.
A pgina contar com dois elementos de msica e um de vdeo. Alm da
sinopse do livro que estarei comentando.

3.2 FORMAO
Apresentar todos os cursos que realizei, tanto os de graduao, psgraduao e extra-curriculares.

3.3 PROFISSIONAL
Pgina com todos os dados da minha vida profissional alm de um link
para download de meu currculo.

3.4 VIDA

Apresenta atravs de um mosaico de fotos e texto breve os 4 itens que

acredito serem os principais de minha vida.

3.4.1 V IAGENS
Esta pgina apresenta atravs de imagens fotos das principais viagens
que j realizei.

3.4.2 FAMLIA, HOBBYS E PETS

Esta pgina apresenta atravs de imagens as pessoas importantes na
minha vida, os hobbys que pratico e meus animais de estimao.

3.5 BLOGS
Pgina com imagens dos blogs, clicveis, assim direcionando para os
links reais dos blogs.

3.6 CONTATO

Pgina com um formulrio para contato onde tambm aparecera meus

dados para contato em formato hcard.

4. MOCKUP
A cor nada mais que a percepo, por clulas especializadas da
retina, de uma determinada longitude de onda da radiao eletromagntica.
Segundo ou Instituto de Pesquisa da Cor (Institute for Color Research)
h estudos que revelam que "os seres humanos julgam subconscientemente
uma pessoa, um ambiente ou um item nos primeiros 90 segundos, e nesse
lapso de tempo entre 62% e 90%do julgamento baseado unicamente na cor".
A resposta emocional cor funo do contexto cultural do usurio.
Ao definir a cor ou as cores bsicas levamos em conta os seguintes
fatores: o assunto, o pblico alvo, o ambiente.
Como um site pessoal utilizei uma combinao de cores que gosto
muito: rosa mais escuro e cinza.

5. TESTES

5.1 TESTES FUNCIONAIS

O site foi testado nos seguintes navegadores: Google Chrome, Mozilla

Firefox e Internet Explorer. A tabela abaixo apresenta o resultado dos testes.
Google Chrome
Verso 23.0.1271.95 m
Nenhum problema
encontrado

Firefox
Verso 16.0.1

foi A tag udio

funciona.

Explorer 9
Verso 9.0.8112.16421
A tag udio no
no funciona.
O sub-menu fica atrs
do vdeo.

5.2 TESTES DE USABILIDADE

Os seguintes critrios de usabilidade foram verificados junto a um

conjunto de cinco usurios.
Critrios: Aparncia, navegao, links, bugs, utilizao das cores e
fontes e tambm pedimos para pontuar qualquer observao que no esteja
elencada nos critrios.
A tabela abaixo apresenta o resultado dos testes e os usurios:

Usurio 1:

Usurio 2:

Usurio 3:

Usurio 4:

Usurio 5:

Sexo: Masculino
Idade: 55 anos

Sexo: Feminino
Idade: 50 anos

Sexo: Feminino
Idade: 33 anos

Sexo: Feminino
Idade: 11 anos

Sexo: Masculino
Idade: 43 anos

Problemas detectados: nenhum

Observaes: nenhuma

10