Desenvolvimento do website do grupo de pesquisa em dança e percussão afro-contemporâneas - Abayomi

July 19, 2017 | Autor: Bettina D'avila | Categoria: Web Design, West African Music, User-Centered Design (UCD)
Share Embed


Descrição do Produto

Bettina Martins d’Ávila

DESENVOLVIMENTO DO WEBSITE DO GRUPO DE PESQUISA EM DANÇA E PERCUSSÃO AFROCONTEMPORÂNEAS - ABAYOMI

Trabalho de Conclusão de Curso submetido ao Departamento de Expressão Gráfica - EGR, da Universidade Federal de Santa Catarina para a obtenção do Grau de Bacharel em Design - Habilitação Design Gráfico Orientador: Prof.ª Dr.ª Lisandra de Andrade Dias

Florianópolis 2013

2

Catalogação na fonte elaborada pela biblioteca da Universidade Federal de Santa Catarina

A ficha catalográfica é confeccionada pela Biblioteca Central. Tamanho: 7cm x 12 cm Fonte: Times New Roman 9,5 Maiores informações em: http://www.bu.ufsc.br/design/Catalogacao.html

3

Bettina Martins d’Ávila

DESENVOLVIMENTO DO WEBSITE DO GRUPO DE PESQUISA EM DANÇA E PERCUSSÃO AFROCONTEMPORÂNEAS - ABAYOMI

Este Trabalho de Conclusão de Curso foi julgado adequado para obtenção do Grau de Bacharel em Design - Habilitação Design Gráfico, e aprovado em sua forma final pelo Departamento de Expressão Gráfico - EGR. Florianópolis, 6 de fevereiro de 2013. ____________________________________ Prof.ª, Dr.ª Marília Matos Gonçalves Coordenador do Curso Banca Examinadora: ____________________________________ Prof.ª, Dr.ª Lisandra de Andrade Dias, Orientadora Universidade Federal de Santa Catarina

____________________________________ Prof.ª, Dr.ª Ana Verônica Pazmino, Universidade Federal de Santa Catarina ____________________________________ Prof.ª, Dr.ª Cláudia Regina Batista, Universidade Federal de Santa Catarina

4

5

Dedico este trabalho ao Abayomi, pela força de vida.

6

7

Agradeço, a todos que sempre me apoiaram, por me fazerem acreditar que é possível. a todos que nunca me apoiaram, por me fazer perseverar. aos amigos que encontrei no caminho, por se tornarem minha família. à mãe e irmãs, pelo amor incondicional. ao Abayomi, pelo movimento, força, alegria e aprendizado constante. Asè!

8

9

RESUMO Este trabalho apresenta o processo de desenvolvimento do website do grupo Abayomi, que realiza pesquisa em dança e percussão afrocontemporâneas em Florianópolis. O tema abordado é o design centrado no usuário, fundamentado ao longo do projeto através dos conceitos de design de interação, design de experiência, design de interface e usabilidade. As etapas de desenvolvimento do website foram baseadas nos cinco planos conceituais de Garrett e adaptadas conforme as demandas do projeto, as necessidades e objetivos dos usuários e a responsabilidade sociocultural da designer, a qual interviu por meio deste trabalho em um contexto que coloca em debate a presença e disseminação da cultura afro-brasileira em Florianópolis, em específico, da dança afro. Palavras-chave: Webdesign. Design centrado no usuário. Abayomi. Dança afro.

10

11

ABSTRACT This paper presents the development process of the Abayomi's website, who conducts research in contemporary-african dance and percussion in Florianópolis. The topic is the user-centered design, based throughout the project through the concepts of interaction design, experience design, interface design and usability. The steps of website development were based on the five conceptual plans by Garrett and adapted according to the demands of the project, the needs and goals of the users and the cultural and social responsibility of the designer, which intervened through this work in a context that puts debate on the presence and dissemination of african-Brazilian culture in Florianópolis, in particular, african dance. Keywords: Web design. User centered design. Abayomi. African dance.

12

13

LISTA DE FIGURAS Figura 1 – Gráfico relacionando os conceitos chaves dentro da metodologia do design centrado no usuário. Fonte: Duyne, Hong e Landay (2011).........................................................................................35 Figura 2 - Exemplo de um mapa de site. Fonte: Duyne, Hong e Landay (2011)......................................................................................................43 Figura 3 - Outro exemplo de um mapa de site. Fonte: Duyne, Hong e Landay (2011).........................................................................................44 Figura 4 - Exemplo de um storyboard. Fonte: Duyne, Hong e Landay (2011)......................................................................................................45 Figura 5 - Exemplos de esquemas. Fonte: Duyne, Hong e Landay (2011)..................................................................................................... 46 Figura 6 - Exemplo simples de uma aplicação de personas, um carro projetado para cada tipo de usuário. Fonte: Cooper, Reimann e Cronin (2007)......................................................................................................50 Figura 7 - Exemplo de personas voltadas para o desenvolvimento de website. Fonte: Garrett (2011)................................................................51 Figura 8 - Gráfico relacionando as metas de usabilidade com as metas de experiência do usuário. Fonte: Preece, Rogers e Sharp (2005)..............58 Figura 9 - Os cinco planos de construção de um website sob a perspectiva da experiência do usuário. Fonte: Garrett (2011)................61 Figura 10 – Modelo de atributos da aceitabilidade de um sistema. Fonte: N

i

e

l

s

e

n

(1993)......................................................................................................63 Figura 11 - Os três círculos da arquitetura da informação. Fonte: Morville e Rosenfeld (2006)...................................................................72 Figura 12 - Festa malinkê, Guiné. Fonte: Fortes (2008).........................81

14

Figura 13 - Fanta Konatê e Luis Kinugawa. Fonte: www.fantakonate.com............................................................................82 Figura 14 - Ensaio fotográfico do grupo Oduá em 2001. Fonte: Fortes (2008)......................................................................................................83 Figura 15 - Identidade visual do Abayomi. Fonte: autora......................84 Figura 16 - Dançarinas do Abayomi em outubro de 2012, fotografadas por Anninha Piccolo. Fonte: Acervo pessoal..........................................86 Figura 17 - Percussionistas do Abayomi em outubro de 2012, fotografados por Anninha Piccolo. Fonte: Acervo pessoal.....................87 Figura 18 - Persona 1. Fonte: Autora....................................................121 Figura 19 - Persona 2. Fonte: Autora....................................................122 Figura 20 - Persona 3. Fonte: Autora....................................................123 Figura 21 - Persona 4. Fonte: Autora....................................................124 Figura 22 - Página inicial do website. Fonte: www.alokli.com............125 Figura 23 - Página inicial do website. Fonte: www.kulumele.org........127 Figura 24 - Página inicial do website. Fonte: www.ezibumuntu.org............................................................................129 Figura 25 - Página interna com calendário de eventos. Fonte: www.ezibumuntu.org............................................................................129 Figura 26 - Página inicial do website. Fonte: www.cumbedance.com.........................................................................131 Figura 27 - Página com informações e calendário das aulas de dança. Fonte: www.cumbedance.com.............................................................131 Figura 28 - Página única do website. Fonte: www.fadf.org................132 Figura 29 - Página inicial do website. Fonte: www.africaviva.org.....134 Figura 30 - Página dos parceiros do instituto. Fonte: www.africaviva.org...............................................................................134

15

Figura 31 - Página inicial do website. Fonte: www.biodanzaflorianopolis.com.br......................................................136 Figura 32 - Uma página interna do website. Fonte: www.biodanzaflorianopolis.com.br......................................................136 Figura 33 - Página inicial do website. Fonte: www.cenariumdanca.com.br.................................................................138 Figura 34 - Detalhe do rodapé da página inicial. Fonte: www.cenariumdanca.com.br.................................................................138 Figura 35 - Página inicial do website. Fonte: www.soldaterra.com.br.140 Figura 36 - Página inicial do blog. Fonte: http:// arrastailha.blogspot.com.br...................................................................142 Figura 37 - Página inicial do blog. Fonte: http:// angoleirosimsinhofloripa.blogspot.com.br...........................................143 Figura 38 - Página inicial do blog. Fonte: http:// meiembipenago.blogspot.com.br..........................................................144 Figura 39 - Mapa mental sobre o Abayomi. Fonte: autora...................150 Figura 40 - Outro mapa mental sobre o Abayomi. Fonte: autora.........151 Figura 41 - Organização dos conteúdos do website a partir dos mapas mentais. Fonte: autora...........................................................................152 Figura 42 - Filtragem da estrutura anterior para a formação de conteúdo do website. Fonte: autora......................................................................153 Figura 43 - Mapa provisório criado a partir dos mapas mentais e Briefing. Fonte: autora..........................................................................154 Figura 44 - Aplicação do Card Sorting com usuários. Fonte: autora....................................................................................................155 Figura 45 - Estrutura sugerida pelo primeiro usuário. Fonte: autora....157 Figura 46 - Estrutura sugerida pelo segundo usuário. Fonte: autora. ...158

16

Figura 47 - Processo de construção da estrutura do terceiro usuário. Fonte: autora.........................................................................................159 Figura 48 - Estrutura sugerida pelo terceiro usuário. Fonte: autora.....160 Figura 49 - Mapa final do website do Abayomi. Fonte: autora............162 Figura 50 - Fluxograma do website do Abayomi. Fonte: autora..........163 Figura 51 - Wireframes da página inicial do website do Abayomi. Fonte: autora....................................................................................................166 Figura 52 - Wireframes da página “Abayomi”. Fonte: autora..............168 Figura 53 - Wireframes da página “Agenda”. Fonte: autora................170 Figura 54 - Wireframes da página “Galerias”. Fonte: autora...............171 Figura 55 - Wireframes da página “Notícias”. Fonte: autora...............172 Figura 56 - Wireframes da página de uma notícia individual. Fonte: autora....................................................................................................174 Figura 57 - Wireframes da página “Contato”. Fonte: autora................176 Figura 58 - Storyboard demonstrando como se navega pelas categorias de notícias. Fonte: autora.....................................................................177 Figura 59 - Storyboard demonstrando como acessar a agenda. Fonte: autora....................................................................................................178 Figura 60 - Storyboard demonstrando como acessar as imagens das galerias e os formulários de contato a partir da página “Abayomi”. Fonte: autora.........................................................................................179 Figura 61 - Aplicações da identidade visual do Abayomi. Fonte: autora....................................................................................................181 Figura 62 - Paletas de cores da identidade visual do Abayomi e dos sites relacionados à dança e percussão afro ocidental. Fonte: autora...........181 Figura 63 - Textura aplicada ao cartão de visita do grupo Abayomi. Fonte: autora.........................................................................................182

17

Figura 64 - Paletas de cores selecionada para o layout. Fonte: autora.183 Figura 65 - Combinação das fontes Droid Serif (título) e Droid Sans (parágrafo). Fonte: Google...................................................................185 Figura 66 - Família tipográfica Droid Serif. Fonte: Google.................186 Figura 67 - Família tipográfica Droid Sans. Fonte: Google. ................186 Figura 68 - Botão desenvolvido para o rodapé do website. Fonte: autora....................................................................................................187 Figura 69 - Detalhe para o fundo texturizado e a sombra no banner. Fonte: autora.........................................................................................187 Figura 70 - Detalhe para os divisores de conteúdo do rodapé. Fonte: autora....................................................................................................188 Figura 71 - Interface da página inicial do website. Fonte: autora........189 Figura 72 - Interface da página “Abayomi” do website. Fonte: autora....................................................................................................190 Figura 73 - Interface da página “Agenda” do website. Fonte: autora....................................................................................................191 Figura 74 - Destaque para o pop-up de um evento clicado no calendário da página “Agenda”. Fonte: autora......................................................192 Figura 75 - Interface da página “Notícias” do website. Fonte: autora....................................................................................................193 Figura 76 - Interface uma notícia específica. Fonte: autora.................194 Figura 77 - Interface da galeria de vídeos da página “Galerias”. Fonte: autora....................................................................................................195 Figura 78 - Interface da galeria de álbuns de fotos da página “Galerias”. Fonte: autora.........................................................................................196 Figura 79 - Detalhe para a apresentação de uma imagem dentro do álbum de foto da página “Galerias”. Fonte: autora...............................197

18

Figura 80 - Interface da página “Contatos” do website. Fonte: autora.198 Figura 81 - Detalhe do topo da página inicial do website. Fonte: autora....................................................................................................199 Figura 82 - Detalhe da página de uma notícia específica. Fonte: autora....................................................................................................199 Figura 83 - Detalhe da biografia do autor e da sessão de comentários dentro da página de uma notícia específica. Fonte: autora...................200 Figura 84 - Detalhe da rodapé do website. Fonte: autora.....................201

19

LISTA DE GRÁFICOS

Gráfico 1 - Gênero dos entrevistados. Fonte: autora..............................90 Gráfico 2 - Idade em relação à quantidade de entrevistados. Fonte: autora......................................................................................................90 Gráfico 3 - Ocupação dos entrevistados (em alguns casos, houve mais de uma resposta por entrevistado). Fonte: autora........................................91 Gráfico 4 - Relação dos cursos entre os entrevistados que responderam ser estudantes. Fonte: autora...................................................................92 Gráfico 5 - Cidade de residência dos entrevistados. Fonte: autora.........93 Gráfico 6 - Relação ente as diferentes formas com que os entrevistados conheceram o grupo Abayomi. Fonte: autora.........................................94 Gráfico 7 - Relação das respostas do item “outro” do Gráfico VI. Fonte: autora......................................................................................................94 Gráfico 8 - Relação do tempo de permanência no grupo de oficinas do Abayomi e o número de alunos. Fonte: Autora......................................95 Gráfico 9 - Porcentagem dos entrevistados que conhecem ou não o atual site do Abayomi. Fonte: autora...............................................................96 Gráfico 10 - Idade em relação à quantidade de entrevistados. Fonte: autora......................................................................................................96 Gráfico 11 - Relação das respostas do item “outro” do Gráfico X. Fonte: autora......................................................................................................97 Gráfico 12 - A frequência de acesso dentre os participantes que conhecem o site do Abayomi. Fonte: autora...........................................97 Gráfico 13 - Incidência de respostas em relação ao nível de experiência de uso do computador e da internet. Fonte: autora. .............................100

20

Gráfico 14 - Apresentação dos conteúdos selecionados em múltipla escolha nos formulários por parte dos entrevistados que são alunos das oficinas do Abayomi. Fonte: autora......................................................101 Gráfico 15 - Apresentação dos conteúdos selecionados em múltipla escolha nos formulários por parte dos entrevistados que não são alunos das oficinas do Abayomi. Fonte: autora...............................................102

21

LISTA DE TABELAS

Tabela 1 - Análise do website www.alokli.com....................................126 Tabela 2 - Análise do website www.kulumele.org................................128 Tabela 3 - Análise do website www.ezibumuntu.org............................130 Tabela 4 - Análise do website www.cumbedance.com.........................132 Tabela 5 - Análise do website www.fadf.org........................................133 Tabela 6 - Análise do website www.africaviva.org...............................135 Tabela 7 - Análise do website www.biodanzaflorianopolis.com.br......137 Tabela 8 - Análise do website www.cenariumdanca.com.br.................139 Tabela 9 - Análise do website www.soldaterra.com.br.........................140 Tabela 10 - Análise do blog arrastailha.blogspot.com.br......................142 Tabela 11 - Análise do blog angoleirosimsinhofloripa.blogspot.com.br. ..........................................143 Tabela 12 - Análise do blog meiembipenago.blogspot.com.br.............145 Tabela 13 - Objetivos vs. estratégias de design para o projeto do website do Abayomi...........................................................................................147

22

23

SUMÁRIO

1 INTRODUÇÃO ..........................................................................29 1.1 APRESENTAÇÃO DO TEMA .................................................29 1.2 OBJETO DE ESTUDO .............................................................31 1.3 OBJETIVOS ..............................................................................32 1.3.1 Objetivo Geral ................................................................32 1.3.2 Objetivos Específicos .....................................................32 1.4 JUSTIFICATIVAS .....................................................................33 1.5 RESULTADOS ESPERADOS...................................................33 2 FUNDAMENTAÇÃO TEÓRICA .............................................34 2.1 DESIGN CENTRADO NO USUÁRIO ....................................34 2.2 DESIGN DE INTERAÇÃO ......................................................37 2.2.1 Princípios de design de interação .................................37 2.2.2 Aplicações do design de interação ................................39 2.2.2.1 Necessidades e requisitos 39 2.2.2.2 Propostas alternativas aos requisitos do projeto 41 2.2.2.3 Protótipos 41 2.2.2.4 Vantagens ao se avaliar designs 46 2.2.3 Construindo personas ....................................................47 2.2.4 Descrevendo tarefas através de cenários .....................52

24

2.2.6 Objetivos do design de interação ..................................53 2.3 DESIGN DE EXPERIÊNCIA ...................................................54 2.3.1 Aspectos da experiência do usuário ..............................56 2.3.2 Metas decorrentes da experiência do usuário .............57 2.3.3 Elementos da experiência do usuário ...........................59 2.4 USABILIDADE ........................................................................62 2.4.1 As dez heurísticas da usabilidade .................................65 2.4.2 Usabilidade Universal ...................................................67 2.5 DESIGN DE INTERFACE ........................................................68 2.5.1 As oito regras de ouro para o design de interface .......68 2.5.2 Arquitetura da Informação ...........................................71 2.5.2.1 Usuário, conteúdo e contexto 72 2.5.2.2 Navegação 73 3 ABAYOMI E A DANÇA AFRO EM FLORIANÓPOLIS ......77 3.1 DANÇA AFRO EM FLORIANÓPOLIS...................................77 3.1.1 Formação social afro-descendente em Florianópolis .77 3.1.2 Histórico da dança afro em Florianópolis ...................79 3.2 ABAYOMI .................................................................................84 3.2.1 O que é ............................................................................84 3.2.2 Histórico .........................................................................85 3.2.3 Missão, Visão e Valores .................................................87

25

3.2.3.1 Missão: Porque o Abayomi existe 87 3.2.3.2 Visão: Descrição do futuro desejado para o grupo 87 3.2.3.3 Valores: princípios ou crenças, guia de como o grupo executa a missão 88 4 DESENVOLVIMENTO DO WEBSITE DO “ABAYOMI” ...89 4.1 PLANO DA ESTRATÉGIA ......................................................89 4.1.1 Pesquisa ...........................................................................89 4.1.1.2 Resultados dos Formulários 89 4.1.1.3 Entrevistas 104 4.1.2 Briefing .........................................................................114 4.1.2.1 Sumário Executivo 115 4.1.2.2 Análise Setorial 115 4.1.2.3 Posicionamento de mercado 118 4.1.2.4 Similares 119 4.1.2.5 Público-alvo 120 4.1.2.6 Personas e Cenários 121 4.1.2.7 Análise de Similares 124 4.1.2.7.1 Sites relacionados a dança e música oeste-africana 125 4.1.2.7.2 Escolas de dança e música em Florianópolis 135 4.1.2.7.3 Grupos de cultura afro-brasileira em Florianópolis 141 4.2 PLANO DE ESCOPO .............................................................146

26

4.3 PLANO DE ESTRUTURA .....................................................149 4.3.1 Arquitetura da Informação .........................................149 4.3.1.1 Construção 149 4.3.1.2 Card Sorting 154 4.3.1.3 Navegação 161 4.3.1.3.1 Mapa 161 4.3.1.3.2 Fluxograma 162 4.4 PLANO DE ESQUELETO ......................................................164 4.4.1 Wireframes ...................................................................164 4.4.2 Storyboard ....................................................................177 4.5 PLANO DE SUPERFÍCIE ......................................................180 4.5.1 Elementos da Interface ................................................180 4.5.1.1 Cores ...........................................................................180 4.5.1.2 Tipografia ..................................................................183 4.5.1.3 Texturas .....................................................................187 4.5.2 Interfaces ......................................................................188 5 CONCLUSÃO ..........................................................................202 REFERÊNCIAS ...........................................................................205 APÊNDICE A - Imagens do Blog grupoabayomi.wordpress.com ........................................................................................................211 APÊNDICE B - Formulário aplicado durante o Briefing ........213

27

APÊNDICE C - Entrevista aplicada durante o Briefing .........217 APÊNDICE D - Esboços dos Wireframes .................................218 ANEXO A - Indicadores de uso da internet em 2011 feito pelo CETIC.br ......................................................................................220 ANEXO B - Boletim de preços de mão-de-obra referentes ao ano de 2011, pelo Ministério da Cultura ....................................226

28

29

1 INTRODUÇÃO 1.1 APRESENTAÇÃO DO TEMA O Grupo Abayomi realiza pesquisa em dança e música de matriz africana e afro-brasileira, em especial a cultura malinkê, presente na Guiné, Costa do Marfim, Senegal e outros países do oeste africano. O grupo é formado por alunos das oficinas de dança afro-contemporânea e percussão realizadas na Universidade Federal de Santa Catarina (UFSC) e abertas à comunidade, desde 2009. As atividades do grupo consistem em aulas de dança e percussão, criação e ensaio de coreografias e repertório musical, apresentações em espaços públicos, teatros e eventos. A partir dessas oficinas de estudo, o Abayomi constitui um grupo artístico focado no trânsito entre culturas e na reinterpretação de novos conteúdos, cuja apresentação é dividida entre movimentos coreográficos e a dança em roda, onde o músico e a dançarina experimentam a liberdade da criação no improviso e na interação com o público. Atualmente, a internet é o meio de comunicação mais efetivo do Abayomi e é nele que o grupo investe as suas estratégias de comunicação, sendo através do seu website, das redes sociais, das listas de e-mails e das produções audiovisuais que o Abayomi trabalha para divulgar a sua imagem, as suas pesquisas e o seu trabalho. Após análises feitas através do Planejamento de Marketing (elaborado pelo grupo em 2012), o Abayomi viu a necessidade de fortalecer a sua imagem institucional e de investir na promoção de seu trabalho destacando a importância de um plano de comunicação bem estruturado para a visibilidade e fomento à manifestação da cultura afro em Florianópolis. Dessa forma, o Abayomi tem se mostrado um precursor no uso de

30

ferramentas digitais e de planejamento de comunicação dentro do cenário cultural de Florianópolis, em especial da dança afro e afrobrasileira, pois o grupo investe principalmente na comunicação digital para conquistar novos públicos e também para sensibilizar aqueles que já conhecem o trabalho do Abayomi. Dentro deste contexto, o grupo pesquisou e observou a necessidade de um website que concentre todos as fontes de informação que existem disseminadas no meio digital, através de ferramentas como Twitter, Facebook, Youtube, Vimeo, listas de e-mails, etc., e que o acesso a esses conteúdos sejam facilitados através de uma plataforma que supra as necessidades dos usuários e atenda aos objetivos de comunicação do grupo. O Abayomi, hoje, possui um blog (vide Apêndice A) que serve para a divulgação de notícias, fotos e informações relevantes sobre o grupo. Após um ano usando essa plataforma, viu-se a necessidade de se criar um website voltado aos interesses e necessidades do público-alvo e também do próprio grupo. A equipe de comunicação do Abayomi se sente limitada por não conseguir expor as notícias e demais conteúdos da forma desejada e de acordo com a opinião de alguns usuários que se sentem incomodados com a configuração atual do website, o grupo percebeu que está perdendo credibilidade perante às instituições e produtores culturais que esperam um website mais usável e com a “cara” do Abayomi. O tema central escolhido para a realização do Trabalho de Conclusão de Curso foi, portanto, o design centrado no usuário (usercentered design) aplicado ao projeto de desenvolvimento do website do grupo Abayomi. Design centrado no usuário é considerado o processo de design em que as necessidades, desejos e limitações dos usuários finais daquele produto ou serviço são levados em conta durante as fases de concepção e desenvolvimento (DESIGN Centrado no Usuário - UCD,

31

2012). Ainda, esse processo de design deverá pensar na maneira como o usuário desfrutará o produto e/ou serviço, ou seja, na experiência do usuário. Segundo Garrett (2011, tradução nossa), a experiência do usuário na Web se torna ainda mais importante do que em outros produtos porque os websites envolvem muita tecnologia e quando as pessoas não sabem lidar com a tecnologia elas se afastam por se sentirem incapazes de utilizá-lo, tornando a experiência de navegação desagradável e desmotivando os seus usuários a repeti-la. Muito mais do que abordar os processos técnicos e metodológicos para o desenvolvimento do website do grupo Abayomi, este trabalho procura abordar o propósito cultural e a responsabilidade da comunicação como forma de intervenção dentro de um contexto social. Os designers devem reconhecer as situações sociais em que trabalham, definindo o futuro da profissão e contribuindo de maneira consciente. Para isso acontecer, Frascara (2008, tradução nossa) afirma que se deve mudar a forma de atuar, de desenvolver novas ferramentas, de se integrar em grupos interdisciplinares, de iniciar projetos e atividades, de gerar nova informação e disseminá-la. Este processo permitirá que mais designers se ocupem de projetos socialmente importantes, fortalecendo a importância da profissão para a sociedade e criando abertura para novas oportunidades de trabalho e de valor percebido. 1.2 OBJETO DE ESTUDO O objeto de estudo escolhido para este trabalho foi o website do grupo Abayomi, cujas etapas do seu desenvolvimento serão abordadas sob a perspectiva de um projeto de design centrado no usuário. O objeto

32

de estudo se encaixa perfeitamente dentro do tema escolhido, pois segundo análises prévias realizadas pelo grupo, viu-se a necessidade de desenvolver um website voltado às necessidades dos seus usuários e que contemple os objetivos de comunicação do grupo. 1.3 OBJETIVOS Os objetivos são divididos em: objetivo geral e objetivos específicos. 1.3.1 Objetivo Geral Desenvolver o website do grupo Abayomi até a sua etapa das interfaces gráficas, segundo as diretrizes do tema escolhido. 1.3.2 Objetivos Específicos - Investigar e definir o papel do design centrado no usuário no contexto atual a fim de fornecer uma base teórica para o desenvolvimento do website do grupo Abayomi; - Contemplar os objetivos do grupo Abayomi e as necessidades dos usuários dentro deste projeto, definidos através do Briefing e pesquisas de público-alvo; - Aplicar a metodologia proposta por Garrett apresentando todas as etapas do projeto e suas fundamentações.

33

1.4 JUSTIFICATIVAS A escolha do tema e o objeto de estudo a ser abordado neste Trabalho de Conclusão de Curso nasceu por causa do envolvimento pessoal da acadêmica com o grupo Abayomi e também da sua atuação profissional na área de webdesign. Após ter trabalhado por três anos como produtora cultural e dançarina do Abayomi, constatou-se a carência que o grupo apresenta em relação à sua comunicação através da internet, mais especificamente a carência de um website que cumpra com os objetivos de comunicação do grupo e supra as necessidades dos usuários. Também notou-se a importância que um projeto desta qualificação representa para um grupo da área de pesquisa e manifestação da cultura afro-brasileira na região de Florianópolis, especialmente de dança afro, dada a invisibilidade que estes grupos representam socialmente na região e, por consequência, a falta de divulgação de trabalhos e pesquisas na área (CIDADÃO INVÍSIVEL, 2006). 1.5 RESULTADOS ESPERADOS Pretende-se demonstrar a importância da área de estudo do design centrado no usuário para resultados de sucesso em projetos de websites. Espera-se, também, alcançar os objetivos traçados para o desenvolvimento do website do grupo Abayomi, objeto de estudo deste trabalho. Com este produto, espera-se também que o website do Abayomi torne-se um referencial dentro do cenário cultural de Florianópolis.

34

2 FUNDAMENTAÇÃO TEÓRICA 2.1 DESIGN CENTRADO NO USUÁRIO O processo de design centrado no usuário, ou UCD 1 , pode ser entendido como a prática de criar envolvimento e experiências eficientes ao usuário, ou seja, levá-lo em conta em todos os passos durante o desenvolvimento do produto (GARRETT, 2011, tradução nossa). Este processo coloca as pessoas no centro da atenção ao desenvolver um produto ou serviço e consiste de metodologias que tornam o usuário uma parte integral do processo de desenvolvimento, com atividades como entrevistas, observações e testes. Para Kalbach (2011), isso substitui o trabalho de tentar adivinhar o comportamento do usuário e fazer suposições baseadas em pesquisas. No caso do website, o design geral deve refletir a maneira como os usuários entendem o assunto e de que forma eles esperam encontrar as informações que precisam. Para Duyne, Hong e Landay (2011, tradução nossa), o critério para se construir um website centrado no usuário é fornecer uma experiência positiva para todos os usuários, estejam eles procurando informações, querendo participar de alguma comunidade, buscando algum produto para compra ou apenas buscando entretenimento. O design centrado no usuário aumenta o valor do website através de um melhor design e validação. É sobre simpatizar com os usuários - o quão bem você compreende suas necessidades, as

1 Acrônimo

do original em inglês User Centered Design

35 ferramentas e tecnologias que eles usam, e seu contexto social e organizacional. É sobre como você usa essa compreensão para moldar o seus designs e testá-los para assegurar que as necessidades dos usuários foram contempladas (DUYNE; HONG; LANDAY, 2011, p.06, tradução nossa).

Figura 1 – Gráfico relacionando os conceitos chaves dentro da metodologia do design centrado no usuário. Fonte: Duyne, Hong e Landay (2011).

A metodologia de desenvolvimento de projetos centrados nos usuários, segundo Duyne, Hong e Landay (2011, tradução nossa), levam em conta conhecimentos pertencentes as diferentes áreas, definidos pelos seguintes conceitos: facilidade de uso, performance, valor de marca, satisfação e conteúdo. Garrett (2011, tradução nossa) discorre sobre a diferença entre projetar um produto e projetar uma experiência, já que todo produto destinado aos humanos possui um usuário final e

36

este usuário, ao utilizar o produto, obterá uma experiência durante o processo de uso. Neste ponto, entramos na área de estudo do design de experiência. O UCD considera todos os fatores da experiência dos usuários: cultural, social, cognitivo e físico. Esta abordagem apresenta uma vantagem estratégica, pois gera um entendimento mais profundo do usuário e permite a oportunidade de estabelecer relacionamentos a longo prazo, resultando em uma maior lealdade dos consumidores, ressonância da marca e vantagem estratégica sobre os competidores. Além disso, o fato de se abordar o comportamento dos usuários enquanto estes interagem com um produto ou serviço dentro de seu contexto da vida real, o design centrado no usuário expõe as necessidades que nem eles mesmos estavam cientes ou que não poderiam articulá-las, gerando melhorias não óbvias ao desenvolvimento de produtos e serviços verdadeiramente inovadores (KALBACH, 2009). Segundo Norman (2006), o design centrado no usuário é uma filosofia baseada nas necessidades e nos interesses das pessoas e deve dar atenção especial à questão de fazer produtos compreensíveis e facilmente utilizáveis. Segundo o autor, o design deve assegurar que o usuário pode descobrir o que fazer e que ele tenha condições de saber o que está acontecendo. [...] usuários reais e suas metas, não apenas a tecnologia, deveriam constituir força condutora por trás do desenvolvimento de um produto. Como consequência, um sistema bem projetado deveria extrair o máximo de habilidade e dos julgamentos humanos e ser diretamente relevante para o trabalho em questão. Deveria apoiar o

37 usuário, e não limitar suas ações. Tudo isso implica muito menos técnica e mais filosofia (PREECE; ROGERS; SHARP, 2005, p.305).

2.2 DESIGN DE INTERAÇÃO O design de interação se preocupa em desenvolver produtos interativos que sejam utilizáveis, ou seja, produtos fáceis de aprender, eficazes no seu uso e que proporcionem uma experiência agradável ao usuário. E para projetar produtos interativos usáveis há que se levar em conta quem irá utilizá-los e onde estes produtos serão utilizados. Para Preece, Rogers e Sharp (2005), é importante compreender também os tipos de atividades que serão realizadas quando as pessoas estiverem interagindo com estes produtos, pois isto permitirá compreender os suportes necessários aos diferentes tipos de interfaces e planejamento de dispositivos de entrada e saída de informação. A questão fundamental do design de interação é como otimizar as interações do usuário com o sistema, ambiente ou produto, de forma que combinem com as atividades que estão sendo estendidas ou recebendo suporte. Para isto, o processo envolve considerar no que as pessoas são boas ou não; o que pode auxiliar as pessoas na sua atual maneira de fazer as coisas; proporcionar experiências de qualidade ao usuário; e ouvir o que as pessoas querem e envolvê-las no design (PREECE; ROGERS; SHARP, 2005). 2.2.1 Princípios de design de interação Uma maneira de se avaliar a qualidade de um design é a habilidade que uma solução encontrada tem de cumprir com as

38

necessidades e objetivos dos usuários bem como as metas da empresa e as restrições técnicas do sistema dentro do qual aquele design está sendo desenvolvido e futuramente implementado. Porém, é possível afirmar que existem caminhos diversos para se chegar em uma solução ótima de design e que para isso podem ser definidos atributos que sirvam de guias para se atingir um resultado bem-sucedido. Com isto, Cooper, Reimann e Cronin (2007, tradução nossa) listam algumas regras, às quais ele nomeou de princípios de design de interação, que servem de guias aplicáveis dentro dos temas de comportamento, forma e conteúdo. Estes princípios são, em efeito, uma configuração de regras baseadas em nossos valores como designers e em nossas experiências ao tentar viver sob esses valores. No núcleo desses valores está a noção de que a tecnologia deve servir à inteligência e imaginação humana (em vez do oposto), e que as experiências das pessoas com a tecnologia deve ser estruturada de acordo com suas habilidades de percepção, cognição e movimento (COOPER; REIMANN; CRONIN, 2007, p.150, tradução nossa).

- Valores do design: descrevem ordens para a prática ética e efetiva do design. - Princípios conceituais: ajudam a definir o que é um determinado produto e como ele se encaixa dentro do contexto requerido pelos seus usuários.

39

- Princípios comportamentais: descrevem como um produto deve se comportar, de maneira geral, e em situações específicas. - Princípios a nível de interface: descrevem estratégias para a comunicação visual do comportamento e informação. 2.2.2 Aplicações do design de interação Segundo Preece, Rogers e Sharp (2005, p.33), o processo de design de interação envolve quatro atividades básicas: 1.

Identificar necessidades e estipular os requisitos.

2.

Criar designs alternativos que contemplem esses requisitos.

3.

Construir protótipos.

4.

Avaliar o desenvolvimento durante todo o processo.

2.2.2.1 Necessidades e requisitos Identificar as necessidades consiste em compreender o máximo possível os usuários, seu trabalho e contexto, de maneira a fornecer suporte ao desenvolvimento do projeto na realização dos objetivos estabelecidos. A partir disto, é possível construir um conjunto de requisitos estáveis que sirvam de base para se pensar o design. Para se chegar neste conjunto de requisitos é necessário, primeiramente, realizar algumas atividades como a coleta de dados, sua interpretação e análise, cuja estrutura de referência irá afetar os requisitos que serão extraídos. “Na prática, os requisitos evoluem e se desenvolvem conforme os stakeholders interagem com os designs e enxergam o que é possível e

40

como certas coisas podem ajudá-lo” (PREECE; ROGERS; SHARP, 2005, p.223). Nota-se que esta primeira atividade está inserida no segundo plano da metodologia de cinco planos sugerida por Garrett (descrita com mais detalhes no item 2.3.3), a qual serve de base para o desenvolvimento deste projeto. Este plano, o chamado plano de escopo, é construído com base nas necessidades do projeto identificadas no Briefing, onde se estabelecem os requisitos de conteúdo e as funcionalidades para firmar a viabilidade e a executabilidade do projeto. As demais tarefas complementam-se umas às outras e sempre se repetem ao longo de todo o desenvolvimento do website. Afinal, assegurar-se que o produto é usável e avaliar tudo o que foi construído está no centro do design de interação (PREECE; ROGERS; SHARP, 2005). Garrett (2011, tradução nossa) afirma que o nível de detalhe de cada requisito vai depender do escopo do projeto. No entanto, a fonte mais produtiva para estabelecer os requisitos do projeto serão sempre seus usuários e, com certa frequência, os stakeholders. Lembrando que os requisitos de conteúdo de um projeto apresentam implicações de funcionalidades e vice-versa. É preciso pensar nos dois lados no momento de traçar o escopo do projeto a fim de estabelecer os requisitos e funcionalidades corretos a partir das necessidades identificadas previamente. A divisão entre a Web como um veículo pela funcionalidade e a Web como um meio de informação começa a se estabelecer no plano do escopo. No lado da funcionalidade, estamos preocupados com o conjunto de recursos do

41 produto. No lado da informação, estamos lidando com conteúdo, o tradicional domínio dos grupos editoriais e de comunicações de marketing (GARRETT, 2011, p.62, tradução nossa).

2.2.2.2 Propostas alternativas aos requisitos do projeto Esta é a atividade na qual se sugerem ideias que atendam aos requisitos. Para Preece, Rogers e Sharp (2005), ela pode ser dividida em design conceitual e design físico, onde a primeira opção produz o modelo conceitual para o produto (o que o produto deve fazer, como se comportar e como parecer) e a segunda se preocupa com os detalhes físicos, tais quais as cores, sons e imagens, por exemplo. Criando-se um paralelo ao projeto de desenvolvimento de website do Abayomi, nota-se que o design conceitual corresponde ao primeiro plano da metodologia de Garrett, o plano estratégico, e o design físico corresponde ao último plano, o plano da superfície. 2.2.2.3 Protótipos A maneira que os usuários têm de avaliar algum produto interativo é, obviamente, interagindo com ele. Esta atividade corresponde, portanto, às alternativas criadas para gerar protótipos eficazes e economicamente viáveis para a identificação de problemas que possam surgir durante os primeiros estágios de desenvolvimento. Através da simulação, os usuários poderão ter uma noção real de como será interagir com o produto (PREECE; ROGERS; SHARP, 2005). Um protótipo pode ser um pedaço de papel, uma simulação em vídeo de uma tarefa, uma “fotografia” eletrônica, uma maquete, uma

42

pilha de telas vinculadas por hyperlinks, entre muitas outras alternativas. Na verdade, um protótipo é qualquer coisa que possibilite os stakeholders a interagirem com o produto imaginado, visando as possiblidades de utilizá-lo em um ambiente real, como afirmaram Preece, Rogers e Sharp (2005). Os protótipos são úteis porque facilitam a comunicação entre membros da equipe, fornecem suporte aos designers para escolher uma dentre várias opções, testam a viabilidade técnica de uma ideia, realizam testes e avaliações com usuários, entre outras verificações. Segundo Duyne, Landay e Hong (2011, tradução nossa), a rápida prototipação durante o desenvolvimento de um projeto de website é um princípio chave dentro do design interativo pois possibilita que rascunhos sejam feitos a fim de oferecerem um feedback bastante útil e rápido para o resultado. Dentre as possibilidades de prototipação rápida os autores citam os mapas de site, storyboard e esquemas. Um mapa de site é um diagrama que representa a sua estrutura geral. É usado com o intuito de exibir a navegação através do website bem como a arquitetura da informação enquanto a mesma é construída.

43

Figura 2 - Exemplo de um mapa de site. Fonte: Duyne, Hong e Landay (2011).

44

Figura 3 - Outro exemplo de um mapa de site. Fonte: Duyne, Hong e Landay (2011).

Storyboard é uma sequência de páginas Web demonstrando como o usuário cumprirá uma determinada tarefa, ilustrando importantes sequências interativas e o fluxo através do website. Esta técnica gera uma narrativa que complementa o cenário desenvolvido previamente para o usuário, ou ao menos uma pequena parte dele.

45

Figura 4 - Exemplo de um storyboard. Fonte: Duyne, Hong e Landay (2011).

Esquemas são representações do layout e do conteúdo que irão aparecer nas páginas individuais. Os elementos do layout tais quais as cores e fontes ainda são preliminares, não fornecendo uma decisão final, mas que serve de aviso ao designer gráfico sobre as áreas que deverão ser destacadas ou agrupadas, por exemplo.

46

Figura 5 - Exemplos de esquemas. Fonte: Duyne, Hong e Landay (2011).

2.2.2.4 Vantagens ao se avaliar designs A avaliação do design determina a usabilidade e a aceitabilidade do produto e é medida através de vários critérios, entre eles a incidência de erros dos usuários, a atratividade do design ou produto, a facilidade de aprendizagem, a consistência, entre outros. O design de interação exige um alto nível de participação dos usuários no desenvolvimento, pois aumenta as chances de se entregar um produto aceitável (PREECE; ROGERS; SHARP, 2005). Tognazzini (apud PREECE; ROGERS; SHARP, 2005) aponta boas razões para se investir em testes com os usuários, entre elas:

• Os problemas são consertados antes do produto ser lançado;

47

• A equipe se concentra em problemas reais, não em imaginários; • O tempo para que o produto entre no mercado é menor. Assim como os designers não devem assumir que todos são como eles, também não deveriam presumir que ao seguir as recomendações (guidelines) seja uma garantia de boa usabilidade para o design. A avaliação é necessária para certificar-se de que os usuários podem vir a utilizar o produto e, de fato, apreciá-lo. É interessante perceber que essas três atividades, de desenvolver designs alternativos, construir versões interativas de designs e a avaliação destes, estão entrelaçadas umas às outras durante todo o desenvolvimento. “As alternativas são avaliadas por meio das versões interativas dos designs, e os resultados são utilizados para alimentar futuros designs” (PREECE; ROGERS; SHARP, 2005, p.190). 2.2.3 Construindo personas Cooper, Reinmann e Cronin (2007, tradução nossa) afirmam que a melhor maneira de acomodar a variedade de usuários que existem dentro do público-alvo do seu design é especificar os tipos individuais de usuários com suas necessidades específicas, em vez de tornar a funcionalidade do produto tão genérica quanto a sua audiência. Quando se estende a funcionalidade de um produto a fim de incluir genericamente todas as pessoas do seu público-alvo, aumenta-se a carga cognitiva e de navegação para todos os usuários, ou seja, os aspectos que facilitarão alguns poderão interferir na satisfação de outros. A primeira abordagem a se fazer é escolher quais são os indivíduos certos para se projetar, ou seja, aqueles usuários cujas

48

necessidades melhor representam as necessidades de uma gama maior de indivíduos. Deve-se priorizar estes indivíduos de maneira que as necessidades dos usuários mais importantes sejam supridas sem comprometer as necessidades de usuários secundários. As personas são importantes porque fornecem uma ferramenta poderosa de comunicação sobre os diferentes tipos de usuários e suas necessidades, para então decidir em quais usuários focar na forma e comportamento do design (COOPER; REIMANN; CRONIN, 2007, tradução nossa). A ferramenta personas possui um caráter de múltiplos propósitos, ajudando a ultrapassar diversos problemas que aparecem no desenvolvimento de produtos digitais. Segundo os autores, é vantajoso usá-la em um projeto porque: - Determina o comportamento do produto através das metas e tarefas traçadas para cada persona; - Comunica com stakeholders, desenvolvedores e outros designers. As personas fornecem uma linguagem comum para a discussão das decisões de design e ajudam a manter o design centrado nos usuários durante todos as etapas do processo; - Constrói consenso e comprometimento ao design através de uma linguagem comum. A persona reduz a necessidade de criar modelos elaborados de diagramas pois é fácil compreender as diversas nuances do comportamento dos usuários através de estruturas de narração e, principalmente, porque as personas assemelham-se as pessoas reais, tornandose fácil de se relacionar com elas. - Mede o quão efetivo é o design, pois as escolhas podem ser testadas em uma persona da mesma maneira em que elas podem ser mostradas a um usuário real durante o processo.

49

Isto não substitui a necessidade de testes com usuários reais, no entanto fornece uma maneira bastante eficaz de resolver os problemas de design. - Contribui para aplicações relacionadas ao produto como o marketing e o planejamento de vendas, bem como na estrutura organizacional de uma empresa e em outras atividades de planejamento estratégico. Garrett (2011, tradução nossa) reafirma a importância do uso das personas no projeto pois quando se coloca um nome e um rosto em um grupo de informações coletadas garante-se que os usuários não serão esquecidos durante o processo, como às vezes acontece quando se tem diferentes tipos de dados coletados em pesquisas e os mesmos são traduzidos apenas em estatísticas. As personas são personagens fictícios gerados a partir de pesquisas sobre os usuários, os quais representam as necessidades de uma gama de usuários reais e que servem de exemplo de estudos de caso durante o desenvolvimento do website.

50

Figura 6 - Exemplo simples de uma aplicação de personas, um carro projetado para cada tipo de usuário. Fonte: Cooper, Reimann e Cronin (2007).

51

Figura 7 - Exemplo de personas voltadas para o desenvolvimento de website. Fonte: Garrett (2011).

52

2.2.4 Descrevendo tarefas através de cenários As descrições de tarefas foram utilizadas por muitos anos nos desenvolvimentos de software e nas décadas de 70 e 80 eram muito empregadas para teste de aceitação, ou seja, elas constituíam a última fase de teste antes do cliente “aceitar” e pagar pelo sistema. Preece, Rogers e Sharp (2005) afirmam que, mais recentemente, devido à ênfase de envolver os usuários desde cedo no desenvolvimento de um projeto e também ao grande número de máquinas interativas desenvolvidas, as descrições de tarefas passaram a ser usadas durante todo o desenvolvimento, desde o levantamento de requisitos até a etapa de prototipação, avaliação e teste. Duyne, Landay e Hong (2011, tradução nossa) falam da importância de se compreender as tarefas realizadas pelos usuários quando os mesmos utilizam um website através de catálogos e roteiros que descrevam essas ações. A descrição da tarefa deve definir o que o usuário deseja realizar, mas não a maneira como ele ou ela deverá cumprir a tarefa. Entendendo as tarefas é possível pensar criticamente em como o website pode otimizar ou até mesmo aumentar essas tarefas que são realizadas pelos usuários. Existem diferentes tipos de descrições de tarefas, no entanto, este projeto tratará apenas da descrição de cenários, pois eles representam uma maneira efetiva de refletir uma grande quantidade de informações descobertas durante a fase de pesquisa e do Briefing. Ao criar cenários, é possível descrever detalhadamente o que o website deverá fazer a partir da perspectiva do usuário, além de ser uma forma de comunicar rapidamente para uma equipe de desenvolvimento ou para stakeholders a sua visão de como o website será usado (KALBACH, 2009).

53

O cenário é uma descrição narrativa informal que “descreve as atividades ou tarefas humanas em uma história que permite a exploração e discussão de contextos, necessidades e requisitos” (PREECE; ROGERS; SHARP, 2005, p.243). Ao contarem histórias, as pessoas conseguem explicar de maneira natural aquilo que estão realizando. Dessa forma, o cenário se apresenta como um procedimento que os stakeholders podem facilmente empregar, mesmo que o foco de tais histórias sejam sobre o que os usuários estão tentando realizar, ou seja, seus objetivos. Segundo Duyne, Landay e Hong (2011, tradução nossa), é através da análise prévia sobre as tarefas que se criam os cenários com o intuito de ilustrar o porquê das pessoas utilizarem o seu website. Os cenários são estórias contextualizadas que focam muito mais no que as pessoas realizarão do que na maneira de como a tarefa irá se realizar. Ele relata detalhes sobre os usuários e suas características, as tarefas que eles pretendem cumprir e o contexto no qual estão inseridos ao utilizar o website. 2.2.6 Objetivos do design de interação As autoras Preece, Rogers e Sharp (2005) colocam em questão a clareza do objetivo principal como parte do processo de entender as necessidades do usuário ao projetar um sistema interativo. Esse sistema deverá ser eficiente, permitindo aos usuários serem altamente produtivos em suas tarefas, ou deverá se projetar um sistema motivador que desafie o usuário e forneça suporte para um aprendizado eficaz? Estas preocupações são denominadas “metas de usabilidade” e “metas decorrentes da experiência do usuário”, cujas diferenças são apenas no modo como são operacionalizadas, ou seja, como podem ser atingidas e através de que meios.

54

As metas de usabilidade estão preocupadas em cumprir critérios específicos que asseguram que os produtos são fáceis de usar, eficientes e agradáveis para a perspectiva do usuário. Já as metas decorrentes da experiência do usuário estão preocupadas em explicar a qualidade da experiência desta através de produtos interativos agradáveis, divertidos e esteticamente apreciáveis, por exemplo. Para que se entenda melhor ambos conceitos de usabilidade e experiência do usuário, estes serão abordados a seguir com mais aprofundamento sobre o assunto. 2.3 DESIGN DE EXPERIÊNCIA Design de experiência é uma área multidisciplinar cujo objetivo é envolver o usuário em um ambiente criado em torno de um conceito (ALMEIDA et al, 2007). No desenvolvimento de um website, a experiência do usuário deve ser relevante durante o processo a fim de criar uma relação para com o usuário, segundo Mulling e Pereira (2011). Todas as experiências de um usuário deveriam ser resultado de uma decisão consciente da sua parte, afirma Garrett (2011, tradução nossa), e o processo de design centrado no usuário garante que essas escolhas surjam de um planejamento para que as mesmas não aconteçam de forma inesperada. A experiência do usuário, portanto, é a forma como o produto se comporta e como é usado no mundo real, ou seja, além de atentar para as funcionalidades e recursos, também se deve perceber como será o contato do usuário com o produto. Segundo Norman (2004), o nosso sistema cognitivo e emocional opera em três níveis distintos, mas que interagem entre si: visceral, comportamental e reflexivo. O nível mais básico corresponde à reação visceral e imediata ao se deparar com a aparência de um objeto. Este nível pode ser relacionado ao Plano da Superfície ditado por Garrett

55

(2011, tradução nossa) como a última etapa a ser desenvolvida no projeto do website, no entanto, a primeira com que o usuário vai se relacionar. O nível comportamental diz respeito à própria experiência com o produto, levando em conta a função, o desempenho e a usabilidade, ou seja, ao prazer e a efetividade do uso. E o último nível, o reflexivo, é quando ocorrem a interpretação, compreensão e o raciocínio, sendo bastante vulnerável à variabilidade da cultura, experiência, grau de instrução e diferenças individuais.

As tecnologias da comunicação e informação evoluíram [...] nos oferecendo uma coleção de frustrações e prazeres. Embora sejam muito importantes em nossas vidas, os relacionamentos que mantemos com esses artefatos tecnológicos, muitas vezes, nos levam a extremos de amor ou ódio. Essas e outras emoções vão diferenciar, o que nos agrada, satisfaz, dá prazer, daquilo que nos desagrada, que nos deixa insatisfeitos, causa desprazer, desencadeando em nós afetos ora positivos, ora negativos (SILVA, 2011, p.54).

Existe uma outra distinção entre os níveis de emoção descritos por Norman (2004), que é o tempo. Os dois níveis inferiores, o visceral e o comportamental, operam apenas pelo afeto, sem interpretação ou consciência, ou seja, a relação temporal deles é com o “agora”. Eles se referem aos sentimentos e experiências enquanto se está de fato vendo ou usando um produto. Já o nível reflexivo se estende por muito mais tempo, pois tem a ver com relações de longo prazo, com os sentimentos de satisfação produzidos por ter, exibir e usar um produto. Todos esses

56

três níveis de emoção e cognição traduzem a experiência do usuário ao interagir com um produto dentro de um contexto social, cultural e econômico. 2.3.1 Aspectos da experiência do usuário A experiência do usuário abarca muitas áreas de pesquisas distintas e cada disciplina aborda diferentes pontos de vista acerca do tema. Roto (2007, tradução nossa) tenta formular uma definição sobre UX 2 que agrade a todos passando por diversas definições já existentes sobre o tema, porém o autor conclui que são poucas as definições que comunicam o fato fundamental de que a experiência do usuário é algo que acontece dentro da pessoa. A diferença entre usabilidade e UX, de acordo com Roto (2007, tradução nossa) é que a primeira se apresenta como um atributo do produto em si e a segunda, uma sensação pessoal e subjetiva em relação àquele produto. Antes mesmo de uma pessoa começar a interagir com um produto, certamente ela já possui expectativas sobre ele. Entretanto, até a interação com este produto iniciar de fato, não se pode falar sobre experiência do usuário. Isto quer dizer que a UX é vista como uma emoção momentânea e portanto, seguindo a lógica, pode ser validada e estudada através de medidas psicológicas. No entanto, Roto (2007, tradução nossa) declara que esse foco na interação do usuário com o produto é uma visão muito limitada da experiência do usuário, pois esta pode mudar mesmo quando não se está interagindo com o produto. O usuário pode obter novos insights sobre determinado produto ao adquirir

2 Abreviação

usuário.

do termo em inglês User Experience, que significa experiência do

57

novas informações relacionadas a ele. Sob a perspectiva industrial, porém, é a experiência do usuário a longo prazo que interessa para o sucesso de um projeto, e não uma emoção momentânea que pode, no final das contas, tornar-se insignificante para o próprio usuário. No entanto, isto não significa que para atingir essa experiência a longo prazo os processos anteriores não se façam importantes ou, até mesmo, necessários. Somente a partir das experiências momentâneas adquiridas através da interação com o produto, bem como os insights que surgem ao longo do processo, uma experiência a longo prazo é construída. 2.3.2 Metas decorrentes da experiência do usuário Ao passo de que novas tecnologias oferecem maiores oportunidades para fornecer suporte às pessoas em seu cotidiano, os profissionais e pesquisadores começaram a considerar outras metas decorrentes da experiência do usuário (PREECE; ROGERS; SHARP, 2005). A emergência das tecnologias (tais quais a web e a computação móvel) inseridas em novas áreas de diversas aplicações (como o entretenimento, a cultura e a educação), trouxe à tona uma gama muito maior de interesses.

58

Figura 8 - Gráfico relacionando as metas de usabilidade com as metas de experiência do usuário. Fonte: Preece, Rogers e Sharp (2005).

Como pode ser analisado na figura acima, no círculo externo são mostradas as metas decorrentes da experiência do usuário que, como pode ser percebido, são menos claramente definidas. Além de enfocarem na melhoria da eficiência e produtividade no trabalho, também se preocupa cada vez mais com a criação de sistemas que sejam: satisfatórios; agradáveis; divertidos; interessantes; úteis; motivadores;

59

esteticamente apreciáveis; incentivadores de criatividade; compensadores e emocionalmente adequados. O objetivo de desenvolver produtos interativos agradáveis, divertidos, esteticamente apreciáveis. etc. está principalmente na experiência que estes proporcionarão ao usuário, isto é, como o usuário se sentirá na interação com o sistema. Isso envolve explicar a natureza da experiência do usuário em termos subjetivos (PREECE; ROGERS; SHARP, 2005, p.40).

2.3.3 Elementos da experiência do usuário A teoria de Jesse James Garrett, segundo Mulling e Pereira (2011), é relacionada aos elementos da experiência do usuário determinados por cinco planos conceituais, abordando mais enfaticamente os processos físicos da construção de um website:

o

Plano de Estratégia: define as necessidades dos usuários e os objetivos do produto através das pesquisas e levantamento de dados.

o

Plano de Escopo: construído com base nas estratégias, então precisa atender aos objetivos do site e as necessidades dos usuários. Para definir o escopo, no entanto, é preciso considerar a viabilidade e a executabilidade do projeto.

o

Plano de Estrutura: define como que os resultados alcançados nas etapas anteriores se encaixam em um

60

todo coeso, através do design de interação e Arquitetura da Informação.

o

Plano de Esqueleto: define a forma que as funcionalidades especificadas no plano anterior tomará. Os conceitos e práticas de design de interface, de navegação e de informação serão abordados nesta etapa.

o

Plano de Superfície: abordará a parte sensorial do projeto e a apresentação visual dos arranjos determinados na etapa do Esqueleto.

61

Figura 9 - Os cinco planos de construção de um website sob a perspectiva da experiência do usuário. Fonte: Garrett (2011).

Garrett (2011, tradução nossa) afirma que o processo do design de experiência garante que nenhum aspecto decorrente da experiência do usuário com o seu website irá ocorrer sem a sua consciência, sem você tê-lo planejado. Isto significa que se deve levar em conta qualquer possibilidade de qualquer ação que o usuário poderá cometer e também compreender as suas expectativa em todas as etapas durante o processo de construção website. Esta teoria construída baseada nos cinco planos

62

fornece uma estrutura conceitual para se abordar os problemas provenientes da experiência do usuário e as ferramentas necessárias para resolvê-los. Pode-se notar pela figura acima demonstrada que cada plano é dependente do plano que se apresenta logo abaixo, o que o autor chama de uma estrutura bottom to top (em inglês, de baixo para cima). Dessa forma, o processo de desenvolvimento do website resulta de um grande conjunto de decisões sobre a sua aparência, comportamento, tarefas que se pode realizar, etc. e que sempre refletirão nas etapas seguintes do projeto. A cada plano avançado, as questões tornam-se menos abstratas e mais concretas, partindo da estratégia para a superfície. Porém, devido a superficialidade do autor ao tratar do tema, serão acrescentados mais ferramentas do que as apresentadas pelo mesmo para compor cada etapa do trabalho de desenvolvimento do website do Abayomi. 2.4 USABILIDADE Nielsen (1993) afirma que a usabilidade define se um sistema é bom o suficiente para satisfazer todas as necessidades e requisitos dos usuários e de outros stakeholders em potencial. Segundo Preece, Rogers e Sharp (2005), a usabilidade procura estabelecer critérios para avaliar a aceitabilidade de um sistema. E a aceitabilidade geral de um sistema computacional é uma combinação de sua aceitabilidade social e sua aceitabilidade prática, de acordo com Nielsen (1993). Dado que um sistema é socialmente aceitável, pode-se analisar sua aceitabilidade prática através de algumas categorias, tais quais custo, suporte, confiabilidade, compatibilidade, etc.

63

Figura 10 – Modelo de atributos da aceitabilidade de um sistema. Fonte: Nielsen (1993).

!

Usefulness3 é quando um sistema pode ser usado para atingir

um determinado objetivo e pode ser dividido em duas categorias: utilizabilidade e usabilidade. A utilizabilidade do sistema diz respeito a sua funcionalidade, se ela é capaz de realizar aquilo para o qual foi destinada desde o princípio, e a usabilidade é o quão bem os usuários utilizarão essa funcionalidade (NIELSEN, 1993, tradução nossa). Por conta da grande quantidade de sites e informação disponível aos usuários, todos os dias, a internet virou uma ferramenta de rotina, a qual será usada somente se lhe for conveniente, como afirma Nielsen (2006, tradução nossa). Com isso, a usabilidade assumiu um papel criterioso no momento de definir o sucesso de um website, sob a perspectiva do usuário querer permanecer na página e realizar as tarefas que lhe são desejadas ou necessárias. A usabilidade, no entanto, não é 3

Segundo a tradução do dicionário on-line Bab.la, usefulness significa “utilidade”. http://pt.bab.la/dicionario/ingles-portugues/usefulness

64

uma propriedade unidimensional da interface do usuário e por isso possui múltiplos componentes que estão associados aos seguintes atributos: - Aprendizagem: o sistema deve ser fácil de ser aprendido, assim o usuário pode iniciar o seu trabalho de maneira mais rápida. - Eficiência: o sistema deve ser eficiente no seu uso, de maneira que o usuário tenha um alto nível de produtividade uma vez que ele tenha aprendido a operar o sistema. - Memória: o sistema deve ser fácil de ser lembrado para que os usuários possam retornar ao mesmo depois de um certo período sem utilizá-lo, sem ter que aprender tudo de novo. - Erros: o usuário deve cometer o menor números de erros possíveis durante o uso do sistema e mesmo cometendo erros ele deverá ser capaz de recuperar as informações facilmente. Ainda, erros catastróficos não devem ter chances de serem cometidos. - Satisfação: o sistema deve ser agradável ao uso, para que os usuários estejam subjetivamente satisfeitos enquanto o fazem, que gostem do sistema. A usabilidade apresenta relatividade pois é medida em relação a certos tipos de usuários e de tarefas. Mesmo que não se tenha a intenção de realizar estudos formais para medir os atributos de um sistema, é um grande exercício considerar como cada um desses atributos podem ser medidos (NIELSEN, 1993, tradução nossa).

65

2.4.1 As dez heurísticas da usabilidade “Os princípios de design, quando usados na prática, normalmente são chamados de heurísticas. Esse termo enfatiza que algo deve ser feito com esses princípios, quando aplicados a um dado problema”, afirmam Preece, Rogers e Sharp (2005, p.48). O termo enfatiza que algo deve ser feito com esses princípios mas que precisam ser interpretados no contexto do design e utilizando-se experiências já realizadas previamente. Jakob Nielsen (1993, tradução nossa) apresenta em seu livro “Usability Engineering” um conjunto de dez heurísticas: 1.

Visibilidade do status do sistema: o sistema mantém sempre os usuários informados sobre o que está acontecendo, através de feedback apropriado dentro de um tempo razoável.

2.

Compatibilidade do sistema com o mundo real: o sistema fala o idioma dos usuários, com palavras, frases e conceitos familiares, ao invés de termos orientados ao sistema. Convenções do mundo real são utilizadas, seguindo uma ordem lógica e natural para as informações aparecerem.

3.

Controle do usuário e liberdade: os usuários muitas vezes se enganam na escolha de funções e precisam de “saídas de emergência” claramente identificadas sem ter que passar por um extenso diálogo.

4.

Consistência e padrões: os usuários devem seguir as convenções da plataforma sem ter que imaginar se palavras, ações ou situações diferentes significam a mesma coisa.

5.

Prevenção de erros: consiste em eliminar a ocorrência de erros, sempre que possível. Uma maneira de fazer é isso é fornecer ao

66

usuário uma opção de confirmação antes de realizar a tarefa ou, melhor ainda, projetar um design cuidadoso que previna que os erros aconteçam em primeiro lugar. 6.

Ajuda a reconhecer, diagnosticar e recuperar-se de erros: mensagens de erro devem ser expressadas em linguagem simples para descrever a natureza do problema e sugerir uma maneira de resolvê-lo.

7.

Reconhecimento em vez de memorização: minimizar a carga de memória do usuário tornando objetos, ações e opções visíveis.

8.

Flexibilidade e eficiência no uso: fornece aceleradores irrelevantes aos usuários novatos que, no entanto, permitem aos usuários mais experientes realizarem tarefas com mais rapidez. Deve-se atender a todos os tipos de usuários, permitindo que eles personalizem ações frequentes.

9.

Estética e design minimalista: evita o uso de informações desnecessárias. Unidades extras de informação em um diálogo competem com as unidades relevantes e diminuem sua visibilidade.

10.

Ajuda e documentação: informação que deve ser fácil de procurar, focada na tarefa do usuário, através de uma série de passos concretos, não muito grandes, e que sejam facilmente seguidos.

67

2.4.2 Usabilidade Universal A meta para o acesso universal 4 à informação e serviços de comunicação é bastante convincente e muitos entusiastas da tecnologia, inovadores, líderes de empresas e políticos enxergam um enorme benefício e diversas oportunidades a partir do seu uso difundido, afirma Shneiderman (2000, tradução nossa). Entretanto sempre surgirá a difícil questão de como a informação e os serviços de comunicação poderão ser criados e usados por todos os cidadãos, sem discriminação. Se projetar algo já é bastante difícil para usuários experientes, imagine o desafio que é projetar design para uma vasta audiência de usuários inexperientes. O termo acesso universal tem sido aplicado aos serviços de computadores Web-based 5 porém sua maior complexidade é que o acesso aos seus serviços não assegura um uso bem-sucedido por parte dos seus usuários. Por conta disto, o termo usabilidade universal emergiu como um importante tópico para as pesquisas da área computacional. A complexidade surge, em parte, pelo alto grau de interatividade que se faz necessário para explorar a informação, as aplicações comerciais e outras atividades criativas. Dessa forma, a Internet torna-se convincente pelo seu suporte às comunicações interpessoais e iniciativas descentralizadas: empreendedores podem abrir um negócio, jornalistas podem iniciar publicações e cidadãos 4

O termo acesso universal provém do Ato das Comunicações dos Estados Unidos de 1934, que se refere ao telefone, telégrafo e serviços de rádio. O ato assegura “estrutura adequada a encargos razoáveis” e previne a “discriminação de raça, cor, religião, nacionalidade ou sexo”. 5

Sistemas web-based são aqueles executados através de navegadores de páginas web, tais como Firefox, Google Chrome, Internet Explorer. (http:// www.linceweb.com.br/produtos-e-servicos/sistemas-web-based)

68

podem organizar movimentos políticos (SHNEIDERMAN, 2000, tradução nossa). A grande diversidade das habilidades humanas, seus contextos, motivações, personalidades, culturas e estilos de trabalho servem para desafiar os designers de interface. É importante compreender as diferenças físicas, intelectuais e de personalidade dos seus usuários para que se possa atingir o objetivo mais fundamental: atender as necessidades de todos os usuários (SHNEIDERMAN, 2005, tradução nossa). 2.5 DESIGN DE INTERFACE Um sistema interativo possui um bom projeto de design quando a sua interface praticamente desaparece, permitindo ao usuário se concentrar no seu trabalho, na exploração do conteúdo e no seu prazer. Para isso, é preciso criar um ambiente cujas tarefas a serem realizadas sejam fluídas e não haja esforços, proporcionando sentimentos positivos de sucesso, competência e clareza para os usuários (SCHNEIDERMAN, 2005, tradução nossa). 2.5.1 As oito regras de ouro para o design de interface Shneiderman (2005, tradução nossa) apresenta oito princípios, chamados “regras de ouro”, que são aplicáveis na maioria dos sistemas interativos, segundo o próprio autor. Esses princípios são derivados de experiência e foram refinados ao longo dos anos porém necessitam de validação e de harmonização dependendo do domínio específico do design. As regras de ouro são:

69

1.

Lutar pela consistência: essa regra é violada com frequência mas segui-la é um processo cansativo pois há diversas formas de consistência. Consistência em uma sequência de ações em situações similares; Terminologia idêntica devem ser usadas em textos, menus e telas de ajuda, etc.; Consistência nas cores, no layout, na capitalização, nas fontes, e assim por diante, deve ser empregado durante todo o desenvolvimento.

2.

Permitir a usabilidade universal: reconhecer as necessidades dos diversos usuários, facilitando a transformação de conteúdo. Todas as diferenças devem ser levadas em consideração para enriquecer o espectro opções de funcionalidades no design de interface.

3.

Oferecer informação de feedback: para cada ação do usuário, deve existir uma sistema de feedback. Para ações menores e mais frequentes a resposta pode ser mais modesta, para ações mais maiores e não tão frequentes a resposta deve ser mais substancial. A apresentação visual dos objetos de interesse oferece uma ambientação conveniente para demonstrar as mudanças explicitamente.

4.

Design de diálogos para fechamento: sequências de ações devem ser organizadas em grupos com um início, meio e fim, com um feedback informativo ao completar o grupo de ações. Isto fornece ao usuário uma satisfação de conquista, uma sensação de alívio e uma indicação para seguir para o próximo grupo de ações.

5.

Prevenir erros: projetar um sistema que previna aos usuários cometer erros graves, sempre que possível. Se o usuário

70

cometer um erro, o sistema deve detectá-lo e oferecer instruções simples e construtivas para a sua recuperação. 6.

Permitir reverter ações de maneira simples: sempre que possível, as ações devem ser reversíveis. Isto alivia a ansiedade, visto que os usuários sabem que os erros podem ser contornados, encorajando a exploração de opções não familiares.

7.

Fornecer suporte a um local interno de controle: usuários experientes gostam de saber que eles estão no controle do sistema através da resposta que a interface oferece às suas ações.

8.

Reduzir a carga de memória de curto prazo: a limitação da capacidade humana de memória de curto prazo faz com que as interfaces sejam simples e as múltiplas páginas sejam consistentes e consolidadas. Quando apropriado, abreviações, códigos e outras formas de comandos-sintaxe devem ser fornecidos. Estes princípios devem ser interpretados, refinados e estendidos para cada ambiente. Eles possuem suas limitações, mas fornecem um bom ponto de partida para celulares, desktop, ou web designers. Os princípios apresentados nas seções anteriores focam na melhora da produtividade dos usuários ao fornecer procedimentos simplificados, telas compreensíveis e rápido feedback informativo a fim de aumentar as sensações de competência, domínio, maestria e controle cobre o sistema (SHNEIDERMAN, 2005, p.75, tradução nossa).

71

2.5.2 Arquitetura da Informação Segundo os autores Morville e Rosenfeld (2006, tradução nossa), não existe uma definição única e sucinta para explicar o que é a arquitetura da informação e por isso é possível compreender porque é tão difícil projetar bons websites. Estamos falando dos desafios inerentes à linguagem e representação. Nenhum documento representa acuradamente o significado pretendido do seu autor. Nenhuma etiqueta ou definição captura totalmente o significado de um documento. E também não há como dois leitores experimentarem ou compreenderem um documento, definição ou rótulo particular exatamente da mesma maneira. A relação entre palavras e significados são confusas ao máximo (MORVILLE; ROSENFELD, 2006, p.24, tradução nossa).

A fim de esboçar uma definição inicial, os autores listam quatro aspectos: a. Design estrutural de informações compartilhadas. b. Combinação de organização, rotulação, busca e sistemas de navegação dentro de websites ou intranets. c. Arte e ciência de modelar informações e experiências que ajudem a usabiliade e a encontrar o que se procura. d. Disciplina emergente e comunidade de prática cujo foco é trazer princípios do design e arquitetura para a paisagem digital.

72

2.5.2.1 Usuário, conteúdo e contexto A base para um modelo efetivo da prática da arquitetura da informação se sustenta no seguinte tripé: usuário, conteúdo e contexto. Os websites não são construções estáticas e sem vida, mas muito pelo contrário, há uma natureza orgânica e dinâmica nos sistemas de informação e nos ambientes no qual eles existem. Utiliza-se o conceito de uma “ecologia da informação” composta por usuários, conteúdo e contexto para direcionar as dependências complexas coexistentes. Os três círculos da figura a seguir representam essa natureza interdependente dos usuários, conteúdo e contexto dentro de uma ecologia de informação adaptável e complexa ( MORVILLE; ROSENFELD, 2006, tradução nossa).

Figura 11 - Os três círculos da arquitetura da informação. Fonte: Morville e Rosenfeld (2006).

Contexto: Todo website está inserido em algum contexto organizacional. Mesmo de maneira implícita ou explícita, toda organização possui uma missão, metas, estratégia, uma equipe, procedimentos, infra-estrutura, orçamento e cultura únicas. Essa mistura

73

de capacidades permite que a arquitetura da informação também seja construída de forma a refletir essa unicidade de contexto. O vocabulário e a estrutura do seu website são os maiores componentes da conversa com seus clientes, parceiros e funcionários, pois influenciam as maneiras destes pensarem a respeito da empresa e dos seus produtos e serviços. Pode-se dizer que a arquitetura da informação fornece um rápido olhar bastante tangível sobre a missão, visão, valores, estratégias e cultura da sua organização. Conteúdo: O termo é empregado de forma ampla para se referir a documentos, aplicações, serviços, esquemas e metadados que as pessoas precisam encontrar ou utilizar no seu website. Além da informação textual, a Web também serve como ferramenta de transações e realização de tarefas, de compra e venda, configurações, cálculos, sorteios e simulações. Independente do seu caráter, qualquer website fornece algum “conteúdo” que os usuários serão capazes de encontrar. Usuários: As diferenças entre as preferências e comportamentos dos usuários no mundo real são traduzidas em diferentes necessidades de informação e comportamentos de busca por informações dentro de um contexto de um website. Por isso, é preciso sair e estudar os usuários reais em seus contextos reais a fim de compreender quem são os seus usuários, de que maneira eles utilizam o website e, mais importante, que tipos de informação eles querem encontrar no seu site (MORVILLE; ROSENFELD, 2006, tradução nossa).

2.5.2.2 Navegação A Web é baseada em um sistema de navegação cuja interação básica é clicar em links de hipertexto para circular por outros espaços de informação. Estes espaços são tão vastos que acabam tornando essa

74

navegação difícil para os usuários, tornando-se necessário um suporte navegacional (NIELSEN, 2000). Um dos maiores desafios de se projetar para a Web é que os usuários podem entrar no seu site através de caminhos muito diferentes. Eles, inclusive, talvez nem entrem pela página inicial e as suas tarefas e metas variam frequentemente de maneira muito ampla. Se alguma ferramenta de navegação do seu website for difícil de ser encontrada ou estiver faltando, é bem provável que o visitante se entediará e deixará o seu website (DUYNE; LANDAY; HONG, 2011, tradução nossa). Os autores Cooper, Reimann e Cronin (2007, tradução nossa) afirmam que uma navegação mal projetada representa um dos maiores problemas dentro da usabilidade de produtos interativos - desktop, Web based ou similares -, e a navegação de um website é onde o modelo de implementação de sua estrutura se torna mais aparente aos usuários. Os autores ainda destacam os variados níveis de navegação que podem existir, sendo eles: entre múltiplas janelas ou páginas; entre frames dentro de uma janela ou página; entre ferramentas, comandos ou menus e entre informações exibidas em um frame. Algumas formas efetivas de se melhorar a navegação do seu website, segundo Cooper, Reimann e Cronin (2007, tradução nossa), são: - Reduzir o número de lugares para se ir. - Fornecer sinalização. - Fornecer resumos. - Fornecer mapeamento apropriado dos controles das funções. - Inflexionar sua interface para suprir as necessidades dos usuários. - Evitar hierarquias.

75

De uma maneira bem simples, segundo Nielsen (2000), as interfaces de navegação precisam ajudar os usuários nas seguintes perguntas: - Onde estou? Os usuários nunca poderão entender a estrutura do site se não entenderem onde estão, nem mesmo compreender o significado do link que acabou de seguir. A localização do usuário precisa ser apresentada em dois níveis diferentes: com relação à Web como um todo e com relação à estrutura do site. - Onde estive? A tecnologia de Web padrão ainda não leva em conta o estado, sendo difícil para os designs das páginas detectarem por onde o usuário esteve anteriormente sem ter que recorrer aos cookies ou outras medidas de localização. Entretanto, existem alguns poucos mecanismos úteis que ajudam nessa questão, como o botão “Voltar”, presentes nos navegadores padrão, e a possibilidade de alterar a cor dos links de hipertextos que já foram clicados pelo usuário. - Aonde posso ir? É possível saber através das opções de navegação visíveis no website e de outros links na página. Além do mais, partindo do princípio que o usuário possui algum conhecimento da estrutura do site, ele pode saber dos lugares possíveis de ir, atualmente invisíveis. Sendo impossível mostrar todos os caminhos possíveis em todas as páginas, fica claro que uma boa estrutura de site torna-se um

76

grande benefício na hora de ajudar os usuários a responderem à pergunta “Aonde posso ir”.

77

3 ABAYOMI E A DANÇA AFRO EM FLORIANÓPOLIS 3.1 DANÇA AFRO EM FLORIANÓPOLIS 3.1.1 Formação social afro-descendente em Florianópolis Comparada a outras regiões do país, Florianópolis não é uma cidade brasileira que se caracteriza pelo seu predomínio de tradições africanas. Somente com a colonização açoriana no litoral catarinense, a partir do século XVIII, surgiram interesses de aproveitamento escravo trazidos da Bahia, Rio de Janeiro e da própria África que resultaram na chegada dos afro-descendentes no estado de Santa Catarina. Nesta época, os escravos eram empregados em serviços domésticos e também no auxílio à pesca de baleias e agricultura, entre outras atividades, culminando em transformações econômicas para a cidade. Porém, o desenvolvimento da economia durante este período escravocrata em Desterro (como então a cidade era chamada) foi pequeno e sobretudo doméstico pois grande parte da população se encontrava às margens da sociedade, ao mesmo tempo inseridos e excluídos da cultura local. Logo após a abolição, toda a participação afro nas atividades e manifestações culturais foram estritamente proibidas em todo o país, inclusive em Florianópolis (CARDOSO, 2000, apud FORTES, 2008). São prohibido daqui em diante os ajuntamentos de escravos ou libertos, para formar danças ou batuques, ficando inteiramente prohibidos os referentes ajuntamentos de supostos Reinados Africanos que pelas festas costumam fazer encomodando os Povos e prejudicando os

78 seus Senhores com semelhantes funções (Postura Municipal de 1831, apud FORTES, 2008, p.10).

Tais posturas de discriminação eram pouco obedecidas, mas mesmo assim, elas dificultaram ainda mais as manifestações das expressões culturais afro. Dentro deste contexto cultural e social, o Cacumbi6 por muito tempo fez parte do cenário da capital mas que posteriormente desapareceu. O samba, por outro lado, até hoje possui bastante apoio das instituições governamentais (os “sambas de carnavais 7” de Florianópolis, neste caso), não deixando de lado também as práticas de capoeira, que dentre todas as expressões culturais afrodescendentes em todo o Brasil, foi a que mais se estruturou na formação de grupos, saberes e métodos. Através deste panorama da formação social afro-descendente de Florianópolis, Fortes (2008) coloca a compreensão sobre a dança afro na ilha de Santa Catarina da seguinte forma:

6

Constituído ao redor da pessoa do “Capitão Amaro” e com a maioria de membros de sua família, o cacumbi é uma manifestação desta população de negros que estão localizados no Morro da Caixa Dágua, bairro do Estreito, de Florianópolis. O ritual cacumbi fazia parte do complexo culto anual a Nossa Senhora do Rosário e São Benedito com estrutura típica do catolicismo popular brasileiro. Incluía cantos, danças, em função da coleta de donativos e entronização de reis e imperadores”. (ALVES, LIMA E AUBUQUERQUE, 1990 apud FORTES, 2008). 7

A criação das Escolas de Samba, por exemplo, não é somente um fenômeno artístico-cultural, mas social e político, significando visibilidade e ocupação do espaço público, numa forma de luta, de certa maneira organizada (através das Sociedades Carnavalescas, Ranchos, Blocos carnavalescos e Escolas de Samba), que vem desde o século XIX, que passam a chamar a atenção dos governos e dos partidos políticos (3Cultura/s: o samba dos conceitos, In: www.puc–rio.br/ tesesabertas; Rio de Janeiro, 2001 apud FORTES, 2008, p.12).

79

[...] [a dança afro] florescerá e efervescerá na cidade contando inicialmente com disposições de ‘apropriação de linguagem’ (neste caso de dança) de uma cultura de deslocamento (considerando aqui, no sentido de linguagem/ outra. Em Florianópolis, todos estes conhecimentos que sugerem o nomear de dança afro, foram (e são) desenvolvidos a partir de aulas (FORTES, 2008, p.12-13).

3.1.2 Histórico da dança afro em Florianópolis Falar em dança afro é tratar de infinitas derivações e variações, pois essa dança é uma questão de caráter heterogêneo e plural, e no contexto de Florianópolis existe uma narrativa histórica sobre suas contaminações (segundo Fortes, 2008, a escolha deste termo refere-se a propagação de uma informação no sentido exponencial). As experiências

desta rede propagada em Florianópolis se iniciaram em 1995 com as danças populares afro-brasileiras, focadas no Nordeste primeiramente. As professoras de dança Cíntia Paula Lopes (Cíntia Abadá) e Aldelice Braga (Nega) desenvolveram aulas de dança afro na cidade, acompanhadas pelos percussionistas Gerry Adriano e Nicolas Malhomme, trazendo como base as suas experiências com danças brasileiras, principalmente oriundas da Bahia.

80

Muitas práticas se formaram a partir da diáspora africana no Brasil, dentro do contexto afro-brasileiro, como por exemplo o afoxé 8, samba de roda9 e outros. Mais tarde, por volta dos anos 2000, Ana Paula Cardoso e Gisele Solla iniciaram as práticas de ensino em dança afro, fundadas nas danças malinkês10 desenvolvidas a partir do fomento e conhecimento de uma parte da cultura da Guiné e outras regiões ao seu redor.

O termo “afoxé” é oriundo da palavra em iorubá “afose”, que significa um poder adquirido através da fala, uma força que também pode ser empregada nas orações. Além de seu poder ritualístico, o afoxé se tornou uma grande manifestação popular, artística e cultural afro-brasileira, tendo seu início por volta de 1949, a partir de um bloco carnavalesco da Bahia que tinha o intuito de divulgar o Candomblé, o “Filhos de Gandhi”. Os primeiros afoxés eram descritos como “Candomblés de rua”, porém hoje dificilmente se encontram afoxés que sigam os preceitos fundamentais. Fonte: www.afoxeoyaalaxe.tripod.com 8

Ligado ao culto de orixás e caboclos, à capoeira e às comidas à base de dendê, o samba de roda teve início por volta de 1860 como forma de preservação da cultura dos negros africanos escravizados no Brasil. A influência portuguesa fica por conta da introdução da viola e do pandeiro, além da língua falada e cantada. Fonte: www.bahia.com.br 9

Malinke, também chamado Maninka, Mandinka ou Mandingo, é uma etnia do Oeste Africano que ocupa partes da Guiné, Costa do Marfim, Mali, Senegal, Gambia e Guiné-Bissau. Ela é parte de um dos maiores impérios africanos da história, o Império Mandinga, que foi unificado em 1235 DC por Sundjata Keita, o menino que nasceu paralítico e começou a andar aos 7 anos de idade para retomar o trono de seu pai. Na área da música e da dança, os malinkes criaram mais de trinta instrumentos musicais próprios com um repertório de centenas de ritmos, danças, canções e melodias. O djembe é o principal instrumento desta cultura, cuja configuração se assemelha a uma taça e sua construção é feita a partir de um tronco de árvore. Fonte: balletafrokoteban.blogspot.com.br e www.jequitinhonha.com.br 10

81

Figura 12 - Festa malinkê, Guiné. Fonte: Fortes (2008).

Ana Paula e Gisele possibilitaram a vinda da bailarina Fanta Konatê e do músico Luis Kinugawa, então residentes em São Paulo, para ministrarem cursos de dança e ritmos da Guiné (África). Konatê e Kinugawa desde então já possuíam o intuito de disseminar e expandir a cultura malinkê pelo Brasil (FORTES, 2008).

82

Figura 13 - Fanta Konatê e Luis Kinugawa. Fonte: www.fantakonate.com

“As experiências são construídas coletivamente a partir de concepções trazidas pelos orientadores destas danças” (FORTES, 2008, p.23). A dança afro não é vista com frequência pelas ruas de Florianópolis, mesmo sendo este o seu lugar. As intermediações da dança afro, que se refere ao reconhecimento do trânsito entre corpo e ambiente como a porta para conexões, fez dela uma condição de deriva que passou a existir a partir do ensino e aprendizado em aula. Em meados dos anos 90, a dança afro que foi se recriando em Florianópolis, enfatizava um circuito intercambiante, cujas informações dos que se propuseram a ensinar e trabalhar essas danças reagiram em corpos que nunca ou pouco tiveram acesso ao tipo de linguagem das danças afrobrasileiras neste período. A partir desta condição, surgiram variações oriundas dos experimentos de cultura popular brasileira para desenvolver conhecimentos nestas danças. A cultura encarna no corpo. O que está fora passa a poder estar dentro porque as noções de dentro e

83 fora deixam de designar espaços não concretos para identificar situações geográficas intercambiantes (KATZ, 1998 apud FORTES, 2008, p.24).

Dentro do universo de danças afro-brasileiras, o aprendizado e a execução estão sujeitas à alteração e reinvenções a partir da linguagem que já existe. Isto quer dizer que, em Florianópolis, é uma pretensão querer manter uma tradição em percussão e dança afro uma vez que existe um constante trânsito no desenvolvimento do conhecimento, na exaltação e na prática das danças percussivas e enquanto uma prática artística. Ao enfatizar os processes de contaminação, a dança não representa uma estrutura fixa mas transita pela alegria inerente às formas de como brincam os corpos, resultando sempre em novas configurações.

Figura 14 - Ensaio fotográfico do grupo Oduá em 2001. Fonte: Fortes (2008).

84

3.2 ABAYOMI 3.2.1 O que é O Grupo Abayomi realiza pesquisa em dança e música de matriz africana e afro-brasileira, em especial a cultura malinkê, presente na Guiné, Costa do Marfim, Senegal e outros países. A partir de oficinas de estudo, constitui um grupo artístico focado no trânsito entre culturas. A apresentação do grupo é dividida entre movimentos coreográficos e a dança em roda, onde o músico e a dançarina experimentam a liberdade da criação no improviso. A música é marcada pela presença do Djembê, tambor tradicional em forma de cálice e a dança é vigorosa e intensa. O encontro dos corpos e tambores evoca a alegria de viver, a espontaneidade, a simplicidade, o estado de presença.

Figura 15 - Identidade visual do Abayomi. Fonte: autora.

Abayomi, em iorubá, significa “encontro precioso”. O nome também remete às conhecidas bonequinhas feitas de pano e nós. Conta a história que as mães, quando carregadas nos navios negreiros da África até o Brasil, para entreter suas filhas que não tinham brinquedos nem

85

distrações, cortavam a barra de suas roupas de pano e construíam essas bonecas. Construídas apenas com os nós, sem cola nem costura, o Abayomi carrega a mensagem ancestral de amor e de presente precioso, é aquele que traz alegria. O símbolo foi escolhido para retratar esse encontro e alegria através da roda, explorada bastante na dança e percussão afro. A roda é o momento de troca, simbiose entre dançarinos e percussionistas, e é quando se explora a improvisação e a criação dos participantes. A roda é o símbolo de comunhão e interação, ela é expansiva, intensa, colorida e imprevisível, mas ainda sim mantém sua forma e equilíbrio. 3.2.2 Histórico Desde 2009, o grupo realiza encontros semanais na Universidade Federal de Santa Catarina em oficinas abertas à comunidade em parceria com o Diretório Central dos Estudantes. São ministradas aulas de percussão e dança que preparam os integrantes para apresentações do grupo em eventos da própria universidade, na cidade de Florianópolis ou até mesmo em outras cidades de Santa Catarina. Na direção artística estão Simone Fortes e Erik Dijkstra, cuja parceria vem do início dos grupos de maracatu de Florianópolis em 2002 e dos projetos de arte-educação realizados em comunidades. Foi no final de 2010 que o grupo começou a perceber o potencial artístico e organizativo, tendo nesse mesmo ano participado da Semana da Consciência Negra em Brusque/SC e se apresentado a convite no Teatro Municipal de Itajaí/SC com o espetáculo “Ressonâncias da África”. Em 2011, acreditando na auto-gestão, Abayomi criou um núcleo de produção e comunicação que organiza apresentações, participação em eventos culturais e disseminação do

86

trabalho. Nesse mesmo ano o grupo realizou oficinas de dança e percussão com o senegalês coreógrafo Mamodou Diatta, vindo a convite do Abayomi, abertas à comunidade e em escolas de comunidades carentes, e a primeira edição do evento Wassa Wassa, uma noite reunindo os grupos locais de expressão afro e afro-brasileiras. Também em 2011 o grupo passou a realizar ensaios além do trabalho regular das oficinas, firmando um grupo dedicado ao desenvolvimento e circulação do trabalho.

Figura 16 - Dançarinas do Abayomi em outubro de 2012, fotografadas por Anninha Piccolo. Fonte: Acervo pessoal.

87

Figura 17 - Percussionistas do Abayomi em outubro de 2012, fotografados por Anninha Piccolo. Fonte: Acervo pessoal.

3.2.3 Missão, Visão e Valores 3.2.3.1 Missão: Porque o Abayomi existe O Abayomi fomenta o estudo da pesquisa da dança e da música africana, afro-brasileira e contemporânea e suas reinterpretações. Estimula o encontro, as relações e a criação de espaço para a vivência artística subjetiva. Promove a sensibilização (ampliação) do público e cria mercado para artistas profissionais. 3.2.3.2 Visão: Descrição do futuro desejado para o grupo

88

Abayomi pretende tornar-se uma referência de grupo artístico profissional, sendo reconhecido pela qualidade da pesquisa, proposta artística (afro-contemporâneo) e produção. Os integrantes do grupo desejam aprender com o trabalho, tanto musicalmente como individualmente. Querem, dentro de 3 anos, viabilizar o retorno financeiro. 3.2.3.3 Valores: princípios ou crenças, guia de como o grupo executa a missão O Abayomi possui responsabilidade e respeito pela pesquisa cultural. O grupo valoriza o contato humano, as relações de amizade, a comunhão entre as pessoas do grupo e o trabalho com prazer. Ao invés da concorrência predatória, exaltamos a aliança para fortalecer o movimento cultural em geral.

89

4 DESENVOLVIMENTO DO WEBSITE DO “ABAYOMI” 4.1 PLANO DA ESTRATÉGIA 4.1.1 Pesquisa Seguindo a metodologia escolhida de Lakatos e Marconi (2003), esta etapa do trabalho se estruturou na aplicação dos formulários com os alunos das oficinas e conhecedores do grupo, e entrevistas com os membros da produção do grupo e seus diretores artísticos. 4.1.1.2 Resultados dos Formulários Os formulários foram aplicados entre os dias 03 e 08 de outubro de 2012 com 24 pessoas, entre as quais os alunos das oficinas do Abayomi, produtores culturais, músicos e conhecedores do grupo em geral. O formulário usado para as pesquisas se encontra em anexo neste trabalho (vide Apêndice B) e logo abaixo são apresentados os resultados.

90

Gráfico 1 - Gênero dos entrevistados. Fonte: autora.

Dentre os pesquisados, buscou-se um pareamento no número de homens e mulheres, dos quais 11 foram homens e 13 foram mulheres.

Gráfico 2 - Idade em relação à quantidade de entrevistados. Fonte: autora.

91

As idades dos pesquisados variaram entre 21 e 33 anos, sendo os mais reincidentes os intervalos de 23 - 24 anos e de 27 - 28 anos.

Gráfico 3 - Ocupação dos entrevistados (em alguns casos, houve mais de uma resposta por entrevistado). Fonte: autora.

A maior parte dos entrevistados eram estudantes, sendo que alguns deles também possuíam outras profissões, por isso a escolha deste gráfico em barras para representar os números de cada ocupação.

92

Gráfico 4 - Relação dos cursos entre os entrevistados que responderam ser estudantes. Fonte: autora.

Cada estudante que respondeu ao questionário era de um curso diferente, sendo que dois dos entrevistados não mencionaram o curso e a universidade à qual pertencem.

93

Gráfico 5 - Cidade de residência dos entrevistados. Fonte: autora.

A grande parte dos pesquisados são de Florianópolis, Santa Catarina, segundo o gráfico acima.

94

Questão 1 - Você conhece o Abayomi de que maneira?

Gráfico 6 - Relação ente as diferentes formas com que os entrevistados conheceram o grupo Abayomi. Fonte: autora.

Gráfico 7 - Relação das respostas do item “outro” do Gráfico VI. Fonte: autora.

95

Questão 2 - Há quanto tempo está no grupo? (No caso de aluno de oficinas)

Gráfico 8 - Relação do tempo de permanência no grupo de oficinas do Abayomi e o número de alunos. Fonte: Autora.

96

Questão 3 - Você conhece o site do Abayomi?

Gráfico 9 - Porcentagem dos entrevistados que conhecem ou não o atual site do Abayomi. Fonte: autora.

Questão 4 - Se sim, como você conheceu o site?

Gráfico 10 - Idade em relação à quantidade de entrevistados. Fonte: autora.

97

Gráfico 11 - Relação das respostas do item “outro” do Gráfico X. Fonte: autora.

Questão 5 - E com que frequência você o acessa?

Gráfico 12 - A frequência de acesso dentre os participantes que conhecem o site do Abayomi. Fonte: autora.

98

Atualmente, quando uma notícia é publicada no blog do Abayomi, a mesma é publicada na sua página do Facebook e também enviada aos usuários que se cadastraram no blog e àqueles que participam da lista de e-mails dos alunos das oficinas. Questão 6 - O que você acha do blog? Descreva aqui a sua experiência de navegação do website. (Você encontra o que você deseja? É fácil navegar por ele? Ele é agradável visualmente?)

- “Fácil de navegar porém não oferece muitos recursos nem informações.” - “Deveria haver um Menu para facilitar a navegação, dividir os posts em categorias. É complicado procurar postagens antigas.”

- “É agradável visualmente, com belas fotos, e as informações/ novidades aparecem logo de cara, o que facilita o acesso a elas.” - “Acho o blog com fáceis informações, sentindo falta apenas da história do djembê na Ilha.”

- “Acho o site bem interessante e informativo, às vezes não consigo ver tudo o que vocês publicam porque o tempo é curto e geralmente tem bastante coisa pra ler e ver, mas uma passada de olho não rola (rs). Só penso que a linguagem às vezes não se torna tão compreensível para outros grupos que não tem o hábito de leitura

99

inerente nas suas vidas... (sei lá, viagens da minha cabeça, mas é de se considerar né? hehe).”

- “É agradável, porém considero mais fácil a utilização de sites, pois blogs são um pouco limitados.”

- “Acho bonito. Já tive dificuldade de acessar a página inicial quando acessei o site a partir de uma notícia do facebook. Não tenho muita paciência para ler as notícias muito extensas.”

- “Agora não me lembro muito bem mas acho meio chato pra achar as informações no site. O menu é pequeno e escondido e aquele bando de notícias na primeira página confunde um pouco.”

- “Gosto da linha de comunicação. É ao mesmo tempo amigável e informativo. Vejo necessidades de pequenos ajustes na estrutura de navegação.”

- “Acho que tem que investir mais no compartilhamento com as redes de Facebook e do Twitter, facilitar os comentários, deixar as pessoas contribuírem mais.”

- “Acredito que o formato de blog não é informativo e não favorece a uma arquitetura da informação.” - “Acho ótimo como meio de informação sobre a cultura afrobrasileira.”

100

Questão 7 - Qual a sua experiência de uso com o computador e a internet? (0 - não costuma acessar a internet, apenas checar e-mails/ 5 - Heavyuser, acessa com frequência e domina as tecnologias da internet)

Gráfico 13 - Incidência de respostas em relação ao nível de experiência de uso do computador e da internet. Fonte: autora.

101

Questão 8 - O que você espera encontrar dentro do website do Abayomi?

Gráfico 14 - Apresentação dos conteúdos selecionados em múltipla escolha nos formulários por parte dos entrevistados que são alunos das oficinas do Abayomi. Fonte: autora.

Dentro desta questão, havia mais um item para que o entrevistado sugerisse algum conteúdo que ele espera encontrar dentro do website do Abayomi, e as respostas deste item foram as seguintes:

- “Ritmos praticados nas oficinas” - “Interação: os usuários poderem enviar conteúdos também” - “Um pouco de conhecimento sobre os ritmos tocados e dançados, de onde vem, se tem algum contexto (ex: dança da fertilidade, hehe)”

102

Gráfico 15 - Apresentação dos conteúdos selecionados em múltipla escolha nos formulários por parte dos entrevistados que não são alunos das oficinas do Abayomi. Fonte: autora.

103

Questão 9 - Por favor, deixe aqui uma sugestão ou comentário em relação ao futuro website do Abayomi para que possamos chegar ao melhor resultado possível!

- “Só gostaria de que fossem postados videos com os diferentes ritmos que a gente está praticando nas oficinas para ter como material de consulta na hora de treinar.”

- “Creio que se conseguirem uma arte legal, um bom conceito e informações a respeito o grupo e onde ele está inserido, fica massa!”

- “Acho que falta mais cor, por se tratar de algo dinâmico (música), ainda mais da cultura afro.” - “Mantenham a comunicação próxima das pessoas. Valorizem sempre o feedback do público. Acima de tudo, inspirem!”

- “Ter uma galeria de álbuns com as fotos e vídeos dos encontros do grupo ou do que o grupo participou de forma cronológica! A história do grupo em álbuns.”

- “Para mim, o site é muito bom e deve continuar na mesma linha. Claro que sempre podemos ir aprimorando a comunicação, mas é natural de acontecer com o tempo.”

- “Ah galera... acho que é isso ‘ae’ que já escrevi e assinalei! Beijão e boa sorte com o novo website =)”

104

- “Acho realmente que as melhorias já estão sendo feitas. Axé, Bett.” - “Um espaço para que trabalhos e artistas afins sugiram parcerias (como não acesso muito nem sei o que já tem) hi.” - “Um menu claro e posts regulares de notícias.” - “Ele poderia ser mais interativo e envolver outros assuntos relacionados ao Abayomi e a cultura africana.” 4.1.1.3 Entrevistas As entrevistas foram aplicadas pessoalmente e via e-mail entre os dias 1 e 10 de outubro de 2012, com os diretores artísticos e produtores do Abayomi. Entrevistado 1: Fábio Cadore - Diretor Musical e Professor de Percussão

1. Qual a importância de um website para o Abayomi neste momento? O site é a estratégia fundamental para comunicação do grupo e fortalecimento das redes sociais. A sustentabilidade do grupo tem como pilar principal a auto-gestão através da promoção de oficinas, eventos e apresentações. A rede social na internet é a forma mais barata e eficiente para articular movimentos que dependam de público.

2. O que você acha que é mais importante ter neste novo website?

105

Acho que ele deve atender novas demandas do grupo, principalmente facilitando o acesso às informações por categorias e facilitar a compreensão do que somos, o que fazemos e que serviços e produtos oferecemos. Deve ter áreas para facilitar contatos profissionais e de aulas, áreas com fotos e material de interesse do nosso público e áreas com informação mais densa sobre a pesquisa cultural e artística.

3. Para você, o que mais atrai as pessoas a acessarem o atual blog do Abayomi? Informações de caráter pessoal como fotos, cobertura de eventos, vídeos. Materiais que registrem as ações do grupo e em que os participantes possam se ver.

4. Na sua opinião, qual o maior diferencial do Abayomi em relação aos seus concorrentes? A proposta artística focada no trânsito entre culturas, enfatizando a força, energia, velocidade e “pegada” tanto na dança quanto na percussão. O caráter mais participativo na produção, o estímulo ao aprimoramento artístico individual culminando nos solos. A preocupação com o profissionalismo tanto artístico quanto de produção e comunicação.

5. Na sua opinião, qual o maior diferencial do Abayomi em relação aos seus parceiros? O profissionalismo na produção e a qualidade artística.

106

6. Como você acha que o website do Abayomi poderá contribuir para o cenário cultural afro-brasileiro em Florianópolis? Contribui quando comunica uma proposta artística que é fundamentada numa pesquisa cultural que tem como matriz a África.

7. Quais as funcionalidades e/ou recursos de comunicação e serviços são esperados com este projeto? Facilidade para contatos profissionais e contratos de shows e oficinas. Cadastro mais simplificado de alunos e interessados. Estabelecer um canal de comunicação dos movimentos do grupo, eventos e sobre a pesquisa cultural. Entrevistado 2: Simone Fortes - Diretora Artística e Professora de Dança

1. Qual a importância de um website para o Abayomi neste momento? Como fonte de registro para o grupo, pesquisa aos interessados e fomento da cultura e artes de matriz africana.

2. O que você acha que é mais importante ter neste novo website? Uma composição visual e linguagem condizente ao trabalho artístico que o grupo desenvolve em suas práticas.

107

3. Para você, o que mais atrai as pessoas a acessarem o atual blog do Abayomi? Acho que são interesses diversos (pesquisa, interesse pelas aulas, algum conhecido/amigo integrante, curiosidades e afins).

4. Na sua opinião, qual o maior diferencial do Abayomi em relação aos seus concorrentes? É justamente não enfatizar a concorrência, e sim focar no trabalho e suas necessidades enquanto grupo, para desenvolvimento humano, coletivo e artístico.

5. Na sua opinião, qual o maior diferencial do Abayomi em relação aos seus parceiros? O grupo Abayomi sugere uma dinâmica que busca ‘inovar’ seja lá quais forem as possibilidades, acredita que o grupo precisa sim de oficinas extras para aprofundamento dos conteúdos, acredita que temos muito o que aprender sempre, por isso busca promover oficinas com artistas, dialogar com grupos locais e de fora, bem como encontrar demais saídas (aulas, culturas outras) para fortalecimento, amadurecimento e ampliação de repertório e recursos artísticos.

6. Como você acha que o website do Abayomi poderá contribuir para o cenário cultural afro-brasileiro em Florianópolis? Divulgando os conteúdos que o grupo vem pesquisando, suas fontes de pesquisa, suas oficinas com africanos, e apresentando no site uma

108

estética coerente com suas práticas, enquanto desdobramento possíveis dessas bases.

7. Quais as funcionalidades e/ou recursos de comunicação e serviços são esperados com este projeto? Galeria de fotos, alguns vídeos editados, ações desenvolvidas (festa, oficinas com africanos, etc), conteúdos para possíveis pesquisa a estudantes e interessados. Entrevistado 3: Erik Dijkstra - Diretor Musical e Professor de Percussão 1. Qual a importância de um website para o Abayomi neste momento? Divulgação das atividades do grupo, fonte de pesquisa, cartão de visitas para apresentações, etc. 2. O que você acha que é mais importante ter neste novo website? Algo atrativo para as pessoas voltarem a vê-lo, e atualmente como andam as mídias, vídeos interessantes, atualizações e conexão com as redes pessoais. 3. Para você, o que mais atrai as pessoas a acessarem o atual blog do Abayomi? A posição no Google como dança afro, ou as pessoas que já conhecem.

109

4. Na sua opinião, qual o maior diferencial do Abayomi em relação aos seus concorrentes? Inovação, energia da juventude e vontade de crescer e ir além. 5. Na sua opinião, qual o maior diferencial do Abayomi em relação aos seus parceiros? Estabelecer parcerias e valorizar o outro. 6. Como você acha que o website do Abayomi poderá contribuir para o cenário cultural afro-brasileiro em Florianópolis? Estabelecer uma referência tanto em pesquisa de danças africanas como seus desdobramentos contemporâneos. Colocar Florianópolis no circuito Nacional como referência em dança de matriz africana. 7. Quais as funcionalidades e/ou recursos de comunicação e serviços são esperados com este projeto? Podemos ter um intranet só para os membros para centralizar nossas informações. Uma maneira também mais fácil das pessoas atualizarem o site, por exemplo, logado pelo Facebook, não sei se isso é possível. Como um aplicativo que a pessoa tem que aceitar no “Face”. Assim no próprio blog as pessoas podem comentar mais livremente os posts, porque de jeito que está agora é muito institucional, tem que ter um meio termo. O bom disso é que fica mais profissional, talvez uma área do site para isso... não sei.

110

Entrevistado 4: Tomaz Costa - Músico e Produtor

1. Qual a importância de um website para o Abayomi neste momento? Vejo a necessidade de um site para o Abayomi para que possamos difundir nossas atividades na ampla Web, de forma organizada e personalizada, constando desde registros (fotos, vídeos, textos) das atividades; informações de projetos; informações referentes ao que fazemos, agenda, contato, e nossos serviços como grupo cultural.

2. O que você acha que é mais importante ter neste novo website? Informações referentes ao grupo; agenda; galeria de imagens; textos informativos sobre nossas pesquisas, ações, eventos; e contato.

3. Para você, o que mais atrai as pessoas a acessarem o atual blog do Abayomi? Informações sobre cultura africana; fotos, vídeos e textos referentes as apresentações; e pela divulgação realizada em redes sociais e mailing list.

4. Na sua opinião, qual o maior diferencial do Abayomi em relação aos seus concorrentes? Organização do trabalho em núcleo de produção, com foco em elaboração e realização de projetos e comunicação. Forte elaboração de

111

design e audiovisual. Interesse em pesquisa e experimentação com ritmos africanos, promovendo oficinas com percussionistas e coreógrafos africanos e realizando viagens de experiência para a África.

5. Na sua opinião, qual o maior diferencial do Abayomi em relação aos seus parceiros? Idem.

6. Como você acha que o website do Abayomi poderá contribuir para o cenário cultural afro-brasileiro em Florianópolis? O site é um reflexo das atividades feitas pelo grupo. Assim, quanto mais ações realizadas pelo grupo, maior será o movimento no site. Além disso, o site ajudará na divulgação dessas atividades, conectado com as redes sociais e mailing lists, e terá informações relativas à cultura em área de pesquisa. Poderá, mais pra frente, ter uma agenda ampla, não apenas com atividades do grupo, mas também atividades referentes a cultura afro e afro-brasileira.

7. Quais as funcionalidades e/ou recursos de comunicação e serviços são esperados com este projeto? Inscrições de e-mails (mailing list); link com redes sociais (Facebook e Twitter); agenda cultural; contato com o grupo; feedback dos usuários (comentários, sugestões...); fórum ou área de debates; blog; acesso aos projetos atuais do grupo; galerias de imagens.

112

Entrevistado 5: Diogo Costa - Músico e Produtor

1. Qual a importância de um website para o Abayomi neste momento? Divulgação do trabalho do grupo para gerar mais oportunidades de apresentações e criar uma base de comunicação com quem já conhece o trabalho e/ou gosta do assunto, mantendo assim a nossa rede de comunicação virtual bombando.

2. O que você acha que é mais importante ter neste novo website? Bem claro qual tipo de trabalho artístico realizamos e facilitar o contato com possíveis agenciadores. Também posts relativos à música e dança africana com embasamento sólido.

3. Para você, o que mais atrai as pessoas a acessarem o atual blog do Abayomi? Publicações com fotos ou vídeos de eventos recentes.

4. Na sua opinião, qual o maior diferencial do Abayomi em relação aos seus concorrentes? A alegria dos integrantes em fazer o que fazem por tesão e o caminhar atencioso e cauteloso rumo à formação de um grupo coerente com sua identidade e com a responsabilidade que carrega.

113

5. Na sua opinião, qual o maior diferencial do Abayomi em relação aos seus parceiros? O foco nas releituras, o entendimento de que tudo está em trânsito, a leveza nas relações internas e o sentimento de amizade acima de tudo.

6. Como você acha que o website do Abayomi poderá contribuir para o cenário cultural afro-brasileiro em Florianópolis? Acho que pode ser um ponto de convergência, na divulgação e acúmulo de material sobre o que acontece aqui e região. Como o Abayomi tem diversos parceiros que trabalham com a cultura afro-brasileira, o site pode ajudar no estabelecimento desse canal de comunicação de Florianópolis com o mundo. Tendo o devido cuidado com o material que será apresentado no site.

7. Quais as funcionalidades e/ou recursos de comunicação e serviços são esperados com este projeto? Vender o produto que o grupo oferece, gerar trabalho através da divulgação do grupo, aumentar a rede de contatos virtuais, fazer parcerias e colaborar com o cenário cultural local (principalmente cultura afro), estabelecer um canal de comunicação com pessoas que são estudiosas/entusiastas dos mesmo assuntos.

114

4.1.2 Briefing Não existe uma fórmula universal para a elaboração de um Briefing, nem mesmo uma regra quanto ao seu tamanho ou formatação, afirma Phillips (2007). Para cada tipo de trabalho e para cada tipo de organização, empresa, ou designer que elaborará o projeto, o Briefing assume forma e conteúdo particulares necessários para aquela demanda. O documento também poderá servir de roteiro durante o desenvolvimento do projeto e até mesmo de instrumento de acompanhamento e avaliação. No entanto, para uma boa qualidade do Briefing, este deve conter informações específicas e estratégicas sobre o projeto, além do preparo colaborativo entre o solicitante e o designer. Os dois lados envolvidos, demandantes e projetistas, não devem comportar-se apenas como compradores e fornecedores de serviços, mas como parceiros de um empreendimento com responsabilidades compartilhadas (PHILLIPS, 2007, p.17).

O mais importante é que o objetivo do projeto seja claramente identificado e compreendido por todos os envolvidos para que as informações corretas sejam coletadas e os problemas devidamente solucionadas pelo designer. “Considerando que o design se propõe a solucionar problemas, preciso saber exatamente quais são esses problemas” (PHILLIPS, 2007, p.21).

115

4.1.2.1 Sumário Executivo Este projeto se refere ao redesign do site atual do grupo Abayomi, de Florianópolis, que trabalha com pesquisa em dança e percussão afro-contemporânea. Atualmente, o grupo oferece dois tipos de serviço para o seu público: oficinas de dança e percussão na Universidade Federal de Santa Catarina, em Florianópolis, e espetáculos de palco e de rua nas regiões da Grande Florianópolis e nas cidades de Brusque e Itajaí, no estado de Santa Catarina. O grupo ainda se encontra em fase de crescimento e, portanto, está fortalecendo a sua imagem institucional e ampliando a sensibilização de públicos cada vez maiores, através de estratégias de promoção de seus trabalhos. E é esse o intuito maior deste projeto: promover a imagem do grupo, seus trabalhos, seus eventos e suas pesquisas através do seu website. Aproveitando o momento oportuno do tema África em foco no Brasil e no mundo, a cidade de Florianópolis também abraçou essa aceitação da cultura africana (ainda mais na área da música e dança). Isso fez com que o número de editais públicos de fomento à manifestação da cultura afro-brasileira aumentasse na ilha, ampliando as oportunidades de captação de recursos e viabilidade de projetos e circulação de espetáculos do Abayomi, além de ter destacado a cena do afrojazz e da black music e, por consequência, aumentado os espaços e o público que se interessa pelos ritmos tradicionais africanos mesclados com música contemporânea que o Abayomi produz. 4.1.2.2 Análise Setorial - Fatores Econômicos: O reconhecimento da cultura como atividade econômica é muito recente. Não há nada que influencie mais a

116

conformação de um produto cultural do que o seu sistema de financiamento. Um bom gestor cultural precisa saber manejar essas variáveis, que são inúmeras e complexas, a ponto de arquitetar novas dinâmicas que invertam a lógica do domínio e o aprisionamento da criação pelo capital. A cultura é ainda um mercado promissor, mas ainda incipiente, o que exige uma intensa articulação entre os membros dessa cadeia produtiva para a conquista de um olhar mais apurado da sociedade em relação à sua importância estratégica. É interessante notar que em 2011 o Ministério da Cultura fez um levantamento nacional para detectar o preço da cultura no país. Produtores culturais, empresas, o mercado e a sociedade passam a ter, pela primeira vez, indicadores nacionais de preços da cultura, levantados segundo parâmetros e técnicas de mercado (vide Anexo B). - Fatores Sócio-culturais: O tema África se encontra em destaque e pode-se perceber que há uma aceitação maior da cultura africana no mundo. Focando em Florianópolis, a música negra está em alta. Desde 2011 as festas Whatafunk conquistam públicos cada vez maiores, sob a temática do jazz, soul, funk e afrobeat. O termo “afro” também aparece muito mais nos meios de comunicação: afrosamba, afrojazz, afrobeat, afroreggae. O afro virou um prefixo de peso, como “eco” era cerca de cinco anos atrás. Observa-se também uma nova tendência de organização social em coletivos, com menos peso burocrático e hierarquia mais horizontal, que se unem por um interesse comum. Um belo exemplo disto é o Fora do Eixo, cuja organização de trabalho colaborativa inspirou a forma do Abayomi trabalhar. - Fatores Políticos/legais: As questões de políticas públicas para o fomento de cultura e expressão afro-brasileira está em alta. Através de

117

editais de incentivo, muitas portas se abriram para a realização de atividades (oficinas e circulação de apresentações) e captação de recursos. O MinC, Ministério da Cultura do Governo Federal, possui uma categoria voltada apenas à cultura afro-brasileira dentro de seus projetos, políticas e ações. Em Florianópolis, temos a COPPIR Coordenadoria Municipal de Políticas Públicas para a Promoção da Igualdade Racial, que é um órgão da prefeitura cuja finalidade é assessorar, assistir, articular e acompanhar ações, programas e projetos voltados à promoção da igualdade racial. A Fundação Franklin Cascaes, outro órgão da prefeitura de Florianópolis, promove e divulga as manifestações culturais tradicionais e contemporâneas, além de preservar o patrimônio cultural material e imaterial da cidade. O Abayomi já contou com seu apoio a projetos e eventos anteriores, como o “Corpo em Trânsito”, projeto contemplado pelo Fundo Municipal de Cultura realizado durante o segundo semestre do ano de 2012. A Fundação Catarinense de Cultura é um orgão estatal que promove e preserva a produção artística do estado. Em 2012, o Abayomi e muitos grupos independentes de Santa Catarina foram contemplados pelo projeto TAC 7:30. - Fatores Tecnológicos: O maior impacto e abrangência na comunicação interna e externa, atualmente, é através das redes sociais na internet. O grupo possui Facebook, Twitter, conta no YouTube, Vimeo e um blog Wordpress. Porém, essas contas e os seus seguidores não estão muito integrados ainda e o Abayomi precisa de uma plataforma que agregue todo o conteúdo gerado pelo grupo de forma acessível e intuitiva. Conforme a análise dos dados fornecidos pelo TIC Domicílios 2011 (vide Anexo A), 66% dos usuários brasileiros acessam a internet diariamente, sendo a região sul a de maior incidência (72%). Dentre

118

todos os usuário brasileiros que acessam a internet, 91% deles a utilizam para fins de Comunicação (trocar e-mails, navegar em redes de relacionamento e enviar mensagens instantâneas são as ações mais frequentes); 86% dos usuários navegam na internet atrás de informações e serviços on-line (onde a busca por informações sobre diversão e entretenimento ocupa a segunda posição com 61%); e 85% das pessoas utilizam a internet para o lazer (cujas atividades de maior destaque são assistir filmes e vídeos no YouTube e similares, baixar músicas e ler jornais e revistas). As ferramentas colaborativas também se apresentam essenciais para a comunicação interna e externa do Abayomi. Todos os arquivos e links de produção, dados pessoais, lista de parceiros e colaboradores, materiais gráficos, fotos, vídeos, etc., se encontram organizados e condensados em um único documento chamado TEC, situado no Googledocs. Através dele, o Abayomi organiza todas as ações do grupo de produção, que auxiliados por outras ferramentas de caráter colaborativo (DropBox, por exemplo) otimizam as tarefas de trabalho do grupo todo. 4.1.2.3 Posicionamento de mercado O Abayomi orienta o seu trabalho para as pessoas que se interessam pela cultura afro-brasileira, mais especificamente no âmbito da música e dança. Entretanto, como as questões da cultura tradicional africana e brasileira, de maneira geral, são indissociáveis à dança e música, o posicionamento do grupo se volta para a pesquisa e produção da cultura afro-brasileira. A comunicação do público com o grupo, e vice-versa, é de maneira bastante informal, de diversas formas: pessoalmente, listas de e-mails e blog. O Abayomi sustenta uma relação bastante horizontal com o público, onde todos se sentem à vontade para

119

contribuir. Os alunos e participantes do grupo de apresentação tem voz ativa e o grupo todo é aberto para opiniões, sugestões e reclamações. Apesar dos pontos positivos dessa relação informal do grupo, o Abayomi reconhece a necessidade de fortalecer uma imagem mais institucional perante o público já existente e novos públicos formadores de opinião, produtores culturais, empresas e todos aqueles que financiam projetos e contratam shows. 4.1.2.4 Similares O Abayomi busca não enfatizar a concorrência mas, em vez disso, procura enaltecer as parcerias e valorização dos movimentos culturais que acontecem paralelamente. Por isto, o termo “similares” aqui é usado no lugar de “concorrência”, que na visão do Abayomi transmite uma relação predatória com os outros grupos. O Batukajé é o primeiro grupo de afro da ilha, liderados pela dançarina Aldelice Braga (Nêga) e o percussionista francês Nicolas Malhomme desde 2001, e ainda hoje fornece aulas de dança e percussão afro além de promover apresentações. Por ser o pioneiro do movimento em Florianópolis, o grupo é bastante reconhecido pelo público do segmento de cultura afro-brasileira na cidade. No entanto, o mesmo não possui uma boa estrutura de comunicação de suas atividades, não promovendo muitas ações na conquista de novos públicos e nichos de mercado. Também se apresentam como similares as outras oficinas do Diretório Central dos Estudantes da Universidade Federal de Santa Catarina, por ter um público maior da comunidade acadêmica e o atrativo das mensalidades, que é a proposta do projeto das oficinas do DCE. Outras propostas artísticas e culturais também atingem o mesmo

120

segmento psicográfico de público e se apresentam como parceiros do Abayomi, ajudando a divulgar e a incorporar a cultura afro-brasileira e cultura popular na cidade, em Santa Catarina, e até mesmo no Brasil, seja na forma de eventos públicos, apresentações ou oficinas de capacitação. Dentre esses parceiros, pode-se citar: Instituto Africa Viva, Arrasta Ilha, Pife na Manga, Terreiro de Sinhá, o percussionista Tiriba, grupos de capoeira e outros grupos de cultura popular. 4.1.2.5 Público-alvo

- Geográfico: As aulas das oficinas acontecem na Universidade Federal de Santa Catarina e por isso grande parte do público é do perímetro universitário e da região central e sul da cidade de Florianópolis. As apresentações e eventos também se concentram na região da Grande Florianópolis. - Demográfico: Universitários, produtores culturais, músicos e dançarinos. - Psicográfico: Público para as oficinas e para assistir aos shows e frequentar os eventos do Abayomi são as pessoas praticantes regulares de exercícios físicos, pessoas ligadas à manifestação da cultura afrobrasileira em geral (dança, música, religião), de alimentação saudável e simpatizantes do tambor. As empresas e produtores culturais, que podem contratar os shows.

121

4.1.2.6 Personas e Cenários Como mencionado no item 2.2.3 deste trabalho, criar personas é a melhor maneira de acomodar a variedade de usuários existentes dentro do público-alvo, especificando tipos individuais com suas necessidades específicas. Dessa maneira, é possível pensar nas funcionalidades do website de maneira específica, em vez de tratá-las genericamente, respeitando as particularidades do público-alvo.

Figura 18 - Persona 1. Fonte: Autora.

- Persona 1 e Cenário 1: Luana tem 23 anos, estuda Biologia na UFSC, trabalha como estagiária durante meio período no dia e mora no bairro Carvoeira, ao lado do campus universitário. Luana começou a participar das aulas do Abayomi após escutar os batuques e gritos sempre que passava próximo ao local de aulas quando retornava pra casa depois do trabalho. Ela não tem muitas experiências com dança mas sempre gostou da cultura afro-brasileira e músicas percussivas,

122

por isso optou por fazer as aulas de dança e de percussão com o grupo há 5 meses. Luana gosta de saber das festas em que o Abayomi irá se apresentar para poder prestigiar o grupo e a própria música e dança que pratica nas aulas. Se interessa pelas galerias de fotos e vídeos do grupo para compartilhar com os amigos e familiares e também procura saber um pouco mais sobre a tradição e as histórias por trás dos ritmos tocados em aula.

Figura 19 - Persona 2. Fonte: Autora.

- Persona 2 e Cenário 2: João tem 35 anos, produtor cultural e músico. Possui uma banda independente em Florianópolis e faz as próprias produções audiovisuais da sua banda. João conhece bem o grupo Abayomi pois namora uma de suas integrantes e sempre que pode assiste a alguma apresentação ou aula. Já fez algumas parcerias com o grupo como músico e produtor. João se interessa pelos estudos rítmicos que o grupo pesquisa e gostaria de encontrar mais

123

informações sobre isso no site, como textos e referências de vídeo e áudio.

Figura 20 - Persona 3. Fonte: Autora.

- Persona 3 e Cenário 3: Mariana tem 28 anos, é formada na UFSC, trabalha como professora na rede municipal de ensino, mas ainda frequenta o ambiente e as festas universitárias. Já assistiu a algumas apresentações do Abayomi em alguns eventos universitários e festas fora da UFSC e sempre gostou do que viu. É amiga de alguns integrantes do grupo por isso sempre acompanha o movimento. Mariana gosta de acompanhar as notícias sobre as festas e os eventos em que o Abayomi irá se apresentar e gosta de olhar as fotos das apresentações.

124

Figura 21 - Persona 4. Fonte: Autora.

- Persona 4 e Cenário 4: Carlos tem 42 anos, é produtor cultural e está a procura de atrações para o seu estabelecimento. Conheceu o Abayomi através do Facebook mas nunca assistiu a nenhuma apresentação do grupo. Carlos busca um contato mais próximo do grupo a fim de firmar uma parceria. Seria interessante para Carlos ter acesso a algum tipo de portfólio do grupo, com fotos, vídeos e projetos que o Abayomi já realizou, ou algum outro tipo de material institucional mais formalizado do grupo. 4.1.2.7 Análise de Similares Realizou-se uma análise de websites similares a área de atuação do grupo Abayomi focada mais especificamente na interface gráfica, estrutura e navegação. Essa análise foi feita a partir de três grupos contextualizados: websites relacionados a dança e música do oeste africano, de escolas de dança e música em Florianópolis e de grupos de

125

cultura afro-brasileira da cidade. O primeiro item da análise, chamado “Elementos gráficos e paleta de cores”, é aplicado somente ao primeiro grupo pois é o único que aborda os sites de dança e música afro e similares. Desta forma, são estes websites que trarão as informações visuais necessárias para trabalhar o diferencial da estética das interfaces do projeto do website do Abayomi. Através desta análise será possível abordar os aspectos visuais da linguagem da cultura Malinké de forma coerente com o trabalho que o grupo Abayomi realiza, de maneira holística. Isto é, não olhar isoladamente somente a questão da dança ou dos ritmos tocados, mas extrair a essência e o valor do grupo e transportar isso para a interface do website. 4.1.2.7.1 Sites relacionados a dança e música oeste-africana a. Companhia de Dança Alokli West African Dance. Em: http:// www.alokli.com/. Philadelphia, PA - EUA.

Figura 22 - Página inicial do website. Fonte: www.alokli.com.

126

Elementos gráficos e paleta de cores

- Textura de cascas de árvore - Desenho de árvore - Montagem de fotos de pessoas no cabeçalho das páginas

- Cores quentes e terrosas, como amarelo, vermelho, laranja e marrom Conteúdo

- Conteúdos da barra de navegação fixa: Home, Sobre, Pessoas (como se fosse um Quem Somos), Danças, Artigos, Fotos, Áudio, Vídeos, Loja, Links, Contato

- Na página inicial há uma área no rodapé com atualização das notícias Estrutura e Navegação

- Barra de navegação vertical fixa na lateral direita

- Páginas de conteúdo fixas com cabeçalho fixo

- Largura estreita das páginas com conteúdo extenso

- Náo há divisão clara de importância e tipo de conteúdo

- Todo o conteúdo é recuado para a margem esquerda do navegador Tabela 1 - Análise do website www.alokli.com.

b. Companhia de dança e percussão Kùlú Mèlé African Dance & Drum Ensemble. Em: http://kulumele.org/.

127

Figura 23 - Página inicial do website. Fonte: www.kulumele.org.

Elementos gráficos e paleta de cores

- Elementos retangulares compondo o cabeçalho e o rodapé

- Marca da companhia de dança, que contém o símbolo de um desenho tribal e tipografia estilizada

- Tons terrosos - Laranja e verde-limão Conteúdo

- Informações sobre a ficha técnica completa dos membros do grupo

128 Estrutura e Navegação

- Barra de navegação vertical fixa na lateral esquerda

- Alguns dos links da barra de navegação direcionam para páginas fora do website, fazendo o usuário se perder. Todas essas páginas estavam fora do ar

- Links da barra de navegação sem destaque - Páginas estreitas e com conteúdo extenso sem separação por hierarquias ou categorias de importância e/ou conteúdo

- Carregamento das páginas é muito lento e o website sai do ar com frequência, como se houvesse um tempo limite de navegação dentro da página Tabela 2 - Análise do website www.kulumele.org.

c. Companhia de Dança Africana e Fundação Cultural Ezibu Muntu. Em: http://www.ezibumuntu.org/. Richmond, Virginia - EUA.

129

Figura 24 - Página inicial do website. Fonte: www.ezibumuntu.org.

Figura 25 - Página interna com calendário de eventos. Fonte: www.ezibumuntu.org.

130 Elementos gráficos e paleta de cores

- Banner com fotografias na página inicial - Formas retangulares e tracejadas contornando as áreas de conteúdo

- Vermelho e tons terrosos Conteúdo

- Conteúdos da barra de navegação fixa: Home, Sobre, Educação de Artes, Eventos, Histórico das performances, Galeria de fotos, Mídia, Contato, Doações

- Na páginas “Sobre” há informações sobre missão, visão, história do grupo, diretores artísticos e membros da companhia, mas a página não esclarece o que exatamente o grupo faz (nem na página inicial nem na “About”) Estrutura e Navegação

- Menu horizontal pequeno, centralizado mas com pouco contraste

- Cabeçalho fixa - Falta de consistência visual nas páginas internas

- Estrutura das páginas centralizada Tabela 3 - Análise do website www.ezibumuntu.org.

d. Center for African and Diaspora Dance. Em: http:// www.cumbedance.com/. Brooklyn, NY - EUA.

131

Figura 26 - Página inicial do website. Fonte: www.cumbedance.com.

Figura 27 - Página com informações e calendário das aulas de dança. Fonte: www.cumbedance.com.

Elementos gráficos e paleta de cores

- Vermelho, laranja, amarelo, branco e cinza - Banner com fotos na página inicial

132 Conteúdo

- Inscrição on-line para as aulas de dança - Informações completas para iniciantes sobre as aulas de dança (que roupas e calçados usar, condutas para chegar cedo e conseguir se arrumar, informações sobre pacotes de desconto, etc)

- Inscrição para newsletter na barra lateral Estrutura e Navegação

- Na página inicial os tipos de serviços são categorizados por cores

Tabela 4 - Análise do website www.cumbedance.com.

e. Festival de Dança Africana de Flórida Anual - Florida African Dance Festival. Em: http://www.fadf.org/. Flórida - EUA.

Figura 28 - Página única do website. Fonte: www.fadf.org.

133 Elementos gráficos e paleta de cores

- Texturas diversas nos planos de fundo como de papel, quadriculada, de costura e de régua, demonstrando uma confusão na comunicação visual do website

- Tons bege, cinza e detalhes em vermelho - Tipografia forte, letras em negrito e alongadas

- Incoerência visual do website com o seu conteúdo Conteúdo

- É um website de um festival de dança africana então os conteúdos apresentados são: Sobre o festival, os artistas, a agenda do festival, os ingressos, patrocinadores, como se inscrever para o festival, informações sobre hospedagem, FAQs, contato, entre outros.

Estrutura e Navegação

- Layout da página possui apenas uma página, com uma navegação vertical

- Barra de navegação vertical na lateral esquerda Tabela 5 - Análise do website www.fadf.org.

f. Instituto África Viva. Em: http://www.africaviva.org.br/. São Paulo, SP - Brasil.

134

Figura 29 - Página inicial do website. Fonte: www.africaviva.org.

Figura 30 - Página dos parceiros do instituto. Fonte: www.africaviva.org.

135 Elementos gráficos e paleta de cores

- Verde, vermelho e amarelo (o Instituto África Viva trata também de questões ambientais e realiza workshops de sustentabilidade voltados ao cultivo e colheita em paralelo à cultura, dança e música do oeste africano)

- Textura de tinta em madeira no plano de fundo do website Conteúdo

- Banner animado com as últimas notícias - Ícones para Facebook e Youtube - Conteúdos da barra de navegação principal: Home, Quem Somos, Centro Cultural Famodou Konatê, Fanta Konatê, Biomúsica Sem Fronteiras, Instituto África Viva na Guiné

- Conteúdos da barra de navegação lateral: Workshops, Vídeos, Fotos, Parceiros e Contato Estrutura e Navegação

- Duas barras de navegação, uma horizontal em cima e outra vertical localizada ao lado esquerdo

Tabela 6 - Análise do website www.africaviva.org.

4.1.2.7.2 Escolas de dança e música em Florianópolis a. Espaço Biodanza. Em: http://www.biodanzaflorianopolis.com.br/.

136

Figura

31

-

Página

inicial

do

website.

Fonte:

www.biodanzaflorianopolis.com.br.

Figura 32 - Uma página interna do website. Fonte: www.biodanzaflorianopolis.com.br.

137 Elementos gráficos e paleta de cores

- Esta análise não se aplica a este projeto.

Conteúdo

- Últimas notícias, agenda de eventos e podcast na página inicial

- Informações de contato fixas no rodapé - Inscrição para newsletter na barra lateral - Informações sobre Biodanza - Informações sobre a escola - Artigos e notícias publicados Estrutura e Navegação

- Barra de navegação lateral - Dependendo da página, há uma barra de navegação local conforme o conteúdo apresentado

- Barra de busca sempre visível no topo das páginas Tabela 7 - Análise do website www.biodanzaflorianopolis.com.br.

138

b. Escola de Dança Cenarium. Em: http://www.cenariumdanca.com.br.

Figura 33 - Página inicial do website. Fonte: www.cenariumdanca.com.br.

Figura 34 - Detalhe do rodapé da página inicial. Fonte: www.cenariumdanca.com.br.

139 Elementos gráficos e paleta de cores Conteúdo

- Esta análise não se aplica a este projeto. - Tabela de horários e valores das aulas de dança

- Informações sobre a escola, os professores e diretores

- Marcas dos parceiros - Inscrição para newsletter - Links para as mídias sociais no rodapé - Localização com mapa, notícias de destaque, banner informativo e agenda de eventos na página inicial Estrutura e Navegação

- Barra de navegação horizontal - Barra de busca fixa no cabeçalho junto com a marca e a barra de navegação

- Barra lateral com informações de contato (com mapa), agenda e categorias de notícias, mas a barra lateral não aparece em todas as páginas Tabela 8 - Análise do website www.cenariumdanca.com.br.

140

c. Espaço Cultural para Música, Dança e Teatro. Em: http:// www.soldaterra.com.br/.

Figura 35 - Página inicial do website. Fonte: www.soldaterra.com.br.

Elementos gráficos e paleta de cores Conteúdo

- Esta análise não se aplica a este projeto. - O website é pouco informativo e possuí uma pobreza de informações realmente úteis

- Banner dinâmico na página inicial com as informações sobre as aulas

141 Estrutura e Navegação

- Carregamento lento das páginas e possui baixa acessibilidade pois é feito em Flash

- A página inicial contém botões para os três tipos de categorias de serviços que o Sol da Terra possui (Música, Dança e Teatro)

- Barra de navegação horizontal Tabela 9 - Análise do website www.soldaterra.com.br.

4.1.2.7.3 Grupos de cultura afro-brasileira em Florianópolis Todos os websites a seguir são feitos sob a estrutura pronta de blogs (Blogspot), o que mostra a problemática levantada no início deste projeto, de que os grupos de cultura popular na ilha de Florianópolis não possuem um alto investimento na parte de sua comunicação em geral, principalmente na comunicação digital. A análise será feita focando a estética e o conteúdo, visto que a estrutura de navegação e interação são as mesmas. a. Arrasta Ilha - Grupo de Maracatu e Associação Cultural. Em: http:// arrastailha.blogspot.com.br/

142

Figura 36 - Página inicial do blog. Fonte: http://arrastailha.blogspot.com.br.

Elementos gráficos e paleta de cores

- Plano de fundo de chita (tecido das saias e camisas de danças populares de roda do nordeste, geralmente compostas por flores e folhas em uma mistura bastante colorida)

Conteúdo

- Histórico dos eventos realizados pelo grupo com imagens dos cartazes

- Página de depoimentos Estrutura e Navegação

- Estrutura de blog, com um cabeçalho fixo, um menu horizontal no topo e os conteúdos alinhados um abaixo do outro por ordem cronológica

Tabela 10 - Análise do blog arrastailha.blogspot.com.br.

143

b. Grupo de Capoeira Angola de Florianópolis. Em: http:// angoleirosimsinhofloripa.blogspot.com.br/

Figura 37 - Página inicial do blog. Fonte: http://

angoleirosimsinhofloripa.blogspot.com.br.

Elementos gráficos e paleta de cores Conteúdo Estrutura e Navegação

- Cores azul claro e escuro com texto branco - Página de postagem - Estrutura de blog, com um cabeçalho fixo e os conteúdos alinhados um abaixo do outro por ordem cronológica

- Não há menu de navegação, apenas uma barra lateral fixa com os colaboradores, os arquivos de notícias organizados pelos meses e os seguidores do blog Tabela 11 - Análise do blog angoleirosimsinhofloripa.blogspot.com.br.

144

c. Meiembipe Nagô. Em: http://meiembipenago.blogspot.com.br/ Este blog é destinado a divulgar informações sobre cultura e entretenimento de qualidade na ilha de Florianópolis, que envolvam essas duas culturas: Meiembipe, como os indígenas chamavam a ilha de Florianópolis e Nagô, termo iorubá que faz referência ao negros escravizados e trazidos ao Brasil.

Figura 38 - Página inicial do blog. Fonte: http://

meiembipenago.blogspot.com.br.

145

Elementos gráficos e paleta de cores

- Tons terrosos como o marrom, o bege e o laranja rebaixado

- Cabeçalho com montagens de fotos em preto e branco de pessoas de pele negra, crianças e um malabarista Conteúdo Estrutura e Navegação

- Página de postagem - Estrutura de blog, com um cabeçalho fixo e os conteúdos alinhados um abaixo do outro por ordem cronológica

- Não há menu de navegação, apenas uma barra lateral fixa com a descrição sobre o blog, barra de busca, links dos parceiros, seguidores, os arquivos separados por meses e uma área onde é exibida a imagem da semana Tabela 12 - Análise do blog meiembipenago.blogspot.com.br.

146

4.2 PLANO DE ESCOPO 4.2.1 Objetivos vs. Estratégias de Design Com base nas pesquisas e entrevistas, bem como na análise do Briefing, gerou-se uma síntese dos objetivos do projeto e traçou-se as estratégias de design para contemplar cada ponto abordado. Segundo Phillips, um projeto de design só se torna efetivo quando consegue solucionar o problema proposto. Para isso, é necessário que este problema seja claramente descrito. Além disso, a solução apresentada deve ser coerente com os objetivos do negócio (PHILLIPS, 2007). A meta desta tabela criada é tornar os objetivos e as necessidades do projeto bastante pontuais de forma com que as estratégias sejam abordadas de maneira concreta e tangível, tornando os resultados mais fáceis de serem visualizados. Desta forma, é possível avaliar se existem meios de contemplar os objetivos traçados e de que forma eles serão abordados.

147

Objetivos

Estratégias de Design

1. Facilitar o contato para shows e eventos

1. Formulário personalizado apenas para contratação de shows e eventos

2. Fornecer informações relevantes sobre o grupo

2. Criar uma área institucional para informações específicas do grupo com histórico, breve resumo e outras informações relevantes que sejam de caráter mais formais

3. Convergência das mídias e materiais audiovisuais espalhados pela web

3. Construir uma galeria de fotos e vídeos já publicados e agregar as informações do Facebook e do Twitter no template do site, estando sempre acessíveis e visíveis

4. Priorizar o desenvolvimento humano, coletivo e artístico no lugar da concorrência

4. Demonstrar isso através da democratização dos materiais publicados, liberando o acesso a downloads, permitir área de comentários nas notícias para qualquer usuário e sempre deixar um formulário visível para dúvidas, reclamações e sugestões

5. Estabelecer uma identidade com o trabalho artístico do grupo

5. Explorar uma composição visual condizente às práticas do grupo

6. Firmar um canal de comunicação das atividades, eventos e pesquisas do grupo

6. Divulgação de notícias ao público sob diferentes categorias de acordo com os temas e os índices de interesses

148

Objetivos

Estratégias de Design

7. Fomentar e ser uma referência para o cenário cultural afrobrasileiro da cidade

7. Criar uma sessão para abrigar as informações sobre outros grupos e/ou materiais sobre o que acontece na região sobre cultura afro-brasileira

8. Melhorar o canal de comunicação com os alunos das oficinas

8. Disponibilizar uma sessão no site com material para os alunos das oficinas: fotos, vídeos, referências e textos explicativos sobre os ritmos estudados e praticados em aula

Tabela 13 - Objetivos vs. estratégias de design para o projeto do website do Abayomi.

Esta tabela, uma vez estabelecida, foi apresentada aos membros da direção artística e produção do Abayomi (os mesmos usuários entrevistados na etapa de pesquisa do projeto). Dessa forma, foi possível explicar a tabela e sua abordagem bem como discutir sobre os itens divergentes. Esse processo contribuiu para a economia de tempo e esforços futuros, evitando possíveis modificações em etapas posteriores do desenvolvimento do website. Phillips (2007) ainda comenta sobre o efeito educativo que esta etapa proporciona para as duas partes pois o demandante possui a oportunidade de esclarecer o que realmente deseja, além de conhecer mais sobre o processo de design e o desenvolvimento de conceitos, ao passo em que se compreende melhor sobre os objetivos do projeto e aquilo que se exige para cumprí-los.

149

4.3 PLANO DE ESTRUTURA 4.3.1 Arquitetura da Informação 4.3.1.1 Construção O ponto de partida para se pensar a arquitetura do website foi a elaboração de um mapa mental, o qual se constitui em um diagrama elaborado para representar ideias e conceitos que se encontram relacionados com uma palavra-chave central. O processo se deu quase como um brainstorming, porém realizado individualmente, onde registrou-se todos os conceitos e palavras que surgiam instintivamente a partir do termo central “Abayomi”. Desta maneira, o universo do grupo foi se construindo de forma mais concreta e organizada a partir dos desenhos das informações adquiridas.

150

Figura 39 - Mapa mental sobre o Abayomi. Fonte: autora.

151

Figura 40 - Outro mapa mental sobre o Abayomi. Fonte: autora.

Unindo os conceitos adquiridos com o mapa mental aos resultados dos formulários aplicados na etapa do Briefing, sobre os conteúdos de interesse do público-alvo, chegou-se ao esboço das páginas de conteúdo e navegação do website. Os conteúdos que os participantes do grupo Abayomi têm mais interesse em visitar no site (vide gráfico 14), são: galeria de fotos e vídeos, agenda, notícias sobre o grupo e notícias sobre música e dança de matriz africana. Já os entrevistados que não participam do grupo responderam que seus maiores interesses (vide gráfico 15) são: notícias sobre o grupo, galeria, agenda, informações sobre as oficinas e notícias sobre música e dança de matriz africana. Com estas informações, portanto, foi possível pensar em uma estrutura de navegação principal dentro de uma ordem hierárquica.

152

Figura 41 - Organização dos conteúdos do website a partir dos mapas mentais. Fonte: autora.

153

Figura 42 - Filtragem da estrutura anterior para a formação de conteúdo do website. Fonte: autora.

Conforme as figuras 40 e 41, elaborou-se um fluxo de conteúdo e navegação a partir dos mapas mentais e informações oriundas do Briefing até a construção de uma estrutura provisória, a partir da qual será aplicada a técnica de Card Sorting com alguns usuários visando a elaboração do mapa final do website do Abayomi.

154

Figura 43 - Mapa provisório criado a partir dos mapas mentais e Briefing. Fonte: autora.

4.3.1.2 Card Sorting É uma técnica para avaliar como que os usuários agrupam cognitivamente os conteúdos de um website. Dentro das dimensões da arquitetura da informação propostas por Rosenfeld e Morville (2006, tradução nossa), Card Sorting se encontra dentro da esfera dos usuários, permitindo a construção da taxonomia do seu site a partir da compreensão sobre o que as pessoas pensam sobre determinado tema e qual é o seu vocabulário. É interessante constatar que ao desejar que os usuários encontrem as informações que eles procuram, deve-se organizar os conteúdos com base em seus conhecimentos sobre aquelas.

155

A técnica do Card Sorting foi realizada com três usuários a fim de se chegar em um resultado satisfatório para a arquitetura da informação do site e a primeira sugestão de estrutura criada (vide figura 42) serviu como ponto de partida para aplicar a técnica, conforme a imagem acima. Foram criados 19 cartões contendo as especificações dos conteúdos de cada página e também categorias para as páginas do website. Os usuários testados organizaram as informações como eles as acharam convenientes, de acordo com o conteúdo de cada página e as categorias sugeridas, sendo que estes foram alterados em alguns casos, por sugestão dos próprios usuários, através de recortes de cartões da cor amarela.

Figura 44 - Aplicação do Card Sorting com usuários. Fonte: autora.

156

O usuário 1 relatou a sua confusão com as categorias “Apresentações” e “Agenda”, afirmando que ambas possuem a mesma finalidade e sugerindo a supressão da categoria “Apresentações” para que as informações de datas de apresentações se concentrassem apenas sob a categoria “Agenda”. Segundo o usuário 1, para conhecer mais sobre a concepção das apresentações, e não apenas as datas, ele irá até a categoria “Quem Somos”. Por isso, uma categoria exclusiva para as apresentações se apresenta desnecessária. O usuário 1 também sentiu a necessidade de um item ou uma página dentro da categoria “Quem Somos” que fale diretamente e de maneira sucinta o objetivo do grupo, além do seu histórico, ficha técnica e outras informações sobre o Abayomi. Também foi agregado um item “agenda de oficinas” dentro da categorias oficinas, e a categoria “Notícias” foi colocada em primeiro lugar na estrutura por ser a categoria mais importante e merecedora de maior destaque dentro da estrutura do site, segundo o usuário 1.

157

Figura 45 - Estrutura sugerida pelo primeiro usuário. Fonte: autora.

O usuário 2 também suprimiu a categoria “Apresentações”, reconhecendo-a desnecessária e sugerindo a concentração das informações de data das apresentações sob a categoria da “Agenda”, da mesma forma que o usuário 1. O usuário 2 trocou a denominação “Notícias” para “Blog”, defendendo que este nome é mais propício para o tipo de público e de conteúdo que a categoria oferece. Dentro desta, o usuário 2 também sugeriu uma sessão com notícias relacionadas a outros grupos ou movimentos culturais similares ao do Abayomi, em vez de se concentrar apenas nas notícias relacionadas diretamente ao grupo.

158

Figura 46 - Estrutura sugerida pelo segundo usuário. Fonte: autora.

O usuário 3, além de suprimir a categoria “Apresentações” da estrutura do website, retirou a categoria “Oficinas” da navegação principal e a colocou sob a categoria “Agenda”, constituindo uma sessão do site recheada com as informações sobre o cronograma das atividades do grupo. O usuário 3 também sugeriu o acréscimo de uma galeria de áudios dentro da categoria “Galerias”, cujo conteúdo pode ser tanto faixas de músicas de percussionistas consagrados dentro do cenário da música tradicional como registros dos ritmos trabalhados em aula, para consulta e apreciação dos alunos e demais interessados. O usuário 3 afirmou que a denominação “Quem Somos” não traduz inteiramente os objetivo do grupo e que, de alguma maneira, o nome desta categoria deve ser alterado para também contemplar este ponto. Por isso, o acréscimo do cartão “O que é o Abayomi” junto com a categoria “Quem

159

Somos”. Dentro da categoria “Notícias”, além das notícias relacionadas ao grupo, o usuário 3 sugeriu a presença de notícias relacionadas a outros grupos de cultura afro de Florianópolis e também de pesquisa e história da presença da cultura Malinké na ilha e no mundo. O usuário 3 também enfatizou a importância do item “Home” na barra de navegação principal do site e acrescentou um cartão com esta denominação na sua sugestão de estrutura para o website.

Figura 47 - Processo de construção da estrutura do terceiro usuário. Fonte: autora.

160

Figura 48 - Estrutura sugerida pelo terceiro usuário. Fonte: autora.

Além das constatações descritas acima pelos usuários consultados na prática do Card Sorting, vale apontar os resultados das pesquisas feitas na etapa do Briefing a respeito do conteúdo que os usuários gostariam de encontrar no site do grupo (ver item 4.1.1.2) para a melhor formulação de sua estrutura. Dos usuários consultados que fazem parte do grupo Abayomi, os conteúdos mais apontados como interessantes de serem visitados foram, em ordem decrescente de importância: galeria, agenda, notícias sobre o Abayomi, notícias sobre música e dança de matriz africana, informações sobre as oficinas, informações sobre o Abayomi, notícias e eventos relacionados ao Abayomi e referências de música e dança. Ainda, no item “Algo mais?” alguns usuários sugeriram outros tipos de conteúdos que não constavam na lista fornecida, que foram: ritmos praticados nas oficinas, os usuários

161

poderem também enviar conteúdos para o website de forma interativa e o histórico sobre os ritmos tocados em aula. Dos usuários consultados que não fazem parte do grupo Abayomi, os conteúdos de interesse mencionados foram, também em ordem decrescente de importância: galeria, agenda e notícias do grupo (em primeiro lugar, com o mesmo número de menções), informações sobre as oficinas e notícias sobre música e dança de matriz africana (em segundo lugar, com o mesmo número de menções), referências de música e dança, informações sobre o Abayomi e notícias sobre música e dança em geral. 4.3.1.3 Navegação 4.3.1.3.1 Mapa Ao final das análises do item 4.3.1.2, dos resultados obtidos com a técnica de Card Sorting e também dos formulários aplicados com os usuários na etapa de pesquisa, elaborou-se o mapa final do website do Abayomi.

162

Figura 49 - Mapa final do website do Abayomi. Fonte: autora.

4.3.1.3.2 Fluxograma A partir do mapa do site, o fluxograma define as sequências interativas que ocorrem ao longo da navegação e seus possíveis desdobramentos com o objetivo de descrever as tarefas existentes e especificar as telas que precisarão ser desenvolvidas. Garrett desenvolveu um vocabulário visual para a criação dessas sequências interativas, o qual foi utilizado como referência para este projeto, com o intuito de evitar ambiguidades nas representações. Este fluxograma será complementado pelos storyboards das telas no item 4.4.

163

Figura 50 - Fluxograma do website do Abayomi. Fonte: autora.

164

4.4 PLANO DE ESQUELETO 4.4.1 Wireframes Após definir de que maneira o website irá funcionar através do mapa e do fluxograma, esta etapa apresentará as formas que tais funcionalidades irão tomar dentro do projeto através dos wireframes. O wireframe é um documento detalhado que apresenta de maneira unificada as informações do layout de uma página, dentre elas o design de navegação, de informação e de interface. “Os wireframes capturam todas as decisões do esqueleto dentro de um só documento que serve de referência para o trabalho de design visual e implementação do site” (GARRETT, 2011, p.128). Em resumo, o wireframe é um desenho em forma de linhas e barras que representam todos os componentes de uma página e como eles se encaixam de forma coesa. As figuras a seguir representam os wireframes das páginas: Início, Abayomi, Agenda, Contato, Galerias, Notícias e notícia individual, respectivamente. Os esqueletos foram construídos em cima de um grid de 980 pixels de largura divididos em 12 colunas idênticas de 60 pixels de largura cada uma, separadas por um intervalo de 20 pixels de largura entre elas. Dessa forma, criou-se um suporte para a composição dos elementos do layout, representado por colunas verticais coloridas atrás dos wireframes (vide Apêndice D para conferir os esboços dos wireframes em construção). Todos os layouts possuem um topo e um rodapé iguais. O topo, ou cabeçalho, possui a marca do Abayomi posicionada no canto superior esquerdo e alinhado à sua direita está a barra de busca geral do site e os ícones das redes sociais do grupo. Segundo Memória (2006, p.60), “os dois primeiros elementos que as pessoas procuram em uma homepage

165

são o logotipo e o recurso de busca. As pessoas devem localizar esses itens sem maiores dificuldades”. Logo abaixo, centralizada, está a barra de navegação principal do site seguida por um banner de fotografias do grupo em alta resolução, que deverá ter suas imagens alternando constantemente dentro de um determinado período a ser estabelecido. E abaixo deste, recuado à esquerda da página, encontra-se o breadcrumb trail, conhecido também como “caminho de migalhas de pão” (MEMÓRIA, 2006, p.69), uma navegação estrutural que demonstra o caminho percorrido pelo usuário durante sua navegação. O rodapé é separado em quatro áreas: Links Recomendados, Abayomi no Twitter, Nuvem de Tags e Fale Conosco. Este último conteúdo, durante construção da superfície do layout, foi alterado para a um formulário de inscrição para o usuário receber as atualizações via e-mail. Abaixo dessas quatro áreas foi colocada novamente os links da navegação global, auxiliando o usuário para que ele não precise retornar ao topo da página a fim de acessá-la. Na página inicial, seguindo o topo foi construída uma área de destaque composta por três conteúdos (Quem Somos, Próximos Eventos e Últimas Fotos), que foram selecionados a partir das pesquisas com os usuários sobre os conteúdos de maior interesse dentro do site. Seguindo o corpo da página, foram colocadas as últimas 5 notícias publicadas, de todas as categorias, e uma barra lateral direita com conteúdos de interesse do usuário (vídeo em destaque para assistir e a página do grupo no Facebook para “curtir”, por exemplo).

166

Figura 51 - Wireframes da página inicial do website do Abayomi. Fonte: autora.

167

A página “Abayomi” teve o seu conteúdo principal separado em três áreas de tamanhos iguais, às quais se referem às atuações do grupo: oficinas, apresentações o projetos. Cada área consiste em uma parágrafo explicativo e, na sequência, existem “atalhos” de conteúdos relacionados a cada atuação (galerias de fotos e vídeos e formulários de contato, por exemplo). Para acesso rápido, acima de todo este conteúdo principal existe um parágrafo resumindo as atuações do Abayomi e explicitando seus objetivos.

168

Figura 52 - Wireframes da página “Abayomi”. Fonte: autora.

169

A página da “Agenda”, bem como as páginas “Galerias” e “Notícias”, possuem uma barra de navegação e outra de busca para os seus conteúdos específicos. Quando se navega por essa estrutura local, a conteúdo é carregado mais rapidamente (pois não é preciso carregar os outros elementos da página, como o topo e o rodapé). A navegação local da “Agenda” é baseada nas categorias dos eventos divulgados: Oficinas, Apresentações e Outros. Já, a navegação da página das “Galerias” é divida nos tipos de galerias existentes dentro do site: Fotos, Vídeos e Áudios. A navegação local de “Notícias”, por sua vez, é feita através das categorias de postagens que foram definidas no mapa do site: Apresentações, Eventos, Pesquisas e Oficinas UFSC.

170

Figura 53 - Wireframes da página “Agenda”. Fonte: autora.

171

Figura 54 - Wireframes da página “Galerias”. Fonte: autora.

172

Figura 55 - Wireframes da página “Notícias”. Fonte: autora.

173

A página da notícia individual mantém a mesma navegação local através das categorias das postagens da página das “Notícias”, como também permanece a sua barra lateral. Logo após o título da notícia, há uma imagem de destaque que é apresentada com o nome da categoria e o número de comentários antes de se iniciar a leitura da mesma. Ao término do texto, há uma área de destaque com uma breve biografia e uma fotografia do autor da notícia. Logo em seguida, aparecem os comentários da notícia, um abaixo do outro em efeito cascata.

174

Figura 56 - Wireframes da página de uma notícia individual. Fonte: autora.

175

A página “Contatos” expõe três tipos distintos de formulários de contato. O primeiro é um formulário geral com um campo de texto para envio de mensagens ao grupo. Ao lado esquerdo deste, apresentam-se em forma textual todas as outras maneiras de entrar em contato com o grupo, como telefones e endereços de e-mails dos membros da produção e novamente os ícones das redes sociais. O segundo e o terceiro formulários são voltados para a contratação de uma apresentação e/ ou oficina do Abayomi. A fim de facilitar a comunicação, foram elaborados esses dois formulários com os campos já personalizados de acordo com cada demanda. Da mesma forma que no primeiro formulário, ao lado esquerdo do segundo e terceiro formulários existe um parágrafo explicando brevemente a atividade do grupo a ser contratada, seguido por um botão que levará à página “Abayomi”, onde maiores informações poderão ser encontradas.

176

Figura 57 - Wireframes da página “Contato”. Fonte: autora.

177

4.4.2 Storyboard Como descrito no item 2.2.2.3 deste trabalho, storyboard é uma sequência de representações que demonstram com determinadas tarefas devem ser realizadas. A seguir são demonstradas três diferentes tipos de tarefas possíveis dentro do website do Abayomi.

Figura 58 - Storyboard demonstrando como se navega pelas categorias de notícias. Fonte: autora.

178

Figura 59 - Storyboard demonstrando como acessar a agenda. Fonte: autora.

179

Figura 60 - Storyboard demonstrando como acessar as imagens das galerias e os formulários de contato a partir da página “Abayomi”. Fonte: autora.

180

4.5 PLANO DE SUPERFÍCIE 4.5.1 Elementos da Interface 4.5.1.1 Cores O uso das cores na Web são de extrema importância pois além da questão estética e da materialização do conceito do projeto em uma paleta estabelecida, as cores ajudam as pessoas a tomarem decisões, destacar itens, organizar a informação, motivar uma ação e enriquecer as experiências de navegação, de acordo com Lennartz e Friedman (2009). Para definir a paleta de cores a serem aplicadas nas interfaces do website do Abayomi, uma comparação foi feita entre as paletas de cores presentes nos websites de referência dentro do Briefing (vide item 4.1.2.7.1), na identidade visual do Abayomi (vide Figura 15) e nas suas aplicações.

181

Figura 61 - Aplicações da identidade visual do Abayomi. Fonte: autora.

Figura 62 - Paletas de cores da identidade visual do Abayomi e dos sites relacionados à dança e percussão afro ocidental. Fonte: autora.

182

Além disso, foi preciso atentar ao planejamento gráfico, que previu grandes áreas de destaque para imagens (no banner do cabeçalho e nas páginas das galerias de fotos e vídeos, por exemplo) e também ao grande fluxo de conteúdo que o website apresenta, fazendo com que as suas imagens estejam sempre mudando e, com isso, também as suas informações de cor. Neste caso, um plano de fundo neutro se faz bastante coerente, para que as informações tenham destaque e não compitam com o fundo da página, além de evitar uma miscelânia de cores imprevisíveis que servirão apenas para confundir o usuário. A presença da textura na aplicação da identidade visual é bastante coerente com a atuação do grupo (intervenção urbana) e já foi usada em diversas peças gráficas do grupo (cartazes, folders e cartão de visita, por exemplo).

Figura 63 - Textura aplicada ao cartão de visita do grupo Abayomi. Fonte: autora.

183

Dessa forma, a textura rude em tom de cinza foi agregada à interface desdobrando-se em uma paleta neutra de tons de cinza e preto para compor a interface gráfica do website, fazendo com que a marca do Abayomi e as fotografias do grupo e demais imagens distribuídas pela website ganhem destaque e se tornem a própria composição cromática.

Figura 64 - Paletas de cores selecionada para o layout. Fonte: autora.

4.5.1.2 Tipografia Segundo Robert Bringhurst (2005, p.23), a tipografia é um ofício por meio do qual os significados de um texto (ou sua ausência de significado) podem ser clarificados, honrados e compartilhados ou conscientemente disfarçados.

Ou seja, a tipografia tradicional apresenta a função de honrar o conteúdo que está sendo transmitido através de uma série de princípios. No entanto, a tipografia Web envolve uma gama de outras aplicações que reforçam esses princípios através da seleção, arranjo e configuração dos tipos digitais, enriquecendo a mensagem do texto e fornecendo um cenário dentro do qual o mesmo possa ser apresentado. Lennartz e Friedman (2009) afirmam que a qualidade da escrita na Web é frequentemente negligenciada, sendo a escolha de uma fonte legível, a

184

organização dos itens na página e a correção gramatical suficientes para contemplar essa atividade. Dessa maneira, os autores descrevem alguns conceitos básicos para as boas práticas da tipografia na Web, que foram levados em conta neste projeto, dentre eles a legibilidade e a leiturabilidade.

- Legibilidade: relaciona-se com a facilidade com que cada caractere, letra ou grifo se distinguem entre si. Não se pode alterar o aspecto de certos tipos já estabelecidos mas algumas convenções são aplicadas para ajudar neste aspecto da legibilidade, como utilizar a fonte regular em vez de itálico, caixa baixa para no lugar da caixa alta e aplicar um bom contraste entre o texto e o fundo.

- Leiturabilidade: é influenciada pelo layout, pela organização dos blocos de conteúdo e a apresentação de itens individuais. As pessoas lêem textos na Web diferentemente de como lêem em uma interface material, por isso muito da questão da leiturabilidade depende do comportamento do usuário. Para tanto, foram selecionadas duas famílias tipográficas para comporem os blocos de textos, linhas de título e os botões da interface do website do Abayomi: Droid Sans e Droid Serif. Essas duas famílias de tipos foram projetadas por Steve Matteson, são fornecidas gratuitamente pela Google e foram otimizadas para a leitura confortável de textos nos navegadores Web e em outros tipos de telas digitais.

185

Figura 65 - Combinação das fontes Droid Serif (título) e Droid Sans (parágrafo). Fonte: Google.

186

Figura 66 - Família tipográfica Droid Serif. Fonte: Google.

Figura 67 - Família tipográfica Droid Sans. Fonte: Google.

187

4.5.1.3 Texturas A textura contempla um dos conceitos do design da interação chamado “affordance”, que é a qualidade que comunica a maneira com que o usuário deverá utilizar alguma coisa. Traduzindo este conceito para o design de interface em uma tela, a textura serve para mostrar se algo é clicável, por exemplo, e a resposta imediata do objeto à sua ação (como em um botão, por exemplo).

Figura 68 - Botão desenvolvido para o rodapé do website. Fonte: autora.

A textura também serve como metáfora ao fornecer aos elementos da interface um aspecto mais real e tangível, gerando uma experiência ao usuário enquanto navega no website.

Figura 69 - Detalhe para o fundo texturizado e a sombra no banner. Fonte: autora.

188

Figura 70 - Detalhe para os divisores de conteúdo do rodapé. Fonte: autora.

4.5.2 Interfaces As interfaces representam a última etapa deste trabalho, a contemplação de todos os conceitos e práticas abordadas durante o desenvolvimento do projeto bem como o cumprimento do objetivo geral deste trabalho. Nelas, estão visíveis todos os elementos gráficos mencionados neste último item do Plano da Superfície.

189

Figura 71 - Interface da página inicial do website. Fonte: autora.

190

Figura 72 - Interface da página “Abayomi” do website. Fonte: autora.

191

Figura 73 - Interface da página “Agenda” do website. Fonte: autora.

192

Figura 74 - Destaque para o pop-up de um evento clicado no calendário da página “Agenda”. Fonte: autora.

193

Figura 75 - Interface da página “Notícias” do website. Fonte: autora.

194

Figura 76 - Interface uma notícia específica. Fonte: autora.

195

Figura 77 - Interface da galeria de vídeos da página “Galerias”. Fonte: autora.

196

Figura 78 - Interface da galeria de álbuns de fotos da página “Galerias”. Fonte: autora.

197

Figura 79 - Detalhe para a apresentação de uma imagem dentro do álbum de foto da página “Galerias”. Fonte: autora.

198

Figura 80 - Interface da página “Contatos” do website. Fonte: autora.

199

Figura 81 - Detalhe do topo da página inicial do website. Fonte: autora.

Figura 82 - Detalhe da página de uma notícia específica. Fonte: autora.

200

Figura 83 - Detalhe da biografia do autor e da sessão de comentários dentro da página de uma notícia específica. Fonte: autora.

201

Figura 84 - Detalhe da rodapé do website. Fonte: autora.

202

5 CONCLUSÃO

!

Este trabalho apresentou como principal objetivo o

desenvolvimento do website do Abayomi até a produção das suas interfaces gráficas, tendo como base teórica a importância do papel do design centrado no usuário ao longo de todo o processo, justificado através dos conceitos de design de interação, de experiência, de interface e da usabilidade. A metodologia dos cinco planos conceituais proposta por Garrett serviu de roteiro para o desenvolvimento de todas as etapas e facilitou a compreensão e a previsão da demanda de tempo e conteúdo pertencentes a cada uma delas, no entanto enquanto metodologia de desenvolvimento de websites os cinco planos propostos por Garrett mostraram-se superficiais, o que ocasionou uma adaptação a partir dos conteúdos abordados no capítulo 2 deste trabalho. Os objetivos do Abayomi e as necessidades dos seus usuários foram o foco principal do projeto, mas somente através da construção do Briefing e da aplicação das pesquisas e entrevistas com o público-alvo foi possível determinar as reais necessidades desses usuários e, consequentemente, os objetivos que o grupo teria que contemplar com este trabalho. Estes objetivos são apresentados na etapa do Escopo na forma de uma tabela (vide Tabela 13), sugerida por Phillips (2007), onde são também traçadas as estratégias de design necessárias para realizálos. Foi possível perceber que as interfaces projetadas apresentam um resultado satisfatório de maneira geral, porém, observa-se que dois destes objetivos não foram completamente contemplados e as estratégias deverão ser melhoradas para alcançar o que foi definido no plano do escopo. Priorizar o desenvolvimento humano, coletivo e artístico no lugar da concorrência só será possível se, além da comunicação

203

horizontal que o grupo possui com o seu público, existir de fato uma democratização dos materiais e saberes produzidos pelo Abayomi através do acesso livre a esses conteúdos via downloads disponbilizados no website. Esta estratégia, apesar de traçada no trabalho, não foi contemplada com este projeto. O outro objetivo que não foi alcançado é o que cita o grupo como fomentador do cenário cultural afro-brasileiro através da divulgação de informações e materiais de outros grupos de cultura afro na região em que atua. O que se tem, por ora, é uma sessão de links que levam a websites de grupos e instituições relacionados ao Abayomi e ao cenário de cultura afro malinké e afro-brasileira, porém, não entrou no projeto a construção de uma sessão especial para uma produção mais profunda e específica de conteúdo acerca da cultura afrobrasileira e da dança afro malinké em Florianópolis e no Brasil. Uma vez analisadas estas deficiências, serve de recomendação a abordagem dessas estratégias para a futura implementação do website. Outro ponto importante a ser mencionado é a questão das interfaces do website não terem sido implementadas, acarretando na impossibilidade de avaliação dos resultados do design de interação e de experiência. Estes só poderão ser mensurados quando as interfaces poderão ser testadas pelos usuários. Destaca-se também a atenção dada ao contexto social e cultural durante todo o desenvolvimento do projeto, uma vez que o ofício de designer gráfico vai muito além de um simples discurso operativo. Este é construído sobre uma plataforma técnica e artística mas que também carrega consigo um propósito cultural, ao estabelecer-se como uma forma de intervir no debate cultural que se desenvolve permanentemente dentro da sociedade. Uma das maiores responsabilidades culturais do designer é produzir comunicação que, de fato, comuniquem algo pois sem a mesma simplesmente não há cultura.

204

205

REFERÊNCIAS ALMEIDA, Andreia; GRECO, Giuseppe; SOBRAL, Joana; SILVA, João; OLIVEIRA, Monica; LOURENÇO, Rafael. Design de Experiência [1]. In:_____. Mais Arquitectura. Lisboa: Arcatura, 2007. p. 74-81. Disponível em: . Acesso em: 24 set. 2012. AMSTEL, Frederick van. Card Sorting é melhor que buraco. Disponível em: . Acesso em 14 dez. 2012. AMSTEL, Frederick van. Fluxograma de Interação/ Navegação. Disponível em: . Acesso em 9 de jan. 2013. BAB.LA Dicionário. Disponível em: . Acesso em 17 out. 2012. BERVIAN, Pedro A; CERVO, Amado L.; SILVA, Roberto da. Metodologia Científica. 6. ed. São Paulo: Pearson, 2007. BRINGHURST, Robert. Elementos do estilo tipográfico. Título original: Elements of typographic style. Tradução: André Stolarski. São Paulo: Cosac Naify, 2005. CARD Sorting. Disponível em: . Acesso em 14 dez. 2012.

206

CARD Sorting | Usabilidade. Disponível em: . Acesso em 14 dez. 2012. CETIC. TIC Domicílios e Usuários 2011 - Total Brasil. Disponível em: . Acesso em 14 set. 2012. CIDADÃO Invisível. Direção e produção: Alexandra Alencar. Fotografia: Camila de Sousa. Florianópolis, 2006. (22 min). COOPER, Alan; REIMANN, Robert; CRONIN, Dave. About Face 3: The Essentials of Interaction Design. Indiana: Wiley Publishing, 2007. Design Centrado no Usuário - UCD. Disponível em: . Acesso em: 17 set. 2012. Autor desconhecido. DUYNE, Douglas K. Van; LANDAY, James A.; HONG, Jason I. The Design of Sites: Patterns for Creating Winning Web Sites. 2. ed. New Jersey: Pearson, 2011. FORTES, Simone. Transbordamentos: Danças ‘Afro’ em Florianópolis. Florianópolis, 2008. Trabalho de Conclusão de Curso (Artes Visuais) - CEART, Universidade do Estado de Santa Catarina. FRASCARA, Jorge. Diseño gráfico para la gente: Comunicaciones de masa y cambio social. 1a ed. Buenos Aires: Infinito, 2008.

207

GARRETT, Jesse James. The Elements of User Experience: UserCentered Design for the Web and Beyond. 2. ed. California: New Riders, 2011. GARRETT, Jesse James. A visual vocabulary for describing information architecture and interaction design. Disponível em: . Acesso em: 9 jan. 2013. GIL, Antonio Carlos. Como Elaborar Projetos de Pesquisa. 4. ed. São Paulo: Atlas, 2002. KALBACH, James. Design de Navegação Web: Otimizando a Experiência do Usuário. Porto Alegre: Bookman, 2009. LAKATOS, Eva Maria; MARCONI Marina de Andrade. Fundamentos da Metodologia Científica. 5. ed. São Paulo: Atlas, 2003. LENNARTZ, Sven; FRIEDMAN Vitaly. The Smashing Book. Alemanha: Smashing Media GmbH, 2009. ROTO, Virpi. User Experience from Product Creation Perspective. In: Towards a UX Manifesto. 3 set. 2007. 31-34. Disponível em: . Acesso em 5 out. 2012.

MEMÓRIA, Felipe. Design para a internet: projetando a experiência perfeita. Rio de Janeiro: Elsevier, 2006.

208

MORVILLE, Peter; ROSENFELD, Louis. Information Architecture for the World Wide Web. 3 ed. California: O’Reily, 2006. MÜLLING, Tobias Tessmann; PEREIRA, Alice Theresinha Cybis. Projetar para a experiência: análise da metodologia para a construção de um website fundamentado nos 5 planos da experiência do usuário. Anais do 8o Congresso Brasileiro de Pesquisa e Desenvolvimento em Design. 8 -11 out. 2008. São Paulo. NIELSEN, Jakob; LORANGER, Hoa. Prioritizing Web Usability. Berkeley: New Riders, 2006. NIELSEN, Jakob. Projetando Websites. Rio de Janeiro: Campus, 2000. NIELSEN, Jakob. Usability Engineering. California: Academic Press, 1993. NIELSEN, Jakob. Ten Usabilities Heuristics. Disponível em: . Acesso em: 18 out. 2012. NORMAN, Donald. Design Emocional: Por que adoramos (ou detestamos) os objetos do dia-a-dia. Rio de Janeiro: Rocco, 2004. NORMAN, Donald. O design do dia-a-dia. Rio de Janeiro: Rocco, 2006.

209

______. O poder do mercado cultural. Disponível em: . Acesso em: 24 out. 2012. PHILLIPS, Peter L. Briefing: A gestão do projeto de design. São Paulo: Blucher, 2007. PREECE, Jennifer; ROGERS, Yvonne; SHARP, Helen. Design De Interação: Além da interação homem-computador. Porto Alegre: Bookman, 2005. SHNEIDERMAN, Ben. Universal Usability. Communications of the ACM. 2000 mai; 43(5): 85-91. SHNEIDERMAN, Ben; PLAISANT, Catherine. Designing the user interface: strategies for effective human-computer interaction. 4 ed. New Jersey: Pearson, 2005. SILVA, Carlos Alberto da. Design emocional: afetos positivos e negativos nas interações com ambientes web. Universidade Federal de Santa Catarina. Florianópolis, 2011. SOUSA, Ana Paula; NEY, Thiago. Movido a patrocínio, mercado cultural brasileiro não se sustenta sozinho. Folha de S. Paulo. 19 de set. 2009. Disponível em: . Acesso em 18 jun. 2012.

210

TEIXEIRA, Fabricio. Os entregáveis de arquitetura da informação. Disponível em: . Acesso em 8 de jan. 2013.

211

APÊNDICE A - Imagens do Blog grupoabayomi.wordpress.com

Print do Blog do Abayomi de agosto de 2011. Fonte: www.grupoabayomi.wordpress.com

212

Print do Blog do Abayomi de agosto de 2011. Fonte: www.grupoabayomi.wordpress.com

P r i n t d o B l o g d o A b a y o m i d e s e t e m b r o d e 2 0 11 . F o n t e : www.grupoabayomi.wordpress.com

213

APÊNDICE B - Formulário aplicado durante o Briefing FORMULÁRIO // WEBSITE DO ABAYOMI // Para quem? Este formulário é destinado aos alunos das oficinas do grupo Abayomi, produtores culturais e conhecedores do grupo em geral. Ou seja, o pré-requisito para esta pesquisa é conhecer o Abayomi. O preenchimento será pelo próprio investigador ou pelo próprio pesquisado sob sua orientação. // Por quê? Esta pesquisa está sendo realizada com o intuito de entender o comportamento dos usuários que acessam o atual blog do Abayomi e o que eles esperam para o novo website do grupo. O resultado dessa pesquisa será usado no novo projeto do website do Abayomi. Espero a colaboração de todos!

DATA: ________________

- Gênero: __________________________________________ - Idade: ___________________________________________ - Ocupação: ________________________________________ (em caso de estudante, especificar o curso e a universidade)

- Cidade / UF: ______________________________________ 1. Você conhece o Abayomi de que maneira?

!Sou aluno(a) das oficinas

214

!Já assisti a alguma apresentação !Sou amigo/ parente de participante do grupo !Sou músico/ dançarina que já fez parcerias com o grupo !Sou produtor cultural/ empresário interessado no grupo !Outro: _________________________ 2. Há quanto tempo está no grupo? No caso de ser aluno de oficinas ou membro do Abayomi. __________________________________________________________

3. Você conhece o website do Abayomi?

!Sim !Não 4. Se Sim, como você conheceu o website?

!Pelo próprio grupo (lista de e-mails, facebook, pessoalmente, etc)

!Em alguma divulgação de evento/ festa !Por um amigo(a) !Outro: _________________________ !Não conheço o website. 5. E com que frequência você o acessa?

215

!Quase nunca !Só quando sái alguma notícia !Entro regularmente pra ver as novidades !Outro: _________________________ !Não acesso. 6. O que você acha do blog? Descreva aqui a sua experiência de navegação do website. (Você encontra o que você deseja? É fácil navegar por ele? Ele é agradável visualmente?) __________________________________________________________ __________________________________________________________ __________________________________________________________ __________________________________________________________

7. Qual a sua experiência de uso com o computador e a internet? (0 não costuma acessar a internet, apenas checar e-mails/ 5 - Heavyuser, acessa com frequência e domina as tecnologias da internet) 0

1

2

3

4

5

8. O que você espera encontrar dentro do website do Abayomi? (múltipla escolha)

!Galeria de fotos e vídeos !Agenda de apresentações e eventos !Informações sobre o grupo

216

!Informações sobre as oficinas regulares !Notícias sobre o grupo !Notícias sobre música e dança de matriz africana !Notícias sobre música e dança em geral (não apenas “afro”) !Notícias sobre eventos e festas relacionados ao grupo !Referências de música e dança (vídeos, fotos, textos, links, arquivos pra download, etc)

!Algo mais?

__________________________________________________

9. Por favor, deixe aqui uma sugestão ou comentário em relação ao futuro website do Abayomi para que possamos chegar ao melhor resultado possível! __________________________________________________________ __________________________________________________________ __________________________________________________________ __________________________________________________________

217

APÊNDICE C - Entrevista aplicada durante o Briefing ENTREVISTA // WEBSITE DO ABAYOMI // Para quem? Diretores Artísticos e Produtores do Abayomi // Por quê? Esta pesquisa está sendo realizada com o intuito de entender a visão interna do grupo Abayomi a respeito do seu novo website, dos seus diferenciais e da sua importância para o cenário cultural local.

1. Qual a importância de um website para o Abayomi neste momento? 2. O que você acha que é mais importante ter neste novo website? 3. Para você, o que mais atrai as pessoas a acessarem o atual blog do Abayomi?

4. Na sua opinião, qual o maior diferencial do Abayomi em relação aos seus concorrentes?

5. Na sua opinião, qual o maior diferencial do Abayomi em relação aos seus parceiros?

6. Como você acha que o website do Abayomi poderá contribuir para o cenário cultural afro-brasileiro em Florianópolis?

7. Quais as funcionalidades e/ou recursos de comunicação e serviços são esperados com este projeto?

218

APÊNDICE D - Esboços dos Wireframes

219

220

ANEXO A - Indicadores de uso da internet em 2011 feito pelo CETIC.br

Atividades desenvolvidas na internet: busca de informações e serviços on-line. Fonte: http://www.cetic.br/.

221

Atividades desenvolvidas na internet: comunicação. Fonte: http://www.cetic.br/.

Atividades desenvolvidas na internet: lazer. Fonte: http://www.cetic.br/.

222

Frequência do acesso individual à internet. Fonte: http://www.cetic.br/.

223

Proporção de indivíduos que usam a internet para busca de informações e serviços on-line. Fonte: http://www.cetic.br/.

224

Proporção de indivíduos que usam a internet para o lazer. Fonte: http:// www.cetic.br/.

225

Proporção de indivíduos que usam a internet para se comunicar. Fonte: http:// www.cetic.br/.

226

ANEXO B - Boletim de preços de mão-de-obra referentes ao ano de 2011, pelo Ministério da Cultura

Lista de mão-de-obra por estados. Fonte: http://www.cultura.gov.br/.

Lista de mão-de-obra por estados. Fonte: http://www.cultura.gov.br/.

227

Lista de mão-de-obra por estados. Fonte: http://www.cultura.gov.br/.

-------

Lihat lebih banyak...

Comentários

Copyright © 2017 DADOSPDF Inc.