바이브 코딩의 진짜 병목은 코드가 아니다.
AI가 만드는 UI는 왜 다 비슷한가.
바이브 코딩으로 만든 웹사이트를 열어보면, 익숙한 풍경이 펼쳐진다. 보라색 그라디언트 헤더. Inter 또는 Roboto 폰트. 3열 카드 그리드. 미세한 그림자와 둥근 모서리. 소극적이고 균일하게 분배된 색상 팔레트. 이 모든 게 어디선가 본 것 같다면, 실제로 어디서든 볼 수 있기 때문이다. AI가 만드는 UI는 전부 같은 얼굴을 하고 있다.
이 현상에는 이름이 있다. "AI Slop Design" — 이미지 생성 AI가 만드는 키치한 산출물을 "AI 슬롭"이라 부르듯, UI 세계에도 동일한 현상이 번지고 있다. LLM에게 "landing page를 만들어줘"라고 프롬프트를 던지면, 2019년부터 2024년까지 GitHub에 올라온 모든 Tailwind CSS 튜토리얼의 통계적 중앙값을 돌려받는 것이다.
원인은 놀라울 정도로 구체적이다. 2025년 8월, Tailwind CSS의 창시자 Adam Wathan이 공개적으로 사과했다.
5년 전 Tailwind UI의 모든 버튼에 bg-indigo-500을 적용한 것에 대해 사과한다.
그것이 시작이었다. Tailwind UI의 데모 코드가 보라색을 기본으로 사용했고, 수만 개의 튜토리얼과 블로그 포스트가 그 색상을 그대로 복사했다. 그 코드들이 GitHub에 쌓였고, LLM의 학습 데이터가 되었다. 결과적으로 AI에게 UI를 요청하면 보라색이 기본값으로 출력되는 구조가 만들어진 것이다.
Tailwind bg-indigo-500에서 시작된 편향. AI가 학습한 수만 개 데모의 기본 색상이다.
개성 없는 산세리프. 어떤 브랜드에도 쓸 수 있다는 건 어떤 브랜드도 아니라는 뜻이다.
아이콘 + 제목 + 설명의 반복. "기능 소개" 섹션의 사실상 유일한 패턴이 되었다.
대비가 없다. 모든 요소가 비슷한 시각적 무게를 갖는다. 위계가 사라진 디자인.
shadow-sm, rounded-lg의 반복. 카드가 떠 있는 것 같지만 실제로는 아무것도 구분하지 않는다.
에러 상태, 로딩 상태, 빈 상태가 없다. "기본 화면"만 존재하는 데모용 디자인.
더 심각한 문제가 있다. 이 패턴은 스스로를 강화한다.
AI가 보라색 사이트를 생성
웹에 배포되어 공개
새 모델의 학습 데이터에 흡수
보라색 편향이 더 강화
AI가 만든 보라색 사이트가 웹에 올라가면, 그 사이트가 다시 새로운 AI 모델의 훈련 데이터에 포함된다. 다음 세대의 AI는 더 강한 보라색 편향을 갖게 된다. 피드백 루프다. 누구도 의도하지 않았지만, 구조적으로 탈출이 어려운 순환이 만들어진 것이다.
보라색은 증상일 뿐이다. 근본적인 문제는 바이브 코딩이라는 작업 방식 자체가 디자인 일관성을 구조적으로 파괴한다는 데 있다. fast.ai의 창립자 Jeremy Howard는 이 현상에 이름을 붙였다. "다크 플로우(Dark Flow)".
개념은 이렇다. 바이브 코딩을 하면 결과물이 빠르게 나온다. 프롬프트 하나에 화면 하나가 뚝딱 만들어진다. 이 속도감이 슬롯머신과 동일한 심리적 메커니즘을 작동시킨다. 슬롯머신의 "Loss Disguised as a Win" — 돈을 잃고 있는데 축하 효과음이 나오면 이기고 있다는 착각을 하게 되듯, 바이브 코딩도 실제로는 비생산적인 작업을 하면서 생산성의 환상을 심어준다.
기술-도전 수준 매칭. 자신의 실력에 맞는 적절한 난이도. 너무 쉽지도 어렵지도 않은 지점에서 몰입이 발생한다.
명확한 성과 피드백. 내가 한 행동의 결과를 즉시 확인할 수 있다. 코드를 쓰고 실행하면 바로 결과가 보인다.
진정한 주체성. 내가 결과물을 만들고 있다는 감각. 도구가 아니라 내가 의사결정의 주체다.
난이도 붕괴. AI가 대부분을 처리하니 도전 자체가 사라진다. 몰입 대신 감시 모드에 진입한다.
피드백 왜곡. 빠른 결과물이 "잘 되고 있다"는 신호를 보내지만, 실제로 디자인은 드리프트하고 있다.
주체성 상실. 코드를 이해하지 못한 채 "되네?"만 확인한다. 의사결정이 AI에게 넘어간 상태.
2025년 7월, METR(Model Evaluation & Threat Research)이 발표한 연구가 이를 정량적으로 확인했다. 16명의 숙련된 오픈소스 개발자가 246개의 실제 작업에서 AI 도구를 사용한 결과, 실제 생산성은 19% 감소했다. 그런데 본인들은 20% 빨라졌다고 인식했다. 인식과 현실 사이에 39%p의 괴리가 존재한다.
더 놀라운 건, 연구 참여자의 69%가 속도 저하를 측정적으로 경험했음에도 실험이 끝난 후 AI 도구를 계속 사용했다는 점이다. 다크 플로우의 핵심이 여기에 있다. 느리다는 걸 알면서도 빠르다고 느끼기 때문에 멈추지 못한다.
디자인에서 이 현상은 더 심각하다. 세션이 길어질수록 AI는 이전 맥락을 잃고, 색상이 미묘하게 바뀌고, 간격이 흔들리고, 폰트가 섞인다. 한 화면씩 보면 괜찮아 보이지만, 전체를 놓고 보면 일관성이 완전히 무너져 있다. 이것이 "디자인 드리프트"다.
모든 AI 생성 사이트에는 무균질적인 품질이 있다.
기술적으로 맞는 말을 다 하지만,
진짜 대화는 해본 적 없는 사람을 만난 느낌이다.
이 평가가 핵심을 찌른다. AI가 만드는 디자인은 "전문적으로" 보이지만, 인간의 감정을 위키피디아 글로 배운 사람이 디자인한 것 같다. 브랜드 개성이 없다. 어떤 사업체에든 쓸 수 있는 범용적 디자인은, 결국 어떤 사업체도 아닌 디자인이다.
결과는 데이터에 나타난다. Cursor로 손코딩 0%로 SaaS를 만든 한 개발자는 초기에 "AI가 전부 만들었다"며 자축했다. 수 주 만에 랜덤 에러, API 키 유출, 구독 우회, DB 오염이 발생했다. 비개발자였기 때문에 원인 파악조차 불가능했고, 결국 서비스를 영구 종료했다. Lovable로 만든 170개 앱은 CVE-2025-48757로 인증 없이 DB 읽기/쓰기가 가능한 상태로 노출되었다. "빠르게 만들었다"는 건 "빠르게 망했다"와 동의어가 된 것이다.
한국의 디자인 에이전시 TOKTOKHAN.DEV의 디자이너가 Cursor로 바이브 코딩을 시도한 후 이렇게 말했다. "핵심 기능은 문제없이 작동했으나, 디자이너의 눈에는 부족한 점과 추가하고 싶은 디테일이 너무나도 많았다." Inter 폰트를 Pretendard로 바꾸는 것부터, 반응형 패딩, 뱃지 간격, 전체적인 밀도감까지. 기능이 작동한다는 것과 제품이라는 것 사이에는 거대한 간극이 있었다.
pxd의 디자이너는 더 구체적이었다. "바이브 코딩의 특성은 한 번의 명령으로 완벽한 결과를 얻는 것이 아니라, 반복 대화를 통한 점진적 정교화." 그런데 대부분의 사람은 AI가 한 번에 만들어준 첫 결과물을 그대로 배포한다. 정교화를 위한 반복 대화가 일어나지 않는다.
Google Chrome 엔지니어링 리드 Addy Osmani의 말이 이 상황을 정확히 요약한다.
시각적으로 그럴듯한 UI를 빠르게 만드는 것과
의미 있는 사용자 경험을 만드는 것은
별개의 문제다.
아래는 "AI가 만든 티"를 진단하는 체크리스트다. 3개 이상 해당되면 프로젝트의 디자인을 재검토해야 한다.
#6366f1이 직접 들어가 있고, 변수로 관리되지 않는다.이 시리즈는 위 문제들에 대한 해법을 다룬다. 디자이너를 고용하거나, 디자인을 공부하라는 이야기가 아니다. AI에게 규칙을 가르치고, 도구를 조합하고, 최소한의 검증을 수행하는 것만으로 "AI가 만든 티"의 80%는 제거할 수 있다.
47억 달러 규모의 시장에서 사용자의 63%가 비개발자다. 이들에게 "코드를 배워라"는 해법이 아니다. "디자인을 배워라"도 마찬가지다. 해법은 AI가 이해할 수 있는 디자인 언어를 정의하는 데 있다. 그 언어의 이름은 디자인 토큰이다. 다음 편에서 다룬다.
디자이너 없이도 프로덕션급 디자인을 달성하는 방법론. 다음 편에서 디자인 토큰, AI 규칙 파일, 그리고 Tailwind @theme을 다룬다.