Codex용 히어로 섹션 디자인 프롬프트: 세 가지 방향

에디토리얼, 다크, 소프트 세 가지 1440×900 히어로를 같은 문구로 요청해 시각 스타일만 비교합니다.

프롬프트

히어로 섹션을 세 가지 방향으로 디자인해 줘. 각각 1440×900 크기, 인라인 CSS와 시스템 폰트를 쓴 별도의 단일 HTML 파일로:
A — 따뜻한 에디토리얼 스타일, 세리프 헤드라인
B — 대담하고 어두운 스타일, 밝은 포인트 색상 하나와 큰 숫자
C — 부드럽고 친근한 스타일, 둥근 카드와 옅은 그라데이션
세 가지 모두 헤드라인, 서브헤딩, CTA는 똑같이 써 줘. 제품 비주얼은 HTML과 CSS로 그리고, 외부 이미지는 쓰지 마.

지원 도구: Codex, ChatGPT
프롬프트 모음: 랜딩 페이지

이 프롬프트 소개

Codex는 방향마다 하나씩 세 개의 단독 실행 HTML 파일을 만듭니다. A는 세리프 헤드라인의 따뜻한 에디토리얼, B는 밝은 포인트 색상 하나와 큰 숫자가 있는 어두운 스타일, C는 둥근 카드와 옅은 그라데이션의 부드러운 스타일입니다. 헤드라인, 서브헤딩, 버튼은 세 가지 모두 같아서 달라지는 것은 시각적 접근뿐이며, 이 단계에서 정해야 할 것이 바로 그것입니다.

다시 써야 할 부분은 세 줄의 스타일 설명입니다. 브랜드상 어두운 페이지가 맞지 않는다면 B를 또 하나의 밝은 변형이 아니라 밀도 높은 데이터 중심 레이아웃처럼 정말로 다른 것으로 바꾸세요. 1440×900 크기와 외부 이미지를 쓰지 말라는 규칙은 유지하세요. HTML과 CSS로 그린 제품 비주얼은 편집할 수 있고, 파일을 옮겨도 깨지지 않습니다.

브라우저 탭을 하나씩 보지 말고 세 방향을 함께 판단하세요. Codex Design 캔버스에서는 세 파일이 라이브 HTML로 나란히 놓여서 위계와 밀도의 차이가 한눈에 보입니다. 고른 방향의 알파벳이나 조합하고 싶은 부분을 적어 두세요. 다음에 이어지는 전체 페이지 프롬프트가 알파벳으로 방향을 가리키기 때문입니다.

Codex용 히어로 섹션 디자인 프롬프트: 세 가지 방향

이 프롬프트 소개

이 모음의 다른 프롬프트