Skip to main content
책에 포함된 노트아무것도 몰라도, 러버블

실전 튜토리얼: 전자책·강의·디지털 상품 랜딩 페이지 만들기

Views 194약 11분생성형 AI 활용
Summary

팔릴지 모르는 상품은, 웹페이지 하나로 먼저 물어본다

전자책, 온라인 강의, 노션 템플릿, 체크리스트, PDF 가이드, 미니 컨설팅 패키지. 이름은 다르지만 출발점은 비슷합니다. 내가 알고 있는 것을 누군가가 시간을 아끼거나 실수를 줄이도록 정리해 주는 일입니다.

문제는 대부분 여기서 멈춘다는 점입니다.

"전자책을 다 쓰고 나서 팔아야 하나?"
"강의를 전부 촬영해야 판매 페이지를 만들 수 있나?"
"결제 시스템부터 붙여야 진짜 상품처럼 보이지 않을까?"

초보자라면 오히려 반대로 가야 합니다. 상품을 완성하기 전에 먼저 작은 판매형 랜딩 페이지를 만들어 봅니다. 랜딩 페이지란 방문자가 한 가지 행동을 하도록 설계된 단일 웹페이지입니다. 여기서 한 가지 행동은 "구매하기", "사전예약하기", "이메일 남기기", "외부 판매 페이지로 이동하기" 같은 것입니다.

Lovable은 이런 단일 랜딩 페이지를 빠르게 만들기에 잘 맞는 도구입니다. Lovable 공식 소개에서도 앱, 웹사이트, 디지털 제품을 AI와 대화하듯 빠르게 만들 수 있다고 설명하고 있으며, 랜딩 페이지는 특히 명확한 제안, 대상, 전환 목표를 프롬프트에 담았을 때 빠르게 결과물을 얻기 좋은 유형입니다.1

하지만 중요한 것은 "페이지를 예쁘게 만드는 것"이 아닙니다. 이 장의 목표는 내 지식과 경험을 작게 포장해 실제 수요가 있는지 확인하는 판매형 페이지를 만드는 것입니다. 디자인은 70점이어도 됩니다. 대신 누가, 왜, 무엇을 얻기 위해, 어떤 버튼을 눌러야 하는지는 100점에 가깝게 선명해야 합니다.

실전 튜토리얼: 전자책·강의·디지털 상품 랜딩 페이지 만들기

먼저 팔 상품을 작게 자른다

처음부터 "온라인 아카데미 플랫폼"을 만들려고 하면 길을 잃습니다. 회원가입, 결제, 강의장, 진도율, 쿠폰, 관리자 페이지까지 떠오르기 때문입니다. 무료 사용자라면 이 모든 것을 Lovable 안에서 한 번에 만들려는 순간 크레딧이 빠르게 사라집니다.

이번 장에서는 다음 정도의 작은 상품을 기준으로 삼겠습니다.

  • 30~80쪽 분량의 PDF 전자책

  • 3~5개 영상으로 구성된 미니 강의

  • 노션, 엑셀, 구글시트, 피그마 템플릿

  • 체크리스트, 프롬프트 모음, 업무 자동화 가이드

  • 1회성 소규모 워크숍 또는 상담 패키지

예를 들어 프리랜서 디자이너라면 "첫 클라이언트 미팅 질문지 템플릿"을 만들 수 있습니다. 세무 업무에 익숙한 개인 사업자라면 "초보 프리랜서를 위한 비용처리 체크리스트"를 만들 수 있습니다. 블로그를 오래 운영한 사람이라면 "블로그 글감 100개 발굴 워크북"을 팔 수 있습니다.

여기서 핵심은 대단한 전문 지식이 아니라 누군가에게는 이미 헷갈리는 일을 내가 조금 더 먼저 겪어 봤다는 사실입니다. 부업 상품은 거창한 지식보다 구체적인 불편에서 시작할 때 더 잘 팔립니다.

가령 다음처럼 생각해 볼 수 있습니다.

"나는 전문가가 아닌데 팔아도 될까?"라는 질문 대신 "내가 3개월 전에 몰라서 고생했던 것을 지금 막 시작한 사람에게 정리해 줄 수 있을까?"라고 물어보세요. 이 질문에 "그렇다"라고 답할 수 있다면, 랜딩 페이지를 만들 자격은 충분합니다.

판매형 랜딩 페이지의 기본 흐름

판매형 랜딩 페이지는 예쁜 포스터가 아닙니다. 작은 설득의 길입니다. 방문자는 위에서 아래로 내려오며 이런 생각을 합니다.

"이거 내 이야기인가?"
"정말 해결해 주나?"
"나 같은 사람도 할 수 있나?"
"무엇이 들어 있나?"
"가격은 납득할 만한가?"
"지금 신청하면 무엇을 얻나?"

그래서 이번 페이지는 다음 흐름으로 설계합니다.

  1. 문제 제기

  2. 해결 약속

  3. 대상 독자 또는 수강생

  4. 상품 구성

  5. 혜택과 보너스

  6. 가격 또는 런칭 특가

  7. 구매·신청 CTA

  8. FAQ

이 구조는 온라인 강의나 디지털 상품 판매 페이지에서 자주 쓰이는 기본 뼈대와도 맞닿아 있습니다. 좋은 강의 판매 페이지는 강의명, 가격, 구성, 대상, 강사 소개, 후기, FAQ, 명확한 CTA를 한곳에서 답해 주어야 하며, 방문자가 구매 결정을 내리는 데 필요한 정보를 흩어지지 않게 제공해야 합니다.2

여기서 CTA는 Call To Action의 줄임말입니다. 한국어로는 "행동 유도 버튼" 정도로 이해하면 됩니다. "사전예약하기", "전자책 구매하기", "무료 샘플 받기", "대기자 명단 등록하기" 같은 버튼이 CTA입니다.

이번 실습에서는 자체 결제 기능을 만들지 않습니다. 대신 다음 중 하나로 연결합니다.

  • 크몽, 탈잉, 스마트스토어 같은 외부 판매 페이지

  • Gumroad, Stripe Payment Link 같은 결제 링크

  • 구글폼, 타입폼, 네이버폼 같은 신청 폼

  • 아직 상품이 없다면 이메일 대기자 명단

초보자가 가장 많이 실수하는 지점이 바로 결제부터 직접 만들려는 것입니다. 결제는 신뢰, 보안, 환불, 영수증, 개인정보, 오류 대응까지 따라옵니다. 처음에는 Lovable에서 상품 설명과 리드 수집 중심의 MVP 랜딩 페이지를 만들고, 실제 결제나 신청 처리는 검증된 외부 도구에 맡기는 편이 훨씬 안전합니다.

MVP는 Minimum Viable Product의 줄임말입니다. 우리말로는 "최소 기능 제품"입니다. 대충 만든 제품이라는 뜻이 아니라, 검증에 필요한 최소한만 담은 첫 버전이라는 뜻입니다.

이번 장의 예시 상품 정하기

튜토리얼을 따라가기 위해 하나의 예시 상품을 정하겠습니다.

예시 상품명은 《프리랜서 첫 견적서 작성 키트》입니다. 대상은 디자인, 마케팅, 콘텐츠 제작을 막 시작한 초보 프리랜서입니다. 이들은 클라이언트에게 견적을 보내야 하지만, 어떤 항목을 넣어야 하는지, 가격을 어떻게 설명해야 하는지, 수정 횟수와 작업 범위를 어떻게 적어야 하는지 몰라 불안해합니다.

상품 구성은 PDF 전자책 1권과 견적서 템플릿 3종, 클라이언트 응대 문구 20개로 잡겠습니다. 아직 완성된 상품이 없어도 괜찮습니다. 먼저 사전예약 랜딩 페이지를 만들고, 이메일 신청자가 생기는지 확인하면 됩니다.

이 예시는 전자책에도, 강의에도, 디지털 템플릿에도 응용할 수 있습니다. 만약 독자님의 분야가 다르다면 아래처럼 바꾸면 됩니다.

분야상품 아이디어랜딩 페이지 전환 목표
퍼스널 트레이너집에서 시작하는 14일 자세 교정 루틴 PDF무료 샘플 신청
세무·회계 프리랜서개인사업자 비용처리 체크리스트상담 문의 또는 전자책 구매
마케터인스타그램 콘텐츠 캘린더 템플릿Gumroad 구매 링크 클릭
강사·코치첫 유료 워크숍 개설 미니 강의대기자 명단 등록
개발 입문자노코드 자동화 업무 템플릿 모음타입폼 신청

중요한 것은 "모두에게 좋은 상품"이 아니라 "특정 상황의 특정 사람에게 바로 필요한 상품"이어야 한다는 점입니다.

Lovable을 열기 전에 ChatGPT로 판매 기획 끝내기

Lovable 안에서 "어떤 전자책을 팔면 좋을까?", "가격은 얼마가 좋을까?", "FAQ는 뭘 넣지?"를 계속 물어보면 크레딧이 아깝습니다. 이 책에서 계속 강조한 원칙을 다시 적용하겠습니다.

기획은 외부 AI에서 끝내고, Lovable은 구현에만 쓴다.

Lovable 역시 ChatGPT와 함께 아이디어를 구체화한 뒤 실제 웹사이트나 앱으로 옮기는 흐름을 소개합니다. 즉 ChatGPT에서 생각을 선명하게 만들고, Lovable에서 클릭 가능한 결과물로 바꾸는 방식이 자연스럽습니다.3

먼저 ChatGPT나 Gemini 같은 외부 AI 도구에 다음 프롬프트를 넣어 봅니다. 아래 예시는 그대로 복사해도 됩니다.

나는 초보 프리랜서를 대상으로 디지털 상품을 판매하려고 한다.
상품 아이디어는 "프리랜서 첫 견적서 작성 키트"다.
구성은 PDF 전자책, 견적서 템플릿 3종, 클라이언트 응대 문구 20개다.

아래 항목을 한국어로 구체적으로 작성해줘.

1. 핵심 고객 페르소나 2명
2. 이 고객이 구매 전 망설이는 이유 10가지
3. 랜딩 페이지의 핵심 헤드라인 후보 10개
4. 서브헤드라인 후보 5개
5. 문제 제기 섹션 문구
6. 해결 약속 섹션 문구
7. 상품 구성 설명
8. 혜택 5가지
9. 보너스 아이디어 3가지
10. 가격 옵션 3가지
11. FAQ 8개와 답변

조건:
- 과장된 표현은 피하고 현실적인 톤으로 작성해줘.
- 초보 프리랜서가 "내 얘기다"라고 느끼게 써줘.
- 랜딩 페이지에 바로 붙여 넣을 수 있는 문장으로 작성해줘.

이 프롬프트의 목적은 "상품을 대신 만들어 달라"가 아닙니다. 내가 머릿속에 흐릿하게 갖고 있던 제안을 판매 페이지에 넣을 수 있는 문장으로 정리하는 것입니다.

결과가 나오면 그대로 믿지 말고 한 번 더 다듬습니다. 특히 다음 세 가지를 확인해야 합니다.

첫째, 헤드라인이 너무 추상적이면 안 됩니다. "프리랜서 성공의 모든 것" 같은 문구는 넓지만 약합니다. "견적서 보낼 때마다 손이 멈추는 초보 프리랜서를 위한 첫 견적서 키트"처럼 상황이 보이는 문구가 더 좋습니다.

둘째, 혜택은 기능과 달라야 합니다. "PDF 50쪽 제공"은 기능입니다. "처음 보내는 견적서에도 작업 범위와 수정 조건을 자신 있게 적을 수 있다"는 혜택입니다.

셋째, FAQ는 판매 문구가 아니라 불안을 줄이는 문구여야 합니다. "정말 초보자도 쓸 수 있나요?", "아직 사업자등록을 하지 않았는데 봐도 되나요?", "디자인 외 분야도 사용할 수 있나요?" 같은 질문에 솔직하게 답해야 합니다.

고객의 망설임까지 페이지에 넣는다

판매 페이지를 만들 때 초보자는 자꾸 자랑부터 합니다.

"이 상품은 50쪽입니다."
"템플릿이 3개 들어 있습니다."
"제가 열심히 만들었습니다."

물론 필요한 정보입니다. 하지만 구매자는 그보다 먼저 자기 안의 망설임을 해결하고 싶어 합니다.

"내가 지금 사도 쓸 수 있을까?"
"너무 어렵지는 않을까?"
"이걸 산다고 진짜 시간이 줄어들까?"
"인터넷에 무료 자료도 많은데 굳이 돈을 내야 할까?"

이 망설임을 페이지에 반영해야 전환율이 올라갑니다. 전환율은 방문자 중 원하는 행동을 한 사람의 비율입니다. 100명이 방문해서 5명이 이메일을 남겼다면 이메일 신청 전환율은 5%입니다.

외부 AI에 다음처럼 한 번 더 요청해 보세요.

위 상품을 본 초보 프리랜서가 구매하지 않고 나갈 수 있는 이유를 15개 적어줘.
각 이유에 대해 랜딩 페이지에서 어떻게 불안을 줄일 수 있는지도 함께 제안해줘.

예시 형식:
- 망설임: 가격이 비싸다고 느낀다.
- 페이지에서 줄이는 방법: 무료 샘플 3페이지와 템플릿 미리보기를 제공한다.

이 작업은 생각보다 강력합니다. 왜냐하면 FAQ, 보너스, 가격 설명, 무료 샘플 제공 여부가 여기서 나오기 때문입니다. 예를 들어 "내 분야에도 맞을까?"라는 망설임이 크다면 "디자인·마케팅·콘텐츠 작업에 맞게 예시 문구 제공"이라는 설명을 넣으면 됩니다. "사도 안 쓸까 봐 걱정된다"는 망설임이 크다면 "구매 후 15분 안에 첫 견적서 초안을 완성할 수 있도록 순서대로 구성"이라는 문구가 도움이 됩니다.

랜딩 페이지 기획서로 정리하기

이제 Lovable에 넣을 재료를 하나의 기획서로 정리합니다. 이 과정이 귀찮아 보여도, 여기서 시간을 쓰면 Lovable 크레딧을 아낄 수 있습니다. 랜딩 페이지 생성에서 중요한 것은 페이지의 제안, 대상, 전환 목표, 섹션 순서를 프롬프트에 명확히 담는 것입니다. Lovable로 랜딩 페이지를 만들 때도 헤드라인, CTA, 섹션 순서, 브랜드 톤, 모바일 반응형 요구를 구체적으로 넣을수록 일반적인 결과물이 아니라 실제로 쓸 만한 첫 버전에 가까워집니다.4

아래 양식을 채워 봅니다.

[랜딩 페이지 기획서]

상품명:
프리랜서 첫 견적서 작성 키트

상품 유형:
PDF 전자책 + 견적서 템플릿 + 응대 문구 모음

판매 대상:
디자인, 마케팅, 콘텐츠 제작을 막 시작한 초보 프리랜서

고객의 핵심 문제:
클라이언트에게 견적서를 보내야 하지만 작업 범위, 수정 횟수, 가격 설명을 어떻게 적어야 할지 몰라 불안하다.

해결 약속:
구매자는 15분 안에 자신의 첫 견적서 초안을 만들고, 클라이언트에게 설명할 기본 문구까지 준비할 수 있다.

전환 목표:
1차 목표는 이메일 대기자 명단 등록이다.
2차 목표는 외부 판매 페이지 클릭이다.

CTA 문구:
- 사전예약 알림 받기
- 무료 샘플 받고 출시 소식 받기
- 런칭 특가 알림 받기

페이지 톤앤매너:
친근하지만 가볍지 않게. 초보자의 불안을 이해해 주는 말투. 흰 배경, 짙은 남색 텍스트, 포인트 컬러는 부드러운 민트.

필수 섹션 순서:
1. Hero: 문제와 해결 약속, CTA 버튼
2. 공감 섹션: 견적서 작성에서 막히는 순간들
3. 해결 섹션: 이 키트로 무엇이 쉬워지는지
4. 대상 섹션: 이런 사람에게 추천 / 추천하지 않는 사람
5. 상품 구성 섹션: PDF, 템플릿, 응대 문구
6. 혜택 섹션: 시간 절약, 범위 명확화, 가격 설명, 수정 조건 정리, 자신감
7. 보너스 섹션: 무료 샘플, 체크리스트, 이메일 문구
8. 가격 섹션: 정가와 런칭 특가
9. 이메일 대기자 명단 폼: 이름, 이메일
10. FAQ 섹션
11. 마지막 CTA 섹션

폼 제출 후 안내:
"신청이 완료되었습니다. 출시일과 무료 샘플을 이메일로 보내드릴게요."라는 감사 메시지를 보여준다.

외부 링크:
아직 결제 전이면 구글폼 또는 타입폼 링크로 연결한다.
판매 준비가 되면 Gumroad 또는 스마트스토어 링크로 교체한다.

이 기획서는 Lovable에게 주는 작업 지시서입니다. 이제 Lovable에게 "잘 만들어줘"라고 말하지 않아도 됩니다. 이미 무엇을 만들지 정했기 때문입니다.

Lovable 첫 생성 프롬프트 작성하기

이제 Lovable에 넣을 프롬프트를 만듭니다. 한 번의 요청에 최대한 구체적으로 전달하되, 너무 많은 기능을 넣지 않는 것이 중요합니다. 이번에는 단일 페이지입니다. 회원가입도 없습니다. 자체 결제도 없습니다. 관리자 페이지도 없습니다. 강의장도 없습니다.

아래 프롬프트를 기반으로 자신의 상품에 맞게 바꿔 사용하세요.

전자책 사전예약 랜딩 페이지를 만들어줘.

상품명은 "프리랜서 첫 견적서 작성 키트"야.
이 상품은 초보 프리랜서를 위한 PDF 전자책, 견적서 템플릿 3종, 클라이언트 응대 문구 20개로 구성돼 있어.

타깃 고객은 디자인, 마케팅, 콘텐츠 제작을 막 시작한 초보 프리랜서야.
이들은 클라이언트에게 견적서를 보내야 하지만 작업 범위, 수정 횟수, 가격 설명을 어떻게 적어야 할지 몰라 불안해해.

페이지의 전환 목표는 이메일 대기자 명단 등록이야.
보조 목표는 외부 판매 페이지로 이동하는 CTA 클릭이야.

아래 순서로 모바일 우선 반응형 단일 랜딩 페이지를 만들어줘.

1. Hero 섹션
- 헤드라인: "견적서 보낼 때마다 손이 멈추는 초보 프리랜서를 위한 첫 견적서 키트"
- 서브문구: "작업 범위, 수정 횟수, 가격 설명을 처음부터 깔끔하게 정리할 수 있도록 PDF 가이드와 실전 템플릿을 함께 제공합니다."
- CTA 버튼: "무료 샘플 받고 출시 알림 받기"
- 보조 버튼: "상품 구성 보기"

2. 문제 공감 섹션
- 견적 금액을 어떻게 설명해야 할지 모르겠음
- 수정 요청이 어디까지 무료인지 말하기 어려움
- 작업 범위를 적지 않아 나중에 분쟁이 생길까 걱정됨

3. 해결 약속 섹션
- 이 키트를 사용하면 15분 안에 첫 견적서 초안을 만들 수 있다는 메시지를 보여줘.

4. 추천 대상 섹션
- 이런 분에게 추천합니다 / 이런 분에게는 맞지 않습니다 형식으로 구성해줘.

5. 상품 구성 섹션
- PDF 전자책
- 견적서 템플릿 3종
- 클라이언트 응대 문구 20개
- 작업 범위 체크리스트

6. 혜택 섹션
- 견적서 작성 시간 절약
- 작업 범위 명확화
- 수정 조건 사전 안내
- 가격 설명 문구 확보
- 첫 거래에 대한 불안 감소

7. 보너스 섹션
- 런칭 특가 신청자에게 무료 샘플 PDF와 이메일 문구 5개를 제공한다고 안내해줘.

8. 가격 섹션
- 정가 29,000원
- 런칭 특가 19,000원 예정
- 지금은 결제 대신 대기자 명단 등록을 받는다고 안내해줘.

9. 이메일 대기자 명단 폼
- 입력 필드: 이름, 이메일
- 버튼 문구: "출시 알림 받기"
- 제출 후 화면 또는 메시지: "신청이 완료되었습니다. 출시일과 무료 샘플을 이메일로 보내드릴게요."

10. FAQ 섹션
- 아직 프리랜서 일을 시작하지 않았는데 봐도 되나요?
- 디자인 외 분야도 사용할 수 있나요?
- 템플릿은 어떤 형식인가요?
- 결제는 언제 열리나요?
- 무료 샘플은 언제 받을 수 있나요?
- 환불 정책은 어떻게 되나요?

11. 마지막 CTA 섹션
- 다시 한 번 이메일 등록을 유도해줘.

디자인 톤:
- 흰 배경 중심
- 짙은 남색 텍스트
- 포인트 컬러는 부드러운 민트
- 카드형 섹션과 넉넉한 여백
- 초보자에게 친근하고 신뢰감 있는 분위기

중요한 제한:
- 회원가입 기능은 만들지 마.
- 자체 결제 기능은 만들지 마.
- 강의장이나 대시보드는 만들지 마.
- 우선 단일 페이지 MVP로 만들어줘.

이 프롬프트에는 상품명, 대상, 문제, 해결 약속, 전환 목표, 섹션 순서, CTA 문구, 폼, 제출 후 메시지, 디자인 톤, 제외 기능이 모두 들어 있습니다. Lovable이 마음대로 해석할 여지를 줄인 것입니다.

초보자에게 특히 중요한 부분은 마지막의 "중요한 제한"입니다. AI 도구는 종종 친절하게 더 만들어 주려고 합니다. 그런데 더 만들어 주는 것이 항상 좋은 것은 아닙니다. 무료 사용자에게는 범위가 커질수록 수정할 것도 늘고, 수정할수록 크레딧이 줄어듭니다.

첫 결과물을 볼 때는 디자인보다 구조를 본다

Lovable이 첫 페이지를 생성하면 바로 색상부터 고치고 싶어집니다. 버튼이 마음에 안 들고, 카드 모서리가 아쉽고, 아이콘이 취향과 다를 수 있습니다. 하지만 첫 검토에서는 디자인 취향보다 구조를 먼저 봐야 합니다.

다음 질문으로 확인하세요.

  • 첫 화면에서 누가 무엇을 얻는지 바로 보이는가?

  • CTA 버튼이 화면 상단에 분명히 있는가?

  • 상품 구성이 가격보다 먼저 충분히 설명되는가?

  • 방문자의 망설임이 FAQ에서 다뤄지는가?

  • 이메일 입력 후 어떤 일이 일어나는지 안내되는가?

이 중 하나라도 빠졌다면 그 부분만 수정 요청합니다. "전체적으로 더 예쁘게 해줘"는 위험한 요청입니다. 결과가 좋아질 수도 있지만, 페이지 전체가 바뀌어 마음에 들던 구조까지 흔들릴 수 있습니다.

수정 요청은 작게 합니다.

Hero 섹션의 메시지만 더 명확하게 수정해줘.
현재 문구가 너무 일반적이야.
초보 프리랜서가 견적서를 처음 보낼 때 느끼는 불안이 드러나도록 헤드라인과 서브문구만 다시 작성해줘.
다른 섹션의 레이아웃과 기능은 바꾸지 마.

또는 이렇게 요청합니다.

FAQ 섹션에 "무료 자료와 무엇이 다른가요?" 질문을 추가해줘.
답변은 이 상품이 단순 정보 모음이 아니라 실제 견적서 작성 순서와 문구 템플릿을 제공한다는 점을 강조해줘.
다른 섹션은 수정하지 마.

이런 방식은 크레딧을 아끼는 데 도움이 됩니다. 한 번에 페이지 전체를 갈아엎는 대신, 전환에 직접 영향을 주는 부분만 고칩니다.

폼은 처음부터 어렵게 연결하지 않는다

이메일 대기자 명단 폼을 만들 때 초보자가 헷갈리는 부분이 있습니다.

"Lovable에 이름과 이메일 입력 폼을 만들면 자동으로 내가 받을 수 있나요?"

항상 그렇지는 않습니다. 폼은 겉모양만 있다고 끝이 아닙니다. 입력한 데이터를 어딘가에 저장하거나, 이메일로 보내거나, 외부 서비스로 전달해야 합니다. 랜딩 페이지 폼은 Supabase 같은 데이터베이스에 저장할 수도 있고, Formspree 같은 외부 폼 처리 도구나 CRM 웹훅으로 보낼 수도 있습니다.5

하지만 이번 장에서는 초보자에게 가장 안전한 방법을 추천합니다. 처음에는 외부 폼 링크를 사용하세요.

예를 들어 구글폼이나 타입폼에 이름, 이메일, 관심 상품, 궁금한 점을 받는 폼을 만듭니다. 그런 다음 Lovable 랜딩 페이지의 CTA 버튼을 그 링크로 연결합니다. 이렇게 하면 데이터 저장, 이메일 수신, 스팸 대응, 오류 확인을 외부 도구가 처리해 줍니다.

Lovable에는 이렇게 요청하면 됩니다.

이메일 입력 폼을 직접 저장하는 방식 대신, CTA 버튼을 외부 구글폼 링크로 연결해줘.
버튼 문구는 "무료 샘플 받고 출시 알림 받기"로 해줘.
버튼 클릭 시 새 탭에서 아래 링크가 열리게 해줘.

링크: https://forms.gle/예시링크

페이지 안에는 "신청은 30초 안에 끝납니다"라는 안내 문구를 버튼 아래에 작게 넣어줘.

이미 Gumroad, 스마트스토어, 크몽, 탈잉 판매 페이지가 있다면 같은 방식으로 연결하면 됩니다.

가격 섹션의 "런칭 특가로 구매하기" 버튼을 아래 외부 판매 링크로 연결해줘.
버튼 클릭 시 새 탭에서 열리게 해줘.

링크: https://gumroad.com/l/예시상품

자체 결제 기능은 만들지 말고, 현재 랜딩 페이지에서는 상품 설명과 외부 구매 유도만 담당하게 해줘.

이렇게 하면 Lovable 프로젝트의 난이도가 크게 낮아집니다. 랜딩 페이지는 설득을 담당하고, 결제와 신청은 외부 도구가 담당합니다. 초보자에게는 이 분업이 가장 현실적입니다.

전자책, 강의, 템플릿별로 문구를 바꾸는 법

같은 랜딩 페이지 구조라도 상품 유형에 따라 강조점이 달라집니다.

전자책은 "읽고 이해하는 것"보다 "읽은 뒤 무엇을 할 수 있는지"를 강조해야 합니다. "총 70쪽 분량"보다 "첫 견적서를 보내기 전 확인해야 할 항목을 순서대로 정리"가 더 설득력 있습니다.

온라인 강의는 "커리큘럼"과 "완주 가능성"이 중요합니다. 특히 초보자는 긴 강의보다 짧고 끝낼 수 있는 강의를 선호할 수 있습니다. "총 20강"보다 "하루 20분씩 5일 안에 첫 결과물을 완성"이 더 구체적입니다.

템플릿 상품은 "바로 쓸 수 있음"이 핵심입니다. 노션 템플릿, 엑셀 파일, 피그마 파일, 이메일 문구 모음은 구매자가 빠르게 복사하고 수정할 수 있어야 합니다. "전문가용 템플릿"보다 "복사해서 내 상황에 맞게 바꾸는 템플릿"이 초보자에게 더 편안하게 다가옵니다.

아래 문장을 자신의 상품에 맞게 바꿔 보세요.

상품 유형좋은 헤드라인 방향CTA 예시
전자책복잡한 내용을 짧은 시간에 이해하게 해준다무료 샘플 받기
미니 강의따라 하면서 결과물을 완성하게 해준다첫 강의 알림 받기
템플릿빈 화면에서 시작하지 않게 해준다템플릿 미리보기
체크리스트빠뜨리기 쉬운 실수를 줄여준다체크리스트 받기
워크숍혼자 막힌 부분을 함께 해결한다다음 일정 알림 받기

Lovable에 넣는 프롬프트에서도 이 차이를 반영해야 합니다. 예를 들어 전자책이라면 목차 미리보기 섹션을 넣고, 강의라면 커리큘럼과 수강 방식 섹션을 넣고, 템플릿이라면 사용 전후 비교 섹션을 넣습니다.

가격은 '정답'이 아니라 실험값이다

초보자는 가격을 정할 때 오래 멈춥니다. 너무 싸면 없어 보일까 걱정되고, 너무 비싸면 아무도 안 살까 걱정됩니다. 하지만 첫 랜딩 페이지에서 가격은 정답이 아니라 실험값입니다.

처음에는 세 가지 가격 표현을 준비해 볼 수 있습니다.

방식예시적합한 상황
무료 대기자 명단출시 알림 신청아직 상품 완성 전
런칭 특가정가 29,000원 → 출시가 19,000원수요 검증 중
베타 판매첫 20명 한정 9,900원후기와 피드백 확보

주의할 점은 가짜 긴급성을 만들지 않는 것입니다. "오늘 자정 마감"이라고 써 놓고 매일 반복하면 신뢰가 떨어집니다. 대신 "첫 버전 피드백을 받기 위해 베타 가격으로 제공합니다"처럼 이유가 있는 혜택을 제시하세요.

Lovable에는 가격 섹션을 이렇게 요청할 수 있습니다.

가격 섹션을 3단 카드로 만들지 말고, 하나의 명확한 런칭 특가 박스로 보여줘.
정가 29,000원, 런칭 예정가 19,000원이라고 표시해줘.
아직 결제는 받지 않고 대기자 명단 등록을 받는 단계라는 점을 분명히 써줘.
CTA 버튼은 "런칭 특가 알림 받기"로 해줘.

무료 사용자라면 가격표 토글, 쿠폰 적용, 결제 단계, 회원 등급 같은 기능은 넣지 않는 편이 좋습니다. 지금 필요한 것은 가격 실험이지 결제 시스템 개발이 아닙니다.

구매 버튼은 하나의 목적지로 모은다

판매형 랜딩 페이지에는 버튼이 여러 번 나올 수 있습니다. 하지만 목적지는 가능하면 하나로 모으는 것이 좋습니다. 위쪽 CTA, 중간 CTA, 가격 섹션 CTA, 마지막 CTA가 모두 다른 곳으로 가면 방문자가 헷갈립니다.

아직 상품 전이라면 모든 주요 버튼은 대기자 명단 폼으로 보냅니다. 상품이 판매 중이라면 모든 주요 버튼은 외부 구매 링크로 보냅니다. 무료 샘플을 제공한다면 모든 버튼은 샘플 신청 폼으로 보냅니다.

Lovable에 이렇게 지시할 수 있습니다.

페이지 안의 모든 주요 CTA 버튼은 같은 목적지로 연결해줘.
목적지는 아래 구글폼 링크야.

https://forms.gle/예시링크

버튼 문구는 위치에 따라 조금 다르게 해도 되지만, 모두 대기자 명단 등록 행동으로 이어지게 해줘.
예:
- 무료 샘플 받고 출시 알림 받기
- 런칭 특가 알림 받기
- 대기자 명단 등록하기

이렇게 하면 방문자의 행동이 선명해집니다. 랜딩 페이지는 똑똑한 메뉴판이 아니라, 한 방향으로 안내하는 친절한 표지판이어야 합니다.

완성 후에는 예쁨보다 숫자를 본다

페이지를 만들고 나면 이제부터가 진짜입니다. 주변 사람에게 링크를 보내거나, 블로그 글 아래에 붙이거나, 인스타그램 프로필에 올리거나, 뉴스레터에 소개해 봅니다. 그리고 반응을 기록합니다.

처음부터 복잡한 분석 도구를 붙이지 않아도 됩니다. 다만 최소한 다음 숫자는 봐야 합니다.

지표뜻초보자용 확인 방법
방문수몇 명이 페이지에 들어왔는가Lovable, 링크 단축 도구, 분석 도구
CTA 클릭수버튼을 몇 번 눌렀는가Bitly, 구글폼 응답 수, 외부 판매 페이지 유입
이메일 신청수실제로 신청한 사람이 몇 명인가구글폼·타입폼 응답
외부 판매 페이지 이동수구매 페이지로 넘어간 사람이 몇 명인가판매 플랫폼 통계
반복 질문사람들이 계속 묻는 내용은 무엇인가댓글, DM, 폼 응답

방문자가 100명인데 신청자가 0명이라면 디자인보다 제안이 흐릿할 가능성이 큽니다. "누구를 위한 상품인지" 또는 "왜 지금 신청해야 하는지"가 약할 수 있습니다. 방문자는 많은데 CTA 클릭이 거의 없다면 첫 화면 문구나 버튼 위치를 봐야 합니다. CTA 클릭은 많은데 폼 제출이 적다면 외부 폼이 너무 길거나 불안해 보일 수 있습니다.

랜딩 페이지 도구나 Lovable 자체가 자동으로 모든 분석을 완벽하게 해 주는 것은 아닙니다. 실제 운영용 페이지라면 Google Analytics, Plausible 같은 분석 도구를 별도로 연결하고, 폼 제출이나 버튼 클릭 같은 전환 이벤트를 확인하는 과정이 필요할 수 있습니다.6

하지만 첫 실험에서는 너무 어렵게 시작하지 마세요. 구글폼 응답 수와 외부 판매 링크 클릭 수만 봐도 충분히 배울 수 있습니다.

바꿀 때는 한 번에 하나만 바꾼다

반응이 없으면 마음이 급해져서 모든 것을 바꾸고 싶어집니다. 헤드라인도 바꾸고, 색상도 바꾸고, 가격도 바꾸고, 보너스도 추가하고, FAQ도 갈아엎습니다. 그러면 문제가 생깁니다. 무엇 때문에 좋아졌는지, 무엇 때문에 나빠졌는지 알 수 없습니다.

처음에는 한 번에 하나만 바꾸세요.

첫 번째 실험은 헤드라인입니다. "프리랜서 첫 견적서 작성 키트"보다 "견적서 보낼 때마다 손이 멈추는 초보 프리랜서를 위한 키트"가 더 반응이 좋은지 봅니다.

두 번째 실험은 CTA 문구입니다. "대기자 명단 등록하기"보다 "무료 샘플 받고 출시 알림 받기"가 더 클릭되는지 봅니다.

세 번째 실험은 가격 제안입니다. "런칭 특가 19,000원"과 "첫 20명 베타가 9,900원" 중 어떤 표현이 더 많은 신청을 만드는지 봅니다.

네 번째 실험은 보너스입니다. "이메일 문구 5개"와 "견적서 발송 전 체크리스트" 중 어떤 보너스가 더 매력적인지 봅니다.

Lovable 수정 요청도 작게 합니다.

이번에는 헤드라인 문구만 변경해줘.
기존 레이아웃, 색상, 섹션 순서, CTA 링크는 그대로 유지해줘.
새 헤드라인은 "첫 견적서, 더 이상 감으로 쓰지 마세요"로 바꿔줘.
서브문구는 초보 프리랜서가 작업 범위와 수정 조건을 명확히 적을 수 있다는 내용으로 다듬어줘.

이런 식으로 바꾸면 페이지가 무너질 위험도 줄고, 실험 결과도 비교하기 쉬워집니다.

작은 판매 페이지가 부업의 첫 번째 증거가 된다

이번 장에서 만든 것은 거대한 쇼핑몰도 아니고, 완성형 강의 플랫폼도 아닙니다. 단일 랜딩 페이지입니다. 하지만 이 페이지는 생각보다 많은 일을 합니다.

내 상품 설명이 사람들에게 이해되는지 확인합니다. 사람들이 어떤 문구에 반응하는지 봅니다. 가격에 대한 거부감이 큰지 살핍니다. 반복되는 질문을 모아 상품 내용을 고칩니다. 이메일을 남기는 사람이 있다면 출시 소식을 보낼 첫 고객 후보가 생깁니다.

무엇보다 중요한 것은 "언젠가 팔아야지"라는 생각이 "링크 하나를 보내볼 수 있는 상태"로 바뀐다는 점입니다. 부업은 머릿속에서 시작되지 않습니다. 누군가에게 보여줄 수 있는 작은 제안에서 시작됩니다.

Lovable은 이 작은 제안을 빠르게 화면으로 바꿔 주는 도구입니다. 그러나 무엇을 팔지, 누구에게 팔지, 왜 지금 필요한지, 어떤 행동을 유도할지는 여전히 내가 정해야 합니다. 그래서 이번 장의 진짜 기술은 버튼을 만드는 법이 아니라 내 경험을 팔 수 있는 형태로 정리하는 법입니다.

다음 장에서는 지금까지 여러 번 미뤄 둔 중요한 주제로 넘어갑니다. 이름, 이메일, 문의 내용, 신청 정보처럼 실제 데이터를 저장해야 하는 순간입니다. 그때 등장하는 도구가 Supabase입니다. 겁먹을 필요는 없습니다. 데이터베이스라는 말이 어렵게 들려도, 처음에는 "엑셀 표처럼 정보를 쌓아 두는 곳"으로 이해하면 충분합니다.

참고

1AI App Builder | Vibe Code Apps & Websites with AI, Fast

2How to Create an Online Course Sales Page: 17 Examples & Funnel Tips

3Plan it with ChatGPT. Build it with Lovable.

4How to Build a Landing Page With Lovable Easily

5How to Build a Landing Page With Lovable Easily

6How to Build a Landing Page With Lovable Easily

책 목록

아무것도 몰라도, 러버블

전체 목차 보기

이 노트는 보도·비평·교육·연구 목적으로 작성되었습니다. 저작권 문의가 있으시면 에서 알려주세요.

틸노트는 사용자가 AI를 활용해 노트를 쉽게 작성하거나 편집할 수 있는 서비스입니다.

AI 스퀘어 단톡방에 함께해요

AI 활용과 틸노트 사용 팁을 나누는 오픈채팅방입니다. 입장 비밀번호는 tilnote입니다.

참여하기