ChatGPT에 브랜드, 서비스, 목표를 설명하세요. VIXNODE가 페이지를 만들기 전에 요구사항과 웹사이트 구조를 정리할 수 있습니다.
입력한 프롬프트“디저트 공방 웹사이트를 만들고 싶어요. 브랜드 이야기, 제품, 자주 묻는 질문, LINE 문의를 넣어 주세요.”
ChatGPT × VIXNODE
웹 디자인을 먼저 배울 필요는 없습니다. ChatGPT에 필요한 내용을 설명하면 VIXNODE가 아이디어를 실제 웹사이트로 구현합니다.
ChatGPT에 브랜드, 서비스, 목표를 설명하세요. VIXNODE가 페이지를 만들기 전에 요구사항과 웹사이트 구조를 정리할 수 있습니다.
입력한 프롬프트“디저트 공방 웹사이트를 만들고 싶어요. 브랜드 이야기, 제품, 자주 묻는 질문, LINE 문의를 넣어 주세요.”
ChatGPT가 업종, 콘텐츠, 목표에 맞게 사이트맵을 계획하고 VIXNODE가 페이지와 공통 구조를 만듭니다.
입력한 프롬프트“인테리어 디자인 스튜디오를 운영하고 있어요. 완성된 웹사이트에 필요한 모든 페이지를 계획해 주세요.”
원하는 느낌을 일상적인 말로 설명하세요. ChatGPT가 VIXNODE에서 구현할 수 있는 구체적인 디자인 방향으로 정리합니다.
입력한 프롬프트“미니멀하고 세련된 일본풍으로 만들어 주세요. 너무 상업적으로 보이지 않게 하고 그라데이션은 적게 써 주세요.”
ChatGPT가 색상, 글꼴, 간격, 이미지, 레이아웃을 정하고 VIXNODE가 실제 페이지에 적용합니다.
입력한 프롬프트“깔끔하고 단순한 구성을 유지하면서 웹사이트를 더 고급스럽게 만들어 주세요.”
ChatGPT가 로고, 색상, 브랜드 포지셔닝을 시각적 규칙으로 정리하고 VIXNODE가 모든 페이지에 적용합니다.
입력한 프롬프트“이 로고와 브랜드 색상을 사용해서 웹사이트 전체에 일관된 브랜드 느낌을 만들어 주세요.”
ChatGPT에 메모를 전달하세요. 제목, 서비스 소개, 자주 묻는 질문, 행동 유도 문구를 다듬으면 VIXNODE가 페이지에 배치합니다.
입력한 프롬프트“수제 디저트를 10년 동안 만들어 왔어요. 따뜻한 문구를 쓰되 과한 판매 표현 없이 주문하고 싶은 마음이 들게 해 주세요.”
ChatGPT에 스크린샷을 보내고 수정할 부분을 알려 주세요. VIXNODE Plugin이 해당 페이지 영역을 업데이트합니다.
프롬프트와 스크린샷“이 영역이 너무 빽빽해 보여요. 이미지를 키우고 제목을 줄인 뒤 버튼을 아래로 옮겨 주세요.”
브랜드, 장면, 색상, 용도를 설명하세요. ChatGPT가 맞춤 이미지를 만들고 VIXNODE가 메인 비주얼, 배너, 콘텐츠에 배치합니다.
입력한 프롬프트“일본풍 디저트 브랜드의 메인 이미지를 만들어 주세요. 자연광, 크림색, 나무 테이블을 활용하고 스톡 사진 같은 느낌은 피해주세요.”
ChatGPT가 공통 구도, 색상, 조명, 시각적 표현을 정하고 모든 페이지의 이미지로 확장합니다.
입력한 프롬프트“새 이미지 모두를 홈페이지와 같은 스타일로 만들어 주세요. 자연광, 낮은 채도, 따뜻한 나무 색감을 유지해 주세요.”
ChatGPT에 모바일 이용 환경을 확인해 달라고 요청하세요. VIXNODE가 글자, 이미지 크롭, 간격, 터치 영역, 읽는 순서를 조정합니다.
입력한 프롬프트“모바일에서 이 페이지를 확인하고 읽거나 누르기 어려운 부분을 수정해 주세요.”
사업 목표를 설명하세요. ChatGPT가 도움이 되는 콘텐츠와 기능을 제안하면 VIXNODE가 만들거나 연결합니다.
입력한 프롬프트“요가 스튜디오를 운영해요. 방문자가 수업을 보고 위치를 확인하고 LINE에 가입한 뒤 체험을 예약할 수 있게 해 주세요.”
ChatGPT가 콘텐츠, SEO, 공개 준비 작업을 확인하고 VIXNODE가 미리 보기, 설정, 게시 과정을 안내합니다.
입력한 프롬프트“웹사이트가 거의 완성됐어요. 정식 공개 전에 남은 작업을 확인해 주세요.”
공개 후에도 ChatGPT로 문구, 이미지, 가격, 행사, 서비스를 바꾸세요. VIXNODE가 요청한 변경 사항을 적용하고 게시합니다.
입력한 프롬프트“추석 선물 상자 가격을 NT$680에서 NT$720으로 바꿔 주세요. 다른 부분은 변경하지 마세요.”
웹페이지 디자인을 직접 조정하세요!
레이아웃과 스타일을 자유롭게 조정해 웹사이트에 독창적인 개성을 더하세요.
고급 AI 기술을 활용하여 코딩 지식 없이도 웹페이지 콘텐츠를 쉽게 조정하고 맞춤 설정할 수 있습니다.
콘텐츠 수정 후 변경 사항을 실시간으로 확인하여 웹사이트가 원하는 모습인지 바로 점검할 수 있습니다.
className, cssStyle, childNodes 등의 요소 속성을 수정, 추가, 삭제하여 웹사이트의 모습과 동작을 조정할 수 있습니다.
프로그래밍 지식이 없어도 됩니다
요소를 추가하고 콘텐츠를 편집하여 아이디어를 멋진 결과물로 만들어 보세요.
가져올 자료, 프롬프트 또는 이미지를 선택하고 시작을 누르면 브라우저 미리 보기에 가져오거나 AI가 생성한 웹페이지가 바로 표시됩니다.
미리 보기에서 수정할 요소를 클릭하세요. 오른쪽에 className, cssStyle, childNodes 등의 요소 속성이 표시됩니다.
자세한 사용 방법은 다음 문서를 참고하세요: 문서
디자인이 완성되면 저장을 누르세요. 페이지 속성을 선택한 뒤 게시를 눌러 웹사이트를 공개하세요. 모바일 기기에서도 웹사이트를 미리 확인할 수 있습니다.
아니요. VIXNODE는 직관적인 작업 흐름과 AI 지원을 제공하므로 코딩 지식 없이 웹사이트를 만들 수 있습니다.
네. VIXNODE는 모바일과 데스크톱을 모두 지원하므로 어디서든 디자인할 수 있습니다.
네. 실시간 미리 보기로 콘텐츠와 레이아웃을 편집한 결과를 바로 확인할 수 있습니다.
네. HTML 파일을 저장하고 다운로드하여 자신의 웹사이트와 호스팅 환경에 배포할 수 있습니다.
네. VIXNODE는 기존 서비스에 맞는 유연한 API 데이터 연동과 사용자 지정 도메인 설정을 지원합니다.
네. 브랜드, 서비스, 웹사이트 목표를 일상적인 말로 설명하세요. ChatGPT가 콘텐츠와 구조를 정리한 뒤 VIXNODE Plugin으로 페이지를 만들 수 있습니다.
네. ChatGPT에 스크린샷을 보내고 수정할 부분을 알려 주세요. 구성 요소 이름을 몰라도 VIXNODE Plugin이 해당 페이지와 콘텐츠를 업데이트할 수 있습니다.
네. 브랜드, 장면, 색상, 용도를 설명하세요. ChatGPT가 만든 맞춤 이미지를 VIXNODE에서 메인 영역, 배너, 콘텐츠에 적용할 수 있습니다.
네. VIXNODE는 미리 보기, 저장, 게시 작업을 지원합니다. 공개 후에도 ChatGPT로 문구, 이미지, 가격, 행사, 서비스를 업데이트할 수 있습니다.