Artigos Mobile Evoluindo a usabilidade de sua aplicação iOS
Artigo do tipo Tutorial
Recursos especiais neste artigo:
Contém nota Quickupdate, Conteúdo sobre boas práticas.

Usabilidade e técnicas avançadas no iOS
Neste artigo iremos desenvolver um aplicativo para ler os feeds do Twitter. Como existem diversas maneira de fazer essa tarefa, foram escolhidas algumas características do iOS para explicar tanto o conceito como a técnica para esse desenvolvimento. Apesar de relativamente simples, esse exemplo incorpora conceitos importantes nas etapas do desenvolvimento que não podem ser esquecidos como a usabilidade, programação em blocos e em multitarefa e uso de animações, para desenvolver aplicações que realmente atraiam a atenção do usuário e que o façam ser fiel ao seu aplicativo.

Em que situação o tema é útil
Qualquer aplicativo deve ser feito levando-se em consideração a atenção do usuário e sua vontade em permanecer ou regressar ao aplicativo. Um aplicativo mal feito ou deficiente no seu projeto não irá cativar o usuário e ele irá buscar outra alternativa.

Uma das definições de usabilidade nos diz que ela define a facilidade com a qual os indivíduos podem fazer uso de uma ferramenta ou objeto com o propósito de efetuar uma tarefa específica e importante. Quando consideramos esse conceito no contexto da interação humano-computador e na ciência da computação, temos que o termo usabilidade normalmente se refere à simplicidade e facilidade com que um determinado software pode ser utilizado.

O objetivo deste artigo não é discutir o assunto usabilidade em profundidade, mas somente os pontos principais: interface com o usuário e responsividade, afinal, o que realmente importa é se o usuário está conseguindo usar seu aplicativo de forma satisfatória (simplicidade e facilidade).

Uma boa interface deve considerar para qual aparelho está sendo criada e também para qual orientação, afinal, pode-se usar os iGadgets tanto na horizontal (landscape ou deitado) quanto na vertical (portrait ou em pé). O iPhone possui uma resolução de 320 pixels em modo portrait e 480 em landscape e o iPad tem 768 pixels em portrait e 1024 em landscape - e o dobro disso nos aparelhos com tela Retina.

As Figuras 1 (células no iPhone em portrait) e 2 (células no iPad em landscape) demonstram o que acontecerá com nosso exemplo se não houver um planejamento adequado. Observem que a interface com usuário fica completamente desfigurada na Figura 2. Uma interface bem projetada não deveria sofrer deste tipo de problema.

O objetivo não é detalhar cada possibilidade de design nesse artigo, então iremos restringir esse exemplo ao uso do iPhone em portrait e do iPad em landscape.

Figura 1. Tela com o posicionamento das células no iPhone em Portrait.

Figura 2. Tela com o posicionamento das células no iPad em Landscape.

Outro exemplo de uma interface mal projetada, como a da Figura 3, faz com que os elementos não se adequem às característicos do aparelho (tamanho dos elementos para uso com o dedo, por exemplo) ou que os elementos não possam ser acessados.

Este exemplo mostra como o posicionamento inadequado de objetos pode atrapalhar o uso do sistema, ou a usabilidade. Note que o elemento botão está atrás do texto tweetLabel, impedindo seu acesso e seu tamanho também não segue as orientações. O que pode acontecer aqui, neste exemplo, é que o usuário não consiga tocar no botão. Se houver mais elementos próximos, que também requeiram toques, o sistema pode confundir qual botão foi tocado, já que o dedo do usuário pode “tocar” na área errada.

Figura 3. Uso inadequado dos elementos no layout da interface.

O manual iOS Human Interface Guidelines da Apple recomenda que a área de toque de um objeto seja de, no mínimo, 23 pixels e, recomendado, 31 pixels. Esses números foram definidos considerando estudos que levaram em conta o tamanho médio do dedo de um adulto normal.

Sendo assim, sempre que for projetar a interface considere os seguintes pontos:

· Tamanho mínimo dos elementos;

· Distância entre elementos;

· Posicionamento relativo dos elementos (quem está “acima/abaixo” de quem).

Na Web, o mouse tem apenas 1 pixel para acessar um elemento. Nas interfaces touch, o tamanho do dedo é quem determina a área de toque. Lembre-se, mínimo de 23 pixels mais uma margem entre cada elemento para evitar a obstrução - não somente visual, mas também na hora de efetuar o toque na tela.

...
Quer ler esse conteúdo completo? Tenha acesso completo