Rastreamento de funil web para aplicação

Rastreie todo o funil do utilizador -- desde o momento em que alguém chega ao seu website até quando usa a sua aplicação React Native -- tudo num único painel do Flowsery Analytics.

Isto é possível graças à identificação de utilizadores. Quando identifica um utilizador com o mesmo userId tanto no seu website como na sua aplicação, o Flowsery Analytics vincula ambos os perfis de visitante, dando-lhe uma visão unificada da jornada completa.

Como funciona

Um visitante chega ao seu website -- o script de rastreamento do Flowsery Analytics atribui-lhe um visitorId armazenado num cookie
O visitante regista-se ou faz login no seu website -- chama identify com o seu userId (ex.: email)
A mesma pessoa abre a sua aplicação React Native -- o SDK atribui um novo visitorId armazenado no AsyncStorage
Fazem login na aplicação -- chama identify com o mesmo userId
O Flowsery Analytics deteta o userId partilhado e funde ambos os perfis de visitante, criando uma jornada completa entre plataformas

Pré-requisitos

O script de rastreamento do Flowsery Analytics instalado no seu website (começar)
O SDK React Native do Flowsery Analytics instalado na sua aplicação (guia React Native)
Ambos devem usar o mesmo website ID do Flowsery Analytics (flid_***)

Passo 1: Identificar utilizadores no seu website

Quando um utilizador se regista ou faz login no seu website, chame identify:

HTML

// After signup or login on your website window?.flowsery("identify", { userId: user.email, // or any unique ID name: user.name, });

Adicione o snippet de fila no seu <head> para que chamadas identify sejam capturadas mesmo antes do script principal carregar.

Passo 2: Instalar o SDK React Native

Siga o guia de instalação React Native / Expo para adicionar o Flowsery Analytics à sua aplicação. Certifique-se de usar o mesmo website ID que o seu website:

JavaScript

import { FlowseryProvider } from 'flowsery/react-native';
 
export default function RootLayout() {
  return (
    <FlowseryProvider
      config={{
        // Same website ID as your landing page
        websiteId: process.env.EXPO_PUBLIC_FLOWSERY_WEBSITE_ID!,
        domain: process.env.EXPO_PUBLIC_FLOWSERY_DOMAIN!,
        debug: __DEV__,
      }}>
      {/* your app */}
    </FlowseryProvider>
  );
}

Passo 3: Identificar utilizadores na sua aplicação React Native

Quando um utilizador faz login na sua aplicação, chame identify com o mesmo userId que usou no website:

JavaScript

import { useFlowsery } from 'flowsery/react-native';
 
export function useIdentifyUser(user) {
  const client = useFlowsery();
 
  useEffect(() => {
    if (user && client) {
      // Same userId as the website -- this links both profiles
      client.identify(user.email, {
        name: user.name,
      });
    }
  }, [user, client]);
}

Passo 4: Rastrear ecrãs na sua aplicação

Registe visualizações de ecrã para que possa construir funis que abrangem tanto web como mobile:

JavaScript

import { useFlowseryScreen, useFlowseryTrack } from 'flowsery/react-native';
 
export default function HomeScreen() {
  useFlowseryScreen('HomeScreen');
  const track = useFlowseryTrack();
 
  return (
    <Pressable onPress={() => track('upgrade_click', { source: 'home' })}>
      <Text>Upgrade to Pro</Text>
    </Pressable>
  );
}

Construir um funil de conversão multi-plataforma

Quando tanto o seu website como a aplicação estiverem a rastrear eventos e a identificar utilizadores, pode criar um funil de conversão no seu painel do Flowsery Analytics que abranja ambas as plataformas. Por exemplo:

Web -- Pageview em / (landing page)
Web -- Pageview em /pricing
Web -- Objetivo personalizado signup
Mobile -- Visualização de ecrã HomeScreen
Mobile -- Objetivo personalizado upgrade_click

Isto dá-lhe visibilidade sobre onde os utilizadores abandonam entre descobrir o seu produto e tornarem-se utilizadores ativos da aplicação.

Visualizações de ecrã mobile aparecem como flowsery://ios/HomeScreen ou flowsery://android/HomeScreen no seu painel. Pode filtrar tráfego mobile usando flowsery:// no filtro de página.

Notas importantes

Mesmo website ID: Tanto o seu website como a aplicação React Native devem usar o mesmo website ID do Flowsery Analytics. Isto garante que todos os dados fluem para um único painel.
Mesmo userId: O userId que passa ao identify deve ser idêntico em ambas as plataformas. Recomendamos usar o email do utilizador.
Identificar em cada sessão: Chame identify cada vez que o utilizador inicia uma nova sessão (ex.: ao abrir a aplicação se o utilizador já está autenticado) para manter a vinculação.
Configuração de domínio: Nas definições do seu website Flowsery Analytics, certifique-se de que o domínio da sua aplicação está listado nos hostnames permitidos.
Suporte offline: O SDK React Native coloca eventos em fila enquanto está offline e envia-os quando a conectividade é restaurada, portanto nenhum dado é perdido.