Claude Code로 만드는 인터랙티브 아트 사례, 〈Banpo-Xism · 반포자이즘〉의 12만 줄 멀티 디바이스 시스템
전시 〈Living Geometry 2026〉에 출품된 최정윤(Jeanyoon Choi)의 인터랙티브 웹 작품 〈Banpo-Xism · 반포자이즘〉은 약 12만 줄 규모의 멀티 디바이스 웹 시스템이다. 본인 핸드폰으로 들어오는 N명의 관람객, 한 대의 미디어월(Mac Mini M4), 세 대의 PC, 한 대의 어드민이 Socket.IO로 동시에 합주한다. 이 글은 그 시스템이 어떻게 Claude Code를 코딩 에이전트로 활용해 작가 한 사람의 작업으로 완성되었는지를 정리한다. 작품은 banpo-xism.vercel.app에서 직접 체험할 수 있고, 전시 현장은 영등포아트스퀘어(타임스퀘어 B2)에서 2026년 5월 1일부터 6월 28일까지 무료로 관람할 수 있다.
12만 줄 코드를 한 사람이 들고 가는 작업 방식
작가는 작품 레포의 루트에 CLAUDE.md라는 파일을 두고, Claude Code 세션을 시작할 때마다 docs/wiki/llm_wiki.md (2,239줄)를 먼저 읽도록 강제했다. wiki는 매 코드 변경마다 본문과 9번 섹션 changelog가 같은 커밋으로 갱신된다. 변경 항목에는 날짜와 git short hash가 함께 들어간다. 결과적으로 ‘프로젝트의 진짜 사양’은 코드도 README도 아닌 wiki에 누적된다. 새 세션의 첫 5분이 항상 ‘오늘 작업 전, 지금까지의 시스템을 다시 한 번 통째로 읽어 둠’이라는 의미가 된다.
그 위에 docs/overplan/<영역>/<MMDD>_<주제>.md 라는 일일 plan doc이 쌓인다. 0412_mw_worker_plan.md, 0418_fiber_redesign.md, 0420_session_mgmt.md, 0501_dimension_enter_camera_bump.md 같은 식이다. 작은 변경도 plan 먼저, 코드 다음, wiki 갱신 마지막이라는 세 박자가 강제된다. 일종의 wiki-driven development인데, 실용적으로는 ‘에이전트와 작가가 같은 사양서를 들고 다음 변경에 들어간다’는 일치성 보장 장치다.
권한 분담은 명확했다. 미학적 결정, 매체에 대한 명제, 작품 제목과 흐름, 인터랙션의 의미는 작가가 단독으로 갖는다. 컴포넌트 분해, 성능 예산 관리, 소켓 이벤트 시그니처, 무거운 알고리즘의 일차 구현은 에이전트가 들어간다. 작가는 다음 변경의 의도와 가드레일만 설명하고, 에이전트가 만든 결과를 측정 가능한 기준(60fps 유지, 9,025셀 worker 처리, 180ms 그리드 broadcast)으로 받아들이거나 거절한다.
잘 작동한 패턴들
‘읽고 나서 쓴다’를 코드에 박았다. CLAUDE.md에는 ‘NO CODE WITHOUT FULL UNDERSTANDING (ABSOLUTE)’라는 절대 규칙이 들어 있다. 새 기능 작성 전에 인접 형제 기능을 먼저 읽고, 동일 데이터 흐름이 다른 곳에서 어떻게 구현되어 있는지를 wiki와 코드에서 모두 확인한 뒤 본격 구현에 들어간다. 단일 변경이 다른 영역의 invariant를 깨지 않도록 하는 가장 단순한 방법이다.
‘예산을 숫자로 적어 둔다’를 강제했다. ‘부드럽게’ 같은 표현 대신 LAYOUT_BUDGET_MS=4, MIN_LAYOUT_INTERVAL_MS=50, EMIT_INTERVAL_MS=20, PRICE_GRID_STALENESS_MS=5000처럼 각 동작의 정량 기준이 wiki에 적혀 있다. 에이전트는 변경 후 같은 숫자로 회귀가 났는지 직접 확인한다.
scope를 보존하는 규칙을 절대화했다. CLAUDE.md의 ‘PRESERVE UNREQUESTED FUNCTIONALITY (ABSOLUTE)’는 ‘리팩터링 김에’ 다른 동작을 건드리는 것을 금지한다. 9만 줄 규모에서 가장 자주 일어나는 회귀 원인을 차단했다.
잘 안 된 시도들의 공개 기록
AI 엔지니어링이 모든 것을 해결하지는 못했다. wiki의 한 섹션은 ‘5 failed AI agent attempts (all reverted)’라는 제목으로, 미디어월의 성능 최적화에서 다섯 번 실패한 시도와 각 실패의 근본 원인을 모두 적어 둔다. reference equality 오해, 모듈 중복 인스턴스화, budget 메커니즘 자체의 파괴, voice 신호의 이중 적용, 성능과 변경 감지 사이의 근본적 모순. 결국 Web Worker로 9,025개의 동(洞)별 오버레이 계산을 분리한 구조가 정착했다.
이 공개 기록은 두 가지 의미가 있다. 첫째, AI 코딩 에이전트는 ‘되돌릴 수 있는 변경’을 빠르게 시도하는 데 강하지만, ‘시스템 전체의 invariant’를 처음부터 잡는 데는 약하다. 둘째, 실패를 같은 wiki에 그대로 기록해 두면 다음 세션의 에이전트가 같은 함정을 다시 파지 않는다. 일종의 ‘조직 학습’을 단일 작가의 단일 레포 안에서 구현한 셈이다.
2026년의 AI 엔지니어링이 인터랙티브 아트에 갖는 의미
통상 멀티 디바이스 인터랙티브 시스템 한 점은 코딩 인력 두세 명이 12개월에서 24개월에 걸쳐 만든다. 〈Banpo-Xism〉은 작가 단독으로 약 6개월에 완성된 12만 줄 규모의 시스템이다. 매체에 대한 명제(MDWA, Multi-Device Web Artwork)와 비평적 의도는 작가가 통째로 들고 가고, 구현의 부담만 에이전트와 분담한 결과다.
이 사례가 시사하는 점은 단순하다. 미디어아트의 ‘작가 한 사람의 작업’이 가능한 규모와 깊이가 실질적으로 늘어났다. 작가는 더 큰 매체 단위에서 사고할 수 있고, 시스템은 다양한 장치, 사용자, 동시성을 한 번에 다룰 수 있다. AI 엔지니어링은 매체의 명제를 대신해 주지 않는다. 그러나 그 명제를 실제 작동하는 시스템으로 옮기는 비용을, 한 사람이 감당할 수 있는 수준으로 끌어내린다.
본 전시에서 직접 확인할 수 있는 것
전시장에서는 본인 핸드폰을 꺼내 QR을 찍는 것으로 시작한다. 인스타그램 식 수직 스크롤로 19×19 격자, 361개의 AI 생성 아파트를 통과하다가, 광고를 누르면 음성, 가속도, 카메라, 자이로, 멀티 터치 같은 새로운 모달리티가 활성화되며 미디어월의 매니폴드가 변형된다. 다른 관람객의 핸드폰도 같은 매니폴드를 함께 변형시킨다. ‘여러 디바이스가 하나의 미분방정식처럼 결합되는 매체’라는 작가의 표현이 그대로 작동한다.
Claude Code in Interactive Art Practice, A Case Study of Banpo-Xism's 120K-Line Multi-Device System
Banpo-Xism, the multi-device web artwork by Jeanyoon Choi on view in Living Geometry 2026, is a roughly 120,000-line system. N visitor smartphones, one Mac Mini M4 media wall, three Intel PCs, and an admin console are coordinated in real time over Socket.IO. This article documents how the entire system was produced by a single artist, with Claude Code as the primary coding agent. The work runs at banpo-xism.vercel.app and on site at YDP Artsquare (Times Square B2F, Yeongdeungpo) from May 1 to June 28, 2026, free admission.
How a single artist holds 120,000 lines of code
A file called CLAUDE.md sits at the repository root and instructs every Claude Code session to begin by reading docs/wiki/llm_wiki.md, a 2,239-line architectural reference. The wiki is updated in the same commit as any non-trivial change, including a Section 9 changelog entry that carries a date and a git short hash. The result is that the real specification of the project lives in the wiki, not in the README and not in the code. The first five minutes of every session are always: re-read the system as it stands today.
On top of that wiki, dated planning notes accumulate in docs/overplan/<area>/<MMDD>_<topic>.md. Files such as 0412_mw_worker_plan.md, 0418_fiber_redesign.md, 0420_session_mgmt.md follow a strict three-step rhythm. Plan first, then code, then update the wiki. The setup is essentially wiki-driven development, and its practical effect is to keep the artist and the agent reading from the same specification before every change.
Authority is divided cleanly. Aesthetic decisions, the proposition about medium, the title and arc of the work, and the meaning of each interaction are the artist's alone. Component decomposition, performance budgets, socket event signatures, and first-pass implementations of heavy algorithms are the agent's. The artist describes the intent and the guardrails of the next change; the agent's output is then accepted or rejected against measurable criteria, such as a 60fps target, a 9,025-cell worker pass, or a 180ms grid broadcast.
Patterns that worked
Read before you write. CLAUDE.md carries an absolute rule: NO CODE WITHOUT FULL UNDERSTANDING. Before any new feature, sibling implementations of the same data flow are read in both the wiki and the code. This is the single cheapest way to keep one change from breaking the invariants of another area.
Write the budget down as a number. Words like “smooth” are replaced with LAYOUT_BUDGET_MS=4, MIN_LAYOUT_INTERVAL_MS=50, EMIT_INTERVAL_MS=20, PRICE_GRID_STALENESS_MS=5000. After every change, the same numbers are re-checked for regressions.
Preserve scope. PRESERVE UNREQUESTED FUNCTIONALITY is the second absolute rule. It bans the “while I'm in here” refactor that is the most common source of regression at this scale.
A public log of attempts that failed
AI engineering did not solve everything. One wiki section is titled “5 failed AI agent attempts (all reverted)” and lists each failed attempt to optimize the media wall pipeline together with its root cause: a misread on reference equality, a duplicated module instance, a budget mechanism that was itself broken, a voice signal applied twice, and a fundamental tension between performance and change detection. The eventual answer was to move the per-dong overlay computation for 9,025 buildings into a Web Worker.
Two takeaways. First, an AI coding agent is strong at trying small reversible changes quickly and weak at locking in the system-wide invariants from the start. Second, keeping failed attempts in the same wiki the next session reads stops the agent from digging the same hole twice. A single artist with a single repository ends up with something close to organizational learning.
What this case suggests for interactive art in 2026
A multi-device interactive system at this scale is conventionally a twelve to twenty-four month effort for a team of two or three engineers. Banpo-Xism is a 120,000-line system completed by a single artist in roughly six months. The proposition about medium (Multi-Device Web Artwork) and the critical intent stayed entirely with the artist; only the cost of implementation was shared with an agent.
The implication is straightforward. The scope and depth of work that one artist can credibly hold has expanded. AI engineering does not replace the proposition about medium. It lowers the cost of moving that proposition into a system that actually runs, to a level that one person can carry.
Where to see it
On site, you scan a QR with your own phone and enter an Instagram-like vertical scroll through a 19 by 19 grid of 361 AI-generated apartments. Tapping an advertisement activates a new modality (voice, accelerometer, camera, gyroscope, multi-touch) and deforms the manifold on the media wall. Other visitors' phones deform the same manifold at the same time. The artist's phrase, several devices coupled like a single differential equation, becomes literal.
Claude Code in Interactive Art Practice, A Case Study of Banpo-Xism's 120K-Line Multi-Device System
Banpo-Xism, the multi-device web artwork by Jeanyoon Choi on view in Living Geometry 2026, is a roughly 120,000-line system. N visitor smartphones, one Mac Mini M4 media wall, three Intel PCs, and an admin console are coordinated in real time over Socket.IO. This article documents how the entire system was produced by a single artist, with Claude Code as the primary coding agent. The work runs at banpo-xism.vercel.app and on site at YDP Artsquare (Times Square B2F, Yeongdeungpo) from May 1 to June 28, 2026, free admission.
How a single artist holds 120,000 lines of code
A file called CLAUDE.md sits at the repository root and instructs every Claude Code session to begin by reading docs/wiki/llm_wiki.md, a 2,239-line architectural reference. The wiki is updated in the same commit as any non-trivial change, including a Section 9 changelog entry that carries a date and a git short hash. The result is that the real specification of the project lives in the wiki, not in the README and not in the code. The first five minutes of every session are always: re-read the system as it stands today.
On top of that wiki, dated planning notes accumulate in docs/overplan/<area>/<MMDD>_<topic>.md. Files such as 0412_mw_worker_plan.md, 0418_fiber_redesign.md, 0420_session_mgmt.md follow a strict three-step rhythm. Plan first, then code, then update the wiki. The setup is essentially wiki-driven development, and its practical effect is to keep the artist and the agent reading from the same specification before every change.
Authority is divided cleanly. Aesthetic decisions, the proposition about medium, the title and arc of the work, and the meaning of each interaction are the artist's alone. Component decomposition, performance budgets, socket event signatures, and first-pass implementations of heavy algorithms are the agent's. The artist describes the intent and the guardrails of the next change; the agent's output is then accepted or rejected against measurable criteria, such as a 60fps target, a 9,025-cell worker pass, or a 180ms grid broadcast.
Patterns that worked
Read before you write. CLAUDE.md carries an absolute rule: NO CODE WITHOUT FULL UNDERSTANDING. Before any new feature, sibling implementations of the same data flow are read in both the wiki and the code. This is the single cheapest way to keep one change from breaking the invariants of another area.
Write the budget down as a number. Words like “smooth” are replaced with LAYOUT_BUDGET_MS=4, MIN_LAYOUT_INTERVAL_MS=50, EMIT_INTERVAL_MS=20, PRICE_GRID_STALENESS_MS=5000. After every change, the same numbers are re-checked for regressions.
Preserve scope. PRESERVE UNREQUESTED FUNCTIONALITY is the second absolute rule. It bans the “while I'm in here” refactor that is the most common source of regression at this scale.
A public log of attempts that failed
AI engineering did not solve everything. One wiki section is titled “5 failed AI agent attempts (all reverted)” and lists each failed attempt to optimize the media wall pipeline together with its root cause: a misread on reference equality, a duplicated module instance, a budget mechanism that was itself broken, a voice signal applied twice, and a fundamental tension between performance and change detection. The eventual answer was to move the per-dong overlay computation for 9,025 buildings into a Web Worker.
Two takeaways. First, an AI coding agent is strong at trying small reversible changes quickly and weak at locking in the system-wide invariants from the start. Second, keeping failed attempts in the same wiki the next session reads stops the agent from digging the same hole twice. A single artist with a single repository ends up with something close to organizational learning.
What this case suggests for interactive art in 2026
A multi-device interactive system at this scale is conventionally a twelve to twenty-four month effort for a team of two or three engineers. Banpo-Xism is a 120,000-line system completed by a single artist in roughly six months. The proposition about medium (Multi-Device Web Artwork) and the critical intent stayed entirely with the artist; only the cost of implementation was shared with an agent.
The implication is straightforward. The scope and depth of work that one artist can credibly hold has expanded. AI engineering does not replace the proposition about medium. It lowers the cost of moving that proposition into a system that actually runs, to a level that one person can carry.
Where to see it
On site, you scan a QR with your own phone and enter an Instagram-like vertical scroll through a 19 by 19 grid of 361 AI-generated apartments. Tapping an advertisement activates a new modality (voice, accelerometer, camera, gyroscope, multi-touch) and deforms the manifold on the media wall. Other visitors' phones deform the same manifold at the same time. The artist's phrase, several devices coupled like a single differential equation, becomes literal.
Transit :: 3-min walk from Yeongdeungpo Station (Line 1 / KTX)
Bring :: Phone + earbuds for Banpo-Xism on site
Remote preview :: banpo-xism.vercel.app for a single-device demo of selected interactions
About the exhibition
Living Geometry 2026 is a media-art special exhibition curated and developed by the KAIST Experience Design Lab (XD Lab) within KAIST's Department of Industrial Design. It re-threads Yeongdeungpo's visible urban landscape, its invisible data, and the emotional strata behind them in a geometric language — recasting the city, beyond a stilled aggregate of concrete, as an organism in continual pulse. Seven works span single-channel video, interactive installation, and multi-device web art.
Title :: Living Geometry 2026 · 생동 기하학 (Living Geometry)
Dates :: May 1 – Jun 28, 2026
Hours :: Daily 10:00–18:00 (last entry 17:45)
Venue :: YDP Artsquare · Times Square B2F, 15 Yeongjung-ro, Yeongdeungpo-gu, Seoul
