Pular para o conteúdo principal

Status: Approved · v2.1 · SPEC-UX-HOME-001

depends_on: SPEC-DOMAIN-FEED-001, SPEC-UX-SHELL-001

used_by: IS-MVP-11.1, IS-MVP-11.3, IS-MVP-19.28

Home, feed e descoberta

Home deve parecer um produto esportivo editorial, com feed útil e controlado, não um mural infantil ou dashboard genérico.

Objetivo

Home deve parecer um produto esportivo editorial, com feed útil e controlado, não um mural infantil ou dashboard genérico.

Pontos de entrada

  • Aba Início.
  • Retorno pós-login.
  • Notificação que abre um post.

Hierarquia da tela

  1. Header simples com marca/saudação contextual e ações mínimas.
  2. Card Minha Gestão para gestores, acima do feed e recolhível.
  3. Feed de posts oficiais, resultados, próximos jogos, rankings e cards de plataforma.
  4. Paginação/infinite scroll controlado.

Componentes e comportamento

Management Card

Entidades agrupadas em Times, Campeonatos, Torcidas, Campos e Serviços. Sem KPIs inventados.

A composição T2 usa o crest real de cada ManagedEntitySummaryDto quando disponível e o IdentityMark canônico com iniciais quando ausente. O fallback neutro não autoriza criar escudo, mapear entidade por nome ou embutir base64. Cada chip preserva nome e rota reais e pode apresentar ícone semântico do tipo somente quando vier do catálogo visual aprovado.

Feed Card

Entidade, timestamp, tipo, conteúdo, motivo e ações Compartilhar/Denunciar/Abrir.

A anatomia T2 é obrigatória: identidade visual da entidade, nome + badge de tipo/fonte, timestamp, menu de controles, conteúdo editorial, motivo e faixa de ações. entityCrest deve ser renderizado quando presente; quando ausente, IdentityMark fornece iniciais. Reduzir essa anatomia a uma sequência de textos não constitui adaptação válida do protótipo.

Cards match_result e upcoming_match usam projeção estruturada de mandante, visitante, placar ou VS, status e identidade dos participantes. A tela não pode analisar title para reconstruir o placar. Até a projeção estruturada estar disponível, o fallback textual continua funcional e é marcado como degradação explícita, não como paridade visual concluída.

Reason Sheet

Explica “porque você torce”, “porque segue”, “do seu distrito” ou “ranking relevante”.

Platform Card

Visual editorial distinto, frequência 5–8 posts e fonte RaizFC.

Controls

Ocultar post, silenciar 7/30/até reativar, deixar de seguir/torcer.

Compartilhar, Denunciar e Abrir são três affordances distintas no próprio card. Abrir a entidade ou o post não substitui Compartilhar ou Denunciar. Web usa Web Share com fallback de cópia/URL; mobile usa o compartilhamento nativo. Denunciar preserva AuthIntent para visitante e a rota canônica de denúncia para sessão autenticada. Nenhuma dessas ações pode ser um handler vazio.

Ações do usuário

AçãoPré-condiçãoResultadoFalha/alternativa
Abrir entidadePúblicoPáginaUnavailable
CompartilharPúblicoCard/linkFallback
OcultarAutenticadoRemove itemUndo temporário
SilenciarAutenticadoAtualiza feedEscolha duração
Aprovar suggestionGestor em contextoPublicaConflito/status

Estados obrigatórios

EstadoRepresentaçãoAção disponível
LoadingSkeleton editorial
Empty new userConvites para seguir times/territórioBuscar
Empty filteredExplica preferências/mutesRevisar
Partial errorFeed continua com avisoRetry
EndMensagem discretaVoltar ao topo

Autenticação e permissões

  • Feed personalizado exige login.
  • Posts públicos podem ser vistos em páginas sem login.
  • Minha Gestão depende de membership.

Responsividade

  • Mobile feed de uma coluna.
  • Desktop centraliza feed e pode usar aside de contexto, sem virar dashboard.
  • Cards preservam proporção e densidade.

Acessibilidade

  • Ordem semântica.
  • Menu acessível.
  • Mídia com alt/caption.
  • Autoplay inexistente no MVP.

Eventos de produto e observabilidade

  • home_viewed
  • feed_post_opened
  • feed_reason_opened
  • post_hidden
  • entity_muted
  • management_card_opened

Dados e endpoints

  • GET /feed.
  • GET /management/my-entities.
  • POST hides/mutes.
  • GET suggestions para contexto de gestão.

Critérios de aceite

  • Feed controlado e profissional.
  • Sem posts livres/reactions.
  • Minha Gestão simples.
  • Motivo explicável.
  • Controles persistentes.
  • Identidade, badges, hierarquia e ações do T2 permanecem reconhecíveis nos quatro modos.
  • Escudo ausente usa fallback canônico; escudo presente nunca é descartado pela tela.
  • Compartilhar, Denunciar e Abrir funcionam diretamente em cada card aplicável.
  • Resultado/próximo jogo não depende de parsing de texto para sua composição esportiva.

Pós-MVP

  • Reações, comentários, salvar e recomendação avançada.

Decisões registradas

  • Home é feed.
  • Ranking e jogos podem entrar como cards.
  • Minha Gestão recolhe no scroll.

Machine summary

spec: SPEC-UX-HOME-001
screen_or_flow: Home, feed e descoberta
required_states:
- loading
- success
- empty
- error
must_use:
- contracts
- service
- hook
- design_tokens
must_not:
- direct_fetch
- direct_fixture_import
- hardcoded_brand_colors