O que não fazer em Interfaces Android (ou como melhorá-las…)

Essa semana irei falar sobre o que NÃO fazer em interfaces (de usuário) Android.

O que me inspirou a escrever sobre isso foi o lançamente de um aplicativo iPhone de sucesso para Android.
Estou falando do Viber

De uma olhada nessa foto:

Então, que versão do Viber estou mostrando???

Sim, essa é a versão Android. E com apenas um ‘screenshot’ começamos a ver os problemas…
Primeiro, esse aplicativo não parece Android, e isso me leva ao primeiro ponto.

  • Não use ‘bottom tabs’
    • Nunca use bottom tabs [1][2][3]. E essas são ainda piores, pois são exatamente iguais as tabs do iOS (e lembre-se você não está usando um device iOS).

      Tabs devem ser usadas no topo da tela. Algumas vezes você nem precisa, ou nem quer usar tabs, então você pode substituí-las por algum outro artifício mais ‘Android’, como por exemplo um dashboard, uma actionbar ou uma combinação de ambos.

      Aqui está um esboço de como o aplicativo Viber poderia ser no Android:

      Aqui eu usei uma ‘actionbar’ [4] (um design pattern comum em Android), com acesso às chamadas recentes e às mensagens de texto na barra superior.
      A lista de contatos é um ‘PageViewer’ (parecido com o do novo aplicativo do Market, ou do google+) com acesso a todos contatos, favoritos e contantos viber via um ‘arraste’ horizontal. Abaixo está o ‘dialing pad’ usando um ‘sliding drawer’ (basta arrastar o keypad para cima para ele aparecer).

      Está é apenas uma possibilidade, outra seria colocar o acesso ao dialpad como um icone na actionbar (e remover o sliding drawer), ou então utilizar um dashboard como pagina inicial, exatamente como o google+ faz.

      Com essas screenshots, podemos ver que ele se parece muito mais Android agora:

  • Não coloque botões de voltar na Interface.
    • O Android já tem um botão Voltar, e ele é obrigatório (diferente do botão search que é opcional). Todos os telefones PRECISAM ter um botão Voltar (com exceção do Honeycomb que tem o voltar em sua barra de navegação), então por que se preocupar em colocar outro botão Voltar para confundir o usuário?

      Relacionado a isso, nunca (certo, apenas em casos excepcionais e quando você realmente sabe o que está fazendo) sobrescreva o comportamento do botão Voltar, os usuários pressionam esse botão e esperam um certo comportamento, e eles tendem a ficar decepcionados (para não dizer com raiva) quando não acontece o que eles estão esperando.

      O que você pode (e é até recomendado) fazer, é ter um botão “Home” na Action Bar. Ele o leva direto para a “Home page” do seu aplicativo, e limpa a pilha de ‘atividades’ (backstack) do seu aplicativo. Ele não é uma navegação ‘voltar’, ele está indo para frente (forward navigation).

  • Não reinvente a roda (Use a API de Intents do Android)
    • Use a API de Intents do Android. Uma das funcionalidades mais comuns e mais usadas em aplicativos móveis é compartilhar conteúdo via redes sociais, ou email, sms, etc. Você não precisa implementar cada uma dessas interfaces de compartilhamento, você deve usar Intents para compartilhar o conteúdo.


      Intent sharingIntent = new Intent(Intent.ACTION_SEND);
      sharingIntent.setType("text/html");
      sharingIntent.putExtra(android.content.Intent.EXTRA_TEXT,
      Html.fromHtml("<p>Este texto será compartilhado.</p>"));
      startActivity(Intent.createChooser(sharingIntent,"Compartilhe com"));

      Isso é tudo o que você precisa para compartilhar algum conteúdo pelo twitter, facebook, email, sms, google+, etc.
      (Você pode customizar essa interface, observe a terceira screenshot)

      O mau

      o bom

      e o bonito

    Por hoje é só, espero que tenham gostado e fiquem ligados nos próximos artigos.

    Referências:
    [1] http://www.androiduipatterns.com/2011/07/tabs-top-or-bottom.html
    [2] https://docs.google.com/fileview?id=0BxEWAcbuDzg1MjMxYjc3MjQtNzk1Zi00YjQ4LTkxNDgtMzMxNDM0ZjU0N2I1
    [3] http://blog.tomgibara.com/post/4071726024/an-accessibility-mistake
    [4] http://www.androidpatterns.com/uap_pattern/action-bar

    Advertisements

    10 thoughts on “O que não fazer em Interfaces Android (ou como melhorá-las…)

    1. caneto says:

      Achei muito interesante, so acho que podeia a primeira parte, não ser tão taxativa, em não ser parecido com i*… pois eu ate gosto deste tipo de navegação, so acho que poderia ser opcional trocar nos apps vc gosta em cima, eu em baixo, cada um decidiria… e o layout se ajustaria.

      Carlos
      Desenvolvedor

      • luciofm says:

        Isso é uma questão de consistência.. por isso mesmo a apple é tão rígida no processo de aprovação, para manter a consistência da plataforma..

        No Android a coisa é diferente, mas os aplicativos mais ‘profissionais’ estão seguindo as recomendações do google, e criando uma experiência consistente entre eles. Começar a misturar conceitos cria essa inconsistência onde num aplicativo o usuário navega de uma maneira, enquanto no outro é diferente.

        Isso, e principalmente para usuários mais leigos e não ‘tecnólogos’, prejudica a plataforma, que fica sem consistência…

        Isso é algo que o Google vem advogando. – Façam aplicativos consistentes, sigam as ‘best practices’, ‘UI guidelines’, usem os Design Patterns do Android… Nós não vamos deixar de publicar aplicativos que não sigam isso, mas com certeza o aplicativo nunca seria promovido por eles.

    2. Excelente artigo Lucio, é sempre interessante estudar das boas práticas de UI para melhorar a experiência de uso.

    3. Achei bem interessante o texto, mas discordo do seu ponto. Eu não tenho nenhum device Apple, nem pretendo ter, por outro lado, nem faço ideia de como seja o app no iOS, logo, pra mim, nenhum app tem cara de iOS.

      Mas vejo que se um aplicativo será multiplataforma, é muito interessante manter exatamente a mesma identidade em todas elas, assim se eu tenho um Android e algum amigo tem um iPhone, é muito mais fácil trocar experiência e ajudá-lo, afinal de contas, sabemos que o conhecimento dos usuários da maça é muito mais limitado.

    4. Eu odeio quando pego um aplicativo com uma interface voltada para plataforma iOS.

      Do como exemplo o ZoobieBooth que sempre que quero voltar uma tela uso o botão de Voltar do Cel.
      E isso FECHA o aplicativo.
      Que DEMORA para ser aberto novamente.

      E mesmo que o erro seja meu, já que o próprio app tenha um botão de voltar, o uso do sistema faz com que por instinto você use o botão do cel.

      Não tenho problema se o app é idêntico ao iPhone.
      Só quero que funcione como se espera de um app para android.

      Gostei muito do artigo.
      Parabéns.

    5. Parabéns!
      Sou iniciante no desenvolvimento iOS e concordo completamente com teu conceito. Deve-se manter a consitência das plataformas para que não ocorra algo semelhante com o que o RubensBrilhanteJr descreveu no comentário acima.
      Com teus posts tu mostra como apps android podem ser tão robustos quanto, ou até melhor, que apps iOS.
      Tive a oportunidade de interagir com o Noite Hoje do android e é fantástico. Intuitivo, bonito, dinâmico!

      Parabéns, continue seu trabalho.

    6. […] 9 de agosto, 2011 // Tweet Esse post foi feito por Lúcio Maciel em seu blog pessoal. Ele cedeu gentilmente o artigo para colocarmos a disposição dos leitores. Espero que aproveitem […]

    Leave a Reply

    Fill in your details below or click an icon to log in:

    WordPress.com Logo

    You are commenting using your WordPress.com account. Log Out / Change )

    Twitter picture

    You are commenting using your Twitter account. Log Out / Change )

    Facebook photo

    You are commenting using your Facebook account. Log Out / Change )

    Google+ photo

    You are commenting using your Google+ account. Log Out / Change )

    Connecting to %s

    %d bloggers like this: