# 브랜드프론트로 웹사이트 만들기 코스

> 스튜디오에서 만든 브랜드를 방문자가 만나는 공개 웹사이트로 옮깁니다. 브랜드 정의를 페이지로 번역하고, 정체성·톤을 히어로와 카피에 반영하고, 페이지·링크를 구성해 발행·도메인 연결까지 — 브랜드프론트 빌더 실습을 단계별로 따라 하며 완성합니다.

- Canonical: https://learning.reopt.ai/courses/studio-brandfront
- Language: ko-KR
- HTML: https://learning.reopt.ai/courses/studio-brandfront

---

[리옵트 스튜디오 마스터](/tracks/studio-mastery)

# 브랜드프론트로 웹사이트 만들기

브랜드를 {brand}.reopt.ai 공개 웹으로

스튜디오에서 만든 브랜드를 방문자가 만나는 공개 웹사이트로 옮깁니다. 브랜드 정의를 페이지로 번역하고, 정체성·톤을 히어로와 카피에 반영하고, 페이지·링크를 구성해 발행·도메인 연결까지 — 브랜드프론트 빌더 실습을 단계별로 따라 하며 완성합니다.
중급 11레슨 475 XP 약 73분

출처 · reopt 스튜디오 · 브랜드프론트

선수 코스를 먼저 완료해 주세요
[브랜드 설계의 원칙](/courses/brand-principles) 완료 후 이 코스를 시작할 수 있어요.

[선수 코스 학습하기](/courses/brand-principles)

![리옵트 스튜디오 도구 활용을 표현한 일러스트](/images/home/track-reopt-studio.png)
0%

코스 진행률 12개 학습 단계 기준

## 이 코스를 마치면

- 브랜드프론트가 브랜드 4계층에서 차지하는 위치(출력면)를 설명할 수 있다
- 브랜드 정의 4요소를 히어로·섹션·톤 같은 페이지 요소로 옮길 수 있다
- 브랜드프론트 빌더로 페이지와 링크를 만들고 미리보기까지 진행할 수 있다
- 발행과 커스텀 도메인 연결로 브랜드프론트를 공개 상태로 전환할 수 있다

1

## 1. 브랜드프론트 이해 — 정의를 웹으로

브랜드프론트가 무엇이고 브랜드 정의를 어떻게 페이지로 옮기는지 먼저 잡습니다.

- 브랜드프론트란 무엇인가 브랜드의 출력면 — {brand}.reopt.ai 공개 웹 프론트 개념 30 XP
- 브랜드 정의를 웹으로 옮기기 문제·약속·증거·성격을 히어로·섹션·톤으로 번역 개념 35 XP
- 브랜드프론트 핵심 용어 빌더를 만지기 전에 용어 7장으로 굳히기 플래시카드 20 XP
- 브랜드프론트 개념 점검 출력면·구성 요소·정의 매핑 확인 퀴즈 35 XP

2

## 2. 페이지 만들기 — 빌더 실습

브랜드프론트 빌더로 페이지와 링크를 직접 만들어 봅니다.

- 실습: 브랜드프론트 첫 페이지 만들기 브랜드 선택부터 미리보기까지 실습 40 XP
- 실습: 브랜드 정체성/톤을 페이지에 반영 히어로 카피와 비주얼에 정의·Voice 입히기 실습 40 XP
- 실습: 링크 모음 구성 방문자를 여러 접점으로 안내하는 링크 만들기 실습 35 XP
- 페이지 구성 퀴즈 빌더 실습 내용 점검 퀴즈 40 XP

3

## 3. 발행 & 도메인 & 운영

만든 브랜드프론트를 공개로 전환하고, 커스텀 도메인을 연결하고, 발행 전 점검을 합니다.

- 실습: 발행과 커스텀 도메인 연결 비공개 → 공개, 그리고 도메인 연결 실습 45 XP
- 발행 전 체크리스트 공개 전에 반드시 점검할 항목 체크리스트 25 XP
- 실전: 브랜드프론트 런칭 판단 런칭 직전 상황에서 최선의 선택 고르기 시나리오 45 XP

## 최종 챌린지

코스 전체를 아우르는 종합 퀴즈로 마스터를 증명하세요.

- 최종 챌린지 · 브랜드프론트 마스터 개념부터 발행까지 아우르는 종합 퀴즈 레슨 완료 후 85 XP

---

에이전트용 사이트 안내: https://learning.reopt.ai/llms.txt · 사이트맵: https://learning.reopt.ai/sitemap.xml · 문의: https://learning.reopt.ai/contact