크레딧을 아끼는 프롬프트 작성법

프롬프트는 짧은 주문이 아니라 작업 지시서다

러버블을 처음 열면 누구나 비슷한 유혹을 느낍니다.

"프리랜서 홈페이지 예쁘게 만들어줘."

짧고 편합니다. 마치 능숙한 디자이너에게 한마디만 던지면 알아서 완성해 줄 것 같습니다. 그런데 실제 결과는 종종 애매합니다. 어떤 프리랜서인지, 고객은 누구인지, 문의를 받으려는지 예약을 받으려는지, 포트폴리오가 중요한지 가격표가 중요한지 러버블은 알 수 없습니다. 모르는 부분은 추측으로 채웁니다. 그리고 그 추측이 빗나가면 우리는 다시 말합니다.

"아니, 그게 아니라 좀 더 고급스럽게."

"예약은 빼고 문의만."

"색이 이상한데 더 깔끔하게."

이렇게 수정이 이어지면 초보자는 금방 지칩니다. 무료 크레딧을 쓰는 독자라면 더 아깝게 느껴집니다. 여기서 중요한 사실은 하나입니다. 초보자의 가장 큰 실수는 짧게 묻는 것이 아닙니다. 애매하게 묻는 것입니다.

러버블 공식 문서에서도 좋은 결과를 얻기 위한 기본 원칙으로 명확하고 구체적으로 지시하기, 한 번에 한 기능에 집중하기, 점진적으로 만들기, 디자인을 설명할 때 적절한 분위기 단어를 사용하는 방식을 강조합니다.¹ 결국 프롬프트는 주문이 아니라 작업 지시서입니다. "알아서 예쁘게"가 아니라 "누구를 위해, 무엇을, 어떤 범위까지, 어떤 느낌으로, 무엇은 하지 말고"를 알려주는 문서에 가깝습니다.

다행히 어렵게 생각할 필요는 없습니다. 코딩을 몰라도 됩니다. 대신 러버블에게 줄 말을 조금만 더 정돈하면 됩니다. 앞에서 만든 PRD, 유저 여정, 종이 스케치가 바로 이때 빛을 발합니다. 러버블 안에서 고민하지 않고, 이미 정리한 내용을 프롬프트로 옮기면 됩니다.

첫 생성 프롬프트에 반드시 들어갈 여섯 가지

첫 생성 프롬프트는 프로젝트의 첫 단추입니다. 여기서 방향이 틀어지면 이후 수정이 계속 꼬입니다. 반대로 첫 프롬프트가 좋으면 러버블이 만들어 주는 첫 화면이 꽤 쓸 만한 출발점이 됩니다.

러버블은 자연어로 원하는 것을 설명하면 프로젝트의 시작점을 만들어 주는 방식으로 동작하지만, 공식 FAQ에서도 처음부터 크게 만들기보다 작게 시작해 점진적으로 확장하라고 안내합니다.² 그러므로 첫 프롬프트의 목표는 "완벽한 서비스 전체"가 아니라 "검토 가능한 첫 버전"을 만드는 것입니다.

첫 생성 프롬프트에는 다음 여섯 가지가 들어가야 합니다.

• 앱 또는 웹페이지의 목적

• 대상 사용자

• 페이지 또는 섹션 목록

• 필수 기능

• 디자인 방향

• 반응형 조건

이 여섯 가지가 빠지지 않으면 러버블이 엉뚱한 방향으로 달려갈 가능성이 크게 줄어듭니다.

가장 기본적인 형태는 아래와 같습니다.

나는 [직업/사업 유형]입니다.
[대상 사용자]를 위해 [문제 해결/목표]를 돕는 [웹사이트/랜딩 페이지/간단한 앱]을 만들고 싶습니다.

프로젝트 목적:
- 방문자가 [핵심 행동]을 하도록 유도합니다.

대상 사용자:
- [누가 방문하는지]
- [그들이 가진 고민]
- [그들이 보고 싶어 하는 정보]

이번 MVP 범위:
- 우선 [단일 페이지/몇 개의 페이지]만 만듭니다.
- 지금은 로그인, 결제, 관리자 페이지, 데이터베이스 연동은 만들지 않습니다.

페이지 또는 섹션 구성:
1. [첫 번째 섹션]
2. [두 번째 섹션]
3. [세 번째 섹션]
4. [문의/예약/신청 섹션]

필수 기능:
- [폼 항목]
- 제출 후 성공 메시지 표시
- 버튼 클릭 시 해당 섹션으로 부드럽게 이동

디자인 방향:
- [미니멀/따뜻한/프리미엄/전문적인] 분위기
- 주요 색상은 [색상]
- 버튼은 [둥근 모서리/큰 크기/명확한 대비]
- 여백은 넉넉하고 모바일에서 읽기 쉽게 구성

반응형 조건:
- 모바일 우선으로 구성합니다.
- 모바일에서는 카드와 섹션이 세로로 쌓이게 합니다.
- 데스크톱에서는 중요한 정보가 한눈에 보이도록 넓은 레이아웃을 사용합니다.

주의사항:
- 범위 밖 기능은 만들지 마세요.
- 더미 데이터와 임시 문구를 사용해도 좋지만, 실제 사업자가 바로 수정해 쓸 수 있는 자연스러운 한국어 문구로 작성해 주세요.

이 템플릿은 길어 보이지만 실제로는 시간을 아껴 줍니다. 짧은 프롬프트로 세 번, 네 번 수정하는 것보다 처음에 한 번 제대로 말하는 편이 낫습니다. 특히 무료 사용자는 "일단 만들어 보고 생각하자"보다 "생각은 밖에서 끝내고, 러버블에는 구현만 맡기자"는 태도가 필요합니다.

복붙해서 쓰는 첫 생성 프롬프트 예시

아래 예시는 1인 컨설턴트가 상담 문의를 받기 위한 랜딩 페이지를 만드는 상황입니다. 앞으로의 실전 튜토리얼에서도 비슷한 구조를 계속 응용하게 됩니다.

나는 1인 브랜드 컨설턴트입니다.
초기 창업자와 프리랜서가 자신의 서비스를 더 명확하게 소개하고, 상담 문의를 남기도록 유도하는 단일 랜딩 페이지를 만들고 싶습니다.

프로젝트 목적:
방문자가 내 서비스의 신뢰도를 빠르게 이해하고, 페이지 하단의 상담 신청 폼을 제출하도록 만드는 것입니다.

대상 사용자:
- 개인 사업을 막 시작한 프리랜서
- 인스타그램이나 블로그는 있지만 자신의 서비스를 정리한 웹페이지가 없는 사람
- 브랜딩, 소개 문구, 서비스 구성에 어려움을 느끼는 사람

이번 MVP 범위:
- 단일 랜딩 페이지만 만듭니다.
- 로그인, 결제, 관리자 페이지, 데이터베이스, 캘린더 예약 기능은 만들지 않습니다.
- 상담 신청 폼은 화면에서 입력하고 제출하면 성공 메시지만 보여 주세요. 실제 저장 기능은 나중에 추가합니다.

섹션 구성:
1. Hero 섹션: 핵심 문장, 보조 설명, 상담 신청 버튼
2. 문제 공감 섹션: 대상 사용자가 겪는 어려움 3가지
3. 서비스 소개 섹션: 브랜드 진단, 메시지 정리, 랜딩 페이지 기획 3개 카드
4. 진행 과정 섹션: 신청 → 사전 질문 → 1:1 상담 → 결과 정리
5. 후기 섹션: 더미 후기 3개
6. FAQ 섹션: 가격, 진행 방식, 준비물, 소요 시간 관련 질문
7. 상담 신청 폼 섹션
8. Footer 섹션

상담 신청 폼 필드:
- 이름
- 이메일
- 연락처
- 현재 고민을 선택하는 드롭다운
- 예산 범위 드롭다운
- 자세한 문의 내용 textarea
- 제출 버튼
- 제출 후 "상담 신청이 접수되었습니다. 1~2일 안에 연락드릴게요."라는 성공 메시지 표시

디자인 방향:
- 따뜻하지만 전문적인 분위기
- 배경은 아이보리 또는 매우 밝은 베이지
- 포인트 색상은 딥그린 또는 브라운 계열
- 카드에는 은은한 그림자와 둥근 모서리 적용
- 버튼은 크고 명확하게, 모바일에서도 누르기 쉽게 구성
- 전체적으로 여백을 넉넉하게 사용

반응형 조건:
- 모바일 우선으로 만들어 주세요.
- 모바일에서는 모든 카드가 세로로 쌓이게 해 주세요.
- 데스크톱에서는 서비스 카드와 후기 카드가 3열로 보이게 해 주세요.

주의사항:
- 이번 단계에서는 Supabase, 결제, 로그인, 실제 이메일 발송 기능을 추가하지 마세요.
- 다른 복잡한 기능을 제안하지 말고, 위 범위 안에서 완성도 높은 첫 화면을 만드는 데 집중해 주세요.

이 정도면 러버블은 "무엇을 만들어야 하는지"뿐 아니라 "무엇을 만들지 말아야 하는지"도 알게 됩니다. 이 차이가 큽니다. 초보자는 보통 원하는 기능만 말합니다. 하지만 크레딧을 아끼는 사람은 제외할 기능까지 말합니다.

"예약 페이지도 있으면 좋겠고, 나중에 결제도 붙이고, 관리자도 있으면 좋겠고…"라는 마음은 이해합니다. 하지만 첫 버전에서는 욕심을 줄여야 합니다. 아직 고객 반응도 확인하지 않았는데 복잡한 기능부터 만들면, 나중에 바꾸고 싶은 부분이 생겼을 때 수정 범위가 커집니다. 수정 범위가 커지면 프롬프트도 길어지고, 결과 확인도 어려워집니다.

"예쁘게 해줘" 대신 이렇게 말한다

디자인 프롬프트에서 가장 위험한 말은 "예쁘게"입니다. 사람마다 예쁜 기준이 다릅니다. 어떤 사람에게 예쁜 것은 화려한 애니메이션이고, 어떤 사람에게 예쁜 것은 거의 아무것도 없는 미니멀 디자인입니다. 러버블도 마찬가지입니다. "예쁘게"만 들으면 평균적인 웹사이트 느낌으로 만들어 줄 가능성이 큽니다.

러버블의 프롬프팅 가이드에서는 시각적 방향을 초기에 정하고, "calm", "premium", "minimal", "playful"처럼 분위기를 잡아 주는 단어를 활용하면 디자인 일관성을 높일 수 있다고 설명합니다.³ 한국어로 요청해도 괜찮지만, 필요하다면 영어 분위기 단어를 함께 넣어도 좋습니다.

아래처럼 바꿔 말해 보세요.

디자인을 구체화할 때는 색상, 톤, 여백, 버튼, 카드, 타이포그래피를 말하면 좋습니다. 타이포그래피는 글자의 모양과 크기, 굵기, 줄 간격을 다루는 디자인 요소입니다. 초보자는 "폰트 예쁘게"라고 말하기보다 "제목은 크고 굵게, 본문은 읽기 쉽게, 줄 간격은 넉넉하게"라고 말하면 충분합니다.

참고 분위기를 말하는 것도 도움이 됩니다. 다만 특정 사이트를 그대로 베껴 달라고 요청하기보다는 "토스처럼 깔끔한 금융 서비스 느낌", "애플 제품 소개 페이지처럼 여백이 넓고 메시지가 선명한 느낌", "작은 스튜디오 브랜드처럼 따뜻하고 인간적인 느낌"처럼 방향만 설명하는 편이 좋습니다. 목적은 복제가 아니라 의도 전달입니다.

스케치와 이미지를 함께 쓰면 추측이 줄어든다

이전 단계에서 종이에 화면을 그렸다면, 그것은 훌륭한 프롬프트 재료입니다. 러버블은 디자인 참고 이미지, 화면 스케치, UI 문제를 보여 주는 스크린샷을 프롬프트에 함께 사용할 수 있다고 안내합니다.² 말로 설명하기 어려운 레이아웃은 사진 한 장이 훨씬 빠를 때가 많습니다.

예를 들어 종이에 이런 식으로 그렸다고 해 봅시다. 맨 위에는 큰 제목과 버튼, 그 아래에는 서비스 카드 3개, 그 아래에는 진행 과정, 마지막에는 문의 폼이 있습니다. 이때 프롬프트에 이미지를 첨부하고 이렇게 말하면 됩니다.

첨부한 종이 스케치를 기준으로 단일 랜딩 페이지를 만들어 주세요.
스케치의 섹션 순서는 유지하되, 실제 웹사이트처럼 정돈된 디자인으로 구현해 주세요.
모바일에서는 모든 섹션이 세로로 자연스럽게 쌓이게 하고, 데스크톱에서는 서비스 카드 3개가 한 줄에 보이게 해 주세요.
디자인은 따뜻하고 전문적인 1인 컨설팅 브랜드 느낌으로 만들어 주세요.

스크린샷도 쓸 수 있습니다. 러버블이 만든 화면에서 "이 부분이 이상한데 어떻게 말해야 할지 모르겠다" 싶으면, 해당 부분을 캡처해서 첨부하세요. 그리고 "빨간색으로 표시한 영역의 카드 간격만 조정해 주세요. 다른 섹션은 변경하지 마세요"라고 말하면 됩니다.

초보자는 말로 모든 것을 설명하려다가 지칩니다. 스케치, 캡처, 참고 이미지가 있으면 러버블이 추측해야 하는 양이 줄어듭니다. 추측이 줄어들면 수정 횟수도 줄어듭니다.

한 번에 열 가지를 고치지 않는다

러버블을 쓰다 보면 고치고 싶은 부분이 한꺼번에 보입니다. 제목도 바꾸고 싶고, 버튼 색도 마음에 안 들고, 모바일도 깨져 있고, 문의 폼 항목도 추가하고 싶고, FAQ도 더 넣고 싶습니다. 그래서 이렇게 말하고 싶어집니다.

전체적으로 더 좋게 만들고, 모바일도 고치고, 폼도 수정하고, 색도 바꾸고, 문구도 다듬고, FAQ도 추가해 줘.

이런 요청은 사람에게도 어렵습니다. 디자이너, 기획자, 개발자, 카피라이터가 해야 할 일을 한 문장에 섞어 놓은 셈입니다. 러버블이 어느 부분을 우선해야 하는지 판단하기 어렵고, 예상보다 많은 파일과 컴포넌트를 건드릴 수 있습니다.

크레딧을 아끼려면 "한 번에 하나의 작은 점"만 고치라는 뜻은 아닙니다. 너무 작은 수정만 반복해도 비효율적입니다. 핵심은 같은 종류의 수정끼리 묶고, 서로 다른 종류의 수정은 나누는 것입니다.

예를 들어 상담 신청 랜딩 페이지를 다듬는다면 이런 순서가 좋습니다.

1. 먼저 기능을 확인합니다. 버튼이 이동하는지, 폼이 입력되는지, 성공 메시지가 뜨는지 봅니다.

2. 그다음 문구를 다듬습니다. 제목, 설명, FAQ, 버튼 문구를 한 번에 정리합니다.

3. 그다음 디자인을 다듬습니다. 색상, 카드, 여백, 버튼 스타일을 조정합니다.

4. 그다음 반응형을 확인합니다. 모바일, 태블릿, 데스크톱에서 깨지는 부분을 고칩니다.

5. 마지막으로 오류를 고칩니다. 콘솔 에러, 제출 오류, 화면 깨짐을 따로 다룹니다.

이렇게 나누면 각 프롬프트의 목적이 분명해집니다. 러버블도 "이번에는 문구만 바꾸는구나", "이번에는 디자인만 바꾸는구나", "이번에는 모바일 레이아웃만 고치는구나"라고 이해하기 쉽습니다.

좋은 수정 프롬프트는 보통 아래 구조를 따릅니다.

수정 위치:
[어느 페이지/어느 섹션/어느 버튼]

현재 문제:
[지금 무엇이 마음에 들지 않는지]

원하는 변경:
[어떻게 바꾸고 싶은지]

범위 제한:
[무엇은 건드리지 말아야 하는지]

완료 기준:
[수정이 잘 되었는지 확인할 기준]

이 구조를 익히면 "왜 자꾸 이상하게 바뀌지?"라는 일이 줄어듭니다. 러버블이 천재처럼 알아듣기를 기대하는 대신, 실수할 틈을 줄여 주는 방식입니다.

수정 요청에는 반드시 울타리를 친다

러버블에게 수정 요청을 할 때 가장 중요한 습관은 범위 제한입니다. 범위 제한은 "여기까지만 해"라고 울타리를 치는 일입니다.

특히 이미 마음에 드는 부분이 있다면 반드시 지켜야 합니다. 초보자는 보통 바꾸고 싶은 것만 말합니다.

문의 폼을 더 예쁘게 해줘.

이렇게 말하면 러버블은 문의 폼뿐 아니라 주변 섹션, 버튼, 전체 색상, 심지어 레이아웃까지 함께 바꿀 수 있습니다. 그러면 원래 마음에 들었던 부분이 사라질 수 있습니다.

대신 이렇게 말합니다.

상담 신청 폼 섹션의 시각적 디자인만 개선해 주세요.
기존 폼 필드, 제출 동작, 성공 메시지, 페이지 이동 기능은 변경하지 마세요.
현재 전체 색상 팔레트와 폰트 분위기는 유지해 주세요.
폼 카드의 여백, 입력창 높이, 버튼 정렬, 안내 문구의 가독성만 개선해 주세요.
다른 섹션은 건드리지 마세요.

러버블의 프롬프팅 자료에서도 특정 페이지나 기능을 수정할 때 관련 없는 페이지를 바꾸지 말라고 명시하는 방식이 유용하다고 설명합니다.⁴ 코드를 모르는 초보자에게도 이 습관은 매우 중요합니다. 파일 이름을 몰라도 괜찮습니다. 페이지 이름, 섹션 이름, 버튼 이름처럼 눈에 보이는 단위로 말하면 됩니다.

자주 쓰는 범위 제한 문장은 통째로 외워 두어도 좋습니다.

이 변경은 [페이지/섹션]에만 적용해 주세요.

현재 스타일과 레이아웃의 큰 방향은 유지해 주세요.

기존 기능, 데이터 흐름, 라우팅은 변경하지 마세요.

로그인, 결제, 데이터베이스 같은 새 기능은 추가하지 마세요.

다른 페이지나 섹션은 건드리지 말고, 요청한 부분만 수정해 주세요.

이 문장들은 단순하지만 강력합니다. 초보자에게 필요한 것은 멋진 개발 용어가 아니라, 러버블이 마음대로 확장하지 못하게 잡아 주는 안전장치입니다.

좋은 프롬프트와 나쁜 프롬프트 비교하기

같은 프로젝트라도 프롬프트에 따라 결과가 크게 달라집니다. 예를 들어 "프리랜서 포트폴리오와 문의 페이지"를 만든다고 해 봅시다.

나쁜 첫 프롬프트는 이렇습니다.

프리랜서 포트폴리오 사이트 만들어줘. 예쁘고 깔끔하게. 문의도 받을 수 있게 해줘.

이 프롬프트가 나쁜 이유는 짧아서가 아닙니다. 판단에 필요한 정보가 거의 없기 때문입니다. 어떤 프리랜서인지 모릅니다. 디자이너인지, 개발자인지, 마케터인지, 사진작가인지 알 수 없습니다. 포트폴리오가 이미지 중심인지 텍스트 중심인지도 모릅니다. 문의 폼에 어떤 항목이 필요한지도 없습니다. "예쁘고 깔끔하게"는 방향이 너무 넓습니다.

조금 더 나아 보이지만 여전히 위험한 프롬프트도 있습니다.

프리랜서 디자이너 포트폴리오 사이트를 만들어줘. 메인, 작업물, 소개, 문의 페이지가 있으면 좋겠어. 세련되게 만들어줘.

이번에는 직업과 페이지가 생겼습니다. 하지만 여전히 부족합니다. 작업물 카드는 몇 개인지, 문의 폼 항목은 무엇인지, 디자인 톤은 어떤지, 모바일에서는 어떻게 보여야 하는지, 어떤 기능은 제외할지 알 수 없습니다. 결과가 아주 나쁘지는 않겠지만, 수정이 많이 필요할 가능성이 큽니다.

좋은 프롬프트는 이렇게 바뀝니다.

나는 1인 브랜드 디자이너입니다.
소규모 브랜드 대표와 개인 사업자가 내 작업 스타일을 확인하고, 프로젝트 문의를 남길 수 있는 포트폴리오 웹사이트를 만들고 싶습니다.

이번 MVP 범위:
- 홈, 포트폴리오, 소개, 문의 총 4개 페이지를 만듭니다.
- 로그인, 회원가입, 결제, 관리자 페이지, 데이터베이스 연동은 만들지 않습니다.
- 포트폴리오 데이터는 더미 데이터로 넣어 주세요.

페이지 구성:
1. 홈
- Hero 섹션: "작은 브랜드를 선명하게 보이게 만드는 디자인"이라는 헤드라인
- 대표 작업 3개 미리보기
- 작업 방식 요약
- 문의 페이지로 이동하는 CTA 버튼

2. 포트폴리오
- 작업물 카드 6개
- 각 카드에는 이미지 영역, 프로젝트명, 업종, 작업 범위, 짧은 설명 포함
- 카드 클릭 시 상세 모달 또는 상세 영역이 열리게 구성

3. 소개
- 디자이너 소개 문단
- 잘하는 작업 3가지
- 협업 방식과 진행 원칙

4. 문의
- 이름, 이메일, 브랜드명, 필요한 작업, 예산 범위, 문의 내용을 입력하는 폼
- 제출 후 성공 메시지 표시
- 실제 이메일 발송이나 데이터 저장은 지금 구현하지 않음

디자인 방향:
- 미니멀하고 프리미엄한 분위기
- 흰색 배경, 검정 텍스트, 포인트 색상은 딥블루
- 큰 제목, 넉넉한 여백, 얇은 구분선 사용
- 카드에는 과한 그림자보다 절제된 border 사용
- 버튼은 선명한 대비와 충분한 높이를 갖도록 구성

반응형 조건:
- 모바일 우선으로 구현
- 모바일에서는 포트폴리오 카드가 1열
- 태블릿에서는 2열
- 데스크톱에서는 3열
- 문의 폼은 모바일에서도 입력하기 편하게 필드 높이와 간격을 충분히 확보

주의사항:
- 이번 단계에서는 복잡한 애니메이션을 넣지 마세요.
- Supabase나 외부 API를 연결하지 마세요.
- 우선 사용자가 둘러보고 문의를 남길 수 있는 정적인 MVP를 만드는 데 집중해 주세요.

이 프롬프트는 러버블에게 일감을 많이 주는 것처럼 보이지만, 실제로는 판단 부담을 줄여 줍니다. 목적, 대상, 페이지, 기능, 디자인, 제외 범위가 모두 들어 있기 때문입니다. 러버블이 마음대로 "회원가입도 있으면 좋겠네", "관리자 페이지도 필요하겠네", "예약 캘린더도 넣어 볼까" 하고 확장할 여지가 줄어듭니다.

초보자에게 좋은 프롬프트란 어려운 기술 용어가 가득한 문장이 아닙니다. 러버블이 추측하지 않아도 되는 문장입니다.

기능 수정 프롬프트: 한 가지 흐름만 고친다

기능을 수정할 때는 "무엇이 작동해야 하는지"를 분명히 말해야 합니다. 기능은 디자인보다 더 조심해야 합니다. 버튼 하나를 바꿨는데 제출 동작이 깨질 수도 있고, 폼 항목을 추가했는데 성공 메시지가 사라질 수도 있습니다.

예를 들어 상담 신청 폼에 "희망 상담 방식"을 추가하고 싶다면 이렇게 말합니다.

문의 페이지의 상담 신청 폼에만 새 필드를 추가해 주세요.

추가할 필드:
- 희망 상담 방식 드롭다운
- 옵션: 온라인 화상 상담, 전화 상담, 이메일 상담
- 기본 placeholder: "상담 방식을 선택해 주세요"

범위 제한:
- 기존 이름, 이메일, 연락처, 문의 내용 필드는 유지해 주세요.
- 기존 제출 버튼과 성공 메시지 동작은 변경하지 마세요.
- 다른 페이지나 섹션은 수정하지 마세요.
- 데이터베이스 저장 기능은 추가하지 마세요.

완료 기준:
- 사용자가 희망 상담 방식을 선택할 수 있어야 합니다.
- 모바일에서도 드롭다운이 잘 보여야 합니다.
- 폼 제출 후 기존 성공 메시지가 그대로 표시되어야 합니다.

여기서 중요한 것은 "필드 하나 추가"라는 작은 작업 안에서도 범위를 명확히 했다는 점입니다. 기존 필드 유지, 제출 동작 유지, 다른 페이지 수정 금지, 데이터베이스 추가 금지를 모두 말했습니다.

러버블은 우리가 말하지 않은 부분을 선의로 개선하려고 할 때가 있습니다. 하지만 무료 크레딧을 아끼는 입장에서는 그 선의가 가끔 부담이 됩니다. 지금 필요한 것은 창의적 확장이 아니라 정확한 변경입니다.

디자인 수정 프롬프트: 기능을 건드리지 말라고 못 박는다

디자인 수정에서는 "기능 변경 없음"을 꼭 넣어야 합니다. 버튼 색을 바꾸려다가 버튼 동작이 바뀌면 곤란합니다. 문의 폼을 예쁘게 만들려다가 입력 필드 이름이 달라지면 나중에 연결할 때 헷갈립니다.

아래 프롬프트를 그대로 가져다 써도 됩니다.

홈페이지의 Hero 섹션 디자인만 개선해 주세요.

현재 문제:
- 첫 화면이 조금 밋밋합니다.
- 제목과 버튼은 있지만 브랜드의 전문성이 잘 느껴지지 않습니다.

원하는 변경:
- 제목의 크기와 굵기를 키워 더 강한 첫인상을 주세요.
- 보조 설명 문장은 읽기 쉽게 줄 간격을 넉넉하게 조정해 주세요.
- CTA 버튼은 더 눈에 띄게 만들되, 현재 포인트 색상은 유지해 주세요.
- 배경에는 아주 은은한 그라데이션이나 장식 요소를 추가해도 좋습니다.

범위 제한:
- Hero 섹션 안의 디자인만 수정해 주세요.
- 버튼의 이동 기능은 변경하지 마세요.
- 다른 섹션의 레이아웃, 색상, 문구는 변경하지 마세요.
- 새로운 기능이나 페이지를 추가하지 마세요.

완료 기준:
- 모바일 첫 화면에서 제목, 설명, 버튼이 자연스럽게 보여야 합니다.
- 데스크톱에서는 여백이 넉넉하고 프리미엄한 느낌이 나야 합니다.

이렇게 말하면 러버블은 "시각적 개선"이라는 범위를 이해합니다. 기능과 로직을 건드리지 말라는 문장을 넣었기 때문에 예기치 않은 변경 가능성도 줄어듭니다.

문구 수정 프롬프트: 카피만 따로 다듬는다

문구 수정은 러버블 안에서 바로 해도 되지만, 크레딧을 아끼고 싶다면 ChatGPT나 Gemini 같은 외부 AI에서 먼저 다듬는 편이 더 좋습니다. 러버블 자체도 ChatGPT에서 아이디어를 구체화한 뒤 Lovable로 실제 앱과 웹사이트를 만들 수 있는 흐름을 소개하고 있습니다.⁵

외부 AI에게 먼저 이렇게 요청해 보세요.

아래 랜딩 페이지 문구를 1인 브랜드 컨설턴트의 웹사이트에 어울리게 다듬어 주세요.
조건:
- 너무 과장된 표현은 피합니다.
- 초보 개인 사업자가 이해하기 쉽게 씁니다.
- 신뢰감 있고 따뜻한 톤을 유지합니다.
- Hero 제목 3개, 보조 설명 3개, CTA 버튼 문구 5개를 제안해 주세요.

현재 문구:
[현재 러버블이 만든 문구 붙여넣기]

그다음 마음에 드는 문구를 고른 뒤 러버블에는 이렇게 말합니다.

문구만 교체해 주세요. 디자인, 레이아웃, 기능은 변경하지 마세요.

Hero 제목:
[새 제목]

Hero 보조 설명:
[새 설명]

CTA 버튼 문구:
[새 버튼 문구]

적용 범위:
- 홈 Hero 섹션에만 적용
- 다른 섹션의 문구는 변경하지 않음
- 버튼의 이동 기능은 그대로 유지

문구 수정은 겉보기에는 사소하지만, 러버블이 전체 컴포넌트를 다시 만지게 되면 예상치 못한 변화가 생길 수 있습니다. 그러므로 "문구만"이라는 말을 아끼지 마세요.

오류 수정 프롬프트: 감정 대신 증거를 준다

오류가 나면 당황스럽습니다. 특히 코딩을 모르는 사람은 빨간 에러 메시지만 봐도 "망했다"는 생각이 듭니다. 이때 가장 나쁜 프롬프트는 이것입니다.

안 돼. 고쳐줘.

무엇이 안 되는지, 언제 안 되는지, 원래는 어떻게 되어야 하는지 정보가 없습니다. 러버블이 원인을 넓게 추측해야 하므로 수정 범위가 커질 수 있습니다.

오류 수정 프롬프트는 감정이 아니라 증거를 주는 방식으로 작성합니다.

문의 페이지에서 폼 제출 기능에 문제가 있습니다.

재현 단계:
1. 문의 페이지로 이동합니다.
2. 이름, 이메일, 문의 내용을 입력합니다.
3. 제출 버튼을 클릭합니다.

현재 동작:
- 버튼을 눌러도 성공 메시지가 표시되지 않습니다.
- 화면상 변화가 없습니다.

기대 동작:
- 제출 버튼 클릭 후 "상담 신청이 접수되었습니다."라는 성공 메시지가 보여야 합니다.
- 입력값은 그대로 두거나 초기화해도 괜찮지만, 사용자가 제출이 완료되었다는 것을 알 수 있어야 합니다.

범위 제한:
- 문의 폼 제출 동작만 수정해 주세요.
- 디자인은 변경하지 마세요.
- 다른 페이지는 수정하지 마세요.
- 데이터베이스나 이메일 발송 기능을 새로 추가하지 마세요.

이렇게 쓰면 러버블이 문제를 좁혀서 볼 수 있습니다. "재현 단계"는 사용자가 어떤 순서로 클릭했는지 알려주는 설명입니다. 개발자들이 오류를 찾을 때 가장 중요하게 보는 정보 중 하나입니다. 코드를 몰라도 재현 단계는 쓸 수 있습니다. 내가 한 행동을 순서대로 적으면 됩니다.

오류 메시지가 화면에 보이면 그대로 복사해서 붙여 넣으세요. 영어 에러여도 괜찮습니다. 스크린샷이 있으면 함께 첨부하면 더 좋습니다. 중요한 것은 "안 된다"가 아니라 "이 상황에서 이렇게 했더니 이렇게 되었다"입니다.

큰 변경은 바로 구현하지 말고 계획부터 받는다

가끔은 작은 수정이 아니라 큰 변경이 필요합니다. 예를 들어 단순 문의 폼이었던 페이지에 예약 시간 선택 기능을 넣고 싶을 수 있습니다. 또는 정적인 포트폴리오에 관리자 페이지를 추가하고 싶을 수도 있습니다.

이런 요청은 바로 구현시키면 위험합니다. 관련된 페이지와 데이터 구조가 많아질 수 있기 때문입니다. 러버블 공식 프롬프팅 가이드에서도 복잡한 기능은 먼저 질문을 받거나 계획을 세우는 방식이 오해와 낭비를 줄이는 데 도움이 된다고 안내합니다.³

큰 변경을 하고 싶을 때는 이렇게 말하세요.

아직 코드를 수정하지 말고, 먼저 구현 계획만 제안해 주세요.

목표:
현재 상담 신청 랜딩 페이지에 간단한 예약 시간 선택 기능을 추가하고 싶습니다.

조건:
- 무료 사용자 기준으로 크레딧을 아끼고 싶습니다.
- 처음에는 실제 캘린더 연동 없이, 사용자가 희망 날짜와 시간대를 선택하는 수준이면 됩니다.
- 로그인, 결제, 관리자 페이지는 아직 필요 없습니다.

요청:
1. 가장 작은 MVP 범위로 구현하는 방법을 제안해 주세요.
2. 어떤 화면과 폼 필드가 추가되어야 하는지 알려 주세요.
3. 지금 구현하지 말아야 할 기능도 구분해 주세요.
4. 구현 전에 내가 결정해야 할 질문이 있다면 먼저 물어봐 주세요.

중요:
- 이 메시지에서는 코드 변경을 하지 마세요.
- 계획을 확인한 뒤 다음 메시지에서 구현을 요청하겠습니다.

이 방식은 답답해 보일 수 있지만 실제로는 안전합니다. 러버블이 바로 코드를 고치지 않고 먼저 계획을 제안하면, 우리는 "아, 이건 너무 크다", "이 정도면 괜찮다", "이 기능은 다음에 하자"를 판단할 수 있습니다.

무료 크레딧을 쓰는 사람에게 가장 비싼 말은 "일단 해줘"입니다. 가장 경제적인 말은 "먼저 계획만 보여줘"입니다.

외부 AI로 러버블 프롬프트를 미리 다듬기

러버블 안에서 프롬프트를 다듬으며 대화하면 그 과정도 결국 러버블 사용 시간이 됩니다. 그러므로 첫 프롬프트는 외부 AI에서 미리 완성해 가져오는 편이 좋습니다. ChatGPT, Gemini, Claude 같은 언어 모델을 이용해 러버블용 프롬프트를 정리하면 됩니다.

아래 프롬프트를 외부 AI에 넣어 보세요.

너는 Lovable.dev에서 웹사이트를 만드는 초보자를 돕는 기획자이자 프롬프트 작성자야.
아래 정보를 바탕으로 Lovable에 바로 붙여 넣을 수 있는 첫 생성 프롬프트를 만들어 줘.

조건:
- 코딩을 모르는 무료 사용자 기준으로 작성해 줘.
- 크레딧을 아끼기 위해 MVP 범위를 작게 잡아 줘.
- 로그인, 결제, 관리자 페이지, 데이터베이스 연동은 필요할 때만 넣고, 기본적으로 제외해 줘.
- 앱 목적, 대상 사용자, 페이지/섹션 목록, 필수 기능, 디자인 방향, 반응형 조건, 제외 기능, 완료 기준을 포함해 줘.
- Lovable이 추측하지 않도록 구체적으로 써 줘.
- 너무 기술적인 구현 방식보다 사용자가 원하는 결과 중심으로 써 줘.

내 아이디어:
[여기에 내 웹사이트 아이디어 입력]

내 대상 고객:
[대상 고객 입력]

필요한 기능:
[필요한 기능 입력]

원하는 디자인 분위기:
[디자인 분위기 입력]

제외하고 싶은 기능:
[제외 기능 입력]

외부 AI가 만들어 준 프롬프트를 그대로 믿고 붙여 넣기보다는 한 번 더 점검하세요. 특히 "로그인", "결제", "관리자", "데이터베이스", "실시간", "AI 자동화" 같은 단어가 들어갔다면 정말 지금 필요한지 확인해야 합니다. 멋있어 보이는 기능일수록 초반에는 비용과 복잡도를 키울 수 있습니다.

외부 AI에게 한 번 더 이렇게 시켜도 좋습니다.

방금 만든 Lovable 프롬프트를 무료 사용자 기준으로 더 작고 안전한 MVP 범위로 줄여 줘.
반드시 지금 만들 기능과 나중에 만들 기능을 구분해 줘.
Lovable에서 크레딧을 낭비할 수 있는 애매한 표현을 찾아 더 구체적인 표현으로 바꿔 줘.

이 과정은 러버블 크레딧을 쓰지 않고도 할 수 있는 예행연습입니다. 러버블에 들어가기 전에 말이 정리되어 있으면, 러버블 안에서는 구현에 집중할 수 있습니다.

크레딧 절약형 프롬프트 점검표

러버블에 프롬프트를 보내기 직전, 아래 질문에 답해 보세요. 하나라도 "아니요"라면 보내기 전에 조금 더 다듬는 편이 좋습니다.

• 이 웹사이트가 누구를 위한 것인지 분명한가?

• 방문자가 해야 할 핵심 행동이 정해져 있는가?

• 이번에 만들 페이지나 섹션 범위가 정해져 있는가?

• 지금 만들지 않을 기능을 명시했는가?

• 디자인 분위기를 색상, 여백, 버튼, 카드 스타일로 설명했는가?

• 모바일에서 어떻게 보여야 하는지 적었는가?

• 수정 요청이라면 적용 범위와 건드리지 말아야 할 부분을 썼는가?

• 오류 수정이라면 재현 단계와 기대 동작을 적었는가?

• 큰 변경이라면 바로 구현하지 말고 계획부터 요청했는가?

이 점검표는 단순하지만 강력합니다. 프롬프트를 보내기 전에 1분만 확인해도 불필요한 왕복을 줄일 수 있습니다. 왕복이 줄어들면 크레딧도 아끼고, 마음도 덜 지칩니다.

프롬프트 실력은 곧 제작 속도다

러버블을 잘 쓰는 사람은 마법 같은 문장을 아는 사람이 아닙니다. 자신이 원하는 결과를 작게 나누고, 구체적으로 설명하고, 불필요한 범위를 막는 사람입니다.

"예쁘게 만들어줘"는 쉽지만 위험합니다.

"1인 브랜드 컨설턴트를 위한 상담 신청 랜딩 페이지를 만들고, 로그인과 결제는 제외하고, 모바일 우선으로, 따뜻하고 전문적인 디자인으로, 상담 신청 폼은 이름·이메일·고민·예산·문의 내용만 받게 해줘"는 조금 길지만 안전합니다.

초보자에게 필요한 것은 완벽한 개발 지식이 아닙니다. 러버블이 헷갈리지 않도록 말하는 습관입니다. 프롬프트가 선명해질수록 결과물도 선명해집니다. 그리고 결과물이 선명해질수록, 우리는 더 적은 수정으로 더 빨리 사람들에게 보여 줄 수 있습니다.

다음 프로젝트를 시작할 때는 짧은 주문을 던지지 마세요. 작은 작업 지시서를 건네세요. 러버블은 그때부터 훨씬 더 좋은 파트너가 됩니다.

참고

¹FAQ - Lovable Documentation

²FAQ - Lovable Documentation

³Prompting best practices - Lovable Documentation

⁴The Lovable Prompting Bible - Lovable

⁵Plan it with ChatGPT. Build it with Lovable.