Práticas recomendadas de design de aplicativos
  • 05 Aug 2024
  • 3 Minutos para Ler
  • Contribuintes

Práticas recomendadas de design de aplicativos


Resumo do artigo

x:::(Info)
Before diving into design best practices, saiba como user research{target=_blank} é a base para um design de aplicativo bem-sucedido, permitindo que você crie os aplicativos mais eficazes para suas operações e garantindo o máximo valor de seu investimento de tempo.

Este artigo se refere a dois aplicativos da Tulip Library: App Design Templates{target=_blank} e App Design Best Practices{target=_blank}.
:::

Um bom design é contextual, o que significa que as decisões são tomadas considerando as necessidades específicas de seu setor, operadores e processos e mudarão dependendo do objetivo e da função de cada aplicativo e etapa. As práticas recomendadas para Life Sciences{target=_blank} aplicativos serão diferentes das práticas recomendadas no projeto geral de fabricação.

Entretanto, todos os setores desejarão padronizar os layouts e esquemas de cores dos aplicativos e criar componentes clonáveis sempre que possível. Os modelos de aplicativos e guias de estilo reduzem a quantidade de decisões que os criadores de aplicativos precisam tomar a qualquer momento, enquanto uma biblioteca de componentes reduz o retrabalho e permite a criação mais rápida de aplicativos.

Para começar, confira nossos modelos de design em Tulip Library{target=_blank} e use as práticas recomendadas a seguir para ajudá-lo a personalizar esses modelos e criar aplicativos intuitivos e navegáveis.

Tulip Library Design Template Page 2.png{width="500" height="315"}

Padronize os modelos de aplicativos

A consistência no layout do aplicativo em toda a sua organização vai além do apelo estético. Ao criar layouts reconhecíveis e selecionar propositalmente cores que transmitam significado, você pode reduzir significativamente a necessidade de treinamento do usuário final.

Você pode usar os seguintes modelos Tulip Library templates{target=_blank} para começar.

Template - Colors.png
Esquemas de cores padronizados garantem que os aplicativos sejam intuitivos e que os operadores possam navegar pelas telas com rapidez e facilidade.

Template - Typography.png
Os tamanhos das fontes devem ser consistentes e legíveis. Adapte o tamanho da fonte à resolução de sua Interface (dispositivo de exibição).

Template - Buttons.png
Os botões de ação primária devem ter a cor mais forte na tela e não devem se misturar ao plano de fundo. Você não quer que os operadores percam tempo procurando o que precisam.

Template - Button Icons.png
A adição de ícones aos botões fornece contexto visual para a ação que o botão executa.

Crie uma biblioteca de componentes

A criação de componentes ou modelos que os criadores de aplicativos podem copiar e colar sem esforço acelera drasticamente o desenvolvimento. Considere a possibilidade de criar uma biblioteca dos seguintes componentes de aplicativos comumente usados:

  • Layouts de base de aplicativos (por exemplo, tablet vs. celular)
  • Layouts de etapas (por exemplo, alinhamentos de contêineres e painéis)
  • Barras de navegação superior e inferior
  • Barras de menu
  • Telas de roteamento ou terminais
  • Painéis de controle
  • Formulários (por exemplo, formulários de eventos ou defeitos)
  • Listas de verificação
  • Capturas de medição
  • Informações comuns lado a lado (por exemplo, uma tabela interativa geralmente aparece ao lado de registros de tabelas incorporadas)

Template - Table and Table Records.png
Exemplo de uma tela de dois painéis que permite que os usuários visualizem dados em uma tabela e editem campos usando um formulário

Template - Side by Side.png
Exemplo de uma tela de 2 painéis em que as informações primárias são inseridas no painel mais à esquerda

Template - Modals.png
Exemplo de uma etapa modal que chama toda a atenção dos usuários para a tarefa em questão

Template - Dashboard.png
Exemplo de uma configuração de painel para exibir análises

Siga as práticas recomendadas de design

Descubra os insights de especialistas em design de aplicativos no guia da Tulip Library App Design Best Practices{target=_blank} da Tulip Library. Mergulhe nas dicas de cores, textos e widgets para melhorar o apelo do seu aplicativo e a experiência do usuário.

Cor

Color 1.jpg

Color 2.jpg

Color 3.jpg

Color 4.jpg

Texto

Text 1.jpg

Text 2.jpg

Text 3.jpg

Text 4.jpg

Text 5.jpg

Text 6.jpg

Widget

Widget 1.jpg

Widget 2.jpg

Widget 3.jpg

Widget 4.jpg

Widget 5.jpg

Widget 6.jpg


Este artigo foi útil?