Português
EnglishA funcionalidade de configuração normalmente não é a parte mais visível no design do produto; os usuários só pensam em aceder às configurações quando encontram um problema. Neste momento, o usuário está provavelmente ansioso e inquieto, pelo que a qualidade da experiência na interface de configuração determina a avaliação que fazem do produto. Um painel de configurações bem projetado resolve facilmente os problemas dos usuários; uma má experiência, por outro lado, amplifica a impressão negativa sobre o produto já em estado emocional negativo.
No design das páginas de configuração dos produtos relacionados com DingTalk, já caímos em muitos erros. Partilho aqui 7 "armadilhas" comuns com os designers para ajudar a evitá-las!
Empilhamento excessivo de opções de configuração
No design de produtos, algumas opções de configuração não precisam realmente ser deixadas ao critério do usuário, mas quando não há consenso interno no produto, recorre-se à adição de opções de configuração como funcionalidades personalizáveis para os usuários escolherem, como a largura da navegação ou a densidade do conteúdo. Estas "configurações" não são algo que os usuários considerariam com base nos seus próprios princípios; carecem de cenários práticos de utilização e são opções impostas aos usuários pelo produto.
Sugestões
1. Simplificar as opções de configuração
● Evitar acumular demasiadas funcionalidades, para não afetar a experiência do usuário;
● Limpar regularmente as opções de configuração que já não são usadas ou têm pouco impacto;
● Agrupar as configurações menos utilizadas como "Configurações avançadas" ou ocultá-las num menu dobrável.
2. Definir valores predefinidos razoáveis para reduzir as configurações desnecessárias
Propor configurações predefinidas adequadas à maioria dos usuários, reduzindo a necessidade de ajustes.
Layout e hierarquia das opções de configuração pouco claros
Sugestões
Pode-se classificar eficazmente as informações da seguinte forma:
1. Agrupamento lógico: agrupar as opções de configuração por função ou tema, por exemplo "Configurações de conta", "Configurações de notificações", "Configurações de privacidade", etc.
2. Hierarquia clara: usar títulos, linhas divisórias ou espaçamento para distinguir cada grupo de configurações, evitando a desordem de informações.
3. Evitar níveis demasiado profundos: níveis muito profundos aumentam o custo operacional para o usuário; recomenda-se geralmente limitar a 2-3 níveis.
Layout inconsistente
A maioria das páginas de configuração é enriquecida iterativamente, pelo que é necessário definir desde o início as normas de design para a página de configuração, evitando que, após cada iteração, a falta de alinhamento uniforme resulte em botões e interruptores alternadamente à esquerda e à direita, causando confusão no layout da interface e prejudicando a usabilidade para o usuário.
Sugestões
1. Estilo uniforme: garantir que elementos interativos como botões, controlos deslizantes e caixas de entrada mantenham um estilo e tamanho consistentes na interface.
2. Alinhamento adequado: utilizar alinhamento à esquerda ou à direita para tornar o conteúdo mais organizado e fácil de ler.
3. Definir tipos de opções de configuração e cenários de aplicação: definir os tipos de opções de configuração de acordo com o método de disposição, como opções de configuração horizontais, verticais e de coluna inteira, garantindo uma interface limpa e fácil de usar.
Opções de configuração horizontais
● Quando as opções de configuração envolvem principalmente ativação ou seleção, com fluxo de operação da esquerda para a direita, podem ser utilizadas opções de configuração horizontais, mantendo um layout de estrutura esquerda-direita, com as operações à esquerda.
● Se for necessário ter configurações de seleção única, podem ser utilizadas opções de configuração de coluna inteira
Opções de configuração verticais
● Quando as opções de configuração envolvem principalmente seleções múltiplas ou únicas, com fluxo de operação de cima para baixo, podem ser utilizadas opções de configuração verticais, mantendo um layout de estrutura superior-inferior, com as operações relativamente à direita.
● Quando algumas opções de configuração não podem seguir o layout vertical, podem ser complementadas com opções de configuração de coluna inteira
Descrição das opções de configuração pouco clara
No contexto de negócios do DingTalk, existem muitas situações em que a descrição através de texto não consegue transmitir claramente o significado. Se uma opção de configuração tiver apenas texto, o usuário não consegue perceber o efeito ou feedback após a configuração e só pode depender de suposições ou tentativas.
Sugestões
1. Linguagem compreensível: evitar termos técnicos e garantir que os usuários comuns consigam entender a função de cada configuração.
2. Transmitir valor ao usuário: evitar descrições de funcionalidades sob a perspetiva do negócio ou da tecnologia e comunicar o valor que trazem ao usuário.
3. Combinar texto e imagem: algumas configurações não podem ser descritas com precisão apenas com texto; pode-se utilizar uma combinação de texto e imagem para que o usuário tenha uma percepção mais tangível.
Uso de dupla negação na descrição
Algumas opções de configuração estão ativadas por defeito e, na descrição dessas opções, o negócio utiliza uma perspetiva técnica, descrevendo-as como proibição de ativar determinada funcionalidade, com o interruptor desligado. Esta expressão de dupla negação não corresponde à reação intuitiva do usuário, que, ao aceder às configurações, procura pistas para "desativar" a funcionalidade, em vez de "ativar".
Sugestão: utilizar frases positivas e afirmativas nas descrições das opções de configuração: independentemente de a funcionalidade estar ativada ou desativada por defeito, a descrição deve enfatizar os resultados e o valor trazidos pela ativação da funcionalidade.
Uso incorreto de interruptores e caixas de seleção
Os interruptores (switch button) e as caixas de seleção (check box) são componentes utilizados com relativa frequência e têm semânticas semelhantes, podendo ambos ser usados para indicar se determinada condição está selecionada. Por isso, é comum haver confusão entre os dois, o que pode levar a resultados inconsistentes com as expectativas do usuário.
1. Interruptor (switch button): indica a mudança de estado imediato (como "Ligar/Desligar", "Ativar/Desativar")
Cenários de aplicação:
Funcionalidades nas configurações que precisam de entrar em vigor imediatamente (como ativar o Bluetooth ou as notificações).
Indica um estado binário e o usuário consegue ver o resultado da mudança de estado em tempo real.
Sugestões:
● Usar apenas quando o estado precisa de entrar em vigor imediatamente;
● Evitar usar para operações combinadas envolvendo múltiplas funcionalidades.
2. Caixa de seleção (check box): indica uma ou várias opções independentes; a seleção significa ativação ou escolha.
Cenários de aplicação:
● Indica opções múltiplas (por exemplo, o usuário pode selecionar vários interesses ao mesmo tempo);
● Usada em cenários de submissão ou aplicação em massa (por exemplo, marcar várias opções e clicar em "Eliminar").
Sugestões:
● Usar para indicar opções múltiplas ou opções que precisam de confirmação;
● Evitar usar em cenários de feedback em tempo real para não enganar o usuário.
Dificuldade em perceber os resultados das configurações
Após fazer uma configuração, o usuário espera sentir o resultado, como saber que tipo de alteração ocorreu na interface. Se o design não for bem pensado e não transmitir atempadamente os resultados das configurações, o usuário pode demorar a perceber o que aconteceu e, caso o resultado não corresponda às suas expectativas, terá de fazer ajustes repetidos.
Sugestões:
1. Substituir as janelas pop-up por colunas na interface de configuração: as configurações do Gmail aparecem numa barra lateral, permitindo que o usuário veja em tempo real os efeitos das configurações na interface do e-mail.
2. Pré-visualização dos efeitos: as preferências de interface do documento DingTalk são apresentadas através de uma imagem dinâmica que mostra as mudanças na interface após a configuração, permitindo que o usuário perceba diretamente as alterações.
3. Remover obstáculos à visualização dos resultados: a página de configurações do Slack é uma janela modal; quando as opções de configuração não estão relacionadas com a interface atual, é exibida uma camada de máscara. No entanto, quando os resultados das configurações têm impacto direto na interface, a camada de máscara é removida, permitindo que o usuário perceba diretamente as mudanças.
Prática de design
A interface de configuração do e-mail DingTalk também apresenta os seguintes problemas:
● Empilhamento excessivo de opções de configuração, com as opções mais utilizadas não destacadas prioritariamente;
● Descrição pouco clara das opções de configuração;
● Dificuldade em perceber os resultados das configurações.
Depois de otimizar com base nas experiências mencionadas acima:
● As opções de configuração mais utilizadas são destacadas prioritariamente, eliminando a necessidade de procurar de forma ineficaz;
● A página de configuração e a interface principal estão na mesma janela, permitindo que os resultados das configurações sejam vistos imediatamente;
● As opções de configuração são apresentadas com uma combinação de texto e imagem, sendo fáceis de compreender à primeira vista.
Conclusão
A teoria é sempre apenas uma parte que orienta a prática; as experiências acima procuram encontrar um ponto de equilíbrio entre a percepção do usuário e a usabilidade. No entanto, cada cenário de utilização exige uma análise específica. Espero que estas dicas possam ajudar!
DomTech é o fornecedor oficial e autorizado do DingTalk em Macau, especializado em fornecer serviços do DingTalk a uma vasta gama de clientes. Se desejar saber mais sobre as aplicações da plataforma DingTalk, pode contactar diretamente o nosso serviço de apoio ao cliente online ou ligar para +852 95970612, ou enviar um e-mail para cs@dingtalk-macau.com. Temos uma excelente equipa de desenvolvimento e operação, com vasta experiência no mercado, e podemos oferecer-lhe soluções e serviços profissionais do DingTalk!