literato: desenvolvimento de website

mateus alves

introdução

O cliente deste Trabalho é o projeto Literato. Um projeto real, cujo conceito é a provocação cultural e tem como principal objetivo preservar, divulgar e vender as obras do poeta e professor Manoel Affonso e do artista plástico Victor Moreira, além de comercializar outros produtos “provocadores de cultura” criados por colaboradores.

introdução

• Identificar a necessidade do cliente, encontrar e desenvolver uma peça com o objetivo de apresentar o Projeto;

• Peça para apresentar o projeto de maneira geral, além de funcionar como catálogo de produtos e dar suporte ao que vem sendo divulgado a respeito do Projeto na mídia;

• A solução encontrada foi a construção de um website, ferramenta que traz uma relação estreita entre negócio e entretenimento;

função do trabalho

introduçãoO avanço, nos últimos anos, e sua extensão definitiva para o grande público com o surgimento da Web, integra todas as possibilidades em uma única interface com formato hipermídia, ou seja, uma combinação de multimídia e hipertexto (SANCHO, 1999).

Porque a internet representa a principal arma de controle do consumidor tecnologicamente informado. [...] uma vez que os consumidores estão a afastar-se dos canais que não controlam, como a televisão e a impressa, voltando-se para os que podem controlar, como a internet, os sistemas de jogos de vídeo os iPods, telemóveis e os PVRs (WIDDEMAN, 2005).

• Aspecto dinâmico dos links;• Reúne elementos que atendem aos anseios do cliente em questão.

sobre a internet

objetivosObjetivo Geral

- Criar e desenvolver a interface gráfica para o website do Projeto Literato.

Objetivos Específicos

- Reunir as idéias e obras dos artistas envolvidos no Projeto Literato em um ambiente de fácil acesso, reunindo entretenimento, cultura e negócios.

- Arquitetar as informações do website.- Desenvolver, a partir de referências estéticas, uma identidade visual para o website do Projeto Literato.

- Criar os layouts das páginas que compõem o site do Projeto Literato,

de acordo com a estética desenvolvida e com o conteúdo exposto.

briefing

Na origem da palavra, o termo literato quer dizer “pessoa que se ocupa de literatura”, “escritor” (LAROUSSE). No caso em questão, Literato é o nome dado a um projeto real, cujo conceito é a provocação cultural.

“Provocação cultural” é o que une os seus criadores e o seu público. Logo, qualquer forma de provocar cultura é alimento para esta união, sejam as palavras, as artes plásticas, a música e também os negócio.

briefing

Manoel Affonso

Victor Moreira

é historiador, arquiteto, pós-graduado em Educação, professor de História Geral e História da Arte e sócio-diretor do Colégio Atual (Recife). Atualmente, Manoel dedica-se, além do Projeto Literato, à publicação de suas principais idéias, sintetizando-as sob a forma de citações em breves textos.

definido por dois adjetivos fortes e atuais: libertário e inovador (NE TV, 2008). Nascido em Olinda-PE em 1934, Victor é formado em Odontologia, mas desempenhou a profissão somente por dois anos, até tornar-se um estilista e estampador de sucesso, recebendo vários prêmios.

briefingdefinição do problema

- Levar ao público final o Projeto, as idéias e os produtos;- Estabelecer um canal de relacionamento;- Ferramenta simples e acessível, que servisse como cartão de visitas do Literato.- Tornar conhecidas as obras de Manoel (palavras e desenhos) e Victor (estampas).

Website, espaço para o internauta:- conhecer o Projeto de maneira geral;- funcionar como um catálogo de produtos;- dar suporte.

briefingdefinição do problema

Entre os produtos expostos no site, estão também outras criações, todas ligadas ao conceito chave do Projeto como “provocadoras de cultura”. É o caso da camiseta “Tibet Free” (abaixo) e “Bombardeio de Idéias”, entre outras.

briefing público-alvo

O público-alvo do Projeto é formado por pessoas inquietas com o mundo e com as questões sociais, que partilham de idéias inovadoras e revolucionárias, podendo estar ligadas ou não a movimentos culturais, artísticos e ou em qualquer outro segmento e atividades profissionais.

processode criação

- Pesquisa a respeito dos artistas: Que conteúdo eles produziam? (briefing);- O que o website teria a oferecer para satisfazer às necessidades do cliente;- Reuniões foram feitas com o cliente e equipe - diretor de arte, encarregado da programação do website, jornalista etc;- Definir a arquitetura das informações e a linha conceitual que deveria ser seguida; - Pesquisas de referência e rafes foram feitos, apresentados, alterados e aprovados com o cliente.

referências

Foi feita uma pesquisa buscando referências visuais e técnicas em websites de projetos culturais, de portfólios de artistas plásticos e também de lojas que comercializam produtos do segmento semelhante ao do nosso cliente. Entre as referências encontradas, aqui estão algumas que tiveram relevância na elaboração do leiaute do site do Literato seguidos de uma breve justificativa.

referências

01

- diferentes texturas para dividem o seu conteúdo

- menu que não muda

- foto com moldura espessa (tipo Polaroid)

the crossings

02

- animação - fotos

- literato: animações simples

red&blu

03

- papel sustenta conteúdo

- ambiente de trabalho da artista

- lietarto: papéis sobre texturas

alexandru cohaniuc

04

- textura em segundo plano

lucy blackmore

05

- concentração das informações

- dispensa o uso de rolagens

pain is good

06

- disposição dos produtos

- literato: não vende

camiseteria / threadless

rafes

Os rafes (roughs) são desenhos feitos à mão usados para apresentar idéias brutas para uma pré aprovação (CARVALHO, s.d.).

Para que a cliente pudesse visualizar a idéia de construção de leiaute do site e suas características técnicas, foram feitos alguns rafes que mostram desde a posição dos elementos até a lógica de funcionamento da interface.

rafes

- menu móvel: espaço depende da

quantidade de informação

- páginas abaixo do menu

arquitetura

“a criação de um protótipo permite que os designers gráficos desenvolvam relações entre qual é a aparência

do site e qual é a sua compatibilidade com o design das informações da interface para navegação”.

A organização hierárquica é praticamente uma exigência na Internet. (GUIA DE ESTILO DA WEB, 2004)

linguagem

A velocidade com que o consumidor se relaciona com websites também se refletem nas estatísticas que mostram que: “interessante é o facto de 50% dos utilizadores nunca passarem da página principal, de entrada. Tal significa que não viram nada de interessante ou suficientemente apelativo para clicarem uma vez onde quer que fosse e prosseguirem a consulta” (WIDDEMANN, 2005).

defesa

A idéia de usar papel como elemento principal para o desenvolvimento da interface gráfica do website veio do princípio de que ele é a base ou a matéria-prima usada pelos dois artistas como suporte para seus trabalhos.

Todo o site foi construído sobre lâminas de papel organizadas de forma descontraída, buscando transmitir a idéia de movimento e leveza.

“Sem o impacto visual de formato, cor e contraste, as páginas ficam graficamente desinteressantes e não motivarão a pessoa que as estiver visualizando” (LYNCH, HORTON, 2004, p.81).

dos elementos

defesa

- disposto em uma barra horizontal móvel;- se desloca a cada página nova que é aberta;- sobe ou desce, dando espaço pra que essas informações sejam melhor trabalhadas;- links são apresentados sobre a barra do menu na home como o único elemento de destaque sobre um fundo opaco (o visitante não se sentirá perdido); - não desaparece de vista em nenhum momento da navegação.

dos elementos

menu

estudo de cores

Conforme afirma Farina (1990), “psicólogos estão de comum acordo quando atribuem certos significados a determinadas cores que são básicas para qualquer indivíduo que viva dentro da nossa cultura”

- Preto: “é alegre quando combinado com certas cores. Às vezes tem conotação de nobreza, seriedade” (FARINA, 1990).

- Amarelo: iluminação, conforto, idealismo, espontaneidade, originalidade. “Simboliza a cor da luz irradiante em todas as direções” (FARINA, 1990).

apresentação da interface gráfica

considerações

- atenção: reunir informações, objetivos, perfil do público, arquitetura, estética, orçamento, etc;- itens como mensuração e manutenção do website são igualmente importantes, mas não aprofundados neste trabalho; - reunião de idéias e obras dos artistas + entretenimento, cultura e negócios.- colocou em estudo e em prática todas as etapas da criação;- liberdade de utilização de obras originais (desenhos e texturas) para a elaboração do leiaute;- sair da esfera de leiautes em maioria feitos para impressos.

finais

mateus alvesOlinda, 2008