Novidades

Architecting the Agentforce Experience Layer: React on Salesforce and Headless 360
Architecting the Agentforce Experience Layer: React on Salesforce and Headless 360

How the Summer ’26 release separates AI logic from the UI, allowing developers to build once and deploy natively across Slack, WhatsApp, and custom React frontends.

The Omnichannel AI Bottleneck

If you have spent the last two years building AI agents and enterprise chatbots, you are painfully aware of the “omnichannel bottleneck.”

Historically, deploying an intelligent agent required tightly coupling the AI’s reasoning logic with the presentation layer. If you wanted your AI to assist customers on your community portal, you built a Lightning Web Component (LWC). If you wanted that same agent to assist internal employees in Slack, you had to write a custom Slack app, manually format JSON for the Slack Block Kit, and manage external authentication. If you wanted it on WhatsApp, you wired up an external API.

Every time a business rule changed, you had to update three separate codebases. It was inefficient, brittle, and scaled terribly.

At TrailblazerDX 2026 and rolling out in the Summer ’26 Release, Salesforce fundamentally solved this architectural flaw by introducing the Agentforce Experience Layer as part of the broader Headless 360 initiative. Combined with the groundbreaking Salesforce Multi-framework Beta (which allows native React hosting on Salesforce), the way we build user interfaces for AI has changed forever.

This technical deep dive explores how the Experience Layer abstracts UI, how to write deterministic Agent Scripts, and how to deploy a native React component powered by GraphQL inside Salesforce.


The Agentforce Experience Layer: Abstracting the Interface

The Agentforce Experience Layer is a new UI service that separates what an agent does from where the interaction shows up.

The mantra is simple: Build once, render everywhere.

You define your agent’s business logic, tools, and topics centrally on the Agentforce 360 Platform. When the agent decides to present a user with a dynamic list of records or a confirmation button, it does not send HTML or LWC markup. It sends a semantic “Intent Payload.”

The Experience Layer sits between the agent and the client. It acts as a real-time translation engine:

  • If the user is on Slack, the Experience Layer translates the intent into Slack Block Kit components.
  • If the user is on Microsoft Teams, it translates it into Adaptive Cards.
  • If the user is connecting via an external LLM client (like ChatGPT or Claude Code via the Model Context Protocol – MCP), it translates it into structured tool-call JSON.

The interface is no longer the product; the underlying data and business logic are the product. Your UI becomes fully portable.


Native React on Salesforce: The Multi-Framework Beta

Perhaps the most shocking developer announcement of 2026 is the Salesforce Multi-framework Beta. For over a decade, if you wanted to build native UIs on Salesforce, you used Visualforce, Aura, or LWC.

Now, the Experience Layer allows you to build AI agents and apps using industry-standard UI frameworks like React, running natively on the Agentforce 360 Platform. You can bring your own component libraries (like Material-UI or Tailwind) while maintaining strict Salesforce governance.

Data Fetching with GraphQL

Because you aren’t using @wire adapters in React, data retrieval and mutation are handled via the highly optimized Salesforce GraphQL API.

Here is a practical example of a custom React widget built to interface with an Agentforce Subagent. Notice how we use the new @salesforce/agentforce-react library to seamlessly trigger server-side agentic logic.

import React, { useState } from 'react';
import { useQuery, gql } from '@salesforce/graphql';
import { useAgentAction } from '@salesforce/agentforce-react';

// 1. Fetch live context securely via GraphQL
const GET_ACCOUNT_CONTEXT = gql`
  query getAccount($id: ID!) {
    uiapi {
      query {
        Account(where: { Id: { eq: $id } }) {
          edges {
            node {
              Id
              Name
              Risk_Score__c { value }
            }
          }
        }
      }
    }
  }
`;

export default function AccountRiskWidget({ recordId }) {
    const { data, loading, error } = useQuery(GET_ACCOUNT_CONTEXT, { variables: { id: recordId } });
    
    // 2. Hook into the Agentforce Experience Layer
    const { executeAction, isExecuting } = useAgentAction('Agentforce_Escalation_Subagent');

    if (loading) return <div className="spinner">Loading context...</div>;
    if (error) return <div className="error">Error loading data.</div>;

    const account = data.uiapi.query.Account.edges[0].node;

    const handleEscalate = async () => {
        // 3. Trigger headless agent logic deterministically 
        await executeAction({ 
            contextId: account.Id, 
            intent: 'ESCALATE_HIGH_RISK',
            channel: 'REACT_CUSTOM_UI'
        });
    };

    return (
        <div className="p-4 border rounded-lg shadow-md bg-white">
            <h3 className="text-lg font-bold">{account.Name.value}</h3>
            <p className="text-gray-600">Calculated Risk Score: {account.Risk_Score__c.value}</p>
            
            {account.Risk_Score__c.value > 80 && (
                <button 
                    className="mt-4 px-4 py-2 bg-red-600 text-white rounded hover:bg-red-700"
                    onClick={handleEscalate} 
                    disabled={isExecuting}
                >
                    {isExecuting ? 'Agent Orchestrating Escalation...' : 'Trigger Autonomous Escalation'}
                </button>
            )}
        </div>
    );
}

Because this React app is anchored in the Agentforce 360 platform, it automatically inherits your user’s existing profile permissions, sharing rules, and Field-Level Security (FLS). It is not an external security risk; it is a governed extension of your CRM.


Controlling the Chaos: Enter Agent Script

Giving an LLM the ability to render dynamic UI components across multiple channels sounds incredibly risky. What if the model hallucinates a UI state?

To solve this, Salesforce introduced Agent Script, a domain-specific language for defining agent behavior deterministically.

Autonomous systems in enterprise environments require predictability. While you want the LLM to understand the natural language of the user, you do not want the LLM guessing the next business step.

Agent Script combines natural language instructions with programmatic, deterministic expressions. It allows you to strictly define transitions and state management.

// Example: Escalation_Subagent.agentscript

subagent "Risk_Escalation" {
    description: "Handles account risk escalations from any Experience Layer surface."
    
    // Deterministic state transition
    on_intent "ESCALATE_HIGH_RISK" {
        validate_state {
            require_field: "Account.Risk_Score__c", operator: ">", value: 80
            on_fail: return_error("Risk score is below escalation threshold.")
        }
        
        execute_action "Create_Swarm_Channel" {
            tool: mcp.slack.create_channel
            payload: {
                name: "escalation-${Account.Id}",
                invite: ["Risk_Team_Group"]
            }
        }
        
        // The Experience Layer handles rendering this dynamically to the user's current surface
        render_experience {
            component: "Success_Confirmation_Card"
            data: { message: "Escalation initiated. The Risk team has been notified in Slack." }
        }
    }
}

By writing Agent Scripts, you move workflows from probabilistic LLM reasoning to guaranteed, governed results.


Prototyping the Future: Agentforce Labs

If you are eager to test these capabilities, you don’t need to wait for a full production rollout. Salesforce recently launched Agentforce Labs (labs.agentforce.com).

Agentforce Labs is the new experimental hub where Salesforce Product and Engineering teams ship cutting-edge prototypes, open-source AI tools, and early-stage agentic capabilities. Available natively in Summer ’26 Developer Edition orgs, Labs gives you instant, sandbox-free prototyping. You can spin up an agent, connect it to your IDE via MCP servers, and test the Multi-framework React capabilities without complex infrastructure provisioning.


Impact for Companies and Developers

The Agentforce Experience Layer marks the end of siloed UI development.

For Developers: You no longer need to learn the proprietary syntax of Slack Block Kit, MS Teams Adaptive Cards, or various chatbot APIs. You write the logic once using Agent Script and Apex, and allow the platform to handle the cross-channel translation. Furthermore, the ability to use React and GraphQL opens Salesforce up to a massive global talent pool of frontend engineers.

For Architects & Security Teams: The Experience Layer resolves the shadow-IT problem of AI. Because external surfaces interact with Salesforce via the Experience Layer, all actions pass through the Salesforce Trust Layer. Audit trails, FLS, and sharing rules are enforced implicitly, regardless of whether the agent is triggered from a mobile app, a React dashboard, or an external instance of Claude.

Conclusion

The “Headless” era of Salesforce has arrived. By decoupling what an agent does from how it appears, the Agentforce Experience Layer allows enterprises to scale their AI strategies exponentially. Combined with deterministic Agent Scripts and the flexibility of native React hosting, the Salesforce platform has evolved into a true omnichannel orchestration engine.

Your Next Step: Log into your Trailblazer account and head to labs.agentforce.com. Spin up the Multi-framework playground, deploy your first React widget using GraphQL, and watch as your business logic renders seamlessly across multiple simulated environments. The interface is dead; long live the Experience Layer.

Claude Fable e o Futuro do Salesforce Flow: Como Modelos de IA Estão Redefinindo Automação na Plataforma
Claude Fable e o Futuro do Salesforce Flow: Como Modelos de IA Estão Redefinindo Automação na Plataforma
Salesforce e Databricks unem forças para governança de agentes de IA com dados confiáveis
Salesforce e Databricks unem forças para governança de agentes de IA com dados confiáveis
Salesforce adquire plataforma de IA Fin por $3,6 bi: O que isso significa para o ecossistema
Salesforce adquire plataforma de IA Fin por $3,6 bi: O que isso significa para o ecossistema

Tableau

Tableau MCP: como agentes de IA se tornam especialistas em dados com Model Context Protocol
Tableau MCP: como agentes de IA se tornam especialistas em dados com Model Context Protocol

A Salesforce anunciou o Tableau MCP como parte da release Summer ’26, uma integração que utiliza o Model Context Protocol para permitir que agentes de IA acessem diretamente o motor de analítica do Tableau. Essa novidade representa um avanço significativo na forma como empresas conectam inteligência artificial aos seus dados de negócio, eliminando a barreira que historicamente separava LLMs de informações analíticas confiáveis.

Até pouco tempo atrás, modelos de linguagem generativos enfrentavam uma limitação fundamental: eles simplesmente não conseguiam acessar dados analíticos empresariais em tempo real. Essa desconexão resultava em respostas genéricas, superficiais e, em muitos casos, incorretas quando o assunto envolvia métricas específicas de negócio. Com o Tableau MCP, esse cenário muda radicalamente.

O problema que o Tableau MCP resolve

Imagine o seguinte cenário: você pergunta a um assistente de IA qual foi a receita da região Sudeste no último trimestre. Sem integração analítica, o modelo pode inventar números, fornecer dados desatualizados ou simplesmente informar que não possui essa informação. Nenhuma dessas opções é aceitável para um ambiente empresarial.

Segundo dados da própria Salesforce, cerca de 80% dos líderes seniores de TI acreditam que a inteligência artificial generativa ajudará suas organizações a fazerem melhor uso dos dados. Contudo, 41% desses profissionais relata que não conseguem compreender seus dados porque são complexos demais ou pouco acessíveis. Um terço aponta a incapacidade de gerar insights como um problema crítico.

O Tableau MCP ataca exatamente esse ponto de dor. Ele permite que agentes de IA consultem diretamente o motor de consulta do Tableau, obtendo respostas fundamentadas no contexto analítico real da empresa — e não em suposições ou dados treinados.

O que é Model Context Protocol (MCP)?

O Model Context Protocol é uma especificação aberta desenvolvida para padronizar a comunicação entre modelos de linguagem e fontes de dados externas. Pense nele como um tradutor universal que permite que qualquer LLM converse com qualquer sistema de dados de forma segura e estruturada.

No contexto do Tableau, o MCP funciona como uma ponte entre o agente de IA e o servidor analítico. Quando você faz uma pergunta em linguagem natural, o protocolo traduz essa consulta para o formato que o Tableau compreende, executa a análise nos dados reais e retorna a resposta fundamentada — tudo isso em segundos.

<span class="line"><span style="color: #676e95;"># Fluxo simplificado da consulta via Tableau MCP</span></span>
<span class="line"><span style="color: #f78c6c;">1.</span><span style="color: #babed8;"> Usuário pergunta: "Qual o ticket médio por região?"</span></span>
<span class="line"><span style="color: #f78c6c;">2.</span><span style="color: #babed8;"> Agente de IA envia consulta via MCP</span></span>
<span class="line"><span style="color: #f78c6c;">3.</span><span style="color: #babed8;"> Tableau processa nos dados reais</span></span>
<span class="line"><span style="color: #f78c6c;">4.</span><span style="color: #babed8;"> Resposta fundamentada retorna ao usuário</span></span>
<span class="line"><span style="color: #676e95;"># Sem inventar números. Sem adivinhação.</span></span>Code language: HTML, XML (xml)

Arquitetura técnica: como funciona por dentro

A implementação do Tableau MCP segue uma arquitetura cuidadosamente projetada para manter a segurança dos dados como prioridade máxima. O fluxo funciona da seguinte forma:

1. Camada de Entrada

O agente de IA recebe uma consulta em linguagem natural do usuário. Essa entrada pode vir de qualquer interface: chatbot, Slack, portal do cliente ou até mesmo uma integração customizada via API.

2. Tradução MCP

O protocolo MCP traduz a consulta natural para uma chamada estruturada que o motor do Tableau compreende. Isso envolve mapear entidades, identificar métricas e definir dimensões de análise.

3. Processamento Analítico

O Tableau executa a consulta nos dados reais da empresa, aplicando todas as regras de segurança, filtros de linha e permissões de acesso configuradas. O agente de IA acessa apenas os dados que o usuário final teria permissão para visualizar.

4. Camada de Proteção

Todas as respostas passam pelo Agentforce Trust Layer, que aplica filtros de segurança adicionais, verifica a precisão das informações e garante que nenhum dado sensível vaze para contextos indevidos.

5. Resposta Contextualizada

O agente Formata a resposta final em linguagem natural, adicionando contexto relevante e, quando apropriado, sugestões de próximas análises ou ações recomendadas.

Casos de uso práticos

Vendas e Revenue Operations

Um diretor de vendas pode perguntar ao agente: “Quais foram as oportunidades perdidas na região Norte no último mês e qual o motivo principal?” O Tableau MCP consulta os dados reais do pipeline, cruza com informações de perda e retorna uma análise fundamentada — não apenas números soltos, mas insights com contexto.

Marketing e Performance de Campanhas

Em vez de esperar horas para um analista extrair dados e montar um relatório, o gestor de marketing pode consultar diretamente: “Como está o ROI da campanha de verão comparada com a do ano passado?” A resposta vem em segundos, fundamentada nos dados reais de performance.

Atendimento ao Cliente

Agentes de suporte podem obter respostas instantâneas sobre tendências de problemas: “Houve um aumento anormal de reclamações sobre o produto X na última semana?” Isso permite identificar crises antes que se espalhem.

Executivos e Board Meetings

Líderes podem ter acesso rápido a métricas críticas sem depender de relatórios preparados: “Qual a margem bruta consolidada deste trimestre comparada com as previsões?”

Diferenciais em relação a soluções concorrentes

O Tableau MCP se destaca por três fatores fundamentais:

Primeiro, a segurança integrada. Enquanto outras soluções exigem configurações adicionais de governança, o Tableau MCP herda nativamente todas as políticas de segurança do Salesforce e do Tableau, incluindo filtros de linha por usuário, permissões de campo e auditoria completa.

Segundo, a profundidade analítica. Diferente de connectors superficiais que apenas consultam bancos de dados, o Tableau MCP aproveita todo o poder do motor VizQL do Tableau, incluindo cálculos complexos, agregações pré-definidas e modelos analíticos já curados pelas equipes de BI.

Terceiro, a integração nativa. Não é uma conexão terceirizada ou um bridge improvisado. O Tableau MCP é uma feature first-party da Salesforce, com suporte completo, documentação oficial e roadmap integrado ao ecossistema Agentforce.

Impacto para desenvolvedores e administradores Salesforce

Para profissionais do ecossistema Salesforce, o Tableau MCP abre novas possibilidades de desenvolvimento:

Desenvolvedores podem construir agentes personalizados que consultam dados analíticos do Tableau diretamente em suas aplicações Lightning Web Components, usando MCP como protocolo de comunicação.

Administradores podem configurar quais datasets do Tableau serão expostos aos agentes de IA, mantendo controle granular sobre quais informações são acessíveis.

Arquitetos de solução podem projetar fluxos que combinam dados operacionais do CRM com insights analíticos do Tableau, criando experiências unificadas para usuários finais.

Como habilitar o Tableau MCP na sua organização

A implementação do Tableau MCP segue as melhores práticas de governança do Salesforce. De forma resumida, o processo envolve:

  • Configurar a integração Tableau MCP no painel de administração do Agentforce
  • Definir quais workbooks e data sources estarão disponíveis para consulta via MCP
  • Configurar as políticas de segurança que controlam quais usuários podem acessar quais dados
  • Testar em ambiente de sandbox antes de promover para produção
  • Monitorar o uso e a precisão das respostas através dos logs de auditoria

O futuro dos agentes de IA fundamentados em dados

O Tableau MCP representa mais do que uma nova feature técnica. Ele sinaliza uma mudança de paradigma na forma como as empresas utilizam inteligência artificial. Em vez de assistentes que “acham” respostas baseadas em padrões estatísticos, estamos caminhando para agentes que “sabem” respostas porque consultam os dados reais do negócio.

Para o mercado brasileiro, onde a complexidade fiscal e a diversidade de sistemas legados criam desafios únicos, essa integração pode ser particularmente valiosa. A capacidade de询问 métricas de negócio em tempo real, fundamentadas em dados locais e em conformidade com regulamentações nacionais, representa um salto de produtividade significativo.

A Salesforce reforça que o Tableau MCP foi projetado com princípios de responsible AI. Todas as consultas são auditadas, as respostas passam por camadas de verificação e os dados permanecem protegidos pelo Agentforce Trust Layer.

A pergunta que fica é: sua empresa está pronta para ter agentes de IA que realmente compreendem seus dados?

Salesforce apresenta a próxima geração do Tableau, trazendo IA generativa para dados e análises para todos
Salesforce apresenta a próxima geração do Tableau, trazendo IA generativa para dados e análises para todos

News