영상 이미지
로그인
Vibe Coder Bootcamp 랜딩 페이지

Vibe Coder Bootcamp 랜딩 페이지

A detailed prompt for generating a premium Japanese AI coding bootcamp landing page with seven structured sections, diagrams, curriculum cards, portraits, and CTA blocks.

조회196
좋아요0
댓글0
공유0
북마크0
인용0
번역
목표: {argument name="bootcamp name" default="Vibe Coder Bootcamp"}를 위한 전체 페이지 세로형 일본어 랜딩 페이지 목업을 생성합니다. 프리미엄하고 진지하며 약간 철학적인 톤을 유지하면서도 명확한 실무적 이점을 제시하는 AI 코딩 / AI 에이전트 부트캠프를 소개하세요.

캔버스: 세로형 모바일 웹 랜딩 페이지 스크린샷, 약 9:16 비율, 흰색 페이지 본체에 다크한 영화적 느낌의 히어로 섹션과 중간 사진 밴드를 사용하세요. 세련된 스타트업/교육 랜딩 페이지 스타일, 고해상도, 선명한 타이포그래피, 깔끔한 간격을 적용하세요.

시각적 스타일: 오렌지색 강조 타이포그래피, 딥 네이비/블랙 배경, 흰색 콘텐츠 카드, 얇은 회색 구분선, 보라색 하이라이트, 단순한 라인 아이콘, 다큐멘터리 스타일의 인물 사진을 결합한 일본 프리미엄 비즈니스 디자인을 사용하세요. 세리프 느낌의 일본어 헤드라인 타이포그래피와 현대적인 산세리프 UI 텍스트를 혼합하세요. 실제 LP 디자인 컴포지션처럼 밀도 있으면서도 가독성 있게 레이아웃을 구성하세요.

레이아웃 및 섹션: No.01부터 No.07까지 번호가 매겨진 정확히 7개의 섹션을 포함하세요.

히어로 섹션: 상단에 어두운 영화적 배너를 배치하세요. 왼쪽에는 큰 오렌지색 영어 타이틀 “Vibe Coder Bootcamp”, 일본어 서브타이틀 “AI를 완전히 내 편으로 만드는 1.5개월”, 그리고 더 작은 일본어 문구 “1회 2.5시간 × 총 5회 + Demo Day. 앱도 자료도 영상도, 모든 아웃풋을 AI로”를 배치하세요. 오렌지색 둥근 CTA 버튼 “자료 요청 및 문의”를 추가하세요. 오른쪽에는 어두운 사무실/도서관에서 밤에 도시의 불빛, 컴퓨터 모니터, 책장, 따뜻한 데스크 램프 조명 아래 사색에 잠긴 검은 정장 차림의 일본인 남성을 배치하세요.

No.01 섹션: 흰색 배경에 오렌지색 “No.01”과 작은 라벨 “과제”. 큰 일본어 헤드라인: “AI는 이미 충분히 똑똑하다. 부족한 것은 당신의 입력.” 보조 문구: “입력의 질 = 출력의 질.” 오른쪽에는 BEFORE / AFTER 다이어그램 두 장을 배치하세요: BEFORE 카드는 “모호한 입력”이 “모호한 출력”으로 이어지며 지저분한 낙서 아이콘을 표시하고, AFTER 카드는 “구조화된 입력”이 “가치 높은 출력”으로 이어지며 보라색 타겟 아이콘을 표시하세요. 두 카드 사이에 작은 화살표를 넣으세요.

No.02 섹션: 흰색 배경에 오렌지색 “No.02”와 라벨 “해결 = 컨텍스트 컨트롤”. 메인 헤드라인: “컨텍스트 컨트롤. AI 에이전트 시대의 기초 체력.” 큰 그라데이션 문구 “Vibes Output Loop를 돌려라”를 추가하세요. 오른쪽에는 곡선 화살표로 연결된 3개의 순환 단계(Loop steps)를 배치하세요: STEP1 “제공 (GIVE)” (문서/사람 아이콘, 필요한 배경, 목적, 제약 사항 및 카드 정보 제공에 대한 설명), STEP2 “축적 (ACCUMULATE)” (채팅 말풍선 아이콘, 일상적인 채팅을 통해 업무, 아이디어 및 회사 전체의 컨텍스트를 축적하는 것에 대한 설명), STEP3 “순환 (LOOP)” (오렌지색 순환 화살표, 도구, 문서, 영상, 앱을 통해 컨텍스트를 반복적으로 순환시키는 것에 대한 설명).

No.03 섹션: 흰색 배경에 오렌지색 “No.03”과 라벨 “커리큘럼”. 헤드라인: “SNS 앱 개발을 ‘통해’ 컨텍스트 컨트롤을 체득한다. SNS를 만드는 것이 목적이 아니다.” 보라색 헤더가 있는 6개의 가로형 커리큘럼 카드를 포함하세요: WEEK01 “기획·요건 정의”, WEEK02 “UI/UX·설계”, WEEK03 “구현·DB 설계”, WEEK04 “인증·보안”, WEEK05 “배포·운영”, DEMO DAY “성과 발표·강평”. 그 아래에 아이콘이 포함된 4개의 기능 카드를 추가하세요: “기획·UI/UX” (오렌지색 와이어프레임 아이콘), “작동하는 앱 (DB·배포)” (보라색 데이터베이스 아이콘), “보안” (다크한 방패 아이콘), “API·에이전트 기반” (보라색 연결 노드 아이콘).

No.04 섹션: 흰색 배경에 오렌지색 “No.04”와 라벨 “졸업 후 할 수 있는 것”. 썸네일 일러스트와 함께 4개의 역량 카드를 한 줄로 배치하세요: “앱·서비스” (앱 대시보드 스크린샷), “자료·문서” (차트/보고서 페이지), “이미지·영상” (영상/이미지 에디터 썸네일 및 재생 버튼), “업무 자동화” (자동화 흐름도 아이콘). 각 카드 하단에는 짧은 일본어 설명 문구를 넣으세요.

No.05 섹션: 전체 너비의 어두운 영화적 밴드. 왼쪽에는 오렌지색 “No.05”와 라벨 “파트너, 즉 AI”. 큰 흰색 헤드라인: “혼자서 회사를 운영한다.” 보조 문구: “AI 에이전트에게 계속 일을 시키는 사람이 되어라.” 오른쪽에는 책상에서 손을 맞잡고 있는 진지한 일본인 사업가, 투명한 분석/UI 화면, 차트, 코드, 도시의 밤 사무실 분위기, 따뜻한 램프와 지구본 디테일을 배치하세요.

No.06 섹션: 짙은 회색 인물 사진 밴드. 왼쪽에는 오렌지색 “No.06”과 라벨 “강사”. 헤드라인: “가르치는 사람은 일본에서 단 한 명, 센스이 료스케(泉水亮介)”와 인문학, 기업가 정신, 대학 강의 및 Vibe Coding에 관한 작은 일본어 약력을 포함하세요. 오른쪽에는 {argument name="instructor name" default="泉水亮介"}의 사실적인 전문 프로필 사진을 배치하세요(일본인 남성, 검은 재킷, 차분한 표정, 콘크리트 벽 배경). 맨 오른쪽에 일본어 수상 스타일의 문구가 적힌 3개의 작은 금색 월계수 배지를 추가하세요.

No.07 섹션: 흰색 배경의 최종 CTA 스트립. 왼쪽 라벨은 오렌지색 “No.07”과 “실적·CTA”. 3개의 지표 카드 “개발 앱 120+”, “만족도 98%”, “업무 9할을 AI로”를 각각 작은 아이콘과 함께 포함하세요. 오른쪽에는 봉투 아이콘이 있는 큰 오렌지색 둥근 버튼 “자료 요청 및 문의”와 더 작은 텍스트 “편하게 상담해 주세요”를 배치하세요. Vibe Coder Bootcamp와 AI 에이전트 시대의 기술을 언급하는 작은 일본어 텍스트가 포함된 얇은 푸터 라인을 추가하세요.

제약 사항: 지정된 모든 가시적 텍스트는 일본어로 유지하고, 7개의 번호 섹션, 6개의 커리큘럼 카드, 4개의 기능 카드, 4개의 역량 카드, 3개의 루프 단계, 3개의 최종 지표를 정확히 유지하세요. 추가 섹션, 워터마크, 브라우저 크롬 또는 관련 없는 로고를 추가하지 마세요. 최종 결과물은 별도의 Slides가 아닌 하나의 연속된 랜딩 페이지 스크린샷처럼 보여야 합니다.

기계 번역 — 실제 결과물을 만든 것은 원문 프롬프트입니다.

✨ 생성 원본 게시물 Hitboard에서 열기

이 프롬프트 사용법

프롬프트를 복사해 GPT Image 2에 붙여넣으세요. 구성, 조명, 스타일 용어는 원문대로 두세요. 피사체나 장면 세부만 바꾸고 비율은 유지하며, 참조 이미지가 있으면 첨부하세요. 두세 번 다시 생성해 보세요. 가장 좋은 결과는 대개 첫 장이 아닙니다.