결과물
약 6~7시간 이상 추정
- 템플릿 기능 설치 _template
- 폴더 구조 설계
웹사이트
https://selfishclub-all.github.io/aaa-archive/
스킬 생성
| 명령어 | 기능 | 사용법 |
|---|---|---|
/analyze N | N주차 통합 분석 + 벌금 계산 | /analyze 3 |
/propose | 스킬 제안 + AAA 봇 인사이트 | /propose |
/ln N | N주차 링크드인 초안 생성 | /linkedin 3 |
/archive | 아카이브 북 갱신 | /archive |
/publish | 웹사이트 배포 | /publish |
/analyze, /propose, /linkedin, /archive, /publish
만든과정 및 삽질
깃헙데스크탑앱 없어도 된다
스킬 만들었지만 , 자연어로 해도 충분히 다 된다
증상(디자인 깨짐)만 보고 코드를 계속 고치지 말고, 도구 자체의 한계인지 먼저 의심해보자”**
상황 Obsidian에 있는 Markdown 파일을 웹사이트로 변환하기 위해 Quartz*를 사용하고 있었는데, 디자인이 의도대로 나오지 않는 문제가 있었다.
내가 시도한 것 디자인 코드(CSS) 문제라고 생각하고 여러 차례 수정을 시도했다. → 화면을 캡처해서 “이 모양대로 그려줘”, “여기 이렇게 바꿔줘” 식으로 접근 → 그런데 계속 의도한 대로 반영이 안 됨
진짜 원인 코드가 잘못된 게 아니라, Quartz 자체의 구조적 한계가 원인이었다. 기본 제공 범위를 벗어나는 커스터마이징을 하려면 SSG 내부 구조까지 파악해야 해서, 디자인/레이아웃을 자유롭게 바꾸기 어려웠다.
해결 근본적인 원인을 파악한 뒤, Astro*로 전환해서 해결했다. Astro는 디자인과 레이아웃을 자유롭게 커스터마이징할 수 있어서 의도한 디자인이 바로 적용됐다.
*Quartz — Obsidian의 Markdown 파일을 웹사이트로 변환해주는 무료 도구. 간편하지만 디자인 커스터마이징에 구조적 한계가 있다. *Astro — 마찬가지로 Markdown을 웹사이트로 변환할 수 있는 정적 사이트 생성기. Quartz와 달리 디자인과 레이아웃을 자유롭게 커스터마이징할 수 있다.
상황 팀원들이 Claude를 사용할 때 일관된 결과를 얻을 수 있도록, 커스텀 스킬(인스트럭션)을 만들어서 공유했다.
내가 시도한 것 작업 규칙을 스킬로 정의해서 팀 전체가 같은 방식으로 사용하도록 세팅했다. → 스킬 구조 잡기, 조건 정의, 세부 지시 다듬기 등에 시간을 들임
알게 된 것 GitHub 등으로 같은 파일과 맥락을 공유하고 있는 상태라면, 굳이 스킬을 만들지 않아도 자연어 프롬프트만으로 충분히 같은 결과가 나왔다. Claude가 파일의 구조와 맥락을 이미 파악하고 있기 때문에, 자연어로 원하는 걸 설명하면 스킬을 적용했을 때와 동일한 퀄리티로 처리해줬다.
교훈 팀 내 파일과 맥락이 이미 공유되어 있다면, 처음부터 스킬을 만드는 데 시간을 쓰기보다 자연어로 먼저 시도해보자. 스킬은 그래도 부족한 부분이 있을 때 보완용으로 만드는 게 더 효율적이다.
인사이트
깃헙 브랜치 개념을 몰랐다면?
만약 브랜치 개념을 모르고 모두가 같은 곳에서 직접 작업했다면, 충돌이 나서 파일이 전부 꼬였을 수 있었다. GitHub 공유회에서 브랜치 워크플로우를 쉽게 설명해주어서 설계를 할 수 있었따. AI 도구를 팀으로 활용할수록, Git 브랜치 같은 기본개념을 먼저 갖추는 게 중요하다. 도구가 아무리 좋아도 기반이 없으면 꼬이고 산으로 가버리는 것 같다
—
어드민 페이지 생성
어드민 페이지가 있으면 좋을 것 같다는 생각이 들었는데, 기존 프로젝트 폴더에서 그대로 작업을 하려고 함.
기존 프로젝트와 같은 폴더에서 작업하면, 디자인 레이아웃이나 claude.md가 서로 꼬일 수 있지 않을까 라는 우려가 생김
어드민과 메인 사이트는 성격이 다른데, 같은 맥락 파일을 공유하면 Claude가 혼동할 가능성이 있지 않을까?
어드민 폴더에 공유할 맥락 파일 만들어달라고 하고, 새폴더 생성.
성격이 다른 작업은 폴더와 맥락 파일을 분리하자. Claude가 참고하는 맥락이 섞이면 의도와 다른 결과가 나올 수 있다
스티치 활용 디자인
그림그리고 > 코드보기 > 클로드에 입히기
https://stitch.withgoogle.com/projects/7169259003323256118
다시 한다면?
1. 큰 그림부터 잡는다 바로 코드에 들어가지 않고, 먼저 레퍼런스 레이아웃으로 전체 구조를 잡는다. “이 영역에 이런 내용, 저 영역에 저런 내용” 식으로 배치를 먼저 정한 뒤에 세부 작업에 들어간다.
2. Claude에게 의견을 적극적으로 구한다 내 머릿속으로만 구상하려 하지 않고, Claude에게 “너가 이런 정보를 가지고 있다면, 어떤 정보들을 뽑을 수 있어?”라고 먼저 물어본다. 내가 미처 생각하지 못한 관점이나 빠진 항목을 Claude가 제안해줄 수 있기 때문에, 혼자 고민하는 것보다 더 빠르고 풍부한 결과를 얻을 수 있다.
1. 멤버별 빌딩 패턴 분석
- 누가 어떤 도구를 자주 쓰는지
- 누가 어떤 분야에 강한지
- 예: “에밀리는 CRM/자동화 특화, 흐민은 AI 철학 특화”
2. 주차별 트렌드 맵
- Week 01: Agent Loop 입문
- Week 02: 원소스 멀티유즈 폭발 (4명 동시 집중)
- Week 03: ???
- “이번 주 스터디에서 가장 핫한 키워드”
3. 도구 조합 레시피
- 에밀리: Claude Code + n8n + SOLAPI = CRM 자동화
- 오웬: Claude API + Playwright + instagrapi = 카드뉴스 자동화
- “이 도구 3개를 조합하면 이런 걸 만들 수 있다”
4. 빌딩 타임라인
- “URL 하나로 20개 콘텐츠 생성” (에밀리)
- 얼마나 빠르게, 어떤 과정으로 만들었는지
5. 실패/삽질 인사이트
- 과제에서 “만든과정 및 삽질” 섹션에 실패 경험이 있음
- “이렇게 하면 안 된다” = 가장 가치 있는 인사이트
6. 크로스 멤버 시너지
- 에밀리(CRM) + 오웬(카드뉴스) + 다니(멀티채널) = 통합 콘텐츠 봇
- 서로 다른 멤버의 결과물을 합치면 뭐가 되는지
다음주에 추가할 기능
- 푸쉬하면 슬랙으로 노티오게
- 어드민 페이지에서 이미지, 태그값 수정할 수 있게
—