AI와 개발을 쉽게 이해하는 실험실

비개발자도 따라오는 AI 도구, 자동화, 개발 실험 기록

AI & LLM/Claude & Anthropic

Claude Artifacts 예시 7가지 — 직접 만들어본 미니앱

루민 Lumin 2026. 6. 16. 13:29
반응형

"코드 한 줄 안 써도 나만의 앱을 만들 수 있다"는 말, 처음 들으면 마케팅 문구처럼 들립니다. 저도 그랬습니다.

그런데 Claude Artifacts를 한 달쯤 써보니 생각이 달라졌습니다. 거창한 서비스는 아니지만, 일상에서 자잘하게 필요한 도구는 정말 5~10분이면 만들어집니다.

이 글은 개발 경험이 없어도 따라 할 수 있게 풀어 썼습니다. 제가 직접 만들어 써본 미니앱 7개를 골라, 어떤 프롬프트를 넣었고 어떻게 활용 중인지까지 같이 적었습니다.

Claude Artifacts가 뭔지부터 짧게

Claude Artifacts는 Claude(앤트로픽이 만든 AI 챗봇)가 만들어준 결과물을 대화창 옆에 별도 미리보기 창으로 띄워주는 기능입니다.

쉽게 비유하면 이렇습니다. 보통 챗봇은 글로만 답을 주는데, Artifacts는 그 답이 실제로 작동하는 작은 웹페이지나 앱으로 옆 창에 바로 떠요. 버튼을 누르면 진짜로 동작합니다.

항목 일반 ChatGPT 답변 Claude Artifacts
결과물 형태 텍스트 설명 실제 작동하는 화면
수정 방법 코드 복붙 후 실행 "버튼 색 바꿔줘" 한 줄이면 끝
비개발자 난이도 높음 낮음
공유 코드 전달 링크 한 개로 공유
💡 글 작성 시점 기준으로 Artifacts는 Claude 무료 플랜에서도 쓸 수 있습니다. 단, 하루 사용량 제한이 있어 본격적으로 쓰려면 Pro 플랜(월 20달러)이 편합니다.

만들기 전 알아둘 것 한 가지

Artifacts로 만든 앱은 브라우저 안에서만 동작하는 가벼운 도구입니다. 입력한 데이터는 페이지를 닫으면 대부분 사라집니다.

가계부처럼 데이터가 계속 쌓여야 하는 앱은, 프롬프트에 "데이터를 브라우저에 저장(localStorage)해줘"라고 한 줄 추가하면 됩니다. 이 단어만 알아두면 90%는 해결됩니다.

자, 이제 실제 예시로 들어가겠습니다.

1. 하루 가계부 — 5분짜리 첫 도전

가장 처음 만든 미니앱입니다. 시중에 가계부 앱은 많지만 광고가 많거나 기능이 무거워서, 진짜 단순한 게 필요했습니다.

제가 넣은 프롬프트:

"오늘 하루 지출만 기록하는 단순한 가계부를 만들어줘. 금액과 항목(식비/교통/기타)만 입력하고, 하단에 합계가 나오게. 데이터는 브라우저에 저장해서 새로고침해도 유지되게 해줘."

3~4번 대화하니 완성됐습니다. 색이 너무 칙칙해서 "파스텔톤으로 바꿔줘"라고 하니 바로 반영되더군요.

[금액 입력] [항목 선택 ▼] [추가 버튼]
─────────────────────
오늘 합계: 23,400원
  ├ 식비: 12,000원
  ├ 교통: 3,400원
  └ 기타: 8,000원

복잡한 가계부 앱에 지친 분이라면 이 정도가 오히려 매일 쓰게 됩니다.

2. 영어 단어장 — 출퇴근용

지하철에서 영어 단어 외울 때 쓰려고 만들었습니다. 시중 앱은 가입을 요구하거나 광고가 끼어드는 게 싫었거든요.

핵심 요청 사항:

  • 단어와 뜻을 미리 입력해두기
  • 카드를 누르면 뜻이 나타남 (플립 카드)
  • "맞춤/틀림" 버튼으로 자가 채점
  • 틀린 단어만 다시 보여주기

이 4줄을 그대로 프롬프트에 넣었더니 한 번에 작동하는 버전이 나왔습니다. 솔직히 좀 놀랐습니다.

💡 팁: 단어장처럼 데이터를 미리 채워두고 싶다면, 엑셀에서 단어/뜻을 정리한 뒤 "이 목록을 기본 단어로 넣어줘"라고 붙여넣으면 됩니다.

3. 뽀모도로 타이머 — 집중력용

25분 집중 + 5분 휴식을 반복하는 시간 관리 기법인 뽀모도로(Pomodoro)를 위한 타이머입니다.

웹에 무료 타이머가 많지만, 저는 알림음을 제 취향대로 바꾸고 싶었습니다. 그래서 직접 만들었습니다.

기능 설정값
집중 시간 25분 (조절 가능)
휴식 시간 5분
4번째 사이클 긴 휴식 15분
알림 부드러운 종소리

프롬프트에 "4번째 사이클마다 긴 휴식 15분을 자동으로 넣어줘"처럼 세부 규칙을 글로 적기만 하면 그대로 구현됩니다.

4. 회의록 요약 템플릿 — 직장인용

회의 끝나고 정리하는 시간이 늘 부담이었습니다. 그래서 양식을 입력하면 자동으로 마크다운 형태로 정리해주는 템플릿을 만들었습니다.

[회의명] 입력칸
[참석자] 입력칸
[안건] 입력칸 (여러 개 추가 가능)
[결정사항] 입력칸
[액션 아이템] 입력칸 (담당자/마감일)
        ↓
   [복사 버튼] 클릭
        ↓
정리된 마크다운이 클립보드에

회의록을 슬랙이나 노션에 붙여넣을 때 형식이 깨지지 않아서, 만든 것 중 가장 많이 씁니다.

5. BMI + 적정 칼로리 계산기

키, 몸무게, 나이, 활동량을 입력하면 BMI와 하루 권장 칼로리를 계산해주는 도구입니다. 수식 자체는 인터넷에 다 있지만, 결과를 한 화면에 깔끔하게 보여주는 게 의외로 없더군요.

추가로 요청한 것:

  • 결과 옆에 "저체중/정상/과체중" 색상 표시
  • 권장 칼로리 옆에 "이 정도면 밥 ○공기 정도"라는 직관적 비유
  • 결과를 이미지로 저장하는 버튼

마지막 기능은 한 줄로 "결과 화면을 이미지로 저장하는 버튼 추가해줘"라고만 했더니 그대로 됐습니다.

6. 독서 기록장 — 책 좋아하는 분들용

읽은 책을 기록하고, 별점·한 줄 메모·다 읽은 날짜를 남기는 도구입니다. 굿리즈 같은 서비스가 있지만 영어라 불편해서 직접 만들었습니다.

항목 입력 방식
책 제목 텍스트
저자 텍스트
별점 ★ 1~5개 클릭
한 줄 평 텍스트 (140자 제한)
완독일 날짜 선택

여기에 "올해 읽은 책 권수와 평균 별점을 상단에 표시해줘"를 추가했더니, 연말에 보면 꽤 뿌듯한 통계 화면이 됩니다.

7. 오늘의 운동 체크 — 가장 단순한 앱

마지막은 가장 단순합니다. 정말 5분 걸렸습니다.

체크박스 5개 (스쿼트 / 푸쉬업 / 플랭크 / 스트레칭 / 걷기) 옆에 횟수 입력칸, 그리고 하단에 연속 며칠 했는지 카운트만 들어갑니다.

[ ] 스쿼트     ___회
[ ] 푸쉬업     ___회
[ ] 플랭크     ___초
[ ] 스트레칭   ___분
[ ] 걷기       ___분
─────────────
연속 기록: 12일 🔥

화려할 것 없지만 매일 열게 되는 게 신기합니다. 복잡한 운동 앱보다 이게 더 오래 갑니다.

자주 막히는 부분과 해결법

직접 만들면서 헤맸던 지점들입니다.

  • 새로고침하면 데이터가 날아간다: 프롬프트에 "localStorage에 저장해서 새로고침해도 유지되게"를 빼먹은 경우입니다. 한 줄 추가하면 됩니다.
  • 결과물이 너무 단순하다: "디자인을 좀 더 모던하게, 그림자와 부드러운 색감으로 바꿔줘"라고 추가 요청합니다. 디자인 용어를 몰라도 "예쁘게", "깔끔하게" 같은 말도 잘 알아듣습니다.
  • 버튼이 작동 안 한다: "○○ 버튼을 눌러도 반응이 없어. 고쳐줘"라고 그대로 적으면 디버깅까지 해줍니다.
  • 공유하고 싶다: Artifacts 우측 상단의 "Publish" 또는 공유 버튼을 누르면 링크가 생성됩니다. 이 링크를 받은 사람도 별도 가입 없이 앱을 쓸 수 있습니다.
💡 한 번에 완벽하게 만들려고 하지 마세요. 일단 대충 만든 다음, "여기 색 바꿔줘", "이 기능 추가해줘"를 5~10번 반복하는 게 가장 빠릅니다.

마무리

처음엔 "이런 게 진짜 일상에서 쓰일까" 싶었는데, 한 달 지나니 위 7개 중 4개를 거의 매일 켭니다.

핵심은 거창한 걸 만들려고 하지 않는 것입니다. 시중 앱이 있어도, 광고 없고 내 취향대로 만든 도구가 더 오래 갑니다.

오늘 하루 중 "이런 거 있으면 편한데" 싶었던 게 하나쯤 있을 겁니다. 그 한 가지를 그대로 Claude에 적어보세요. 가계부든 타이머든, 5분 안에 화면에 떠있을 겁니다.

반응형