Product Qualified Lead (PQL) 개발 지침

PQL(제품 적합 리드) 퍼널은 사용자와 팀 구성원을 연결합니다. PQL 제품 원칙에 대해 자세히 알아보세요.

핸드-레이즈 PQL이란 제품 내에서 영업팀과의 대화를 신청하는 사용자입니다.

개발 환경 설정

  1. 로컬 CustomersDot 인스턴스에 대한 연결이 있는 GDK를 설정합니다.

  2. CustomersDot을 Workato의 스테이징 인스턴스와 대화하도록 설정합니다.

  3. 표준 설치 지침을 사용하여 CustomersDot을 설정합니다.
  4. CUSTOMER_PORTAL_URL 환경 변수를 로컬(또는 ngrok) CustomersDot 인스턴스의 URL로 설정합니다.
  5. 쉘 rc 스크립트(~/.zshrc 또는 ~/.bash_profile 또는 ~/.bashrc)에 export CUSTOMER_PORTAL_URL='https://XXX.ngrok.io/'를 추가하고 GDK를 다시 시작합니다.
  6. CustomersDot 개발 환경에서 Workato에 대한 자격 증명을 /config/secrets.yml에 입력한 다음 다시 시작합니다. Workato 스테이징의 자격 증명은 1Password 구독 포털 금고에 있습니다. 스테이징의 URL은 https://apim.workato.com/gitlab-dev/services/marketo/lead입니다. 
  workato_url: "<%= ENV['WORKATO_URL'] %>"
  workato_client_id: "<%= ENV['WORKATO_CLIENT_ID'] %>"
  workato_client_secret: "<%= ENV['WORKATO_CLIENT_SECRET'] %>"

리드 모니터링 설정

  1. Marketo 샌드박스에 액세스를 설정합니다. 유사한 예시 요청을 따릅니다.

수동으로 리드 테스트

  1. 로컬 GitLab 인스턴스에 고유한 이메일로 새 사용자를 등록합니다.
  2. 새 양식을 제출하거나 새 평가판 또는 핸드-레이즈 리드를 만들어 PQL 리드를 전송합니다.
  3. Workato 스테이징에서 쉽게 식별 가능한 값을 사용합니다.
  4. Workato 스테이징의 항목을 관찰하고 MR(Merge Request) 코멘트에 붙여넣어 언급합니다.

문제 해결

  • 리드를 모니터링하기 위해 gitlab.com 및 CustomersDot의 애플리케이션 및 Sidekiq 로그를 확인합니다.
  • CustomersDot의 leads 테이블을 확인합니다.
  • Marketo Sandbox 액세스를 요청하고 이 예시 요청을 통해 리드를 유효성 검사합니다.

핸드-레이즈 리드 폼 임베드

HandRaiseLeadButton은 화면에 버튼과 핸드-레이즈 모달을 추가하는 재사용 가능한 컴포넌트입니다.

핸드-레이즈 리드 버튼은 다음과 같이 가져올 수 있습니다. 

import HandRaiseLeadButton from 'ee/hand_raise_leads/hand_raise_lead/components/hand_raise_lead_button.vue';

export default {
  components: {
    HandRaiseLeadButton,
...
</script>

<template>

<hand-raise-lead-button />

핸드-레이즈 리드 폼은 provide 또는 inject를 통해 다음 매개변수를 받아들입니다. 

    provide: {
      small,
      user: {
        namespaceId,
        userName,
        firstName,
        lastName,
        companyName,
        glmContent,
      },
      ctaTracking: {
        action,
        label,
        property,
        value,
        experiment,
      },
    },

ctaTracking 매개변수는 Snowplow 추적을 구현하기 위한 data-track 속성을 따릅니다. 제공된 추적 속성은 HandRaiseLeadButton 컴포넌트 내부의 버튼에 첨부되며 선택 시 핸드-레이즈 리드 모달을 트리거합니다.

리드 위치 모니터링

새 핸드-레이즈 폼을 임베드할 때 기존 값과 다른 고유한 glmContent 또는 glm_content 필드를 사용합니다.

현재 다음과 같은 glm_content 값을 사용합니다:

glm_content 값 설명
discover-group-security 이 값은 그룹 보안 기능 발견 페이지에서 사용됩니다.
discover-group-security-pqltest 이 값은 그룹 보안 기능 발견 페이지에서 3가지 CTA 실험에 사용됩니다.
discover-project-security 이 값은 프로젝트 보안 기능 발견 페이지에서 사용됩니다.
discover-project-security-pqltest 이 값은 프로젝트 보안 기능 발견 페이지에서 3가지 CTA 실험에 사용됩니다.
group-billing 이 값은 그룹 청구 페이지에서 사용됩니다.
trial-status-show-group 이 값은 네임스페이스에 활성 평가판이 있는 경우 상단 왼쪽 탐색에서 사용됩니다.

컴포넌트 테스트

Jest 테스트에서 컴포넌트의 존재 여부를 테스트할 수 있습니다. 

expect(wrapper.findComponent(HandRaiseLeadButton).exists()).toBe(true);

PQL 리드 플로우

PQL 리드의 흐름은 다음과 같습니다:

  1. 사용자는 gitlab.com에서 HandRaiseLeadButton 컴포넌트를 트리거합니다.
  2. HandRaiseLeadButton은 다음 API 엔드포인트로 어떠한 정보든 제출합니다: /-/subscriptions/hand_raise_leads.
  3. 해당 엔드포인트는 양식을 CustomersDot의 trials/create_hand_raise_lead 엔드포인트로 재게시합니다.
  4. CustomersDot은 양식 데이터를 leads 테이블에 기록하고 해당 양식을 Workato로 전송합니다.
  5. Workato은 양식을 Marketo로 보냅니다.
  6. Marketo는 스코어링을 수행하고 해당 양식을 Salesforce로 보냅니다.
  7. 저희 영업팀은 Salesforce를 사용하여 리드와 연결합니다.

시험용 리드 플로우

GitLab.com에서의 시험용 리드 플로우

sequenceDiagram Trial Frontend Forms ->>TrialsController#create_lead: GitLab.com 프론트엔드가 백엔드로 [리드]를 보냅니다 TrialsController#create->>CreateLeadService: [리드] TrialsController#create->>ApplyTrialService: [리드] 시험용 적용 CreateLeadService->>SubscriptionPortalClient#generate_trial(sync_to_gl=false): [리드] CustomersDot에 고객 계정 생성 ApplyTrialService->>SubscriptionPortalClient#generate_trial(sync_to_gl=true): [리드] CustomersDot에 시험용을 네임스페이스에 적용하도록 요청 SubscriptionPortalClient#generate_trial(sync_to_gl=false)->>CustomersDot|TrialsController#create(sync_to_gl=false): GitLab.com에서 CustomersDot으로 [리드] 전송 SubscriptionPortalClient#generate_trial(sync_to_gl=true)->>CustomersDot|TrialsController#create(sync_to_gl=true): GitLab.com이 CustomersDot에 시험용을 적용하도록 요청

CustomersDot에서의 시험용 리드 플로우 (sync_to_gl)

sequenceDiagram CustomersDot|TrialsController#create->>HostedPlans|CreateTrialService#execute: 모니터링 목적으로 [리드]를 leads 테이블에 저장 HostedPlans|CreateTrialService#execute->>BaseTrialService#create_account: customers 테이블에 고객 레코드 생성 HostedPlans|CreateTrialService#create_lead->>CreateLeadService: customers 테이블에 리드 레코드 생성 HostedPlans|CreateTrialService#create_lead->>Workato|CreateLeadWorker: 비동기 워커가 [리드]를 Workato에 제출 Workato|CreateLeadWorker->>Workato|CreateLeadService: [리드] Workato|CreateLeadService->>WorkatoApp#create_lead: [리드] WorkatoApp#create_lead->>Workato: [리드]가 Workato로 전송됨

CustomersDot의 네임스페이스에 시험용 적용

sequenceDiagram HostedPlans|CreateTrialService->load_namespace#Gitlab api/namespaces: 네임스페이스 세부 정보 로드 HostedPlans|CreateTrialService->create_order#: 주문 생성 HostedPlans|CreateTrialService->create_trial_history#: trial_histories 테이블에 레코드 작성

Hand raise 리드 플로우

GitLab.com에서의 핸드레이즈 플로우

sequenceDiagram HandRaiseForm Vue Component->>HandRaiseLeadsController#create: GitLab.com 프론트엔드가 백엔드로 [리드]를 보냅니다 HandRaiseLeadsController#create->>CreateHandRaiseLeadService: [리드] CreateHandRaiseLeadService->>SubscriptionPortalClient: [리드] SubscriptionPortalClient->>CustomersDot|TrialsController#create_hand_raise_lead: GitLab.com이 [리드]를 CustomersDot으로 전송

CustomersDot에서의 핸드레이즈 플로우

sequenceDiagram CustomersDot|TrialsController#create_hand_raise_lead->>CreateLeadService: 모니터링 목적으로 [리드]를 leads 테이블에 저장 CustomersDot|TrialsController#create_hand_raise_lead->>Workato|CreateLeadWorker: 비동기 워커가 [리드]를 Workato에 제출 Workato|CreateLeadWorker->>Workato|CreateLeadService: [리드] Workato|CreateLeadService->>WorkatoApp#create_lead: [리드] WorkatoApp#create_lead->>Workato: [리드]가 Workato로 전송됨

Workato 이후 모든 리드 유형에 대한 PQL 플로우

sequenceDiagram Workato->>Marketo: [리드] Marketo->>Salesforce(SFDC): [리드]