Sexta-feira, 11 de Dezembro de 2009

Wireframes e Webdesign


Uma vez feita a análise, ouvidos os utilizadores e identificados os objectivos, partimos para a fase de prototyping, wireframing e webdesign.
Nesta fase procurámos traduzir em elementos na página, as várias conclusões obtidas.

 


Cada uma das secções foi alvo de análise específica com soluções diferentes. Umas avançaram, outras não como esta para a personalização das tabs

A área de notícias foi naturalmente trabalhada em várias iterações

 

 



Tal como a dos destaques...

 

E chegámos a um wireframe global...

 


Ao nível do webdesign foram trabalhados os estilos e alternativas de cores. 10 alternativas.

 




A opção foi no sentido da ruptura com os habituais degradees e tons leves. Se um dos nossos objectivos passa por atingir novos segmentos e faixas etárias, o design deve reflectir isso mesmo. Daí a opção mais ousada e menos consensual. A famosa "cor púrpura". A frase mais ouvida depois da escolha feita foi “ao princípio estranha-­se, mas depois entranha-­se”

Inovação tecnológica


Desde a versão anterior (2006) até hoje, muito mudou. Por um lado os LCDs com maiores resoluções massificaram‐se. Por outro, o advento dos netbooks com écrans mais reduzidos.

Novos browsers, novas tecnologias e o advento do HTML5 foram aspectos determinantes.

Quem trabalha na área Web, sabe bem das dificuldades que existem em criar sites que por um lado sejam tecnologicamente inovadores e por outro mantenham compatibilidade com os diferentes browsers instalados. IE 7 e 6 ainda predominam nos PCs dos utilizadores e as diferenças entre ambos são enormes. Por outro lado, o crescimento de browsers mais seguidores dos standards como o Firefox e os baseados em Webkit é francamente notório.

Apesar de tudo, decidimos apostar no HTML5. Qualquer outra opção significaria que a nova Homepage iria precisar de uma revisão total em menos de um ano. Por outro lado não iríamos tirar partido das inovações entretanto introduzidas.

Naturalmente que isto nos obrigou a um esforço adicional para manter compatibilidade com o IE6. Esperemos que os números deste browser baixem muito nos próximos tempos para descontinuarmos o seu suporte.

Oficialmente, suportamos IE6, IE7 e IE8 (com javascript), Firefox, Safari, Chrome e Opera (com e sem javascript). A maioria dos derivados do Webkit e Gecko também é naturalmente suportada.

A homepage foi montada por forma a ser totalmente acessível. Isto significa que é de uso amigável por screen readers e outros equipamentos para cegos e amblíopes. Na versão final terá a classificação AAA de acessibilidade (WCAG 1.0).

Ao nível do Javascript foram introduzidos vários pequenos detalhes com impacto muito positivo na navegação. Coisas simples como garantir que o botão back (após seguir uma notícia) volta à homepage na TAB correcta, são exemplo disso.

Também é agora possível fazer bookmarks directamente para dentro de uma TAB ao contrario da versão anterior.

 

Próximo post (e final): Versão beta e inquéritos

Ou veja o post anterior: A preparação


tags:

publicado por Eduardo às 13:24 | link do post | comentar

5 comentários:
De Nuno a 11 de Dezembro de 2009 às 17:46
Excelente trabalho, obrigado pela partilha!


De Eduardo a 12 de Dezembro de 2009 às 01:25
Obrigado Nuno.


De Filipe Pereira a 10 de Junho de 2010 às 19:44
Parabéns. A partilha da vossa experiência e do vosso trabalho é motivo suficiente para voltar cá.
Um abraço,
Filipe Pereira


De Web design a 12 de Outubro de 2010 às 12:52
Os meus parabéns pelo excelente artigo!


De moncler jacket a 11 de Novembro de 2010 às 07:51
good luck!!


Comentar post

mais sobre mim
Dezembro 2009
Dom
Seg
Ter
Qua
Qui
Sex
Sab

1
2
3
4
5

6
7
8
9
10
12

13
14
15
16
17
18
19

20
21
22
23
24
25
26

27
28
29
30
31


posts recentes

Versão Beta e os Inquérit...

Homepage 2009: Wireframes...

Homepage 2009: A preparaç...

A Homepage 2009

Homepage em Safari

E já está online!

Mais de mil respostas ao ...

Queremos saber o que pens...

No meu tempo é que era!

Nova homepage do SAPO já ...

arquivos

Dezembro 2009

Maio 2007

Abril 2007

tags

homepage

homepage história

homepage inquérito

homepage sapo

hp2009

safari

todas as tags

links
blogs SAPO
subscrever feeds