Arquitetura - da - Informação - Tutorial, Notas de estudo de Fundamentos de Moda

Baixe Arquitetura - da - Informação - Tutorial e outras Notas de estudo em PDF para Fundamentos de Moda, somente na Docsity! Arquitetura da Informação Tutorial Arquitetura da Informação - Tutorial - Índice 2 Arquitetura da Informação - Tutorial - Índice Arquitetura da Informação - Tutorial Introdução........................................................................................................................................3 Arquitetura da Informação - Tutorial - Lição 1 1. Por que a Arquitetura da Informação é tão importante?..............................................................3 2. Defina os objetivos do site...........................................................................................................4 3. Faça perguntas.............................................................................................................................4 4. Filtre as respostas.........................................................................................................................5 5. Documento de Design: Objetivos do Site....................................................................................5 Arquitetura da Informação - Tutorial - Lição 2 1. Defina a Experiência do Usuário.................................................................................................6 2. Defina o Público-Alvo.................................................................................................................6 3. Crie Cenários...............................................................................................................................7 4. Análise Competitiva.....................................................................................................................7 5. Documento de Design: Públicos-Alvo, Cenários e Análise Competitiva....................................8 Arquitetura da Informação - Tutorial - Lição 3 1. Conteúdo do Site..........................................................................................................................9 2. Identifique o Conteúdo e os Requisitos Funcionais.....................................................................9 3. Agrupe e Rotule o Conteúdo......................................................................................................10 4. Documento de Design: Conteúdo e Funções.............................................................................10 Arquitetura da Informação - Tutorial - Lição 4 1. Estrutura do Site.........................................................................................................................10 2. Explorando a Metáfora..............................................................................................................11 3. Esculpindo..................................................................................................................................11 4. Defina a Navegação...................................................................................................................13 5. Documento de Design................................................................................................................13 Arquitetura da Informação - Tutorial - Lição 5 1. Design Visual.............................................................................................................................14 2. Grids de Layout.........................................................................................................................14 3. Esboços de Design e Modelos de Página...................................................................................15 4. Documento de Design................................................................................................................16 Arquitetura da Informação - Tutorial - Lição 1 5 você será capaz de lidar com crescimento e mudanças mais eficientemente. Quais são os públicos-alvo? Muitos clientes nem sequer pensam sobre seu público, o que talvez seja o erro número um no desenvolvimento de sites. Esta pergunta freqüentemente serve como um despertador para seus clientes, acordando-os cedo para essa importante questão. Por que as pessoas irão visitar o seu site? Você está vendendo um produto? Tem um serviço único? Por que as pessoas irão visitar o site pela primeira vez? Elas irão voltar? Se o cliente já tem um site, tente descobrir respostas para essa questão nele. Tente pensar em outras questões que irão revelar o verdadeiro propósito do site. Se outras pessoas tiverem idéias para questões, considere incluí-las também. Depois de compilar uma lista de questões, pergunte-as a todos, incluindo você mesmo. Certifique-se de escrever tudo o que todos disserem, não importa o quão trivial ou mundano seja. Você irá refinar as respostas na próxima etapa. 4. Filtre as respostas Neste ponto, ou você criou uma bonita lista de questões e as passou em uma grande reunião, ou você gastou algum tempo colecionando em seu bloco de notas as respostas, conversando com as pessoas uma a uma. Seja como for, você deve ter um monte de respostas para suas questões. Agora você precisa criar ordem nesse caos e filtrar as respostas. Você precisa transformar as respostas em objetivos/metas e descobrir quais são mais importantes. Primeiro, separe as respostas sobre os públicos-alvo e guarde-as para depois. Coloque as demais respostas em uma lista. Se você tem uma lista longa, agrupe objetivos em categorias. Forneça essa lista de volta a todos que responderam o questionário e peça que classifiquem cada objetivo da lista por ordem de importância. Se seus objetivos estão agrupados em categorias, peça que classifiquem a importância de cada categoria separadamente. Peça que, caso tenham sugestões para os nomes das categorias, escrevam-nas também. Agora vem a parte difícil. Depois de coletar a classificação de todos, você precisa mixá-las em uma única lista principal. Dê mais peso para a opinião de pessoas importantes dentro da organização, mas use seu julgamento: algumas vezes a secretária tem opiniões bem melhores sobre a internet do que um alto executivo fora de alcance. Agora você tem um claro conjunto de metas. O seu site tem um propósito! Mas espere. Você ainda precisa ter os objetivos aprovados antes de continuar. Mostre a lista para algumas pessoas apenas para ter certeza de que ela está OK. Convoque uma reunião se for necessário. Faça o que for preciso, mas certifique-se de que seu cliente concorda e assina embaixo os objetivos do site. 5. Documento de Design: Objetivos do Site Uma vez que você obtenha aprovação de todos os envolvidos, documente os objetivos do site e publique-os onde todos na organização do seu cliente e na sua própria possam vê-los. Se você tiver tempo, resuma a lista e escreva uns poucos parágrafos sobre os objetivos. Um simples resumo é suficiente. A lista de objetivos é a base para o seu documento de design, que foi mencionado no início. Depois que você tiver publicado os objetivos, use-os para criar a primeira seção do seu documento de design, chamada Objetivos. Exemplo: Arquitetura da Informação - Tutorial - Lição 1 6 • 1 - Objetivos Você acaba de completar a primeira lição: Definindo os Objetivos do Site. Você está pronto para avançar para a próxima lição. Arquitetura da Informação - Tutorial - Lição 2 1. Defina a Experiência do Usuário Depois de descobrir por que um site deve ser construído, o segundo aspecto mais importante ao projetar a arquitetura da informação é determinar quem é o público-alvo. Este é um passo inestimável que muitas pessoas falham em captar. Muitos sites nem sequer levam em consideração quem os estará usando. Como você pode desenhar um site se você não sabe quem irá vê-lo? Algumas pessoas pensam que o público-alvo é definido pela tecnologia que usam para acessar o site. Isso, também, é falha em captar a essência. O fato que um usuário visitando o site utiliza um modem 28.8 kbps é somente uma pequena parte da definição do público-alvo. Uma verdadeira definição do público-alvo consiste em quem são os usuários e quais suas metas e objetivos. Cenários, ou estórias, são úteis na visualização do público-alvo. De vez em quando, um único departamento ou grupo em uma organização conduz a tarefa de montar um website. O resultado geralmente é um site focado nas necessidades desse grupo, ignorando as necessidades de todos os demais. Por muito tempo, a gerência de Sistemas de Informação era responsável por montar o site de sua corporação. Esses sites eram utilitários, e negligenciavam departamentos importantes, como o marketing. É seu trabalho prevenir que isso aconteça ao seu site. Definir de antemão a experiência que você quer que o usuário tenha estabelece uma clara e bem documentada definição de seu público-alvo, e ajuda a entender como os usuários irão reagir ao site. Para dar andamento a esta etapa do procedimento da A.I., assim como foi ao definir os objetivos, você precisa descobrir quem estará envolvido e quanto tempo você terá. Em geral, as mesmas pessoas estarão envolvidas. Todavia, você provavelmente irá mudar o peso que você dará à opinião de cada uma das pessoas. Por exemplo, o departamento de marketing deve ter uma boa idéia de quem seu público-alvo é. Se esse é o caso, você irá querer ouví-los mais do que aos outros. Definir o público-alvo toma menos tempo do que definir os objetivos, porque você já estabeleceu como você estará trabalhando com as pessoas - seja formal ou informalmente - e você está mais familiarizado em fazer perguntas e obter respostas do pessoal. 2. Defina o Público-Alvo Lembra-se da lista de públicos-alvo que você compilou? Você precisa dela agora. Ela é a base para uma lista de todos os possíveis públicos para o site. Adicione tantas definições de público quanto você conseguir imaginar na lista, e pergunte a todos se têm quaisquer adições a fazer. Se a lista ficar muito longa, você pode precisar dividi-la em categorias. Vejamos um exemplo: você está construindo um site para vender automóveis. As categorias de público podem ser Compradores, Vendedores, Negociantes, e Outros. Compradores seriam as pessoas que precisam comprar um carro imediatamente, aqueles que precisam de um carro dentro dos próximos dois meses, e pessoas sem certeza se elas precisam de um carro e que estão apenas pesquisando. O público Outro consistiria nas pessoas tentando aprender sobre quem construiu o site, assim como possíveis investidores no site, e aqueles buscando por diferentes tipos de informação. Arquitetura da Informação - Tutorial - Lição 2 7 Faça com que todos classifiquem por ordem de importância cada público-alvo especificado na lista. Reúna os resultados, e crie uma lista de públicos-alvo. Lembre-se de que você irá querer pesar a opinião de cada pessoa apropriadamente ao criar a lista. Então forneça a lista de públicos-alvo para todos de modo que possam anotar quais eles pensam ser as necessidades e metas mais importantes para cada um. Mais uma vez, compile os resultados, e crie listas. Faça com que todos classifiquem por ordem de importância cada necessidade e meta para cada público-alvo. Uma vez que você tenha processado todas as opiniões, acrescente as necessidades e objetivos à lista de públicos-alvo. Você pode, é claro, encurtar este procedimento se você quiser. Você não precisa angariar uma lista de públicos, avaliá-la, e então angariar as necessidades e metas e avaliá-las. Você pode angariar ambas numa mesma etapa. Tudo depende da urgência e do tempo disponível para construir o site. Agora você está pronto para a próxima etapa, uma das mais divertidas em todo o processo de design da A.I. 3. Crie Cenários Cenários são estórias. Elas contam os casos de usuários vivenciando o site, e elas ajudam você e seus colaboradores a visualizarem o site e seus usuários. Cenários também são úteis para validar o design do site quando estiver terminado: se os cenários combinam com o design do site, você fez a coisa certa. Usando a definição prévia de seus públicos-alvo, tente selecionar um conjunto de usuários que represente a maioria dos visitantes. O tamanho do site e do público determinarão para quantos usuários você irá descrever cenários. Em geral, três a seis cenários são o suficiente. No entanto, você talvez precise descrever até cerca de vinte - acredite! Para cada usuário, escreva um cenário. Para começar um cenário, você precisa dar vida ao usuário. Crie um personagem para aquele usuário, e dê um nome a ele, um histórico, e uma tarefa a ser realizada no site. Use uma tarefa da sua lista de necessidades e metas, contida na lista de públicos- alvo. Então escreva uma história sobre como o personagem utiliza o site para completar a tarefa escolhida. Cenários serão importantes mais tarde, quando você estiver definindo o conteúdo e os requisitos funcionais para o site. Pode parecer como o problema do ovo e da galinha - se você não sabe o que o site contém, como você pode escrever uma estória sobre ele? Bom... você já tem uma idéia do que os usuários estarão fazendo no site, então use a sua imaginação! O céu é o limite. Ser criativo aqui irá elevar o seu design para alturas que você não imaginava alcançar. Criar cenários não é tão difícil, e pode ser bastante divertido (mas esteja atento, pode consumir muito tempo). 4. Análise Competitiva Conhecer seus competidores é uma boa maneira de aprender sobre seu próprio site. Esteja você casualmente navegando pelo site de seu rival ou seriamente avaliando todos os competidores um a um, você precisa estar a par do que os outros sites estão fazendo. Para começar, faça uma lista dos seus competidores. Pergunte, pois você provavelmente não conhece todos os sites. Faça algumas pesquisas na internet também; você poderá encontrar alguns sites que o seu cliente desconhece. Em seguida, você precisa elaborar um conjunto de características e critérios para avaliar cada site. Comece com os seus objetivos, usando-os como uma base para o conjunto de características na sua análise competitiva. Enquanto você avalia os sites, certifique-se de adicionar todas as características e funcionalidades que você achar interessantes. Os critérios incluem coisas como tempo de download, tamanho da página, layout, e estilo. Ajuda muito desenhar uma tabela com o nome de um site para cada coluna, e as características e critérios nas linhas. Essa tabela proporciona uma medida Arquitetura da Informação - Tutorial - Lição 3 10 3. Agrupe e Rotule o Conteúdo Ordem a partir do caos - é sobre isso que se trata nesta etapa. Agora você organiza o conteúdo e define a base para a estrutura do site. Comece escrevendo cada componente do inventário de conteúdo em um cartão de índice. Pegue os cartões e organize-os em grupos. (Você irá querer uma grande mesa para fazer isso.) Tente organizá-los de modos diferentes. Quando você estiver satisfeito em como as coisas se agruparam, dê um nome para cada grupo; tente ser o mais descritivo possível, e evite ser prolixo. Registre o nome de cada grupo e os elementos que contém. Repita este procedimento com todos os envolvidos. É importante registrar como cada pessoa organiza a informação e nomeia cada grupo. Certifique-se de dizer a todos que não existe resposta certa ou errada. Todas as opiniões são válidas. Idéias excelentes muitas vezes surgem das fontes mais inesperadas. Depois que todos tiverem passado pelo exercício, compare e contraste como cada pessoa organizou a informação. Dependendo de como você quiser fazê-lo, você pode chamar a todos para discutir os prós e contras de cada layout, ou trabalhar um a um com as pessoas mais intrigantes e suas idéias, ou simplesmente organizar todos os pensamentos por conta própria. Quando você decidir os agrupamentos e nomes finais, use-os como a base para definir as maiores seções do site e os nomes de cada seção. Essa é a base para a estrutura do seu site. Esteja atento, porém: considere as seções principais como passageiras - os seus nomes e conteúdo podem mudar na próxima etapa do procedimento da A.I. Tome o cuidado de fazer circular as seções e seus nomes entre algumas figuras-chave para ter certeza de que estão de acordo com eles. Finalmente, revise o inventário de conteúdo, se necessário, para refletir a nova organização da informação. 4. Documento de Design: Conteúdo e Funções Crie uma nova seção no seu documento de design chamado Conteúdo e Requisitos Funcionais. Inclua um resumo do inventário de conteúdo. Inclua uma sub-seção sobre como o conteúdo está agrupado e nomeado. Inclua a lista de requisitos funcionais com um resumo, se você quiser. O inventário de conteúdo deve ser incluído como um apêndice ao documento de design. Lembre-se de publicar estes resultados de modo que todos possam vê-los. Exemplo: • 3 - Conteúdo do Site • 3.1 - Agrupamento e Rotulação do Conteúdo • 3.2 - Requisitos Funcionais • Apêndice B: Inventário de Conteúdo Você acaba de completar a terceira lição e está pronto para a quarta lição: A Estrutura do Site. Arquitetura da Informação - Tutorial - Lição 4 1. Estrutura do Site Se você seguiu as três primeiras lições, até agora você já tratou bem os objetivos do site, quem será o público-alvo, e que tipos de conteúdo e funcionalidade você irá precisar. Agora é hora de definir a estrutura do site, que é a fundação sobre a qual você construirá tudo o mais. Pense na estrutura do site como um esqueleto que mantém o corpo unido. Sem estrutura, o seu site se torna uma bagunça confusa e desordenada - algo como uma ameba. Você quer um site desorganizado, desagradável, difícil de usar? Não! Você quer um site evoluído, altamente estruturado e fácil de usar, que pode até andar com suas próprias pernas. Arquitetura da Informação - Tutorial - Lição 4 11 Depois de criar uma boa estrutura para o site, tudo o mais irá se encaixar no lugar. Não pode deixar de fazê-lo! Uma estrutura bem projetada torna fácil elaborar um sistema de navegação, e os dois juntos possibilitam desenhar os temas e layouts de página num piscar de olhos. Esta é a última etapa antes que você possa de fato começar a construir alguma coisa. 2. Explorando a Metáfora Este próximo passo, que pode ser chamado de "exploração da metáfora", pode ajudar a refinar a sua visão da estrutura do site, mas é importante lembrar que este passo é apenas um exercício. Pode lhe trazer muitas boas idéias, mas elas podem ser impraticáveis, na melhor das hipóteses. Mas não deixe isso desanimá-lo - pode ser bastante divertido. É útil explorar diversas metáforas na tentativa de determinar a estrutura de um site. Uma boa metáfora pode ser muito útil em ajudar os usuários a entender como usar e navegar pelo site. Todavia, nenhuma metáfora é perfeita, então não sinta que você deve aderir rigidamente a apenas uma. Você poder pegar as melhores partes de várias metáforas e juntá-las em uma (ou talvez você não encontre absolutamente nenhuma metáfora útil). Três tipo de metáforas são úteis para o design de um site: Metáforas Organizacionais Metáforas organizacionais dependem da estrutura existente de um grupo, sistema ou organização. Por exemplo, se você está criando um site para vender alimentos, sua metáfora poderia ser um supermercado, onde produtos são agrupados logicamente por tipo (vegetais enlatados, laticínios, cereais, biscoitos, etc). Esteja ciente de que copiar a hierarquia organizacional do seu cliente em geral não é uma boa idéia - consumidores de mercearias não poderiam se importar menos com a estrutura corporativa de um supermercado. Metáforas Funcionais Metáforas funcionais relacionam tarefas que você pode fazer no site com tarefas que você pode fazer em outro ambiente. O programa gráfico Photoshop utiliza muitas metáforas funcionais: você pode figuradamente "cortar", "copiar" e "colar" gráficos em um computador - como se você estivesse utilizando tesoura e cola no mundo real. Metáforas Visuais Metáforas visuais são baseadas em elementos gráficos comuns, familiares para a maioria das pessoas em nossa cultura. Se você está elaborando um site de música que permite aos usuários tocarem músicas, você pode querer usar os ícones tradicionais para "tocar", "parar" e "pausar", encontrado em todos os aparelhos que tocam CD. Para começar a exploração de metáforas, junte seu pessoal e faça um brainstorm de idéias. Revise e avalie cada metáfora. Tente não desencorajar quaisquer sugestões que você não goste, pelo menos não imediatamente. A força de uma metáfora pode não ser óbvia à primeira vista. Tente mapear as seções principais do site conectando elementos do inventário de conteúdo para cada metáfora. Depois do que pode ter sido uma experiência vivaz e entretida, você deve escolher uma metáfora ou uma composição delas para a estrutura do site. Lembre-se, nenhuma metáfora é perfeita. O site como um todo pode não ser explicável através de uma metáfora, mas talvez o sistema de navegação (ou partes menores do site) possam. 3. Esculpindo Agora que você já tem uma idéia para a estrutura do site, você vai querer gravá-la em pedra. Você pode começar criando em texto um mapa hierárquico do site, chamado "listagem da estrutura do site". Arquitetura da Informação - Tutorial - Lição 4 12 As seções principais que você definiu anteriormente são as "raízes" da listagem da estrutura do site. Encaixe-as de acordo com sua idéia ou metáfora. Em seguida, mapeie a organização de cada seção com itens do inventário de conteúdo. Na medida em que você se aprofunda no site, faça a indentação dos níveis inferiores. Você irá repetir este procedimento várias vezes. Ao longo do tempo, focalize as partes mais específicas do site. Você deve terminar com uma listagem com visual mais ou menos assim: Seção 1 Seção 1.1 Seção 1.2 Seção 2 Seção 2.1 Seção 2.2 Seção 2.2.1 Seção 2.2.2 Seção 2.2.3 Seção 2.3 Seção 2.4 Seção 3 Em seguida você irá querer visualizar essa listagem. Muitas pessoas têm dificuldade em ver alguma coisa parecida com a listagem da estrutura do site e traduzi-la em entendimento de como o site irá funcionar. Plantas arquiteturais podem ajudar. Aqui está um exemplo: Arquitetura da Informação - Tutorial - Lição 5 15 Para se preparar, pegue a listagem da estrutura do site e faça uma lista de todos os tipos de página possíveis. Páginas individuais dentro do site devem ser muito similares na forma através de todas as seções principais. Pesquise no inventário de conteúdo, e então tente ficar com dois ou três tipos genéricos de página. Você deve começar fazendo o design para esses tipos e então usá-los como base para todos os demais tipos de página. Para começar, use um bloco de esboços ou um programa gráfico de sua predileção. Crie um retângulo representando a página, e delineie blocos para os elementos do seu design. Uma vez que o conteúdo é o elemento mais importante, comece com ele - ainda que seja um pouco complicado, na medida em que você ainda não sabe o que mais estará na página. Muitos outros elementos precisam ser considerados: branding (marca, logotipo, slogan), publicidade e patrocínio, navegação, títulos da página, gráficos do cabeçalho, e rodapés, incluindo copyrights. Branding (que inclui marca, logotipo, slogan) representa um papel muito proeminente em todas as páginas poque informa o usuário que eles ainda estão no site. Um lugar comum para o branding é o canto superior esquerdo da página. Publicidade e patrocínio podem ser integrados de diversas maneiras. Talvez você tenha um banner comercial de tamanho completo (tipicamente 468 por 60 pixels) em todas as páginas. Você o coloca no topo? Ou o coloca debaixo do título de cada página? Como você integra o patrocínio? Nos gráficos do cabeçalho de cada página? Ou há um pequeno logotipo de patrocínio ao final de cada página? Todas essas são questões que você precisa responder. Por fim , a navegação também tem um papel muito proeminente. A navegação global precisa ser consistente através de todas as páginas do site. Sistemas de navegação local podem mudar, dependendo do conteúdo, mas tente ser o mais consistente possível. Este é um procedimento iterativo. Você irá precisar revisar os grids de layout diversas vezes. Você provavelmente irá querer fazer dois ou três layouts com estilos diferentes, se você tiver tempo. 3. Esboços de Design e Modelos de Página Esboços de design são usados para estabelecer o visual e o estilo do site. Eles podem ser integrados à metáfora ou idéia da estrutura do site, mas isso nem sempre é necessário. Freqüentemente, eles são feitos simultaneamente aos demais procedimentos da arquitetura da informação, de modo que você talvez já possa ter os esboços de design prontos e aprovados pelo cliente. Os esboços não têm que necessariamente representar a estrutura ou organização. No entanto, os designers gráficos têm que saber o tamanho dos arquivos gráficos, bem como quaisquer outras restrições técnicas. O próximo passo é criar modelos de página, que representam o site de fato, integrando os esboços de design com os grids de layout. Os modelos precisam ser o mais parecidos possível com as páginas reais do site. Use seu programa gráfico favorito para manipular os esboços. Experimente cortar e colar as peças sobre seus respectivos lugares nos grids de layout. Outra opção é construir os modelos de página em HTML, usando as peças dos esboços de design como gráficos. Os modelos de página são a base para um protótipo baseado na Web ou, se o seu site for pequeno o suficiente, a base para a construção do site final. Modelos de página precisam ser aprovados pelo cliente, apesar de poder ser suficiente ter a aprovação da estrutura do site e dos esboços de design para avançar com os protótipos. Agora você completou os passos para modelar a arquitetura da informação para o seu site! Você tem todos os materiais necessários para construir um protótipo, e tudo o mais deve se encaixar a partir daí. Antes de você mergulhar na prototipação, adicione uma última seção no seu documento de design. Arquitetura da Informação - Tutorial - Lição 5 16 4. Documento de Design Você está quase terminando. Você precisa apenas documentar o design visual do site. Crie uma nova seção no seu documento de design chamada Design Visual. Documente os grids de layout, e certifique-se de incluir os diagramas que você fez. Reúna os esboços de design, e os inclua no documento, bem como as imagens dos modelos de página. Inclua capturas de tela do protótipo baseado na Web, se for possível. O documento de design está completo agora, provendo uma minuciosa descrição do design do site. Será útil para construir o site, para adicionar conteúdo, e para atualizar o site quando esse momento inevitável chegar. Exemplo: • 5 - Design Visual • 5.1 - Grids de Layout • 5.2 - Esboços de Design • 5.3 - Modelos de Página • 5.4 - Protótipo baseado na Web Você acaba de completar a última lição. Agora tudo o que é necessário para ser um verdadeiro arquiteto da informação é praticar bastante. Texto original de John Shiple Tradução de João Henrique de Andrade Bruni 1ª versão, revisão 1 – Uberlândia, 22 de abril de 2008