한눈에 보는 구성
8개
섹션 구성
12칼럼
그리드 기준
1개 브랜드
실습(KLAR)
프롬프트만
코드 없이 완성
“페이지 하나를 어디서부터 손대야 할지 모르겠다”
이 워크숍에서 제일 먼저 풀어주는 고민입니다.
코드를 몰라도 됩니다. 그리드 기준을 잡고, 한 섹션씩 프롬프트로 쌓아 올리면 됩니다.
이 워크숍은 이 고민에서 시작합니다.
3단계로 완성합니다
01
그리드 설계
12칼럼 기준을 먼저 잡습니다
02
섹션 쌓기
한 섹션씩 프롬프트로 완성합니다
03
완성 체크
체크리스트로 8개 섹션을 점검합니다
커리큘럼
8개 섹션, 순서대로 쌓아갑니다
00
그리드 & 전체 흐름
12칼럼 그리드 기준을 잡고, 오늘 만들 8개 블록을 미리 봅니다.
12칼럼 그리드8개 블록 미리보기
01
Header & GNB
로고·메뉴 3분할 구조를 잡고 sticky 처리까지 완성합니다.
로고·메뉴 3분할sticky 처리
02
Hero Area
첫 화면을 한 문장으로 정리하고, 배경 그라디언트와 캐러셀을 넣습니다.
첫 화면 한 문장배경 그라디언트캐러셀
03
Brand Value
강점 카드 4개를 이미지 + 제목 1줄로 정리합니다.
강점 카드 4개이미지+제목 1줄
04
Ingredient & Science
6:6 레이아웃으로 근거를 제시합니다.
6:6 레이아웃근거 제시
05
Best Seller
베스트셀러 카드를 구성하고, 뱃지는 1장에 1개만 사용합니다.
베스트셀러 카드뱃지 1장 1개
06
Social Proof
포토 리뷰로 신뢰를 쌓고, 광고 표기를 빠뜨리지 않습니다.
포토 리뷰광고 표기
07
Promotion
이벤트 배너를 만들고, 기간·혜택을 숫자로 명확히 표시합니다.
이벤트 배너기간·혜택 숫자
08
Footer
사업자 정보를 빠짐없이 담고, 개인정보처리방침을 강조합니다.
사업자 정보개인정보처리방침 강조
완성 체크리스트
기본 점검
구조가 제대로 잡혔는가
- 헤더가 sticky인가
- 히어로 문구가 한 문장인가
- 강점 카드 4개가 들어갔는가
- 성분 배지 3개가 지켜졌는가
디테일 점검
놓친 부분은 없는가
- 품절 처리가 지켜졌는가
- 광고 표기가 있는가
- 이벤트에 기간·혜택이 숫자로 있는가
- 개인정보처리방침이 강조됐는가, 사업자 정보가 빠짐없는가
일정
원데이 워크숍 — 하루 완결
하루 만에 랜딩페이지 8개 섹션을 전부 완성합니다. 점심시간 제외 약 6.5시간 진행됩니다.
| 시간 | 구성 | 내용 |
|---|---|---|
| 09:30–10:00 | 오리엔테이션 | 12칼럼 그리드 기준 잡기, 오늘 만들 8개 섹션 미리보기 |
| 10:00–10:40 | 01 Header & GNB | 로고·메뉴 3분할, sticky 처리 |
| 10:40–11:20 | 02 Hero Area | 첫 화면 한 문장, 배경 그라디언트, 캐러셀 |
| 11:20–12:00 | 03 Brand Value | 강점 카드 4개 |
| 12:00–13:00 | 점심 | — |
| 13:00–13:40 | 04 Ingredient & Science | 6:6 레이아웃으로 근거 제시 |
| 13:40–14:20 | 05 Best Seller | 베스트셀러 카드, 뱃지 규칙 |
| 14:20–15:00 | 06 Social Proof | 포토 리뷰, 광고 표기 |
| 15:00–15:10 | 휴식 | — |
| 15:10–15:50 | 07 Promotion | 이벤트 배너, 기간·혜택 숫자 |
| 15:50–16:30 | 08 Footer | 사업자 정보, 개인정보처리방침 강조 |
| 16:30–17:00 | 마무리 | 완성 체크리스트 점검, KLAR 페이지를 포트폴리오로 정리 |
수강료
수강료는 곧 공개됩니다
정확한 금액과 신청 방법은 별도로 안내드릴 예정입니다. 먼저 커리큘럼을 확인해보세요.