SlideShare uma empresa Scribd logo
1 de 17
Baixar para ler offline
A análise a seguir tem como objeto de estudo o Ambiente Virtual de
Aprendizagem (AVA) Solar. Essa primeira etapa de análise está fundamentada no
layout do AVA e se utilizará dos seguintes critérios:




          Proximidade
          Itens relacionados entre si devem ser agrupados visualmente.


          Contraste
          Se dois itens não pertencerem à mesma categoria, diferencie-os
          completamente.

          Repetição
          Algum aspecto do design deve repetir-se no material inteiro.
Devido ao grande número de vezes em que se foi levantado o problema de
engenharia da informação como grande problema desse AVA em estudo, iremos
começar a análise pelo conceito de proximidade. Uma vez que o mesmo tem uma
grande relação com a organização da informação, recaindo sobre o problema da
engenharia da informação, na verdade a análise irá se basear nesse critério,
entretanto veremos que este critério irá requerer os outros dois outros.

Dessa forma, essa análise começa com o bloco de menus apresentado pelo AVA.

Percebemos que o primeiro bloco tenta englobar um número de informações
referente a disciplina ou a determinado curso em questão, ao notarmos que o título
de seção faz referência a isso. E é nesse primeiro bloco que nossa análise se inicia.
Dessa forma notamos uma primeira incoerência, tendo o princípio de proximidade como critério. Dentro desse bloco de
menus qual a relação da guia Inicio com o título em que a mesma se insere?




                                 Entendemos que a guia Inicio está numa hierarquia superior a do grupo de menus em
                                 que está inserida, uma vez que ela irá direcionar o usuário a Homepage do Solar, que
                                 é a página principal de qualquer ambiente web, a página que serve de ponto inicial na
                                 experiência de navegação através do AVA. Dessa maneira, vemos a necessidade do
                                 destaque de tal guia, diferenciando-a do restante das outras e a colocando em canto
                                 favorável a visualização, fora de qualquer grupo de menus, posicionando-a no canto
                                 superior esquerdo da página (padrão ocidental), além do seu renomeamento para a
                                 guia Solar ou usando sua respectiva logo.




                                 Aplicando o princípio de proximidade, nos utilizamos dos conceitos do princípio de
                                 contraste. Percebam que ao destacarmos a logo Solar na posição que planejavámos,
                                 não apenas a afastamos das demais, mas também aplicamos contraste de tamanho.

                                 É notório ainda que a relação título-subtítulo não está em acordo, uma vez que o
                                 título deve exercer maior peso em relação a seus subtítulos, uma vez que sua relação
                                 de importância é maior. Perbe-se que isso ocorre pela relação de contraste ter sido
                                 aplicada de forma inversa, dando maior destaque aos subtítulos, uma vez que o fundo
                                 é de cor laranja e os tipos do subtítulo são de cor branca, não ocorrendo o mesmo
                                 com o título, que também é laranja. O não destaque do título também se dá por não
                                 haver contraste de peso, uma vez que as fontes aplicadas em título e subtítulo são as
                                 mesmas, em se tratando de tamanho e estrutura (negrito, no caso).
A disposição dos menus aparece de forma não tão coerente, uma vez que certos menus conversam entre si e acabam
entrando em desacordo por não estarem próximos. Como é o caso dos menus Aulas e Material de Apoio. Nesse
primeiro momento iremos fazer essa reorganização somente entre os elementos de cada sessão, mas sabemos que a
reestruturação do Solar deve ser feita de maneira global.




                                A figura mostrada ao lado é uma tentativa de aplicar os princípios de proximidade e
                                contraste no primeiro bloco de informações apresentado no Solar. Para tornar o
                                menu mais coerente em termos visuais, de acordo com o princípio de proximidade,
                                geramos três blocos de informações, agrupando-os por áreas relacionadas. O
                                primeiro bloco faz referência a aula e os materiais necessários para estudo. O
                                segundo bloco faz referência a disciplina, exibindo a agenda e as informações da
                                mesma. O terceiro tem foco nas pessoas envolvidas, exibindo os participantes e o
                                acompanhamento. Entretanto, como dissemos anteriormente, essa organização é
                                uma tentativa de restruturar a informação, trabalhando de forma segmentada, uma
                                vez que estamos nos preocupando na reorganização das sessões. Por outro lado,
                                percebemos a necessidade de uma rearquitetura da informação de forma mais
                                holística.
As outras seções podem ser refeitas seguindo os princípios já vistos
                               anteriormente e também o princípio de repetição que nos garante uma
                               integridade para a peça, uma vez que manteremos o padrão previamente
                               estabelecido. Queremos ressaltar novamente que numa análise mais holística
                               o nosso menu de Conta não se comportaria da
                               forma ao lado. Uma vez que pensamos na criação
                               de uma barra de tarefas superior, onde tal seção
                               ficaria localizada, mas, como dissemos, esta
                               análise está se dando de forma segmentada, uma
                               vez que é necessário se fazer uma reestrutaração
                               da informação previamente. Outro elemento que
                               devemos dar devida atenção é o fato de os botões
                               Alternar pergil e Sair que não seguem o pricípio
de repetição, não estando de acordo com o tamanho, alinhamento e cores dos
demais menus. Isso ocorre pelo fato de querermos darmos maior atenção a eles,
tornando-os mais visíveis ao usuário na tentativa de localizá-los.
Alinhamento
Nada deve ser colocado arbitrariamente em uma página. Cada item deve ter uma conexão visual com algo na página.




                                Ao analisarmos o menu redesenhado percebemos a existência de duas linhas
                                principais de alinhamento. A linha de alinhamento dos títulos dos
                                menus(vermelha) e a linha de alinhamento dos subtítulos(azul). Os títulos e
                                subtítulos não estão alinhados propositalmente para gerar uma indentação
                                que dá evidência aos títulos.




                                As outras duas linhas de alinhamento, mais fracas, fogem desse alinhamento
                                principal propositalmente, as duas com intenção com intenção de destacar os
                                elementos desalinhados. A logo do Solar está com alinhamento centralizado
                                (verde) ao corpo central do menu, lhe dando destaque maior. Os menus
                                Alternar Perfil e Sair necessitavam de um destaque, devido a serem opções
                                recorrente na navegação do usuário. Dessa maneira, reduzimos sua forma em
                                relação aos demais menus e o alinhamos a direita(roxo), a fim de quebrar o
                                padrão, e evidenciar-lhes diante do resto da peça.
Nossa segunda parte da análise irá se dá no quesito navegabilidade. Iremos verificar dentro da estrutura do
AVA Solar como o usuário se situa dentro do mesmo. Para isso utilizaremos um método conhecido como Teste
do Porta-Malas, proposto por Steve Krug, em seu livro Não me faça pensar.



Krug elencou 6 perguntinhas básicas em se tratando da navegabilidade de um site:



   •   Que site é este?

          –   Nome do site

   •   Em que página estou?

          –   Nome da página

   •   Quais as seções principais deste site?

          –   Seções

   •   Quais são as opções deste nível?

          –   Navegação local

   •   Onde estou no esquema das coisas?

          –   Indicadores de posição

   •   Como posso procurar?




Que site é esse?
O solar responde sempre a essa pergunta com sua logo que está localizada no canto superior direito.
Entretanto não é o melhor lugar para o padrão ocidental, uma vez que lemos da esquerda para a direita, desse
modo a logo não é a primeira coisa a ser vista.



Em que página estou?




O solar também responde a essa pergunta, entretando o nome da página acaba não sendo tão destacado,
devido ao título não ter um destaque baseados nos princípios de proximidade e contraste, além do nome da
página se encontrar abaixo da migalha de pão que acaba sendo mais visível que o nome da página por possuir
mais constraste que o mesmo.
• Quais as seções principais deste site?



                           As sessões do site são bem claras.
• Quais são as opções deste nível?




  A navegação local é bem clara pois o solar tem uma área de contéudo muito bem delimitada e
  diferenciada dos menus gerais. Desse modo é fácil de perceber que a navegação local somente pode
  acontecer dentro da área de conteúdo, não fazendo com o que o usuário se confunda.
• Onde estou no esquema das coisas?




       O solar possui um sistema de migalha de pão que mostra ao usuário onde ele se encontra no esquema
       das coisas. Entretanto, essa localização poderia se dar de maneira mais eficiente se houvesse um
       cursor que indicasse sobre qual menu o usuário se encontra. Além disso o recurso migalha de pão
       poderia ser navegável.



   • Como posso procurar?
O solar não dispoe de sistema de busca.
Abaixo apresentamos-lhes a paleta de cores do AVA Solar. Como pode-se perceber o
mesmo utiliza-se apenas uma matiz do círculo de cores de cor variando apenas a
luminosidade e a saturação . A partir disso podemos aferir que a harmonia de cores do
Solar é monocromática.




                                                O site http://www.amopintar.com aponta os prós e contras de
                                                harmonias monocromáticas:

                                                Prós:
                                                A harmonia monocromática, é simples de utilizar e sempre luz
                                                balançada e visualmente apelativa.


                                                Contras:
                                                Este esquema carece de contraste. Não é uma harmonia tão vibrante
                                                como a harmonia de complementares.

                                                Ler mais: http://www.amopintar.com/harmonia-das-
                                                cores#ixzz1rc3z5HDC
Outro fator para escolha deste tipo de harmonia pode ter sido o fato de o Solar ser um sistema voltado para o Ensino
que requer uma carga horário de trabalho dentro do mesmo alta e este tipo de harmonia favorece a permanência do
usuário no sistema sem que o mesmo sinta-se desconfortável, uma vez que essa harmonia não apresenta grandes
variações de matizes, não super estimulando o glóbulo ocular

Mais conteúdo relacionado

Semelhante a Analise solar (7)

aula-6_principios_design.pdf
aula-6_principios_design.pdfaula-6_principios_design.pdf
aula-6_principios_design.pdf
 
Noções de planejamento visual
Noções de planejamento visualNoções de planejamento visual
Noções de planejamento visual
 
O design equilibrado9
O design equilibrado9O design equilibrado9
O design equilibrado9
 
mapas_conceptuais.pdf
mapas_conceptuais.pdfmapas_conceptuais.pdf
mapas_conceptuais.pdf
 
Se Liga Concórdia
Se Liga ConcórdiaSe Liga Concórdia
Se Liga Concórdia
 
PENSANDO POR DIAGRAMAS
PENSANDO POR DIAGRAMASPENSANDO POR DIAGRAMAS
PENSANDO POR DIAGRAMAS
 
O design equilibrado7
O design equilibrado7O design equilibrado7
O design equilibrado7
 

Analise solar

  • 1.
  • 2.
  • 3. A análise a seguir tem como objeto de estudo o Ambiente Virtual de Aprendizagem (AVA) Solar. Essa primeira etapa de análise está fundamentada no layout do AVA e se utilizará dos seguintes critérios: Proximidade Itens relacionados entre si devem ser agrupados visualmente. Contraste Se dois itens não pertencerem à mesma categoria, diferencie-os completamente. Repetição Algum aspecto do design deve repetir-se no material inteiro.
  • 4. Devido ao grande número de vezes em que se foi levantado o problema de engenharia da informação como grande problema desse AVA em estudo, iremos começar a análise pelo conceito de proximidade. Uma vez que o mesmo tem uma grande relação com a organização da informação, recaindo sobre o problema da engenharia da informação, na verdade a análise irá se basear nesse critério, entretanto veremos que este critério irá requerer os outros dois outros. Dessa forma, essa análise começa com o bloco de menus apresentado pelo AVA. Percebemos que o primeiro bloco tenta englobar um número de informações referente a disciplina ou a determinado curso em questão, ao notarmos que o título de seção faz referência a isso. E é nesse primeiro bloco que nossa análise se inicia.
  • 5. Dessa forma notamos uma primeira incoerência, tendo o princípio de proximidade como critério. Dentro desse bloco de menus qual a relação da guia Inicio com o título em que a mesma se insere? Entendemos que a guia Inicio está numa hierarquia superior a do grupo de menus em que está inserida, uma vez que ela irá direcionar o usuário a Homepage do Solar, que é a página principal de qualquer ambiente web, a página que serve de ponto inicial na experiência de navegação através do AVA. Dessa maneira, vemos a necessidade do destaque de tal guia, diferenciando-a do restante das outras e a colocando em canto favorável a visualização, fora de qualquer grupo de menus, posicionando-a no canto superior esquerdo da página (padrão ocidental), além do seu renomeamento para a guia Solar ou usando sua respectiva logo. Aplicando o princípio de proximidade, nos utilizamos dos conceitos do princípio de contraste. Percebam que ao destacarmos a logo Solar na posição que planejavámos, não apenas a afastamos das demais, mas também aplicamos contraste de tamanho. É notório ainda que a relação título-subtítulo não está em acordo, uma vez que o título deve exercer maior peso em relação a seus subtítulos, uma vez que sua relação de importância é maior. Perbe-se que isso ocorre pela relação de contraste ter sido aplicada de forma inversa, dando maior destaque aos subtítulos, uma vez que o fundo é de cor laranja e os tipos do subtítulo são de cor branca, não ocorrendo o mesmo com o título, que também é laranja. O não destaque do título também se dá por não haver contraste de peso, uma vez que as fontes aplicadas em título e subtítulo são as mesmas, em se tratando de tamanho e estrutura (negrito, no caso).
  • 6. A disposição dos menus aparece de forma não tão coerente, uma vez que certos menus conversam entre si e acabam entrando em desacordo por não estarem próximos. Como é o caso dos menus Aulas e Material de Apoio. Nesse primeiro momento iremos fazer essa reorganização somente entre os elementos de cada sessão, mas sabemos que a reestruturação do Solar deve ser feita de maneira global. A figura mostrada ao lado é uma tentativa de aplicar os princípios de proximidade e contraste no primeiro bloco de informações apresentado no Solar. Para tornar o menu mais coerente em termos visuais, de acordo com o princípio de proximidade, geramos três blocos de informações, agrupando-os por áreas relacionadas. O primeiro bloco faz referência a aula e os materiais necessários para estudo. O segundo bloco faz referência a disciplina, exibindo a agenda e as informações da mesma. O terceiro tem foco nas pessoas envolvidas, exibindo os participantes e o acompanhamento. Entretanto, como dissemos anteriormente, essa organização é uma tentativa de restruturar a informação, trabalhando de forma segmentada, uma vez que estamos nos preocupando na reorganização das sessões. Por outro lado, percebemos a necessidade de uma rearquitetura da informação de forma mais holística.
  • 7. As outras seções podem ser refeitas seguindo os princípios já vistos anteriormente e também o princípio de repetição que nos garante uma integridade para a peça, uma vez que manteremos o padrão previamente estabelecido. Queremos ressaltar novamente que numa análise mais holística o nosso menu de Conta não se comportaria da forma ao lado. Uma vez que pensamos na criação de uma barra de tarefas superior, onde tal seção ficaria localizada, mas, como dissemos, esta análise está se dando de forma segmentada, uma vez que é necessário se fazer uma reestrutaração da informação previamente. Outro elemento que devemos dar devida atenção é o fato de os botões Alternar pergil e Sair que não seguem o pricípio de repetição, não estando de acordo com o tamanho, alinhamento e cores dos demais menus. Isso ocorre pelo fato de querermos darmos maior atenção a eles, tornando-os mais visíveis ao usuário na tentativa de localizá-los.
  • 8. Alinhamento Nada deve ser colocado arbitrariamente em uma página. Cada item deve ter uma conexão visual com algo na página. Ao analisarmos o menu redesenhado percebemos a existência de duas linhas principais de alinhamento. A linha de alinhamento dos títulos dos menus(vermelha) e a linha de alinhamento dos subtítulos(azul). Os títulos e subtítulos não estão alinhados propositalmente para gerar uma indentação que dá evidência aos títulos. As outras duas linhas de alinhamento, mais fracas, fogem desse alinhamento principal propositalmente, as duas com intenção com intenção de destacar os elementos desalinhados. A logo do Solar está com alinhamento centralizado (verde) ao corpo central do menu, lhe dando destaque maior. Os menus Alternar Perfil e Sair necessitavam de um destaque, devido a serem opções recorrente na navegação do usuário. Dessa maneira, reduzimos sua forma em relação aos demais menus e o alinhamos a direita(roxo), a fim de quebrar o padrão, e evidenciar-lhes diante do resto da peça.
  • 9.
  • 10. Nossa segunda parte da análise irá se dá no quesito navegabilidade. Iremos verificar dentro da estrutura do AVA Solar como o usuário se situa dentro do mesmo. Para isso utilizaremos um método conhecido como Teste do Porta-Malas, proposto por Steve Krug, em seu livro Não me faça pensar. Krug elencou 6 perguntinhas básicas em se tratando da navegabilidade de um site: • Que site é este? – Nome do site • Em que página estou? – Nome da página • Quais as seções principais deste site? – Seções • Quais são as opções deste nível? – Navegação local • Onde estou no esquema das coisas? – Indicadores de posição • Como posso procurar? Que site é esse?
  • 11. O solar responde sempre a essa pergunta com sua logo que está localizada no canto superior direito. Entretanto não é o melhor lugar para o padrão ocidental, uma vez que lemos da esquerda para a direita, desse modo a logo não é a primeira coisa a ser vista. Em que página estou? O solar também responde a essa pergunta, entretando o nome da página acaba não sendo tão destacado, devido ao título não ter um destaque baseados nos princípios de proximidade e contraste, além do nome da página se encontrar abaixo da migalha de pão que acaba sendo mais visível que o nome da página por possuir mais constraste que o mesmo.
  • 12. • Quais as seções principais deste site? As sessões do site são bem claras.
  • 13. • Quais são as opções deste nível? A navegação local é bem clara pois o solar tem uma área de contéudo muito bem delimitada e diferenciada dos menus gerais. Desse modo é fácil de perceber que a navegação local somente pode acontecer dentro da área de conteúdo, não fazendo com o que o usuário se confunda.
  • 14. • Onde estou no esquema das coisas? O solar possui um sistema de migalha de pão que mostra ao usuário onde ele se encontra no esquema das coisas. Entretanto, essa localização poderia se dar de maneira mais eficiente se houvesse um cursor que indicasse sobre qual menu o usuário se encontra. Além disso o recurso migalha de pão poderia ser navegável. • Como posso procurar? O solar não dispoe de sistema de busca.
  • 15.
  • 16. Abaixo apresentamos-lhes a paleta de cores do AVA Solar. Como pode-se perceber o mesmo utiliza-se apenas uma matiz do círculo de cores de cor variando apenas a luminosidade e a saturação . A partir disso podemos aferir que a harmonia de cores do Solar é monocromática. O site http://www.amopintar.com aponta os prós e contras de harmonias monocromáticas: Prós: A harmonia monocromática, é simples de utilizar e sempre luz balançada e visualmente apelativa. Contras: Este esquema carece de contraste. Não é uma harmonia tão vibrante como a harmonia de complementares. Ler mais: http://www.amopintar.com/harmonia-das- cores#ixzz1rc3z5HDC
  • 17. Outro fator para escolha deste tipo de harmonia pode ter sido o fato de o Solar ser um sistema voltado para o Ensino que requer uma carga horário de trabalho dentro do mesmo alta e este tipo de harmonia favorece a permanência do usuário no sistema sem que o mesmo sinta-se desconfortável, uma vez que essa harmonia não apresenta grandes variações de matizes, não super estimulando o glóbulo ocular