Destrinchando o Human Interface Guidelines para iOS — #4
Navegação
As pessoas não se preocupam com a navegação do aplicativo até o momento em que ele não atende às suas expectativas. O que deve ser feito é uma navegação que atenda à estrutura do seu app sem chamar atenção para si, sendo uma ação natural. No iOS tem três modelos principais de navegação:
Hierarchical navigation
Há apenas uma escolha por tela para chegar ao seu destino. Para seguir outro caminho, você deve voltar os passos ou recomeçar para fazer escolhas diferentes.
Flat navigation
Navegue entre diversas categorias.
Content-driven or experience-driven navigation
É um modelo mais livre em que o conteúdo em si define o seu curso.
Para uma melhor experiência:
- Os passos devem ser lógicos
- Ofereça apenas um caminho para cada tela, caso haja mais de uma tela para o mesmo conteúdo, procure utilizar janelas de alerta, modal view ou popover.
- Organize a sua estrutura de modo que precise do menor número de cliques, swipes e telas possíveis.
- Utilize componentes de navegação familiares
- Utilize a navigation bar para informar o usuário em que tela ele esta no momento
- A Tab bar é essencial para deixar o seu usuário navegar livremente entre as categorias do seu app, de forma fácil e instintiva.
É possível que um aplicativo tenha mais de um modelo de navegação, mas o que deve ser levado em consideração é a clareza e a naturalidade das ações. O usuário deve saber a todo momento em que tela ele está e como ele irá prosseguir para o próximo conteúdo.
Desfazer e Refazer
É um recurso oferecido para facilitar a edição de uma ação. Caso o usuá queira desfazer um texto que escreveu ou refazê-lo, basta balançar o iPhone. Ao ser acionado, um alerta de confirmação da ação é oferecido. Ao oferecer esse atalho em algum app tenha em mente:
- Deve-se avisar qual ação está sendo feita, se é a de desfazer ou refazer;
- Se utilizar essa ação para o desfazer e refazer, não utilizá-la para outra finalidade. Isso pode confundir o usuário;
- Ofereça outras maneiras de realizar essas ações, como botões;
- Utilize os icons padrão do iOS e coloque-os em locais esperados, como na navigation bar;
- Essas ações devem ter efeito apenas no conteúdo atual e não em um prévio.
Modalidade
Cria um foco para que o usuário não se distraia com outras ações e termine o que está fazendo com a confirmação de algo ou escolha de um botão antes de passar para a próxima ação.
- Ao aparecer uma caixa de dialogo o usuário deve escolher uma das opções ou sair desse alerta para continuar;
- Alertas e modal views são alguns exemplos dessa ação;
- Faça alertas e modal views simples, pois o usuário pode se perder com tanta tela e esquecer o que o levou até lá;
- Apenas apresente o botão de done quando todas as tarefas realmente tiverem sido completadas;
- Quando apresentados, tenha certeza de que o usuário se sentirá agradecido pelo alerta;
- Respeite a configuração de alerta definidos pelo usuário;
- Não misture os dois tipos de visualização de alerta;
- Quando uma ação leva a outra, primeiro feche a que esta por cima e depois abra o próximo alerta;
- Quando for utilizar modal view com navigation bar, faça com que o design dos dois sejam parecidos para não haver uma falha na comunicação visual do seu aplicativo.
Escolha o mais apropriado para o seu app:
Full screen
Aparece em toda a tela, utilizado para ações mais complexas que podem ser explicadas dentro dessa tela.
Page Sheet
Cobre parte da tela que esta por tras, se o aparelho for utilizado na horizontal. Todo o conteúdo que está no plano de fundo deve ser escurecido para evitar uma interação com eles, ja que não são o conteúdo principal.
Form sheet
É centralizado na tela, mas pode ser reposicionado caso o uso do teclado seja necessário. Todo o conteúdo por trás é escurecido para não haver interação com eles. Pode ocupar a tela inteira em aparelhos menores e é utilizado para juntar informações.
Current Context
Aparece do mesmo tamanho que o conteúdo principal, mas a tela se divide para disponibilizar os conteúdos de forma simultânea.
Utilize transições que combinem com o seu aplicativo e que comunique que a ação é um conteúdo temporário. A transição padrão para um modal view é de baixo para cima e a volta é no sentido contrário. O Flip view é outra opção que tem sua ação na horizontal e o conteúdo de trás é o conteúdo principal. O movimento de Flip acontece novamente quando o modal view é descartado.
Este artigo foi escrito em parceria com Helena Simões como parte do projeto BEPID UCB. Clique aqui para conferir o artigo oficial da Apple para a Human Interface Guideline do iOS.
