# 2. 사용자 의뢰 양식

모든 항목을 채울 필요는 없습니다.

내용이 충분하다면 AI가 페이지 성격과 레이아웃을 판단하도록 두는 것을 권장합니다.

```text
[페이지 기본 정보]

페이지 목적:
브랜드 / 서비스 이름:
대상 사용자:
핵심 메시지:


[페이지 내용]

아래에 실제 페이지에 들어갈 내용을 자유롭게 작성하세요.

제목, 본문, 섹션 이름, 목록 등 형식은 자유입니다.
내용의 중요도와 페이지 구성은 AI가 판단해도 됩니다.

내용:
(여기에 페이지 내용을 붙여 넣으세요)


[이미지]

사용할 이미지가 있다면 이미지마다 어떤 장면인지 적어주세요.

예:
- 메인 이미지: 야간 서울 도심과 사람들
- 두 번째 이미지: 스마트폰으로 콘텐츠를 보는 모습
- 여행 섹션: 감각적인 로컬 공간

이미지가 아직 없다면 비워두세요.
AI가 필요한 위치에 /images/sample.jpg를 배치합니다.


[디자인 방향 — 선택]

원하는 분위기:
예) 화려한 에디토리얼 매거진 / 감각적인 문화 플랫폼 / 미니멀 럭셔리 / 젊고 역동적 / 차분하고 고급스러움

특히 강조하고 싶은 내용:

피하고 싶은 디자인:
예) 카드가 많은 SaaS 랜딩페이지 / 지나치게 심플한 화면 / 둥근 박스 반복


[링크 — 필요한 경우]

버튼이나 링크가 반드시 필요한 경우에만 작성하세요.

텍스트:
URL:


[레퍼런스 — 선택]

참고할 URL이나 스크린샷이 있다면 첨부하세요.

레퍼런스에서 마음에 드는 부분도 짧게 적어주면 좋습니다.

예:
- 첫 화면의 이미지와 글자 배치
- 이미지 크기가 계속 달라지는 구성
- 모바일에서 잡지처럼 보이는 느낌


위 내용을 바탕으로 QPOST Pages 본문 HTML을 작성해 주세요.
```

이미지가 준비되지 않았다면 `/images/sample.jpg`를 사용한 상태로 먼저 디자인을 확인한 뒤 실제 이미지로 교체하면 됩니다.

링크 목적지가 없는 버튼이나 CTA는 디자인을 채우기 위한 목적으로 임의 생성하지 않습니다.

# 3. 간편 의뢰 방법

양식을 전부 작성하지 않고 다음처럼 콘텐츠만 전달해도 됩니다.

```text
페이지 목적: 센터컷 서비스 소개 메인페이지

분위기:
모바일에서 화려하고 감각적인 에디토리얼 매거진 느낌.
전형적인 스타트업 랜딩페이지처럼 보이지 않았으면 좋겠음.

특히 첫 화면과 주요 섹션에서 이미지와 큰 타이포를 적극적으로 사용.

내용:
(전체 원고 붙여넣기)

위 내용을 참고해서 가장 적합한 레이아웃으로 구성해 주세요.
```

콘텐츠가 충분하다면 이 정도만 전달하고 실제 레이아웃과 이미지 배치는 AI에게 맡기는 편이 좋습니다.

# 4. 레퍼런스 활용 프롬프트 — 레퍼런스가 있을 때만 추가

```text
첨부한 사이트나 스크린샷을 그대로 복제하지 말고 디자인 원리를 분석해 현재 콘텐츠에 맞게 재해석하세요.

특히 다음을 관찰하세요.

- 모바일 첫 화면의 구성
- 시선이 처음 도달하는 지점
- 이미지와 타이포그래피의 관계
- 구도와 grid
- 제목과 본문의 크기 차이
- 여백의 크기와 역할
- 이미지의 크기, 비율, crop과 위치
- 요소가 화면 가장자리를 사용하는 방식
- 섹션별 정보 밀도
- 스크롤하면서 장면이 전환되는 방식
- 모바일에서 레이아웃이 재구성되는 방식

레퍼런스의 표면적인 모양보다 이러한 디자인 원리를 우선 분석합니다.

원본의 브랜드명, 문구, 이미지, 고유 그래픽과 색상을 그대로 복제하지 않습니다.

레퍼런스와 동일한 레이아웃을 만드는 것이 목적이 아니라, 좋은 디자인 원리를 현재 콘텐츠와 QPOST 환경에 맞게 새롭게 적용하는 것이 목적입니다.

QPOST semantic theme과 허용된 Pages Runtime을 사용하세요.

레퍼런스의 상호작용을 QPOST Runtime으로 구현할 수 없다면 억지로 재현하지 말고 정적인 구성과 시각적 원리만 재해석하세요.

특히 데스크톱 레퍼런스만 제공된 경우에도 모바일을 단순 축소하지 말고, 해당 디자인의 핵심적인 인상을 모바일 화면에 맞게 다시 구성하세요.

최종 답변은 기본 프롬프트의 출력 규칙에 따라 HTML만 출력하세요.
```

# 5. 사용하는 방법

**일반 제작**

`1. 기본 프롬프트 + 2. 사용자 의뢰 양식`

**간단하게 제작**

`1. 기본 프롬프트 + 3. 간편 의뢰`

**레퍼런스가 있는 제작**

`1. 기본 프롬프트 + 2. 사용자 의뢰 양식 + 4. 레퍼런스 활용 프롬프트`

가장 중요한 것은 사용자가 레이아웃을 세세하게 지정하는 것이 아니라 **콘텐츠와 원하는 분위기를 충분히 전달하는 것**입니다.

레이아웃까지 사용자가 모두 지정하면 AI가 콘텐츠를 해석해 새로운 구성을 만드는 장점이 줄어듭니다. 이미지 위치, 섹션 높이, grid 구성 같은 세부 디자인 결정은 특별한 요구가 없는 한 AI가 판단하도록 두는 것을 권장합니다.
