Criei uma tabela aqui no Discourse meta há alguns dias e tive muita dificuldade. Como eu não tinha certeza de como o construtor deveria funcionar e o que eu via não era o que eu esperava, apenas adicionei a tabela padrão e a personalizei a partir daí.
Pensei em compartilhar alguns comentários agora que passei mais tempo e descobri a maioria das coisas que estava perdendo.
Minha primeira experiência com o construtor de tabelas
Serei honesto, o construtor de tabelas é muito mais avançado do que eu esperava - então parabéns pelo trabalho que vocês dedicaram a ele. A maioria das plataformas que permitem tabelas mantêm os construtores bem simples e apenas oferecem uma maneira rápida de indicar a quantidade de linhas e colunas que você deseja em sua tabela. Isso cria um padrão que você pode seguir. Dito isso, não encontrei muitas plataformas que usam Markdown que oferecem construtores de tabelas.
Acho ótimo que vocês tenham um construtor real que oferece algo mais parecido com uma experiência WYSIWYG em vez de depender das pessoas se acostumarem com uma experiência Markdown (admittedly) nada amigável. Eu consigo criar tabelas em MD manualmente, mas tentar revisá-las é quase impossível sem uma pré-visualização.
Infelizmente, comecei a usar a ferramenta esperando apenas dizer “quero uma tabela com cinco colunas e dez linhas”… e não foi isso que consegui - em vez disso, obtive uma página branca grande com uma tabela quase vazia. Não havia nenhuma informação sobre o que eu deveria fazer visível para mim imediatamente, então fiquei um pouco perdido. O que vocês têm aqui é algo muito semelhante a como o Google Docs insere/edita tabelas, mas não há muita coisa na interface do usuário para indicar isso ao usuário.
A primeira coisa que tentei fazer foi clicar duas vezes no texto “Coluna 1”, já que é sempre por onde eu começo com tabelas - nomeando linhas/colunas. Sem sucesso. Eu conseguia selecionar o texto, mas nada o removia. Como eu estava na mentalidade da ferramenta de texto simples do criador de posts padrão do Discourse, eu nem pensei em clicar com o botão direito do mouse.
Descobri que podia adicionar texto às células individuais, mas ainda estava perdido quando se tratava de adicionar/remover linhas e colunas porque eu ainda estava na mentalidade de que tudo o que eu estava fazendo era dizer a uma ferramenta simples para criar a estrutura que eu então teria que editar no editor padrão.
Como o principal ponto de frustração para mim ao criar uma tabela MD é lembrar como configurar as duas primeiras linhas de código (cabeçalho e divisor horizontal), cliquei no botão “construir tabela” neste ponto e apenas a editei diretamente.
Hoje retornei porque não conseguia realmente descobrir se os problemas que encontrei eram um bug, UI/UX ou PEBKAC e queria relatar um bug, recomendar uma mudança na interface do usuário ou descobrir como sou tão idiota a ponto de perder algo tão óbvio.
No final, descobri que provavelmente foi uma combinação de todos os três. Existem algumas pequenas questões que eu classificaria como bugs, algumas questões de UI/UX e, como eu não abri ou notei o “?” no canto inferior direito, pelo menos um pouco de culpa minha.
Pensamentos de melhoria de UI/UX
Existem várias coisas que sugeri acima que realmente ajudariam a elevar uma ferramenta já incrível, tornando seus recursos mais fáceis de encontrar. A principal maneira pela qual acho que isso pode ser melhorado é ajudar realmente os usuários a entender como usar o construtor.
Tornar as instruções mais detectáveis.
Embora vocês tenham aquele ícone de ponto de interrogação no canto inferior direito, ele está tão longe do conteúdo principal da página que é muito fácil de perder. O ícone de ajuda poderia ser muito mais visível se estivesse em outro lugar na página - como logo ao lado do cabeçalho. Vocês poderiam considerar abrir a janela modal na primeira vez que alguém usar o construtor e dar a opção de dispensá-la em visitas futuras. Alternativamente, não há realmente muito texto no menu de ajuda - considerem se faz sentido escondê-lo - exibam-no diretamente acima ou abaixo da tabela.
Use elementos de interface do usuário visíveis e familiares para melhorar a descoberta de recursos
Vocês já têm a seta suspensa para indicar a ordenação por uma coluna específica - façam mais disso para tornar os outros recursos mais fáceis de encontrar em vez de escondê-los em menus de clique com o botão direito. Isso também ajuda a tornar o construtor mais amigável para dispositivos móveis.
- Exiba o ícone de edição nas células do cabeçalho para tornar a edição do texto mais detectável.
- Use um ícone de + nas bordas da tabela para adicionar rapidamente novas linhas/colunas.
- Se linhas/colunas inteiras forem destacadas, adicione um ícone de lixeira acima das linhas ou à esquerda das colunas para indicar que elas podem ser excluídas.
Eu não sou uma pessoa de UI/UX, então provavelmente existem opções mais padrão aqui, mas espero que esta lista dê a vocês algumas ideias de como fazer isso. Acho que encontrar o equilíbrio certo entre como o construtor de tabelas do Google Docs funciona e o que vocês têm agora levaria a ferramenta a ser mais intuitiva sem a necessidade de texto de ajuda.
Faça com que pareça um editor
Embora eu saiba que as tabelas MD são muito mais limitadas nas opções de formatação que podem ser usadas, a página realmente não tem nenhuma indicação de que é um editor. Ter uma barra que permite adicionar linhas, colunas e quais formatações são possíveis elevaria essa ferramenta, ao mesmo tempo em que indicaria mais aos usuários o que ela é e o que eles podem fazer. No momento, não tenho certeza de como adicionar decorações de texto, links, imagens, etc. a uma tabela. Todas essas são possíveis, mas não no Construtor.
Alguns pequenos bugs
- A primeira coluna dentro do editor me confunde. Isso me leva a sentir que você pode ter cabeçalhos de linha, que simplesmente não são possíveis em MD. Considere ajustar isso para deixar mais claro que eles não aparecerão na tabela final.
- O MD da tabela concluída não tem os espaços extras na frente do texto nas células da primeira coluna. Isso não parece quebrar a tabela, mas eu gostaria que fosse consistente.
- Considere colocar automaticamente a tabela concluída em uma nova linha. Se eu construir uma tabela em uma linha de texto existente, ela parecerá quebrada. Forçando-a a ficar em uma nova linha com uma linha vazia acima dela, a tabela sempre funcionará corretamente.
Aqui está uma captura de tela que mostra o segundo e o terceiro itens.
