<aside> ❓

이 수업에 캔바를 활용하는 이유

</aside>

<aside> 📌

• 코딩 장벽의 제거: 복잡한 프로그래밍 언어를 배우지 않아도 자연어(한국어) 프롬프트만으로 실제 작동하는 웹앱을 즉시 구현할 수 있습니다.
• 플랫폼의 통합성: 디자인 도구인 캔바 내에서 앱 개발, 데이터 관리(Canva Sheet), 게시까지 한 번에 해결되어 수업의 효율성이 극대화됩니다.
• 실시간 아카이빙: 언제 어디서나 접속 가능한 URL 형태로 게시되어, 학생들의 작품이 생성되는 즉시 현장에서 업로드하고 관리할 수 있습니다.
• 데이터 시각화의 강점: 캔바의 미적 감각이 반영된 UI(사용자 인터페이스)를 통해, 투박한 데이터베이스가 아닌 세련된 '디지털 갤러리' 형태의 결과물을 얻을 수 있습니다. </aside>

     **우리 반 작품 전시회**

<aside> ⭐

예시 작품

</aside>

우리 반 작품 전시회

<aside> 📑

레시피

1.캔바 홈화면 ➡️ [Canva AI] ➡️ [</>코드]

2.앱의 목적과 기능을 정의하는 프롬프트를 입력합니다.

3.작동 상태를 점검하고, 미비한 점은 추가 프롬프트를 통해 현장 맞춤형으로 정교화합니다.

4.캔바 코드의 생성 한계를 극복하기 위해, 외부 AI 모델의 도움을 받아 복잡한 코드 로직을 최적화합니다.

5.사용자 경험(UX)을 고려하여 세부 기능을 조정하고 앱의 완성도를 높입니다.

6.완성된 앱은 [게시] ➡️ [URL 편집] ➡️ [게시]

7.사이트 주소(URL)을 QR코드로 만들거나, 단축주소를 만들어 공유합니다.

</aside>

<aside> 📑

레시피

</aside>

1️⃣ 캔바 홈화면 ➡️ [Canva AI] ➡️ [</>코드]

<aside>

• '교사에서 개발자로' 변신하는 마법의 버튼: 첫 진입 시 당황하지 말고, 화면 왼쪽의 프롬프트 창에 아이디어를 텍스트로 적기만 하면 캔바 AI가 수천 줄의 코드를 대신 작성해줍니다.
• 캔바의 생성형 AI 기술 '바이브(Vibe) 코딩' 환경: 디자인 도구인 캔바를 소프트웨어 개발 도구로 변환시키는 첫 번째 관문입니다.
• 자연어 명령을 실제 코드로 변환: 사용자의 프롬프트를 이해하고 실제 작동하는 HTML, CSS, JavaScript 코드를 생성해주는 인공지능 개발실에 입장하는 것과 같습니다.
• 교육적 의의: 복잡한 코딩 언어를 먼저 배우지 않아도 아이디어를 즉시 앱으로 구현해볼 수 있는 '노코드(No-code)/로우코드(Low-code)' 개발의 시작점입니다. 시작점입니다. </aside>

2️⃣ 앱의 목적과 기능을 정의하는 프롬프트를 입력합니다.

<aside>

프롬프트 : 이미지 파일 (JPG, PNG, PDF) 을 넣고, 제목, 이름, 번호를 입력하면 반 학생의 모든 작품이 한 페이지에 네모난 액자 모양의 틀에 제목, 이름, 번호와 함께 전시되는 앱을 만들어줘. 반 학생의 수만큼 액자를 만들어 놓고, 학생이 파일을 삽입하면 작품이 전시되는거야.

</aside>