수업 웹앱, 자료, 연수 링크를 3D 미니어처 그림 카드로 보여 주는 쇼룸 사이트 키트입니다. 제 링크트리(https://dossamlink.vercel.app) 구조를 기반으로 만들었습니다.
AI 코딩 도구로 열고 "쇼룸 만들어줘"라고 하면 AI가 이름, 소개, 링크, 콘셉트를 차례로 묻고 설정을 채웁니다. 선생님은 Gemini나 ChatGPT로 그림만 만들어 넣으시면 됩니다. [들어 있는 것]- 첫 화면 조형물, 스크롤에 반응하는 카드 띠, 묶음별 진열장, 카드 펼침 화면
- 테마 3종(밤의 과학관, 라벤더 실험실, 연구 노트). 원하는 분위기를 말하면 새 테마도 만들어 줍니다
- 그림마다 Gemini·ChatGPT에 그대로 붙여 넣을 요청문
[필요한 것]- GitHub 계정, Vercel 계정
- AI 코딩 도구 하나(Claude Code, 안티그래비티, Codex 등)
- Node.js 22.18 이상, git
- 그림용 Gemini 또는 ChatGPT
[시작 순서]1. 저장소에서 Use this template → Create a new repository로 내 저장소를 만듭니다.

2. 내려받아 AI 도구로 열고 "쇼룸 만들어줘"라고 말합니다. 3. AI가 만든 그림 지시서(docs/art-brief.md)대로 그림을 만들어 art-raw 폴더에 넣습니다. 4. "그림 넣어줘"라고 하면 AI가 변환, 검사, 커밋까지 합니다. 5. Vercel에서 내 저장소를 Import 하면 주소가 생깁니다. 자세한 순서도는 저장소의 docs/how-to-use.html을 브라우저로 열면 볼 수 있습니다. [고급형 조형물 (선택)] Blender와 Meshy가 있으면 첫 화면 조형물을 실제로 360도 도는 3D로 바꿀 수 있습니다. 제 링크트리 첫 화면의 회전 조형물이 이 방식입니다.
- Meshy로 소품 3D 모델(GLB)을 최대 6개 만들어 art-raw/3d 폴더에 넣습니다.
- "렌더해줘"라고 하면 AI가 Blender로 테마 색 받침대와 나선 궤도에 소품을 올려 회전 장면을 만들고 사이트에 넣습니다.
- 묶음 표장도 3D로 만들 수 있습니다.
- Meshy 무료 요금제에서 3D 파일을 내려받으려면 Meshy 6.0 Lite 모델로 만들어야 합니다.
- 크롬에 Claude 확장 프로그램(Claude in Chrome)이 연결돼 있으면 AI에게 "Meshy로 소품 만들어줘"라고 직접 시키면 됩니다. Meshy 로그인만 미리 해 두세요.
- Meshy 소품 지시서와 AI 에이전트(아스트라 같은 ChatGPT 에이전트)에게 맡길 요청서는 저장소의 docs/advanced-3d.md에 있습니다.
- Blender는 무료입니다. Meshy 무료 요금제는 월 사용량 제한이 있고, 무료로 만든 모델은 CC BY 4.0이라 사이트 아래에 Meshy 출처를 적어야 합니다(빠지면 검사가 알려 줍니다).
저장소: https://github.com/dossamlab/showroom-kit 코드는 MIT, 문서와 지시서 틀은 CC BY-NC-SA 4.0입니다. 도름스 링크트리 템플릿에서 출발했습니다.

열람 조건: 제한 없음
0이면 제한이 없어요. 도름은 차감되지 않아요. 내가 받은 도름까지만 정할 수 있어요. 관리자 창욱쌤은 운영 관리를 위해 도름 개수와 상관없이 모든 글과 앱을 볼 수 있으니 유의해 주세요.