Redesenhando o Portal de Esportes e Lazer de São Paulo em torno das necessidades dos cidadãos.

A força do site existente foi o conteúdo: programas, instalações esportivas, informações legais, páginas institucionais, notícias e instruções de serviço já estavam lá. A fraqueza foi a experiência em torno desse conteúdo.

Os usuários muitas vezes tinham que entender a terminologia SEME e as categorias internas antes de encontrar uma resposta. Diferentes tipos de conteúdo compartilhado quase a mesma estrutura de página, padrões de navegação eram inconsistentes, e a interface móvel atrasou o conteúdo real por trás de menus e banners de tamanho excessivo.

O redesenho teve que preservar e migrar conteúdo legado, apoiar conteúdo institucional, de serviço, editorial e baseado em localização no mesmo ecossistema, atender aos requisitos de acessibilidade e responsividade, e passar rapidamente da análise para protótipos funcionais.

A auditoria combinou avaliação heurística, revisão da arquitetura da informação, verificação da consistência visual, considerações de acessibilidade e caminhadas orientadas para as tarefas. Testei viagens comuns, tais como encontrar um centro esportivo, entender um programa, procurar um horário e abrir um artigo de notícias.

Os problemas recorrentes foram estruturais: nenhuma hierarquia clara de homepage, categorias baseadas em terminologia interna, lista e páginas de detalhes que pareciam muito semelhantes, um padrão de busca instável, paginação aparecendo antes do conteúdo, páginas longas que eram difíceis de digitalizar, imagens pequenas, contexto perdido em viagens mais profundas e muitas decisões de menu antes da descoberta.

Os móveis amplificaram estas questões. O menu consumiu muito do primeiro viewport, banners dominaram a experiência e selecionar um tópico nem sempre fez a mudança de conteúdo óbvia até que o usuário rolou.

Melbourne informou a estrutura modular e inclusão; Helsinki mostrou como tornar legível e direto o conteúdo esportivo municipal; Curitiba trouxe um exemplo brasileiro de descoberta liderada por serviços. As imagens abaixo mostram essas referências ao vivo em setembro de 2026, não um arquivo da pesquisa original.

Juntos, reforçaram três princípios para a SEME: começar com tarefas cidadãs, tornar os lugares e atividades fáceis de encontrar, e conectar informações à próxima ação.

O portal legado misturou programas, locais, áreas internas e serviços em níveis semelhantes da navegação. O redesenho preservou o conteúdo subjacente ao mudar as relações entre ele.

Programas se tornaram um grupo primário claro em vez de ser misturado com locais esportivos. Aulas e atividades foram conectadas aos centros onde acontecem. Locais esportivos públicos foram tratados como locais, evitando-se terminologia ambígua de “equipamento” quando não condiz com o modelo mental cidadão. As notícias ganharam um modelo de listagem e artigo dedicado, enquanto o conteúdo institucional permaneceu disponível sem competir com as tarefas cidadãs na página inicial.

A nova interface combina um cabeçalho institucional estável com seções de conteúdo modular, fotografia maior, títulos de página clara e componentes reutilizáveis. A direção é contemporânea sem se tornar app-like em detrimento da clareza do serviço público.

A navegação mantém o comportamento de busca estável em todo o portal, separa Programas, Centros Desportivos, Notícias, Serviços e Conteúdo Institucional, adiciona navegação contextual e migalhas de pão às páginas internas e mantém o menu móvel compacto até ser explicitamente aberto.

Em vez de dar notícias, banners e links institucionais com o mesmo peso visual, a homepage estabelece uma hierarquia progressiva: orientação em primeiro lugar, prioridade cidadão tarefas em segundo lugar, e conteúdo atual e informações institucionais depois disso.

Os centros esportivos tornaram-se objetos de serviço em vez de descrições simples, reunindo endereço, contexto regional, horário de abertura, atividades, acessibilidade, mapa, fotos e informações de contato. A pesquisa tornou-se um padrão global previsível, e as notícias receberam sua própria identidade editorial com cartões, datas, categorias e um modelo de artigo com foco na leitura.

Mobile foi tratado como um redesenho estrutural, não apenas uma tela menor: navegação permanece compacta, conteúdo de serviço vem antes da decoração e interação mantém o contexto do usuário visível.

Um portal com dezenas de tipos de conteúdo não pode escalar se cada página for projetada de forma independente. O redesenho moveu-se para padrões reutilizáveis para navegação, cartões, botões, busca, conteúdo editorial, páginas do programa, locais, horários e comportamento responsivo.

A discussão do CMS fazia parte do problema do design. O horário de funcionamento do Sports-center, por exemplo, necessita de campos estruturados para cada dia, incluindo estados fechados e apoio futuro para vários períodos, em vez de um único campo de texto não estruturado. Templates reutilizáveis, campos de conteúdo previsíveis, proporções de imagem consistentes e estados componentes facilitam a migração e manutenção do sistema.

O portal oficial coloca um menu de longa categoria ao lado de banners e notícias. No protótipo, a busca e o direcionamento dos caminhos para os serviços facilitam a localização das principais tarefas dos cidadãos. Esta é uma comparação de design, não um resultado pós-lançamento medido.

A maior lição foi que a reformulação do setor público não é principalmente sobre a remoção de conteúdo. Grande parte da informação existe porque os cidadãos, as instituições e os processos jurídicos dependem dela.

O desafio de design é decidir o que merece prioridade, onde a informação pertence e como diferentes públicos podem alcançá-la sem entender a organização por trás do serviço. O resultado é uma relação mais clara entre a informação pública e a próxima ação que um cidadão precisa tomar.