미학 엔지니어링 · 2 / 12

「AI 티」는 어디서 오나

AI에게 아무렇게나 페이지를 만들라고 하면, 열에 아홉은 보라 그라데이션·프로스티드 글래스·가운데 큰 제목 3종 세트입니다. 이 획일성에는 수학적 이유가 있고, 알면 피하는 법도 보입니다.

AI 티 찾기노이즈 체크리스트카니발 효과평균 함정구체성 다이얼
직접 해보기 · 먼저 「AI 티」를 잡아내기

아래는 전형적인 AI 생성 랜딩 페이지입니다. 자주 나오는 「AI 티」 특징 5개가 숨어 있으니, 페이지에서 하나씩 누르세요. 맞힐 때마다 그 특징이 왜 AI의 기본 동작이 됐는지 알려 줍니다.

페이지에서 「AI 티」 특징 5개를 누르세요 0 / 5
가짜 UI에서 「한눈에 AI가 만든 티」가 나는 곳을 누르세요
neuraflow-ai.example.com
NeuraFlow제품솔루션요금로그인
1 보라 그라데이션 NEW · AI 워크플로 2.0 출시
2 가운데 큰 제목
무한한 잠재력을 열어라
원스톱 스마트 플랫폼으로 더 효율적인 업무
전 세계 10,000+ 팀의 신뢰
3 프로스티드 글래스
99.9%
가용성
10k+
4.9
평점
5 그라데이션 버튼 무료로 시작
14일 무료 체험 · 카드 불필요
4 세 열 아이콘 카드
스마트 요약긴 글을 한 번에 핵심만
데이터 인사이트한 줄로 리포트 생성
매끄러운 협업자주 쓰는 도구 200+ 연동
보라 그라데이션 히어로. 2020년 이후 SaaS 사이트는 보라 그라데이션을 업계 교복처럼 썼고, 학습 데이터에 이런 배경 밀도가 매우 높습니다. 배경을 지정하지 않으면 모델은 샘플이 가장 빽빽한 곳에 떨어집니다.
가운데 큰 제목 + 회색 두 줄. 「큰 제목 + 부카피 + 가운데」는 템플릿 사이트에서 가장 흔한 레이아웃이라 어떤 업종에도 틀리기 어렵습니다. 모델에게는 안 틀리는 레이아웃이 가장 자주 보이니, 그게 기본 답이 됩니다.
프로스티드 글래스 카드. Glassmorphism이 유행하던 몇 년, 튜토리얼과 에셋 사이트가 샘플을 쏟아붓고 「고급감」 딱지를 붙였습니다. 모델이 「세련됨」을 말하고 싶을 때 첫 반응은 유리 한 겹입니다.
세 열 아이콘 카드. 「셀링 포인트 셋 + 아이콘 셋」은 랜딩 페이지 튜토리얼의 표준 단락이고, 거의 모든 템플릿이 한 벌을 넣습니다. 모델이 자주 보니 기능 소개만 써도 자동으로 세 열이 됩니다.
그라데이션 주 버튼. 컴포넌트 라이브러리와 에셋 사이트에서 「중요한 버튼」은 눈길을 끌려고 그라데이션으로 자주 만들고, 모델이 둘을 묶었습니다. CTA만 나오면 그라데이션이 올라갑니다.
다섯을 다 잡았습니다. 하나씩 보면 그럴듯하지만, 문제는 이 조합이 수천수만 페이지에 나온다는 점입니다. 이른바 「AI 티」란, 학습 데이터 고확률 구역이 풍기는 그 느낌입니다: 지시가 없는 곳은 가장 흔한 답으로 채웁니다.
직접 해보기 · 시각 노이즈 체크리스트

「AI 티」에는 더 이른 학명이 있습니다. Cooper는 《About Face 4》 17장에서 이런 것을 시각 노이즈라 부릅니다. 정보를 실어 나르는 대상에서 주의를 빼앗는 여분의 시각 요소죠. 일곱 가지 형태 목록도 적어 두었습니다. 아래 「팀 주간 리포트 관리」는 일곱을 다 품고 있으니, 체크리스트에 맞춰 하나씩 진단하세요.

시각 노이즈 일곱 가지, 항목별로 진단 0 / 7
체크리스트의 증상 이름을 누르면, UI의 해당 병변이 밝아집니다
weekly-report.example.com/admin
과한 장식
팀 주 간 리 포 트
위계 약함
이번 주 요약
완료 23건, 지연 4건, 신규 요청 9건
데이터는 매시간 자동 갱신, 카드를 누르면 상세
대비 과밀
완료율 82% · 지연율 17% · 만족도 4.2
정보 없는 3D
분기 데이터 총괄3D 시각화 엔진 · 전면 업그레이드
색이 너무 많음
내보내기 필터 새로 만들기 공유 보관 설정
요소 과밀
개발디자인마케팅운영고객지원재무총무법무전체내 것지연됨이번 주
구분선 과중
결제 게이트웨이 이전 · 완료
고객 티켓 적체 · 처리 중
신규 입사 교육 · 일정 잡힘
일곱 항목 전부 해당. 이 목록은 《About Face 4》 17장에서 나왔습니다. 책을 쓸 때는 생성형 AI가 없었지만, 병리는 조목조목 들어맞습니다. 아래 원인을 보면 이유가 보입니다. AI 결과물을 검수할 때 이 표로 먼저 검진하세요.
다른 점 찾기 · 카니발 효과

일곱 가지 노이즈 중 「색이 너무 많음」에는 고유 이름이 있습니다. 《About Face 4》의 말: 색이 팔레트처럼 빽빽하면 사용자가 감당하기 어렵고, 이를 카니발 효과라 합니다. 채도까지 최대로 올리면 소음이 배가되어 콘텐츠와 경쟁합니다. 같은 주말 마켓 홍보 페이지, 배색 두 가지—읽히기 더 쉬운 쪽을 누르세요.

다른 점 찾기: 어느 쪽이 나은가 한쪽을 고르세요
정보는 같고 배색만 두 갈래. 답을 고르세요.
방안 A
riverside-market.example.com/a
이번 토·일 · 강변 공원
개장까지 1일 08 : 42 : 15
주말 마켓이 열렸어요
핸드메이드 커피 바이닐 식물 한정
셀러 50곳 입점
티켓 반으로 바이닐 추첨
스캔해 입장, 매일 출석하면 블라인드박스 · SNS 좋아요 20개면 커피
입장권 받기 부스 지도 보기
방안 B
riverside-market.example.com/b
WEEKEND MARKET
강변 주말 마켓
이번 토·일 10:00~18:00 · 강변 공원 · 셀러 50곳
무료 입장권 받기부스 지도 보기
핸드메이드도예·가죽·수제 은장신구 18곳
커피로컬 로스팅·핸드드립 12곳
바이닐중고 레코드 마켓 · 정각 라이브 DJ
무료 입장 · 반려동물 환영 · 비 와도 진행
흔한 것이 좋은 것을 이긴다

AI가 디자인을 생성할 때 고르는 것은 학습 데이터의 고확률 구역, 즉 전 웹 디자인의 「평균」입니다. 언어 환각과 같은 메커니즘입니다. 대화를 이을 때는 매끄러운 것이 맞는 것을 이기고, 디자인을 생성할 때는 흔한 것이 좋은 것을 이깁니다. 보라 그라데이션 3종 세트를 내놓는 것은, 존재하지 않는 책 제목을 진지하게 지어내는 것과 같습니다. 둘 다 「여기 나올 법한」 답을 고르는 것이죠.

평균은 곧 평범: AI가 기본으로 주는 것은 전 웹 디자인의 중앙값입니다.

좋은 소식은, 이 메커니즘에 문이 하나 남아 있다는 점입니다. 확률 분포는 입력에 따라 바뀝니다. 설명이 구체적일수록 모델이 고를 구역은 좁아지고, 어느 정도 좁아지면 평균 밖으로 끌어낼 수 있습니다.

돌려 보세요 · 구체성 다이얼

같은 요청, 구체성 세 단계—결과물이 어떻게 변하는지 보세요.

프롬프트 구체성, 세 단계 전환 바꿔 보세요
AI에게 이렇게 말합니다
「예쁜 페이지 하나 만들어.」
teamflow.example.com
새로운 AI 엔진 탑재
스마트 새 시대를 열다
모든 팀에 힘을 · 창의력을 열어라
99.9% 가용성 · 10k+ 팀
바로 체험더 알아보기
더 단순한 팀 협업
하나의 워크스페이스로 프로젝트와 문서 관리
시작하기데모 예약
프로젝트 관리
문서 협업
일정 동기화
PROJECT TRACKER
엔지니어링 팀을 위한 태스크 시스템
키보드 우선, 밀리초 응답, 코드베이스와 한몸.
시작하기문서 보기
이슈키 두 번으로 생성, 커밋 자동 연결
사이클2주 사이클, 번다운 자동 생성
로드맵분기별 집계, 진행 실시간 동기화
골라 보세요 · 어떤 문장이 AI를 평균 밖으로 끌어낼까
AI를 기본 미감에서 빼내려면, 어떤 문장이 제일 먹힐까요? 객관식
틀려도 설명이 나옵니다. 맞을 때까지 고르세요
A「좀 더 예쁘게」
B「더 디자인스럽고, 더 고급스럽게」
C「Linear의 정보 밀도를 레퍼런스로, 전 사이트 주색 하나, 그라데이션 금지」
D「지금 가장 유행하는 스타일로」
핵심 요점

AI 티에는 출처가 있습니다: 모델은 학습 데이터의 고확률 구역, 즉 전 웹 디자인의 평균을 기본으로 내고, 보라 그라데이션 3종 세트는 그 구역의 간판입니다.

시각 노이즈에는 병리 목록이 있습니다: 과한 장식, 정보량 없는 3D, 과한 구분, 요소 과밀, 색·텍스처 대비 과밀, 색이 너무 많음, 위계 약함—일곱 항목은 《About Face 4》에서. 색이 팔레트처럼 뭉치면 학명도 있습니다. 카니발 효과.

메커니즘은 환각과 같습니다: 대화를 이을 때는 매끄러운 것이 맞는 것을 이기고, 디자인을 생성할 때는 흔한 것이 좋은 것을 이깁니다. 지시가 없는 곳은 가장 흔한 답으로 채웁니다.

해법은 구체성을 높이는 것: 레퍼런스에 검수 가능한 하드 제약(주색 하나, 그라데이션 금지)을 더하세요. 한 단계 올릴 때마다 결과물은 기본 티에서 한 걸음 멀어집니다. 다음에 AI에게 페이지를 만들기 전에, 이 다섯 특징을 금지 목록에 넣으세요.

콘텐츠 출처: 샤오산 아카데미 「미학 엔지니어링」 특집 오리지널. 일부 디자인 원칙은 《About Face 4》 17장에서 정리했습니다.