[UX/UI] - Melhoras para listagem de tópicos

[VitorFigm]

Listagem de tópico

Muita Informação

A tela inicial está jogando muita coisa de uma vez para o usuário olhar, o que possívelmente o deixa com uma sensação de confusão, isso pode ser resolvido facilmente com uma margem maior separando cada tópico.

Ilustração

É interessante permitir os criadores dos tópiucos colocarem uma ilustração no começo de cada tópico para que o usuário não precise ler tópico por tópico pra saber qual deles lhe interessa.

Protótipo

Acredito que algo deste tipo já ficaria interessante:

Outra ideia

Outra ideia seria se inspirar em listagem de outros sites populares que seguem esse estilo de blog, como o Medium. Acho que essas linhas transparente pra separar cada tópica deixa a tela bastante agradável.

[coffeeispower]

Acho que uma thumb era melhor,

O design que eu tô pensando e que ele pega a thumb e coloca no fundo da listagem do conteúdo, e quando VC passa o mouse ele revela a thumb inteira

E também isso precisa ser controlado porque podem trollar e colocar p ou algo assim, tem sistemas que conseguem detectar isso, mas nada e perfeito. Tem que lembrar que o site e controlado pelos usuários

[Rafatcb]

Não acho que tenha muita informação. Na verdade, acho que o TabNews lida muito bem em mostrar apenas o essencial, dando um destaque para o título, o que facilita de ler apenas títulos em um scan rápido no site.

Colocar imagens deixaria muito poluído, com ainda mais coisas na tela e menos informações úteis. Como usuário do site, eu entro para ver o que ainda não vi, então quanto mais publicações couberem na minha tela sem precisar dar scroll e com uma leitura fácil, melhor. Inclusive, o fato de diferenciar publicações visitadas das não visitadas contribui positivamente com meu desejo de ver o que ainda não vi.

O TabNews é inspirado no Hacker News.

[brunoinds]

Quando entro no TabNews, quase que instantaneamente sinto a falta da thumb nos artigos. Sem imagens, dá até preguiça de abrir o artigo. Imagens valem mais que mil palavras e é a chave para que a primeira vista, chame a atenção. É extremamente essencial e creio que deveria ser uma prioridade no time de FrontEnd. Deve-se quanto antes implementar uma thumb pra os posts.

A implementação mais simples seria usar a primeira imagem adicionada no corpo do artigo. Um parse do Markdown e recuperar a primeira imagem para ser a thumbnail.

[Rafatcb]

Como este issue não teve interações para avançar o assunto, estou fechando-o para organizar o repositório. De forma geral, será bem difícil realizar uma grande mudança na UI do TabNews porque cada pessoa terá um gosto, e a interface atual tem atendido bem o público do site.

Agradeço pela colaboração dos que participaram neste issue. No momento atual do TabNews, os esforços estão direcionados para o Milestone 7 #1490.