Canva 코드로 대화형 디자인 만들기
Canva 코드를 사용하면 코드를 작성하는 번거로움 없이 반응형 인터랙티브 디자인을 만들 수 있어요. 다음 두 가지 방법으로 Canva 코드를 사용할 수 있습니다.
- 대화형 코드 디자인 광고 소재 만들기
- 랜딩 페이지, 대시보드 또는 포트폴리오와 같은 상호작용형 디자인을 광고 소재 만들기하여 Canva 편집기에서 편집 및 웹사이트로 게시할 수 있습니다
- 디자인에 대화형 코드 요소 광고 소재 만들기
- 디자인에 따라 퀴즈, 계산기, 차트와 같은 상호작용형 요소를 광고 소재 만들기하여 여러 디자인에 재사용
팁:
- 이 기능이 AI 사용에 미치는 영향에 대해 자세히 알아보세요.
- AI 허용량을 극대화하기 위해 더 나은 프롬프트를 작성하는 방법을 알아보세요.
광고 소재 만들기 대화형 코드 디자인
완전한 상호작용형 경험을 구축하고 싶다면 코드 디자인 유형을 사용하세요.
- 랜딩 페이지, 대시보드, 포트폴리오 등을 광고 소재 만들기
- Canva 편집기에서 편집 및 다듬기
- 반응형 웹사이트로 게시
- Canva 홈페이지에서 코드 를 선택합니다. Canva 편집기가 열립니다.
- Canva 편집기의 Canva AI 탭에서 먼저 디자인을 설명하세요. "사용자 친화적인 대화형 운동 트래커 디자인"과 같은 프롬프트를 입력해 보세요.
- 또는 템플릿 탭에서 템플릿을 찾거나 검색할 수도 있습니다.
- Canva AI를 사용하여 다듬거나 직접 편집할 수 있습니다. 자세한 방법은 인터랙티브 Canva 코드 디자인 및 요소 편집을 참고하세요.
디자인에 대화형 코드 요소 추가
하나의 인터랙티브 컴포넌트를 생성하고 싶다면 'Canva AI 로 이동하여 코드 '를 선택하세요.
- 퀴즈, 계산기, 차트, 더 보기 등을 요소로 광고 소재 만들기.
- 프레젠테이션, 화이트보드 또는 기타 문서 유형에 추가하세요. 웹사이트로 게시하거나 여러 디자인에 요소를 재사용할 수 있습니다.
- Canva 홈페이지에서 Canva AI를 선택합니다.
- 프롬프트 상자에 만들려는 인터랙티브 코드 요소에 대해 설명합니다. 여기에서 AI 프롬프트에 대해 자세히 알아보세요.
- </> 코드를 선택하십시오.
- 키보드에서 Enter 키를 누르거나 제출 버튼을 클릭하세요. Canva AI가 프롬프트에 따라 디자인을 준비합니다.
- 코드 디자인을 생성한 후 디자인에 사용하기를 선택합니다.
- 요소로 추가에서 대화형 코드 요소로 추가할 문서 유형을 선택하세요.
- Canva 코드로 생성된 디자인을 개선하려면 사이드 패널의 대화 상자에서 개선 사항을 프롬프트하세요.
참고: Canva AI의 대화 스레드를 통해 디자인 버전에 액세스할 수 있습니다.
Canva 코드로 생성된 인터랙티브 디자인과 요소를 편집해 보세요
편집기에 있는 도구를 사용하여 Canva 코드로 생성한 디자인을 다듬을 수 있어요. 코드로 생성한 상호작용형 디자인 및 요소 편집 에서 자세히 알아보세요.
디자인 미리 보기 및 게시
미리 보기를 선택하여 디자인과 상호 작용합니다. 모든 디자인이 문제 없이 완성되면 웹사이트로 게시할 수 있습니다. Canva 코드 웹사이트를 게시하고 관리하는 광고 소재 인사이트 방법을 알아보세요.
참고: 상호작용형 기능은 디자인을 Canva에서 조회하거나 웹사이트로 게시할 때 작동합니다.
Canva 코드 버전에 액세스하고, 복사하고, 관리해 보세요
프롬프트를 통해 Canva 코드 디자인을 업데이트할 때마다 Canva는 동일한 대화목록에 새 버전을 자동으로 저장합니다. 이렇게 하면 이전 버전으로 돌아가거나, 이전 버전에서 계속 편집하거나, 생성된 코드를 복사하여 외부에서 사용할 수 있습니다.
버전 기록 보기
- Canva 홈페이지에서 Canva AI 를 엽니다. 프롬프트
- 표시줄에서 </> 코드를 선택하여 사이드바에서 Canva 코드 채팅을 확인하십시오.
- 참고: Canva 코드 채팅 옆에 있는 </> 아이콘 으로 구분할 수 있습니다.
- Canva 코드 채팅 스레드를 엽니다.
- 사이드바에서 사용 가능한 버전을 찾아보세요(예: 버전 1, 버전 2 등).
참고: 동일한 대화 내에서 계속해서 프롬프트를 입력하면 자동으로 새 버전이 생성돼요.
이전 버전 사용
- Canva 코드 대화 스레드를 엽니다.
- 사용하려는 버전을 선택합니다.
- 디자인에 사용하기 를 선택하여 Canva에서 해당 버전을 계속 편집하세요.
코드 확인 및 복사
Canva 코드로 생성된 기본 코드를 확인하고 복사하여 Canva 외부에서 재사용할 수 있습니다.
- Canva 코드 스레드에서 Show code t oggle 을 켭니다.
- 코드 복사 를 선택하여 클립보드에 저장합니다.
Canva 코드 제한
- Canva 코드는 Canva.cn 사용자를 제외하고 Canva에서 사용 가능한 모든 언어를 지원합니다.
- Canva 코드는 사용자가 입력하거나 사용한 설명을 통해서만 지침을 받아들입니다. 더 많은 맥락과 지침을 제공할수록 결과물이 더 좋아집니다.
- 코드를 복사하여 외부에서 재사용할 수 있지만 파일로 내보내거나 Canva 내에서 직접 편집할 수는 없어요.
Canva 코드 웹사이트가 게시되지 않으면 어떻게 해야 하나요?
Canva 코드 웹사이트가 크거나 복잡한 경우 너무 큰 위젯으로 인해 게시되지 않을 수 있습니다. 웹사이트를 간소화하거나 콘텐츠를 더 작은 웹사이트 또는 페이지로 분할해 볼 수 있습니다.동일한 Canva 코드 대화에서 다음을 입력하여 Canva AI에게 물어보세요.
- "Canva에 게시할 수 있도록 웹사이트를 간소화하고 너무 큰 위젯/구성 요소를 줄여 주세요."
- "이 페이지를 2개의 더 작은 게시 가능한 웹사이트/페이지로 분할하세요."
Canva 코드가 업데이트된 버전을 생성하면 다시 게시해 보세요.
팁: 콘텐츠를 더 작은 웹사이트 또는 페이지로 분할하면 게시된 각 사이트에는 더 적은 콘텐츠가 포함되므로 도움이 될 수 있습니다. 웹사이트를 게시된 별도의 웹사이트로 분할하는 경우 해당 URL을 별도로 관리하고 공유해야 합니다.
Canva 외부에서 코드를 재사용할 수 있나요?
네. 코드를 복사하면 나만의 프로젝트에서 사용할 수 있어요. Canva용으로 제작되었지만 외부 도구나 워크플로에 맞게 조정할 수 있습니다.
Canva 코드로 만든 디자인을 상업적 용도로 사용할 수 있나요?
귀하와 Canva 사이에 그리고 법률이 허용하는 한에서, Canva의 AI 기능(Canva 코드 및 제작된 Canva 코드 포함)에 대한 입력 및 출력은 사용자가 소유하며, Canva는 귀하의 입력 또는 출력에 대한 어떤 소유권의 주장도 하지 않습니다. (Canva 코드 생성 포함). 더 보기 내용과 전체 검색어는 AI 기능 검색어를 추천.
내가 Canva 코드로 만든 디자인을 누가 볼 수 있나요?
본인만 Canva 코드와의 대화를 볼 수 있습니다. 디자인에 사용하기 를 클릭하면 해당 버전의 새 디자인이 생성되며, 공유 버튼을 사용하여 디자인(Canva 코드 포함)을 공유할 수 있습니다.
디자인을 웹사이트에 게시하는 경우 액세스 제어는 웹사이트 게시 플로우에서 구성한 설정에 따라 제어됩니다.
팀의 Canva 코드 액세스 권한을 관리할 수 있나요?
관리자, 교사 또는 브랜드 디자이너는 팀 또는 수업에서 Canva 코드에 액세스할 수 있는 사용자를 선택할 수 있습니다.
홈페이지에서 Canva 코드를 찾을 수 없나요? Canva 코드 액세스 제한에 대해 자세히 알아보세요.
코드 줄 변경 사항이 보이지 않는 이유는 무엇인가요?
Canva 코드는 이제 차이점 기반 편집을 사용합니다. 즉, 전체 블록을 다시 생성하는 대신 필요한 코드 줄만 업데이트됩니다. 따라서 디자인 논리에 작은 변경 사항을 적용할 때 더 빠른 피드백을 받을 수 있습니다.
프롬프트를 전송한 후에도 코드 줄이 보이지 않는다면 Canva가 백그라운드에서 필요한 변경 사항만 적용하기 위해 작업 중임을 의미합니다. Canva 코드가 다른 버전 생성을 완료할 때까지 기다려 주세요.
도움이 되셨나요?
도움이 되었어요
도움이 되지 않았어요