멀티모달 입력이란?

🧪 직접 해보기: 사진 + 질문 고르기

1. 이미지를 선택하세요

🍕피자 사진

🧾영수증 사진

📊차트 사진

2. 질문을 선택하세요

🍕보낸 입력: - + "-"

AI 답변 (시뮬레이션)

💬 한 줄 정리

예전 AI 챗봇은 텍스트만 주고받을 수 있었어요. 하지만 요즘 AI 모델들은 텍스트, 이미지, 음성, 영상 같은 여러 종류의 입력을 한 요청 안에서 동시에 이해할 수 있는데, 이걸 멀티모달(multimodal) 입력이라고 불러요. 예를 들어 영수증 사진을 올리면서 "이번 달 지출 합계 얼마야?"라고 물으면, AI는 사진 속 글자와 텍스트 질문을 함께 해석해서 답해줘요. 이 페이지의 답변은 실제 이미지 인식 모델이 계산한 게 아니라, 이해를 돕기 위해 미리 작성해 둔 예시 답변이에요.

🧾 이 페이지, 이런 프롬프트로 만들었어요

아래 프롬프트를 복사해서 Claude·ChatGPT(GPT)·Gemini 어디에든 붙여넣고 직접 시도해보세요. 참고로 이건 예시 없이 지시만 담은 제로샷(zero-shot) 프롬프트예요 — 원하는 결과물의 예시를 1개 넣으면 원샷(one-shot), 여러 개 넣으면 퓨샷(few-shot) 프롬프팅이 되는데, 예시를 더할수록 결과가 원하는 스타일에 더 가까워지는 경우가 많아요.

"멀티모달 입력"이라는 AI 개념을 설명하는 한국어 인터랙티브 데모 HTML 페이지를 만들어줘.
- 상단에 이모지 🍕 피자 사진, 🧾 영수증 사진, 📊 차트 사진 3개의 클릭 가능한 이미지 칩을 보여줘
- 이미지를 고르면 그 이미지에 어울리는 질문 칩(예: 피자 → "이 안에 칼로리가 얼마나 될까?")이 아래에 나타나게 해줘
- 이미지와 질문을 모두 고른 뒤에만 "AI에게 물어보기" 버튼이 활성화되게 해줘
- 버튼을 누르면 선택한 이미지+질문 조합에 맞는, 미리 써둔 그럴듯한 AI 답변이 카드로 나타나게 해줘 (3쌍 이상)
- 답변 카드에는 "AI 답변 (시뮬레이션)"이라는 표시를 꼭 넣어서 실제 이미지 인식이 아님을 분명히 해줘
- 하단에 멀티모달 개념을 3~5문장으로 쉽게 설명하는 섹션을 추가해줘
- CSS·JS 전부 인라인으로 넣은 단일 HTML 파일로, 한국어로 출력해줘

🖼️ 멀티모달 입력이란?

🧪 직접 해보기: 사진 + 질문 고르기

💬 한 줄 정리

🧾 이 페이지, 이런 프롬프트로 만들었어요