29

Acredito que a maioria dos softwares padronizam o uso da palavra "Cancelar" para um botão cuja a ação é cancelar a operação que está em curso. Claro que a operação em curso é a mais próxima que está ocorrendo. Provavelmente é aquela operação responsável pelo mecanismo de confirmação de uma outra operação que provavelmente faz parte de uma regra de negócio.

Por exemplo: se você vai "cancelar" o pagamento já efetuado de um boleto. Esta operação usa exatamente o termo "cancelar" porque os usuários do software estão acostumados com ele, faz parte do domínio deles. E antes de concluir o cancelamento o software pergunta se é isto mesmo que o usuário quer fazer. É muito comum o uso de dois botões nesta confirmação. Um "ok" e outro "cancelar". neste caso é para cancelar o o processo de cancelamento. E provavelmente isto é o padrão para todo o software. Mudar isto seria despadronizar o funcionamento. Todo mundo está acostumado com o "ok" e "cancela" para cancelar operações em processo de confirmação.

Mas é bem claro que isto não é intuitivo, é fácil cometer um erro confundindo o que você está efetivamente cancelando.

Este problema é bem mais comum do que parece.

O que fazer nestes casos?

A intenção da pergunta é ter um conteúdo em português sobre o assunto já que eu tenho informações em inglês. Se possível gostaria de novas informações também, além das contidas lá. Nem vou pedir um estudo específico sobre o assunto porque não é fácil ter algo assim, mas qualquer informação deve ser minimamente fundamentada. Pode parecer óbvio o que fazer, mas em UX todo cuidado é pouco.

Bonus point: Muitas vezes isto só ocorre por causa de traduções sem contexto, ou seja, o problema podia não ocorrer no original. Além de simplesmente testar tudo antes de liberar, que é a solução óbvia, tem algo a mais que pode ser feito para "garantir" que o texto não seja confuso?

9
  • 2
    Geralmente eu vejo esse problema quando a pessoa usa OK / Cancel padrão. Quando eu faço esse tipo de diálogo eu uso o contexto da ação. Exemplos (depende do resto da UI): "Votar", "Não votar", "Cancelar voto", "Não cancelar voto". Para certas coisas, eu inclusive faço com que a pessoa digite o verbo para a ação ocorrer: "Digite REMOVER para remover a ficha selecionada do sistema". Qualquer coisa diferente disso simplesmente não faz a ação. Isso costuma evitar muita besteira em sistemas de produção onde uma besteira sai mais caro do que os 5 segundos a mais que você faz o usuário pensar.
    – Largato
    Commented 3/04/2015 às 12:49
  • 4
    Uma solução meio óbvia é o diálogo perguntar se "Sim" ou "Não".
    – bfavaretto
    Commented 3/04/2015 às 13:10
  • 2
    Não sei se é tão solução assim, afinal é: "sim, cancele o cancelamento" ou é "sim, cancele o que é para cancelar"? Todo mundo sabe que as pessoas não leem a pergunta da caixa de diálogo. Fora que isto quase dá outra pergunta, "sim" e "não" não dá muito contexto, cria outro problema.
    – Maniero
    Commented 3/04/2015 às 13:15
  • 3
    Então seria algo como "Desfazer o cancelamento". Mesmo assim prefiro mais explícito "Desfazer cancelamento", "Manter cancelada" - Lembrando que a questão mencionada é um exemplo, creio que o OP esteja falando num contexto geral onde isto ocorre, e os dizeres e gravidade do engano podem variar. Eu acho que a indicação do que é o quê pra manter um padrão deve ser a posição e eventual cor dos botões, e o OK, Cancela (ou Sim e Não) só sejam usados nos casos corriqueiros.
    – Largato
    Commented 3/04/2015 às 13:21
  • 1
    Provavelmente uma boa solução seria evitar o cancelamento de um cancelamento. Se algum processo pode ser cancelado, ele deveria ser definitivo, um processo simples. Com isso em mente o nome a ser modificado seria o processo que possa ser cancelado. Em vez de Cancelar o pagamento você poderia Estornar e aí sim cancelar o estorno.
    – iuristona
    Commented 3/04/2015 às 13:42

3 Respostas 3

19
+50

Vou fundamentar a minha resposta com base nessa imagem, tirada do seu bom exemplo de que o problema é mais comum do que pode parecer (achei melhor reproduzir a imagem aqui para facilitar aos leitores):

inserir a descrição da imagem aqui

Há algumas questões envolvidas ai, que realmente tornam essa interação confusa.

1. Ordem dos Botões de Ação

Primeiramente, a ordem dos botões. Há quem diga que deve-se buscar sempre manter a convenção utilizada pelo sistema operacional (OK -> CANCEL vs CANCEL -> OK) e isso faz muito sentido. Simplesmente porque, por pior que seja a usabilidade de um dos padrões escolhidos, o usuário eventualmente se acostuma e naturalmente espera essa consistência. Porém, faz também muito sentido se preocupar constantemente com isso, principalmente porque (1) é difícil manter essas convenções em aplicações cross-platform, como é o caso de sistemas Web, e (2) estudos com a fixação do olhar demonstram que o fluxo ideal (por ser mais natural e mais eficiente em termos de esforço cognitivo) é da esquerda para a direita, sendo assim mais interessante colocar o botão da ação principal mais à direita (mais ou menos como sendo no "fim" do diálogo).

Logo, no exemplo dado, parte da confusão pode se dever à localização do botão Cancelar, talvez por fugir do padrão de costume do usuário e, mais provavelmente, por parecer ser a ação primária mais natural.

2. Contexto da Ação e Nuances da Comunicação Textual

Em segundo lugar, há também a questão da comunicação textual com o usuário. Não se pode esquecer que uma caixa de diálogo como essa é uma comunicação direta entre a aplicação e o usuário. Há uma demanda sendo solicitada, em um contexto específico, e espera-se uma resposta do usuário. No exemplo, grande parte do problema é que o contexto não está claro. Veja a pergunta: "Tem certeza?". Tem certeza do quê? Note como o AP no Meta desenhou uma seta vermelha ligando a possível ação primária ao "contexto" (retirar voto) da ação.

Essa falta foi sentida por ele porque é real. Quando uma janela de diálogo aparece, o foco do usuário se altera e é importante manter a informação de contexto. Não é a toa que no Windows, por exemplo, as caixas de diálogo geralmente têm um título indicando o contexto:

inserir a descrição da imagem aqui

Já que a janela não tem uma barra de título, a parte do "Tem certeza?" no texto seria mais adequada se fosse "Tem certeza de que deseja retirar o seu voto?". De fato, assim ela mostraria muito mais claramente para o usuário (e potencialmente até para o próprio projetista da interface) o que mais há de ruim nesse diálogo: o uso da palavra "cancelar" no próprio texto da mensagem, de forma descontextualizada. Considerando o contexto da ação, essa palavra deveria ser "retirar" e não "cancelar". Assim, eu julgo que a melhor mensagem nessa situação seria:

Tem certeza de que deseja retirar o seu voto? Você não poderá votar novamente nessa questão depois de retirá-lo.

3. Desapego da Convenção OK/CANCEL

Em terceiro lugar, há também de se considerar que muitos usuários não lêem o texto com muita atenção, e isso tende a ocorrer conforme eles se tornam mais experientes com o uso do sistema. Assim, muito embora a convenção de usar "OK" e "CANCEL" seja útil e a falha em seu uso possa causar dificuldades, já se sabe que faz muito sentido utilizar botões que sejam suficientemente claros e descritivos da ação que executam de forma a que sejam bastante independentes da mensagem de texto. Assim, caso o usuário não leia ou leia apenas superficialmente a mensagem, ainda assim é mais difícil de ele cometer erros (um importante princípio de usabilidade).

Isso não quer dizer pra simplesmente abandonar o padrão OK/CANCEL, mas para evitar de utilizá-lo quando uma ação é crítica ou se percebe que há potencial para confusão.

No caso do exemplo, a retirada do voto tem como resultado a impossibilidade de dá-lo novamente, por isso a ação é crítica. Além disso, grande parte da confusão seria reduzida se os botões fossem "Desistir" e "Retirar o voto", por exemplo. Aliás, essa abordagem é bastante condizente com o uso feito na pergunta citada na resposta do @Sergio. :)

6
  • 1
    Um dos problemas que eu vejo é justamente que as pessoas não costumam ver o contexto de onde elas estão antes clicar. Eu faço isto :) Na verdade os bons nadadores são os que mais morrem afogados :) Eu vejo a solução como um misto de texto contextual no botão, cor e posição padronizados para ajudar passar a mensagem certa. Ainda assim não sei se é totalmente eficaz e como pode atrapalhar a padronização. Porque pode haver sempre uma palavra que pode conflitar com o domínio. Você está virando meu personal Google p/ assuntos de UX :)
    – Maniero
    Commented 3/04/2015 às 16:43
  • 1
    Também os motoristas mais experientes são os que mais sofrem acidentes. É a vida. :) E eu concordo, a solução é um misto desses tópicos. Você perguntou "além de testar", como prevenir? Então, eu tentei dar algumas dicas. Acho que a teoria ajuda, mas os testes são sempre fundamentais pra notar o que nós eventualmente deixamos passar no design. Afinal, ninguém é perfeito. Commented 3/04/2015 às 16:48
  • 2
    Ah, e eu gosto muito do assunto, então acho ótimo vc vir com essas perguntas boas (e as vezes polêmicas hehehe). :) Commented 3/04/2015 às 16:50
  • 1
    Não sei nem se são polêmicas de fato, algumas pessoas talvez o achem, mas estas são as mais difíceis para os programadores e é algo que todos precisam lidar diariamente. Ao contrário do que alguns possam achar, eu realmente tenho interesse pelo assunto, mas meu conhecimento é ínfimo e nem pretendo me especializar, só quero melhorar o que faço para meus usuários. E suas respostas chegam ser melhores do que as encontradas no UX.SE. E curiosamente a pergunta costuma ter mais votos depois que você responde. Você está funcionando como validador da pergunta :) O que não deveria ser necessário
    – Maniero
    Commented 3/04/2015 às 16:54
  • 1
    Infelizmente minha percepção é que está piorando, alguns usuários "importantes" estão participando menos e eles ajudavam o comportamento geral, na média, ser um pouco melhor. Este é um fenômeno que vi ocorrer em outros sites da rede mas aqui aconteceu rápido demais. Mas torcemos que melhore de novo e volte aos padrões do ano passado.
    – Maniero
    Commented 3/04/2015 às 17:04
8

Há uma outra pergunta relacionada, da @diéssica, no UXen. Na resposta aceite e bem votada pode lêr-se:

Users will usually associate an action such as "Remove" or "Delete" to red. And, as always, provide a way to "cancel" the action.

que traduzido é:

Os utilizadores associam normalmente uma ação como "remover" ou "apagar" com vermelho. E como sempre tendo um botão para cancelar a ação.

Há casos dificeis em que a ação tem o mesmo nome que o nome intuítivo para a contra-ação então deve usar-se algo para clarificar. Por exemplo, juntar "Sim" em "Sim, cancelar" ou "Não cancelar".

As regras que uso são:

  • deve dar-se uma maneira de cancelar a ação;
  • a confirmação da ação deve ter o mesmo nome que a própria ação;
  • a confirmação da ação deve ter a côr/estado de ativo, ou seja de entre os dois sêr o proeminente.
8

Este é um dos padrões em que não vejo nenhum problema em quebrar.
A razão é simples:

a grande maioria do utilizadores não lê com atenção o que está escrito na mensagem.

Sabendo isso, é minha preocupação evitar que o utilizador menos atento faça "asneira".

Quebrar a regra é uma forma eficaz de levar o utilizador a tomar consciência da ação que vai executar.

As minhas regras são:

1. A resposta afirmativa deve executar a ação e a negativa cancelar.

Isto evita qualquer ambiguidade.
O que se espera, quando uma ação é seguida de uma caixa de diálogo, é que esta seja um pedido de confirmação.

2. A pergunta deve descrever a ação e não apenas pedir confirmação.

Deverá ser curta mas suficiente para contextualizar a ação.
Caso a ação seja destrutiva, um texto no corpo deve descrever o que de mau pode acontecer.

3. OK/Cancel só em situações similares às do sistema operativo.

Na maioria das vezes, nestas situações, usam-se as caixas de diálogo do sistema operativo.
Em situações em que não queremos utilizá-las(ocorre-me WPF com MVVM), o padrão deve ser mantido.

3. SIM/NÃO só em situações simples e que facilmente a ação possa ser reposta.

Quando a ação não envolve situações irreversíveis e estas sejam as respostas óbvias à pergunta.

4. Nos outros casos os botões descrevem a ação que irão executar.

É a forma mais eficaz de informar o utilizador daquilo que irá ser executado.
Evita ambiguidades, permitindo ao utilizador uma decisão rápida e segura.

5. Trocar a ordem habitual dos botões para negativa à esquerda, positiva à direita.

Isto ajuda a evitar que, precipitadamente, o utilizador execute algo de que se venha a arrepender. Evita actos mecânicos e instintivos.
Obriga o utilizador a concentrar-se na ação antes de a executar.
(Claro que, se isto se tornar regra, daqui a alguns anos teremos que voltar à primeira forma.)

3
  • O item 5 não está claro. É pra usar ou não "negativa à esquerda da positiva"? Parece-me que você argumenta que deixar a positiva à direita é ruim porque pode levar a atos mecânicos e instintivos. Se é essa a intenção, eu contra-argumento que o diálogo em si já é uma proteção. Não sei se proteções adicionais são tão interessantes. Seria como argumentar pra não usar o "default" (tecla enter aciona o botão positivo) pra prevenir atos mecânicos. Assim também se "previne" os atos mecânicos úteis (e imagina ter que clicar no OK na confirmação de cada item em uma lista de 20...) :) Commented 3/04/2015 às 19:49
  • @LuizVieira O que eu queria dizer é que é ruim ter a positiva à esquerda. Tomei conhecimento desta recomendação na documentação do Android em relação ao design de Dialog's. Na altura a razão que me ocorreu foi que era para evitar a aceitação do Dialog de forma precipitada. Lendo a sua resposta percebo que a razão tem a ver com o fluxo: esquerda "retroceder" a açao, direita prosseguir com a ação; o que faz todo o sentido.
    – ramaral
    Commented 3/04/2015 às 20:35
  • Ah, ok. Bom, eu entendi o contrário, então talvez fosse melhor editar e melhorar a descrição do item 5. :) Commented 3/04/2015 às 20:40

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .