커스텀 위젯 스튜디오는 정확히 무엇인가

아임웹에서 '위젯'은 배너·버튼·슬라이드처럼 페이지를 구성하는 부품을 뜻합니다. 지금까지는 아임웹이 제공하는 위젯 중에서 고르는 방식이었습니다. 커스텀 위젯 스튜디오는 여기에 부품을 직접 만들어 넣는 작업 공간을 더한 것입니다. 구조는 두 층입니다. 제작자 층에서는 웹 전문가가 HTML·CSS·JavaScript로 위젯의 모양과 동작을 만들고 실시간 미리보기로 결과를 즉시 확인합니다. 운영자 층에서는 브랜드 담당자가 코드를 열지 않고, 제작자가 미리 구성해 둔 설정 화면에서 텍스트·색상·이미지를 직접 바꿉니다. 아임웹은 이 기능의 목적을 자주 바뀌는 요소를 운영자가 스스로 편집하게 해 개발자에게 반복 요청할 필요를 없애는 것이라고 설명합니다.

기존 코드위젯과 결정적으로 다른 한 가지

아임웹에는 원래 코드위젯이 있었습니다. 페이지 안에 HTML을 직접 넣는 상자입니다. 다만 구조적 한계가 하나 있었습니다. 고친 결과물이 코드 덩어리로만 남는다는 점입니다. 클라이언트가 배너 문구를 바꾸려면 코드위젯을 열어야 하는데, 코드를 모르는 분에게 그건 사실상 잠긴 문입니다. 결국 제작자에게 연락이 옵니다. 실제 작업은 5분이지만 맥락 전환 비용까지 더하면 한 건당 체감 부담은 훨씬 큽니다. 커스텀 위젯 스튜디오는 그 코드 덩어리에 손잡이를 달아주는 기능입니다. 위젯 안에서 특정 값을 설정 항목으로 지정하면, 클라이언트 화면에는 입력창·색상 선택기·이미지 업로드 버튼으로 나타납니다. 코드는 잠긴 채로, 값만 열립니다.

어려운 일은 코딩이 아니라 설정 패널 설계입니다

실무자 입장에서 짚고 싶은 지점이 여기입니다. 위젯 자체를 만드는 일은 갈수록 저렴해집니다. 아임웹도 2026년 6월 디자인 모드 업데이트에서 신규 위젯 26종과 함께 AI 에이전트로 위젯을 만드는 기능을 붙였습니다. 아이디어만 있으면 코드를 몰라도 위젯이 나옵니다. 코드위젯에 AI로 만든 코드를 붙이는 방식은 누끼토끼 칼럼에서 앞서 따로 다룬 적이 있는데, 그때와 비교해도 제작 자체의 문턱은 계속 낮아지는 중입니다. 그래서 값이 남는 쪽은 반대편입니다. 무엇을 설정값으로 열고 무엇을 코드 안에 잠글 것인가를 정하는 판단이 그렇습니다. 이건 AI가 대신하기 어렵습니다. 그 클라이언트가 앞으로 무엇을 자주 바꿀지, 어디를 열어주면 디자인이 무너지는지는 그 브랜드와 일해 본 사람만 알기 때문입니다. 위젯 제작은 기술 작업이지만, 설정 패널 설계는 클라이언트 이해도가 만드는 작업입니다.

무엇을 열고 무엇을 잠글까 — 실무 기준

기준은 한 문장으로 정리됩니다. 클라이언트가 최악의 값을 넣어도 화면이 안 망가지면 열고, 망가지면 잠급니다.

열어야 하는 값 — 자주 바뀌고, 바뀌어도 레이아웃이 유지되는 것들입니다. 제목·설명·버튼 문구, 이미지와 링크 주소, 브랜드 팔레트 안에서 고르는 색상, 노출 여부 켜기·끄기가 여기 해당합니다.

잠가야 하는 값 — 한 번 건드리면 전체가 무너지는 것들입니다. 여백·간격·폰트 크기 수치, 모바일 반응형 분기 기준, 그리드 열 개수 같은 구조값이 그렇습니다. 색상도 자유 입력으로 열면 브랜드 톤이 무너지므로, 미리 정한 서너 개 중에서 고르게 하는 편이 안전합니다.

한 가지 더 있습니다. 설정 항목 이름을 개발자 언어로 쓰면 실제로 쓰이지 않습니다. title_1, bg_color 같은 이름은 클라이언트에게 아무 의미가 없습니다. "상단 큰 문구", "배경색(브랜드 3색)"처럼 화면을 보고 바로 알아볼 수 있는 말로 적어야 합니다. 안 그러면 결국 다시 연락이 오고, 이 작업을 한 이유가 사라집니다.

견적에는 '운영 이관 설계'로 적습니다

솔직하게 말씀드리면 이 방식은 첫 제작 시간이 늘어납니다. 위젯 하나를 만들고 끝내는 게 아니라 설정 항목을 설계하고, 이름을 붙이고, 기본값을 정해야 하기 때문입니다. 저는 대략 1.3~1.5배를 더 잡고 견적을 냅니다. 대신 그 비용은 납품 이후에 회수됩니다. 유지보수 요청이 줄어드는 만큼 월 단위로 붙잡히던 시간이 사라지기 때문입니다. 그래서 견적서에도 '커스터마이징'이 아니라 '운영 이관 설계'라는 별도 항목으로 적습니다. 클라이언트에게도 "만들어 드리는 것"과 "직접 바꾸실 수 있게 만들어 드리는 것"이 다른 일이라는 설명이 자연스럽게 됩니다. 참고로 식스샵의 블록메이커도 같은 구조를 갖고 있어서, 두 플랫폼을 함께 쓰는 제작자라면 설정 패널 설계 기준을 한 번 정리해 두면 양쪽에 그대로 재사용할 수 있습니다.

커스텀 위젯 스튜디오는 2026년 5월 28일 출시됐고, 제작자는 HTML·CSS·JavaScript로 위젯을 만들며 운영자는 코드 없이 설정 화면에서 값을 바꿉니다. 위젯을 만드는 일은 AI 덕분에 저렴해지고 있고, 값이 남는 쪽은 무엇을 열고 무엇을 잠글지 정하는 판단입니다. 기준은 하나입니다. 클라이언트가 최악의 값을 넣어도 화면이 안 망가지면 열고, 망가지면 잠급니다. 이 판단을 잘 하는 제작자에게는 '만드는 값'이 아니라 '넘기는 값'이 남습니다.

누끼토끼는 아임웹·식스샵·카페24 홈페이지를 1인으로 제작하면서, 만드는 일보다 클라이언트가 스스로 운영하게 만드는 설계에 무게를 두고 있습니다. 같은 관점의 실무 기록을 칼럼과 강의에서 이어서 다루고 있습니다.