O design de aplicativos móveis não é como o design da web.

Claro que há teoria de cores, tipo de configuração e manutenção de grades, mas há muito mais a considerar quando o dispositivo muda.

Para lançar alguma luz sobre os prós e contras do design de aplicativos móveis, Tomas Laurinavicius apresenta suas melhores práticas ao projetar para dispositivos móveis.

Tomas Laurinavicius é designer freelancer e coautor do Mobile Design Book.

Como projetar um aplicativo

(com bons exemplos de design)

Entra Tomas:

Neste artigo, gostaria de compartilhar alguns exemplos de ótimos designs de aplicativos para dispositivos móveis. Especificamente, os elementos que se juntam para criar um ótimo aplicativo.

Exemplos de aplicativos - A tela de inicialização

A tela inicial será vista por todos os usuários do aplicativo e durará alguns segundos, mas é crucial causar uma boa primeira impressão e definir algumas expectativas.

Use uma imagem de fundo que diga algo sobre o aplicativo, torne-o limpo e bem marcado. Mantenha o tamanho da tela de inicialização no mínimo para reduzir o tempo de carregamento.

Hyperlapse do Instagram e Yummly

Estados vazios

Quando um usuário fizer o download do seu aplicativo pela primeira vez, ele não terá nenhum dado para ver. Isso é chamado de tela vazia.

Neste ponto, você precisa explicar a finalidade do seu aplicativo e orientá-los a usar seu aplicativo pela primeira vez. Caso contrário, eles vão embora confusos e podem nunca mais voltar.

Airbnb e flipboard

Exemplos de aplicativos – telas de login

Esqueça os nomes de usuário. Em vez disso, use um endereço de e-mail.

Facilite o processo de login, dando-lhes a opção de fazer login com plataformas existentes. Dependendo do seu público, pode ser Google, Facebook ou até LinkedIn.

SoundCloud e Foursquare

Exemplos de aplicativos – feeds de atividades

Ao criar um feed de atividades envolvente e imersivo, considere o contexto e use os princípios da gamificação.

Forneça dados essenciais como data, hora e local, se apropriado. Para torná-lo mais parecido com um jogo, use números, botões de chamada para ação e pequenos ícones para tornar a interface mais atraente.

Swarm por Foursquare e Behance

Exemplos de aplicativos - telas de inscrição

Se o processo de inscrição for complexo, os usuários sairão.

Simplifique ao máximo. Inclua apenas as informações necessárias e até sugira o uso de outras redes que armazenam informações do usuário, como Facebook ou Twitter.

Spotify e círculo

Confira

Checkout é um recurso complicado para criar em aplicativos móveis.

Ele precisa apresentar muitas informações de relance e permitir alguma orientação para o próximo passo. Priorize os dados e divida-os em partes que podem ser apresentadas em grupos.

Por exemplo, o endereço de entrega e as informações de pagamento podem formar dois grupos, preços e descontos outro grupo e assim por diante. Organize seu processo para não sobrecarregar seus clientes.

Segmente e continue comprando

Comentários

Os comentários são bons para construir uma comunidade ou simplesmente para mostrar a outros usuários que vale a pena participar do seu aplicativo.

Ao criar comentários, legibilidade e contexto (ou seja, fotos de perfil, nomes e datas) são os fatores mais importantes para fornecer um ecossistema de comunidade de aplicativos com aparência “ao vivo”.

Caminho e Tripstr

Procurar

A pesquisa é um recurso essencial para conteúdo gerado pelo usuário e outros aplicativos com muitos dados.

Forneça contexto e sugestões inteligentes para melhorar a experiência do usuário e encantá-lo. Adicionar opções de filtragem relevantes pode melhorar significativamente o processo de pesquisa e levar à felicidade do cliente.

Caixa de entrada do Gmail & Lovely

Compartilhamento

O compartilhamento é um recurso importante para qualquer aplicativo, pois permite que os usuários divulguem seu produto.

Facilite o compartilhamento de seu aplicativo ou conteúdo dele adicionando ícones de compartilhamento óbvios e permitindo o compartilhamento rápido em diferentes redes.

Primavera e Jukely

Legibilidade

A legibilidade é complicada em dispositivos pequenos. É fácil tornar o tipo muito grande ou muito pequeno.

Concentre-se no contraste, tamanho do tipo e altura da linha. Certifique-se de que seu tipo tenha o tamanho ideal e seja facilmente legível. Texto em preto sobre fundo branco é bom.

Legibilidade e Feedly

Navegação

A navegação é extremamente importante para qualquer tipo de aplicativo.

Torne-o fácil e compreensível para diferentes segmentos do seu público. Use uma cópia simples para que os usuários estejam familiarizados com o jargão de navegação de outros aplicativos. Utilize ícones e espaço negativo para dar algum contexto à sua navegação e inclua apenas os links necessários.

Facebook e LinkedIn conectados

Definições

As telas de configurações geralmente são ignoradas porque não são empolgantes, mas será uma das telas mais usadas.

Use ícones, separe diferentes grupos de configurações com divisores ou espaço negativo e ajude os usuários a navegar rapidamente para decidir o que fazer em seguida. Além disso, forneça opções rápidas usando botões de alternância nativos para que os usuários possam salvar toques.

Marca de seleção 2 e YPlan

Notificações

As notificações são o motivo pelo qual os usuários continuam voltando ao seu aplicativo.

Torne essas notificações óbvias, mas não muito irritantes. As pessoas precisam saber o que está acontecendo, mas não querem ser sobrecarregadas. Forneça indicadores de cores sutis e números para retratar as coisas que são novas.

Gogobot & Destaque

Mensagens

As funções de mensagens ou bate-papo também são um recurso comum. Ao projetar um sistema de mensagens, é tudo uma questão de comunicação e contexto.

Otimize o tamanho do tipo para que os usuários possam ler mensagens mais longas e incluir a data, hora da postagem, local e outras informações relevantes.

As mensagens são tudo sobre multimídia hoje em dia. Forneça aos usuários uma opção para se comunicar adicionando fotos, vídeos, sons, smileys e texto da velha escola.

Facebook Messenger e Path Talk

Perfil

Muitos aplicativos permitem que os usuários criem uma conta e armazenem histórias ou atividades em torno desse perfil.

Seja em mídias sociais, compras ou qualquer outro aplicativo, é crucial tornar as páginas de perfil claras e atraentes para os usuários.

Enfatize a foto do perfil do usuário e seu nome. Também forneça informações e estatísticas relevantes para que as pessoas possam ver o quão ativo ou respeitável o usuário é.

Frente e Quora

Conclusão

Como você pode ver em todos os aplicativos que listei, há muito a considerar e dominar ao projetar um aplicativo vencedor.

Embora qualquer pessoa possa projetar um aplicativo, é importante contratar um designer que tenha experiência na área e possa aplicar todo o conhecimento e as melhores práticas.

Pequenas coisas podem fazer ou quebrar seu aplicativo. Não arrisque seu tempo e dinheiro contratando alguém que não entende as complexidades de projetar um aplicativo incrível.