Foco no ser humano: pensando em usabilidade por meio de responsive web design.

Alexandre Pires

@AGraffitti

Ou seja...

Pensar na satisfação do usuário nas mais variadas resoluções ou nos variados dispositivos!

Porque?

Onde fica a usabilidade em um mundo mobile?

Desde o último trimestre de 2010, a venda de smartphones ultrapassa a de computadores pessoais em escala global.

(WEINTRAUB, 2011)

As tecnologias atuais estão preocupadas com a satisfação do usuário em plataformas móveis?

Mobile first, responsive web design, UX, NBR 9241-11...

É possível e como seria o desenvolvimento de um protótipo ou são apenas tecnologias de momento?

Twitter Boostrap, Foundation, UIKit, usabilidade, NBR 9241-11, responsive web design, mobile first...

A hipótese é que SIM!

{ Twitter Boostrap, Foundation, UIKit } + usabilidade + NBR 9241-11 + responsive web design + mobile first

Objeto

Escola Técnica Estadual Fernando Prestes

• Desde 1929

• Atualmente 16 cursos

• Possui site desde 1999

• + de 10 mil acessos ao mês

Pesquisa

Levantamento de dados

•Pesquisa socioeconômica

•Análise do histórico do Google Analytics

•Análise heurística

Criação do protótipo

706 entrevistados

Grau de escolaridade

0,0%2,2%

8,6%

22,2%

10,1%

47,6%

9,3%

Qual o grau de escolaridade?

Curso superior completo.

Curso superior incompleto.

Ensino médio completo.

2ª série do ensino médio.

1ª série do ensino médio.

Ensino fundamental completo.

Ensino fundamental incompleto.

Empregados

17,0%

29,7%

10,2%

4,3%

38,8%

Trabalho na área do curso que escolhi

Trabalho fora da área do curso queescolhiEstou desempregado

Estou desempregado mais já trab. Naárea

Acesso a internet

Google Analytics

Dashboard Google Analytics

Visão por dispositivos

Analise Heurística

Gravidade

• A frequência com que ocorre o problema.

• O impacto do problema caso ocorra.

• A persistência do problema.

(NIELSEN, 1995, tradução nossa)

Classificar gravidade

0 = não concordo que este é um problema

1 = problema cosmético

2 = problema de usabilidade menor

3 = problema de usabilidade maior

4 = Usabilidade catástrofe

(NIELSEN, 1995, tradução nossa)

Navegação + Antecipação

Site atual em 1366x769

1º 2º 3º 4º

Protótipo

Off-canvas

Protótipo

Protótipo

Conclusão

Funcionou!

Seria bom...

• Comunicação com um CMS.

• Focar em acessibilidade (ARIA).

É errado...

• Considerar a solução definitiva.

• Tratar de forma isolada.

• Esquecer do usuário.

Não acabou!

Github

Etec Web

Apresentação

SlideShare

Alexandre Pires

facebook.com/agraffitti

twitter.com/agraffitti

slideshare.net/agraffitti

alexandre@graffitti.com.br

www.graffitti.com.br

No deje de completar su evaluación online

ux2013.com.ar/encuesta¡Muchas gracias!

Foco no ser humano: pensando em usabilidade por meio de responsive web

designAlexandre Pires