universidade federal fluminense instituto de … · interação homem-máquina através dos sites e...
TRANSCRIPT
UNIVERSIDADE FEDERAL FLUMINENSE
INSTITUTO DE ARTE E COMUNICAÇÃO SOCIAL (IACS)
CURSO DE COMUNICAÇÃO SOCIAL – PUBLICIDADE E
PROPAGANDA
REPENSANDO A PRESENÇA ONLINE: PROJETO PARA
OS PORTAIS DA UFF COM FOCO EM USABILIDADE
Caio Vinicius de Macedo Goes
Niterói, Março/2016
2
Projeto Experimental em Publicidade e Propaganda
GCO 00352
Universidade Federal Fluminense
Instituto de Arte e Comunicação Social (IACS)
Curso de Comunicação Social
REPENSANDO A PRESENÇA ONLINE: PROJETO PARA
OS PORTAIS DA UFF COM FOCO EM USABILIDADE
Projeto Experimental apresentado
por Caio Vinicius de Macedo Goes,
matrícula 112030086, como
requisito obrigatório para obtenção
do título de Bacharel em
Comunicação Social – habilitação
Publicidade e Propaganda –, sob
orientação da Profª. Mª. Lilian
Soares Pinto de Souza Ribeiro.
IACS/UFF
Niterói
Março/2016
3
AGRADECIMENTOS
À @Deus, que está no comando sempre.
À minha família, que me aturou por diversos dias com os mais diversos temperamentos
preocupado com os rumos deste projeto.
Sendo piegas, a todos que passaram e passam pela minha vida. Até hoje. A criatividade
não é um dom mediúnico, mas um somatório de todas as ideias, pensamentos e delírios
seus e de todos que o circundam.
À ampp., também conhecida como Fernanda Alencar, Mariana Depoli, Rebeca Rocha e
Rodrigo Gonzalez. Que nós fundemos (e não afundemos) nossa agência e nossos sonhos.
A todos os meus amigos, que sempre significaram e significam muito para mim. Seja dos
tempos de escola, da UFF, do Twitter... Vocês sempre serão meu porto seguro para todas
as situações.
À Lilian Ribeiro, que me ensinou a ser o profissional que eu sou hoje. Eu não estaria aqui
se não fosse por todos os “Ok enviado do meu Blackberry da Claro” desde 2012.
Aos meus anjos da Superintendência de Relações Internacionais, do Vitamina UFF, da
Marinha do Brasil e de todos os outros lugares onde trabalhei. Vocês me ensinaram, na
prática, a sonhar.
Às professoras Fernanda Abreu e Thaiane Oliveira, que gentilmente aceitaram compor
minha Banca Examinadora.
Last but not least, a todos que me ajudaram respondendo as minhas pesquisas. Sei que
sou uma péssima pessoa pedindo favor e sei que vocês são um poço de paciência ajudando
este pobre formando. E, não, não esqueci da torta de limão.
Agradecerei meu futuro. Agradeço meu presente. Talvez agradeça meu passado.
4
I think if you do something and it turns out pretty good,
then you should go do something else wonderful, not
dwell on it for too long. Just figure out what's next. [Eu
penso que, se você faz algo e fica muito bom, então
você deve ir e fazer outra coisa maravilhosa, e não ficar
nisso por muito tempo. Apenas descubra qual a
próxima.]
Steve Jobs
I am only interested in the ideas that become obsessive and
make me feel uneasy. The ideas that I'm afraid of. [Eu estou
apenas interessada nas ideias que se tornam obsessivas e me
deixam inquieta. As ideais que eu tenho medo.]
Marina Abramović
5
RESUMO
MACEDO, Caio. Repensando a presença online: projeto para os portais da UFF com
foco em Usabilidade. Niterói: Universidade Federal Fluminense, 2016. (Monografia de
Graduação.)
Este projeto prático propõe um redesenho dos principais websites da Universidade
Federal Fluminense aliado a práticas de Usabilidade como arquitetura da informação e a
aplicação de pesquisas para aferir o grau de usabilidade de um sítio. Também é pauta
deste projeto a questão da acessibilidade em websites de organizações públicas.
Palavras-chave: Universidade Federal Fluminense. Website. Usabilidade.
Acessibilidade.
6
ABSTRACT
MACEDO, Caio. Repensando a presença online: projeto para os portais da UFF com
foco em Usabilidade. Niterói: Universidade Federal Fluminense, 2016. (Monografia de
Graduação.)
This practical project proposes a redesign in the main websites of Universidade Federal
Fluminense associated to Usability practices like information architecture and the
application of researches to assess the usability grade of a website. It is also subject of
this project the affair of accessibility in public organizations’ websites.
Keywords: Universidade Federal Fluminense. Website. Usability. UX. Accessibility.
7
LISTA DE ILUSTRAÇÕES
Figura 1: Capa do Guia de Diretrizes para a presença online da Universidade Federal
Fluminense ......................................................................................................................20
Figura 2: Versão final do layout para os portais e websites da UFF ..............................25
Figura 3: Layout padrão para os casos de site de algum órgão interno ..........................25
8
LISTA DE TABELAS
Tabela 1: Requisitos mínimos para os portais corporativos ...........................................19
Tabela 2: Lista de itens do cardsorting ..........................................................................22
Tabela 3: Lista de grupos pré-definidos para agrupamento dos cartões ........................22
Tabela 4: Resultado do cardsorting ...............................................................................24
Tabela 5: Resultado do First Click Test .........................................................................27
Tabela 6: Resultado dos Testes de Preferência. .............................................................27
9
SUMÁRIO
INTRODUÇÃO .............................................................................................................10
1. OBJETIVOS .........................................................................................................11
1.1. Objetivo geral .........................................................................................................11
1.2. Objetivos específicos .............................................................................................11
2. HIPÓTESES .........................................................................................................12
3. METODOLOGIA ................................................................................................13
4. ANÁLISE INICIAL .............................................................................................13
4.1. Público-Alvo ..........................................................................................................14
4.2. Como fazem os outros? ..........................................................................................15
5. EMBASAMENTO TEÓRICO ............................................................................16
6. PENSANDO EM EXPERIÊNCIA, PENSANDO EM USUÁRIOS ................19
6.1. O Guia de Diretrizes...............................................................................................20
7. EXECUÇÃO: DO CARDSORTING AO HTML ...............................................21
7.1. Construção do layout..............................................................................................24
8. RESULTADOS .....................................................................................................26
9. CONCLUSÃO ......................................................................................................28
10. REFERÊNCIAS BIBLIOGRÁFICAS ...............................................................29
11. ANEXO I - LISTA DE UNIVERSIDADES PESQUISADAS .........................33
12. CURRÍCULO .......................................................................................................35
10
INTRODUÇÃO
O presente projeto prático busca compreender, desenvolver e adequar um
conjunto de diretrizes (sejam novas ou já desenvolvidas) objetivando promover uma
atmosfera online (de websites e portais) que priorize o usuário comum da Universidade
Federal Fluminense. Em seus 21 anos de existência, a Internet se desenvolveu, cresceu
sobrenaturalmente (e continua crescendo), ditou novos padrões e passou a ser a peça-
chave nas tendências do mercado tecnológico.
Tim Berners-Lee, criador da estrutura conhecida como Internet, chegou a cunhar a
frase “Os usuários da Web querem obter informações rapidamente e facilmente. Eles não
ligam muito para sites atrativos e com um design bonito.” nos idos anos de 1996, quando
a rede começou a ter seu acesso livre e popularizado nos lares dos Estados Unidos.
Segundo o Internet Live Stats, website que concentra estatísticas quantitativas sobre a
rede, atualmente possui mais de um bilhão de websites conhecidos1.
Adaptado de <http://www.internetlivestats.com/total-number-of-websites>. Acesso em 03 abr. 16.
Com a popularização da rede as pessoas comuns (além dos cientistas ou militares,
primeiros usuários da internet) passaram a almejar seu espaço na rede, possuir
visibilidade. Essa democratização maciça e global da Internet trouxe todos os tipos de
públicos para a rede mundial de conexões, inclusive os designers. E, assim, os
desenvolvedores e programadores passaram a olhar a questão visual dos websites com
outros olhos.
1 Conhecidos pois são indexados pelos sites de busca (como o Google). Redes internas (as
Intranets) e websites da deep web são exemplos de endereços “desconhecidos”, pois não são
indexados.
ago/91 1993 1994 1998 2002 2006 2010 2011 2012 2013 2014 2015 2016
(est.)
Número de websites na internet por ano
11
Conceitos como os da acessibilidade (de tornar um website navegável para pessoas
com deficiência), os da usabilidade (estudos de meios e alternativas para deixar um site
mais fácil e lógico de se acessar – mais usável) e as ideias de design voltado para a
interação homem-máquina através dos sites e do design voltado para a experiência de
navegação no website, apesar de recentes, surgiram para propagar os conhecimentos e
ideias de alguns poucos designers com foco em uma internet melhor, mais fácil e
universal.
Porém este cuidado aos detalhes e estudos sobre a usabilidade, interface e interação
(multiplataforma) dos websites da UFF foram relegados a um meio informatizado de se
conseguir informação impressa ou, se muito, priorizam um design não-acessível por todos
(sejam portadores de deficiências ou usuários móveis, por exemplo).
Este trabalho é composto por análises aos produtos do segmento (websites de
universidades brasileiras), o desenvolvimento e aplicação de pesquisas com usuários,
seguido pelo desenvolvimento de um layout gráfico que agrupa o resultado das pesquisas
com as percepções obtidas pelas análises. O projeto também almeja criar e estimular uma
cultura de planejamento estratégico na comunicação institucional, através de um Guia de
Diretrizes, que concatena o conteúdo condensado das pesquisas (com usuários e desk
research) com aplicação prática no produto final (os websites da UFF).
1. OBJETIVOS
1.1. Objetivo geral
Produzir e executar uma estrutura de website voltada para as necessidades e objetivos
da Universidade Federal Fluminense na Internet, seguindo os preceitos de Usabilidade e
Arquitetura da Informação, para que o produto final seja de fácil acesso por grande parte
dos usuários.
1.2. Objetivos específicos
Analisar o posicionamento (verbal e gráfico-visual) do Governo Federal na
internet através dos websites dos Ministérios, das Secretarias da Presidência da
12
República e das Universidades públicas brasileiras e das Universidades
particulares do Rio de Janeiro;
Projetar graficamente e desenvolver em linguagem de programação pensando
nos conceitos já estudados de Usabilidade e Arquitetura da Informação;
Desenvolver, aplicar e compilar a metodologia de cardsorting;
Verificar o grau de universalização do website através da aplicação de testes
de usabilidade;
Analisar os resultados dos testes e o produto final;
2. HIPÓTESES
É fundamental, para a solução das questões aqui apresentadas, o desenvolvimento
gráfico aliado a um sistema de gerenciamento do conteúdo que estará presente naquele
site, onde este deve seguir os mesmos preceitos definidos por Cláudia Dias (2001) para
um portal corporativo. A escolha advém da constatação de que as plataformas de
gerenciamento de conteúdo (do inglês Content Management System) são de fácil
aprendizado pelo usuário comum.
A análise visual e do posicionamento em relação ao conteúdo dos websites do
Governo Federal – em específico o Portal Brasil, o Portal Planalto e o Blog do Planalto
– além dos sítios das Universidades públicas federais e de universidades privadas da
Região Metropolitana do Rio de Janeiro tem por objetivo compreender o cenário
comunicacional online dos pares ao projeto da Universidade Federal Fluminense (no caso
suas instâncias superiores e de Universidades públicas e privadas). A partir da análise é
possível concluir insights sobre as melhores formas de disposição do conteúdo ao longo
do site e sugestões de implementação de novos conteúdos.
Feitos os estudos e análises, o próximo passo consiste na construção de
wireframes, que são estruturas visuais do conteúdo do website, estabelecendo hierarquias
por assunto e importância. Posteriormente é elaborado um outro modelo de wireframe,
onde se produz um layout conceito que aplique estes conteúdos, pensando em sua
usabilidade e interatividade com o usuário visitante do sítio virtual.
Com a programação do layout desenvolvido, torna-se possível a utilização prática
de todos os conceitos estudados e empregados no website e sua posterior adoção para os
usuários visitantes. Por fim todo o esforço empenhado no desenvolvimento do template
do novo sítio da Universidade Federal Fluminense precisa ser submetido a testes para
13
verificar a facilidade de uso e acessibilidade com usuários comuns que serão questionados
a realizar tarefas no website e, com a experiência de navegação e percepção dos usuários
nos testes é possível identificar falhas e erros de usabilidade no site (seja visualmente ou
de conteúdo).
3. METODOLOGIA
Pesquisa bibliográfica teórica sobre interfaces, interação e novas mídias,
seguido de estudo específico dos conceitos de UI, UX, sistemas de
gerenciamento de conteúdo e programação web.
Pesquisa de referências (desk research) em websites de universidades
brasileiras.
Estruturação, aplicação e compilação de uma pesquisa de cardsorting, para
entender a percepção do usuário sobre a estrutura do site.
Desenvolvimento dos wireframes, mapas dos sites e aplicação destes no layout
gráfico digital com posterior programação para a plataforma WordPress.
Aplicação de testes de usabilidade com voluntários para comprovação da
usabilidade do site.
Análise dos resultados obtidos ao final de todo o processo.
4. ANÁLISE INICIAL
Minha escolha por um projeto desenvolvido para a Universidade Federal
Fluminense tem como base a valorização da imagem da universidade para o público em
geral. Esta valorização abrange diversos aspectos e, dentre eles, sua comunicação, em
específico a presença online da marca UFF.
Compreender a dimensão estrutural e relevância da UFF para Niterói, para o Rio
de Janeiro e para todo país e transmitir todo esse fluxo de conhecimento e informação
produzido diariamente dentro das salas e laboratórios da universidade para conhecimento
público através de meios de comunicação soam complexas. Tão complexo quanto é
oferecer (e manter) uma infraestrutura que dê suporte a todas as essas performances
comunicacionais.
14
Com este pensamento, percebi que existiriam formas, através da padronização e
da formulação de diretrizes, para otimizar esta infraestrutura comunicacional. Mais do
que questões estéticas, padronizar reduz custos, gera redundância no armazém
informacional da instituição (os servidores, estrutura de cabeamento de redes) além de
potencializar o tráfego de mais e mais usuários ao site. Desta forma, você consegue
propagar, cada vez mais, o conteúdo informacional produzido pelos discentes e docentes
da instituição.
Além dos quesitos técnicos, a estandardização da estrutura para websites e portais
da UFF dita visualmente o tom e ajuda no processo de memorização e assemelhação das
pessoas com a marca da Universidade. Os princípios atuais que norteiam o branding2
estão em buscar formas de se tornar mais presente e permanente na mente dos
consumidores.
Também é ponto favorável a semelhança visual como uma forma de autenticar a
informação contida naquele sítio virtual. Ao reconhecer a estrutura padronizada, o
visitante do site pode ter uma percepção (indireta) de que aquele conteúdo é de um site
de uma organização governamental, logo, possui veracidade.
Contudo, apesar de um caminho que ruma neste sentido (de unificação na
comunicação) pela atual administração da Universidade, acredito que o desenvolvimento
com foco em usabilidade e a estandartização em si vão além de “um site só para tudo”.
Em face ao exposto, o desafio neste projeto é encontrar formas de se otimizar e padronizar
(visualmente) os portais e websites da UFF sem esquecer de torná-lo fácil para qualquer
pessoa que acesse o site, seja ela estudante vestibulando, aluno matriculado na UFF,
professor, pessoa com deficiência ou não etc.
4.1. Público-Alvo
O público-alvo é toda e qualquer pessoa que possui um computador com acesso à
internet, porém serão considerados para este projeto os seguintes targets:
Discere3: Os alunos, ex-alunos e potenciais alunos da Universidade. O site deverá
se voltar para a grande massa de acessos espontâneos, com informações para o aluno que
2“Termo que define estratégias relacionadas com a construção de uma marca.” (CLIFTON,
2010). 3 Discere, Docere, Seminare, do latim, Aprender, Ensinar e Semear.
15
deseja entrar para a Universidade, para o aluno que está e para os ex-alunos da
Universidade, como forma de valorizar um dos principais eixos da instituição.
Docere3: Professores e ex-professores. Necessita-se também de um enfoque aos
docentes e ex-docentes da UFF que, mesmo tendo conhecimento de anos da
Universidade, ainda tendem a procurar informações específicas que deverão estar
disponíveis online, propondo uma convergência de todos os meios físicos para o digital.
Seminare3: Servidores e funcionários terceirizados. Uma das partes mais
desvalorizadas das Universidades brasileiras, os técnico-administrativos e terceirizados
também terão partes priorizadas do site para as informações importantes para eles
enquanto funcionários e enquanto membros da Comunidade UFF.
4.2. Como fazem os outros?
Em análise aos representantes-chave do mesmo segmento da UFF (ou seja as
principais universidades públicas do sudeste), é possível perceber uma resistência grande
(ou um comodismo) por parte dos departamentos de Tecnologia da Informação das
instituições em adotar novos padrões visuais ou de usabilidade (como responsividade,
layouts mais simplificados e melhor arranjo no mapa do site).
A acessibilidade é um item presente somente em 4 dos 20 sites pesquisados4 e,
ainda assim, o mínimo exigido para um website ser considerado acessível ou não foi
aplicado ou foi aplicado não atendendo ao que é definido como padrão. Um exemplo a
ser seguido para a execução deste projeto é o novo site da Universidade de São Paulo
(<http://www.usp.br>. Acesso em 21 out. 2015.) que, apesar de não possuir as
ferramentas mínimas de acessibilidade, é um exemplo a ser seguido nas questões de
usabilidade e de mapa de site bem estruturado.
Já em análise às principais instituições de ensino privadas do Rio de Janeiro e de
São Paulo é perceptível o investimento destas na parte estética dos websites. Apesar de
que o importante, para um site, é o seu conteúdo e a forma como ele é estruturado, a
diagramação e layout das páginas são itens de maior relevância para grande parte dos
usuários comuns.
Nos sites das instituições privadas, ao contrário das públicas, não é possível
identificar a presença de ferramentas de acessibilidade (como texto em alto contraste,
4 A lista de instituições pesquisadas encontra-se em anexo a este projeto.
16
aumento de fonte ou comandos-guia para leitores de tela). Dos 14 sites analisados nenhum
possuía nenhuma das opções citadas.
Poderão ser citados como exemplo na estruturação e diagramação do conteúdo os
sites da Fundação Armando Alvares Penteado (FAAP), da Universidade Estácio de Sá
(UNESA), da Universidade Cásper Líbero e da Universidade Veiga de Almeida (UVA).
5. EMBASAMENTO TEÓRICO
Antes de mais nada é preciso uma apresentação básica dos conceitos a serem
tratados neste projeto. Acessibilidade, Usabilidade, UI e UX5 são conceitos muito
presentes na percepção do usuário comum ao entrar e navegar por um website, porém não
são exemplificados ou explanados, cabendo apenas a percepção ao utilizar a Internet.
Por via de regra, as pessoas não gostam de precisar descobrir como fazer
algo. Elas se divertem com quebra-cabeças em momentos específicos –
quando querem se distrair ou se autodesafiar –, e não quando estão tentando
descobrir a que horas a lavanderia fecha. O fato de as pessoas responsáveis
pela criação do site não terem se importado em deixar tudo óbvio – e fácil –
pode diminuir nossa confiança no site e em quem está por trás dele.
(KRUG, 2014, p. 13)
Segundo Frederick van Amstel (2006), “o design de interação é mais uma proposta
para trazer aquilo que falta à Engenharia no desenvolvimento de novas tecnologias: a
preocupação com o usuário”, de modo que a estrutura de um website – da disposição de
conteúdos até o layout do site em si – vai sempre ser feita pensando na percepção do
usuário e nas prováveis linhas de raciocínio que ele fará ao “ler” o website.
A interação, neste caso, não está relacionada à relação emissor-receptor mas ao
retorno do site a cada forma de interação que o usuário fizer, podendo ser interações
padronizadas (como conteúdos preparados para uma página em específico) ou
personalizadas (que vão ser estruturadas em cima de opções ou conteúdos pré-
determinados pelo usuário).
Já a ideia de Usabilidade está diretamente ligada ao Design de Experiência, de
modo que a experiência do usuário, se fácil e intuitiva, junto a outros fatores, mostra que
um site é usável. O processo de se pensar usabilidade vai além de um layout de um website
feito simples, com cores claras etc., mas sim como um processo de eliminação de
prováveis perguntas que o usuário vai se fazer ao entrar no seu site. Para Krug (2014),
5 User Interface e User Experience, tratados aqui como o layout e a usabilidade.
17
“tornar as páginas evidentes é como contar com uma boa iluminação em uma loja: faz
tudo parecer melhor. Usar um site que não nos faça pensar (...) é fácil e não nos suga
energia, entusiasmo e tempo.”
A Usabilidade per si é mais aplicada para soluções práticas. Primeiramente você
precisa entender as falhas que seu website possui e depois resolvê-las, mas com este
processo sendo realizado pelo ponto de vista do usuário comum, e não dos arquitetos da
informação ou dos designers, que possuem conhecimento aprofundado sobre o conteúdo
do site, o que levará a distorções nos resultados dos Testes de Usabilidade.
Samuel Salimen, que desenvolveu uma análise de usabilidade em sites de
universidades do extremo sul do país também salientou que a usabilidade tem que ser
feita pensando em qualquer usuário. Em sua pesquisa, ele afirma que
basta acessar os sítios de qualquer universidade para se perceber
claramente que a maioria privilegia os interesses dos colaboradores das
universidades, ou seja, das pessoas que estão familiarizadas com os jargões
da instituição (SALIMEN, 2011)
Tanto em Salimen quanto em José Maria Jardim é claramente perceptível essa
ausência de uma atenção à usabilidade no desenvolvimento de websites em geral.
Segundo José Maria, “se do ponto de vista político-organizacional o cidadão encontra-
se ausente (...), o problema se reproduz – ainda que em menor escala – num dos
instrumentos de mais impacto potencial junto à sociedade”. (JARDIM, 2007)
Já a Acessibilidade envolve modos, maneiras e questionamentos relacionados ao
poder de acesso aos sites por parte de usuários com deficiência e, mais recentemente, foi
acrescentado aos quesitos de acessibilidade o poder de acesso aos sites por dispositivos
móveis, como smartphones e tablets, partindo do princípio de que, também para estes
segmentos, necessita-se de adaptações na estrutura do site, que o otimizarão para telas
pequenas ou superfícies sensíveis ao toque.
Acho que para alguns designers, contudo, a acessibilidade parece uma
imagem como o conto de Kurt Vonnegut, no qual o governo produz
igualdade tornando todos deficientes. (KRUG, 2014)
No artigo de Paulo Bites (2009) é possível ver que “nos Estados Unidos a Lei de
Amparo aos Deficientes exige [que] toda tecnologia da informação que receba recursos
governamentais, deve ser plenamente acessível a pessoas com deficiência,”. Já no Brasil
a acessibilidade também é amparada por lei, através do artigo 17 da lei 10.098/98, que
afirma:
18
o Poder Público promoverá a eliminação de barreiras na comunicação e
estabelecerá mecanismos e alternativas técnicas que tornem acessíveis os
sistemas de comunicação e sinalização às pessoas portadoras de deficiência
sensorial e com dificuldades de comunicação, para garantir-lhes o direito
de acesso à informação, à comunicação, ao trabalho, à educação, ao
transporte, à cultura, ao esporte e ao lazer. (BRASIL. Decreto-lei nº 10.098
apud BITES, 2009)
Apresentados os conceitos dever-se-á voltar a atenção a outro ponto importante
do projeto, em relação ao que se encontra atualmente: o conteúdo. Para Carla Dias (2001)
os portais corporativos buscam a “facilidade de acesso às informações distribuídas nos
diversos sistemas, arquivos e bases de dados institucionais”. Além de ser usável e
acessível para todos um site não pode deixar de ser referência pelo seu conteúdo de
qualidade e sempre disponível, tanto para organizações públicas quanto privadas.
Ainda segundo Dias, o portal da Universidade Federal Fluminense se enquadraria
em um portal de informações ou de conteúdo pois se trata de um portal de informações
“como aquele capaz apenas de organizar grandes acervos de conteúdo a partir dos temas
ou assuntos neles contidos, conectando as pessoas às informações.” (MURRAY, 1999
apud DIAS, 2001). Porém, todos os portais corporativos devem possuir alguns requisitos
mínimos, citados a seguir:
Requisito Descrição
Fácil para usuários eventuais
Os usuários devem conseguir localizar e acessar facilmente a informação
correta, com o mínimo de treinamento, não importando o local de
armazenamento dessa informação.
Classificação e pesquisa intuitiva
O portal deve ser capaz de indexar e organizar as informações da
empresa e apresentar o resultado da pesquisa em categorias de fácil
compreensão.
Compartilhamento cooperativo O portal deve ser um meio de interação entre pessoas e grupos na
organização.
Conectividade universal aos
recursos informacionais
O portal deve prover amplo acesso a todo e qualquer recurso
informacional, suportando conexão com sistemas heterogêneos, tais
como correio eletrônico, sistemas de gestão de documentos etc.
Acesso dinâmico aos recursos
informacionais
Por meio de sistemas inteligentes, o portal deve permitir o acesso
dinâmico às informações nele armazenadas, fazendo com que os
usuários sempre recebam informações atualizadas.
Roteamento inteligente O portal deve ser capaz de direcionar automaticamente documentos a
usuários selecionados.
Ferramenta de inteligência de
negócios integrada
Para atender às necessidades de informação dos usuários, o portal deve
integrar os aspectos de pesquisa, relatórios e análise.
Arquitetura baseada em servidor
Para suportar um grande número de usuários e grandes volumes de
informações, serviços e sessões concorrentes, o portal deve basear-se em
uma arquitetura cliente-servidor.
19
Serviços distribuídos Para um melhor balanceamento da carga de processamento, o portal
deve distribuir os serviços por vários computadores ou servidores.
Definição flexível das permissões
de acesso
O administrador do portal deve ser capaz de definir permissões de acesso
para usuários e grupos da empresa, por meio de perfis dos usuários
Interfaces externas O portal deve ser capaz de se comunicar com outros aplicativos e
sistemas.
Segurança
Para salvaguardar as informações corporativas e prevenir acessos não
autorizados, o portal deve suportar serviços de segurança, como
criptografia, autenticação, firewalls etc.
Fácil administração
O portal deve prover um meio de gerenciar todas as informações
corporativas e monitorar o funcionamento do portal de forma
centralizada e dinâmica. Deve ser de fácil instalação, configuração e
manutenção, e aproveitar, na medida do possível, a base instalada de
hardware e software adquirida/contratada anteriormente pela
organização.
Customização e personalização
O administrador do portal deve ser capaz de customizá-lo de acordo com
as políticas e expectativas da organização, assim como os próprios
usuários devem ser capazes de personalizar sua interface para facilitar e
agilizar o acesso às informações consideradas relevantes.
Tabela 1: Requisitos mínimos para os portais corporativos. (DIAS, 2001. Adaptado.)
Todos os apontamentos aqui apresentados devem ser estudados e levados em
consideração não como uma obrigação ou como tarefas a serem cumpridas por um
designer ou um desenvolvedor web, mas como uma variante do seu trabalho objetivando
uma compreensão maior dos usuários do seu produto (em usabilidade) e a disponibilidade
desse produto para todas as pessoas (em acessibilidade).
Usabilidade é, em seu âmago, ser advogado do usuário: igual ao Lorax,
você fala pelas árvores. Bem, pelos usuários, na verdade. Usabilidade tem
a ver com prestar melhores serviços por meio da construção de melhores
produtos (…) Em vez disso, elas veem a usabilidade como uma maneira de
lhes dizer como fazer com que as pessoas pensem que algo é desejável, em
outras palavras, manipulando-as (…) Os usuários contam com você.
(KRUG, 2014)
6. PENSANDO EM EXPERIÊNCIA, PENSANDO EM USUÁRIOS
Antes de se desenvolver qualquer parte do projeto, deve-se atentar ao que
precisará ser feito. Antes de todas as pesquisas e validações, precisa-se estabelecer
diretrizes do que será aceito ou não para, a partir destas diretrizes, produzir os
detalhamentos (wireframes, layouts e o produto final) e o esqueleto (mapa do site e a
arquitetura da informação).
20
A reunião deste conhecimento resultou no Guia de Diretrizes para a presença
online da Universidade Federal Fluminense, documento que acompanha, condensa e
instrui as tendências que nortearão toda a presença da marca UFF na internet.
6.1. O Guia de Diretrizes
Figura 1: Capa do Guia de Diretrizes para a presença online da Universidade Federal Fluminense.
O principal objetivo do Guia é uniformizar e estandartizar a comunicação
institucional a médio e longo prazo. Com ele, você garante critérios mínimos que
precisam ser atendidos de modo que o resultado e o ciclo de trabalho não sejam afetados.
Novidade neste Guia, o Comitê Gestor da Comunicação da UFF deverá atender
os requisitos mínimos especificados e eles serão responsáveis por decidir quaisquer
mudanças nas plataformas de comunicação online. O Comitê seria escolhido pelos chefes
superiores (Pró-Reitores, Superintendententes etc.) de acordo com a disponibilidade de
cada órgão.
Em trabalho direto com o Comitê, as Pró-Reitorias, Superintendências,
Escritórios, Coordenações de Curso e Diretores de Faculdades/Institutos deverão elencar
pessoas responsáveis pela manutenção e atualização de suas respectivas áreas nos portais,
21
sítios eletrônicos e sistemas da UFF. Tal diretriz busca promover uma cultura de
manutenção constante dos canais online das instituições.
Além do Comitê, o Guia discorre sobre orientações para o padrão editorial da
comunicação da UFF e instruções para tradução dos websites. Todo o trabalho
desenvolvido para o Guia deverá ser revertido em valor de marca (valor metafórico, de
associação) para os usuários.
7. EXECUÇÃO: DO CARDSORTING AO HTML
Conforme dito anteriormente, o desenvolvimento de um website envolve, além
das questões visuais e técnicas de programação, o pensamento voltado para a Arquitetura
da Informação. Segundo Anamaria de Moraes, o “cardsorting é uma técnica de
usabilidade utilizada para descobrir o modelo mental do usuário num espaço de
informação. (...) Empregado para verificar a diferença entre o modo pelo qual os
usuários inexperientes e experientes entendem o sistema.” (DE MORAES; SANTA
ROSA, 2012, p. 64-65).
A metologia de pesquisa do cardsorting consiste em lançar mão de cartões com
descrições do conteúdo das páginas de um site (seja somente a palavra-chave ou uma
descrição extensa, o que for melhor compreendido pelo usuário) e pede-se ao pesquisado
que disponha os cartões em grupos (pré-determinados ou não), no arranjo que for melhor
em seu ponto de vista.
Através do reconhecimento de padrões nas disposições feitas por cada pesquisado,
estrutura-se a disposição do conteúdo do site. Este teste auxilia, também, a identificar
terminologias difíceis de serem compreendidas pelo público-alvo, identificar conteúdos
de dificil categorização ou até informações que poderiam existir em mais de um grupo.
Neste projeto, desenvolveu-se uma pesquisa de cardsorting híbrido, em que o
pesquisado poderia ou não definir nomes aos grupos aos quais categorizavam os cartões.
Ao todo, foram listados 42 cartões e 6 grupos com as seguintes informações:
Nº Conteúdo do cartão Nº Conteúdo do cartão
1 Informações sobre Estágio 20 Encontro de Bolsistas
2 Informações sobre Monitoria 21 Semana de Extensão
3 Informações sobre Tutoria e PET 22 Incubadora de Empresas
4 Admissão nos Cursos de Graduação 23 Escritório de Propriedade Intelectual
22
5 Banco de Ementas 24 Mobilidade Internacional para alunos
UFF
6 Calendários 25 Mobilidade para alunos estrangeiros
7 Cursos de Graduação 26 Prog. de Univ. de Línguas
Estrangeiras
8 Cursos de Pós-Graduação 27 Idiomas sem Fronteiras
9 Matrizes curriculares dos cursos 28 Lista de Sistemas da UFF
10 Ações de extensão na UFF 29 Eventos que acontecerão na UFF
11 Informações sobre bolsas de
extensão
30 Lista de Endereços e Telefones
12 Informações sobre bolsas
PIBIC/CNPq
31 Boletim de Serviço (BS)
13 Unidades (Campi) da UFF 32 Lista de ex-Reitores
14 Requerimento escolar 33 Contato dos coordenadores de curso
15 Carteirinha da UFF 34 Português para estrangeiros
16 Moradia Estudantil 35 Oportunidades no exterior
17 Restaurante Universitário 36 Mobilidade Nacional (via
ANDIFES)
18 Bolsas de auxílio ao estudante 37 Lista de Editais
19 Ações de extensão da UFF 38 Cinema / Arte / Exposições
39 Esportes na UFF 41 Editora da UFF
40 BusUFF 42 Informes e Avisos
Tabela 2: Lista de itens do cardsorting.
Grupos pré-definidos para agrupamento dos cartões
Ensino Pesquisa Extensão Internacional Institucional Notícias Tabela 3: Lista de grupos pré-definidos para agrupamento dos cartões.
A partir dessa estrutura montada em um sistema online de testes de cardsorting,
houve a participação de 72 pessoas. O resultado leva em consideração duas disposições:
A porcentagem de repetição do cartão dentro do grupo (onde divide-se o número de
repetições pelo total de participantes) e o número de repetições em si. Através destas
repetições, entende-se que aquele conteúdo tem muita ou pouca aderência àquele grupo
ao qual se encontra. Segundo Jakob Nielsen, especialista em usabilidade, “saber como as
pessoas agrupam certos cartões fornece uma visão mais profunda dos seus modelos
mentais do que o simples fato de que eles ordenaram os cartões dentro da mesma pilha.”
(NIELSEN, 2005 apud DE MORAES; SANTA ROSA, 2012).
Abaixo se encontra um quadro-resumo com o resultado das pesquisas de
cardsorting. Os grupos descritos em itálico foram sugeridos pelos usuários pesquisados
em suas sessões de teste.
23
Nº do
Cartão Ensino Pesquisa Extensão Internacion. Institucion. Notícias
01 7% (5) 3% (2) 3% (2) 1% (1) 4% (3) 33% (24)
02 8% (6) 4% (3) 4% (3) - 10% (7) 18% (13)
03 8% (6) 7% (5) 7% (5) 1% (1) 10% (7) 13% (9)
04 25% (18) - 1% (1) - 17% (12) 4% (3)
05 21% (15) 7% (5) - - 10% (7) 8% (6)
06 8% (6) 3% (2) 1% (1) - 14% (10) 19% (14)
07 38% (27) 1% (1) - 1% (1) 10% (7) 1% (1)
08 26% (19) 6% (4) 11% (8) 1% (1) 3% (2) -
09 28% (20) 6% (4) 1% (1) - 11% (8) 1% (1)
10 - 1% (1) 35% (25) - 10% (7) 1% (1)
11 1% (1) 4% (3) 21% (15) - 3% (2) 13% (9)
12 3% (2) 15% (11) 8% (6) - 6% (4) 14% (10)
13 8% (6) - - - 38% (27) 4% (3)
14 22% (16) 1% (1) - 1% (1) 21% (15) 1% (1)
15 6% (4) 1% (1) 1% (1) 39% (28) 1% (1)
16 4% (3) - 4% (3) 1% (1) 38% (27) 1% (1)
17 1% (1) 1% (1) 4% (3) 43% (31) -
18 13% (9) 4% (3) 11% (8) 3% (2) 13% (9) 4% (3)
19 4% (3) - 39% (28) 4% (3) -
20 3% (2) 10% (7) 11% (8) 1% (1) 6% (4) 18% (13)
21 1% (1) 1% (1) 43% (31) 1% (1) 1% (1) 4% (3)
22 4% (3) 19% (14) 8% (6) 1% (1) 8% (6) 1% (1)
23 6% (4) 14% (10) 4% (3) 19% (14) 3% (2)
24 - - 1% (1) 40% (29) 4% (3) -
25 - - - 47% (34) - 1% (1)
26 8% (6) 3% (2) 10% (7) 22% (16) - 3% (2)
27 7% (5) - 4% (3) 36% (26) - 3% (2)
28 1% (1) 7% (5) - - 32% (23) 6% (4)
29 1% (1) 3% (2) 10% (7) 36% (26)
30 1% (1) 11% (8) 1% (1) - 25% (18) 10% (7)
31 - 4% (3) - 1% (1) 21% (15) 19% (14)
32 1% (1) 10% (7) - 1% (1) 26% (19) 6% (4)
33 11% (8) 10% (7) - 1% (1) 15% (11) 4% (3)
34 8% (6) 3% (2) 3% (2) 32% (23) - -
35 1% (1) 3% (2) - 44% (32) 1% (1) 4% (3)
36 6% (4) 4% (3) 7% (5) 13% (9) 11% (8) 3% (2)
37 6% (4) 13% (9) 1% (1) 1% (1) 13% (9) 14% (10)
38 7% (5) 3% (2) 14% (10) - 7% (5) 25% (18)
39 7% (5) 1% (1) 14% (10) - 22% (16) 10% (7)
40 1% (1) 3% (2) 3% (2) - 49% (35) 3% (2)
41 4% (3) - 6% (4) - 29% (21) 6% (4)
42 1% (1) 3% (2) 3% (2) - 4% (3) 35% (25)
24
Tabela 4: Resultado do cardsorting.
Nota: Os quadrados marcados em cinza escuro foram as escolhas com maior número de repetições.
Legenda: Porcentagem de repetições e, entre parênteses, o número exato de repetições.
Realizadas as pesquisas que definiriam a arquitetura da informação do site, a
próxima etapa consiste na produção de wireframes (rascunhos de layout) e,
posteriormente, a transformação desses rascunhos em um layout definitivo.
7.1. Construção do layout
A construção da estrutura visual do site levou em consideração as suas múltiplas
finalidades e múltiplos targets que deverá atender. Através de uma estrutura em blocos,
classificados por cores, o usuário poderá identificar sua parte em uma leitura rápida pelo
site. Além disso, busca-se estimular uma cultura de associação direta a algum elemento
visual à área a qual o usuário procura no site, otimizando a navegação e direcionando
melhor o usuário para aquilo que ele procura.
Em consonância com uma palheta de cores principal, que utiliza tons de azul
(remetendo ao logotipo da UFF), complementa-se ao azul o verde (para Ensino), o roxo
(para Pesquisa) e o cinza (para Internacional). Extensão, Institucional e Notícias utilizam
outros tons de azul, não utilizados na escala cromática da identidade da Universidade.
Acrescido a isso, o uso de tipografias modernas e de fácil leitura ditam o tom de facilidade
de acesso e universalização do acesso.
A redução de custos por escala, já dita, advém do reaproveitamento dos arquivos
estáticos do site (como folhas de estilo e os arquivos de programação do tema) para todos
os portais e websites, gerando melhor alocação dos recursos e da banda de rede do site.
As folhas de estilo “foram criadas para compensar as lacunas da linguagem HTML no
que diz respeito à configuração da página e à apresentação. (...) Graças às folhas de
estilo, (...) basta alterar a definição das folhas de estilo num só lugar para alterar a
aparência de todo o síte” (CCM BENCHMARK GROUP, s.d.)
O resultado final do desenvolvimento está exposto a seguir. Demais detalhes sobre
a composição do site e os módulos estão especificadas no Guia de Diretrizes para a
presença online da Universidade Federal Fluminense, anexo a este documento.
25
Figura 2: Versão final do layout para os portais e websites da UFF.
A imagem acima possui o layout finalizado com simulação já incluindo a
disposição dos conteúdos no site, com destaque para a classificação das Grandes Áreas
(Ensino, Pesquisa, Extensão etc.) com cores e estruturas modulares próprias.
Além disso, o Portal Institucional contempla uma estrutura própria para os casos
em que o site é voltado para um órgão interno (Pró-Reitoria ou Superintendência, por
exemplo). O resultado está disponível a seguir e, também, é melhor detalhado no Guia
de Diretrizes.
Figura 3: Layout padrão para os casos de site de algum órgão interno.
26
8. RESULTADOS
A aferição dos resultados atingidos vem, também, através de pesquisas
qualitativas, porém voltadas para a prática da usabilidade. Os testes de usabilidade
utilizados neste projeto são chamados de First Click Test (Teste de Primeiro Clique em
tradução liberal), que consiste em determinar uma ou mais tarefas para o usuário
pesquisado e ele irá indicar, no site, através de um clique, onde ele solucionará a tarefa.
Esta modalidade de pesquisa foi utilizada tendo em vista a facilidade de aplicação
(pois demandava apenas uma captura de tela de toda a página do site, sem estrutura de
programação ou de servidores) e também foi desenvolvida de forma online através de
sites que oferecem este serviço. Tanto na metodologia de cardsorting quanto nesta os
pesquisados foram convidados para participar do processo de desenvolvimento do site ao
demonstrar interesse em contribuir com as diligências.
A rodada de pesquisas incluiu o desenvolvimento de três tarefas (classificadas em
Fácil, Médio e Difícil, de acordo com a dificuldade), tanto para o layout atual quanto para
o proposto e enviadas para 24 pessoas distintas, onde 12 pessoas responderam as
atividades no layout antigo e 12 no layout proposto. As três tarefas foram:
“Onde você clicaria para achar o Quadro de Horários do seu curso?” (Pergunta
de nível Fácil);
“Onde você clicaria para ver sobre bolsas de auxílio ao estudante de Graduação
(bolsas PROAES)?” (Pergunta de nível Médio);
“Onde você clicaria para saber a lista de ex-reitores da UFF?” (Pergunta de
nível Difícil).
O resultado das tarefas demonstrou uma diferença substancial na solução das
tarefas por parte dos pesquisados do layout proposto em relação aos pesquisados do
layout atual. Estes desenvolveram as atividades com uma taxa de acertos inferior e
demorando mais tempo para solucioná-las do que aqueles. A seguir uma tabela-resumo
das informações coletadas nesta pesquisa.
Tarefa Layout Atual Layout Proposto
Tempo Médio Acertos Tempo Médio Acertos
Lista de ex-Reitores 36s 92% 20s 67%
Bolsas de Auxílio 29s 25% 25s 100%
27
Quadro de Horários 43,5s 33% 27,5s 67% Tabela 5: Resultado do First Click Test. Valores em segundos.
Ao geral, as tarefas requisitadas foram resolvidas em um tempo médio menor no
layout novo do que em relação ao layout atual. Em contrapartida, no teste para encontrar
a lista de ex-Reitores, a taxa de acertos foi maior na estrutura atual do que na proposta.
Também em contraste existe a quadruplicação da taxa de acertos no teste sobre as Bolsas
de Auxílio da PROAES na estrutura proposta sobre a estrutura atual.
A terceira e última leva de pesquisas consistiu em três Testes de Preferência, em
que se pergunta ao pesquisado e a resposta está entre optar por um ou outro layout de
website. As perguntas desenvolvidas foram:
“Qual layout você acha mais minimalista?”;
“Qual layout você acha mais amigável?”;
“Se você pudesse se casar com um dos dois layouts, qual seria?”.
Por serem pesquisas que lidaram com a percepção e opinião estética de cada
pesquisado, a análise necessita ser feita levando em conta as condicionais apresentadas.
O resultado das perguntas, realizadas também com 12 pessoas, foi:
Pergunta Layout Atual L. Proposto
Qual layout você acha mais minimalista? 58% (7 de 12) 42% (5 de 12)
Qual layout você acha mais amigável? 17% (2 de 12) 83% (10 de 12)
Se você pudesse se casar com um dos dois
layouts, qual seria? 17% (2 de 12) 83% (10 de 12)
Tabela 6: Resultado dos Testes de Preferência.
Por exemplo, é perceptível uma preferência dos pesquisados pelo layout atual no
quesito minimalismo. Levando-se em conta a quantidade de conteúdo em cada página, o
estudo atual é, realmente, minimalista, porém o estudo proposto é mais abrangente e
detalhista na estrutura da página, de modo que o usuário não precise sair dali para realizar
outras ações. Estas e outras condicionais sempre deverão ser consideradas em análises de
pesquisas qualitativas.
Desta forma, comprova-se a eficácia do layout proposto sobre o layout atual, pois
é estatisticamente mais amigável e aceito pelo público-alvo que utiliza o site, além de ter
sido desenvolvido, desde o princípio, com foco no usuário.
28
9. CONCLUSÃO
Este projeto buscou, inicialmente, propor uma mudança visual na estrutura do
website da Universidade Federal Fluminense. Contudo, o trabalho expandiu-se para
outras temáticas e tomou forma para algo além do que uma simples proposta gráfica para
o online, ele tornou-se um planejamento estratégico que define padrões a longo prazo
para toda a comunicação online da UFF.
Com o crescimento exponencial das instituições públicas de ensino superior, seja
em número de alunos, prédios ou cursos, torna-se fundamental a proposição de
planejamentos e diretrizes que ditarão o norte a se trabalhar por meses ou anos. Este
comportamento é comum para gestão de qualquer Universidade porém nunca foi portado
para a gestão comunicacional de qualquer instituição. Desta forma, algumas conclusões
que podem ser obtidas é de grande desconhecimento, ainda, no Brasil. A competência e
os estudos de Usabilidade atravessam décadas em diversos países porém ainda
engatinham em outros países. A proposta, acima de tudo, é que este projeto sirva como
mais um canal de propagação e instrução para novos estudantes que possuem afinidade
com este tema.
Outra conclusão, que também pode ser tirada ao fim deste projeto, é que o mesmo
fomente boas práticas no design voltado para a web e que estimule, também, a valorização
da Acessibilidade em websites do Poder Executivo. Recentemente a Secretaria de
Comunicação da Presidência da República (SECOM/PR) produziu e desenvolveu uma
estrutura padrão para todos os sites governamentais, incluindo ali os requisitos mínimos
de usabilidade e acessibilidade. Porém, caso algum órgão governamental almeje produzir
uma estrutura própria e com mais identificação a este, que tal empenho seja estimulado e
que ele leve, como diretrizes, a universalização do acesso através da acessibilidade e da
usabilidade.
Cabe destacar que todo este planejamento, pela natureza do tema, está suscetível
a mudanças. Modificações estas que são naturais, pois se lida com pessoas e a percepção
delas está em constante mutação. Os testes aqui realizados devem ser ocasionalmente re-
aplicados a fim de que se ateste a eficiência da estrutura existente nos websites. Não só
para aferir o já existente como para adições de conteúdos ou edição de conteúdos
existentes. A percepção do usuário nunca será igual à percepção do especialista em
usabilidade ou do arquiteto de informação.
29
Não podemos deixar de destacar a grande tendência e aderência do acervo
informacional (os sites e portais) à multiplicidade de formatos e dispositivos
(principalmente em dispositivos móveis). Este projeto incluiu diretrizes visuais e
informacionais para esta tendência (que também se principia no país) porém deve-se ater
a qualquer mudança no cenário, seja na adoção de aplicativos móveis proprietários ou na
convergência completa para dispositivos móveis. O futuro está no mobile mas também
está no desktop.
Por fim, espero que este trabalho, pensado e conduzido por meses a finco, tenha
aplicações práticas na Universidade ou que sirva de referência para aplicações em outras
instituições brasileiras. O importante é que sejam estimulados e divulgados os conceitos
e vantagens perceptíveis da Usabilidade e da Arquitetura de Informação em prol dos
usuários e empresas.
10. REFERÊNCIAS BIBLIOGRÁFICAS
ARAÚJO, Rafael et al. Desenvolvimento e Implementação de um website para o curso
de Engenharia Física da UEMS. In: SEMINÁRIO DE EXTENSÃO UNIVERSITÁRIA,
9., 2011, Dourados. Anais eletrônicos... Dourados: UEMS, 2011. Disponível em
<http://periodicos.uems.br/novo/index.php/semex/article/view/866>. Acesso em 31 mar.
15.
BATISTA, Cláudia. Modelo e Diretrizes para o processo de design de interface web
adaptativa. Florianópolis: PPGEGC/UFSC, 2008. Disponível em
<https://repositorio.ufsc.br/xmlui/handle/123456789/91727>. Acesso em 31 mar. 15.
BERG, Sean. Design Básico: Diferença entre UX e UI Design. Disponível em
<http://chocoladesign.com/design-basico-diferenca-entre-ux-e-ui-design>. Acesso em
01 abr. 15.
BITES, Paulo; ALMEIDA, Onilia Cristina. Design de Interação para WEB com ênfase
em Pessoas com Deficiência. In: CONGRESSO INTERNACIONAL ABED DE
EDUCAÇÃO A DISTÂNCIA, 15., 2009, Fortaleza. Anais eletrônicos... São Paulo:
ABED, 2009. Disponível em
<http://www.abed.org.br/congresso2009/CD/trabalhos/1552009195745.pdf>. Acesso
em 31 mar. 15.
BRASIL. Congresso. Câmara dos Deputados. Lei Brasileira de Inclusão da Pessoa com
Deficiência. Brasília: Edições Câmara, 2015. Disponível em
30
<http://bd.camara.leg.br/bd/bitstream/handle/bdcamara/24099/lei_brasileira_inclusao_
%20pessoa_%20deficiencia.pdf>. Acesso em 15 mar. 16.
BUSTAMANTE, Guilherme; MOTA, Larissa; GASPARINI, Pedro. Novo Portal
Terra: Unificando Layouts e Experiências. Disponível em
<http://chocoladesign.com/novo-portal-terra-unificando-layouts-e-experiencias>.
Acesso em 01 abr. 15.
CLIFTON, Rita; SIMMONS, John (Orgs.). Mundo das Marcas. Lisboa: Actual Editora,
2010.
CCM BENCHMARK GROUP. Folhas de Estilo – CSS. Disponível em
<http://br.ccm.net/contents/158-folhas-de-estilo-css>. Acesso em 15 mar. 16.
DE MORAES, Anamaria; SANTA ROSA, José Guilherme. Avaliação e Projeto no
Design de Interfaces. 2. ed. Rio de Janeiro: 2AB Editora, 2012.
DIAS, Cláudia Augusto. Portal corporativo: conceitos e características. Ci. Inf., Brasília,
v. 30, n. 1, abr. 2001. Disponível em
<http://www.scielo.br/scielo.php?script=sci_arttext&pid=S0100-
19652001000100007&lng=pt&nrm=iso>. Acesso em 31 mar. 15.
FREITAS, Lígia. As páginas iniciais de websites de universidades brasileiras e suas
informações: tipos, organização e visibilidade. Porto Alegre: UFRGS, 2010.
Disponível em
<https://www.lume.ufrgs.br/bitstream/handle/10183/27831/000766915.pdf>. Acesso em
31 mar. 15.
GRANDINO, Patrícia; SOLEDADE, Marcos; VASCONCELLOS, Victor. A Web 2.0
Desconstruindo Preconceitos: Website da Convivência Universitária e do Projeto
Visibilidades. In: ENCONTRO NACIONAL DE INFORMÁTICA E EDUCAÇÃO, 1.,
2009, Cascavel. Anais eletrônicos... Cascavel: UNIOESTE, 2009. Disponível em:
<http://www.inf.unioeste.br/enined/2009/anais/enined/A31.pdf>. Acesso em 31 mar. 15.
GOOGLE. Material design: Google design guidelines. Disponível em
<http://www.google.com/design/spec/material-design/introduction.html>. Acesso em 01
abr. 15.
JARDIM, José Maria. Governo eletrônico no Brasil: o portal rede governo. In:
Arquivística, Rio de Janeiro, v.3, n.1, p. 28-37, jan./jun.2007. Disponível em
<http://www.egov.ufsc.br/portal/conteudo/governo-eletrônico-no-brasil-o-portal-rede-
governo>. Acesso em 31 mar. 15.
JENKINS, Henry. Cultura da convergência. São Paulo: Aleph, 2009.
31
KRUG, Steve. Não Me Faça Pensar: Uma Abordagem de Bom Senso à Usabilidade
Mobile e na Web. 1. ed. Rio de Janeiro: Alta Books, 2014.
LEIBOVITCH, Marcio. UX e os modismos. Disponível em
<http://marciokl.com/2013/10/20/ux-e-os-modismos/>. Acesso em 01 abr. 15.
LYNCH, Patrick; HORTON, Sarah. Guia de Estilo da Web: Princípios básicos de
design para a criação de websites. 2. ed. Barcelona: Gustavo Gili, 2004.
MARINS, Beatriz. Cooperação e controle na rede: um estudo de caso do website
Slashdot.org. In: XXIX CONGRESSO BRASILEIRO DE CIÊNCIAS DA
COMUNICAÇÃO, 29., 2006, Brasília. Anais eletrônicos... São Paulo: INTERCOM,
2006. Disponível em
<http://www.intercom.org.br/papers/nacionais/2006/resumos/R0530-1.pdf>. Acesso em
31 mar. 15.
MATIOLA, Willian. Proposta de redesign do Twitter por Fred Nerby. Disponível em
<http://chocoladesign.com/proposta-de-redesign-do-twitter>. Acesso em 01 abr. 15.
PACHECO, Andrea. UX em Portal vs. UX em Agência: ChocoDrops com Alexandre
Nigri (Globo.com e Ogilvy). Disponível em <http://chocoladesign.com/ux-em-portal-
vs-ux-em-agencia>. Acesso em 01 abr. 15.
________________. 05 Inspirações de UI para aprimorar o UXD em seu
site. Disponível em <http://chocoladesign.com/05-inspiracoes-de-ui-para-aprimorar-o-
uxd-em-seu-site>. Acesso em 01 abr. 15.
________________. Como projetar um site responsivo? Padrões responsivos de
layout. Disponível em <http://chocoladesign.com/como-projetar-um-site-responsivo>.
Acesso em 01 abr. 15.
PREECE, Jennifer. Design de Interação: Além da Interação Homem-Computador. 3.
ed. Porto Alegre: Bookman, 2013.
PRIMO, Alex. Interação Mútua e Interação reativa: Uma proposta de estudo. Revista
FAMECOS, Porto Alegre, jun. 2000. p. 81-92.
READINS, Tom. Why can't universities do UX?. Disponível em
<https://medium.com/@tomreadings/why-can-t-universities-do-ux-4fb9232a3afd>.
Acesso em 01 abr. 15.
SALIMEN, Samuel; RAMOS, Clériston. Avaliação da usabilidade dos sítios das
universidades federais do extremo sul do Brasil. In: Múltiplos Olhares em Ciência da
Informação, v.1, n.2, out. 2011. Disponível em
32
<http://portaldeperiodicos.eci.ufmg.br/index.php/moci/article/view/1445>. Acesso em
31 mar. 15.
SIEGEL, David. Criando Sites Arrasadores na Web III: A Arte da Terceira Geração
em Design de Sites. 2. ed. São Paulo: Market Books, 1999.
SILVA, Patrícia; DIAS, Guilherme. A arquitetura da informação centrada no usuário:
Estudo do website da Biblioteca Virtual em Saúde (BVS). Encontros Bibli: Revista
Eletrônica de Biblioteconomia e Ciência da Informação, Florianópolis, v. 13, n. 26, 2008.
Disponível em <http://www.brapci.inf.br/article.php?dd0=0000005149>. Acesso em 31
mar. 15.
STONES, Rodney. Famosas leis aplicadas à Experiência do Usuário. Disponível em
<http://www.uxdesign.blog.br/user-experience/famosas-leis-na-experiencia-do-
usuario/>. Acesso em 01 abr. 15.
UX BOOTCAMP IED, 2016, Rio de Janeiro. Entendendo o contexto. Rio de Janeiro:
HUGE Inc., jan. 2016.
____________________. Pesquisa com usuários. Rio de Janeiro: HUGE Inc., jan. 2016.
____________________. Arquitetura de Informação. Rio de Janeiro: HUGE Inc., jan.
2016.
____________________. Documento de Visão. Rio de Janeiro: HUGE Inc., jan. 2016.
____________________. Design Concepts. Rio de Janeiro: HUGE Inc., jan. 2016.
VAN AMSTEL, Frederick. Design Centrado no Usuário para o Website da
Universidade Federal do Paraná. Curitiba: UFPR, 2004. Disponível em
<http://www.usabilidoido.com.br/arquivos/projeto_tcc_portal_ufpr.pdf>. Acesso em 31
mar. 15.
_____________________. Afinal, o que é Design de Interação?. Disponível em
<http://www.usabilidoido.com.br/afinal_o_que_e_design_de_interacao.html>. 2006.
Acesso em 01 abr. 15.
Xerox e Lisa: Interfaces gráficas do usuário. [S.I.:s.n.s.d.].
33
11. ANEXO I - LISTA DE UNIVERSIDADES PESQUISADAS
Universidades públicas
Universidade de São Paulo (USP) — www.usp.br
Universidade do Estado do Rio de Janeiro (UERJ) — www.uerj.br
Universidade Federal de Alfenas (UNIFAL-MG) — www.unifal-mg.edu.br
Universidade Federal de Itajubá (UNIFEI) — www.unifei.edu.br
Universidade Federal de Juiz de Fora (UFJF) — www.ufjf.br
Universidade Federal de Lavras (UFLA) — www.ufla.br
Universidade Federal de Minas Gerais (UFMG) — www.ufmg.br
Universidade Federal de Ouro Preto (UFOP) — www.ufop.br
Universidade Federal de São Carlos (UFSCar) — www.ufscar.br
Universidade Federal de São João del-Rei (UFSJ) — www.ufsj.edu.br
Universidade Federal de São Paulo (UNIFESP) — www.unifesp.br
Universidade Federal de Uberlândia (UFU) — www.ufu.br
Universidade Federal de Viçosa (UFV) — www.ufv.br
Universidade Federal do ABC (UFABC) – www.ufabc.edu.br
Universidade Federal do Espírito Santo (UFES) – www.ufes.br
Universidade Federal do Estado do Rio de Janeiro (UNIRIO) – www.unirio.br
Universidade Federal do Rio de Janeiro (UFRJ) – www.ufrj.br
Universidade Federal do Triângulo Mineiro (UFTM) – www.uftm.edu.br
Universidade Federal dos Vales do Jequitinhonha e Mucuri (UFVJM) —
www.ufvjm.edu.br
Universidade Federal Rural do Rio de Janeiro (UFRRJ) — http://portal.ufrrj.br
Universidades privadas
Centro Universitario Augusto Motta (UNISUAM) — www.unisuam.edu.br
Centro Universitario Carioca (UNICARIOCA) — www.unicarioca.edu.br
Faculdade Casper Líbero (FCL) – www.casperlibero.edu.br
Faculdades Integradas Hélio Alonso (FACHA) — www.facha.edu.br
Fundação Armando Alvares Penteado (FAAP) — www.faap.br
Pontifícia Universidade Católica do Rio de Janeiro (PUC-Rio) — www.puc-rio.br
Pontifícia Universidade Católica de São Paulo (PUC-SP) — www.pucsp.br
Universidade Anhembi Morumbi — http://portal.anhembi.br
Universidade Castelo Branco (UCB) — www.castelobranco.br
34
Universidade do Grande Rio (UNIGRANRIO) — www.unigranrio.br
Universidade Estácio de Sá (UNESA) — http://portal.estacio.br
Universidade Metodista de São Paulo — http://portal.metodista.br
Universidade Presbiteriana Mackenzie (Mackenzie)— http://portal.mackenzie.br
Universidade Veiga de Almeida (UVA) — www.uva.br
35
12. CURRÍCULO
Caio Vinicius de Macedo Goes trabalha na Superintendência de Relações
Internacionais da UFF como Estagiário de Comunicação, no Vitamina UFF como
Voluntário de Criação Digital e na Pró-Reitoria de Extensão da UFF como Bolsista de
Diagramação. Ingressou na UFF em Comunicação Social – Publicidade e Propaganda em
2012 possuindo, também, formação técnica em Edificações (pela Fundação de Apoio à
Escola Técnica) e em Empreendedorismo e Inovação (pela UFF).
Com experiência acadêmica nas áreas de branding, gestão de marcas, design
gráfico, comunicação visual e comunicação integrada, possui artigos em congressos e
prêmios regionais e nacionais em projetos de Comunicação Integrada e Design Gráfico.
Através do Vitamina UFF trabalhou desenvolvendo projetos na UFF e trabalhos junto à
Marinha do Brasil, reconhecidos nacionalmente pelos resultados e pelos efeitos
repercutidos a longo prazo.