3

1
4

tela de abertura do curso; surge no incio decada mdulo; tem o objetivo de informar ao usurio qual curso est realizando.

logo identificador da Fundao Bradesco, patrocinadora do curso; tem local fixo de aplicao, sempre no alto e esquerda do layout da tela do curso;
zona de mxima visibilidade.
#E5EAEE
fundo
acinzentado
pois,
a
leitura
no
branco
fica
ruim;
luminosidade
do
branco

muito
forte
e
atrapalha
a
leitura.
3
RGB 229 233 237
a inteo que o usurio consiga ler o texto.
) na tela
4 logo do prprio Outlook 2010 pr-definido pela Miscrosoft; foi colocado com alinhamento centralizado e acima da linha de base (
com tamanho relativamente grande pois, tem o proprsito de orientar o olhar do usurio em primeira instncia para qual o curso que ser trabalhado.
2

5 Informaes de qual mdulo est e qual seu contedo (ttulo) que se repetem a cada tela de abertura com variaes a cada mdulo.
6

cor amarela pr-definida pela Microsoft com variaes de: #F5B91A

RGB 245 185 26

#FBFAD9
RGB 251 250 217

referentes ao logo do prprio software.

1
3

grid - w: 562 px; h: 312px

duas colunas - entre colunas 20px
Nos d a liberdade para diagramar de vrias formas dentro desse espao.

espao entre os textos e a imagem: 18.25 px

Texto diagramado na tipografia Segoe Ui Regular; corpo 12 ; neste caso acima o alinhamento justificado porm, h variaes dentro
do grid proposto; cor preta mas, nao 100%, resultando numa cor mais acinzentada. Essa cor para o usuario melhor para seu conforto
visual. Usa-se bold, itlico quando necessrio. Tipografia to importante como qualquer outro elemento visual. Segoe ui uma
tipografia sem serifa (usurio obtm uma maior facilidade na leitura).
#404041
RGB 64 64 65
Uso de imagens: formatos que foram usados : Jpeg, GIF, PNG. Visando sempre boa qualidade da imagem mas, lembrando sempre que o
peso do documento no pode ser muito grande pois, demora para carregar o arquivo dependendo da velocidade da internet do
usurio. As imagens sempre so relacionadas com o os textos da mesma pgina, repesentando visualmente o que esta sendo discutido.

Para mais informaes da tipografia Segoe Ui, acesse: http://msdn.microsoft.com/pt-br/library/windows/apps/hh700394.aspx

Uso de animaes - animaes em Flash (SWF) que o prprio usurio toma contato com o exemplo do
assunto. Nessas animaes so dadas mais informaes de maneira mais interativa.

tela de boas vindas que aperece em cada incio de mdulo com o objetivo de dar identidade para o curso todo alm de apresentar o
contedo que ser tratado nesse mdulo.

aproximao do usurio deu-se a necessidade de desenhar um personagem; personagem acompanha durante o curso todo, em alguma telas o
personagem fala ou apenas usado como elemento de apoio; quando h falas, o documento do personagem salvo em formato GIF
(para que o personagem consiga mexer os olhos) e as falas so gravadas em audio MP3 e editadas no Camtasia - programa de edio de vdeo.

Cabealho e rodap fixos, montados como pgina MASTER para todo o curso no prprio software CourseLab para manter a identidade.

Uso de videos - videos curtos, que mostram como se usa o recurso que esta sendo tratato na pgina,
mostrando caminhos de como executar tal recurso do software. Salvo no formato flash movie/exteno
SWF.

tela de fechamento com mensagem de motivao parabns que aperece todo final de mdulo, assim como a
1 tela de abertura que da uma identidade para o curso. O usurio recebe a mensagem do que foi estudado e do
que sera tratado no prximo mdulo.
#F89D1D
RGB 28 157 29

O texto destacado sempre na cor

uso de formas/vetor para dar destaque a alguma informao.

Introduzir:
- falar que escolhi essas telas pois o que irei analise se repetem. Ex... as cores ( padro
cromtico) se repete em todo o curso.
- falar o que eu vou analisar ( cores matiz, saturao, valor, contraste sintaxe e
relaes ; tipografia ( fonte, alinhamento,tamanho cor da fonte....etc) e assim por
diante.
- dizer que escolhi o modulo 2 pois contem todos os os elemenos visuais para o
aprendizado do usurio. O mudulo 2 tem tudo o que sera analisado
****analisar odem de telas como se o usurio estivesse fazendo o curso.
A tela de abertura e fechamento se repete em cada modulo, e ha variaes das telas
do meio. ****
-

irei numerarar cada item a ser analisado e depois farei uma analise de tudo!!!

cor vermelha eh usada como sinalizadora, que indica a area devolvida sob analise.
vermelho tem um indice de contraste mto alto para o que queremos destacar.