[AI 비법] 코딩 0줄! 200만원 웹사이트 뚝딱 만들고 돈 버는 법!
코딩 없이 나만의 웹사이트 만들기! 클로드로 뚝딱뚝딱!
🚀 코딩? 그게 뭔데?
이번 시간에는 코딩 한 줄도 안 쓰고, 말로만으로 멋진 웹사이트를 만드는 방법을 알려줄게! 외주 맡기면 돈 엄청 깨지는 그런 웹사이트 말이야.
✨ AI 티 안 나는 웹사이트 만드는 비법
AI가 만든 티 팍팍 나는 웹사이트는 이제 그만! AI 느낌 안 나는 퀄리티 높은 웹사이트를 만들 수 있는 꿀팁들을 알려줄게.
🎨 나만의 스타일로 힙하게 커스텀!
마지막엔 너만의 브랜드에 딱 맞는, 원하는 대로 싹 다 바꿔서 커스텀하는 방법까지 알려줄 테니 영상 끝까지 꼭 봐줘!
💻 실습은 어디서? 클로드 코드!
오늘 실습은 '클로드 코드'에서 진행할 거야. 아직 클로드 코드 안 써봤다면, 위에 나오는 영상 보고 5분이면 바로 시작할 수 있어! VS 코드 같은 다른 프로그램 써도 괜찮고, 클로드 데스크탑 앱 써도 돼. 나는 VS 코드로 할게!
🤖 클로드야, 화장품 웹사이트 만들어 줘!
클로드한테 "화장품 웹사이트 만들어 줘"라고 하면, 클로드가 알아서 뚝딱 만들어줘. 근데… 음… 누가 봐도 AI가 만든 느낌이 좀 나지? 친구한테 "이거 내가 만들었어!" 하고 보여주긴 괜찮지만, 이걸로 돈 벌기엔 좀 부족해 보여.
🌟 레벨 업! 프론트 엔드 디자인 스킬 장착!
그래서 이제부터 진짜 제대로 된 웹사이트를 만들기 위해 하나씩 고쳐나갈 거야. 먼저 '프론트 엔드 디자인'이라는 클로드 스킬을 쓸 건데, 이게 뭐냐면…
- AI 느낌 싹 빼줘: 뻔한 디자인 말고, AI가 만든 것 같지 않은 결과물을 만들어줘.
- 스스로 검증: 결과물 만들면서 계속 "이거 괜찮나?" 하고 스스로 체크해서 더 완성도 높게 만들어줘.
- 디테일 챙겨줘: 웹사이트 만들 때 필요한 자잘한 부분까지 꼼꼼하게 챙겨줘.
이 스킬을 설치하면 클로드가 더 똑똑하게 웹사이트를 만들어 줄 거야!
♨️ 온천 숙소 웹사이트 만들기 도전!
뭘 만들어 볼까 하다가, 요즘 온천 가고 싶어서 '온천 딸린 고급 숙소' 소개하고 예약하는 홈페이지를 만들어 보기로 했어. 너네 브랜드가 있다면 네 브랜드 이미지 쓰면 되고, 나는 없어서 직접 만들었어. 이미지 만드는 건 이제 너네도 다 할 수 있지?
🖼️ 무료 이미지 만들기 꿀팁: 구글 플로우!
이미지 만들 때 돈 쓰기 아깝잖아? 무료로 이미지랑 영상까지 만들 수 있는 '구글 플로우'를 써볼 거야. 다른 툴 써도 상관없어!
- 새 프로젝트 시작: 구글 플로우에서 새 프로젝트 만들고.
- 클로드한테 프롬프트 부탁: "고급 온천 숙소 웹사이트에 쓸 이미지 만들 프롬프트 좀 만들어줘. 디자인, 색깔, 분위기 다 비슷해야 하고, 사진처럼 진짜 같아야 해." 라고 클로드한테 부탁하는 거야. 호텔 입구, 온천, 자연 풍경 같은 다양한 이미지 프롬프트도 같이 만들어달라고 하면 좋아.
- 복사해서 붙여넣기: 클로드가 만들어준 프롬프트를 복사해서 플로우에 붙여넣고, 16:9 비율로 이미지 생성!
- 짠! 고급스러운 이미지 완성! 이렇게 프롬프트대로 고급스러운 온천 숙소 이미지가 뿅! 애니메이션 넣어서 영상으로도 만들 수 있어.
💡 화장품 홍보 사이트 예시: 만약 화장품 홍보 사이트 만들고 싶으면, "20대 한국 여성이 이 화장품 들고 포즈 취하는 사진, 피부 매끈한 거 강조해줘" 라고 하면 바로 제품 홍보 이미지 뚝딱! 애니메이션 버튼 누르면 영상도 만들 수 있어.
원래 이런 이미지, 영상 만들려면 모델 구하고 스튜디오 빌리고 촬영하고… 돈 엄청 들잖아? 근데 AI 덕분에 이렇게 쉽게 만들 수 있다니, 진짜 대박이지 않아?
💻 이제 진짜 웹사이트 만들기 시작!
이미지랑 영상 다 만들었으면, 이제 본격적으로 웹사이트를 만들어 볼 시간이야.
- 이미지/영상 폴더에 넣기: 만든 이미지랑 영상들을 프로젝트 폴더에 쏙 넣어줘.
- 클로드한테 요청: "온천 숙소 소개 예약 사이트 만들고 싶어. 고급지고 깔끔하게, 외주 맡긴 것처럼 디테일 살려서 만들어줘. 폴더에 있는 이미지랑 영상 써서!" 라고 요청하는 거야.
- 오토 모드 켜기: 클로드가 계속 허락받는 거 귀찮으면, 프롬프트 입력창 아래 '오토 모드'로 바꿔놔. 그러면 알아서 척척 진행해 줄 거야.
✨ 결과물 확인! AI 느낌 1도 없음!
잠시 기다리면 클로드가 웹사이트를 뚝딱 만들어줘. 결과물을 보면… 와! 숙소 예약 사이트처럼 필요한 건 다 있고, AI 느낌도 전혀 없어! 우리가 만든 이미지랑 영상도 자연스럽게 들어가서 훨씬 그럴듯해 보이지?
다른 느낌으로도 가능! "다른 테마로 만들어줘" 하면 또 다른 느낌으로 만들어줘. 다국어 번역, 요금 캘린더, 결제 시스템까지 붙여서 진짜 쓸 수 있는 결과물로 발전시킬 수도 있어. 더 자세한 내용이 궁금하면 댓글로 남겨줘!
✏️ 내 입맛대로 수정하기
처음 나온 결과물이 마음에 안 들면? 걱정 마!
- 내용 수정: "이거 여러 페이지로 나눠줘" 하면 그대로 나눠주고.
- 데이터 바꾸기: 바꾸고 싶은 부분을 캡처해서 클로드한테 보여주고 "이 내용 좀 바꿔줘" 하면, 클로드가 어떻게 바꾸면 좋을지 먼저 물어보고 제안해 줄 거야.
- 어떻게 고쳐야 할지 모르겠다면? "내 사이트 좀 보고 추가하거나 수정할 내용 제안해 줘" 라고 물어보면, 클로드가 직접 문제점이나 개선할 부분을 제안해 줄 거야.
핵심은 이거야! 우리는 웹사이트 만드는 기술 몰라도 돼. 그냥 내가 만들고 싶은 웹사이트에 들어갈 내용만 말해주면, 클로드가 알아서 다 만들어줘!
💡 웹사이트 디자인 꿀팁 사이트!
더 멋진 웹사이트를 만들고 싶다면, 이런 사이트를 참고해 봐.
- 다양한 효과와 템플릿: 스크롤 내릴 때 화면 전환되는 효과 같은 멋진 효과들이 엄청 많아. 마음에 드는 효과를 발견했다면, '카피 프롬프트' 버튼 누르고 클로드한테 "내 사이트에도 이 효과 넣어줘!" 라고 요청하면 돼.
📸 원하는 디자인 따라 만들기
이미 마음에 드는 웹사이트 디자인이 있다면? 그걸 똑같이 따라 만들 수도 있어!
- 캡처해서 모으기: 원하는 웹사이트를 위에서부터 쭉 캡처해서 모아.
- 클로드한테 보여주기: 캡처한 이미지들을 클로드한테 첨부하고 "이런 느낌의 화장품 웹사이트 만들고 싶어. 폴더에 이미지들도 있으니 참고해줘." 라고 요청하면, 클로드가 첨부한 이미지를 보고 비슷한 느낌으로 웹사이트를 만들어 줄 거야.
🚀 세상에 공개! 웹사이트 배포하기
지금까지 만든 웹사이트는 내 컴퓨터에서만 볼 수 있잖아? 다른 사람들도 볼 수 있게 '배포'를 해야 해. 이것도 클로드한테 요청하면 돼!
- 넷라이 사용: '넷라이'라는 사이트를 이용하면 일정 시간 동안 웹사이트를 배포할 수 있어. 프로젝트 폴더를 그대로 끌어다 놓으면 비밀번호와 함께 누구든 접근할 수 있는 웹사이트가 배포돼! 이제 이 링크로 친구들한테 자랑할 수 있지!
배포에 대해서도 더 궁금한 게 있다면 댓글로 물어봐 줘!
🎉 코딩 없이 나만의 웹사이트 완성!
자, 이렇게 오늘은 코딩 한 줄도 안 치고 클로드를 이용해서 나만의 웹사이트를 만들고 배포하는 것까지 알아봤어.
나만의 제품이나 브랜드를 위한 웹사이트를 만들고 싶었던 사람들은 오늘 배운 대로 정말 쉽게 따라 할 수 있으니 꼭 한번 시도해 봐! 꼭 판매 사이트가 아니더라도, 나만의 포트폴리오 사이트, 가족 홈페이지, 기념일 홈페이지 등등 뭐든지 만들 수 있어.
오늘 영상이 도움이 되었다면 구독과 좋아요 꾹! 다음에도 더 좋은 영상으로 찾아올게!