interação humano computador (aula 11) - usabilidade em apps

21
Usabilidade em Apps Marcos Devaner Interação Humano Computador Aula 11

Upload: marcos-devaner

Post on 16-Apr-2017

262 views

Category:

Education


1 download

TRANSCRIPT

Page 1: Interação Humano Computador (Aula 11)  -  Usabilidade em Apps

Usabilidade em AppsMarcos Devaner

Interação Humano Computador

Aula 11

Page 2: Interação Humano Computador (Aula 11)  -  Usabilidade em Apps

“Apps” é a abreviação da palavra “applications”, ou aplicativos. No

contexto dos smartphones, ”apps” são os programas que você

pode instalar em seu celular, ou seja, a tela que mostra a previsão do tempo, o joguinho ou aquela câmera cheia de efeitos, entre outros.20 de

dez de 2012

Apps

Page 3: Interação Humano Computador (Aula 11)  -  Usabilidade em Apps

Etapas do processoSistemas, Usuário e Apps

Fonte: https://www.tecmundo.com.brAcessado em: 09/12/2016

Android IOs Windows

Page 4: Interação Humano Computador (Aula 11)  -  Usabilidade em Apps

Regras Gerais de Usabilidade em Apps

• Instruções básicas de operação nas primeiras interações• Não se faz necessário que as instruções já descritas em passos anteriores sejam

repetidas em todas as telas• As atividades devem ser ações rápidas e simples, que não exijam a fixação do

olhar na tela pequena, por um tempo prolongado.• As atividades quando bem descritas contribuem para prevenção de erros que são

as principais fontes de frustração, ineficiência e ineficácia durante a utilização do aplicativo.

Page 5: Interação Humano Computador (Aula 11)  -  Usabilidade em Apps

Textos em Apps

• Utilizar frases curtas.• Alinhar o texto à esquerda. • Utilizar espaço simples entre as linhas, já que a tela é pequena. • Não colocar informações redundantes. • Destacar as partes do texto mais relevantes.• Usar texto sem serifa Galinkin (2010) com tamanho igual ou superior a

10 pixels.

Page 6: Interação Humano Computador (Aula 11)  -  Usabilidade em Apps

Botões em Apps

• É recomendado que botões apresente algum tipo de retorno visual ou sensitivo do seu pressionamento. Os botões podem ser utilizados com dimensões iguais ou superiores a 62 pixels

Page 7: Interação Humano Computador (Aula 11)  -  Usabilidade em Apps

Navegação em Apps

• Modelo linear com uso de botões para troca entre telas:1. Troca da aparência do botão quando pressionado.2. Animações entre as telas podem ser utilizadas como ajuda

para confirmar que o comando foi aceito. 3. Recomenda-se que o botão de navegação esteja

posicionado sempre no mesmo local.

• Touch screen para paginação

Esse modelo de navegação apresenta menor índice de erros quando comparado com o uso dos botões para navegação. Mesmo sem o retorno sensitivo, a transição entre as telas permitiu aos usuários a confirmação da interação e foi mais fácil de ser memorizada.

Page 8: Interação Humano Computador (Aula 11)  -  Usabilidade em Apps

Lista de opções

O uso da lista de opções é recomendado desde que os itens apresentados obedeçam as dimensões de texto e opções selecionáveis apresentadas nos itens de fonte e botões dessa lista de recomendações. A rolagem de tela para navegar pelos itens não influi no uso do componente. Os itens da tela devem possuir um retorno de interação para deixar clara a sua seleção.

Page 9: Interação Humano Computador (Aula 11)  -  Usabilidade em Apps

Grade de imagens

As grades de imagens podem ser utilizadas, desde que as dimensões dos itens a serem selecionados sejam iguais ou superiores 62 pixels.

Page 10: Interação Humano Computador (Aula 11)  -  Usabilidade em Apps

Rolagem de texto

A rolagem de tela em substituição da barra de rolagem é recomendada. Deve-se no entanto utilizar algum item de marcação no final de cada tela

para auxiliar o usuário.

Page 11: Interação Humano Computador (Aula 11)  -  Usabilidade em Apps

Botões de rádio e checagem

Eles podem ser utilizados. A compreensão do funcionamento e interação com o componente são de fácil entendimento. Deve-se respeitar as dimensões de fonte e dos itens selecionáveis descritas nesta lista de recomendações.

Page 12: Interação Humano Computador (Aula 11)  -  Usabilidade em Apps

Animação

As animações são recomendadas para destacar as transições entre os ambientes do aplicativo (HUHTALA et al., 2010), e elas facilitam a percepção do usuário na troca de contexto e funcionam como um retorno visual da aceitação de comandos dados ao aplicativo

Page 13: Interação Humano Computador (Aula 11)  -  Usabilidade em Apps

Prototipação e validação

POP é um aplicativo que através da câmera do smartphone consegue fotografar telas feitas a mão e personaliza-las para serem navegadas como se fossem um APP nativo. É possível importar várias imagens/telas ao mesmo tempo e adapta-las através de recursos básicos de edição.

O aplicativo para Android, iOS e WP POP pode ser baixado gratuitamente através das lojas oficiais da Apple, Google e Microsoft. 

Page 14: Interação Humano Computador (Aula 11)  -  Usabilidade em Apps

Fontes

MOL, M. A. Recomendações de usabilidade para interface de aplicativos para smartphones com foco na terceira idade. Pontifícia Universidade Católica de Minas Gerais-Belo Horizonte, 2011.

Page 15: Interação Humano Computador (Aula 11)  -  Usabilidade em Apps

Pirâmides para imersão

Page 16: Interação Humano Computador (Aula 11)  -  Usabilidade em Apps

Ideação

Fonte de imagem: http://br.freepik.com/

Essa fase tem como intuito gerar ideias inovadoras para o tema do projeto e, para isso, utilizam-se as ferramentas de síntese criadas na fase de análise para estimular a criatividade e gerar soluções que estejam de acordo com o contexto do assunto trabalhado.

A fase de ideação geralmente se inicia com a equipe de projeto realizando Brainstormings (uma das técnicas de geração de ideias mais conhecidas) ao redor do tema a ser explorado e com base nas ferramentas

As ideias geradas ao longo desse processo são capturadas em Cardápios de Ideias que são constantemente validadas em reuniões com o cliente utilizando, por exemplo, Prototipações.

Page 17: Interação Humano Computador (Aula 11)  -  Usabilidade em Apps

Prototipação

O protótipo é a tangibilização de uma ideia, a passagem do abstrato para o físico de forma a representar a realidade - mesmo que simplificada - e propiciar validações. É um instrumento de aprendizado sob dois aspectos:

Page 18: Interação Humano Computador (Aula 11)  -  Usabilidade em Apps

Benefícios da prototipação

1. Selecionar e refinar de forma assertiva as ideias;2. Tangibilizar e avaliar interativamente ideias; 3. Validar as soluções junto a uma amostra do público; 4. Antecipar eventuais gargalos e problemas, reduzindo riscos e

otimizando gastos.

Page 19: Interação Humano Computador (Aula 11)  -  Usabilidade em Apps

Níveis de fidelidade

Um protótipo pode ser desde uma representação conceitual ou análoga da solução (baixa fidelidade), passando por aspectos da ideia, até a construção de algo o mais próximo possível da solução final (alta fidelidade).

Page 20: Interação Humano Computador (Aula 11)  -  Usabilidade em Apps

Exemplos de Níveis de fidelidade

Baixa Média Alta• Rascunhos• Protótipos desenhados

utilizando lápis e papel

• Storyboards• Desenhos com programas

especializados

• Protótipos funcionais• Animações

Page 21: Interação Humano Computador (Aula 11)  -  Usabilidade em Apps

Mãos a obra

Dadas as problemáticas, escolha uma delas e aplique os processos do Design Thinking para propor um sistema que ajude a atacar o problema.

Pessoas com deficiência, encontram vários problemas de mobilidade e acesso a alguns serviços em seu dia a dia entre eles estão:

•Calçadas em péssimas condições•Falta de guias rebaixadas•Inadequação de lojas e restaurantes•Transporte deficiente•Ensino profissional precário•Preconceito•Diversas barreiras em prédios comerciais e públicos.