DANIARA REGINA CITADIN
REDESIGN DE INTERFACE DE LANDING PAGE
Florianópolis 2017
DANIARA REGINA CITADIN
REDESIGN DE INTERFACE DE LANDING PAGE: UM ESTUDO DE CASO DO SITE SIENGE
Trabalho de Conclusão de Curso apresentado ao Curso de Design da Universidade do Sul de Santa Catarina como requisito parcial à obtenção do título de graduado em design.
Orientador: Prof.Cláudio Silva.
Florianópolis 2017
DANIARA REGINA CITADIN
REDESIGN DE INTERFACE DE LANDING PAGE: UM ESTUDO DE CASO DO SITE SIENGE
Este Trabalho de Conclusão de Curso foi julgado adequado à obtenção do título de graduado em design e aprovado em sua forma final pelo Curso de Design da Universidade do Sul de Santa Catarina.
Cidade, (dia) de (mês) de (ano da defesa).
______________________________________________________ Professor e orientador Nome do Professor, Dr.
Universidade do Sul de Santa Catarina
______________________________________________________ Prof. Nome do Professor, Dr./Ms./Bel./Lic
Universidade do Sul de Santa Catarina
______________________________________________________ Prof. Nome do Professor, Dr./Ms./Bel./Lic
RESUMO
Em meio a um mercado competitivo no mundo digital, unir as estratégias de negócio e os fundamentos e a empatia do design são fundamentais. Segundo Royo (2008) um site é praticamente um produto da empresa também, visto que é a porta de entrada do negócio e tem uma importância fundamental na jornada do usuário e na experiência como um todo. Portanto, olhar para um site como sendo algo dinâmico e não mais estático norteia a ideia de otimização de páginas e elementos em busca de melhores resultados.
Sendo assim o estudo realizado teve como objetivo promover o redesign de interface da langing page de demonstração do Sienge, o Software de Gestão da Indústria da Construção. Buscando melhorar os resultados das métricas definidas junto a experiência do usuário.
Os objetivos específicos são compreender os elementos que compõe a experiência do usuário em uma interface, como: arquitetura da informação, usabilidade, design de interação, Gestalt e neuro webdesign aplicados à interface. Entender e descrever o comportamento do usuário no seu fluxo atual de navegação e interação com a página. E a identificação dos problemas de design na interface atual para que se consiga ter, com base em dados qualitativos e quantitativos, soluções a serem implementadas e testadas. Tendo como resultado quantitativo o aumento do engajamento da página e a taxa de conversão e qualitativo uma melhoria em usabilidade, arquitetura da informação e interface visual.
Para conseguir atender estes objetivos, foi utilizado a metodologia Lean
UX, uma metodologia que uni as necessidades de um profissional alinhado aos
objetivos da empresa com uma cultura ágil, as experimentações rápidas que gerem aprendizados e pensamento e processo de design thinking para criar soluções. A metodologia parte da criação de hipóteses embasadas através de pesquisas quantitativas e qualitativas, depois a criação da solução de interface baseada nestas hipóteses que tenham mais impacto nos resultados para assim rodar testes entre a nova interface e a interface antiga, e por fim, análises e feedbacks de usuários para entender se a solução foi efetiva, se os objetivos foram alcançados e o que se aprendeu com essa experimentação e quanto ao comportamento dos usuários.
Os resultados obtidos neste estudo foram bastante satisfatórios por atender os objetivos definidos e por unir as necessidades identificadas dos usuários com as necessidades do negócio que visa o aumento do número de vendas. Sendo assim, a solução desenvolvida impacta positivamente para mais e melhores leads no processo de vendas. Com a realização de testes de usabilidade, testes de compreensão e análise heurística, os usuários afirmaram a melhoria tanto de usabilidade no preenchimento do formulário da página quanto na experiência que tiveram com a interface em geral. Muito mais confiantes e seguros do que deviam fazer. E quanto a taxa de conversão, que é uma métrica fundamental em marketing digital e processo de vendas, a melhoria também foi bastante significativa e este resultado foi visível através de testes A/B e melhorias contínuas de acordo com os feedbacks dos usuários.
Portanto, este estudo conseguiu ser eficiente nos resultados da empresa e respeitando as necessidades dos usuários que muitas vezes acabam sendo ignoradas ou tratadas sem pesquisa e empatia no ambiente profissional. Mostrou também como o designer tem essa responsabilidade de manter o equilíbrio e apresentar soluções que prevaleçam os dois lados resultando em soluções centradas no usuário.
Palavras-chave: Web design. Design de Experiência. Neuro webdesign . Landing page, Taxa de Conversão.
LISTA DE ILUSTRAÇÕES
Figura 1 – Crescimento do PIB Brasileiro ... 14
Figura 2 – Ciclo Lean UX ... 20
Figura 3 – Ciclo Lean UX com entregáveis ... 21
Figura 4 – Anatomia de uma página web ... 23
Figura 5 – Funil de marketing digital ... 28
Figura 6 – Disciplinas necessárias para otimização de sites ... 30
Figura 7 – Conceito de Arquitetura da Informação ... 35
Figura 8 – Os 3 círculos da Arquitetura da Informação ... 37
Figura 9 – 4 comuns necessidades do usuário ... 41
Figura 10 – Modelo “berry-picking” sobre o caminho como nossa mente trabalha ... 42
Figura 11 – Entregáveis da Arquitetura da Informação ... 43
Figura 12 – Exemplo de Rotulação de Cabeçalhos ... 44
Figura 13 – Sistemas de navegação global, local e contextual ... 45
Figura 14 – Diferença de leitura das páginas ... 50
Figura 15 – Como um campo de formulário deve ser ... 52
Figura 16 – Melhores práticas de abordagem de testes traduzida pelo aluno ... 54
Figura 17 – Site não adaptado para diferentes dispositivos ... 56
Figura 18 – Site adaptado para diferentes dispositivos ... 57
Figura 19 – Taxa de conversão por dispositivo ... 58
Figura 20 – Exemplo de grid adaptado em diferentes dispositivos ... 60
Figura 21 – Relação de colunas do grid responsivo ... 60
Figura 22 – À esquerda sem adaptação e à direita com max-width aplicado ... 61
Figura 23 – Imagem preencheendo toda a largura da coluna ... 62
Figura 24 – Exemplo de Reitificação ... 67
Figura 25 – Exemplo de Emergência ... 68
Figura 26 – Exemplo de Similariedade ... 69
Figura 27 – Ciclo de desenvolvimento do projeto ... 71
Figura 28 – Página de Demonstração do Software Sienge versão desktop ... 73
Figura 29 – Página de Demonstração adaptado para dispositivo móvel ... 74
Figura 30 – Principais números da página de demonstração ... 75
Figura 31 – Quadro de origem dos acessos... 76
Figura 33 – Página inicial do Sienge ... 78
Figura 34 – Mapas de calor de clique e movimentação de mouse ... 79
Figura 35 – Mapas de calor de clique e scroll em dispositivos móveis ... 80
Figura 36 – Persona gerente financeiro ... 81
Figura 37 – Persona proprietário de construtora ou incorporadora ... 82
Figura 38 – Geração de alternativas para a página mobile ... 86
Figura 39 – Geração de alternativas para a página desktop ... 88
Figura 40 – Wireframes escolhidos ... 89
Figura 41 – Protótipos escolhidos ... 90
Figura 42 – Paleta de cores dos elementos visuais da página e planos de fundo .... 91
Figura 43 – Paleta de cores da tipografia da página ... 91
Figura 44 – Família de fontes utilizadas: Lato e Open Sans ... 92
Figura 45 – Mapa de movimentação de mouse na nova página ... 94
Figura 46 – Layout modificado após testes de compreensão e análise heurística.... 96
Figura 47 – Resultados do teste de usabilidade ... 98
Figura 48 – Resultados do teste A/B ... 100
SUMÁRIO 1 TEMA ... 12 1.1 DELIMITICAÇÃO DO TEMA ... 12 1.2 PROBLEMA ... 12 1.3 PROBLEMÁTICA... 12 1.4 OBJETIVOS ... 15 1.4.1 Objetivo geral ... 15 1.4.2 Objetivos específicos ... 15 1.5 JUSTIFICATIVA... 16 1.6 DELIMITAÇÃO DO TRABALHO ... 18 1.7 METODOLOGIA DE PESQUISA ... 19 2 WEBDESIGN ... 22 2.1 DESIGN DIGITAL ... 24 2.1.1 CIBERESPAÇO ... 26
2.2 WEBDESIGN E MARKETING DIGITAL ... 27
2.3 LANDING PAGE ... 28
2.3.1 Otimização de sites ... 29
3 DESIGN DE EXPERIÊNCIA DO USUÁRIO ... 33
3.1 ARQUITETURA DA INFORMAÇÃO ... 33
3.1.1 Aplicação da Arquitetura da Informação ... 36
3.1.2 Organização de sistemas ... 42
3.2 DESIGN DE INTERAÇÃO ... 45
3.2.1 Aspectos de um bom design de interação ... 47
3.3 USABILIDADE ... 49 3.3.1 Formulários ... 51 3.3.2 Teste de usabilidade ... 52 3.4 DESIGN RESPONSIVO ... 55 3.4.1 Grid Flexível ... 59 3.4.2 Imagens flexíveis... 61
4 NEURO WEB DESIGN ... 64
4.1 EMOÇÃO E MEMÓRIA ... 64
4.2 PROCESSAMENTO DE INFORMAÇÕES ... 65
4.3 ELEMENTOS DA GESTALT ... 67
4.3.1 Reificação ... 67
4.3.2 Emergência ... 68
4.3.3 Similariedade ... 68
5 DESENVOLVIMENTO ... 70
5.1 PESQUISA COM EQUIPE DE PRÉ-VENDAS ... 71
5.2 ANÁLISE QUANTITATIVA ... 72
5.2.1 Fluxo do usuário ... 76
5.3 ANÁLISE QUALITATIVA ... 78
5.3.1 Mapa de calor de cliques e movimentação de mouse em dispositivo desktop... 79
5.3.2 Mapa de calor de cliques e scroll em dispositivo móvel ... 79
5.4 PERSONAS ... 80
5.5 HIPÓTESES SINTETIZADAS ... 82
5.6 BRAINSTORM ... 83
5.6.1 Síntese do brainstorm ... 83
5.7 DEFINIÇÃO DE KEY PERFORMANCE INDICATORS (KPIS) ... 84
5.8 GERAÇÃO DE ALTERNATIVAS ... 85
5.9 WIREFRAME E PROTÓTIPO ... 89
5.10PALETA DE CORES E TIPOGRAFIA ... 91
5.11TESTE A/B ... 92
5.12ANÁLISE HEURÍSTICA ... 93
5.13TESTE DE COMPREENSÃO ... 94
5.14TESTE DE USABILIDADE ... 97
5.15SÍNTESE DOS RESULTADOS OBTIDOS ... 99
6 CONCLUSÃO ... 102
REFERÊNCIAS ... 104
APÊNDICES ... 107
APÊNDICA A – BRAINSTORM ... 108
APÊNDICE B – DOCUMENTO DO TESTE DE COMPREENSÃO ... 109
APÊNDICE C – DOCUMENTO DO TESTE DE USABILIDADE ... 112
APÊNDICE D – ANÁLISE HEURÍSTICA TATIANA ... 114
1 TEMA
Redesign de interface de landing page. 1.1 DELIMITICAÇÃO DO TEMA
Redesign de interface da landing page do site Sienge (www.sienge.com.br/demonstracao/) através do design de experiência do usuário para aumento de taxa de conversão.
1.2 PROBLEMA
Como aumentar a taxa de conversão de leads1 na landing page do site Sienge através do design de experiência do usuário?
1.3 PROBLEMÁTICA
Atualmente existe uma quantidade muito grande de informações disponíveis no mundo digital e isso torna mais difícil nos comunicarmos com nosso receptor. Além disso é muito clara a expansão do mercado no meio online. Em pesquisa realizada pela ComScore (2015), 94% dos internautas dizem fazer compras online no Brasil. Sendo assim, para vender mais, custa cada vez mais caro para os publicitários que criam anúncios na intenção de atrair a atenção dos consumidores. (ROIO, 2008, p11.).
O marketing digital vem sendo amplamente utilizado como estratégia de geração de receita. Seja com sites de e-commerce, serviços online, divulgação de portfólio, como também para sites de conteúdo, como blogs e jornais eletrônicos que hoje disputam por número de acessos. Para se ter ideia do crescimento deste novo formato de vendas, pesquisas realizadas pela Accenture (2014), empresa de
1 Uma definição comum de lead é de um usuário que tem o interesse e a autoridade para fazer uma
compra de você. Isso é diferente de apenas um contato, que não é nada mais do que o nome de uma pessoa ou endereço de e-mail. Sem mais informações de qualificação, você não tem ideia se esse contato tem o interesse ou autoridade para fazer uma compra. Enquanto que a taxa de conversão é a quantidade leads gerados em uma página dividida pela quantidade de usuários que acessaram a página. (MILLER, 2012, p.20)
outsourcing e consultoria de gestão, afirmam que em 5 anos os investimentos no
setor aumentarão em até 75%. E considerando a grande concorrência que vem surgindo, ser referência requer estratégia, conhecimento de mercado e valorização do design para através de interfaces digitais atrair o público ideal e conduzi-los a venda. Um outro dado da Dinamize (2016) que afirma que 71% dos-consumidores fizeram alguma compra depois de ter recebido mensagem de e-mail marketing.
E considerando esse crescimento de presença de empresas online, um ponto que se destaca é a experiência que o usuário tem nas interfaces. Visto que hoje as pessoas navegam em uma quantidade muito maior de sites, assim como afirma Nielsen (2012) que o usuário que acessa o um determinado site, passa a maior do tempo acessando outros e comparando as experiências de navegação.
Segmentando o mercado e focando na Indústria da Construção Civil o cenário que vemos é que com a crise atual as construtoras estão sofrendo por falta de créditos do governo para realizar obras. E os consumidores também estão sem créditos para comprar os imóveis, o que diminui a demanda e consequentemente a oferta deste mercado. Até o então as expectativas seriam baixas para este setor até que se tenha uma recuperação do PIB brasileiro para retomar investimentos na construção. Mas, mesmo com as expectativas baixas, muitas empresas estão optando por produtos que se apresentem como verdadeiras soluções para conseguir crescer pois entendem que este momento atual é promissor, ao contrário do que a maioria acredita. No mercado da Construção Civil isto é afirmado quando 48% das pessoas respondem que querem estruturar sua empresa para crescer no site do Sienge, ERP de Construção Civil desenvolvido pela empresa Softplan. Sendo reduzir custos a segunda opção mais falada. Indo mais afundo, o economista Ricardo Amorim (2016) diz em entrevista que o pior momento de crise já passou e que se analisarmos o quadro econômico dos últimos 100 anos visualizaremos que após o pior momento de crise, o país tem um crescimento do PIB de até 6% ao ano em um período de 2 a 3 anos, mostrado em imagem abaixo. Ricardo afirma também que com essa melhora, o setor de construção será um dos primeiros a se recuperar fortemente, pois o crédito voltará a ser liberado e principalmente a confiança dos consumidores crescerá.
Figura 1 – Crescimento do PIB Brasileiro
Fonte: RICAM Consultoria, 2015.
Dentro desse contexto, o Sienge é um software voltado para gestão de Construtoras e Incorporadoras que atua no mercado há 26 anos. Integra todas as áreas de uma empresa atuando desde os setores administrativos até os setores da obra. Assim como outras empresas que oferecem soluções de gestão para a Indústria da Construção, o Sienge investe e aplica marketing digital no seu processo de vendas. Atualmente o site comercial do Sienge possui um grande número de páginas web ativas volume de tráfego no site, a dificuldade encontrada está justamente na conversão2 de usuários em uma determinada página (www.sienge.com.br/demonstracao/) que é responsável por um número impactante de vendas do software. Nesta página o usuário preenche o formulário de contato com suas informações para requisitar uma demonstração do software, que é basicamente uma apresentação presencial ou remota do mesmo. Posteriormente
2 A ação de conversão é quando o usuário realiza uma ação determinada na página, como por
estes leads são transformados em oportunidades de vendas para dar continuidade à jornada de compras.
E compreendendo a realidade da Indústria da Construção e a concorrência crescente aplicando marketing digital, através do design e da empatia praticada com os usuários, é possível entender quais os problemas da página atual para fazer um redesign da mesma focando em ter um aumento de usuários que preenchem o formulário e pedem um contato de venda para mais informações. Aqui é onde experiência do usuário e todas as disciplinas que este conceito abrange junta-se ao objetivo de negócio, que no marketing digital é a taxa de conversão entre visitantes a leads, que seriam os visitantes que mostraram, através de alguma interação enviando informações, interesse pelo produto.
1.4 OBJETIVOS
1.4.1 Objetivo geral
Promover o redesign de interface na landing page do site comercial do Sienge, Software de Gestão da Indústria da Construção.
1.4.2 Objetivos específicos
a) Compreender elementos de design como arquitetura da informação, usabilidade e neuro webdesign aplicados à interface;
b) Descrever o comportamento do usuário acerca da interação com a interface;
c) Identificar os problemas de design da página atual;
d) Propor soluções de melhorias para a página com base nas informações analisadas;
e) Implementar e testar as alterações de elementos de design nas landing
1.5 JUSTIFICATIVA
O entendimento da performance de um site se tornou importante a partir do momento em que se compreendeu que um site não é mais estático e sim dinâmico. Ao olhar para a concorrência, as novas tecnologias de pesquisa, os novos comportamentos das pessoas com o mundo online nos mais diferentes dispositivos, vê-se a necessidade de sempre buscar a melhor experiência para que o usuário consigo realizar seus objetivos alinhados com os objetivos do designer através da interface digital.
As landing pages, são páginas que possuem um objetivo bem específico em um site. Diferente da página inicial, a página sobre a empresa, ou páginas de produtos, elas se diferem por influenciarem que o usuário tenha uma única ação naquela página. Seja baixar um ebook de conteúdo sobre o produto ou sobre a área de negócio para capturar leads, sejam webinars gratuitos e divulgados por email, blogs de conteúdo, entre outros. Para cada uma dessas ações, desenvolve-se uma página de destino (landing page) com o objetivo de atrair visitantes e transformá-los em leads. Em suma, estas páginas são então portas de entrada para um site.
O projeto e o estudo de aumentar a taxa de conversão, são interessantes e inovadores para a comunidade de tecnologia e a própria área de design digital. Isto porque envolve assuntos com base no marketing e neuromarketing, análise de dados e na psicologia cognitiva, servindo assim como ponte de estudo para outras áreas que trabalham também com foco em marketing digital e comportamento do usuário. Dentro do design digital, aborda inúmeros assuntos e elementos que se mostram cada vez mais importantes para estratégias de negócios de produtos digitais. Como a arquitetura da informação com o fluxo de navegação do usuário, design de interação com a interatividade entre interface, os dados e o que posteriormente será apresentado aos visitantes; a codificação baseada em mecanismos de pesquisas definidos para atrair acesso orgânico (acesso via pesquisa no Google, Yahoo, Bing, etc.), tipografia, elementos da Gestalt que afetam diretamente o comportamento e a interpretação que o usuário fará da página e usabilidade. Tudo sendo englobado e resultando em um conjunto que se preocupa com a experiência do usuário e a estratégia de negócios para geração de mais e melhores vendas. E segundo Rich Pages (2006, p. 16), embora seja muito importante otimizar as taxas de conversão, isto não é tudo, porque pode-se
aumentar a taxa de conversão de muitas maneiras, mas nem sempre significa que os visitantes do site terão uma experiência melhor e isto gera um problema de design quando compreende-se que é necessário também uma otimização de site. Onde se “coloca maior ênfase em testes no site através de melhorias de usabilidade e perspectiva do visitante, além de testar e melhorar as taxas de conversão e métricas de sucesso” (PAGES, 2016, p. 16).
Apesar de ser um assunto que vem crescendo bastante em estudos e aplicações, no Brasil ainda não se tem muita informação acadêmica com base teórica na área de otimização de site através dos elementos da experiência do usuário. Pode ser considerado um estudo inovador por relacionar a função do design com métricas e resultados focados na indústria da construção civil. Pois as buscas realizadas demonstram que no Brasil o assunto de marketing digital ainda é focado em dicas mais básicas para melhorias, sem realização de estudos profundos sobre a responsabilidade do design nas taxas de conversão, ou seja, o design como resultado de negócio.
O estudo dos elementos que afetam o comportamento humano e suas ações em páginas web junto à análise de métricas de tráfego e performance de páginas em geral, são importantes por caracterizar o público-alvo definido pela empresa e desta forma trabalhar estrategicamente a estrutura e o conteúdo das páginas para o objetivo definido. Essa síntese e histórico de informações são também um enorme diferencial no mercado competitivo atual que aplica marketing digital.
Para a Softplan3, empresa desenvolvedora do Sienge, este projeto de redesign para aumento da taxa de conversão de leads será fundamental para o aumento de vendas e para dar um passo à frente da concorrência, que em pesquisas realizadas pelo setor de marketing, estão passando por redesign dos seus sites e a própria comunicação. Além disso, será um novo passo para o setor de marketing digital para implantação de novos testes em diversas outras páginas web, pois considerando que cada site possui comportamentos diferentes, a configuração da página dependerá das métricas coletadas, o acompanhamento das mesmas e
3 Softplan é uma empresa de Florianópolis – SC que desenvolve softwares de gestão de três
diferentes ramos. Um deles é a ramo da Construção Civil, cujo produto é o Sienge. O site comercial do Sienge será usado como base deste trabalho e aplicação dos estudos realizados.
estratégias de conteúdo para o público que se pretende atrair. Assim como afirma Benji Rabhan:
Cada empresa é única e cada caso de configuração é diferente. O que funciona para um site pode não funcionar para outro site. É extremamente raro encontrar alguma ideia de otimização de taxa de conversão que funcione em todo site. (RABHAN, 2016, p. 20).
Um outro ponto importante, é a qualificação dos leads para que se tornem potenciais clientes. Além de atrair o público certo para determinada página, as informações requisitadas aos usuários são também de grande importância para facilitar que as equipes seguintes consigam trabalha-los no processo de vendas. Então, o aumento da taxa de conversão preocupa-se também com a qualidade de leads coletados para que haja o aumento de vendas. No caso do Sienge, os leads necessitam ter um porte, um certo número de funcionários, condições financeiras e cargos de decisão para que prossigam no funil de vendas. E o design, tem como desafio manter uma boa taxa de conversão mantendo o número de informações requisitadas nos formulários. Ou seja, convencer o usuário de que tais informações são importantes e influenciá-lo a converter, através de contexto, estratégia de conteúdo, organização da informação, da interação e aplicação dos elementos visuais.
Pessoalmente, como estudante de design e profissional da área, este projeto foi um desafio. Porém de grande importância para criar habilidades e sintetizar um conhecimento em um assunto que está se tornando cada vez mais importante para as empresas e ao designer na entrega de resultados. Além de estudar e entender muito do comportamento humano e suas reações, que são base para um bom design, mas ainda não se estuda isoladamente no meio acadêmico. Um outro ponto importante no desenvolvimento do projeto é a metodologia ágil para
feedbacks rápidos e aprendizado constante sobre comportamento dos usuários.
1.6 DELIMITAÇÃO DO TRABALHO
O que foi realizado neste trabalho foi o redesign de interface da landing
page de demonstração do software Sienge que possui grande importância no
processo de vendas, com o objetivo de de melhorar a experiência do usuário e aumentar a taxa de conversão de visitantes da página que pedem um contato para
apresentação do software. Explorando elementos visuais e fundamentos do design voltados para o ambiente digital.
1.7 METODOLOGIA DE PESQUISA
A metodologia utilizada nesse estudo foi a Lean UX. Que segundo Gothelf (2013) foi criada a partir de uma filosofia de gestão que objetiva o máximo da produtividade através do mínimo de desperdício de tempo, recursos, processos, documentação e flexibilidade relativa entre clientes e equipe de desenvolvedores, para responder às mudanças e inovação contínuas, inerentes ao mercado e à própria tecnologia. Nessa metodologia, o foco é entregar o que realmente é desejado e esperado pelo usuário que é medida por pesquisas, iterações do processo e métricas de qualidade. Além disso, encoraja rascunhos e protótipos de baixa fidelidade, muitos feedbacks da equipe para que os múltiplos talentos possam ser complementares e ter assim rápidas validações. Abaixo é possível ver o processo cíclico do Lean UX:
Figura 2 – Ciclo Lean UX
Fonte: Livro Lean UX, 2013.
Nesta metodologia usa-se a experimentação e medição rápidas para aprender rapidamente se nossas ideias atendem os objetivos definidos, que é a base do Lean Startup, sobre aprender rapidamente com experimentações. E traz o pensamento de design para uma solução focada na solução de problemas (GOTHELF, SEIDEN, 2013, p.14).
Gothelf (2013) considera que perder muitas horas de entrevista (pesquisa de campo) antes de fazer pesquisas para validar as hipóteses levantadas seja desperdício de tempo, por isso incentive a criação de personas que representam os usuários que usam o produto/site. Quanto a fase de design do projeto, A filosofia Lean UX encoraja o crescimento mútuo através da troca de conhecimento em busca da melhor experiência do usuário ao interagir com o produto.
Os dois conceitos são então trabalhados em colaboração para trilhar um caminho mutável aos objetivos do produto. Através de ideias específicas, prototipagem, implementação e etapas de aprendizado, chegando assim a solução mais apropriada. Enquanto que uma influência da metodologia ágil, faz do Lean UX um ciclo que procura entregar soluções rapidamente aos clientes/usuários e que se ajusta regularmente a novos aprendizados com os passos mencionados anteriormente (idem).
Um dos fundamentos do Lean UX é envolver a equipe toda para gerar e validar soluções rapidamente. Isso acelera o processo de experimentação e é por isso que é cíclico, pois ao final, compartilha o aprendizado e faz entregas mais rápidas e de impacto (GOTHELF, SEIDEN, 2013, p.6).
Sendo assim, a afirmação de hipóteses são uma forma de expressas suposições em forma testável e começar o processo de desenvolvimento (GOTHELF, SEIDEN, 2013, p.22) Tim McCoy que é UX Estrategista da agência Cooper, referência em serviços centrado no usuário, adaptou o ciclo da Lean UX com as principais entregáveis possíveis de serem feitas em um projeto. A partir da definição das hipóteses e de acordo objetivos que se pretende atingir:
Figura 3 – Ciclo Lean UX com entregáveis
Fonte: Slide do Lean UX Intensive - Designer Edition, 2011.
Depois das hipóteses listadas e priorizadas pelo impacto que vão ter em cima do problema identificado, serão geradas de melhorias para a página que são sempre validadas rapidamente com o time de forma a ter diferentes pontos de vista e um desenvolvimento de interface mais assertivo (GOTHELF, SEIDEN, 2013, p.34).
E dessas ideias wireframes e protótipos são validados e escolhidos para desenvolver a interface e rodar em um teste A/B com a página atual. (GOTHELF, SEIDEN, 2013, p.47).
Com o teste A/B rodando, começa-se a ter feedback dos usuários quando às KPIs definidas no teste e também outras formas de pesquisa, como testes de usabilidade e análises heurísticas (GOTHELF, SEIDEN, 2013, p.70). Dessa forma, os feedbacks vão gerando novas hipóteses de melhorias e a interface vai sendo incrementada aos poucos até chegar nos objetivos definidos e também gera aprendizado que é compartilhado no time.
O diferencial da utilização da metodologia do Lean UX, é por ser uma metodologia dita por Gothelf e Seiden como sendo:
É a prática de trazer a verdadeira natureza de um produto para a luz mais rápido, de forma colaborativa e cruzada, que reduz a ênfase na documentação completa, ao mesmo tempo que aumenta o foco na construção de uma compreensão compartilhada da experiência real do produto que está sendo projeto (GOTHELF, SEIDEN, 2013, P.7, tradução nossa).
2 WEBDESIGN
Um site é uma coleção de páginas de informações. Cada página de um site é salva no formato HTML que é o padrão para Hypertext Markup Language. Nome dado para “o caminho em que nos movemos entre as páginas web clicando em links” (SCHIFREEN, 2009, p. 14, tradução nossa). E quanto a definição de HTML, Elis e Ferreira (2012) definem como “uma linguagem para publicação de conteúdo (texto, imagem, vídeo, áudio e etc) para a Web” (ELIS, FERREIRA, 2012, p.25).
Já os autores Morville e Rosenfeld (2006) definem que a web é uma ferramenta de comunicação, e que a comunicação é construída de palavras e sentenças tentando transmitir significado. E segundo Elis e Ferreira (2012), a Web foi criada para compartilhar informação com pessoas do mundo inteiro, de forma rápida e dinâmica. E esse, desde o início, foi o seu objetivo.
O processo de criação de sites é chamado de web design e aborda todos os aspectos visuais da interface, como esquema de cores, imagens, logotipos, tipografia, links e botões, e qualquer outra coisa que se possa ver. A web em si, é um meio visual e por isso o design é uma parte muito importante da criação de interfaces bem-sucedidas, que são mais do que bem estruturadas e desenhadas, são envolventes e eficazes. Além de criar uma boa experiência para o visitante, é essencial que o site atenda aos objetivos de negócio definidos pela empresa (STOKES, 2009, p.135).
Uma boa interface de site basicamente entrega o que o usuário procura, de forma fácil e agradável junto aos objetivos de negócio, agregando aqui conceitos de usabilidade e arquitetura da informação. Sendo assim, segundo Stokes (2009), o site é constituído pelos elementos de:
a) Navegação: que é sinalização do site, indicando aos usuários onde eles estão e onde podem ir (STOKES, 2009, p.135);
b) Layout: estruturação e exibição do produto (idem);
c) Cabeçalho: a parte consistente interior de uma página (idem); d) Rodapé: a parte consistente inferior da página (idem);
Figura 4 – Anatomia de uma página web
Fonte: The Principles of Beautiful Design, Jason Beaird.
O princípio fundamental de um bom desenvolvimento de site é entender os usuários, o que se relaciona com o que é dito sobre os sites em geral e pesquisas de usuário realizadas anteriormente. Perguntando-se sobre o público que usa e interage com seu site: O que eles estão procurando? Quais são seus objetivos? (STOKES, 2009, p.134). Além disso, Ryan e Jones (2009) também afirmam que na estratégia de um site também é importante esclarecer os objetivos corretos desde o início.
Em questão de mercado, com a maturidade da web o número de dispositivos que acessam o meio digital vem crescendo exponencialmente e assim os trabalhos dos web designers e desenvolvedores tem se tornado mais complicado, afirma Robbins (2012). A web está nos dispositivos atuais como smartphones,
tablets, TVs e mais. A autora também afirma que nunca teve tanta oportunidade de
colocar as habilidades do web design em prática (ROBBINS, 2012, p.3).
Segundo Stokes (apud KANG, 2013), o uso de Internet Móvel tem crescido drasticamente nos últimos anos e de acordo com o The Washington Post, continuará crescendo em torno de 66% a cada ano em todo o mundo. Com esta afirmação, Stokes (2009) mostra a importância de adaptar sites para dispositivos móveis tanto como melhoria na experiência do usuário como estratégia de negócio
visto que afeta diretamente a percepção e o comportamento dos usuários sobre a página. Dependendo da audiência, esta adaptação pode ser feita exclusivamente em mobile, ou pode ser adaptada para todos os dispositivos com base no Design Responsivo.
Para Stokes (2009), as fases de construção de um site focado nas necessidades dos usuários, são:
a) Planejamento e pesquisa, onde busca-se entender o mercado, os usuários, competidores e o negócio (STOKES, 2009, p.156);
b) Escolha do domínio: que será a URL do site (idem);
c) Estratégia de Conteúdo: onde entra a arquitetura da informação definindo onde e qual conteúdo será apresentado e como será a navegação (idem);
d) Visibilidade para mecanismos de pesquisas: onde busca-se escrever e planejar a página de acordo com a otimização dos mecanismos de busca. Isto é extremamente importante porque está relacionado ao tráfego do site, sem ele, os usuários podem não chegar ao seu site via pesquisa no Google e outros buscadores (idem);
e) Design: transformação do wireframe4 em um layout (idem);
f) Desenvolvimento: que é a parte de codificação (HTML + CSS) da página para colocá-la no ar (idem);
g) Teste e lançamento: testar é importante para entender o comportamento da página em diferentes navegadores, se os links estão corretos e o conteúdo também (idem).
2.1 DESIGN DIGITAL
A evolução tecnológica nos leva em direção a um espaço onde o usuário requer, sempre com maior insistência ferramentas específicas para realizar ações da mesma forma como faz no mundo que conhecia até agora, mas com novas especificações e características. Hoje as atividades realizadas no meio online expandiram para muito atém da leitura, usamos também para conversar em chats, navegarmos nos mais diferentes sites, utilizar serviços online e também fazer
4 Um esquema esquelético do layout de uma página da web, podendo ser pouco detalhado
compras em lojas virtuais. “O espaço plano da página Web desembocou na complexidade de um espaço conceitualmente tridimensional” (ROYO, 2008, p.20).
Em um projeto de design precisa-se considerar que nos movimentamos por um emaranhado de informações e espaços, de redes que se tocam e se cruzam. Lembrando que nossas mensagens vão conviver com milhares de outras mensagens e serão lidas em contextos que podemos não conhecer, pois as referências culturais dos leitores variam (ROYO, 2008, p.13).
O design digital tem como objetivo principal sanar o descontrole que o usuário sente por estar distante da máquina com a qual ele interage e colocar à disposição, ferramentas que o ajudem a sentir-se mais seguro e principalmente a conseguir os seus objetivos. Assim como afirma Royo, (2008) “Em suma, deixar perto o que está longe” (ROYO, 2008, p.28). Seguindo esta ideia, o usuário consome dois produtos diferentes e um bom exemplo disto é o usuário da Internet que procura por um livro para comprar e adquire não só o livro, mas também um catálogo de livros, que seria o dispositivo por meio do qual ele alcança o que busca. Isto porque diretrizes no design são baseadas na psicologia humana, sobre como pessoas percebem, aprendem, decidem, lembram e principalmente, como convertem intenções em ações (JOHNSON, 2010, p.10).
Porém, para nos aproximarmos da natureza do design digital, necessita-se de “um espaço de percepção definido, que é também um espaço cultural e um espaço comum” (ROYO, 2008, p.30). O que Royo (2009) conceitua como um novo espaço com características físicas e conceituais concretas: o ciberespaço, que é o espaço pelo qual navegamos, a matéria da internet.
Conhecendo este meio, podemos através do design, introduzir processos de inovação que adaptam o meio às novas necessidades e usos, pois assim como as inovações no ciberespaço são contínuas, as necessidades do usuário também evoluem constantemente. E esta evolução é consequência da evolução tecnológica, cultural e do design. Sendo assim, a linguagem é a matéria-prima para definir e habitar o ciberespaço, pois através dela nós construímos as informações a serem usadas (ROYO, 2008, p.40).
Se no futuro o usuário puder tocar, cheirar e saborear objetos na internet, o design digital sofrerá uma grande revolução, pois deverá reformular sua própria linguagem, estendendo-se aos outros sentidos que darão novos usos ao homem no ciberespaço. (ROYO, 2008, p.36)
2.1.1 CIBERESPAÇO
Segundo Saffer (2006) todas as interações acontecem em algum espaço, mesmo que esse espaço não seja claro, como no caso da internet, um espaço digital.
O autor compara as interações no meio web com os cafés da Starbucks ao afirmar que os sites não trabalham bem a profundidade, aspecto fundamental quando se fala em perspectiva e sobre criar uma ideia de movimento. Enquanto que nos cafés da Starbucks o espaço físico é bem utilizado separando a área de pedidos da área de atendimento, onde os clientes podem adicionar leite e açúcar, por exemplo. (SAFFER, 2006, p.46).
O ciberespaço se refere a um grupo de tecnologias diferentes e em níveis diferentes de desenvolvimento onde acontece a ação e interação do usuário. É neste espaço composto por bits que o design criará ferramentas e interfaces de comunicação (ROYO, 2008, p.22).
Já Lévy (1999), define ciberespaço como "o espaço de comunicação aberto pela interconexão mundial dos computadores e das memórias dos computadores" (LÉVY, 1999, p.85). Incluindo os conjuntos dos sistemas de comunicação eletrônicos, já que estes transmitem informações provenientes de fontes digitais ou destinadas à digitalização. O autor afirma que a codificação digital é a marca distintiva do ciberespaço, pois condiciona um caráter virtual da e em tempo real. Além disso, acredita que a perspectiva da digitalização geral das informações provavelmente “tornará o ciberespaço o principal canal de comunicação e suporte de memória da humanidade a partir do início do próximo século” (LÉVY, 1999, p.85).
É diferente dos outros meios em que o design atua por ser composto de bits que contêm informações, integrar códigos e ser navegável, ao contrário de por exemplo um livro, que é feito para ser lido (ROYO, 2008, p.25).
Com a internet e o ciberespaço aumentou muito a quantidade de informações que temos disponíveis. A evolução dos sites publicados e a quantidade de domínios ativos são demonstrações evidentes. Desta forma é preciso realizar serviços de metainformação, que é a informação da informação publicada para
ajudar os mecanismos de buscas com o objetivo de orientar o usuário segundo suas necessidades (ROYO, 2008, p.30).
Dade-Robertson (2011), afirma também que com essa quantidade de informações que estruturam o conteúdo das páginas e com o objetivo focado em tornar as páginas atraentes e utilizáveis, ocorreu a desorientação de quando se está tentando encontrar informações em um site particularmente complexo. E para resolver isto, surge um novo conceito que é a arquitetura da informação (DADE-ROBERTSON, 2011, p.13).
2.2 WEBDESIGN E MARKETING DIGITAL
Segundo Stokes (2009), sites são muitas vezes o coração do sucesso do marketing digital. Eles são nossa casa na web, uma vitrine da qual se tem total controle e que muitas vezes é o primeiro local encontram mais sobre o negócio da empresa. Ryan e Jones (2009) também concordam e dizem que “se você é um comerciante digital, seu site é o seu local de negócios”. Isto porque mesmo tendo todos os tipos de campanhas em locais do ciberespaço com objetivo de atração de novos clientes, os usuários voltarão através de um único ponto: o seu site.
Ryan e Jones (2009), afirmam que todas as técnicas de marketing digital têm uma coisa em comum: são projetadas para trazer um tráfego pré-qualificado para o site. Ou seja, trazer usuários que tenham as necessidades que a empresa pode solucionar. E o site é que converte esse tráfego em potenciais clientes ou mesmo clientes. Tomando os números e transformando em valor tangível para o negócio da empresa. Ash (2008) diz que dentro do Marketing Digital, o webdesign é muito importante nas suas fases de atração até a venda, como mostrado na figura 3, que são: Aquisição, que é a atividade focada em geração de mais tráfego para o site ou landing pages. O objetivo nesta fase é interessar o público-alvo com as soluções e produtos apresentados. Conversão, que se trata de persuadir os usuários até que façam uma determinada ação, como comprar. E retenção, que é a fase de relacionamento com o cliente. Essas etapas são ordenas e mostram que, para aumentar o lucro, aumentar o número de vendas, é necessário trabalhar uma boa aquisição e conversão (ASH, 2008, p.7).
Fonte: Landing Page Optimization, Tim Ash.
Segundo Pages (2012), o mundo de negócios online continua mudando. Já não são mais empresas apenas colocando dinheiro em criar o marketing dos seus sites e esperar por sucesso, pois muitas agora ficando cada vez mais experientes quando analisam e consequentemente, melhoram seus sites. E realça que, você pode ter o site mais bonito do mundo, ou mesmo pode ter um bom investimento em anúncios pagos, mas se os seus visitantes acham difícil de usar, se o site não supre suas necessidades ou mesmo não lhes ajuda a tomar uma ação, eles não retornarão - e é neste momento que um site concorrente pode ser acessado - (PAGES, 2012, p.38). “Pense no seu site principalmente como um mecanismo de conversão para o tráfego que chega através de todos os seus outros esforços de marketing digital” (RYAN, JONES, 2009, p.40, tradução nossa).
2.3 LANDING PAGE
O Stokes define landing page (página de destino) como uma página que o usuário acessa ao clicar em uma listagem orgânica de resultados de pesquisa, como
Google e Yahoo. São as páginas que têm maior sucesso e que combinam o máximo possível com a consulta de pesquisa do usuário (STOKES, 2009, p.135).
Segundo Ash (2008), uma landing page ou página de destino é o ponto no qual um visitante desembarca no site. E estas páginas podem não ter conexão com o site principal. Em outras situações, podem ser uma página específica dentro do site principal. Além disso, podem ser focadas em um tipo de audiência, já que podem ser promovidas através de canais como o email, anúncios de propaganda, e própria pesquisa no Google, que são canais mais controlados de tráfego. A partir disso, planeja-se as possibilidades de ações que se espera que os usuários tomem na página para alcançar um resultado. Seja este resultado cliques em botões que levem a outra página, ou o preenchimento de um formulário para entrar em contato com a empresa, ou mesmo fazer download de algum material que está sendo oferecido.
2.3.1 Otimização de sites
Rich Pages (2012) diz que a otimização de site é uma nova arte de testar e melhorar páginas web para maior engajamento e conversão dos visitantes, combinando e aplicando testes, análises, usabilidade e melhores práticas de marketing digital, como apresentado na figura 4, onde estão esquematizadas as habilidades e conhecimentos que compõe a otimização de um website. Contribuindo com este pensamento de ter atenção para a otimização, Tim Ash (2008) diz que “Os reais especialistas do design das suas landing pages são os seus visitantes” (ASH, 2010, p.24). E conclui afirmando que com alto volume de tráfego no site, análises estatísticas permitem encontrar hipóteses de melhorias para o site.
Ao público-alvo que se quer atender e converter, é preciso fornecer informações sobre negócios, produtos e serviços oferecidos pela empresa, porém sempre com os objetivos de conversão em mente, que estão diretamente ligados aos objetivos de negócio, que Ryan e Jones (2009) classificam como diretos ou indiretos, sendo diretos: pedidos online e vendas, formulários de consulta, inscrição para newsletter, etc. E indiretos: informações comerciais, construção de confiança e conteúdo para nutrição dos leads e visitas. Isto é importante porque a conversão é, segundo os autores, a chave principal para o sucesso do marketing digital. No
design, este sucesso surge por exemplo da experiência do usuário bem trabalhada e focada na conversão (RYAN, JONES, 2009, p.41).
Figura 6 – Disciplinas necessárias para otimização de sites
Fonte: Site Optimization: An hour for day, Rich Pages.
2.3.1.1 Taxa de conversão
Segundo Eisenberg (2006) por muito tempo a quantidade de acessos em um site foi a métrica mais valiosa nos negócios online, mas com o crescimento do mesmo, viu-se que enviar tráfego para um site não bem otimizado é o mesmo que “tentar encher um balde furado com água”.
O termo conversão é usado quando um visitante da landing page faz uma ação desejada que tem um valor mensurável para a empresa. Essa ação desejada e planejada, pode ser uma compra, um download, preenchimento de um formulário, ou mesmo simples cliques para outras páginas. O ponto principal é que esta ação deve ser rastreável e seu valor calculado ou estimado. Esta conversão pode ser medida
por número de visualizações na página, retorno de visitas e tempo gasto no seu site, ou também por interações com conteúdo. (ASH, 2008, p.14).
Já a taxa de conversão é a porcentagem de visitantes de um site ou landing
page que tomam uma ação desejada. Segundo Erisenberg (2006) é o valor em
porcentagem correspondente ao número de acessos totais em um site ou página dividido pelo número de visitantes que converteram. Por exemplo, se o tráfego total de uma página que contém um ebook para ser feito download for de 100 visitantes e apenas 10 visitantes fizeram o download, a taxa de conversão é de 10%. Esta ação de conversão tem este valor mensurável para a empresa. Essas taxas variam amplamente entre a concorrência e os setores de mercado (ASH, 2008, p.14).
Segundo a empresa Conversion Rate Experts termo que ganhou importância em 2007. E a partir de então, tornou-se uma KPI5 decisiva no mercado digital, a e-métrica fundamental, segundo Eisenberg (2006). Que também afirma que “Conhecer a sua taxa de conversão é viver sabendo a sua temperatura quando você está doente [...] Assim como a temperatura, a taxa de conversão permite que você saiba se você está quente ou frio, se a situação exige ação ou não”.
Reafirmando sobre a necessidade de conhecer o usuário, Ash (2008) questiona que se não se entende o usuário, não há como influenciá-los a converter com o design do site. E ressalta que as pessoas geralmente não tomam decisões racionais, mas sim pelas emoções e sentimentos instintivos. Ou seja, a tomada de decisão é intuitiva e emocional.
Além disso, o que ele destaca também é que dar ênfase em muitos itens de uma página Web pode destruir a habilidade dos visitantes de encontrar as informações que eles querem e também quebrar a tomada de decisão.
Outros pontos que ajudam no aumento da taxa de conversão, são por exemplo o tom do conteúdo que deve ir de acordo com os valores e crenças do visitante. Uma dica apontada pelo autor é usar imagens de pessoas, pois elas se identificam. Além disso, estar atento para cores de botões e texto para saber como usar o contraste a favor da conversão. (ASH, 2008, p.19).
5 KPIs são métricas específicas que sempre serão olhadas para determinar se as estratégias
executadas estão tendo resultado e indo de encontro com os objetivos estabelecidos. Por exemplo, para avaliar se uma planta está saudável,um jardineiro pode olhar para a sua taxa de crescimento, cores e aparência geral, sendo essas suas KPIs (STROKES, 2009, p. 28).
Uma outra disciplina interessante na busca por melhorias na taxa de conversão é o neuro webdesign, como afirma Berezhnaya (2016) em seu artigo sobre Conversion Rate Optimizarion. A autora afirma que aplicar técnicas de design persuasivo no subconsciente entram na metodologia de aumento de conversão.
Oli Gadner que escreveu o ebook sobre Design Direcionado para Atenção (2016) traz importância para se trabalhar a atenção de uma página e o quanto isto influencia o usuário. Segundo Garner, nossa carga cognitiva vai reduzindo com a quantidade de informações que temos de raciocinar e portanto perdemos também a capacidade de realizar decisões racionais. Portanto o conteúdo e a hierarquia da informação da página devem ser bem trabalhados e claros para o usuário (GARDNER, 2016, p.11).
3 DESIGN DE EXPERIÊNCIA DO USUÁRIO
Design de experiência é um conceito pouco tangível, portanto Stokes (2009) diz que as experiências são diferentes nos ambientes, como por exemplo um site e um mercado. Porém, o princípio é o mesmo, que é entregar uma ótima experiência aos usuários e fazer com que os objetivos determinados sejam facilmente alcançados por eles. Sendo assim, design de experiência é um processo de aplicar princípios, técnicas e destaques para criar e melhorar o comportamento de um usuário no site e também criar uma interação consistente entre o usuário e marca. Já Garret, define design de experiência como "a experiência que o produto cria para a pessoa que o usa no mundo real" (GARRET, 2011, p.6).
3.1 ARQUITETURA DA INFORMAÇÃO
Morville e Rosenfeld (2006) comparam a arquitetura na web com a arquitetura dos ambientes físicos dizendo que muitos arquitetos não habitam as estruturas que projetam e assim não entendem completamente as necessidades dos seus clientes e isto pode levar a decisões pobres. Além disso, as necessidades dos clientes também evoluem com o tempo, nisto deve-se buscar um equilíbrio da estabilidade e da flexibilidade (MORVILLE, ROSENFELD, 2006, p.3). No design para web essa questão de estabilidade é ainda mais discutida visto que o design precisa ser flexível o suficiente para acomodar futuras mudanças, tanto organizacionais quanto novas necessidades do projeto (PETERSSON, 2014, p.185).
Segundo Morville e Rosenfeld (2006), a Arquitetura da Informação ou AI, não possui uma definição única. Justamente pelo fato de ser difícil projetar bons sites por tratarem de desafios da linguagem e da representação, onde cada pessoa pode interpretar de uma forma. Além disso, a forma como as pessoas interagem com as páginas está bastante relacionada às suas experiências. Visto que somos emocionalmente engajados pelas estruturas físicas que experimentamos ao longo da vida.
Desta forma, definem em alguns pontos o que seria a Arquitetura da Informação:
Sendo informação o meio termo entre dado e conhecimento. Lidamos com informações de todas as formas e tamanhos: sites, documentos, aplicativos de software, imagens e muito mais (MORVILLE, ROSENFELD, 2006, p.5).
b) A combinação de sistemas de organização, rotulagem, pesquisa e navegação em interfaces digitais;
Onde a estruturação é a determinação dos níveis apropriados e importância das informações, além do relacionamento entre elas. A organização é o agrupamento destes componentes em categorias significativas e distintas. E rotulação busca descobrir como chamar estas categorias e os links de navegação que levam a eles. Este é o principal benefício da Arquitetura da Informação (idem).
c) A arte e a ciência de moldar produtos e experiências de informação para usabilidade e encontrabilidade (idem);
Na figura 5, Morville e Rosenfeld representam visualmente o conceito de Arquitetura da Informação e seu funcionamento.
Figura 7 – Conceito de Arquitetura da Informação
Fonte: Information Architecture for the World Wide Web, Morville e Rosenfeld.
A ciência, através de disciplinas de engenharia de usabilidade e etnografia, está ajudando a trazer o método científico para a análise e aplicação dos dados quanto às necessidades dos usuários e seus comportamentos na busca de informações. Assim, facilita o entendimento de padrões de uso para melhorias no site. Ao mesmo tempo, Morville e Rosenfeld (2006) enfatizam que a arquitetura da informação nunca será reduzida a números. Pois a arte é justamente assumir riscos e confiar em nossa intuição na hora de arquitetar a informação. (idem).
Estas definições são importantes porque na web as pessoas não seguem necessariamente progressões ordenadas ou lineares (como ao ler um livro, por exemplo). Elas podem navegar em diferentes níveis de informação sem seguir uma ordem hierárquica. (ASH, 2008, p.130).
Segundo Ash (2008), a navegação do site seguir os requisitos de: Ser fácil de entender (ASH, 2008, p.130)
Ser visível (idem)
Apoiar a tarefa do visitante (idem) Ser consistente em todo o site (idem) Usar rótulos claros e distintos (idem)
Fornecer contexto em todas as páginas do site (idem)
Ser tolerante com os erros, permitindo que os visitantes possam reverter facilmente suas ações (idem)
E por fim, além da Arquitetura da Informação ser importante para o sucesso de um site, para a realização de tarefas e experiência do usuário. Morville e Rosenfold (2006) também destacam a importância da AI no cálculo de ROI (Retorno sobre Investimento). Onde deve-se considerar pontos como: o custo de encontrar e não encontrar uma informação no site, o valor da construção do mesmo, o custo de manutenção, o próprio valor da marca, entre outros.
3.1.1 Aplicação da Arquitetura da Informação
Segundo Morville e Rosenfold (2006), a chave para uma boa da arquitetura da informação em entender como moldar sua mensagem para o seu público. Para isto, os autores dizem ser de extrema importância aprender tudo sobre os tipos de informação que as pessoas precisam, como elas usam, onde elas usam e como elas pensam sobre isso, ou seja, a relação entre contexto, conteúdo e usuário, como mostrado na figura 6. E Spencer (2010) afirma que este aprendizado ajuda a selecionar o conteúdo que eles precisam, certificando-se que é útil e fácil de entender, e também é organizado de uma forma que faça sentido.
Figura 8 – Os 3 círculos da Arquitetura da Informação
Fonte: Information Architecture for the World Wide Web, Morville e Rosenfeld.
3.1.1.1 Contexto
A Arquitetura da Informação deve ser adaptada de forma única a seus contextos. E isto é importante porque essa estrutura e o vocabulário do site são a conversação entre a empresa e seus clientes e funcionários, sendo assim, influencia a forma como eles pensam sobre seus produtos e serviços. Primeiro, precisa-se entender o contexto de negócios. Buscar respostas para entender o que o torna único e onde o negócio está hoje e onde pretende estar amanhã. Pois a ideia é alinhar a AI com os objetivos, a estratégia e a cultura do negócio (MORVILLE, ROSENFELD, 2006, p.26).
Além disso, Spencer também chama atenção para os próprios objetivos do projeto, que muitas vezes estão relacionados a aumentar as vendas, reduzir cursos ou mesmo ajudar as pessoas a tomar melhores decisões. Desta forma fica mais fácil também ao arquiteto da informação mostrar ao cliente como alcançarão os objetivos de negócio (SPENCER, 2010, p.42)
3.1.1.2 Conteúdo
O conteúdo é o material que compõe o site, é responsável por atender ao que as pessoas precisam para usar ou achar no site. E por mais que reconhecemos a web como ferramenta para realização de tarefas, serviços, plataformas de vendas
e compras e outros, a base está em ter conteúdo que os usuários devem estar aptos a encontrar (MORVILLE, ROSENFELD, 2006, p.27).
O conteúdo existe nos mais diversos formatos. Em um site pode-se encontrá-lo em forma de catálogo de produtos, reportes técnicos, vídeos de testemunhos ou de funcionários, documentos dos mais variados tipos, banco de dados e outros. Pensando nesta variedade, cada um possui uma estrutura, diferentes quantidades de texto, intenções e abordagem. Outro ponto importante na questão de conteúdo é a metadata. Buscando refletir se esses dados que descreve o conteúdo e os objetos do site, foram criados. Sobre o nível de qualidade do conteúdo e a consistência, se possui um vocabulário controlado. Entendendo assim o nível de recuperação de informação e gerenciamento de conteúdo. Outra questão é o volume de informações que está relacionado ao tamanho site. E por fim, o dinamismo de gerenciar a entrada e o crescimento de conteúdo (MORVILLE, ROSENFELD, 2006, p.27).
Desta forma, surge a estratégia de conteúdo, que Petersson (2014) conceitua como tudo que entra no planejamento, bem como o gerenciamento do conteúdo de um site, incluindo texto e mídias. E o principal: aborda a forma como o site funciona. Para isto, algumas perguntas devem ser feitas como:
a) O que o site deve realizar?
b) O que se quer que os usuários façam quando visitam o site? c) Como as necessidades do usuário serão satisfeitas?
Depois de entender tudo o que se pretende informar no site, deve-se ficar atento para usar somente o que for necessário. O excesso de conteúdo tem um custo para o usuário, pois ele levará mais tempo e mais rolagem para chegar à informação que deseja saber. Correndo o risco de abandonar o site por isto (PETERSSON, 2014, p. 22). Os conteúdos das páginas Web são muito importantes. Krug (2008) diz que nós não lemos as páginas, apenas damos uma olhada nelas. Desta forma, procuramos “apenas as partes que nos interessam ou às tarefas que estamos executando, o resto é irrelevante” (KRUG, 2008, p. 22). Dando uma olhada nas páginas é como achamos as partes relevantes. O usuário não tem tempo para ler mais do que o necessário. Além do mais, facilita o processo de design com menos conteúdo.
A tecnologia da Internet oferece a capacidade de trocar ou modificar facilmente o conteúdo que um visitante do site em particular vê. O conteúdo pode ser personalizado com base em sobre a origem do tráfego, as capacidades específicas do computador do visitante ou do navegador, seu comportamento durante a visita específica, ou seu histórico passado de interações com seu site (ASH, 2008, p.7).
3.1.1.3 Usuário
Royo (2008) define o usuário como o centro das preocupações, aquele que se conecta ao ciberespaço para ações como conversar em chats, jogar online, participar de fóruns, realizar compras e outros. Aprofundando no conceito dessas ações, ele as divide em dois grupos diferentes: ações cotidianas e ações de lazer. Sendo ações cotidianas aquelas que queremos gastar menos tempo possível, exemplificando com atividades do mundo real, seria como fazer uma transferência bancária. Esse é o tipo de ação que desejamos ser fácil de fazer e que atenda prontamente nosso objetivo específico. Já as ações de lazer poderiam ser comparadas a jogar xadrez, onde queremos passar mais tempo. Lembrando que isto é relativo de acordo com nossos objetivos. E é também essa diferença que vai definir como projetar o design da interface de cada uma (ROYO, 2008, p.96).
É importante considerar as diferenças nos comportamentos e preferências dos tipos de clientes. Que se traduzem em diferentes necessidades de informação e mesmo diferentes comportamentos de busca de informação. Como exemplo, Morville e Rosenfeld (2006) citam como exemplo a navegação feita por executivos, analistas, estudantes e gerentes.
O designer deve observar o usuário, como ele atua ou se desenvolve, quais são suas pequenas frustações ou anseios, suas possibilidades de ação em cada momento, para poder melhorar sua capacidade de movimento e de ação no ciberespaço (ROYO, 2008, p.75). É necessário, segundo Royo (2008) saber quem está usando o site, como está usando e o mais importante, qual informação eles querem do site. Isto leva a arquitetura de informação a pensar fora da caixa, sair do seu mundo real e estudar o seu usuário. Como afirmam Elis e Ferreira (2012), "informação é tudo o que o usuário consome".
Juntando estres 3 elementos (contexto, conteúdo e usuário) a arquitetura da informação acontece (ROYO, 2008, p.75).
3.1.1.4 Necessidades do usuário
Para entender o que os usuários querem, pode-se perguntar diretamente o que eles usam ou o que procuram e também entendendo o comportamento em páginas principais. Esse entendimento ajuda a avaliar as informações existentes para garantir que atendem às necessidades dos usuários, ajuda a identificar lacunas de informação que podem fazer falta futuramente. Tornar a informação principal fácil de encontrar, evitando que o usuário consuma informações desnecessárias correndo o risco de abandonar a página. E também ajuda a priorizar as atividades de conteúdo para escrever as páginas mais importantes primeiro (SPENCER, 2010, p.54).
Distinguir as necessidades e comportamentos e determinar quais são as prioridades dos usuários é uma pesquisa muito importante. Pois isto ajuda a definir onde investir seus esforços, recursos, tempo e dinheiro quando se projeta (MORVILLE, ROSENFELD, 2006, p.3).
Morville e Rosenfeld (2006) definem 4 necessidades de usuários comuns feitas pelos usuários, como visto na figura 7, sendo elas: "procura de item-conhecido", quando geralmente se sabe o que o usuário está procurando, como chamá-lo e onde encontrá-lo. Outro tipo é a pesquisa exploratória, onde o usuário não sabe exatamente o que está procurando e pode mudar sua intenção e suas ações de acordo com as informações que encontrar. Existe também a pesquisa exaustiva, que acontece quando o usuário conhecer tudo sobre um determinado tópico. Neste caso, o usuário pode ter muitas maneiras de expressas o que procura e fazer pesquisas múltiplas de expressões diferentes.
E por fim, o tipo de pesquisa onde o usuário vai reler depois, nestes casos ele chega a salvar o conteúdo para consumir posteriormente (MORVILLE, ROSENFELD, 2006, p.34).
Figura 9 – 4 comuns necessidades do usuário
Fonte: Information Architecture for the World Wide Web, Morville e Rosenfeld.
Já os comportamentos de pesquisa de informação podem ser definidos nos métodos de pesquisa, navegação e pergunta, que são blocos de construção básicos do comportamento de busca. Há dois outros aspectos importantes que são: integração e iteração. Muitas vezes, integramos a pesquisa, a navegação e a pergunta na mesma sessão de busca. E muitas vezes a iteração vai mudando ao longo das experiências. Sendo assim, cada iteração de pesquisar, navegar, perguntar e interagir com conteúdo pode impactar muito o que o usuário está buscando (MORVILLE, ROSENFELD, 2006, p.35).
Esses diferentes componentes dos comportamentos de busca de informação formam modelos como o "berry-picking", onde os usuários começam com uma necessidade de informação, formulam uma solicitação de informações (uma consulta) e, em seguida, movem iterativamente através de um sistema de informação ao longo de caminhos potencialmente complexos, escolhendo bits de informação pelo caminho, como mostrado na figura 8. No processo, eles modificam seus pedidos de informação à medida que aprendem mais sobre o que precisam e quais informações estão disponíveis (MORVILLE, ROSENFELD, 2006, p.36).
Figura 10 – Modelo “berry-picking” sobre o caminho como nossa mente trabalha
Fonte: Information Architecture for the World Wide Web, Morville e Rosenfeld.
Spencer (2010) também lembra que uma das coisas muito importantes da pesquisa de usuário é entender como as pessoas descrevem coisas, a terminologia que usam e o caminho que pensam sobre conceitos.
3.1.2 Organização de sistemas
Organizar a informação é importante para garantir que as pessoas encontrem as respostas corretas às suas perguntas. E é dividido em organização de esquemas e organização de estruturas, como visto da figura 10 de entregáveis de Arquitetura da Informação. A organização de esquemas define o compartilhamento de características dos itens de conteúdo e influencia a lógica agrupada destes itens. A organização da estrutura define os tipos de relação entre os itens de conteúdo e grupos (MORVILLE, ROSENFELD, 2006, p.58).
Figura 11 – Entregáveis da Arquitetura da Informação
Fonte: Information Architecture for the World Wide Web, Morville e Rosenfeld.
A organização de esquemas pode ser feita de forma alfabética, geográfica, cronológica, por tópicos/categorias, tarefas, audiência, metáfora e híbrida (MORVILLE, ROSENFELD, 2006, p.67).
A organização de estruturas define os primeiros caminhos pelos quais o usuário pode navegar. Na organização para sites inclui a hierárquica, orientação ao modelo de banco de dados e hypertexto (MORVILLE, ROSENFELD, 2006, p.69). 3.1.2.1 Rótulos
Para conectar o usuário e o site, a arquitetura da informação tenta fazer o melhor de design de rótulos para falar a mesma linguagem. Rótulos devem educar usuários sobre novos conceitos e ser familiar. Na web, encontra-se rótulos de dois formatos: textual e icônico. Dos tipos textuais, estão: links contextuais, que são os hyperlinks que levam a outras páginas ou outros locais na mesma página. Os cabeçalhos, que descrevem o conteúdo seguinte. Sistema de navegação, que representa as opções de navegação do sistema e termos para indexar, que são as
palavras-chaves, tags e cabeçalhos que representam o conteúdo pesquisado. Já os rótulos no formato icônico são a representação de palavras através de ícones (MORVILLE, ROSENFELD, 2006, p.86).
Figura 12 – Exemplo de Rotulação de Cabeçalhos
Fonte: Information Architecture for the World Wide Web, Morville e Rosenfeld.
3.1.2.2 Sistemas de navegação
Sistemas de navegação são desenvolvidos a muito tempo, como por exemplo os mapas usados em alto mar até o breadcrumb6 que usamos no site. Ferramentas de navegação nos previnem de nos perdermos e nos ajudam a encontrar nosso caminho para casa. Na web, se perder em um grande site pode ser
6 Breadcrumb pode ser entendido como “migalhas de pão ” e é usado em websites para auxiliar a
navegação do usuário, marcando assim o nível de profundidade da navegação. Normalmente é apresentado da seguinte forma: Página Inicial > Página Seguinte > Página Atual do Usuário
