Importante

Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!

1
resposta

[Projeto] UI Patterns - Site Alura

Ao buscar por padrões de interface no site da Alura, destaco alguns:

  • Botão de "Discutir no Fórum": utiliza o ícone de abrir em nova janela/guia, uma fonte diferente do restante do texto e está com ela sublinhada. Todos esses signos indicam que é um link e que, ao clicar nele, a pessoa não sairá da página do curso. O fato de abrir em uma nova guia traz segurança de que o progresso no curso não será perdido e indica que é uma atividade a ser feita em paralelo, que ao concluí-la o ideal é voltar e seguir fazendo as aulas.
  • Botão de abrir/fechar o menu lateral: é um botão sutil e claro na sua mensagem, com cores que não chamam a atenção e símbolo de seta para a direita/esquerda, indicando o que acontecerá ao ser clicado.
  • Setas para expandir/contrair atividades das aulas: da mesma forma que as setas mencionadas acima, é um padrão de botão amplamente utilizado e que conta com a mesma clareza do outro. A seta está para baixo ao clicar para expandir (porque expande para baixo) e para cima ao clicar para contrair. Também traz segurança e clareza.
  • Botão Lumi: o microcopy "estou com dúvida" deixa claro e direto o motivo que te fará clicar neste botão: não é uma IA para conversar sobre qualquer coisa, o foco dela é justamente tirar dúvidas. A escolha do degradê vai de encontro com o padrão que vem sido utilizado para designar IAs em diversos outros aplicativos e, mesmo que para algumas pessoas ainda seja algo inconsciente, auxilia a entender que é uma IA, mesmo que não esteja dito claramente isso.
  • Botão de engrenagem ao lado de "Opinião do Instrutor": esta parte me gera estranhamento e dúvidas. O botão de engrenagem me remete à configurações/ajustes, então não entendo o que o fórum do curso e a sugestão de alterações tem a ver com ele. Também não é claro para mim se a "Opinião do Instrutor" deveria ser um título para o que está escrito abaixo. Pela parte cinza e azul que vai atrás do título, me parece que era algo que deveria expandir, mas não há essa opção.
1 resposta

Oi, Fernanda. Tudo bem com você?

Sua análise dos UI Patterns demonstra um olhar atento para a relação entre interface, comunicação visual e experiência da pessoa usuária. Além de identificar elementos como botões, ícones e setas, você justificou como cada padrão contribui para a navegação intuitiva e para a redução de dúvidas durante o uso da plataforma. Também foi interessante relacionar o microcopy do botão Lumi com sua finalidade, mostrando que o texto e a identidade visual trabalham em conjunto para orientar quem utiliza o recurso.

Outro ponto de destaque foi sua avaliação crítica sobre o botão de engrenagem ao lado de "Opinião do Instrutor". Esse tipo de observação faz parte do processo de UX, pois questionar se um ícone comunica corretamente sua função ajuda a identificar possíveis oportunidades de melhoria. Um exemplo semelhante ocorre quando um ícone de lixeira é utilizado para arquivar um item em vez de excluí-lo, o que pode gerar interpretações equivocadas e comprometer a usabilidade.

Na sua opinião, quais ajustes nesse componente da "Opinião do Instrutor" poderiam tornar sua função mais clara para quem acessa a página pela primeira vez?

Parabéns pela análise e por compartilhar suas percepções. Continue participando das discussões, pois o fórum está à disposição para trocar ideias e aprofundar esse olhar sobre experiência do usuário.

Alura Conte com o apoio da comunidade Alura na sua jornada. Abraços e bons estudos!