creative-coding

더블 클릭: 에이 (새 탭에서 열림)

에이전트 AI(Agentic AI)는 단순한 상호작용의 대상이 아닌 자율적으로 과업을 수행하는 도구로서, 사용자의 인지적 부하를 줄이고 웹의 상호운용성을 극대화하는 방향으로 진화하고 있습니다. 앞으로의 웹은 시각적 화려함보다는 기계가 읽기 쉬운 API 중심의 구조로 재편될 것이며, 이 과정에서 인간의 창의성을 보존하기 위한 새로운 설계 방식이 요구됩니다. 결국 미래 UX 디자인의 핵심은 무조건적인 편리함이 아니라, 사용자가 제어권을 유지할 수 있도록 적절한 '의도적 마찰'을 배치하는 기술에 달려 있습니다. **인터페이스에서 실행으로의 가치 전환** - AI는 더 이상 사용자가 말을 걸어야 하는 챗봇이 아니라, 보이지 않는 곳에서 작업을 완료하는 '구동 방식' 그 자체가 되어야 합니다. - 사용자는 자동차 보닛을 열어 엔진을 들여다보는 대신 목적지로 바로 이동하기를 원하듯, 에이전트 AI는 인터페이스의 복잡성을 숨기고 결과에 집중하게 합니다. - 이는 사용자가 메뉴를 클릭하고 정보를 찾는 데 소모하던 인지적 에너지를 창의적인 활동과 연결에 재투자할 수 있게 돕습니다. **웹 상호운용성과 협업하는 에이전트들** - 에이전트 AI는 사람처럼 여러 플랫폼과 웹사이트를 넘나들며 작업할 수 있어, 플랫폼 간의 장벽을 허무는 새로운 웹 상호운용성 시대를 엽니다. - 수많은 탭을 오가며 작업해야 했던 '토글 세금(Toggle Tax)'이 사라지고, 여러 전문 에이전트가 하나의 팀처럼 협력하여 복잡한 문제를 해결하는 구조로 변화합니다. - 이러한 변화는 사용자가 개별 사이트의 사용법을 익힐 필요 없이 하나의 요청으로 여러 서비스를 통합 이용할 수 있게 합니다. **기계 판독 가능성 중심의 웹 설계** - 웹사이트 최적화의 기준이 인간 사용자의 시각적 만족에서 AI 에이전트의 데이터 처리 효율성으로 이동할 것입니다. - 화려한 애니메이션이나 복잡한 레이아웃보다는 클린 API, 구조화된 기계 판독 가능(Machine-readable) 콘텐츠, 단순화된 내비게이션이 더 중요해집니다. - 이에 따라 웹사이트를 AI 에이전트에 최적화하고 유지관리하는 새로운 형태의 산업이 등장할 것으로 예측됩니다. **통제권 유지를 위한 '의도적인 마찰'의 재도입** - 모든 과정이 자동화되고 효율화될 경우, 인간의 창의성과 경험의 깊이가 훼손될 위험이 있습니다. - 전통적인 UX 디자인은 마찰을 없애는 데 집중했지만, AI 시대의 좋은 디자인은 사용자가 중요한 지점에서 검토하고 승인할 수 있도록 '의도적인 마찰'을 설계하는 것입니다. - 이를 통해 사용자는 AI가 작업을 대신 수행하더라도 자신이 여전히 최종 결정권을 쥐고 있다는 통제감을 유지하게 됩니다. 미래의 디자이너와 개발자는 단순히 '사용하기 쉬운' 사이트를 만드는 것을 넘어, AI 에이전트가 데이터를 원활하게 수집할 수 있는 기술적 토대를 마련하는 동시에 인간이 주도권을 잃지 않도록 돕는 정교한 개입 지점을 설계하는 데 역량을 집중해야 합니다.

유용한 플러그인으로 디자인 (새 탭에서 열림)

Matt DesLauriers는 제너러티브 아트를 디자인 도구인 Figma와 결합하여 디자이너들이 코드를 통해 복잡하고 유기적인 시각 시스템을 구축할 수 있도록 돕습니다. 그는 플러그인을 단순한 효율성 도구가 아닌, 예술적 표현을 확장하는 새로운 형태의 '악기'로 정의하며 창의적인 코딩의 대중화를 강조합니다. 결과적으로 코딩 기반의 접근 방식이 디자인 프로세스에 깊이 통합될 때, 기존 수작업으로는 불가능했던 독창적인 시각적 탐험이 가능해진다는 점을 시사합니다. **제너러티브 아트와 디자인 도구의 융합** * Matt DesLauriers는 'Noise', 'Looper'와 같은 Figma 플러그인을 통해 알고리즘 기반의 디자인을 대중화했습니다. * 그는 JavaScript와 WebGL 같은 프로그래밍 기술을 활용하여, 정적인 캔버스 위에서 동적이고 변화무쌍한 패턴을 생성하는 법을 연구합니다. * 단순히 이미지를 만드는 것을 넘어, 수학적 원리를 디자인 환경에 이식함으로써 디자이너가 무한한 변형을 시도할 수 있는 환경을 제공합니다. **플러그인 개발 철학: 도구에서 악기로** * 플러그인은 반복 작업을 줄이는 보조 도구일 뿐만 아니라, 사용자가 예상치 못한 결과를 발견하게 만드는 창의적 매개체여야 한다고 주장합니다. * 복잡한 코드나 수학적 배경지식이 없어도 디자이너들이 슬라이더나 버튼을 통해 알고리즘의 매개변수(parameter)를 조절하며 직관적으로 작업할 수 있도록 설계합니다. * '창의적 코딩(Creative Coding)'을 전문 개발자의 영역에서 디자인 워크플로우의 일반적인 단계로 끌어내리는 데 집중합니다. **기술적 구현과 워크플로우의 확장** * Figma 플러그인 API를 활용하여 브라우저 기반의 강력한 그래픽 성능을 디자인 툴 내에서 구현하는 방식을 공유합니다. * 코드를 통해 생성된 데이터가 어떻게 벡터 그래픽이나 레이어로 변환되어 실무 디자인에 즉시 활용될 수 있는지 설명합니다. * 수작업과 자동화 사이의 균형을 맞추며, '우연한 발견'을 디자인 프로세스의 핵심 요소로 포함시키는 법을 제안합니다. 디자인과 엔지니어링의 경계가 모호해지는 현대 디자인 환경에서, Matt DesLauriers의 사례는 코드를 시각적 언어로 받아들이는 것이 얼마나 중요한지를 보여줍니다. 디자이너라면 단순히 완성된 기능을 사용하는 것을 넘어, 자신만의 독특한 시각적 문법을 구축하기 위해 코딩을 도구 제작의 도구(meta-tool)로 활용해 보는 것을 추천합니다.

플러그인 비하인드 (새 탭에서 열림)

제너레이티브 아티스트이자 크리에이티브 코더인 맷 데스로리에(Matt DesLauriers)는 코드를 단순한 구현 수단이 아닌 창의적인 표현을 위한 '디지털 붓'으로 정의합니다. 그는 피그마(Figma) 플러그인 생태계를 통해 반복적인 디자인 작업을 자동화하고, 알고리즘을 활용하여 인간의 상상력을 넘어서는 복잡한 시각적 패턴을 생성하는 방법론을 제시합니다. 디자인과 개발의 경계를 허무는 그의 작업 방식은 도구 제작자가 곧 예술가가 될 수 있음을 시사하며, 현대 디자인 워크플로우에 새로운 영감을 제공합니다. ### 제너레이티브 디자인과 코드의 결합 * **알고리즘을 통한 시각화**: 수작업으로 구현하기 어려운 복잡한 기하학적 패턴이나 무작위성을 코드로 제어하여 독특한 미적 가치를 창출합니다. * **창의적 코딩(Creative Coding)**: 코드를 정해진 결과물을 만드는 도구가 아닌, 실험과 탐색을 위한 매개체로 활용하여 디자인 프로세스에 우연성과 변주를 도입합니다. * **캔버스-스케치(canvas-sketch)**: 웹 기술을 기반으로 고해상도 그래픽과 애니메이션을 제작할 수 있는 본인만의 오픈소스 도구를 활용해 효율적인 작업 환경을 구축합니다. ### 피그마 플러그인을 통한 워크플로우 혁신 * **반복 작업의 자동화**: 'Looper'나 'Supa Palette'와 같은 플러그인을 통해 수천 개의 레이어를 배치하거나 복잡한 색상 시스템을 구축하는 시간을 획기적으로 단축합니다. * **디자인 시스템의 확장성**: 코드 기반의 플러그인을 활용하여 디자인 시스템의 일관성을 유지하면서도, 데이터에 따라 유연하게 반응하는 동적인 디자인 요소를 생성합니다. * **API의 활용**: 피그마 API를 깊이 있게 활용하여 정적인 디자인 캔버스와 동적인 코드 로직 사이의 가교 역할을 수행하며 도구의 한계를 확장합니다. ### 도구 제작자로서의 철학 * **커스텀 툴 제작의 중요성**: 기존 상용 소프트웨어가 제공하는 기능에 갇히지 않고, 자신의 창의적 니즈에 맞는 전용 플러그인과 도구를 직접 설계합니다. * **커뮤니티와 공유**: 자신이 개발한 도구와 프로세스를 오픈소스로 공개하여 디자인과 개발 커뮤니티가 서로 배우고 성장할 수 있는 생태계를 조성하는 데 기여합니다. * **학습에 대한 접근**: 기술적인 완벽함보다는 작은 실험부터 시작하여 점진적으로 복잡한 문제를 해결해 나가는 '실행 중심'의 학습 태도를 강조합니다. 디자이너가 코딩을 배우는 것은 단순히 기술적 역량을 쌓는 것을 넘어, 디자인 문제를 바라보는 관점을 확장하는 과정입니다. 복잡하고 반복적인 디자인 과제에 직면해 있다면, 기성 도구에 의존하기보다 피그마 API 등을 활용해 자신만의 해결책(플러그인)을 직접 설계해 보는 시도가 창의적 도약의 발판이 될 수 있습니다.