시작하기
몇 분 안에 Website2AI로 첫 번째 웹사이트를 만드세요.
사전 요구 사항
- Website2AI 계정 — Google로 가입
- 계정에 크레딧 (신규 사용자는 무료 크레딧 제공)
빠른 시작
1단계: 빌더 열기
website2.ai/builder로 이동하여 웹사이트 빌더에 접속하세요.
2단계: 웹사이트 설명하기
채팅 패널에서 원하는 웹사이트를 설명하세요. 포함할 내용:
- 목적 — 무엇을 위한 것인가요?
- 스타일 — 모던, 미니멀, 볼드, 플레이풀?
- 섹션 — 히어로, 기능, 가격, 연락처?
- 색상 — 브랜드 색상이나 선호도가 있나요?
예시 프롬프트:
"TaskFlow"라는 작업 관리 앱을 위한 랜딩 페이지를 만들어주세요.
포함할 내용:
- 헤드라인, 설명, "시작하기" 버튼이 있는 히어로 섹션
- 주요 이점을 보여주는 3개의 카드가 있는 기능 섹션
- Free와 Pro 티어가 있는 가격 섹션
- 5개의 일반적인 질문이 있는 FAQ 섹션
- 링크와 뉴스레터 가입이 있는 푸터
스타일: 모던하고 깔끔하며 여백이 많음
색상: 파란색(#3B82F6)을 기본 색상으로
3단계: 빌드 과정 확인하기
제출 후 다음을 볼 수 있습니다:
- 진행 표시기 — 실시간으로 생성되는 파일들
- 실시간 미리보기 — 미리보기 패널에 나타나는 웹사이트
- 빌드 상태 — 컴파일 진행 상황
복잡도에 따라 생성에 1-3분이 소요됩니다.
4단계: 채팅으로 다듬기
마음에 들지 않나요? AI와 채팅하여 변경하세요:
히어로 섹션을 더 높게 하고 배경 그라데이션을 추가해줘
기본 색상을 보라색으로 변경해줘
3개의 고객 리뷰가 있는 후기 섹션을 추가해줘
버전 기록 및 복원 기능은 곧 제공될 예정입니다.
5단계: 웹사이트 공유하기
웹사이트는 다음 주소에서 자동으로 배포됩니다:
https://your-project.website2.ai
이 URL을 즉시 공유하거나 커스텀 도메인을 연결하세요 (Pro 플랜).
인터페이스 이해하기
채팅 패널 (왼쪽)
AI와의 대화:
- 생성 — 새 웹사이트 설명
- 수정 — 기존 사이트 변경 요청
- 질문 — 프로젝트 이해를 위한 도움 받기
미리보기 패널 (중앙)
웹사이트의 실시간 미리보기:
- 데스크톱/모바일 전환 — 반응형 디자인 확인
- 새로고침 — 미리보기 다시 로드
- 새 탭에서 열기 — 전체 화면 미리보기
코드 패널 (오른쪽)
소스 코드 보기 및 편집:
- 파일 트리 — 프로젝트 파일 탐색
- 에디터 — 구문 강조 코드
- 토글 — 코드 패널 표시/숨기기
좋은 프롬프트 작성하기
구체적으로
덜 효과적:
웹사이트 만들어줘
더 효과적:
사진작가를 위한 포트폴리오 웹사이트를 만들어주세요.
제 이름이 있는 히어로, 12장의 사진 갤러리 그리드,
소개 섹션, 문의 양식을 포함해주세요.
흰색 텍스트의 다크 테마를 사용해주세요.
구조 설명하기
원하는 섹션 나열:
다음이 포함된 SaaS 랜딩 페이지를 만들어주세요:
1. 헤드라인과 이메일 가입이 있는 히어로
2. 고객 회사들을 보여주는 로고 바
3. 아이콘이 있는 3개의 기능 카드
4. 후기 캐러셀
5. 가격표 (Free, Pro, Enterprise)
6. FAQ 아코디언
7. 링크가 있는 푸터
스타일 지정하기
시각적 선호도 포함:
스타일:
- 미니멀하고 깔끔함
- 모든 요소에 둥근 모서리
- 깊이감을 위한 은은한 그림자
- 산세리프 글꼴
- 기본 색상: #10B981 (녹색)
크레딧 사용
크레딧은 요청의 복잡도에 따라 소비됩니다. 간단한 변경은 적게, 전체 페이지 생성은 더 많이 소비합니다.
크레딧 절약 팁:
- 구체적으로 설명하여 왔다 갔다를 줄이세요
- 집중적이고 단일한 변경을 하세요
- 실험을 위해 일일 크레딧을 사용하세요
자세한 내용은 크레딧을 참조하세요.