처리중입니다. 잠시만 기다려주세요.
TTJ 코딩클래스
정규반 단과 자료실 테크 뉴스 코딩 퀴즈
테크 뉴스
Hacker News 2026.06.12 30

왜 AI가 만든 웹사이트는 다 똑같이 생겼을까 — Tailwind와 '슬롭 앱' 이야기

Hacker News 원문 보기
왜 AI가 만든 웹사이트는 다 똑같이 생겼을까 — Tailwind와 '슬롭 앱' 이야기

요즘 트위터나 프로덕트헌트에서 새로 나온 웹 서비스들을 둘러보다 보면 묘한 기시감이 들 때가 있어요. 가운데 정렬된 큼직한 제목, 보라색에서 파란색으로 흐르는 그라데이션, 둥글둥글한 카드 세 개가 나란히 놓인 기능 소개 섹션, 그리고 이모지가 박힌 리스트까지. "어, 이 사이트 어디서 봤는데?" 싶은데 사실 처음 보는 서비스인 거죠. 개발자 브라이언 더글러스가 이 현상을 정면으로 짚는 글을 올렸는데요, 한마디로 "AI가 만든 앱들이 죄다 똑같이 생긴 데에는 이유가 있다"는 이야기예요.

'슬롭 앱'이라는 말, 들어보셨나요

먼저 용어부터 짚고 갈게요. '슬롭(slop)'은 원래 돼지 먹이로 주는 음식 찌꺼기를 뜻하는 단어인데, 요즘은 AI가 대량으로 찍어낸 저품질 콘텐츠를 가리키는 말로 자리잡았어요. 스팸이 이메일 시대의 쓰레기였다면, 슬롭은 생성형 AI 시대의 쓰레기인 셈이죠. 그러니까 '슬롭 앱'은 LLM한테 "이런 서비스 만들어줘" 한 마디 던져서 뚝딱 만들어낸, 어디서 본 듯한 양산형 앱들을 말하는 거예요.

왜 하필 다 Tailwind 스타일일까

핵심 질문은 이거예요. 왜 AI가 만든 사이트들은 하나같이 비슷한 모습으로 수렴할까요? 답은 LLM의 동작 원리에 있어요. LLM은 학습 데이터에서 가장 흔하게 등장하는 패턴을 재생산하는 기계거든요. 그런데 인터넷에 공개된 수많은 템플릿, 튜토리얼, 오픈소스 프로젝트가 Tailwind CSS로 작성돼 있어요.

여기에 Tailwind만의 구조적인 특징이 하나 더 얹어져요. Tailwind는 유틸리티 클래스라는 방식을 쓰는데, 이게 뭐냐면 CSS 파일을 따로 만드는 대신 class="rounded-xl bg-gradient-to-r p-6"처럼 스타일 정보를 HTML에 직접 박아 넣는 방식이에요. 사람 입장에서는 호불호가 갈리지만, LLM 입장에서는 최고의 학습 자료죠. 마크업과 스타일이 한 줄에 다 들어 있으니 "이런 구조에는 이런 스타일"이라는 패턴을 통째로 외우기 쉽거든요. 그래서 모델한테 랜딩 페이지를 시키면 학습 데이터에서 가장 많이 본 조합, 그러니까 그 보라색 그라데이션과 둥근 카드가 또 나오는 거예요.

중요한 건 이게 Tailwind 자체의 잘못은 아니라는 점이에요. Tailwind는 도구일 뿐이고, 진짜 원인은 "가장 그럴듯한 평균"을 뽑아내는 LLM의 성질이 디자인 영역에서 그대로 드러난다는 거죠.

사실 처음 있는 일은 아니에요

비슷한 일이 전에도 있었어요. 2010년대 초반 부트스트랩(Bootstrap)이 유행했을 때도 "인터넷의 모든 사이트가 똑같이 생겼다"는 농담이 돌았거든요. 다만 그때는 사람이 템플릿을 가져다 쓰는 속도였다면, 지금은 v0, Lovable, Bolt 같은 AI 앱 빌더들이 분 단위로 비슷한 사이트를 찍어내는 속도라는 게 달라요. 양이 차원이 다르니 체감도 훨씬 강한 거죠.

재미있는 부작용도 생겼어요. 이제 사람들이 "AI 냄새 나는 디자인"을 알아보기 시작했다는 거예요. 그 특유의 그라데이션과 이모지 리스트를 보면 "아, 이거 대충 만들었구나" 하고 서비스의 신뢰도까지 깎아서 보게 되는 거죠. 디자인이 곧 첫인상인데, 그 첫인상이 "양산형"으로 찍히면 제품이 아무리 좋아도 손해예요.

그럼 어떻게 해야 할까요

AI 도구를 쓰지 말자는 얘기가 아니에요. 프로토타입을 한 시간 만에 뽑아내는 생산성은 진짜니까요. 다만 기본값을 그대로 받아들이지 말자는 거예요. 몇 가지 실용적인 방법이 있는데요. 첫째, 프롬프트에 브랜드 컬러, 폰트, 디자인 레퍼런스를 구체적으로 명시하는 거예요. "모던하고 깔끔하게"라고만 하면 그 보라색 그라데이션이 나오지만, 구체적인 디자인 토큰을 주면 결과가 확 달라져요. 둘째, 자기만의 디자인 시스템이나 컴포넌트 라이브러리를 만들어두고 AI한테 그걸 쓰게 하는 방법이 있어요. 셋째, 적어도 랜딩 페이지처럼 서비스의 얼굴이 되는 부분만큼은 사람 손으로 다듬는 거죠.

역설적이게도 AI가 평균적인 디자인을 무한정 찍어내는 시대가 되면서, 평균에서 벗어난 디자인의 가치는 오히려 올라가고 있어요. 다들 비슷해질수록 다른 게 눈에 띄는 법이니까요.

한줄 정리: AI 코딩 도구는 학습 데이터의 평균을 재생산하기 때문에 결과물이 비슷해질 수밖에 없고, 그래서 차별화된 디자인이 다시 경쟁력이 되고 있다.

여러분은 어떠세요? AI가 만들어준 디자인을 그대로 쓰시나요, 아니면 일부러 손을 대시나요? "AI 냄새"를 지우는 자기만의 노하우가 있다면 공유해주세요.


🔗 출처: Hacker News

이 뉴스가 유용했나요?

이 기술을 직접 배워보세요

바이브코딩으로 직접 만들어보세요

이 기술, 강의에서 실습으로 배울 수 있습니다.

바이브코딩 강의 보기

"비전공 직장인인데 반년 만에 수익 파이프라인을 여러 개 만들었습니다"

실제 수강생 후기
  • 비전공자도 6개월이면 첫 수익
  • 20년 경력 개발자 직강
  • 자동화 프로그램 + 소스코드 제공

매일 AI·개발 뉴스를 받아보세요

주요 테크 뉴스를 매일 아침 이메일로 전해드립니다.

스팸 없이, 언제든 구독 취소 가능합니다.