AI Sparkup

최신 AI 쉽게 깊게 따라잡기⚡

AI 에이전트에게 디자인 취향 가르치기: ‘연어색 원’ 함정 탈출기

AI 에이전트가 만든 디자인 결과물을 보면 왠지 모두 비슷해 보인 적 있으신가요? 연어색과 틸(teal) 색상 조합, 중앙에 딱 자리 잡은 원, 완벽한 대칭… 이런 패턴들이 반복된다면 단순히 “AI라서” 그런 게 아니라 구체적인 이유가 있습니다.

사진 출처: Block goose 블로그

Block(구 Square)에서 개발한 AI 에이전트 도구 goose를 만든 개발자가 이 문제를 직접 실험하고 해결한 과정을 공유했습니다. 매일 크리에이티브 코딩 작품을 하나씩 만드는 Genuary 챌린지를 AI 에이전트에게 맡기면서, “취향을 자동화할 수 있는가”라는 질문에 실용적으로 답을 찾았죠. 결론부터 말하면 취향 자체는 자동화할 수 없지만, 자신의 선호를 AI가 이해할 수 있게 명시적으로 만들 수는 있습니다.

출처: How I Taught My Agent My Design Taste – Block goose 블로그

연어색 원의 정체

실험 초반, AI가 생성한 작품들은 모두 비슷해 보였습니다. 특히 연어색(salmon) 원이 반복적으로 등장했죠. 원인을 파고들자 간단했습니다. goose가 참고한 p5.js 템플릿에 fill(255, 100, 100)(연어색!)과 타원(ellipse) 예시 코드가 포함되어 있었던 겁니다.

사진 출처: Block goose 블로그

LLM은 구체적인 예시에 강하게 앵커링하는 특성이 있습니다. “창의적으로 만들어”라는 추상적 지시보다 눈앞의 코드 예시를 따라가는 게 더 자연스럽죠. 개발자는 템플릿에서 연어색 원을 제거한 뒤, 한발 더 나아가 “AI가 생성한 것처럼 보이는” 뻔한 패턴 전체를 금지하기로 했습니다.

금지 패턴과 권장 패턴

goose와 함께 토론과 검색을 거쳐 다음과 같은 리스트를 만들었습니다:

금지 패턴 (BANNED CLICHÉS)

카테고리금지 항목
색상연어색/코랄 핑크, 틸과 오렌지 조합, 보라-핑크-파랑 그라디언트
구성중앙의 단일 도형, 변화 없는 완벽한 대칭, 평범한 나선
황금률AI가 만든 것처럼 보이면 하지 말 것

권장 패턴 (ENCOURAGED PATTERNS)

카테고리권장 항목
색상HSB 모드로 색조 변화, 보색 팔레트, 시간에 따라 진화하는 그라디언트
구성자발적 행동을 보이는 파티클 시스템, 투명도로 표현한 레이어 깊이, 수백 개 요소의 상호작용
움직임노이즈 기반 플로우 필드, 군집 행동, 유기적 성장 패턴, 변화가 있는 호흡
영감 출처자연 현상(찌르레기 떼, 반딧불이, 오로라, 연기, 물)
황금률기쁨을 주고 다른 사람이 공유하고 싶어하면 올바른 방향

이 리스트는 goose가 패턴 인식을 통해 도출한 결과입니다. 에이전트가 아름다움을 이해해서가 아니라, 개발자가 명시적으로 “내가 좋아하는 것/싫어하는 것”을 가르쳤기 때문에 작동했죠.

실제로 이 원칙을 적용한 뒤 나온 결과물 중 하나는 피보나치 수열로 배치된 나비들이었습니다. 베지어 곡선으로 그린 날개, 나선 위치에 따라 달라지는 색상, 따뜻한 호박색에서 파랑으로 이어지는 그라디언트… “자연 현상”과 “유기적 성장”이라는 지침이 구체적인 코드로 반영된 결과였습니다.

사진 출처: Block goose 블로그

두 가지 워크플로우 비교

개발자는 같은 작업을 두 가지 방식으로 처리하는 시스템을 만들어 비교했습니다:

1. Harness(하네스) + Recipe 방식
셸 스크립트로 폴더 생성, 프롬프트 제공 등 기반 작업을 자동화합니다. 약 300줄의 레시피가 모든 것을 명확하게 지시하죠. 결과는 안정적이고 효율적이었지만 예측 가능했습니다.

2. Skills + Recipe 방식
“어떻게 할지”를 스킬 문서에 위임합니다. 디자인 철학, 참고 자료, 예시를 담은 문서를 에이전트가 스스로 찾아 활용하게 만들었습니다. 더 지저분하고 편집이 많이 필요했지만, 예상 밖의 결과가 나왔고 협업하는 느낌이 강했습니다.

두 접근법의 차이는 명확했습니다. 하네스는 “파이프라인”처럼 일관성을 최적화했고, 스킬은 “탐색”을 유도했습니다. 어느 쪽이 더 나은가는 상황에 달렸지만, 이 비교 자체가 에이전트 워크플로우 설계에 중요한 인사이트를 줍니다.

시각적 피드백 루프 구축

흥미로운 기술적 디테일도 있습니다. 두 워크플로우 모두 Chrome DevTools MCP 서버를 사용해 goose가 실시간으로 결과물을 보고 반복 작업을 할 수 있게 했습니다. 문제는 여러 인스턴스가 같은 Chrome 프로필을 사용하면 충돌이 발생한다는 것. 개발자는 에이전트에게 병렬 실행 가능 여부를 물었고, 해결책은 간단했습니다—각각 별도의 사용자 데이터 디렉토리를 할당하는 것이었죠.

# genuary recipe 예시
- type: stdio
  name: Chrome Dev Tools
  cmd: npx
  args:
    - -y
    - chrome-devtools-mcp@latest
    - --userDataDir
    - /tmp/genuary-harness-chrome-profile

취향은 자동화되지 않지만, 명시할 수는 있다

이 실험이 보여준 것은 “AI 대 인간”이라는 이분법이 지나치게 단순하다는 점입니다. 자동화는 반복과 속도를 잘 처리합니다. 하지만 취향은 여전히 제약 설정, 큐레이션, “절대 해서는 안 되는 것” 결정에 있습니다.

개발자는 취향을 자동화하지 않았습니다. 대신 자신의 선호를 AI가 이해할 수 있을 만큼 명시적으로 만들었고, 그 결과 AI는 그 선호를 반영한 결과물을 내놓을 수 있었습니다. “연어색 원은 안 돼”부터 “자연의 유기적 패턴을 참고해”까지, 구체적인 가이드라인이 협업의 언어가 된 셈이죠.

전체 코드와 대화 기록은 Genuary 2026 GitHub 저장소에서 확인할 수 있고, 결과물은 Genuary 2026 사이트에서 볼 수 있습니다. 매일의 폴더에는 제안, 반복, 에이전트와의 대화 전체가 포함되어 있어 실제 워크플로우를 엿볼 수 있습니다.


AI Sparkup 구독하기

최신 게시물 요약과 더 심층적인 정보를 이메일로 받아 보세요! (무료)

Comments

답글 남기기

이메일 주소는 공개되지 않습니다. 필수 필드는 *로 표시됩니다