AI로 가게 메뉴판 QR 페이지 만들기

준비물

• 컴퓨터와 휴대폰
• ChatGPT 무료 계정, 또는 Claude 무료 계정
• 메뉴판 사진 한 장 (휴대폰으로 찍은 것이면 충분합니다)
• 링크용 Netlify 무료 계정 (구글 계정으로 가입 가능)
• 인쇄할 프린터 또는 인쇄소 (QR 종이를 붙이려면)

이런 결과가 나옵니다

카테고리 탭, 메뉴 이름, 가격, 품절 표시, 영업시간, 전화 버튼이 있는 모바일 메뉴판과 테이블에 붙일 QR 이미지. 아래 예시는 가상 카페 모퉁이 커피입니다.

따라 하기

1. 1

   메뉴판 사진 찍기

   종이 메뉴판을 밝은 곳에서 똑바로 찍습니다. 글자가 흐리거나 비스듬하면 AI가 잘못 읽습니다. 메뉴가 많으면 두세 장으로 나눠 찍어도 됩니다.

   이렇게 되면 성공사진을 확대해도 글자와 가격이 또렷하게 읽히면 됩니다.

2. 2

   ChatGPT에 들어가 사진 첨부하기

   chatgpt.com 에 로그인합니다. 대화창 왼쪽의 + 버튼(또는 클립 모양)을 눌러 메뉴판 사진을 올립니다. Claude를 쓴다면 claude.ai 에서 클립 모양 버튼으로 첨부합니다.

   이렇게 되면 성공대화창 위에 사진 미리보기가 붙어 있으면 됩니다.

3. 3

   프롬프트 붙여넣고 보내기

   사진이 붙은 상태에서 아래 프롬프트를 붙여넣고 보냅니다.

   붙여넣을 프롬프트프롬프트 복사

   첨부한 메뉴판 사진을 읽어서 휴대폰으로 보는 메뉴 페이지를 만들어줘. 파일 하나로 만들어줘.
   
   - 위쪽에 카테고리 탭. 사진에 있는 분류를 그대로 써줘 (예: 커피, 음료, 디저트)
   - 메뉴 이름, 가격, 짧은 설명. 설명이 사진에 없으면 비워둬
   - 가격은 오른쪽에 맞춰서 보여줘
   - 각 메뉴를 "품절"로 바꾸기 쉽게, 메뉴 목록을 파일 맨 위에 한곳에 모아줘. 품절이면 흐리게 보이고 "품절"이라고 떠야 해
   - 글씨는 크게, 휴대폰에서 먼저 보기 좋게
   - 맨 아래에 영업시간과 "전화하기" 버튼
   - 사진에 없는 내용은 지어내지 마
   그리고 이 페이지 주소로 QR 코드를 만드는 방법도 쉽게 알려줘.

   내 것으로 바꿀 곳

   • 영업시간과 전화번호는 보내기 전에 "영업시간: 오전 9시~오후 8시, 전화: 010-0000-0000"처럼 한 줄 추가합니다.
   • 메뉴 사진(음식 사진)을 넣고 싶다면 사진 파일 이름을 정해서 말해야 합니다. 처음엔 글자만으로 시작하세요.
   • 외국인 손님이 많다면 "영어 이름도 같이 보여줘"를 추가합니다.

   이렇게 되면 성공메뉴판 사진에 있던 메뉴와 가격이 들어간 페이지가 나옵니다. ChatGPT는 코드 상자 위의 미리보기, 또는 Canvas의 실행 버튼으로 볼 수 있습니다.

4. 4

   가격과 메뉴를 사진과 하나씩 대조하기

   결과 화면의 모든 메뉴 이름과 가격을 종이 메뉴판과 비교합니다. 숫자는 AI가 틀리기 쉬운 부분입니다.

   이렇게 되면 성공메뉴 개수와 모든 가격이 종이 메뉴판과 같으면 통과입니다.

   팁틀린 곳은 "아메리카노 가격이 4,000원인데 4,500원으로 나왔어. 4,000원으로 고쳐줘"처럼 하나씩 알려주면 고쳐줍니다.

5. 5

   말로 고치기

   보기 좋게 다듬습니다.

   팁이렇게 말하면 됩니다. "글씨를 더 크게", "디저트 탭을 맨 앞으로", "시그니처 메뉴에 별 표시를 붙여줘", "전화하기 버튼을 진한 갈색으로"

6. 6

   파일로 저장하고 링크 만들기

   결과 코드를 복사해 메모장에 붙여넣고 바탕화면 새 폴더에 index.html로 저장합니다. 인터넷 창에서 app.netlify.com/drop 을 열어 폴더를 통째로 끌어다 놓습니다. 몇 초 뒤 "○○○.netlify.app" 주소가 생깁니다. 무료 가입을 하면 주소 잠금이 풀립니다. 자세한 순서는 아래 "링크로 공유하기"를 보세요.

   이렇게 되면 성공와이파이를 끈 휴대폰에서 주소를 열었을 때 메뉴가 보이면 성공입니다.

7. 7

   QR 코드 만들기

   특별한 프로그램 없이 두 가지로 만들 수 있습니다. 방법 하나는 휴대폰 크롬에서 메뉴 주소를 열고 공유 메뉴에서 "QR 코드 만들기"를 누르는 것입니다. 컴퓨터 크롬은 주소창 오른쪽의 공유 아이콘(또는 주소창을 눌렀을 때 나오는 메뉴)에서 "QR 코드 만들기"를 찾습니다. 방법 둘은 네이버 앱 검색창 옆 카메라(렌즈) 아이콘에서 QR 만들기 기능을 쓰는 것입니다. 앱 버전에 따라 이름이 다를 수 있으니, 없으면 크롬 방법을 쓰세요. 만들어진 QR 이미지를 저장합니다.

   이렇게 되면 성공다른 휴대폰 카메라로 QR을 비췄을 때 메뉴 페이지가 열리면 성공입니다.

   팁인쇄 전에 꼭 휴대폰 카메라로 직접 찍어서 열리는지 확인하세요.

8. 8

   QR 인쇄해서 테이블에 붙이기

   저장한 QR 이미지를 워드나 한글 문서에 넣고 A6~A5 크기로 인쇄합니다. QR 주변에 "메뉴는 QR을 찍어주세요" 문구를 적습니다. 코팅하거나 투명 스탠드에 끼우면 오래 갑니다. 메뉴가 바뀌면 AI에게 바뀐 부분을 말해 코드를 고치고, 같은 Netlify 사이트의 Deploys 화면에 폴더를 다시 끌어다 놓으면 QR은 그대로 쓸 수 있습니다.

   팁QR은 최소 3cm 정사각형 이상, 흰 여백을 충분히 두고, 어두운 배경 위에는 인쇄하지 마세요. 반사되는 코팅은 빛 반사로 인식이 안 될 수 있습니다.

막히면

다음에 해볼 것

• 메뉴 사진(음식 사진)을 넣어 보세요. 사진 파일을 폴더에 넣고 이름을 알려주면 메뉴마다 사진이 붙습니다.
• 영어, 일본어 메뉴 페이지를 따로 만들어 QR 하나에서 언어를 고르게 할 수도 있습니다.

여기 쓰인 기능

다른 레시피