개인전 《관측 가능한 우주》 — AN OBSERVABLE UNIVERSE

7년 동안 화면을 만들었습니다. 이제, 화면을 움직이는 지능을 만듭니다.

김아람 — 프론트엔드 엔지니어로 출발해, AI가 실제로 일하는 시스템을 설계합니다.
AI는 목적이 아니라 도구라고 믿습니다.

SEOUL 2018 — 2026 FRONTEND ENGINEER → AI PRODUCT ENGINEER

01서문 · FOREWORD

서문

이 전시는 어느 프론트엔드 엔지니어의 궤도 수정에 관한 기록입니다. 화면의 표면을 만드는 일에서 시작해, 그 표면을 움직이는 지능과 그 지능이 기대는 기억을 설계하는 일로. 아래의 문장들은 그 과정에서 작업 노트에 남긴 것들입니다.

“완료는 선언이 아니라,
증거로 성립한다.”

— 판단에 관하여

“기억은 정보를 모으는 장치가 아니라,
반복될 판단의 기반을 남기는 장치다.”

— 기억에 관하여

“협업의 본질은 참여 비율이 아니라,
책임 경계의 설계다.”

— 인간과 AI에 관하여

그래서 — 반복은 기계에게, 판단은 사람에게.
이 원칙으로 만든 다섯 개의 작업을 전시합니다.

02전시실 · EXHIBITS

전시실

No.01

스스로를 설명하는 화면Agrune

도판 No.01

이미지 생성 예정 — 프롬프트는 소스에

문제

AI 에이전트는 처음 보는 화면 앞에서 헤맵니다. 스크린샷은 토큰을 쏟아붓고, DOM 스캔은 페이지가 바뀔 때마다 어긋납니다. 사내 ML 플랫폼을 아무리 교육해도 “사용법을 모르겠다”는 말이 돌아오던 시기였습니다.

판단

화면을 더 잘 읽게 만드는 대신, 화면이 스스로를 설명하게 만들었습니다. 개발자가 조작 가능한 지점을 어노테이션으로 선언하면 AI는 그 계약만 읽습니다. 적용 범위를 ‘자기 앱’으로 좁히는 대신, 정밀도와 토큰 효율을 얻는 트레이드오프입니다.

증거

54회 비교 실험 · 헤맴 지표 0.06 vs 0.39 · 실패 조건(반복 작업)까지 기록해 재설계에 반영 · npm 배포, 테스트 135개

재료
TypeScript · Chrome Extension(MV3) · MCP · Playwright
형식
브라우저 확장 + MCP 서버 + npm 패키지
연도
2025 — 2026

No.02

이어지는 기억Memory Infrastructure

도판 No.02

이미지 생성 예정 — 프롬프트는 소스에

문제

AI는 유능하지만, 매일 처음 만난 사람처럼 굴었습니다. 도구를 바꿀 때마다 맥락은 끊기고, 같은 설명을 반복해야 했습니다.

판단

기억을 도구 밖으로 꺼냈습니다. 에이전트 기억 서버(Honcho)를 셀프호스팅하고, 모든 AI 도구가 하나의 기억을 읽고 쓰도록 수집 파이프라인과 정책(MemoryPolicy)을 설계했습니다. 어떤 도구를 쓰든, 나는 같은 사람으로 기억됩니다.

증거

  • 한 달의 공백 후, 기억에서 프로젝트 18개를 복원
  • 연결된 도구 — Claude · Codex · Gemini · Hermes, 하나의 기억으로
  • 그리고 지금 읽고 있는 이 전시의 원고 역시, 이 기억 시스템이 회상해낸 것입니다
재료
Docker · PostgreSQL(pgvector) · Redis · 자체 MCP 브리지
형식
셀프호스팅 인프라 + 자동 수집 파이프라인
연도
2026 — 상시 운영 중

No.03

5기가바이트의 중력The Upload Problem

도판 No.03

이미지 생성 예정 — 프롬프트는 소스에

문제

5GB 학습 데이터를 올리면 서버가 죽었습니다. 서버 메모리 할당은 5GB, OOM은 반복됐습니다. MLOps 플랫폼에서 업로드는 모든 것의 입구였습니다.

판단

1차 스트리밍 전환은 네트워크 백프레셔 누적으로 실패했습니다. 실패를 기록하고, 보안 정책(Presigned URL 불가)을 전제로 청크 분할–서버 병합 구조로 재설계했습니다. 화려한 동시성보다 단일 업로드의 확실한 안정을 택했습니다.

증거

10GB+ 파일 안정 업로드 · OOM 재발 구간 제거 · 라온피플, 이미지 기반 MLOps 플랫폼

재료
Next.js · NAS · 온프레미스
형식
실무 — 라온피플, MLOps 플랫폼
연도
2024 — 2025

No.04

흐르는 문장Streaming Interfaces

도판 No.04

이미지 생성 예정 — 프롬프트는 소스에

문제

LLM의 대답은 본질적으로 느립니다. 챗봇 서비스에서 ‘기다림을 어떻게 설계할 것인가’가 화면의 일이 되었습니다.

판단

SSE 스트리밍으로 문장이 도착하는 즉시 흐르게 하고, Markdown을 실시간으로 렌더링했습니다. 100개가 넘는 페르소나를 오가는 사용 패턴을 관찰해 캐싱 계층을 다시 설계했습니다.

증거

EC2 → S3 + CloudFront 전환 · 튜닙, LLM 챗봇 ‘디어메이트’ · 감소 폭이 클수록 좋은 지표입니다

재료
React · TanStack Query · SSE · AWS
형식
실무 — 튜닙, 멀티페르소나 AI 챗봇
연도
2022 — 2024

No.05 진행 중

보이는 오케스트라numen × neuromem

도판 No.05

이미지 생성 예정 — 프롬프트는 소스에

문제

에이전트는 늘어나는데, 누가 무엇을 왜 하는지는 보이지 않습니다. 통제는 금지에서 시작되지 않습니다. 가시성에서 시작됩니다.

판단

실행을 캔버스 위에 올렸습니다(numen) — 하네스와 모델을 노드로 잇고, 줌 레벨에 따라 라이브 터미널이 살아나는 관측 가능한 오케스트레이션. 그 아래에는 회상을 닮은 기억 엔진(neuromem) — 활성화 확산과 헤비안 가소성을 Rust로 구현했습니다. AI에게 경로를 주지 않습니다. 목적지와 울타리, 통과 기준을 줍니다.

증거

  • numen — 캔버스 · 라이브 터미널(xterm/WebGL) · LOD 렌더링, 1단계 빌드 완료
  • neuromem — Rust 엔진, 엔진·제품 계약 테스트 11개 통과
  • 이 두 개의 궤도는 아직 그려지는 중입니다
재료
Electron · React Flow · node-pty · Rust · LanceDB
형식
데스크톱 오케스트레이터 + 기억 엔진
연도
2026 — 계속

부록 — 작은 도구들Minor Works

  • Wispwhisper.cpp 기반 macOS 로컬 받아쓰기 앱 — 테스트 121개, MIT 공개
  • pidginAI와 사람이 같은 다이어그램을 편집하는 시맨틱 캔버스 — git diff가 곧 의미 diff
  • agent-barClaude · Codex 사용량 메뉴바 앱 — 매일 쓰는 중
  • portwardenAI가 남기고 간 포트를 정리하는 TUI
  • proto해석이 갈라지는 프로토타입 3개를 병렬로 빚는 방법론 스킬

03연보 · CHRONOLOGY

연보

  1. 2016

    관측 — 알파고

    화면 너머의 지능을 처음 목격했다. 개발자의 꿈이 다시 켜졌다.

  2. 2018

    입계 — 웹 퍼블리셔

    픽셀과 마크업. 화면의 표면에서 시작했다.

  3. 2019

    언디파인드

    e-sports 대회 운영 플랫폼. 퍼블리셔에서 프론트엔드 개발자로.

  4. 2020

    엠싱크 · 이노트리

    계열사 10개 사이트 병렬 구축, 한섬닷컴. 반복을 구조로 바꾸는 법을 배웠다.

  5. 2022

    튜닙

    LLM 챗봇의 화면을 만들다 — AI 산업과의 첫 접점.

  6. 2024

    크래프톤 정글

    C · OS · 알고리즘. 표면 아래를 다시 배우기 위한 5개월의 몰입.

  7. 2024

    라온피플

    MLOps · AIOps 플랫폼. 기획–디자인–구현을 혼자서 잇다.

  8. 2025

    Agrune

    화면을 만드는 사람에서, 화면을 다루는 지능을 만드는 사람으로.

  9. 2026

    AX 인재전쟁 해커톤 — 본선

    Codex 플러그인 3종 단독 제작 · 예선 5,300여 명 중 60인.

  10. 지금

    다음 궤도를 관측하는 중

    한국방송통신대학교 첨단공학부 재학. 도구는 늘 손에 있다.

04콜로폰 · COLOPHON

콜로폰

이 사이트도 전시물입니다.

  • 의존성 0 — 프레임워크도 라이브러리도 없이, 손으로 쓴 HTML · CSS · JavaScript
  • 배경의 성운 — raw WebGL2 · GLSL 프래그먼트 셰이더 (fbm 노이즈, 시차 별 3층, 밴딩 방지 디더링)
  • 연출 — IntersectionObserver 리빌 + CSS scroll-driven animations(지원 브라우저), 스크롤에 실을 이야기 하나만
  • 조판 — Noto Serif KR × Pretendard. 사유는 명조로, 증거는 고딕으로
  • 접근성 — prefers-reduced-motion 존중. 모션 없이도 같은 이야기가 읽히도록
  • 어두운 단일 테마 — 누락이 아니라 선택. 이 전시는 어두운 방에서 진행됩니다
  • 서버 — 서울의 책상 위 Mac에서 Docker와 Cloudflare Tunnel로 직접 서빙
  • 도판 — 생성 예정. 프롬프트는 이 페이지의 소스 안에 있습니다

View Source를 환영합니다.

05교신 · CONTACT

새 궤도에 관한 제안을
기다리고 있습니다.