Plan, do, check, act – 4단계로 이루어진 AI 에이전트
현재 AI를 활용함에 있어, Claude code의 활용도가 매우 높아지는 지금, 다양한 클로드 코드의 플러그인들을 살펴보고 기록을 남겨두고자 한다.
bkit (Bkamp Vibecoding Kit)
>> https://www.bkit.ai/
>> https://github.com/popup-studio-ai/bkit-claude-code
25년 12월 런칭된 Claude Code에서 작동하는 AI 기반 개발 프레임워크이다. PDCA(Plan-Do-Check-Act)라는 방법론을 기반으로 9단계 파이프라인과 11개의 AI 에이전트를 통해 서비스를 고도화하며 만들어갈 수 있다고 한다.
실제 실행해서 테스트해보면 위와같은 4단계가 아니라고 생각될 수도 있다.
- Plan 문서 → 어떻게 만들어야 하는지에 대한 기획
- Design → 각 기능의 컴포넌트 구조, API 변경사항, 데이터 모델 설계
(디자이너의 디자인이라기 보단 개발자를 위한 테크니컬 디자인에 가까움) - Do → 실제 코딩
- Check → gap-detector로 설계 대비 구현 검증
- Report → 완료 보고서
- Act → 2번째, 3번째 Phase로의 진행 (looping)
#1. 설치하기
claude code기준으로 이야기해보면, 클로드코드 터미널에 아래와 같은 내용을 입력해, 설치를 미리 해둔다.
- /plugin marketplace add popup-studio-ai/bkit-claude-code
- /plugin install bkit
#2. 클로드로 PRD작성하기
설치가 마무리되었다면 플러그인을 reload하고 시작해보도록 하자.
reload명령어는 아래와 같다.
- /reload-plugins
만약 이후에도 나타나지 않는 경우 exit으로 나갔다가 다시 들어와보도록 하자.
- /exit
- /claude
이제부터 내가 원하는 서비스를 만들어보도록 하자.
일본어 단어장 테스트 서비스를 하나 만들어보고 싶어서 이렇게 시작해보았다.
1분도 안걸려서 뚝딱 PRD를 만들어주었다.
물론 중간중간 내가 놓친 부분들에 대한 질문들도 아래와 같이 똑똑하게 질문해준다.
이렇게 답변들을 추가적으로 하고 이후 다시 PRD를 읽어보니, 모바일 최적화 부분이 빠진 것을 확인하고 추가적으로 다시 요청을 해보았다.
와. 빈틈이 어디선가 또 나올 수 있겠지만, 지금까지 내용을 보면 거의 완벽해보인다. 역시 AI, claude의 총명함에 다시 감탄을 해본다.
이제 이렇게 만들어진 PRD를 가지고 bkit에 요청을 시작해보자.
#3. claude code로 돌아와 bkit 실행하기
1) Plan
- /pdca [복사한 PRD 붙여넣기]
/pdca를 넣고 복사한 prd를 선택해보자.
알아서 진행해주며, Plan 문서도 너무나 깔끔하게 잘 만들어준다.
(그런데 plan 설정 후에 바로 구현에 들어가는 것을 보니, 다음 부터는 구현 전에 plan을 보고 함께 논의를 좀 더 해보자고 이야기해두어야 겠다)
2-1) DO – coding
이렇게 Plan에 대한 내용들을 사전 정의한 후, Do에 해당하는 내용들을 차근차근 해결해나가는 것을 볼 수 있다. 아래 plan에 대한 내용을 얼마나 잘 정리해두었는지도 확인이 가능하다.
5~10분 정도 기다리니, 구현이 완료되었다는 메시지가 나온다. OCR기능(사진을 보고 문자를 추출하는 기능)이 필요하니, AI api key값이 필요하다고 한다. 2개의 미션을 주었으니 차근차근 진행해보려고 한다.
2-2) Do – design
그런데 보통 PDCA 과정을 거치다보면, Design.md파일을 거치게 되는데 해당 과정이 빠져있음을 확인했다. 다시금 진행해달라고 요청해보니, 아래와 같이 깜박했다며. 다시 실행을 한다.
다음부터는 잊지말고 진행하달라는 내용을 초기부터 적어두어야겠다. (ascii코드로 wireframe을 그려달라는 내용 또한 잊지말자)
아래 design.md파일이 생긴 것을 확인할 수 있다.
(왠지 순서가 바뀐것 같은데, 실제 DO로 들어가기 전에 디자인 파일을 확인 후 실행하는 것이 토큰도 아끼고 앞단의 기획을 더 탄탄히 해줄 수 있는 방법으로 보여진다)
그리고 자연스럽게 전체 구조에 맞추어 코딩을 진행한다.
3) Check
디자인 구조를 만들고 실제 구조에 맞추어 코드들을 구현했다면 이제는 잘 구현이 되었는지 check를 해볼 차례이다. bkit으로 시작했다면 항상 마자막에 그다음 단계를 잘 알려주므로 차근차근 따라가면 된다.
아래 prompt를 통해 gap-detector를 실행시킬 수 있다.
- /pdca analyze japanese-quiz
(japaneze-quiz는 전체 프로젝트명이다)
작업이 마무리되면 analyze한 결과를 보여준다. 전체 상태가 괜찮은지를 보여주고, report.md를 통해 전체 상황을 정리해준 리포트를 보여준다.
(report.md를 보면 전체 문서의 summary를 볼 수 있고, complete, deferred, cancelled 관련 결과도 빠르게 확인해볼 수 있다)
4) Act
PDCA는 기능(feature) 단위로 반복되는 사이클이다.
- Phase 1 PDCA (완료)
- [Plan] → [Design] → [Do] → [Check 100%] → [Report]
이렇게 [Plan] → [Design] → [Do] → [Check 100%] → [Report]까지 첫 번째 사이클이 돌고나면, pdca의 다음 단계로 들어간다. PDCA가 보통 3번 정도는 사이클이 도는데 이를 Phase라고 보통 표현하고, 이 단계가 Act에 해당하는 영역이다.
- PDCA라는 각각의 프로세스는 어떻게 만들 것인가. 에 대한 실행 프로세스이고,
- Phase라고 함은 무엇을 만들것인가. 에 대한 기능범위이자 로드맵이자, PDCA중 ‘A’ Act에 해당
한 사이클을 모두 돌고 나서, Phase2로 진입하니, 아래와 같이 어떤 기능들을 추가할지 물어본다.
실행하다 보니, 어느새 Phase2가 마무리 되었다.
사이클이 완료되면 phase2에 대한 report.md파일도 함께 작성해준다.
지금까지의 과정은 아래와 같고, 현재의 위치는 ✅로 표기를 해두었다.
Japanese Quiz 전체 로드맵
├── Phase 1 (MVP) ← PDCA 1사이클 완료
├── Phase 2 (핵심 기능)
│ └── PDCA 사이클 한번에 묶어서 1회 (또는 기능별 여러 회) ✅
└── Phase 3 (마무리) ← 진행 예정
└── PDCA 사이클 1회
이제 다시중간중간 맘에 들지 않는 점들은 논의해가면서 수정해보면서, Phase3로 진행해보도록 하자.
Phase3까지 깔끔하게 돌아간 후, 최종 배포된 결과물은 아래와 같다. (원하는대로 잘 만들어졌구나)
실제 구현된 결과물을 보고 싶다면. 아래 링크를 통해 확인 가능하다.
>> https://japanese-quiz-mu.vercel.app/
지금까지 bkit이라는 클로드와 제미나이 플러그인을 사용해보았다. 사용해보니, 대략적인 아이디어들만 있어도, 충분히 결과물을 구현해나가는데 무리가 없겠다는 생각이 들었지만, PDCA라는 과정에 대한 명확한 이해가 첫 번째. 실제 Do로 진행 전에 Plan에 대한 영역을 꼼꼼하게 잘 확인하고 이해하는 것이 두 번째. 그리고 Check와 Action 단계를 통해 완성도를 높여가는 것이 세 번째. 이렇게 각 단계를 꼼꼼하게 살펴보다 보면 놓치는 영역이 없겠다 싶을만큼 짜임새 있게 만들어져있다는 느낌을 받았다.
뭐랄까,
bkit은 기획과 개발의 framework을 만들어가는 것
에 강점이 있다고 할까.
다만, 프로덕트를 만들기 위한 PRD에 대한 구조를 체계적으로 이해하고, 전체 개발 프레임웍을 짜나가는데 기본지식이 없다면, 굳이 이 툴을 사용할 필요가 있을까 싶은 생각도 들었다. 주니어들보다는 미들급이나 시니어 전문가들이 더 잘 활용할 수 있는 도구라는 생각. 아무튼 점점 발전해나가고 있는 이 혼돈의 카오스 속에서 다양한 플러그인들이 나오고 사용해볼 수 있다는 것은 행복한 고민이 아닐까 싶다.
[Reference]
– https://www.bkit.ai/
– https://github.com/popup-studio-ai/bkit-claude-code
– https://tilnote.io/pages/6971d065324e33cc1df11173
– https://raindrovvv.tistory.com/143
해당 글은 글쓰는몽글C 님과 모비인사이드의 파트너쉽으로 제공되는 기사입니다.
