Ir para o conteúdo

CHAT PARA DESENVOLVEDORES

UI kits de chat que se encaixam no seu produto.

Comece com listas de conversas conectadas, visualizações de mensagens e editores de mensagens. Personalize a interface com componentes específicos da plataforma e pontos de personalização compatíveis.

Mensagens dentro do seu aplicativo, de acordo com sua marca e suas regras de negócio.

Sua marca em todas as conversasInterface ilustrativa do aplicativo

RECURSOS DO PRODUTO

Mensagens criadas em torno do seu produto.

Veja como listas de conversas, visualizações de mensagens e editores funcionam em conjunto e onde aplicar o estilo e as mensagens personalizadas do seu produto.

Monte as telas de conversa

Crie a partir de componentes conectados de conversa e mensagem e escolha o layout e a navegação ao redor. Os módulos disponíveis variam conforme a plataforma e a versão do UI Kit.

Início rápido do React UI Kit

Adapte o estilo visual

Use as APIs de temas e extensões compatíveis para integrar o chat ao seu sistema visual. Após a personalização, valide o contraste, as mensagens longas, os estados de carregamento e o comportamento do layout.

Início rápido do React UI Kit

Adicione recursos de mensagens ao seu produto

Crie um renderizador personalizado para uma reserva, um pedido ou uma atividade. Mantenha o estado real da transação e a autorização das ações no backend responsável por esse fluxo de trabalho.

Guia de mensagens personalizadas para React

Conecte a navegação e o estado de mensagens não lidas

Conecte a caixa de entrada à navegação e às notificações do seu aplicativo. Teste as conversas selecionadas, os caminhos de retorno, as mudanças de conta e os links diretos das notificações em todas as plataformas de destino compatíveis.

API do componente React ConversationList

Integre conteúdo multimídia enriquecido à conversa

Comece com os componentes compatíveis de mensagens de imagem, arquivo e áudio. Permita que os usuários visualizem o conteúdo antes do envio e facilite a abertura dos anexos; configure os limites de upload e as permissões nativas da sua plataforma.

API de mensagens JavaScript

Mantenha as conversas em grupo organizadas

Use os componentes de grupos e membros da sua plataforma para apresentar detalhes da conversa e informações sobre a participação no grupo. Conecte ações como entrar, convidar e sair ao modelo de grupo e às regras de acesso exigidas pelo seu produto.

Escolha o tipo certo de grupo do Chat

A disponibilidade varia conforme o SDK, a edição e o plano de serviço. Consulte os planos do Chat e os limites de recursos ↗

POKEKARA · ENTRETENIMENTO SOCIAL

Crie interações em torno da experiência ao vivo.

O caso da Pokekara com o Tencent RTC reúne karaokê, salas ao vivo e mensagens sociais. Ele apresenta uma oferta de integração que inclui a Chat API e UI Kits prontos.

  • Chat integrado a uma experiência de entretenimento
  • Componentes para uso conjunto com serviços de áudio e vídeo
Leia a história do cliente Caso publicado com vários produtos; o artigo não informa qual framework de UI Kit foi usado.

POR QUE A TENCENT RTC

Uma interface pronta ainda precisa ser integrada ao produto.

Um Chat UI Kit pode reduzir o trabalho de desenvolvimento de componentes, mas seu aplicativo ainda precisa fornecer identidades de usuário autenticadas, permissões de conversa, navegação e regras de negócio. Comece pelo guia da plataforma correta e verifique as dependências antes de definir o escopo da integração.

Comece com componentes conectados

Listas de conversas, visualizações de mensagens e campos de composição já estão conectados ao estado do Chat. Isso pode reduzir o trabalho de integração da interface que sua equipe precisa implementar.

Faça o produto parecer realmente seu

APIs de temas e extensões específicas para cada plataforma permitem criar chats com a identidade da marca e apresentar mensagens próprias do aplicativo sem exigir uma área de chat separada.

Escolha quanto da interface pretende adotar

Selecione os componentes compatíveis com sua plataforma ou use o Core SDK nas áreas que exigem controle total da UI. Analise o escopo dos componentes antes de estimar o trabalho de desenvolvimento.

Explore o produto Chat completo e seus recursos ↗

EXPERIMENTE

Veja como é a experiência da conversa.

Altere o tema e adicione uma mensagem nesta pré-visualização da interface local. Depois, abra a demonstração oficial do Chat para explorar as mensagens conectadas usando uma conta de teste.

Esta prévia usa estado local e participantes fictícios. Ela não se conecta ao Tencent RTC nem envia mensagens para outras pessoas.

Personalize a pré-visualização
Iris MorganConversa fictícia

O layout revisado do estúdio está pronto para análise.

Enviar ↑

Local UI preview · no message is sent to a service

DA AVALIAÇÃO À INTEGRAÇÃO

Conecte o Chat ao seu aplicativo.

Comece pelo guia de início rápido do selected platform e, em seguida, adicione a autenticação e o comportamento de mensagens necessários para a sua aplicação.

  1. 01

    Selecione um framework

    Escolha React, React Native, Flutter, iOS ou Android e consulte o guia de integração atual.

  2. 02

    Instale e autentique

    Configure as dependências documentadas e conecte a UI às credenciais do Chat emitidas pelo servidor.

  3. 03

    Personalize e valide

    Adapte o tema e a navegação, adicione mensagens personalizadas e teste o comportamento em dispositivos reais.

ANTES DE DESENVOLVER

Perguntas frequentes sobre Chat UI Kits

Respostas para equipes de produto e engenharia.

Um UI Kit de chat é apenas um modelo visual?

Os Tencent RTC UI Kits incluem componentes integrados às funcionalidades do Chat. Eles ainda exigem uma aplicação, autenticação, configuração e as dependências relevantes do SDK e da plataforma nativa.

Qual UI Kit de chat devo usar com React?

Use o React UI Kit para interfaces web. O React Native tem um pacote separado e requer uma configuração nativa para aplicações móveis; os dois métodos de integração não são intercambiáveis.

Posso usar apenas parte do UI Kit?

Os módulos e pontos de extensão disponíveis variam conforme a plataforma. Consulte a documentação atual para selecionar componentes ou substituir partes da experiência.

Posso usar minha própria UI?

Sim. Escolha o Core Chat SDK para criar uma tela totalmente personalizada e use as APIs de servidor nas operações de backend.

A pré-visualização se conecta ao Tencent RTC?

A prévia na página demonstra o comportamento local da UI com participantes fictícios. Abra a demonstração oficial do Chat para avaliar o produto conectado.

Como escolher entre um UI Kit e o Core SDK?

Use um UI Kit quando os componentes conectados e os pontos de extensão forem adequados ao produto. Escolha o Core SDK quando precisar de controle total sobre a renderização de mensagens, a navegação e as interações; compare com as telas reais que teria de implementar por conta própria.

Como personalizar um UI Kit de chat para meu aplicativo?

Escolha temas e pontos de extensão documentados para a plataforma. Teste mensagens personalizadas, navegação e estado não lido com o Chat SDK inicializado.

Qual UI Kit de chat funciona com React Native ou Flutter?

Essas plataformas têm pacotes e configuração nativa separados. Siga o guia correspondente, sem reutilizar componentes React Web nem assumir APIs de extensão idênticas.

PLANEJE SUA INTEGRAÇÃO

Vamos falar sobre
sua integração com o Chat.

Converse com a equipe da Tencent RTC sobre sua plataforma, seu mercado-alvo, a estimativa de usuários ativos mensais e seu cronograma de lançamento.

Adequação técnicaEscopo da migraçãoUso e preços

Conte-nos suas necessidades.

Receba ajuda para definir o escopo da experiência de mensagens e da integração necessária para sua equipe.

Fale com nossa equipeContinue para o formulário oficial de contato da Tencent RTC.
Comece a desenvolver com o Chat ↗