Portal - Novo BSM
Services
UX Design
UI Design
Content Reorganization
App Development
Sector
Information Technology
Year
2023
Novo BSM
O BSM (Brasil Sem Medo) decidiu renovar seu portal de notícias como parte de um processo de rebranding, visando refletir com mais precisão sua identidade e valores. A reorganização do conteúdo, alinhada a uma nova identidade visual, foi motivada pela necessidade de aprimorar a acessibilidade e a experiência do usuário. Realizei esse trabalho através da empresa NRE, sendo o responsável por conduzir todo o processo de reformulação.
Challenges:
01
Desorganização do Conteúdo:
Todo o conteúdo estava agrupado em um dropdown, tornando difícil para os usuários encontrar o que estavam procurando.
02
Diversidade de Mídias:
O portal oferecia uma variedade de conteúdos, como artigos, vídeos e podcasts, mas não havia uma estrutura clara para apresentar essas diferentes formas de mídia.
03
Necessidade de Colaboração Interna:
Era essencial envolver a equipe de criação e produção de conteúdo na reorganização do portal para garantir que a nova arquitetura da informação refletisse suas perspectivas e necessidades.
04
Fragmentação da Experiência do Usuário:
A existência de uma plataforma separada de cursos fragmentava a experiência do usuário, exigindo que os usuários navegassem entre dois sistemas distintos.
Solução:
1. Reorganização do Conteúdo:
1.1_Introdução das categorias “Ler”, “Escutar” e “Assistir” para organizar o conteúdo com base no aspecto sensorial principal de cada tipo de mídia.
1.2_Realização de atividades de card sorting com a equipe interna para compreender como os criadores e produtores de conteúdo pensam sobre a organização do conteúdo e utilizar os resultados para informar as decisões de design e arquitetura da informação do novo portal.
2. Integração da Plataforma de Cursos:
Para oferecer uma experiência unificada e coesa, foi decidido trazer a plataforma de cursos para dentro do portal de notícias.
3. Reestruturação da Arquitetura da Informação:
3.1_Os conteúdos que não se encaixaram diretamente nas categorias “Ler”, “Escutar” ou “Assistir”, conforme inicialmente previsto foram realocados para uma nova seção independente no portal.
3.2_A arquitetura da informação do portal foi atualizada para acomodar a nova seção de cursos
Card Sorting
Foi adotado o método de card sorting fechado. Este método foi escolhido devido à definição prévia das três categorias principais (“Ler”, “Escutar” e “Assistir”) durante a fase inicial do projeto.
UI DESIGN - CONSTRUÇÃO DOS FUNDAMENTOS E ESTILOS
Definição de cores primárias, secundárias, cores semânticas, tipografia e família iconográfica
RESULTADO FINAL
1. Tela de Login
Projetada com foco na objetividade e ação direta. Com uma interface limpa e sem distrações, os usuários são rapidamente direcionados para inserir suas credenciais e acessar a plataforma.
2. Home
A página inicial do portal serve como uma apresentação geral de todo o conteúdo disponível. Abordagem clean e arquitetura da informação cuidadosamente elaborada, proporcionando ao usuário uma interface visualmente atraente e facilmente navegável.
3. Leia
Todo o conteúdo voltado especificamente para leitura se encontra nessa seção.
4. Assista
Todo o conteúdo de vídeo foi colocado nessa seção. Adotando uma paleta de cores escura com o objetivo de proporcionar uma maior imersão ao usuário no consumo do conteúdo.
5. Escute
Todo o conteúdo de áudio foi colocado nessa seção. Para os conteúdos de audio e/ou vídeo foi adotado a mesma paleta de cores escura.
6. Área do Curso
Com o objetivo de oferecer uma experiência de aprendizado envolvente, utilizou-se de uma estética escura para promover foco e concentração.
7. Aplicativo
Interface simples e funcional. Uma extensão da experiência do usuário oferecida pelo portal. Barra de navegação destaca os acessos principais aos conteúdos.
