프로젝트 배경
이 프로젝트는 Meta(Facebook 및 Instagram) 광고를 통해 유입되는 잠재 고객 데이터를 자동으로 수집하고, 이를 예약 시스템 및 상담 절차와 연동하여 마케팅 전환율을 높이고 내부 운영 효율을 개선하는 것을 목적으로 한다. 기존에는 리드 데이터가 수동으로 처리되어 누락되거나 지연되는 문제가 있었고, 광고를 통해 유입된 사용자가 예약을 하지 않으면 데이터가 유실되는 경우도 많았다. 또한 상담사가 사용하는 CTI 시스템과의 연동이 부족해 리드 정보를 효율적으로 전달하지 못하고 있었으며, 마케팅 성과 분석을 위한 실시간 데이터 통합이 어려운 상황이었다.
이를 해결하기 위해 본 프로젝트는 Meta 광고로부터 리드 데이터를 자동 수집하고, 사용자를 예약 페이지로 자연스럽게 연결하며, 입력된 리드 정보를 PostgreSQL에 저장하고 Redis를 통해 빠르게 처리한다. 동시에 Google Sheets와 연동하여 데이터를 실시간으로 기록하고, 고객센터 상담사가 참고할 수 있도록 CTI 시스템으로도 데이터를 전달한다. 전체 시스템은 Next.js와 React를 기반으로 구축되며, Redux를 통해 상태 관리를 수행하고, Tailwind CSS를 활용해 일관된 UI를 구성한다. 백엔드는 Nest.js로 구성하여 안정성과 확장성을 확보한다. 이를 통해 마케팅에서 상담까지의 흐름을 자동화하고, 리드 전환율을 높이는 동시에 운영팀의 업무 효율성을 크게 향상시키는 것을 목표로 한다.
이를 해결하기 위해 본 프로젝트는 Meta 광고로부터 리드 데이터를 자동 수집하고, 사용자를 예약 페이지로 자연스럽게 연결하며, 입력된 리드 정보를 PostgreSQL에 저장하고 Redis를 통해 빠르게 처리한다. 동시에 Google Sheets와 연동하여 데이터를 실시간으로 기록하고, 고객센터 상담사가 참고할 수 있도록 CTI 시스템으로도 데이터를 전달한다. 전체 시스템은 Next.js와 React를 기반으로 구축되며, Redux를 통해 상태 관리를 수행하고, Tailwind CSS를 활용해 일관된 UI를 구성한다. 백엔드는 Nest.js로 구성하여 안정성과 확장성을 확보한다. 이를 통해 마케팅에서 상담까지의 흐름을 자동화하고, 리드 전환율을 높이는 동시에 운영팀의 업무 효율성을 크게 향상시키는 것을 목표로 한다.
프로젝트 성과
예약 성과 향상
리드 전환율 향상 Meta 광고에서 수집된 리드의 예약 전환율이 기존 12%에서 28%로 2.3배 증가 PostgreSQL + Google Sheets 연동으로 실시간 리드 분석 리포트 구성 가능
핵심 기능
Meta 광고 리드 실시간 수집 및 저장
Facebook/Instagram 광고를 통해 발생한 리드 정보를 Meta Graph API를 통해 실시간 수신
리드 정보 입력 후, 사용자가 이탈하지 않고 자연스럽게 예약 화면으로 이동
리드 정보 입력 후, 사용자가 이탈하지 않고 자연스럽게 예약 화면으로 이동
진행 단계
레퍼런스 디자인 참고 후 디자인 제안
2024.09.
초기 기획 단계에서 Meta 광고를 통해 유입되는 사용자의 흐름과 예약 전환까지의 경로를 시각화하기 위해, 국내외 유사 서비스의 랜딩 페이지, 리드 폼, 예약 페이지 UX/UI를 분석
프론트 개발 완료
2024.10.
프론트엔드는 Next.js + React 기반으로 개발되었으며, 전반적인 UI는 Tailwind CSS를 활용하여 일관성 있는 디자인 시스템을 적용하였다.
CTI API개발완료로 모든 백앤드 개발 완료
2024.11.
Meta 리드 수집 Webhook 구현 완료
카카오 알림톡 연동
예약 데이터 처리 API 개발 완료
카카오 알림톡 연동
예약 데이터 처리 API 개발 완료
프로젝트 상세
Meta Facebook Instagram 잠재 고객 데이터 수집 & 연동
잠재 고객 데이터 작성 후에 예약 페이지로 연결
예약 페이지
CTI로 데이터 전송
구글 시트로 데이터 전송
고객 센터에서 추후 전화상담
잠재 고객 데이터 작성 후에 예약 페이지로 연결
예약 페이지
CTI로 데이터 전송
구글 시트로 데이터 전송
고객 센터에서 추후 전화상담









