Observatório SEBRAE Moda

O desafio não era desenhar a melhor interface. Era desenhar a melhor interface que o CMS do SEBRAE conseguisse publicar, para leitores que presumi terem pouca familiaridade com dados.

O CMS da Datawheel, padrão do SEBRAE, só publica uma página única, sem modais, dentro de uma diretriz visual já estabelecida.

Ver na página real
Papel
Product Designer (UX, UI e PO), TD Business. Desenhei a experiência e a estrutura da página; a implementação no CMS foi do dev da equipe.
Resultado
Aprovado pela diretoria do SEBRAE em apresentação em São Paulo, 13/10/2026, segundo retorno oral do CEO e do diretor da TD Business. Desde o lançamento, cerca de 4.800 sessões, 28% delas com uso de filtros, territórios ou perguntas (relatório do SEBRAE). Limite: sem linha de base.
Prazo
Projeto de mar a out/2026; entrei no fim de jul; entrega final em 07/10/2026
Time
1 gerente de projeto, 1 designer, 2 economistas, 1 analista de dados, 1 dev fullstack

Destaques

Tudo precisava caber dentro do CMS

O observatório roda no CMS da Datawheel, padrão do SEBRAE. Uma interface superior que o CMS não publica não serve a ninguém, então a fidelidade ao CMS virou meu critério de qualidade, não uma limitação a driblar.

O custo: o que ele não publica, como os modais dos protótipos, saiu do desenho. A POC Técnica classificou 28 elementos: o que o CMS fazia sozinho e o que exigia código novo.

Uma página que começa por perguntas

O SEBRAE pediu indicadores de todas as UFs e municípios do país, e nada ficou de fora. Parti de uma premissa minha, não de um achado: com o alcance do SEBRAE no país inteiro, muita gente chega sem hábito de ler dados.

A equipe considerou abrir com um painel de indicadores. Abri com contexto e perguntas: a cadeia “Do fio à vitrine”, a classificação “Três tecidos, uma moda” e “Por onde começar?”, com oito perguntas que levam ao trecho certo. Critério: quem tem pouca prática com dados encontra uma pergunta conhecida antes de um indicador. Custo: o indicador vem um passo depois da pergunta. A estrutura foi decisão minha, e a equipe aprovou de primeira.

A moda vai muito
além da roupa.

É um setor que une indústria, comércio e serviços para levar cada peça da confecção até o consumidor final, na loja ou no e-commerce. No caminho, movimenta criatividade, tecnologia e muitos empregos. E muda de lugar para lugar. Cada estado e cada município tem o seu perfil de empresas, de emprego e de comércio exterior, que depende da vocação econômica da região e do tamanho do mercado local.

O Observatório da Moda junta num só lugar dados públicos que hoje estão espalhados por várias bases oficiais. Aqui eles viram números, mapas e gráficos de leitura rápida, pensados para pesquisadores, empreendedores e gestores públicos.

OBSERVATÓRIO DA MODA · SEBRAE

Do fio à vitrine

  1. 1 · Fios e tecidosFiação, tecelagem, malharia, estamparia e acabamento de fios e tecidos.
  2. 2 · ConfecçãoConfecção e facção de roupas, peças sob medida, calçados, bolsas e bijuterias.
  3. 3 · VendaVarejo de vestuário, calçados e joias, armarinhos, lojas de tecidos, atacado e representantes.
  4. 4 · Uso e cuidadoLavanderias, aluguel de roupas e acessórios, conserto de calçados, bolsas, joias e relógios.
  5. 5 · PegadaO impacto ambiental e social de toda a cadeia, na seção Pegada da Moda.
  • Indústria da moda
  • Comércio de moda
  • Serviços da moda

Três tecidos, uma moda

Como o Observatório organiza as atividades do setor (classificação SEBRAE, por CNAE)

  • 40 atividades
    Indústria da modaQuem transforma fio em peça: confecção e facção de roupas, malharias, estamparias, calçados de couro e bijuterias.
  • 17 atividades
    Comércio de modaQuem leva a peça até você: lojas de roupas, calçados e joias, armarinhos, lojas de tecidos, atacado e representantes.
  • 7 atividades
    Serviços da modaQuem cuida do que já existe: lavanderias, aluguel de roupas e acessórios, conserto de calçados, bolsas, joias e relógios.

Por onde começar?

O Brasil e os conteúdos do Observatório

Dados do seu estado ou município

Reprodução do bloco Visão geral da página real. Só 9 links respondem. As perguntas sobre o estado e sobre o Mercado de trabalho rolam até o frame Filtros, mais abaixo. A de Estudos rola até a seção Estudos. As de Setor, Exportações, Atendimentos e Eventos abrem a seção correspondente em Aprofundar. A pergunta e o link da Pegada da Moda abrem a página real.

Ver na página real

O país inteiro em um mapa e quatro números

O mapa mostra quantas empresas de moda ativas cada estado tem, em cinco faixas de azul. Quem passa o mouse ou toca em um estado vê o número, a participação no país e a posição entre as 27 UFs. Ao lado, quatro números resumem o ano completo mais recente: exportações, importações, saldo e a parcela de pequenos negócios entre as empresas abertas.

O mapa não tenta responder tudo. O texto dele leva quem quer o detalhe do estado ou do município para a seção de dados, e o menu do topo leva a cada parte da página única.

Moda no Brasil

Setor econômico

Dados de empresas, emprego e comércio exterior da moda brasileira, do país inteiro a cada município. Também há estudos sobre sustentabilidade, tendências e os desafios do setor.

Brasil

Quanto mais escuro o azul, mais empresas de moda ativas aquele estado tem. Passe o mouse ou toque em um estado para ver o número.

Para ver os dados completos de moda de uma UF ou município (empresas, emprego, exportações, atendimentos e produtividade), vá até a seção Dados.

  • até 20 mil
  • 20 a 50 mil
  • 50 a 100 mil
  • 100 a 200 mil
  • 200 mil+

EXPORTAÇÕES DA MODA

US$ 8.216,4 mi

Brasil · 2025

IMPORTAÇÕES DA MODA

US$ 8.906,6 mi

Brasil · 2025

SALDO COMERCIAL DA MODA

− US$ 690,1 mi

Brasil · 2025 · exportações menos importações

PEQUENOS NEGÓCIOS NAS ABERTURAS

97%

2025 · MEI ou Simples Nacional entre as empresas de moda abertas

Dados fornecidos por Receita Federal e IBGE.

Reprodução do topo, do mapa e dos destaques. O menu e o submenu Dados abrem a página real na seção escolhida; o mapa responde ao mouse, ao toque e ao teclado. Dados ao vivo da API pública.

Ver na página real

Filtros em tudo para manter a página curta

Filtros no lugar de telas e modais

Situação
O observatório cobre todas as UFs e municípios, com vários subsegmentos e CNAEs. Mostrar tudo faria a página crescer sem fim, e o CMS não oferece telas extras nem modais. Nos protótipos, o detalhe da UF abria em modal.
Decisão
Coloquei filtros em tudo: tema e pergunta, UF, município, subsegmento e CNAE. Cada controle troca o conteúdo no próprio lugar, e uma ficha da UF resume o recorte. Critério: página curta e publicável no CMS.
Trade-off
Custo: mais controles para descobrir. Consequência: menos rolagem, e o detalhe da UF virou uma ficha no lugar do modal.

Dados da moda segmentados

Escolha uma UF para ver os dados de moda do estado. Para aprofundar o recorte, filtre também por município, por subsegmento (indústria, comércio ou serviços da moda) ou por atividade econômica (CNAE subclasse).

        Unidade da Federação · Região Sudeste

        São Paulo

        • 1º em empresas de moda abertas
        • 1º em empregos
        • 2º em exportações

        • Empresas de moda abertas (2025)

          71,4 mil

          +33,8% sobre 2024 · 29,6% do Brasil

          1º de 27 UFs

        • Empregos formais na moda (2025)

          601,6 mil

          +0,1% sobre 2024 · 25,7% do Brasil

          1º de 27 UFs

        • Exportações de moda (2025)

          US$ 1,89 bi

          −5,6% sobre 2024 · 23,0% do Brasil

          2º de 27 UFs

        • Atendimentos SEBRAE à moda (2025)

          1,57 mi

          −6,3% sobre 2024 · 30,6% do Brasil

          1º de 27 UFs

        Fontes: Receita Federal, RAIS, Comex Stat e SEBRAE.

        Mercado de trabalho

        Tema
        Empresas da moda por município

        Reprodução da barra de filtros, da ficha da UF e do bloco Mercado de trabalho. A ficha reage só à UF; no Mercado, os filtros trocam mapa, gráfico e leitura. Exemplo de leitura: “Em 2025, foram abertas 71.352 empresas de moda em São Paulo que seguem ativas”.

        Ver na página real

        Os frames reproduzem a página real em português, com gráficos redesenhados e nenhum texto abaixo de 16px. Os dados vêm da API pública do Observatório e do IBGE, ao vivo na maioria dos blocos; se a consulta não responde, o frame usa a coleta de 19/10/2026 e avisa. Estudos e Eventos usam o conteúdo fixo do site.

        Cinco relatórios em 25 resumos navegáveis

        Estudos organiza cinco relatórios em abas. Cada um se abre em cinco temas, com resumo, figura e para que serve: são 25 resumos navegáveis, e o download do PDF fica numa caixa acima, com título e data. Os cartões dizem o limite de cada estudo, como “ainda sem resultado medido”.

        Estudos

        Resumos de cinco relatórios sobre a moda brasileira: sustentabilidade, tendências tecnológicas, acordo Mercosul-UE, cadeia de valor e análise setorial. Cada um pode ser baixado em PDF.

        Sustentabilidade, Circularidade e ESG: Indústria da Moda BrasileiraJulho | 2026
        Baixar Documento

        Brasil e a transição sustentável

        Onde a moda entra na estratégia de transição do Brasil?

        O estudo situa a transição da moda nas políticas públicas do país, na energia renovável que o Brasil já tem e nas linhas de financiamento disponíveis.

        Temas principais
        • Plano de Transformação Ecológica
        • Powershoring e neoindustrialização
        • PNRS e Estratégia Nacional de Economia Circular
        • Taxonomia Sustentável Brasileira
        O que o estudo destaca
        • Economia circular, desenvolvimento regional, dados e financiamento aparecem amarrados na mesma estratégia.
        • Políticas e instrumentos entram como contexto da transição do setor.
        Plano de Transformação Ecológica
        PTEestratégia nacional de desenvolvimento
        Finanças Sustentáveis
        Adensamento Tecnológico
        Bioeconomia
        Transição Energética
        Economia Circular"eixo central desta mudança"
        Infraestrutura Verde
        > 85%da matriz elétrica é renovável (EPE), a base do powershoring
        R$ 179 bimobilizados para a transição via Fundo Clima (BNDES) e Eco Invest Brasil

        Fonte: Relatório Sustentabilidade, Circularidade e ESG (jul. 2026), pp. 16, 20 e 23.

        Para que serve

        Situa a moda na agenda nacional de transição. O que aparece aqui são diretrizes e planos, ainda sem resultado medido.

        Reprodução do bloco Estudos. As abas trocam o relatório e a lista troca o tema; o download abre o arquivo real em nova aba.

        Ver na página real

        O que a página entrega e o que levo

        A diretoria do SEBRAE aprovou a página em apresentação em São Paulo, em 13/10/2026 (retorno oral repassado pelo CEO e pelo diretor da TD Business). Ela entrega o observatório da Moda, de todas as UFs e municípios, numa página só.

        O que levo: tratar a fidelidade ao que dá para implementar como critério de qualidade. Um desenho que a plataforma não publica não é uma entrega.

        Uso desde o lançamento

        Números aproximados de um relatório do SEBRAE. Exploração, aqui, é a sessão que usou filtros, territórios ou perguntas. Leitura minha: cerca de 7 em cada 10 sessões não usam os controles, então o contexto e as perguntas do topo são o que a maioria lê. Isso é coerente com abrir pela pergunta, mas não prova a decisão: os números medem uso, não compreensão, e não há linha de base.

        • cerca de 4.800sessões na página da Moda
        • 28%das sessões usaram filtros, territórios ou perguntas
        • 4,5%das sessões baixaram um estudo

        Por trás do trabalho

        Relato oral, sem registro escrito

        Acompanhei por Google Meet a apresentação privada de 13/10; o CEO e o diretor da TD Business repassaram o retorno como “sucesso total”.

        Ver na página real

        O resto da página real, frame a frame

        Cada bloco restante da página real, reproduzido em um frame, mais o antes e depois e a divisão de autoria. Abra só o que quiser conferir.

        Cada pergunta traz o próprio gráfico

        Em “O setor da moda no Brasil”, o tema só filtra as perguntas. É a pergunta que troca o gráfico, os números e a leitura. As respostas comparam a moda com o total do país: em 2025, a moda era 6,1% das empresas ativas abertas e 3,9% do emprego formal.

        No comércio exterior, a Ásia aparece em dois níveis: por ano ou por mês e, depois, país a país. Clicar em um país abre os produtos que o Brasil importa dele. Em produtos, exportação e importação ficam em lados opostos do zero, ordenadas pelo saldo.

        O setor da moda no Brasil

        A moda no país inteiro, com dados oficiais. Escolha um tema (empresas, emprego ou comércio exterior) e uma pergunta. Cada resposta traz os números principais, uma leitura curta e a evolução do setor nos últimos anos.

        Tema

        Empresas de moda ativas no Brasil

        • 241,1 mil

          empresas ativas abertas em 2025

        • 69,9%

          das abertas em 2025 são do comércio de moda

        O número de empresas de moda ativas abertas por ano multiplicou-se por cerca de 4,6 entre 2015 (51.883) e 2025 (241.112). Das abertas em 2025, 69,9% são do comércio de moda, 27,2% da indústria e 2,9% dos serviços.

        Dados fornecidos por Receita Federal.

        Empresas ativas por ano de abertura, por subsegmento

        Empresas ativas por ano de abertura, por subsegmentoComércio de moda: 36 mil em 2015 e 169 mil em 2025; Indústria da moda: 14 mil em 2015 e 66 mil em 2025; Serviços da moda: 1 mil em 2015 e 7 mil em 2025.050 mil100 mil150 mil200 mil20152016201720182019202020212022202320242025169 mil66 mil7 mil

        Reprodução do bloco “O setor da moda no Brasil”. Tema e pergunta trocam a resposta. Os gráficos mostram detalhes ao passar o mouse, tocar ou usar as setas, e alguns têm seletor de ano ou de medida; nos países asiáticos, clicar em um país abre os produtos dele.

        Ver na página real
        Exportações: quatro perguntas sobre o mesmo recorte

        A seção explica o termo difícil antes dos números: o valor FOB tem uma definição fixa no topo. Quatro perguntas (quanto exportou, mês a mês, quais municípios, quais produtos) trocam gráfico, números e texto, e cada uma traz dois números e um parágrafo calculado, como a variação sobre o ano anterior ou a concentração dos cinco maiores.

        UF, município e produto valem para as quatro perguntas. Subsegmento e CNAE não valem aqui, porque a base de comércio exterior não registra a atividade da empresa. Em municípios, o filtro não esconde a lista: destaca o município escolhido no ranking do estado.

        Exportações

          Carregando as exportações.

          Reprodução do bloco Exportações. UF, município, capítulo e posição do produto, pergunta e medida trocam o resultado; no mapa e no ranking, clicar destaca um município. Dados ao vivo da API pública e do IBGE.

          Ver na página real
          Atendimentos: o alcance do SEBRAE na moda

          A seção usa os mesmos quatro filtros e organiza as perguntas por tema: geral, atividades, temas e municípios. A medida alterna entre atendimentos e clientes atendidos.

          No mapa, cada município mostra a cobertura: clientes atendidos sobre empresas ativas. É uma leitura de alcance, não só uma contagem.

          Atendimentos SEBRAE

                Tema

                Atendimentos SEBRAE à moda por ano

                Reprodução do bloco Atendimentos SEBRAE, com a barra de filtros dele. Tema, medida, pergunta, ano e nível geográfico trocam o resultado. Dados ao vivo da API pública.

                Ver na página real
                Um calendário que não inventa datas

                O calendário de Eventos abre no mês atual. A cor da barra separa o evento com data de 2026 publicada do evento que só tem a data da edição anterior. Quem não tem dia publicado fica numa caixa à parte, em vez de ocupar um dia inventado.

                Eventos

                Feiras, semanas de moda, salões e congressos do setor, no Brasil e no exterior. Troque o mês no calendário, passe o mouse sobre um evento para ver os detalhes e clique nele para abrir o site oficial.

                Outubro de 20264 eventos em outubro
                DOMSEGTERQUAQUISEXSÁB
                27282930123
                45678910
                11121314151617São Paulo Fashion WeekData de 2026 publicadaSão Paulo Fashion WeekData13 a 18 de outubro de 2026ObservaçõesConvênio com NA via PatrocinioSitespfw.com.brClique no evento para abrir o site oficial ↗Congresso AbitData da edição 2025 · 2026 não confirmadaCongresso AbitData14 e 15 de outubro de 2026 (edição anterior)ObservaçõesConvênio com NA via Abit / Ativação via POLOEvento sem site oficial informado
                18192021222324São Paulo Fashion WeekData de 2026 publicadaSão Paulo Fashion WeekData13 a 18 de outubro de 2026ObservaçõesConvênio com NA via PatrocinioSitespfw.com.brClique no evento para abrir o site oficial ↗ONDM - O negócio da ModaData de 2026 publicadaONDM - O negócio da ModaData20 a 22 de outubro de 2026ObservaçõesBalneario CamboriuSitejasper.com.brClique no evento para abrir o site oficial ↗Minas Trend - Ed. Outono/InvernoData de 2026 publicadaMinas Trend - Ed. Outono/InvernoData21 a 23 de outubro de 2026ObservaçõesConvênio com NA via AbitSiteminastrend.com.brClique no evento para abrir o site oficial ↗
                25262728293031
                1234567
                Data de 2026 publicadaData da edição 2025 (2026 ainda não confirmada)Hoje
                Eventos sem data publicada (4)

                Reprodução do bloco Eventos. Troque o mês e passe o mouse ou foque uma barra para ver o evento; a barra abre o site oficial. Em tela estreita há uma lista do mês, que o site real não tem.

                Ver na página real
                No CMS, o detalhe virou ficha no lugar de modal

                O app React de agosto, anterior ao CMS, já era uma página única com âncoras. Nos protótipos de setembro e outubro, o detalhe da UF ainda abria em modal. Na página publicada, virou uma ficha no próprio lugar, controlada por filtros.

                Protótipo com identidade própria

                Protótipo do observatório com identidade visual própria: fundo escuro, título Moda no Brasil e botão rosa Explorar os dados

                Página publicada no CMS

                Página Moda no Brasil publicada no CMS, com o título sobre foto, a faixa de navegação e o texto A moda vai muito além da roupa

                À esquerda, o app React de agosto, anterior ao CMS, com identidade própria. À direita, a página no ar, feita com os recursos do CMS.

                Quem fez cada parte

                A plataforma é da Datawheel. A experiência, o desenho da página e a escolha dos filtros são meus. O conteúdo é dos economistas e do analista de dados, a implementação no CMS é do dev fullstack e a coordenação é do gerente de projeto.

                Fiz os protótipos com Claude Code e o Claude Product Studio. As imagens do site foram geradas no ChatGPT.

                Próximo case

                Nexo Quality

                Duas aprovações para decisões sensíveis, em uma plataforma com sete papéis de usuário.

                Atuação: Product Designer

                Web · Projeto conceitual · Empresa fictícia

                Limite: avaliado com IA e 12 cenários, sem usuários reais.

                Tela de um caso de não conformidade no Nexo Quality, em modo escuro