Conforme já foi referenciado, este processo é baseado numa obra intitulada: The Design of Websites – Patterns, principles, and processes for crafting a customer-centered web experience, de Van Duyne et al. A abordagem é altamente centrada no desenvolvimento web e a perspectiva tende para websites direccionados para o e-commerce. No entanto, apesar desta tendência (não muito evidenciada), este manual é um excelente e fundamental recurso no que diz respeito à construção de websites que sejam úteis, usáveis e que proporcionem uma experiência agradável e significativa ao nível da sua utilização. Um outro aspecto fundamental que faz deste manual algo extremamente útil é a forma como expõe, comunica, e utiliza Patterns no processo de criação e avaliação.

O que são Patterns

Patterns foram originalmente desenvolvidos pelo arquitecto Christopher Alexander e outros colegas e publicados em 1977 num livro intitulado A Pattern Language: Towns, Buildings, Construction, publicado pela Oxford University Press (Van Duyne et al, 2003:19).

A intenção de Alexander, bastante criticada por outros arquitectos da altura, era criar uma linguagem constituída por soluções específicas para problemas específicos. Alexander criava assim um conjunto de regras que visavam apoiar o processo de criação e oferecer soluções interessantes que inevitavelmente seriam necessárias, neste caso específico, na criação de edifícios, cidades, espaços públicos, entre outros.

Patterns communicate insights into design problems, capturing the essence of the problems and their solutions in a compact form. They describe the problem in depth, the rationale for the solution, how to apply the solution, and some of the trade-offs in applying the solution. (Van Duyne et al, 2003:19)

Desde então muitas pessoas documentaram e continuam a documentar Patterns. Neste caso os Patterns aqui descritos são direccionados para a web, centrados nos utilizadores e nas suas necessidades.

Sete fases distintas do processo

O processo que se encontra aqui definido é extremamente simples, claro e eficiente, abarcando desde a pesquisa ao nível dos utilizadores até à fase de avaliação do website final. O manual divide o processo de desenvolvimento em sete fases distintas, e igualmente iterativas e centradas no utilizador.

• Descoberta – Compreender o público-alvo, as suas necessidades e objectivos. Perceber objectivos de negócio e de que forma se relacionam com os objectivos dos utilizadores;
• Exploração – Gerar esboços iniciais até ser feita uma selecção de um deles com o intuito de ser desenvolvido na fase seguinte;
• Refinamento – Definir claramente fluxograma, storyboard e layout;
• Produção – Desenvolver um protótipo interactivo e especificações de Design. Este protótipo interactivo não é de forma nenhuma um produto acabado. Este protótipo pode ser apresentado em papel ou ser simplesmente constituído por imagens individuais trabalhadas digitalmente que dizem respeito a cada um dos layouts. As especificações de Design é um documento onde se encontra de forma detalhada tudo o que diz respeita a cada elemento de Design que se encontra na interface (cores, medidas, forma, entre outros);
• Implementação – Desenvolver código, e tratar e inserir conteúdos;
• Lançamento – Colocar o website online pronto a ser usado;
• Manutenção – Todo o trabalho de manutenção. Seja ao nível de conteúdos, funcionalidades, comportamento, forma. Além disto, nesta fase também se procede à avaliação do website preparando o próximo Redesign do projecto.

Descoberta

Na fase de Descoberta, o cliente e quem desenvolve devem partilhar o mesmo conhecimento de quem é o público-alvo, as suas necessidades e objectivos, representadas num documento intitulado “análise de público-alvo”. Além deste documento surge também um outro, onde se definem claramente os objectivos de negócio, intitulado “objectivos de negócio”. E por fim , também se definem as funcionalidades que o website deverá providenciar aos utilizadores. Estas especificações dão origem a um outro documento intitulado “Especificações do website”.

Uma série de perguntas deverão ser colocadas durante o desenvolvimento do website nesta fase.

“What value will the website provide to customers?”
“What will it accomplish?”
“Is its goal to sell products online, promote products, educate, inform, provoke, communicate, or provide a community?”
“What will be the focus of thw website?”
“Why should the website be build at all?”
“What value will the website provide to the client?”
“What role does the Web website play in relation to the resto f the company?”
“How will the website further the client’s overall goals?”
(Van Duyne et al, 2003)

As técnicas aqui utilizadas são muitas vezes entrevistas com potenciais utilizadores e com os clientes para clarificar aquilo que é esperado do website e as necessidades dos utilizadores. Também se recorre muitas vezes à observação directa de utilizadores a concretizarem tarefas que estejam ligadas directamente com o website e com a natureza das suas funcionalidades. É também aqui que são feitas avaliações de um website existente com o intuito de redesenhar.

Exploração

Num processo de brainstorm exploram-se aqui potenciais propostas. A ideia não é especificar cores, imagens, tipografia, entre outros aspectos específicos, mas sim esboços que reflitam a estrutura e navegação do website.

No final desta fase existirão diversos protótipos que serão discutidos com o cliente. Este, por sua vez e em conjunto com o designer (ou a equipa de designers) escolherão um para ser desenvolvido nas fases seguintes.

Os protótipos gerados nesta fase serão sempre protótipos de baixa fidelidade. Esboços em papel que representam fluxogramas, storyboards, layouts, pormenores de elementos, apontamentos de navegação, entre outros.

Refinamento

Esta fase, basicamente, consistirá trabalhar de forma bastante mais detalhada a proposta escolhida na fase anterior. Assim sendo, fluxograma, storyboard e layout são aqui criados tendo já em consideração o look and feel final do website que se está a desenvolver.
No final, existirá um protótipo de alta fidelidade que poderá ser constituído por uma série de imagens trabalhadas digitalmente que sejam uma abordagem fiel daquilo que será o produto final.

É importante salientar que muitas vezes, nesta fase, o Designer não desenha cada página do website individualmente, mas sim trabalha numa perspectiva de Template. Isto é, cria páginas-modelo para cada um dos tipos de páginas que existirão no website (páginas principais, secundárias, de contactos, entre outras).

Produção

A fase de produção partilha muitas semelhanças com a fase anterior. No entanto, aqui, o detalhe é ainda maior. Desta forma, produz-se uma série de documentos que visam definir claramente a ideia final do website.

The deliverables, including interactive prototypes, written descriptions, guidelines, and specifications, are high-fidelity and contain as much detail as possible about the layout, navigation, visuals, and content for each web page. (Van Duyne et al, 2003:98)

No final desta fase poderão acontecer duas coisas. Ou a equipa de Designers que trabalhou até aqui irá continuar a trabalhar as fases seguintes, ou entregará todo o projecto a uma outra equipa que irá implementar, lançar e manter o website.

A diferença entre as duas é que, se se verificar a segunda situação, toda a documentação produzida aqui deverá ser altamente definida e clara no sentido de eliminar toda e qualquer ambiguidade no que diz respeito ao projecto.

Assim como nas fases anteriores, em paralelo, deverão ser desenvolvidos pequenos testes com utilizadores. O intuito será o de ir testando o projecto e, desta forma, poderem ser feitas alterações necessárias para colmatar determinadas fraquezas que possam existir.

De uma forma bastante resumida, aquilo que é produzido nesta fase é: um documento de design onde se descreve com grande detalhe a forma como o website funciona. Aqui reúne-se tudo aquilo que estava incluído no documento de especificações, fluxograma, storyboard e layout, e com isso descreve-se a navegabilidade e o fluxo de interacção. É a partir da elaboração deste documento que o projecto pode ser entregue a uma outra equipa para avançar para a fase de implementação. Este documento deverá ser descritivo, detalhado e sem ambiguidades.

Um outro documento que acompanha muitas vezes o documento de design é o protótipo interactivo. Através disto, tanto o Designer como o cliente podem ter uma visão bastante mais concreta sobre o funcionamento do website, sobre o look and feel, e sobre possíveis ambiguidades não detectadas na elaboração do documento de design.

Este protótipo interactivo não é o website completamente funcional, mas deverá sê-lo parcialmente. O que se pretende dizer é que o website deverá ser implementado parcialmente no sentido de providenciar a quem o utilizará uma sensação realista daquilo que ele pretende transmitir. As funcionalidades não necessitam de estar todas implementadas, no entanto, aquelas que são essenciais para perceber o fluxo de navegação e aspectos específicos de usabilidade e Experience Design deverão ser implementadas. Por exemplo, este protótipo deverá permitir navegar por todas as secções diferentes do website e permitir a visualização de mensagens de erro.

Um documento intitulado “Especificações Técnicas” é também muitas vezes entregue juntamente com os dois anteriores. Este documento descreve detalhadamente requisitos técnicos como tipo de linguagens de scripting, tipo de base de dados, versão de HTML a ser usada, servidor web, entre outros. Juntamente com este documento poderão ser ainda entregues mini-protótipos de determinadas funcionalidades para demonstrar que podem ser implementadas e que funcionam conforme esperado.

Depois disto, surge um outro documento intitulado Design Guidelines. Este documento é um género de um manual de identidade do website. Nele encontram-se uma série de regras que deverão ser seguidas em cada página. Neste documento encontramos o tipo de letra a ser utilizado, cor dos links, quando é que o logótipo é usado e onde, qual a palete de cores a utilizar, tamanho máximo de cada página, medidas específicas para margens, entrelinhas, cabeçalho, footer, entre outros.

Finalmente, poderão ser ainda entregues um, ou mais, templates. Templates são páginas modelo que visam ser uma base para a construção de todas as restantes páginas. Podemos ter templates para a homepage, paginas de conteúdos, página de contacto e historial, entre outros. A ideia na utilização de templates é criar consistência em todas as páginas do website. Desta forma, o utilizador terá uma sensação de familiaridade e de proximidade com o website. Sentir-se-á também bastante mais contextualizado e identificará com facilidade a sua localização.

Implementação

Como foi referido anteriormente, esta fase pode ser da responsabilidade dos Designers que trabalharam as fases anteriores ou pode ser trabalhada por uma nova equipa, normalmente constituída por programadores web, Designers Gráficos, webdesigners, especialistas em bases de dados, entre outros.

A ideia é construir um website completamente funcional e pronto a ser utilizado pelos utilizadores-alvo. Para tal, é necessário já terem sido feitos uma série de testes para ter a certeza de que os utilizadores conseguem realizar as tarefas que pretendem com o intuito de atingir determinados objectivos.

Segundo Van Duyne et al (2003), estes são alguns testes que deverão ser feitos ao longo da fase de implementação: “check that the website has all of the features stipulate in the specification document, and that the features are implemented correctly”; “check that the developed web pages are compatible with various web browsers, including text-only browsers used by the blind”; “test that the developed web pages can be viewed in different monitor sizes.”; “see if the web pages can be dowloaded in a reasonable time by people who have slower Internet connections.”; “stress-test the website, by simulating hundreds or even thousands of people using it at the same time, to ensure it still performs reasonably.”; “check for grammar and spelling errors.”.

Assim, nesta fase constrói-se o website na totalidade, desenvolve-se um documento de manutenção onde se descreve em detalhe como é que o website deverá ser mantido, que partes necessitam de actualizações, de quanto em quanto tempo, entre outras tarefas, bem como um plano de teste que indica o que deverá ser feito para certificar que o website funciona como pretendido. Este plano de testes deverá também indicar a forma como cada uma das especificações contidas no documento de especificações deverão ser testadas.

Se o projecto for redesenhar um website, então aqui surge ainda uma outra tarefa que consiste em actualizar toda a documentação que esteja desactualizada. Estou-me a referir mais concretamente ao documento de especificações, o documento de Design, as guidelines e os templates.

Lançamento

Esta fase consiste em fazer o upload do website para o servidor. Últimos acertos poderão ser feitos, como corrigir alguns erros ortográficos, links que não funcionam, imagens que não carregam, entre outros. No entanto, tudo isto deverá ser preferencialmente tratado nas fases anteriores e não na fase de lançamento.

Some Design teams choose to roll out the web website in stages. Instead of developing the entire web website at once and waiting until the very end to deploy it, selected parts of the Web website are created and deployed incrementally. (Van Duyne et al, 2003:102)

Esta abordagem é muitas vezes necessária e pode ser bastante útil em determinados projectos. Por exemplo, o desenvolvimento do website pode ser feito em várias fases e, desta forma, ser colocado online mais cedo com o intuito de testar desde logo as funcionalidades básicas e de forma a habituar os utilizadores à interface. De seguida, e de forma gradual, poderão ser implementadas outras funcionalidades enriquecendo assim o website e a experiência de utilização.

Manutenção

A fase de manutenção é extremamente importante. Qualquer website deverá ser observado no sentido de estar sempre cem por cento funcional, deverá ser actualizado regularmente, deverá providenciar feedback aos utilizadores que tenham perguntas a colocar, entre outras tarefas.

Um dos aspectos mais importantes na fase de manutenção são os dados recolhidos, e analizados, no que diz respeito à utilização do website por parte dos utilizadores. Através desta tarefa é possível perceber aquilo que pode ser melhorado, o que está a falhar, o que os utilizadores procuram, como procuram, o que esperam encontrar, de onde vêm e como vêm, entre outros aspectos.

Próximo artigo: IxD@web – 03 O Processo Desenvolvido (brevemente)