Pular para conteúdo

Associação reformulada

Descrição da associação recomendada para o portal do CCB, organizada como direcionamento de experiência, conteúdo, hierarquia e conversão do fluxo público de adesão.

1. Diagnóstico

Papel da associação no portal

A associação deve ser tratada como uma das principais jornadas de conversão do portal. Ela não deve parecer apenas uma página de formulário nem uma sequência administrativa de telas. O fluxo precisa explicar com clareza o valor de se associar ao CCB, reduzir inseguranças do usuário e conduzir a pessoa até a matrícula com o menor esforço cognitivo possível.

A experiência reformulada deve deixar evidente que o usuário está entrando em uma estrutura de apoio autoral e artístico. O visitante precisa entender rapidamente o que recebe ao se associar, quanto paga, quais benefícios passam a valer e quais etapas ainda faltam para concluir o processo.

Problema central do fluxo atual

O fluxo atual concentra informação demais em telas longas e com hierarquia pouco seletiva. A entrada mistura formulário, promoção, mensalidades, benefícios, explicação institucional, orientação para exterior e avisos em uma única sequência extensa. Nas etapas seguintes, o usuário precisa completar dados, criar login, aceitar termos, revisar informações, escolher forma de pagamento das mensalidades e depois seguir para o pagamento da matrícula.

Essa sequência contém todos os elementos necessários, mas eles aparecem com pouca orientação de progresso. O usuário pode entender o que preencher em cada tela, mas não necessariamente compreende bem o caminho completo, a diferença entre matrícula e mensalidade, ou o que acontece depois de enviar a proposta.

2. Oportunidades de Melhoria

Princípio de reformulação

A associação reformulada deve transformar a jornada em um fluxo guiado. Cada etapa deve ter uma função clara, uma ação principal e uma explicação curta sobre o que está sendo decidido naquele momento.

O foco deve ser:

  1. Explicar o valor antes de pedir muitos dados.
  2. Mostrar o progresso do usuário em todas as telas.
  3. Separar benefícios, cadastro, plano e pagamento.
  4. Reduzir textos longos em favor de blocos escaneáveis.
  5. Deixar valores, cobranças e próximos passos sempre visíveis.

3. Proposta de Redesign

Estrutura recomendada do fluxo

O fluxo de associação deve ser organizado em quatro momentos principais:

  1. Entrada e qualificação inicial.
  2. Cadastro e criação de acesso.
  3. Escolha de mensalidade e confirmação da proposta.
  4. Pagamento da matrícula.

Essa estrutura preserva a lógica principal do estado atual, mas apresenta o processo de forma mais orientada. O usuário deve perceber que está avançando por uma jornada única, e não passando por páginas independentes que mudam de assunto a cada etapa.

Primeira etapa: entrada e qualificação

A primeira tela deve funcionar como uma página de conversão curta, com formulário inicial no primeiro bloco e conteúdo de apoio logo abaixo.

O topo da página deve deixar claro:

  1. O que é a associação.
  2. Qual é o principal benefício.
  3. Quanto custa a entrada.
  4. Qual ação inicia o processo.

O formulário inicial deve continuar simples, mas mais organizado. Ele deve permitir escolher o tipo de associado antes dos campos principais:

  1. Compositor.
  2. Banda.
  3. Cantor ou dupla.

Depois da escolha, o formulário deve exibir os campos necessários para aquele tipo de entrada. Para compositores, cantores e duplas, os campos principais continuam sendo nome, CPF e CEP. Para bandas, entram nome da banda, responsável, CPF e CEP.

A opção para residentes no exterior não deve aparecer como link pequeno e isolado. Ela deve ser uma escolha visível dentro do formulário, porque muda a compreensão do CPF, do CEP e do atendimento.

Conteúdo de valor na primeira etapa

Depois do formulário inicial, a página deve explicar os benefícios em blocos objetivos. A promoção atual dos registros grátis deve continuar em destaque, porque é uma oferta forte de conversão, mas precisa aparecer de forma mais direta e menos textual.

Os benefícios podem ser organizados em cards ou lista visual com títulos curtos:

  1. Registros de música inclusos.
  2. Carteira de compositor.
  3. Músicas na rádio e no portal.
  4. Página artística no CCB.
  5. Descontos em serviços.
  6. Suporte para associados.

O texto atual de "Como atuamos" deve deixar de ser um bloco longo e virar uma explicação escaneável. A ideia principal é comunicar que o CCB ajuda na divulgação, na presença pública do artista e no acesso a ferramentas do ecossistema do clube.

Segunda etapa: cadastro e criação de acesso

A segunda tela deve ser percebida como a etapa de completar cadastro, não como uma página longa de formulário. O conteúdo deve ser dividido em seções com títulos claros:

  1. Dados pessoais.
  2. Endereço.
  3. Acesso à Área VIP.
  4. Termos e envio.

O bloco de endereço deve manter a atenção sobre a importância dos dados corretos, mas com tom mais funcional. Em vez de uma mensagem grande e alarmista, a interface deve explicar que a carteira e comunicações dependem do endereço informado.

A criação de login deve ficar associada ao acesso futuro do associado. A tela precisa explicar que e-mail e senha serão usados para entrar na Área VIP, acompanhar serviços e enviar materiais depois da associação.

O aceite dos termos deve ser direto. O botão de leitura dos termos continua importante, mas o usuário não deve se perder entre texto explicativo, modal longo e checkbox. O texto antes do aceite deve ser reduzido para reforçar os pontos essenciais da contratação.

Terceira etapa: proposta validada e mensalidade

A tela de proposta validada deve mudar de uma página de avisos e opções extensas para uma tela de confirmação e escolha.

O primeiro bloco deve resumir os dados do usuário em formato compacto, permitindo que ele confira o essencial:

  1. Nome.
  2. Nome artístico ou banda.
  3. CPF.
  4. Endereço.
  5. Telefone.
  6. E-mail.

Em seguida, a página deve explicar que a proposta foi validada e que o usuário precisa escolher como deseja pagar as mensalidades. A diferença entre matrícula e mensalidade precisa ficar explícita:

  1. Matrícula: pagamento inicial para concluir a associação.
  2. Mensalidade: cobrança recorrente para manter os benefícios ativos.

As formas de mensalidade devem ser apresentadas como opções comparáveis. O cartão recorrente com desconto pode ser destacado como opção recomendada, mas sem esconder boleto mensal, pagamento semestral, pagamento anual ou débito Bradesco.

O botão final deve ter texto específico. Em vez de ENVIAR, a ação deve indicar o próximo passo, como continuar para pagamento da matrícula.

Quarta etapa: pagamento da matrícula

A etapa de pagamento já tem uma estrutura mais clara do que as telas anteriores, porque apresenta resumo da compra e cards de método de pagamento. Ainda assim, ela deve reforçar melhor o contexto da associação.

O resumo deve destacar:

  1. Produto ou serviço: Matrícula CCB.
  2. Valor da matrícula.
  3. Prazo ou orientação de pagamento.
  4. Relação com a mensalidade escolhida na etapa anterior.

Os métodos de pagamento devem ser apresentados em ordem de clareza e uso provável:

  1. Pix ou depósito.
  2. Cartão de crédito.
  3. Boleto bancário.
  4. PayPal para residentes no exterior.

O bloco de segurança deve permanecer, mas com texto mais curto e fácil de ler. Sua função é gerar confiança, não ocupar protagonismo visual.

Indicador de progresso

Todas as etapas devem exibir um indicador de progresso. Esse indicador não precisa ser complexo, mas precisa mostrar claramente onde o usuário está e o que falta.

Uma estrutura recomendada:

  1. Dados iniciais.
  2. Cadastro.
  3. Mensalidade.
  4. Pagamento.

No mobile, esse progresso pode aparecer de forma compacta, como etapa atual e total de etapas. No desktop, pode aparecer como linha horizontal com títulos curtos.

Resumo financeiro persistente

Durante o fluxo, o usuário deve ter acesso a um resumo financeiro simples. Esse resumo deve evitar confusão entre a matrícula e as mensalidades.

O resumo pode apresentar:

  1. Matrícula: R$ 94,00.
  2. Mensalidade padrão: R$ 69,00.
  3. Mensalidade com cartão recorrente: R$ 62,00, quando essa opção estiver disponível.
  4. Benefício promocional: registros inclusos na associação.

No desktop, esse resumo pode aparecer como painel lateral ou bloco de apoio. No mobile, deve aparecer como bloco compacto entre seções ou como resumo antes da ação principal.

Residentes no exterior

A experiência para residentes no exterior deve ser tratada como uma trilha visível desde a entrada. O conteúdo atual já contempla orientações específicas, mas elas aparecem tarde e em formato textual longo.

A reformulação deve prever:

  1. Opção clara Moro fora do Brasil no início.
  2. Explicação curta sobre CPF e documento.
  3. Tratamento específico para CEP ou endereço internacional.
  4. PayPal como método de pagamento associado a esse contexto.
  5. Atendimento especial apresentado como apoio, não como exceção escondida.

Estados de retorno e bloqueio

Os estados em que o CPF já existe, está regular, está isento ou precisa regularizar mensalidade devem ser apresentados como telas de orientação clara.

Cada estado deve conter:

  1. Mensagem principal curta.
  2. Explicação do motivo.
  3. Ação recomendada.
  4. Link ou botão coerente com o estado.

Quando o usuário já estiver regular, a tela deve conduzir para a Área VIP ou para a home com mensagem positiva. Quando houver mensalidade pendente, a tela deve explicar que o usuário precisa regularizar antes de continuar e levar diretamente para a central de pagamento apropriada.

Direção visual

A associação deve usar a mesma direção visual recomendada para o portal, com base azul institucional, superfícies claras, amarelo-dourado como assinatura de destaque e textos com contraste limpo.

O amarelo deve ser usado para chamadas estratégicas, benefícios e informações de valor. Ele não deve aparecer como faixa repetida em excesso, porque isso reduz hierarquia. O azul deve sustentar botões, navegação, títulos estruturais e áreas de confiança.

Os cards devem ser usados para grupos de informação realmente distintos, como benefícios, resumo financeiro, dados revisados e formas de pagamento. A página não deve virar uma sequência de cards pesados para cada pequeno texto.

Direção mobile

No mobile, a prioridade é reduzir rolagem desnecessária e manter a ação principal sempre fácil de encontrar. O conteúdo deve seguir uma coluna única, mas com seções curtas e agrupamento forte.

O menu do portal deve ocupar menos atenção durante o fluxo. A associação precisa parecer um processo em andamento, não uma página pública comum com muitas rotas competindo pelo toque do usuário.

As opções de pagamento e mensalidade devem ser empilhadas, mas cada card precisa ter valor, frequência e ação visíveis sem depender de leitura longa. Os textos explicativos devem aparecer abaixo do título de cada opção, com prioridade para decisão rápida.

4. Recomendações de Conversão

Linguagem dos CTAs

Os botões devem indicar a ação real e o próximo passo. Textos genéricos como ENVIAR devem ser evitados nas etapas principais.

Sugestões de ações:

  1. Começar associação.
  2. Preencher proposta.
  3. Enviar proposta.
  4. Escolher forma de mensalidade.
  5. Continuar para pagamento.
  6. Pagar matrícula.

A linguagem deve ser direta, sem prometer mais do que a etapa entrega. O usuário deve saber se está apenas avançando, enviando dados, escolhendo mensalidade ou entrando no pagamento.

Síntese da associação recomendada

A associação reformulada deve combinar proposta de valor, formulário guiado e pagamento claro. O usuário precisa entender logo no início por que se associar, quais benefícios recebe e quais valores estão envolvidos. Depois disso, cada etapa deve conduzir uma única decisão: informar dados, criar acesso, escolher mensalidade e pagar a matrícula.

O objetivo não é reduzir o fluxo a qualquer custo, mas tornar cada etapa compreensível, confiável e orientada à conversão. A melhor associação para o novo portal é aquela em que o usuário sente que está avançando com segurança, sem precisar decifrar textos longos ou reconciliar informações financeiras espalhadas pela página.

Texto Narrativo e Explicativo

A associação do CCB precisa ser percebida desde a entrada como um processo guiado de adesão, com proposta de valor clara e consequência financeira compreensível. A primeira tela deve explicar rapidamente por que vale a pena se associar, o que o associado passa a receber e qual é a cobrança de entrada, evitando que o usuário descubra valores e regras somente no fim.

Na etapa inicial, a escolha de perfil deve ser tratada como decisão natural da experiência. Compositor, banda, cantor ou dupla precisam ter caminhos de preenchimento coerentes com seus dados. A opção para quem mora fora do Brasil deve aparecer como trilha legítima desde o começo, com orientação de documento e tratamento de endereço compatíveis com esse contexto.

Depois da qualificação inicial, os benefícios precisam ser apresentados de forma escaneável e conectados à decisão de adesão. Registros inclusos, carteira, presença no portal e na rádio, página artística, descontos e suporte devem aparecer como proposta de valor objetiva. A explicação institucional de como o CCB atua deve continuar presente, mas com leitura mais curta e funcional.

A progressão do processo deve ficar clara em quatro momentos: dados iniciais, cadastro completo, escolha de mensalidade e pagamento da matrícula. Em cada etapa, o usuário precisa entender o que está preenchendo, por que aquilo é necessário e qual ação o leva ao próximo passo. O indicador de progresso deve reforçar esse avanço no desktop e no mobile.

Na etapa de cadastro, a organização por blocos deve reduzir esforço e aumentar compreensão. Dados pessoais, endereço, acesso à Área VIP e termos precisam ter hierarquia visual direta. O endereço deve ser tratado como informação crítica para envio e comunicação, com linguagem funcional. A criação de login deve ser apresentada como ativação de acesso contínuo aos serviços do associado.

Na proposta validada, a revisão dos dados deve anteceder a decisão financeira. A distinção entre matrícula e mensalidade precisa ser explícita: matrícula conclui a adesão inicial; mensalidade mantém benefícios ativos. As formas de mensalidade devem ser comparáveis, com valor, frequência e diferença de benefício visíveis, incluindo destaque equilibrado para cartão recorrente sem ocultar as demais opções.

Nos estados de retorno, a interface precisa orientar continuidade sem ambiguidade. CPF regular deve encaminhar para acesso ou continuidade positiva. CPF com condição especial deve explicar regra aplicada e ação recomendada. CPF com pendência deve conduzir à regularização antes de novo avanço. Esse tratamento reduz bloqueio inesperado e melhora confiança no fluxo.

A etapa de pagamento da matrícula deve consolidar entendimento, não apenas cobrar. O resumo precisa mostrar produto, valor e relação com a mensalidade escolhida. Pix/depósito, cartão, boleto e PayPal para exterior devem aparecer como alternativas compreensíveis, com ação específica por método e mensagem de segurança curta, objetiva e proporcional.

No mobile, a experiência deve manter a mesma lógica da versão desktop com blocos curtos, decisões empilhadas e ação principal sempre evidente. Resumo financeiro e progresso precisam continuar visíveis para reduzir rolagem improdutiva e manter previsibilidade até a conclusão.

Com essa leitura, a associação passa a comunicar valor antes de fricção, organiza decisão por etapa e conduz o usuário até o pagamento com clareza de contexto, cobrança e resultado.

Referências cruzadas

  1. Estado atual do fluxo em Interface e Navegacao > Fluxo visual de associacao publica.
  2. Regras de negócio da associação em Regras de Negocio > Associacao.
  3. Direcionamento da home em Home Reformulada.
  4. Direção cromática em Paleta Recomendada.
  5. Direção tipográfica em Tipografia Recomendada.