Manus로 웹사이트 만드는 방법: 서항주 교수 프로필 구축 사례

Manus로 웹사이트를 만드는 핵심은 “예쁜 홈페이지를 만들어 줘”라고 한 줄만 입력하는 것이 아니라, 목적·방문자·콘텐츠·행동 유도·검수 기준을 하나의 기획서처럼 전달하는 것입니다.

이 글에서는 Manus로 구축된 서항주 교수 AI·PM 프로필 사이트를 사례로, 아이디어를 실제 공개 웹사이트로 발전시키는 전 과정을 정리합니다. 코딩 경험이 없어도 따라 할 수 있지만, 결과의 품질을 높이려면 콘텐츠 설계와 검수 과정은 반드시 필요합니다.

한눈에 보는 제작 순서
목표 정의 → 자료 준비 → 첫 프롬프트 작성 → Manus의 구축 계획 검토 → 자동 생성 → 대화형 수정 → 데스크톱·모바일 테스트 → SEO·AEO 점검 → 배포 → 도메인 연결

1. Manus 웹사이트 빌더는 무엇이 다른가?

전통적인 노코드 도구는 템플릿을 고르고 블록을 직접 배치하는 방식이 많습니다. Manus는 만들고 싶은 사이트를 자연어로 설명하면 화면 구성과 콘텐츠, 프런트엔드 코드뿐 아니라 필요에 따라 백엔드·데이터베이스·로그인 기능까지 대화형으로 구축하는 접근을 제공합니다.

Manus 공식 문서는 조사와 콘텐츠 생성, 웹앱 구축, 외부 서비스 연동, 배포, 분석과 반복 개선을 하나의 흐름으로 설명합니다. 자세한 기능 범위는 Manus AI Website Builder 공식 소개와 Manus 공식 시작 가이드에서 확인할 수 있습니다.

2. 시작 전에 준비할 자료

AI가 디자인을 만들 수는 있어도 사실관계까지 자동으로 보증해 주지는 않습니다. 먼저 다음 자료를 한 폴더나 문서로 정리합니다.

• 사이트 목적: 개인 프로필, 기업 소개, 강의 문의, 제품 판매, 예약 등
• 핵심 방문자: 기업 담당자, 대학 관계자, 고객, 투자자, 채용 담당자 등
• 대표 메시지: 방문자가 5초 안에 이해해야 할 한 문장
• 필수 콘텐츠: 소개, 전문 분야, 경력, 프로젝트, 연구·실적, FAQ
• 행동 유도: 문의 메일, 상담 신청, 자료 다운로드, 전화, 구매
• 브랜드 자산: 로고, 프로필 사진, 색상, 폰트, 기존 채널 링크
• 사실 검증 자료: 이력서, 회사 소개서, 논문 목록, 자격·수상 내역

자료가 흩어져 있다면 먼저 Manus에 “중복을 제거하고 웹사이트용 콘텐츠 표로 정리해 줘. 사실을 추정하지 말고 확인이 필요한 항목은 표시해 줘”라고 요청하면 좋습니다.

3. 첫 프롬프트는 7가지 요소로 작성한다

첫 결과물의 완성도는 프롬프트의 구체성에 크게 좌우됩니다. 다음 일곱 요소를 빠뜨리지 않는 것이 좋습니다.

1. 목적: 이 사이트가 해결해야 할 문제
2. 대상: 주 방문자와 그들이 알고 싶은 정보
3. 페이지 구조: 필요한 섹션과 순서
4. 콘텐츠 원칙: 제공 자료만 사용, 과장 금지, 표현 톤
5. 디자인 방향: 색상, 분위기, 레이아웃, 참고 스타일
6. 기능: 내비게이션, 복사 버튼, 문의 링크, 폼, 검색 등
7. 품질 기준: 반응형, 접근성, SEO, 로딩 속도, 브라우저 호환

바로 사용할 수 있는 첫 프롬프트 예시

교수이자 AI·데이터·클라우드·프로젝트경영 전문가의
개인 브랜드 프로필 웹사이트를 만들어 줘.

주 방문자는 기업 교육 담당자, 대학 관계자,
공공 R&D 및 컨설팅 협업 담당자야.

사이트 목표는 전문성을 빠르게 이해시키고
강의·교육·연구·컨설팅 문의로 연결하는 것이야.

한 페이지 구조로 다음 섹션을 구성해 줘.
1) 핵심 메시지와 CTA가 있는 히어로
2) 전문 분야
3) 현재 역할과 주요 경력
4) 대표 프로젝트와 성과
5) 연구·논문·강의 주제
6) 온라인 채널
7) 협업 문의
8) 자주 묻는 질문

제공한 이력서와 링크의 사실만 사용하고
확인되지 않은 경력이나 성과는 만들지 마.
디자인은 신뢰감 있는 연구자 포트폴리오 스타일로,
네이비·오프화이트 중심의 편집 디자인 느낌을 사용해 줘.
데스크톱과 모바일 모두 최적화하고,
시맨틱 HTML·메타데이터·구조화 데이터·접근성을 반영해 줘.

“멋지게”, “고급스럽게” 같은 추상어만 쓰기보다 정보 구조와 성공 기준을 명시해야 결과를 객관적으로 검수할 수 있습니다.

4. 구축 계획을 먼저 검토한다

Manus는 요청을 분석해 사이트 구조, 기능, 사용할 기술을 포함한 계획을 제시합니다. 공식 시작 가이드도 바로 생성하기 전에 계획을 검토하고 조정하는 단계를 권장합니다.

이때 다음 질문으로 계획을 점검합니다.

• 첫 화면에서 “누구이며 무엇을 제공하는가”가 드러나는가?
• 방문자에게 중요한 정보가 위에서 아래로 자연스럽게 이어지는가?
• 각 섹션이 실제 자료와 대응하는가?
• 최종 행동 유도가 하나의 명확한 흐름으로 연결되는가?
• 모바일에서 너무 긴 표나 복잡한 애니메이션이 생기지 않는가?

계획이 모호하면 “섹션별 목적, 필요한 원본 자료, CTA, 검수 기준을 표로 다시 정리해 줘”라고 요청한 뒤 구축을 시작합니다.

5. 사례 사이트의 정보 구조에서 배울 점

사례 사이트의 첫 화면은 “연구의 깊이를 실행의 성과로.”라는 짧은 메시지와 AI·데이터·클라우드·프로젝트경영이라는 전문 영역을 함께 보여 줍니다. 이어지는 한 페이지 안에는 다음 흐름이 배치되어 있습니다.

1. 포지셔닝: 연구자·교수·컨설턴트라는 정체성
2. 전문성: AI·피지컬 AI, 데이터, 클라우드, 프로젝트경영, 보안, 교육
3. 역할과 경력: 대학, 공공 평가, 기업 프로젝트 경험
4. 대표 프로젝트: 과제의 배경보다 역할과 결과 중심 설명
5. 연구와 강의: 논문·교육 주제를 한 화면에서 확인
6. 온라인 채널: 블로그와 SNS로 신뢰 근거 확장
7. 협업 문의: 이메일 작성과 문의 템플릿 복사
8. 직접 답변: 전문 분야와 의뢰 범위를 FAQ로 정리

중요한 점은 이력서를 그대로 길게 붙이지 않았다는 것입니다. 방문자가 궁금해하는 순서대로 정보를 재배열하고, 프로젝트마다 역할과 성과를 짧게 제시해 읽는 부담을 줄였습니다.

6. 한 번에 완성하려 하지 말고 대화형으로 수정한다

첫 생성본은 초안입니다. Manus는 자연어 수정과 실시간 미리보기를 지원하므로, 큰 구조와 세부 디자인을 나누어 반복하는 편이 효율적입니다. 공식 편집·미리보기 문서에는 대화형 편집, 빠른 스타일 조정, 여러 변경의 일괄 적용, 데스크톱·모바일 미리보기가 안내되어 있습니다.

구조 수정 프롬프트

경력 나열보다 현재 협업 가능한 분야가 먼저 보이도록
전문 분야 → 대표 프로젝트 → 역할과 경력 순서로 바꿔 줘.
각 섹션 첫 문장은 방문자가 얻는 가치 중심으로 다시 써 줘.

디자인 수정 프롬프트

전체 폭을 너무 넓게 쓰지 말고 본문 가독성을 높여 줘.
제목 계층을 명확히 하고 카드 간 여백을 통일해 줘.
모바일에서는 2열·3열 카드를 모두 1열로 배치해 줘.

사실 검수 프롬프트

현재 페이지의 모든 숫자, 기관명, 직함, 연도, 논문명을 추출해
내가 제공한 원본 자료와 대조표로 보여 줘.
근거가 없는 문장은 사이트에서 삭제하고 확인 필요로 표시해 줘.

7. 사진과 로고는 용도까지 지시한다

이미지를 단순히 업로드하는 데서 끝내지 말고 배치 목적을 함께 알려 줍니다.

• 프로필 사진은 첫 화면에서 얼굴이 과도하게 잘리지 않도록 사용
• 로고는 헤더와 푸터에 동일한 비율로 배치
• 이미지에 의미 있는 대체 텍스트 제공
• 장식용 이미지는 정보 전달을 방해하지 않도록 최소화
• 모바일에서 이미지 용량과 세로 길이 최적화

타인의 사진, 논문 표지, 기관 로고를 사용할 때는 공개 게시 권한과 이용 조건도 확인해야 합니다.

8. 기능은 실제 사용자 행동으로 테스트한다

사이트가 보기 좋은 것과 제대로 작동하는 것은 다릅니다. 공개 전에 아래 동작을 직접 확인합니다.

• 상단 메뉴를 누르면 정확한 섹션으로 이동하는가?
• 외부 링크가 올바른 주소와 새 창 정책으로 열리는가?
• 이메일 문의 버튼에 수신자와 제목이 정확히 들어가는가?
• 주소 복사·문의 템플릿 복사 버튼이 HTTPS 환경에서 작동하는가?
• 키보드만으로 메뉴와 버튼을 사용할 수 있는가?
• 모바일에서 글자, 버튼, 카드가 잘리거나 겹치지 않는가?
• 잘못된 경로에 접근했을 때 사용자에게 적절한 안내가 나오는가?

수정 요청도 “버튼이 안 돼”보다 “iPhone 폭 390px에서 협업 문의 버튼을 누르면 Gmail 작성 화면이 열리지 않는다. 원인을 확인하고 대체 mailto 링크까지 제공해 줘”처럼 재현 조건을 포함하면 좋습니다.

9. SEO와 AEO를 함께 요청하는 방법

검색 최적화는 제목에 키워드를 반복하는 작업이 아닙니다. 페이지가 누구에 관한 것인지, 어떤 전문성을 제공하는지, 사용자의 질문에 어떤 답을 주는지 명확히 만드는 과정입니다.

이 사이트를 한국어 개인 전문가 프로필로 SEO·AEO 최적화해 줘.

- 페이지마다 고유한 title과 description 작성
- 대표 공개 URL 기준 canonical 설정
- 시맨틱 heading 계층 점검
- Person, Organization, WebSite, ProfilePage 구조화 데이터 연결
- 전문 분야와 협업 범위를 실제 본문에도 표시
- 사용자가 묻는 질문 5개와 간결한 답변 작성
- 이미지 alt, 내부 링크, OG 메타데이터 점검
- robots.txt와 sitemap.xml 제공
- 구조화 데이터와 화면 내용이 서로 다르지 않게 검증

사례 사이트도 마지막에 “어떤 분야의 전문가인가?”, “어떤 교육을 의뢰할 수 있는가?”, “피지컬 AI 강의가 가능한가?”, “어떻게 협업하는가?”에 직접 답하는 영역을 두고 있습니다. 이런 구조는 방문자의 의사결정을 돕는 동시에 답변 엔진이 핵심 정보를 찾기 쉽게 만듭니다.

10. 배포 전 최종 체크리스트

• 기관명, 직함, 연도, 실적, 연락처의 사실관계를 최종 확인했다.
• 데스크톱과 모바일 화면을 모두 확인했다.
• 모든 메뉴, 버튼, 복사 기능, 외부 링크를 눌러 봤다.
• 페이지 제목, 설명, 대표 이미지, canonical을 확인했다.
• 개인정보 처리와 문의 데이터 저장 방식을 점검했다.
• 검색엔진에 노출되면 안 되는 테스트 데이터가 없는지 확인했다.
• 사이트를 다시 수정할 수 있도록 원본 자료와 프롬프트를 보관했다.

11. Manus에서 게시하고 도메인 연결하기

미리보기 검수가 끝나면 Publish 기능으로 사이트를 공개할 수 있습니다. Manus 공식 게시 가이드는 앱을 최종 점검한 뒤 Publish를 실행하면 빌드와 호스팅 구성이 처리되는 흐름을 안내합니다.

브랜드 주소가 필요하면 보유 도메인이나 하위 도메인을 연결합니다. 공식 사용자 정의 도메인 문서에 따르면 연결 과정에서 필요한 A 또는 CNAME 레코드가 안내되며 SSL/HTTPS도 구성할 수 있습니다. 요금제와 제공 범위는 변경될 수 있으므로 실제 연결 시점의 공식 안내를 확인해야 합니다.

12. 자주 묻는 질문

코딩을 전혀 몰라도 Manus로 웹사이트를 만들 수 있나요?

기본적인 소개 사이트는 자연어 설명과 자료만으로 시작할 수 있습니다. 다만 도메인, 개인정보, 결제, 로그인, 데이터 저장처럼 운영 위험이 있는 기능은 기술 검토와 실제 테스트가 필요합니다.

첫 프롬프트 한 번으로 완성해야 하나요?

아닙니다. 첫 프롬프트는 방향과 구조를 잡는 역할을 합니다. 이후 콘텐츠, 디자인, 모바일, 기능, SEO를 나누어 수정하고 미리보기에서 확인하는 과정이 완성도를 높입니다.

이력서를 그대로 넣으면 좋은 프로필 사이트가 되나요?

이력서는 제작의 근거 자료이고 웹사이트는 방문자를 위한 설명 구조입니다. 경력 전체를 나열하기보다 핵심 전문성, 대표 프로젝트, 검증 가능한 성과, 협업 방법을 방문자의 질문 순서에 맞춰 재구성해야 합니다.

Manus가 만든 문구를 그대로 공개해도 되나요?

반드시 이름, 기관, 직함, 날짜, 수치, 연구 실적, 연락처를 원본 자료와 대조해야 합니다. 과장된 표현이나 근거 없는 성과는 수정한 뒤 공개하는 것이 안전합니다.

게시 후에도 수정할 수 있나요?

가능합니다. 변경 내용을 자연어로 요청하고 미리보기에서 확인한 뒤 다시 배포하는 방식으로 운영할 수 있습니다. 정기적으로 경력, 프로젝트, 강의, 링크와 검색 노출 상태를 점검하는 것이 좋습니다.

마무리

Manus로 웹사이트를 만드는 가장 좋은 방법은 AI에게 모든 판단을 맡기는 것이 아니라, 사람이 목적과 사실을 제공하고 Manus가 구조·디자인·코드·반복 수정을 가속하도록 역할을 나누는 것입니다.

먼저 방문자와 목표를 정의하고, 검증된 자료로 첫 프롬프트를 작성해 보세요. 계획을 검토한 뒤 한 번에 하나의 기준으로 수정하고, 모바일·기능·SEO·사실관계를 확인한 다음 게시하면 단순한 AI 생성 페이지가 아니라 실제로 활용할 수 있는 웹사이트에 가까워집니다.

Manus로 구축한 서항주 교수 프로필 사이트 보기