TD Figma
TD_Figma loads Figma layouts into TouchDesigner through the Figma REST API.
Bridge design prototypes and interactive experiences: navigate screens and component states, extract text, images, and layout data from nodes, and export JSON structures for use in TouchDesigner networks.
Features
- Load Figma files — pull a document straight from Figma into TouchDesigner over the REST API, no manual export needed.
- Navigate screens and states — walk through frames, pages, and component states of a design prototype.
- Extract node data — read text content, images, positions, sizes, and layout structure from any Figma node.
- Export JSON — get design data as structured JSON, ready to drive layouts, UI, or generative systems in a TouchDesigner network.
How it works
The component requests a Figma file through the Figma REST API using a personal access token and the file key. The document tree is parsed in Python inside TouchDesigner: frames, components, text and image nodes become structured data that can be mapped to TOPs, CHOPs, and DATs — so a design made in Figma can directly define what appears on screen.
Requirements
- TouchDesigner with Python support
- A Figma account and a personal access token for the REST API
- The file key of the Figma document you want to load
Installation steps and the ready-to-use component are in the GitHub repository.
Use cases
- UI for installations — design interface screens in Figma, render and animate them in TouchDesigner.
- Design-driven visuals — use layout data, colors, and typography from a Figma file as input for generative graphics.
- Rapid prototyping — iterate on screen designs in Figma while the TouchDesigner project updates from the same source of truth.