먼저 볼 카드 — 장소 한 단어에서 이미지 여덟 장까지
실습 CONFIG 2026 / 12
Figma 레이아웃이 워크플로우의 마지막 노드가 되기
이미지를 만드는 것과 게시물을 만드는 것은 다른 일입니다. Figma 프레임을 워크플로우의 마지막 노드로 붙이면, 그 둘을 한 번에 처리할 수 있습니다. 이 카드로 앞선 카드들에서 만든 “이미지 자동 생성 기계”가 실제로 쓸 수 있는 게시물까지 이어집니다.
화면으로 따라가기
Figma 프레임이 일반 레이아웃이 아니라 입력을 받을 수 있는 노드로 바뀐 모습을 확인합니다.
“Offtrail – Email header” 프레임에 이미지 입력 핸들이 생겨 앞 노드의 결과와 연결돼 있습니다. 프레임 안에는 원래 있던 “HIKE NAME”, “LOCATION NAME” placeholder 텍스트가 그대로 보입니다.
자주 묻는 질문
- Figma에서 프레임을 다시 고치고 싶으면요? — 원본 프레임은 건드리지 않고, Weave가 만든 연결된 사본에서 편집한 뒤 가져오기로 반영하는 절차를 발표에서 언급했습니다.
- 이 전체 구조를 다른 사람도 쓸 수 있게 만들 수 있나요? — 네. 발표에서는 이 워크플로우 전체를 Weave tool로 만들어 Figma 캔버스에서 입력만 채워 실행하는 도구로 배포했습니다. 노드의 입력·출력 개념 자체는 공식 문서: Understanding Nodes에서 다시 볼 수 있습니다.
실행 순서
-
Figma 파일에서 매달 쓰는 프레임(발표에서는 인스타그램 포스트·스토리·이메일 헤더 등 네 종)을 복사합니다.
-
Weave 캔버스로 돌아와 붙여 넣으면 각 프레임이 그대로 노드가 됩니다.
-
프레임 위에 이미지를 드롭하면 새 입력 핸들이 생깁니다. 이 핸들에 앞 카드에서 만든 이미지를 연결합니다.
-
프레임 안의 텍스트 레이어는 연결 가능한 레이어 목록에서 골라 값을 연결합니다. 관계없는 레이어는 목록에 뜨지 않습니다 — 이미지 필드가 있는 레이어만 이미지 연결 대상으로, 텍스트 필드가 있는 레이어만 텍스트 연결 대상으로 걸러집니다.
-
워크플로우의 맨 앞(장소 이름을 넣는 Prompt 노드)에서 나온 값도 Router를 거쳐 프레임의 텍스트 레이어(예를 들어 행사명)에 연결합니다. 이 발표에서는 장소 이름 "Alaska"가 프레임의 hike name 레이어까지 이어졌습니다.
-
네 프레임 모두에 같은 이미지·텍스트를 연결한 뒤, 그 값을 바꿔 보고 네 종의 게시물이 동시에 갱신되는지 확인합니다.
-
프레임의 디자인 자체를 고치고 싶으면 Edit를 눌러 연결된 Figma 파일을 엽니다. 원본 프레임이 아니라 Weave가 만든 연결된 사본을 편집하고, 컴포넌트·디자인 시스템 색상을 그대로 쓸 수 있습니다. 편집 후 Weave로 돌아오면 최신 변경을 가져올지 그대로 둘지 선택합니다.
직접 해보기
프레임 두 개만으로 같은 순서를 먼저 연습한 뒤, 나머지 프레임을 추가해 보세요.
헷갈리기 쉬운 것
원본 프레임을 직접 고치는 게 아니라, Weave가 만드는 연결된 사본에서 편집됩니다. 원본 Figma 파일을 고치려면 Edit로 열어 수정한 뒤 다시 가져오는 절차가 필요합니다. 텍스트가 길어지면 프레임 안에서 잘릴 수 있습니다 — 발표에서도 새 장소 이름이 길어 프레임 크기를 다시 조정했습니다.
왜 이렇게 작동하나요
메일 머지(mail merge)와 비슷합니다. 편지 양식은 그대로 두고 받는 사람 이름만 바꿔 여러 통을 만드는 것처럼, 게시물 레이아웃은 그대로 두고 이미지·문구만 바꿔 여러 종을 동시에 만듭니다.
Figma 프레임이 노드가 되면, 프레임 안의 이미지·텍스트 레이어는 다른 노드의 출력을 받을 수 있는 입력 포트로 바뀝니다. 그 포트에 워크플로우의 앞 단계(이미지 생성, 장소 이름)를 연결해 두면, 앞 단계의 결과가 바뀔 때마다 프레임도 자동으로 다시 렌더됩니다. 이 카드는 "이미지 생성 파이프라인"과 "레이아웃"을 같은 그래프 안에 놓는 마지막 연결고리입니다.
더 알고 싶다면
이 카드로 발표가 끝나나요?
나만의 도구 만들기 카드에서 다룹니다 →용어 풀이
전체 용어집 →- Figma 노드
- Figma 프레임을 그대로 Weave 캔버스에 붙여 넣어 만든 노드입니다. 이미지·텍스트 레이어에 워크플로우의 다른 노드를 연결할 수 있습니다.
- 연결된 사본(connected copy)
- Figma 프레임을 캔버스에 붙여 넣을 때 원본이 아니라 새로 생기는 사본입니다. 이 사본을 편집해도 원본 Figma 파일은 그대로 남습니다.
2026-07-28 기준 · 출처 · Figma deep dive: Weave | Config 2026, Understanding Nodes