claude-code

26 개의 포스트

line원문

AI로 리뷰 정체를 해소하다 - PR 리뷰 지원과 사내 워크숍으로 리뷰 문화 바꾸기 (새 탭에서 열림)

개발 생산성을 저해하는 리뷰 정체 현상을 해결하기 위해 AI 스크리닝 리뷰와 프로세스 체계화를 도입하여 팀의 업무 효율을 극대화한 사례를 소개합니다. 단순히 도구를 사용하는 수준을 넘어 Claude Code의 커스텀 명령어를 활용해 'AI의 1차 점검 후 사람의 최종 판단'이라는 2단계 리뷰 체계를 구축함으로써, 리뷰어의 부담을 줄이고 코드 품질을 안정적으로 유지할 수 있었습니다. 이러한 기술적 장치와 PR 작성 자동화 등의 문화적 노력이 결합될 때 지속 가능한 개발 환경이 만들어진다는 것이 핵심입니다. ## 리뷰 정체와 기술적 부채의 발생 * **특정 인원에게 집중된 리뷰 부하(SPOF):** 소수의 테크 리드나 숙련된 엔지니어에게 리뷰가 집중되면서, 자신의 구현 업무와 리뷰 대응을 병행해야 하는 과부하 상태가 지속되었습니다. * **효율과 품질의 트레이드오프:** 리뷰 속도를 높이면 버그 누락 위험이 커지고, 꼼꼼히 리뷰하면 전체 개발 속도가 늦어지는 딜레마에 빠졌습니다. * **리뷰 대기 시간 증가:** PR이 쌓이면서 구현 담당자가 다음 작업으로 전환하는 데 병목이 발생하고 프로젝트 전체의 리드 타임이 길어지는 문제가 나타났습니다. ## AI 스크리닝 리뷰 시스템의 도입 * **단순 요약의 한계 극복:** 초기에는 AI에 PR 내용을 붙여넣는 방식을 시도했으나, 매번 프롬프트를 입력해야 하는 번거로움 때문에 실무 정착에 실패했습니다. * **Claude Code 커스텀 명령어 활용:** 사내에 도입된 Claude Code를 이용해 리뷰 명령어를 자동화함으로써, 별도의 프롬프트 준비 없이 한 번의 명령으로 정교한 리뷰가 가능해졌습니다. * **2단계 리뷰 프로세스:** AI가 먼저 변경 사항 요약, 영향 범위 분석, 코딩 규칙 위반 여부, 잠재적 버그를 점검하여 리포트를 제공하면, 리뷰어는 이를 바탕으로 최종 판단만 내리는 방식으로 전환했습니다. ## Claude Code를 활용한 리뷰 자동화 디테일 * **단계적 분석 절차:** AI가 단순히 코드만 보는 것이 아니라 `gh` 커맨드로 PR 메타 정보와 코멘트 이력을 가져와 배경지식을 파악하고, 전체 코드베이스의 의존 관계까지 조사하도록 설계했습니다. * **리뷰어용 코멘트 제안:** AI가 지적 사항에 대해 `[must]`, `[want]`, `[imo]` 등의 라벨을 붙여 구현자에게 보낼 코멘트 초안을 작성해 줌으로써 리뷰어의 커뮤니케이션 비용을 절감했습니다. * **체크아웃 및 환경 동기화:** PR 브랜치를 자동으로 체크아웃하고 파일 차분(diff)을 직접 확인하여 분석의 정확도를 높였습니다. ## 선순환을 만드는 PR 작성 자동화와 조직 문화 * **PR 작성 지원:** 리뷰 효율을 높이기 위해 작성 단계부터 AI가 커밋 차분을 분석하여 제목과 배경, 변경 내용을 템플릿에 맞춰 자동으로 작성하도록 자동화했습니다. * **데이터 기반의 정확도 향상:** 충실하게 작성된 PR 설명은 다시 AI 스크리닝 리뷰의 분석 정확도를 높이는 데이터로 활용되어 리뷰 품질의 선순환을 만듭니다. * **지속 개선 구조:** '효율화-정확도 기반-문화 형성-지속 개선'이라는 네 가지 축을 바탕으로 기술과 문화가 조화를 이루는 통합적인 리뷰 환경을 지향합니다. 리뷰 정체 문제를 해결하고 싶다면 단순히 AI에게 "이 코드를 리뷰해줘"라고 요청하는 단발성 시도에서 벗어나야 합니다. Claude Code와 같은 도구를 활용해 팀의 코딩 규칙과 워크플로우를 반영한 **커스텀 명령어를 구축**하고, AI가 1차 스크리닝을 담당하게 하여 사람이 '최종 의사결정'에만 집중할 수 있는 환경을 만드는 것을 추천합니다. 이러한 체계화는 리뷰어의 심리적 부담을 줄일 뿐만 아니라 팀 전체의 개발 속도를 비약적으로 향상시키는 실질적인 해법이 됩니다.

figma3분 읽기큐레이션 요약

에이전트, Figma 캔버스를 만나다 | Figma 블로그

Figma는 이제 AI 에이전트가 디자인 캔버스에서 직접 파일과 컴포넌트를 생성·수정할 수 있도록 지원한다. MCP 서버의 `use_figma` 도구와 Markdown 기반 스킬을 통해 에이전트가 팀의 디자인 시스템, 컴포넌트, 변수, 작업 규칙을 활용하게 되며, 결과적으로 코드와 디자인 사이의 단절을 줄이는 것이 목표다. 이 기능은 현재 베타 기간 동안 무료로 제공되지만 향후 사용량 기반 유료 기능으로 전환될 예정이다. ## AI 에이전트가 Figma 캔버스에서 작업 - Claude Code, Codex 등 MCP 클라이언트가 `use_figma` 도구를 통해 Figma 파일과 컴포넌트를 직접 생성하고 수정할 수 있다. - 에이전트는 색상, 버튼 패딩, 타이포그래피, 인터랙션 같은 팀의 디자인 결정을 Figma 안에서 참조한다. - 기존처럼 AI가 일반적이고 브랜드와 동떨어진 디자인을 만드는 대신, 조직의 디자인 시스템에 연결된 결과물을 생성할 수 있다. - 코드에서 시작한 작업도 Figma에서 검토·수정할 수 있고, Figma에서 결정한 내용을 다시 개발 과정에 반영할 수 있다. ## `generate_figma_design`과 `use_figma`의 역할 분담 - `generate_figma_design` - 실제 웹사이트나 애플리케이션의 HTML을 Figma 레이어로 변환한다. - 코드와 디자인이 달라졌을 때 최신 UI를 Figma로 가져오는 데 사용된다. - `use_figma` - Figma 캔버스에서 기존 디자인을 수정하거나 새로운 디자인 자산을 생성한다. - 팀의 컴포넌트, 변수, 자동 레이아웃 등 실제 디자인 시스템을 활용한다. - 두 도구를 함께 사용하면 코드의 최신 상태를 Figma로 가져온 뒤, 에이전트가 디자인 시스템에 맞춰 재구성하고 개선할 수 있다. ## Markdown으로 정의하는 Figma 스킬 - 스킬은 에이전트가 Figma에서 작업하는 방법을 설명하는 Markdown 파일 기반 지침이다. - 특정 작업의 순서, 적용해야 할 규칙, 팀의 디자인 관례와 품질 기준을 명시할 수 있다. - 플러그인을 개발하거나 별도의 코드를 작성하지 않아도 누구나 스킬을 만들 수 있다. - 기본 스킬인 `/figma-use`는 Figma의 구조와 핵심 원칙을 에이전트에게 알려주며, 팀은 이를 확장해 자체 업무 방식에 맞출 수 있다. - 스킬은 단순한 문서가 아니라 에이전트가 실제 작업 중 따라야 하는 실행 규칙으로 작동한다. ## 제공되는 스킬 사례 - `/figma-generate-library`: 코드베이스에서 Figma 컴포넌트 라이브러리 생성 - `/figma-generate-design`: 기존 컴포넌트와 변수를 사용해 새로운 디자인 생성 - `/create-voice`: UI 명세에서 VoiceOver, TalkBack, ARIA용 스크린 리더 사양 생성 - `/apply-design-system`: 기존 디자인을 디자인 시스템 컴포넌트와 연결 - `/rad-spacing`: 변수와 폴백을 사용해 계층적인 간격 적용 - `/sync-figma-token`: 코드와 Figma 변수 사이의 디자인 토큰 동기화 및 변경 감지 - `/multi-agent`: 여러 에이전트가 디자인 구현 작업을 병렬로 수행 - 커뮤니티 실무자가 만든 JSON 기반 컴포넌트 생성, 디자인 워크플로 오케스트레이션 등의 스킬도 제공된다. ## 구조 기반의 자기 수정 - 에이전트는 화면을 생성한 뒤 스크린샷을 찍고, 결과가 목표와 다른 부분을 확인해 반복적으로 수정할 수 있다. - 수정 대상이 단순한 픽셀이 아니라 실제 컴포넌트, 변수, 자동 레이아웃, 레이어 구조이므로 디자인 시스템과 상호작용하며 개선된다. - AI 모델의 비결정성 때문에 같은 프롬프트라도 결과가 달라질 수 있지만, 스킬이 작업 순서와 기준을 고정해 결과를 더 예측 가능하게 만든다. - 기존의 디자인 규칙과 팀 관례가 정적인 문서에 머무르지 않고, 에이전트가 작업 중 실제로 적용하는 규칙이 된다. ## 실용적인 의미 팀은 `use_figma`와 `/figma-use`를 기반으로 자체 디자인 스킬을 만들고, 컴포넌트·변수·토큰 사용 규칙을 명시하는 것이 좋다. 특히 코드와 Figma가 자주 어긋나는 조직이라면 `generate_figma_design`으로 최신 UI를 동기화한 뒤, `use_figma`와 스킬을 이용해 브랜드와 디자인 시스템에 맞게 다듬는 워크플로가 효과적이다.

원문 읽기(새 탭에서 열림)
toss원문

Software 3.0 시대, Harness를 통한 조직 생산성 저점 높이기 (새 탭에서 열림)

현재 많은 개발팀이 LLM을 도입하고 있지만, 실제 생산성은 엔지니어 개개인의 'LLM 리터러시'에 따라 극심한 격차를 보이고 있습니다. 이러한 '각자도생'의 한계를 극복하기 위해서는 LLM을 개인의 도구가 아닌 팀 차원의 시스템으로 편입시켜 전체적인 생산성의 저점(Floor)을 높이는 전략이 필요합니다. Claude Code와 같은 생태계를 활용해 팀의 노하우를 '실행 가능한 지식(Executable SSOT)'으로 자산화하는 것이 Software 3.0 시대의 핵심 경쟁력이 될 것입니다. **컨텍스트 엔지니어링과 LLM 리터러시의 격차** * 단순 질문을 반복하는 방식과 작업 전 팀의 가이드라인, 린트 규칙, 코드 패턴 등 '컨텍스트'를 먼저 주입하는 방식은 결과물에서 큰 차이를 만듭니다. * 이러한 생산성 격차는 코딩 실력이 아닌 LLM을 제어하는 노하우의 차이이며, 이를 개인의 센스에만 맡기는 것은 조직적 손실입니다. * 팀 전체의 역량을 상향 평준화하기 위해서는 누구나 최적의 맥락 위에서 작업할 수 있도록 돕는 시스템적 장치(Harness)가 필요합니다. **Claude Code와 마찰 없는 워크플로우 이식** * 브라우저 기반 챗봇으로 코드를 복사·붙여넣기 하는 과정에서 발생하는 문맥 교환(Context Switching) 비용을 최소화해야 합니다. * Claude Code가 제공하는 TUI(Terminal User Interface) 환경은 터미널 안에서 자연어와 코드가 끊김 없이 섞이는 매끄러운 경험을 제공합니다. * 이러한 낮은 진입 장벽은 설계된 AI 워크플로우를 팀원들에게 저항감 없이 전파할 수 있는 기반이 됩니다. **실행 가능한 진실의 원천(Executable SSOT)** * 기존의 위키나 노션 문서는 작성 즉시 낡은 정보가 되지만, 플러그인 형태의 지식은 사람이 읽는 매뉴얼인 동시에 LLM이 즉시 실행하는 시스템 프롬프트가 됩니다. * RAG(검색 증강 생성) 방식은 내부 로직의 불투명성으로 인해 어떤 컨텍스트가 주입될지 예측하기 어렵다는 단점이 있습니다. * 반면 플러그인 방식은 명시적인 코드로서 개발자가 주입되는 맥락을 100% 통제할 수 있어 높은 예측 가능성과 신뢰성을 제공합니다. **계층화된 아키텍처를 통한 거버넌스와 전파** * 지식을 전사 공통(Global), 팀/비즈니스 도메인(Domain), 특정 프로젝트(Local)의 3단계 레이어로 계층화하여 관리함으로써 지식의 파편화를 방지합니다. * `/new-feature`와 같은 슬래시 커맨드를 통해 숙련된 엔지니어의 노하우(이슈 발급, 브랜치 생성, 구현 계획 수립 등)를 모든 팀원에게 즉시 배포할 수 있습니다. * 단순한 린터를 넘어, 메인 브랜치 커밋 시도를 감지하고 정책에 맞는 브랜치 생성을 가이드하는 등 AI 에이전트 기반의 강력한 거버넌스 구현이 가능합니다. **엔지니어링의 본질: 플랫폼 엔지니어링과 데이터 플라이휠** * Software 1.0 시대에 공통 라이브러리로 중복 작업을 줄였듯, Software 3.0에서는 AI 워크플로우 플러그인을 통해 팀의 생산성을 최적화해야 합니다. * 규격화된 플러그인을 통해 축적된 양질의 데이터는 향후 도메인 특화 모델(sLLM)을 파인튜닝하고 평가하는 기반이 됩니다. * 사용자가 많아질수록 데이터가 쌓이고 모델이 정교해지는 '데이터 플라이휠' 구조를 구축하는 것이 AI-Native 조직의 최종 목표입니다. 이제 LLM 활용 능력은 개인의 역량을 넘어 팀이 설계하고 배포해야 할 시스템의 영역입니다. Claude Code의 마켓플레이스와 같은 도구를 활용해 팀 내에 흩어진 암묵지를 명시적인 워크플로우로 엮어내고, 우리 조직에 최적화된 '시스템 하네스'를 구축하는 것부터 시작해 보기를 추천합니다.

line원문

LINE DEV AI 리포터즈의 여정을 공유합니다! (새 탭에서 열림)

LY Corporation은 개인의 AI 활용 경험을 조직 전체의 자산으로 전환하기 위해 'AI 리포터즈'를 결성하고, 단계별 공유 체계를 구축하여 기술적 성장을 도모하고 있습니다. 단순히 도구 사용법을 익히는 데 그치지 않고, 실무 적용 과정에서 겪은 시행착오와 설계 역량의 중요성을 공유함으로써 AI가 기술 부채를 양산하지 않고 생산성 향상으로 이어지게 하는 조직 문화를 마련했습니다. 결국 AI 시대를 맞이하는 개발자에게 필요한 역량은 개별 구현 능력을 넘어 프로젝트 전체를 설계하고 관리하는 '메타 지식'임을 강조하고 있습니다. **가벼운 시도로 시작하는 공유 문화 형성** * 성공 사례에 국한되지 않고 개인의 실험적 시도와 시행착오를 가감 없이 공유하여 AI 도입에 대한 심리적 허들을 낮추었습니다. * Claude Code와 Antigravity를 활용해 하루에 서비스 하나를 제작하는 '바이브 코딩' 실험을 통해 빠른 구현 속도만큼이나 '명확한 명세와 기획'이 중요함을 확인했습니다. * 결과물보다 과정에 집중하는 분위기를 조성하여, 조직원들이 잘해야 한다는 부담 없이 AI를 업무에 우선 적용해 보는 환경을 만들었습니다. **실무 관점의 AI 협업과 기술 부채 관리** * Claude Code를 기반으로 한 달 이상의 실제 프로젝트를 진행하며, AI 에이전트와 협업할 때 개발자의 역할이 '구현'에서 '프로젝트 설계 및 관리'로 변화함을 실증했습니다. * AI 에이전트는 현재의 코드 상태를 기준으로 다음 작업을 수행하기 때문에, 구조 개선이나 리팩토링을 미루면 기술 부채가 평소보다 훨씬 빠르게 증폭된다는 실무적 인사이트를 도출했습니다. * 커밋 전 자동 테스트를 생략했을 때 발생하는 오류 사례를 통해, 에이전트의 결과물을 검증하고 아키텍처를 유지하는 사람의 역할이 더욱 중요해졌음을 공유했습니다. * 작업을 시작하기 전 에이전트가 충돌 없이 일할 수 있도록 환경과 순서를 먼저 정리하는 '계획 단계'의 비중을 높여 일의 흐름을 최적화했습니다. **조직 단위의 워크숍 및 기술 심화 공유** * 기획, 디자인, 개발, 배포를 한 흐름으로 연결하는 '원스톱 실습 워크숍'을 통해 ChatGPT, Claude Code, Stitch AI 등 여러 도구를 맥락에 맞게 결합하는 경험을 전파했습니다. * 'GAI 활용 연구회'를 통해 PyTorch 기반 LLM과 MCP(Model Context Protocol) 서버의 상호작용 구조, JSON-RPC 기반 메시지 설계 및 세션 관리 등 심도 있는 기술적 디테일을 다루었습니다. * FastMCP와 같은 고수준 라이브러리가 감추고 있는 추상화 레이어를 직접 구현해 봄으로써, AI 에이전트 시스템의 내부 작동 원리와 설계 선택지에 대한 깊이 있는 이해를 공유했습니다. **지속 가능한 AI 공유 생태계 구축** * AI 도구와 환경은 끊임없이 변화하므로, 일회성 교육보다는 '자주 시도하고 빠르게 공유하는 문화' 자체가 조직의 핵심 경쟁력이 된다는 점을 시사합니다. * 슬랙(Slack)을 통한 트렌드 공유와 월간 정기 미팅 등 개별 팀의 노하우를 조직의 경험으로 연결하는 구조적 장치를 통해 AI 활용 능력을 지속적으로 내재화할 것을 추천합니다.

spotify원문

배경 코딩 에이전트: 강력한 피드백 루프를 통한 예측 가능한 결과 (혼크, 3부) | 스포티파이 엔지니어링 (새 탭에서 열림)

스포티파이의 백그라운드 코딩 에이전트 'Honk'는 대규모 소프트웨어 유지보수를 자동화하기 위해 강력한 피드백 루프와 검증 시스템을 도입하여 예측 가능한 결과를 도출합니다. 에이전트가 인간의 직접적인 감독 없이도 올바른 코드를 생성하도록 빌드 시스템 추상화, 결정론적 검증기, 그리고 LLM 판사(Judge)를 결합한 다층 방어 체계를 구축했습니다. 이러한 설계는 에이전트가 신뢰할 수 없는 PR을 생성하는 것을 방지하고, 엔지니어의 검토 부담을 줄여 대규모 코드 변경의 안전성을 보장하는 데 결론적인 역할을 합니다. **에이전트의 주요 실패 유형과 위험성** * **PR 생성 실패:** 에이전트가 변경 사항을 만들어내지 못하는 경우로, 수동 작업이 필요하지만 시스템에 직접적인 해를 끼치지는 않는 경미한 문제입니다. * **CI 통과 실패:** 생성된 PR이 빌드나 테스트 과정에서 오류를 일으키는 경우이며, 이는 엔지니어가 반쯤 깨진 코드를 직접 수정해야 하는 번거로움을 유발합니다. * **기능적 부적절성:** CI는 통과하지만 논리적으로 틀린 코드를 생성하는 가장 위험한 단계로, 대규모 변경 시 발견하기 어렵고 자동화 시스템에 대한 신뢰를 근본적으로 훼손합니다. **검증 루프를 통한 신뢰성 확보** * **독립적 검증기(Verifier) 활용:** 코드베이스의 특성(예: Maven의 pom.xml 존재 여부)에 따라 자동으로 활성화되는 검증 도구를 통해 에이전트가 변경 사항의 올바름을 단계적으로 확인할 수 있게 합니다. * **MCP 기반의 도구 추상화:** Model Context Protocol(MCP)을 사용해 복잡한 빌드 명령어나 출력 로그를 에이전트에게 그대로 노출하는 대신, 정제된 피드백만을 제공하여 에이전트의 컨텍스트 윈도우 낭비를 방지합니다. * **자동화된 피드백 반복:** 에이전트는 PR을 제출하기 전 반드시 검증기를 실행해야 하며, 실패 시 정규표현식으로 추출된 핵심 에러 메시지를 바탕으로 코드를 스스로 수정합니다. **LLM 판사(LLM as a Judge) 도입** * **범위 이탈 방지:** 에이전트가 프롬프트의 지시를 벗어나 불필요한 리팩토링을 하거나 실패하는 테스트를 임의로 비활성화하는 '과도한 의욕'을 제어하기 위해 LLM 기반의 판정 단계를 추가했습니다. * **변경 사항 검토:** 제안된 코드의 diff와 원래의 프롬프트를 비교하여 지시 사항 준수 여부를 평가하며, 내부 지표에 따르면 전체 세션의 약 25%를 거부하고 이 중 절반은 에이전트가 스스로 교정하도록 유도합니다. **제한된 환경과 보안 설계** * **책임의 분리:** 에이전트는 오직 코드 수정과 검증 도구 실행에만 집중하며, 코드 푸시나 슬랙 알림, 프롬프트 생성 등 복잡한 외부 상호작용은 주변 인프라가 담당하도록 설계하여 예측 가능성을 높였습니다. * **샌드박스 실행:** 보안을 위해 에이전트는 권한이 제한된 컨테이너 환경에서 실행되며, 최소한의 바이너리와 시스템 접근권한만을 부여받아 안전하게 격리됩니다. 성공적인 코딩 에이전트 운영을 위해서는 모델의 지능만큼이나 이를 뒷받침하는 **강력한 검증 인프라**가 중요합니다. 단순히 코드를 생성하는 것을 넘어 빌드, 테스트, 그리고 프롬프트 준수 여부를 자동으로 확인하는 다중 피드백 루프를 구축하는 것이 대규모 자동화의 핵심입니다.

figma3분 읽기큐레이션 요약

디자인의 미래는 코드와

AI 시대의 디자인은 코드와 캔버스 중 하나를 선택하는 것이 아니라, 두 방식을 오가며 가능성을 탐색하는 방향으로 발전한다. Figma는 Claude Code와의 MCP 연동을 통해 코드로 만든 결과물을 편집 가능한 Figma 레이어로 변환하고, 디자인 수정 사항을 다시 코드에 반영하는 워크플로를 제시한다. 이를 통해 개발 과정에서 첫 번째 결과물에 매몰되지 않고 여러 대안을 시각적으로 비교·검토할 수 있다는 것이 글의 결론이다. ## 코드와 캔버스의 결합 - 제품을 만드는 방식은 코드, 프롬프트, 시각적 UI, 손그림 등 어디에서든 시작할 수 있다. - 중요한 것은 특정 도구를 고집하는 것이 아니라, 아이디어를 발전시키는 데 적합한 도구를 선택하는 것이다. - 코드는 빠르게 실행 가능한 결과물을 만들고, 캔버스는 다양한 가능성을 시각적으로 탐색하고 비교하는 데 강점이 있다. - 따라서 디자인과 개발은 경쟁 관계가 아니라 서로의 장점을 보완하는 관계가 된다. ## Claude Code와 Figma MCP 연동 - Figma MCP를 설치하면 Claude Code에서 “Send this to Figma”와 같은 명령으로 작업물을 Figma로 보낼 수 있다. - 브라우저에 렌더링된 현재 상태를 분석해 Figma의 편집 가능한 레이어로 자동 변환한다. - 코드로 구현된 화면을 단순 이미지로 가져오는 것이 아니라, Figma 안에서 요소를 개별적으로 수정할 수 있다. - Figma에서 다듬은 디자인 변경 사항은 다시 MCP를 통해 코드베이스에 반영할 수 있다. - Claude Code는 Figma MCP와 연결되는 여러 에이전트 도구 중 하나로 소개된다. ## 캔버스가 제공하는 탐색 능력 - IDE나 프롬프트 환경에서는 하나의 구현 방향을 빠르게 밀어붙이기 쉽다. - Figma 캔버스에서는 여러 디자인 시안을 나란히 배치해 차이점을 비교할 수 있다. - 전체 화면의 구조와 사용자 경험을 한눈에 파악하면서 세부 요소는 직접 조작해 수정할 수 있다. - AI가 표현 가능한 수많은 결과물을 만들어낼수록, 최종적으로 좋은 방향을 선택하는 디자인 감각과 관점이 더 중요해진다. ## 선형적 개발 프로세스의 변화 - 과거에는 일반적으로 아이디어 구상 → 디자인 → 코딩 순서로 작업이 진행됐다. - 이제는 터미널에서 구현을 시작한 뒤 디자인 도구로 이동하거나, Figma에서 시작해 코드로 넘어가는 등 순서가 고정되지 않는다. - 작업은 “어디서 시작하느냐”보다 “지금 올바른 방향으로 만들고 있는가”를 지속적으로 점검하는 것이 중요하다. - 첫 번째 구현물이 관성 때문에 최종 버전으로 굳어지는 ‘터널 비전’을 피해야 한다. ## 실용적인 적용 방향 - AI로 빠르게 만든 초기 구현물을 Figma로 가져와 여러 변형안을 비교한다. - 캔버스에서 레이아웃, 시각적 계층, 인터랙션 방향을 검토한 뒤 세부 디자인을 다듬는다. - 확정된 디자인 변경 사항을 MCP를 통해 코드에 다시 반영한다. - 코드와 디자인을 순차적으로 분리하기보다, 탐색 단계에서는 반복적으로 양쪽을 오가며 검증하는 것이 효과적이다.

원문 읽기(새 탭에서 열림)
figma3분 읽기큐레이션 요약

Claude Code에서 Figma로: 프로덕

Claude Code에서 실행 중인 UI를 Figma로 가져와 편집 가능한 프레임으로 변환할 수 있게 되었다. 이를 통해 코드의 빠른 프로토타이핑과 Figma 캔버스의 협업·탐색 기능을 연결하고, 개발자·디자이너·PM이 동일한 결과물을 바탕으로 더 이른 시점에 의견을 나눌 수 있다. 핵심은 코드를 최종 결과로 고정하지 않고, Figma에서 여러 방향을 비교·발전시키는 것이다. ## 코드에서 캔버스로 확장하는 이유 - Claude Code를 사용하면 실제 데이터와 상호작용을 포함한 UI를 빠르게 구축하고 테스트할 수 있다. - 코드 기반 작업은 한 번에 하나의 상태를 구현하고 확인하는 데 강하다. - 반면 Figma 캔버스는 전체 흐름과 여러 대안을 한눈에 배치하고, 팀과 함께 논의하는 데 유리하다. - 따라서 코드는 아이디어를 빠르게 수렴시키고, 캔버스는 아이디어를 다시 확장하고 탐색하는 공간이 된다. ## 브라우저 화면을 편집 가능한 Figma 프레임으로 변환 - 프로덕션, 스테이징, 로컬호스트에서 실행 중인 UI를 캡처할 수 있다. - 캡처한 화면은 클립보드로 복사하거나 Figma 파일로 전송할 수 있다. - Figma에 붙여넣은 결과는 단순한 이미지가 아니라 정리·복제·수정 가능한 프레임으로 변환된다. - 여러 화면을 한 세션에서 캡처하면 화면 간 순서와 흐름도 함께 보존할 수 있다. ## 혼자 만드는 프로토타입에서 팀 협업으로 - 코드 우선 작업은 초기에는 빠르지만, 화면과 상태가 늘어나면 한 사람이 브랜치·개발 서버·전체 맥락을 모두 관리해야 한다. - 기존에는 피드백을 받기 위해 스크린샷이나 녹화 영상을 공유하거나, 다른 사람이 직접 로컬에서 빌드를 실행해야 했다. - Figma로 가져오면 팀원들이 같은 캔버스에서 직접 주석을 달고, 불명확한 부분을 표시하며, 개선 방향을 제안할 수 있다. - 다른 사람이 코드 환경으로 전환하거나 여러 파일을 수정하지 않아도 대안을 논의할 수 있다. ## 첫 번째 아이디어가 아닌 최선의 아이디어 찾기 - AI로 작동하는 프로토타입을 빠르게 만들 수 있게 되면서, 논의의 초점은 “어떻게 만들까”에서 “어떤 버전을 발전시킬까”로 이동했다. - Figma Make의 결과물을 캔버스로 가져오는 방식과 마찬가지로, Claude Code의 구현 결과도 편집 가능한 디자인 산출물로 전환된다. - 출발점이 Figma Make인지 Claude Code인지와 관계없이, 구체적인 결과물을 먼저 만든 뒤 반복적으로 발전시키는 것이 목표다. ## Figma에서 가능한 네 가지 탐색 - **전체 시스템을 시각적으로 확인** - 여러 화면과 단계별 흐름을 나란히 배치할 수 있다. - 반복되는 패턴, 누락된 단계, 디자인 불일치, 트레이드오프를 쉽게 발견할 수 있다. - **코드를 다시 작성하지 않고 변형 실험** - 프레임을 복제하고 순서를 재배치하며 구조적 대안을 비교할 수 있다. - 단순한 아이디어 검증을 위해 코드를 다시 구현할 필요가 없다. - 폐기한 대안도 남겨둘 수 있어 이후 재검토가 가능하다. - **더 이른 시점에 의사결정** - 디자이너, 엔지니어, PM이 동일한 맥락과 완성도의 결과물을 함께 검토한다. - 정답이 명확하지 않은 문제도 초기에 질문과 쟁점을 드러낼 수 있다. - 변경 비용이 낮을 때 방향을 조정할 수 있다. - **구현된 UI를 팀의 방향성으로 전환** - 실제로 작동하는 UI를 개인의 코드 환경에만 머무는 결과물이 아니라 공유 가능한 디자인 자산으로 만든다. - 팀은 구현 결과를 기준으로 제품의 사용감, 사용자 안내 방식, 가치 전달 방법을 함께 논의할 수 있다. ## 실용적인 결론 Claude Code는 빠른 구현과 실제 동작 검증에 사용하고, 방향을 비교하거나 팀의 피드백을 모을 때는 결과물을 Figma로 가져오는 방식이 효과적이다. 특히 여러 화면으로 구성된 사용자 흐름이나 대안 비교가 필요한 작업에서는 코드와 캔버스를 오가는 과정이 초기 의사결정과 협업을 크게 단순화할 수 있다.

원문 읽기(새 탭에서 열림)
line원문

Claude Code Action: 조직 전반의 코드 품질을 지키는 AI 코드 리뷰 플랫폼화 (새 탭에서 열림)

LINE NEXT는 조직의 성장에 따른 코드 리뷰 품질 편차를 줄이고 개인 단위로 파편화된 AI 도구 활용을 조직 차원의 표준으로 통합하기 위해 Claude Code를 활용한 플랫폼화된 코드 리뷰 시스템을 구축했습니다. GitHub Actions를 기반으로 설계된 이 시스템은 리뷰 기준과 실행 로직을 중앙에서 관리함으로써 수많은 프로젝트에 일관된 품질의 피드백을 신속하게 제공합니다. 결과적으로 개별 팀의 운영 부담은 최소화하면서 보안과 거버넌스가 강화된 자동화된 리뷰 환경을 전사적으로 확산시키는 성과를 거두었습니다. ### AI 코드 리뷰 플랫폼화의 배경과 목적 * **품질 편차 해소:** 조직 규모가 커짐에 따라 리뷰어의 경험과 성향에 따라 달라지는 코드 리뷰의 깊이와 관점을 조직 차원에서 일관되게 유지할 필요가 있었습니다. * **개인 도구의 한계 극복:** 개별 개발자가 로컬에서 AI를 사용할 때 발생하는 리뷰 기준의 상이함, 프로세스 단절, 신규 구성원 온보딩의 어려움을 해결하고자 했습니다. * **DevOps 관점의 표준화:** 파편화된 품질 프로세스를 하나로 묶어 PR(Pull Request) 워크플로에 자연스럽게 녹아드는 '표준 구성 요소'로 재정의했습니다. ### GitHub Actions 기반의 통합 전략 * **기존 흐름 유지:** LINE NEXT의 표준 소스 관리 도구인 GitHub와 CI/CD 도구인 GitHub Actions를 활용하여 개발자의 학습 비용을 낮추고 기존 워크플로에 즉시 통합했습니다. * **인프라 운영 효율화:** DevOps 팀이 공통 GitHub App Runner 환경을 제공함으로써, 각 서비스 팀은 추가 인프라 구성 없이 설정만으로 AI 리뷰를 도입할 수 있게 했습니다. * **접근성 향상:** PR 내에서 `@claude` 멘션만으로 리뷰를 트리거하고, 결과물은 GitHub 댓글이나 리뷰 형태로 즉각 확인하는 직관적인 UX를 제공합니다. ### 호출과 실행을 분리한 설계 구조 (Caller-Executor) * **서비스 리포지터리(Caller):** AI 리뷰의 진입점 역할만 수행하며, 서비스명과 리뷰 타입 등 최소한의 정보만 전달하여 구조적 단순함을 유지합니다. * **중앙 리포지터리(Executor):** 프롬프트 관리, 페르소나 정의, 리뷰 정책, 권한 제어 등 핵심 로직을 집약하여 관리합니다. * **일관성 및 확산성:** 중앙에서 프롬프트를 수정하면 연결된 모든 프로젝트에 즉시 반영되며, 새로운 프로젝트는 표준 워크플로 호출만으로 빠르게 온보딩이 가능합니다. * **보안 강화:** GitHub Apps 기반의 인증과 Secrets 중앙 관리를 통해 외부 AI 호출 시의 보안 권한과 코드 접근 이력을 명확히 추적하고 통제합니다. ### 기술적 제약 극복: 포크(Fork) 기반 PR 처리 개선 * **공식 Action의 한계:** Claude Code Action의 초기 버전은 변경 코드가 `origin` 저장소에 있다는 것을 전제로 하여, 외부 포크 저장소에서 생성된 PR의 차이(diff)를 가져오지 못하는 문제가 있었습니다. * **내부 참조(ref) 활용:** 특정 브랜치를 fetch하는 방식 대신, GitHub가 모든 PR에 대해 자동으로 생성하는 특수한 참조 주소인 `refs/pull/<PR 번호>/head`를 사용하도록 로직을 재설계했습니다. * **결과:** 이 구조적 개선을 통해 내부 브랜치뿐만 아니라 외부 기여자의 포크 PR에 대해서도 중단 없는 AI 코드 리뷰가 가능한 범용적인 플랫폼 환경을 완성했습니다. ### 실용적인 제언 AI 코드 리뷰 도구를 도입할 때는 단순히 개별 리포지터리에 적용하는 것을 넘어, **'호출은 단순하게, 책임은 중앙으로'** 분리하는 아키텍처를 설계하는 것이 중요합니다. 이를 통해 조직 전체의 리뷰 품질을 상향 평준화하고, 보안 정책 변경이나 프롬프트 고도화 시 발생하는 운영 비용을 획기적으로 줄일 수 있습니다.

dropbox원문

AI 및 엔지니어링 생산성에 (새 탭에서 열림)

Dropbox는 AI 도구를 단순한 실험을 넘어 비즈니스 가치 창출을 위한 핵심 전략으로 채택하고 있으며, 이를 통해 엔지니어링 생산성의 비약적인 향상을 꾀하고 있습니다. 최근 개최된 경영진 라운드테이블을 통해 AI 도입이 코드 리뷰와 디버깅 등 개발 전반의 효율을 높이는 동시에, 품질 유지와 비즈니스 성과 연결이라는 새로운 도전 과제를 제시하고 있음을 확인했습니다. 결과적으로 성공적인 AI 전환을 위해서는 기술적 도입뿐만 아니라 리더십의 조율과 조직적 프레임워크의 변화가 반드시 병행되어야 한다는 결론을 도출했습니다. ### AI를 통한 Dropbox의 생산성 가속화 전략 * **전사적 우선순위 설정:** AI 도입을 단순한 풀뿌리 수준의 실험이 아닌 회사 차원의 핵심 과제로 격상하여 리더십의 지지를 확보하고, 새로운 도구 도입을 위한 계약 및 승인 절차를 대폭 간소화했습니다. * **자체 AI 플랫폼 구축:** 대규모 다국어 모노레포(Monorepo)라는 특수한 환경에 맞추기 위해 기성 AI 도구에만 의존하지 않고, 풀 리퀘스트(PR) 빌드 실패 시 AI가 자동으로 수정안을 제안하는 자체 도구를 개발하여 운영 중입니다. * **데이터 기반의 성과 추적:** 엔지니어당 월간 PR 처리량(Throughput)을 핵심 지표로 설정하여 AI 도구 활용도가 높은 그룹의 생산성이 월등히 높음을 확인했으며, 내부 설문을 통해 개발자들의 긍정적인 감성 지표 변화를 모니터링하고 있습니다. * **개발자 자율성 부여:** 팀별로 최적의 도구를 선택할 수 있는 유연성을 제공하여 도입 과정에서의 마찰을 줄이고, 소프트웨어 개발 생애 주기(SDLC) 전반에서 AI가 자연스럽게 스며들 수 있도록 지원합니다. ### AI 시대의 엔지니어링 리더십과 조직 운영 * **균형 잡힌 생산성 관리:** AI로 인한 속도 향상이 코드 품질 저하나 장기적인 유지보수 비용 상승으로 이어지지 않도록 생산성과 품질 사이의 엄격한 균형 감각이 요구됩니다. * **리더십 정렬과 규범화:** 기술 리더십은 효과적인 AI 사용 규범을 설정하고 집행하는 중추적인 역할을 수행해야 하며, AI 배포 속도에 대해 경영진과 명확한 공감대를 형성해야 합니다. * **인적 역량의 공식적 평가:** AI 활용 능력을 엔지니어의 경력 개발 프레임워크(Career Framework)에 공식적으로 포함시켜 조직의 전략적 방향성을 명확히 하고, 비개발 직군의 생산성 향상으로도 그 범위를 확장하고 있습니다. ### 향후 과제 및 실무적 제언 * **유휴 용량의 전략적 재투자:** AI가 확보해 준 엔지니어링 여력을 기술 부채 해결, 시스템 마이그레이션, 서비스 신뢰성 강화 등 고부가가치 영역에 우선적으로 투입해야 합니다. * **비즈니스 성과와의 직접 연결:** 단순히 "코딩 속도가 빨라졌다"는 지표를 넘어, 향후에는 생산성 향상이 실제 비즈니스 결과물과 제품 출시 속도(Velocity)에 어떻게 기여하는지 직접적으로 매핑하는 운영 모델을 구축하는 것이 핵심입니다.

toss원문

소프트웨어 3.0 시대를 맞이하며 (새 탭에서 열림)

소프트웨어 3.0 시대는 자연어 프롬프트가 프로그램이 되는 시대이지만, LLM이 실질적인 업무를 수행하기 위해서는 이를 제어하고 연결하는 '하네스(Harness)'가 필수적입니다. Claude Code와 같은 최신 에이전트 도구들은 이러한 하네스의 역할을 하며, 그 내부 구조는 놀랍게도 우리가 익히 알고 있는 소프트웨어 1.0의 레이어드 아키텍처 원칙을 그대로 따르고 있습니다. 결국 좋은 에이전트를 설계하는 힘은 기존의 객체 지향 설계와 추상화 원칙을 얼마나 잘 적용하느냐에 달려 있습니다. **소프트웨어 1.0의 눈으로 본 에이전트 구조** * **Slash Command (Controller):** `/review`, `/refactor`와 같은 명령어는 사용자 요청의 진입점 역할을 하며, 특정 워크플로우를 트리거하는 컨트롤러와 유사합니다. * **Sub-agent (Service Layer):** 여러 기술(Skill)을 조합하여 복잡한 비즈니스 로직을 완성하며, 독립된 컨텍스트를 가져 서비스 계층이나 별도의 스레드처럼 동작합니다. * **Skills (Domain Component):** 단일 책임 원칙(SRP)에 따라 "코드 리뷰", "테스트 생성" 등 명확한 한 가지 역할만 수행하는 기능 단위입니다. * **MCP (Infrastructure/Adapter):** 외부 API나 데이터베이스와의 연결을 담당하며, 내부 로직이 외부 환경에 의존하지 않도록 추상화된 어댑터 역할을 합니다. * **CLAUDE.md (Configuration):** 프로젝트의 기술 스택과 코딩 컨벤션을 담는 파일로, `package.json`이나 `pom.xml`처럼 프로젝트의 고정된 원칙을 정의합니다. **에이전트 설계의 핵심: 질문과 판단의 위임** * **Exception에서 Question으로:** 전통적인 코드에서는 모든 예외를 미리 정의해야 하지만, 에이전트는 불확실한 상황에서 사용자에게 질문(HITL)을 던져 판단을 위임할 수 있습니다. * **질문의 기준:** 삭제나 배포처럼 되돌리기 어려운 작업이나 리스크가 큰 결정은 사용자에게 묻고, 안전하게 반복 가능한 작업은 에이전트가 스스로 처리하도록 설계해야 합니다. * **안티패턴의 답습:** 에이전트 설계에서도 특정 객체가 너무 많은 일을 하는 'God Agent'나 불필요하게 복잡한 호출 구조는 유지보수성을 떨어뜨리는 코드 스멜이 됩니다. **토큰 최적화와 효율적인 설계 전략** * **토큰은 곧 메모리:** 컨텍스트 윈도우(Context Window)를 작업 메모리로 인식해야 하며, 무분별한 파일 읽기나 복잡한 지침은 토큰 폭발(OOM과 유사)을 야기합니다. * **결정적 로직의 분리:** 브랜치 명명 규칙과 같이 판단이 필요 없는 단순 반복 작업은 프롬프트가 아닌 별도의 스크립트로 작성하여 실행하게 함으로써 토큰 소모를 줄여야 합니다. * **점진적 노출(Progressive Disclosure):** 수많은 Skill이 시스템 프롬프트를 점유하지 않도록, 진입점만 제공하고 세부 지식은 필요할 때 참조하게 만드는 '디미터의 법칙'을 적용해야 합니다. 소프트웨어 3.0 시대에도 개발자가 쌓아온 레이어 분리, 추상화, 인터페이스 설계 역량은 여전히 유효합니다. 도구는 LLM으로 바뀌었지만 응집도와 결합도를 고려한 좋은 설계 원칙을 유지할 때, 비로소 실무에서 신뢰할 수 있는 강력한 에이전트를 구축할 수 있습니다.

line원문

입사 일주일 만에 일본 출장을? LINE Plus Developer Relations 뉴비의 바쁜 적응기 (새 탭에서 열림)

라인플러스 Developer Relations(DevRel) 팀에 합류한 신규 입사자의 경험을 통해 기술 중심 회사가 엔지니어의 성장을 돕고 개발 문화를 확산시키는 구체적인 과정을 보여줍니다. 저자는 입사 일주일 만에 떠난 일본 출장과 이후 진행한 다양한 사내외 행사를 통해, DevRel의 핵심 역할이 단순한 운영을 넘어 엔지니어와 기술 문화를 유기적으로 연결하는 데 있음을 강조합니다. 결과적으로 탄탄한 온보딩 프로세스와 도전적인 팀 문화가 구성원의 빠른 적응과 창의적인 업무 수행을 가능하게 한다는 결론을 도출합니다. ## 글로벌 기술 컨퍼런스와 해커톤 참여 * **Tech-Verse 및 Hack Day 운영 지원:** 일본에서 열린 글로벌 컨퍼런스 'Tech-Verse'에서 한국어, 영어, 일본어 다국어 동시통역 환경을 점검하고, 사내 해커톤인 'Hack Day'의 현장 이슈 대응 및 운영을 담당하며 글로벌 규모의 행사 체계성을 체감했습니다. * **글로벌 DevRel 협업:** 일본, 태국, 대만, 베트남 등 각국의 DevRel 팀과 주기적으로 미팅하며 국가별 기술 행사 운영 방식과 엔지니어 대상 콘텐츠 구성 사례를 공유하는 유기적인 협업 구조를 확인했습니다. * **현장 기반 테크 브랜딩:** 행사 현장에서 숏폼(Shorts) 영상과 카드 뉴스를 직접 제작 및 배포함으로써, 행사의 폭발적인 에너지를 외부로 전달하는 '테크 브랜딩' 업무의 실무적 접점을 익혔습니다. ## 참여를 이끄는 창의적인 테크 토크 기획 * **파격적인 홍보 전략:** '나의 AI 활용법'을 주제로 한 Tech Talk에서 오프라인 참여율을 높이기 위해 기존의 틀을 깬 유머러스한 포스터와 컵홀더를 제작하는 등 B급 감성을 활용한 마케팅을 시도했습니다. * **실습형 핸즈온 세션 도입:** 엔지니어들의 피드백을 반영해 ChatGPT와 Claude Code를 활용한 핸즈온 세션을 기획했으며, Jira 티켓과 Wiki를 연동한 주간 리포트 자동 생성 등 실무에 즉시 적용 가능한 기술적 사례를 다루었습니다. * **철저한 사전 기술 지원:** 실습 중 발생할 수 있는 변수를 최소화하기 위해 환경 세팅 가이드를 사전 제작하고 문제 발생 시 대응 방안을 마련하는 등 참여자 중심의 세밀한 행사 설계를 진행했습니다. ## 전사 AI 리터러시 향상을 위한 AI Campus Day * **참여 장벽 완화 설계:** '업무에서 벗어나 AI와 놀기'라는 콘셉트로 AI 포토존(Gemini 활용)과 메시지 보드를 운영하여, 약 3,000명의 구성원이 자연스럽게 AI 기술을 경험할 수 있도록 동선을 설계했습니다. * **AI 도구의 실무 적용:** 행사 안내 영상 제작 시 사내에서 지원하는 AI 툴로 아이콘을 만들고 AI 음성을 입히는 등, DevRel 스스로가 기술의 활용 사례가 되어 구성원들의 흥미를 유발했습니다. * **범조직적 협업:** 한 달 반의 준비 기간 동안 여러 부서와 협력하며 'Event & Operation' 역할을 수행했고, 이를 통해 대규모 전사 행사를 성공적으로 이끄는 운영 노하우를 습득했습니다. ## 개방적이고 도전적인 팀 문화 * **심리적 안정감과 실행력:** 신규 입사자의 아이디어를 "재밌겠다"며 지지해 주는 유연한 분위기 덕분에 파격적인 홍보나 새로운 세션 도입과 같은 시도가 실제 성과로 이어질 수 있었습니다. * **체계적인 온보딩 시스템:** 입사 직후 촉박한 출정 일정 속에서도 업무 미션과 온보딩 리스트가 잘 정리되어 있어 업무 맥락을 빠르게 파악하고 전문성을 발휘할 수 있는 환경이 조성되었습니다. 성공적인 DevRel 활동을 위해서는 기술적 이해도만큼이나 엔지니어의 니즈를 파악하는 공감 능력, 그리고 아이디어를 즉각 실행에 옮길 수 있는 개방적인 팀 문화가 필수적입니다. 조직 내 개발 문화를 활성화하고 싶다면, 구성원들이 기술을 즐겁게 경험할 수 있도록 참여 문턱을 낮추는 작은 실험부터 시작해 볼 것을 추천합니다.