좋은 프롬프트 작성법

Setherion이 무언가를 만들어 주려고 글을 잘 쓸 필요는 없어요. 다만 원하는 것을 분명하게, 바꾸고 싶은 것은 더 분명하게 말해야 해요.

아래 내용은 모두 규칙이 아니라 들여 두면 좋은 습관이에요. 필수인 것은 없고, 평범한 문장 한 줄로도 충분해요.

무엇인지, 누구를 위한 것인지 말하기

첫 문장이 무엇이 만들어질지를 정해요. 첫 문장에서는 세 가지를 읽어요. 어떤 종류인지, 무엇에 관한 것인지, 꼭 있어야 하는 것이 무엇인지예요.

입력창 위의 줄에 있는 Website, Web App, Mobile App, Landing Page, 3D Game, SaaS는 한 번 누르는 것만으로 같은 역할을 해요. 내 문장이 그중 둘 이상으로 읽힐 수 있을 때 쓰세요. “의료 센터를 위한 웹사이트”는 환자를 위한 사이트일 수도 있고 직원이 일하는 화면일 수도 있는데, 그 표시가 그것을 정해 줘요.

원하는 부분의 이름 말하기

앱은 아이디어로 요청하는 것보다 부분의 목록으로 요청하는 편이 쉬워요. 이름을 붙인 것은 모두 만들어져요. 빼놓은 것은 짐작으로 채워지는데, 그 짐작은 대개 무난하지만 어디까지나 짐작이에요.

A landing page for a coffee shop, with the menu, the opening hours,
photos of the place, a map, and a form for table reservations

각 부분이 어떻게 생겼는지까지 설명할 필요는 없어요. “갤러리”라고만 써도 충분해요. “컴퓨터에서는 세 열, 휴대폰에서는 한 열인 갤러리”는 이미 기본으로 일어나는 일이에요.

한 번에 하나씩 바꾸기

변경은 지금의 앱을 기준으로 이해되니 짧아도 돼요. “헤더를 어둡게 해 주세요”만으로 완전한 요청이에요.

서로 관계없는 여러 변경을 한 메시지에 담으면, 같은 변경을 하나씩 차례로 보낼 때보다 제대로 되기가 더 어려워요. 게다가 잘못 나왔을 때 어느 부분이 원인인지 알 수 없어요. 따로따로 보내세요.

하나의 메시지에 모든 것을 담는 대신:

Make the header dark, add a reservation button, change the font,
add a gallery and translate it into German

세 번에 나눠 보내고, 그 사이마다 앱을 살펴보세요.

Make the header dark
Add a Reserve a table button in the header
Add a photo gallery under the menu

가리켜서 알려 주기

“그 버튼” 같은 말은 그것만으로는 아무 뜻이 없고, 어디에 있는지 설명하는 것보다 더 빠른 방법이 있어요.

• 미리보기의 Edit: 글자나 사진을 클릭해서 바로 바꿔요. 요청은 필요 없어요.
• 미리보기 위의 상자는 지금 보고 있는 섹션의 이름을 알려 주고, 다른 섹션으로도 이동하게 해 줘요. 요청에 섹션 이름을 쓰면 그 부분을 말하고 있다는 뜻이 전달돼요.
• 코드에서는 몇 줄을 선택해 메시지와 함께 보내세요. 그 줄이 메시지에 붙어서 가므로 “목록이 비어 있을 때 이 부분이 잘못 동작해요”라고만 해도 충분해요.
• 코드를 미리보기 옆에 두고(Split view) 포인터를 켠 뒤, 미리보기에서 아무 곳이나 클릭하세요. 그 요소를 만드는 줄에서 파일이 열리고, 첨부할 준비가 돼요. 코드를 참고하세요.
• Code 보기의 사진에서는 Draw가 빨간색으로 표시해 무엇을 말하는지 보여 주고, Add to chat이 다음 메시지와 함께 보내 줘요.

보여 주면서 설명하기

입력창 옆의 + 버튼으로 사진이나 문서 등을 가져올 수 있어요.

• Upload a file: 스크린샷이나 디자인 사진을 올리면 앱이 그 모습을 닮게 만들어져요. 메뉴, 가격표, 카탈로그를 PDF, Word, 텍스트, Markdown, CSV, JSON 파일로 올리면, 그 안의 내용이 지어낸 것이 아니라 그대로 앱에 들어가요. 올린 뒤 썸네일을 클릭하면 빌더가 그것을 어떻게 이해했는지 볼 수 있어요.
• Import from Figma는 이미 가지고 있는 디자인용이에요. 그 프레임 하나로 앱을 만들어요. Import from Canva는 디자인의 페이지를 이미지로 가져와, 앱에 배치할 수 있게 해 줘요.
• Import an app: Lovable, Bolt, v0, Base44, GitHub, ZIP, 스프레드시트 등 다른 곳에서 만든 앱을 Setherion이 여기서 다시 만들어요. 이 메뉴는 대시보드에 있어요. 앱 가져오기를 참고하세요.
• Connectors: 이 앱이 쓸 수 있는 서비스예요. 결제나 이메일 같은 것이에요. Skills: 로그인이나 예약처럼 앱에 넣을 수 있는 기능이에요. 커넥터와 Skills를 참고하세요.
• Connect your repo는 대시보드의 GitHub project 아래에 있어요. GitHub에 한 번 로그인하면, 유료 요금제에서 에디터에서 코드를 푸시할 수 있어요.

에디터에서는 메뉴가 조금 달라요. Upload file, Media AI(이미지나 동영상을 만들어 앱에 넣어 줘요. 미디어와 디자인 도구를 참고하세요), Design(Figma와 Canva), Connectors, Skills예요.

입력하는 대신 말하기

Build 버튼 옆의 마이크는 말하는 것을 받아 적어요. 말하는 동안 말이 입력창에 나타나고, 멈추려면 다시 누르세요. 내용을 읽어 보고, 원하면 고친 다음 보내세요. 브라우저 자체의 언어로 작동해요. Build, Chat, Plan을 참고하세요.

보여 주는 편이 보통 모습을 말로 설명하는 것보다 빠르고, 내 콘텐츠를 처음 만드는 앱에 넣을 수 있는 유일한 방법이기도 해요.

내 언어로 쓰기

말하는 대로 쓰세요. Setherion은 요청이 어느 언어인지 읽고, 앱도 그 언어로 만들어져요. 버튼, 제목, 페이지의 글이 모두 그 언어가 돼요.

루마니아어, 영어, 스페인어, 프랑스어, 독일어, 이탈리아어, 포르투갈어, 네덜란드어, 폴란드어, 그리고 중국어, 일본어, 한국어, 러시아어, 아랍어, 히브리어, 그리스어 글자로 쓴 것은 모두 인식돼요. 쓰고 있는 언어와 다른 언어로 앱을 원한다면 그렇게 말하세요. 요청 끝에 “영어로”라고만 써도 충분해요.

앱이 항상 따르는 규칙

매번 반복하지 않아도 되는 것들이 있어요. 에디터에서 AI Controls는 모델 목록의 맨 아래에 있어요. 입력창 옆의 모델 버튼, 즉 Auto라고 적힌 버튼을 누르세요. 여기에는 두 가지가 들어 있어요.

• Custom instructions: 이 앱을 만들고 바꿀 때마다 따르는 규칙이에요. “다크 테마를 유지해 주세요”, “주황색은 쓰지 마세요”, “모든 가격을 파운드로 표시해 주세요”, “글을 격식 있게 써 주세요” 같은 것이에요.
• Freeze Files: 어떤 것도 건드릴 수 없는 파일이에요. 딱 마음에 드는 페이지를 고정해 두면, 다음 변경이 그것을 되돌릴 수 없어요.

둘에 대한 설명은 AI 설정을 참고하세요.

무엇을 원하는지 확실하지 않을 때

바로 그런 때를 위한 모드가 두 가지 있어요.

• Plan은 대시보드와 에디터의 Build 버튼 뒤에 있고, 파일을 하나도 쓰기 전에 몇 가지 간단한 질문을 하고 앱의 지도를 보여 줘요. 끝까지 생각해 두지 않은 것이라면 해 볼 만해요. Alt+P를 누르면 메뉴를 열지 않고 다음 모드로 바뀌어요.
• Chat은 에디터에 있고, 앱에 대해 이야기하기만 할 뿐 코드는 절대 건드리지 않아요. “이 페이지에 무엇을 추가하면 좋을까요?”나 “폼이 왜 맨 아래에 있나요?”라고 물어도 앱에는 아무 일도 일어나지 않아요.

결과가 잘못 나왔을 때

잘못되었다고만 하지 말고, 무엇이 잘못되었는지 말하세요. “폼이 전송되지 않아요”는 보고이고, “폼에는 보냈다고 나오는데 아무것도 도착하지 않아요”는 고칠 수 있는 이야기예요.

변경 때문에 오히려 나빠졌다면 그것도 말하세요. “그 변경 전의 모습으로 메뉴를 되돌려 주세요”라고 해도 이해해요.