AI 코딩 에이전트가 단 사흘 만에 2,000줄짜리 기능을 8,500줄의 기술 부채로 바꿔놓은 사례가 dev.to에 공유됐다. Cursor 에이전트 모드에 감사 로그 기능 하나를 통째로 맡겼더니, 파일 하나하나는 SOLID 원칙을 충실히 따르는 '멋진' 코드였지만, 실제 사용자 액션 하나를 추적하려면 6개의 추상화 레이어와 3개의 어댑터 패턴을 뚫고 지나가야 하는 구조가 완성됐다. 테스트 커버리지는 90%를 넘겼지만, expect(true).toBe(true) 수준의 허수 테스트가 즐비했다. 결말은 예상할 수 있다. 작성자는 하루 동안 고치려다 포기하고, 두 시간 만에 직접 2,100줄로 다시 썼다.
이 사례의 핵심은 AI가 '로컬 최적'을 추구한다는 데 있다. 개별 컴포넌트는 정갈하지만, 시스템 전체의 인지 부하를 고려하는 능력이 없다. AI는 토큰을 예측하지, 코드베이스를 이해하지 않는다. 필요 이상으로 추상화할 이유도 없고, 팀원이 나중에 이 코드를 얼마나 빠르게 파악할 수 있는지를 고민할 동기도 없다. 그것은 여전히 사람의 몫이다. 작성자가 스스로 도출한 원칙은 명료하다. "AI는 함수를 쓴다. 아키텍처는 내가 설계한다."
이 맥락에서 Figma 디자인 시스템 이야기는 의외의 접점을 만들어낸다. velog에 올라온 한 PM의 글은, 컬러 스타일과 컬러 스케일(Primary/50 ~ Primary/900)을 직접 구성해보면서 '색상이 단순한 디자인 요소가 아니라 서비스 경험의 구성 언어'임을 체감한 과정을 담고 있다. Coolors로 팔레트를 생성하고, HSL의 밝기(L값)를 10단위로 조정해 스케일을 만들고, Styler로 Figma 컬러 스타일을 일괄 등록하는 과정—이것은 자동화할 수 없는 의도적 설계 결정의 연속이다. 버튼의 hover 상태에 어떤 단계의 색을 쓸지, disabled 처리에 어떤 tint를 얹을지는 Figma 플러그인이 제안할 수 있어도, 브랜드 톤과 사용자 정서를 맞춰 최종 선택하는 건 사람이다.
인터랙션 레이어에서도 같은 원칙이 반복된다. 또 다른 velog 글은 IntersectionObserver를 활용해, 테이블 스크롤 컨테이너 밖으로 버튼이 사라질 때 툴팁을 자동으로 닫는 React 구현을 다룬다. 코드 자체는 단순하다. useEffect 안에서 observer를 생성하고, isIntersecting이 false가 되면 setIsOpen(false)를 호출한 뒤, cleanup에서 observer.disconnect()를 처리하면 된다. 하지만 이 기능이 필요하다는 판단—스크롤 영역 밖에 툴팁이 떠 있으면 사용자가 혼란스럽다는 인식—은 코드 자동 완성으로 나오지 않는다. 사용자 행동 패턴을 관찰하고 불편함을 포착한 뒤 해결 방향을 결정하는 것, 그게 UX 디테일이다.
세 사례를 겹쳐보면 하나의 패턴이 드러난다. AI는 구현 속도를 압도적으로 높여주지만, 무엇을 만들지·어디까지 추상화할지·어떤 경험을 줄지는 여전히 사람의 판단 영역이다. Cursor가 코드를 생성하는 동안 우리가 해야 할 일은 컵 커피를 홀짝이는 게 아니라, 아키텍처 경계를 긋고 복잡도 예산을 관리하는 것이다. 디자인 시스템의 컬러 토큰 하나를 정의할 때도, 스크롤 이탈 시 툴팁을 닫아야 한다는 요구사항을 발굴할 때도, 사람만이 줄 수 있는 맥락과 의도가 품질을 결정한다.
앞으로 AI 코딩 도구는 더 빠르고 더 그럴듯해질 것이다. 그럴수록 역설적으로 '왜 이렇게 만드는가'를 설명할 수 있는 능력이 희소해지고 값어치가 올라간다. 8,500줄 revert 커밋을 git history에 남겨두겠다는 작성자의 결심처럼, 그 실패의 기억이 곧 설계 감각의 밑천이 된다. AI가 초안을 쓰는 시대일수록, 컴포넌트 구조와 인터랙션 디테일에 대한 사람의 설계 책임은 줄어드는 게 아니라 더 선명해진다.