FRAMEWISP ← HomeНа главную

Framewisp 4.6 · Updated 12 October 2026Framewisp 4.6 · Обновлено 12 октября 2026

Framewisp documentationДокументация Framewisp

From your first import to effects, gradients, custom shapes and Live Sync. Add tags to Figma layer names, tune them in the plugin, then re-export to carry the settings into Roblox. От первого импорта до эффектов, градиентов, своих форм и Live Sync. Добавьте теги к именам слоёв Figma, настройте их в плагине и экспортируйте макет заново, чтобы настройки попали в Roblox.

QuickstartБыстрый старт TagsТеги _stroke _flow _beam _sparkle _type Effects & gradientsЭффекты и градиенты Buttons & panelsКнопки и панели Live dataЖивые данные Auto-syncАвто-синк In StudioВ Studio ImagesКартинки Design tabВкладка «Дизайн» Trial & licenseТриал и лицензия

01QuickstartБыстрый старт

Three steps using Code mode. For direct delivery without an import code, see Live Sync. Три шага в режиме Code. Для отправки напрямую без кода импорта — раздел Live Sync.

1Sign inВойдите Open the Framewisp plugin in Figma and sign in with Roblox — one click, no API keys. Images will upload to your own account. Откройте плагин Framewisp в Figma и войдите через Roblox — один клик, без API-ключей. Картинки загрузятся в ваш собственный аккаунт.
2ConvertКонвертируйте Select one frame, choose Code, then press Convert to Roblox. You get a six-character import code, reusable for 24 hours. Выделите один фрейм, выберите Код и нажмите Конвертировать в Roblox. Вы получите шестисимвольный код импорта, который можно использовать повторно в течение 24 часов.
3Paste in StudioВставьте в Studio In the Framewisp Studio plugin choose Code, paste the code and press Import to Studio. The design appears in StarterGui, using native Roblox UI where supported and images for baked artwork. В Studio-плагине Framewisp выберите Code, вставьте код и нажмите Import to Studio. Макет появится в StarterGui: поддерживаемые элементы будут нативным UI Roblox, запечённая графика — картинками.

02Layer tagsТеги слоёв

Add suffix tags to a layer name in Figma. Tag keywords are case-insensitive, and ordinary suffix tags can appear in any order: Exit_close_smooth_magnet equals Exit_magnet_smooth_close. Put a tag with a colon parameter last: _open:Name, _toggle:Name, _tab:Name, _close:Name, _bind:Path or _card:Owner. Its parameter runs to the end of the name. Use one action per layer; incompatible structural roles should be split across nested layers. Добавляйте теги-суффиксы к имени слоя в Figma. Регистр ключевых слов не важен, обычные теги можно переставлять: Exit_close_smooth_magnet = Exit_magnet_smooth_close. Тег с параметром после двоеточия ставится последним: _open:Имя, _toggle:Имя, _tab:Имя, _close:Имя, _bind:Путь или _card:Кнопка. Параметр читается до конца имени слоя. На одном слое используйте одно действие, а несовместимые структурные роли разносите по вложенным слоям.

Effects come alive in Play. Everything animated — hover, lift, selection, drift, float, spin, shine — ships as a LocalScript next to your UI, and Roblox never runs a LocalScript in edit mode. In the Studio viewport you see the design standing still; press Play and it moves. The importer names what it wired right after it finishes. Эффекты оживают в Play. Всё анимированное — наведение, подъём, выделение, дрифт, левитация, вращение, блик — приезжает LocalScript'ом рядом с вашим интерфейсом, а Roblox не выполняет LocalScript в режиме редактирования. Во вьюпорте Studio макет стоит; нажмите Play — и он поедет. Плагин сразу после импорта пишет, что именно он подключил.

_3d
_magnet + _smooth
_smooth
_magnet
_shiny
_glint
_spin
TagТегWhat it doesЧто делает
_buttonmakes the frame a clickable button with hover/press effectsделает фрейм кнопкой с эффектами наведения и нажатия
_scrollTurns a Frame or Group into a scrolling window. A Frame keeps the size you drew. A Group uses space to the right and bottom edges of the nearest enclosing Frame that limits its content. Your Figma layers stay unchanged.

Buttons and artwork may sit inside another unclipped Frame or Group: visible content beyond the window still scrolls. Nested clipped containers and separate scroll windows keep their own content bounds. Direction follows the overflow automatically, or you can force it in Effects. _list or _grid can arrange the content.

If everything fits, there is nothing to scroll. A negative Window edge right/down reduces the viewport, including on an exported root Group without a limiting parent. Explicit edges override automatic Group sizing. Framewisp clips the window itself; Figma Clip content is not required. For a Group starting above or left of its enclosing Frame, set window edges explicitly. Remove rotation from the scroll layer itself; content can remain rotated.Превращает Frame или Group в окно прокрутки. Frame сохраняет нарисованный размер. Group использует место до правого и нижнего края ближайшего родительского Frame, ограничивающего содержимое. Слои Figma не меняются.

Кнопки и рисунки могут лежать во вложенном Frame или Group без обрезки: видимое содержимое за краем окна тоже прокручивается. Вложенные обрезанные контейнеры и отдельные окна прокрутки сохраняют свои границы содержимого. Направление определяется по выходу за края либо задаётся в Effects. _list или _grid могут организовать содержимое.

Если всё помещается, прокручивать нечего. Отрицательный Край окна вправо/вниз уменьшит окно, в том числе у экспортируемой корневой группы без ограничивающего родителя. Явные края имеют приоритет над автоматическим размером. Framewisp сам обрезает окно; Clip content в Figma не нужен. Если группа начинается выше или левее родительского фрейма, задайте края явно. Уберите поворот у самого слоя прокрутки; содержимое может оставаться повёрнутым.
_gridcard grid: the cards inside a frame become a real UIGridLayout, identical on every device. Where: on the frame that directly holds the cards — or on its outer group, and the tag drops down to the window inside (your _scroll rectangle). What it reads from your design: the columns from the longest row, the gaps from the space between cards, the padding from where the first card sits. Rules: at least two cards, all the same size, even gaps, every row on the same columns, and only the last row may be shorter. Every visible layer directly inside the frame counts as a card, so keep the background on the frame's own fill or outside it. Break a rule and Studio's Output shows a warning while the cards keep their exact positions. Add _scroll on the same frame for an inventory that scrolls and grows as game scripts add cards. Items of different sizes in one row or column: use _listсетка карточек: карточки внутри фрейма становятся настоящим UIGridLayout, одинаково на любом устройстве. Куда: на фрейм, который напрямую держит карточки, — или на его внешнюю группу, тогда тег сам спустится на окно внутри (ваш прямоугольник _scroll). Что берётся из макета: колонки — по самой длинной строке, отступы — по расстоянию между карточками, поля — по месту первой карточки. Правила: минимум две карточки, все одного размера, ровные отступы, все строки стоят на одних и тех же колонках, короче может быть только последняя строка. Каждый видимый слой прямо внутри фрейма считается карточкой, поэтому фон держите в заливке самого фрейма или снаружи. Нарушено правило — в Output Studio появится предупреждение, а карточки останутся на своих местах. Добавьте _scroll на тот же фрейм — получится инвентарь, который скроллится и растёт, когда скрипты игры добавляют карточки. Элементы разного размера в одну строку или колонку — это _list
_listone row or one column of items becomes a real UIListLayout — and unlike _grid, the items may have different sizes: a stack of text lines, a row of buttons of different widths, a menu. Put it on the frame that directly holds the items. Framewisp reads the direction from how they stack, the gap from the space between neighbours, and the alignment from a shared left edge, centre or right edge (top, middle or bottom for a row). The gaps must be even; otherwise Output shows a warning and the items keep their exact positions. The items move into a frame called Items, and anything a script adds there falls into line (LayoutOrder sets the order). The list keeps its proportions on every screen with no script running. Inside a _scroll window the scroll area stays the size of the design, so for a list the game fills at runtime use same-size rows with _grid No tag needed when the spacing is already exact: three or more items with identical gaps become a list on their own (one pixel off — they stay where you put them); _nolist switches that off for a frame.один ряд или одна колонка элементов становится настоящим UIListLayout — и, в отличие от _grid, элементы могут быть разного размера: строки текста, ряд кнопок разной ширины, меню. Вешайте на фрейм, который напрямую держит элементы. Framewisp читает направление по тому, как элементы стоят, отступ — по расстоянию между соседями, выравнивание — по общему левому краю, центру или правому краю (у ряда — верх, середина или низ). Отступы должны быть ровными, иначе в Output появится предупреждение, а элементы останутся на своих местах. Элементы переезжают во фрейм Items, и всё, что скрипт добавит туда, само встанет в ряд (порядок задаёт LayoutOrder). Пропорции сохраняются на любом экране без скриптов. Внутри окна _scroll область прокрутки остаётся размером с макет, поэтому для списка, который игра заполняет по ходу, используйте одинаковые строки с _grid Без тега тоже работает, если отступы уже точные: три и больше элементов с одинаковыми отступами сами становятся списком (разница хоть в пиксель — остаются как поставил); _nolist выключает это для фрейма.
_textboxa real input field: the text layer becomes a Roblox TextBox. Put _textbox or its alias _input on the text itself. On a field frame, it transfers to the first visible text child directly inside that frame; nested text is not searched. The drawn text becomes the placeholder. The field starts empty, keeps typed text on focus and uses the design’s font, size and colour.настоящее поле ввода: текстовый слой становится Roblox TextBox. Ставьте _textbox или его синоним _input на сам текст. На фрейме поля тег переносится на первый видимый текстовый слой непосредственно внутри этого фрейма; текст во вложенных группах не ищется. Нарисованный текст становится плейсхолдером. Поле стартует пустым, не очищается при фокусе и берёт шрифт, размер и цвет из макета.
_framekeep this layer a real Frame instead of a picture. Framewisp flattens a layer when Roblox has no way to draw it — a blur, an inner shadow, a radial gradient, several stacked fills, a cropped image fill, a mask that Roblox cannot reproduce. With _frame the layer is rebuilt natively and only the effect that caused it is dropped, and the warning names exactly what was lost. It cannot rescue what has no native shape at all: vector shapes, arcs and donuts, and anything you tagged _image on purpose still bakeоставить слой настоящим Frame, а не картинкой. Framewisp запекает слой, когда Roblox нечем его нарисовать: блюр, внутренняя тень, радиальный градиент, несколько наложенных заливок, обрезанная картинка-заливка, маска, которую Roblox не может воспроизвести. С тегом _frame слой пересобирается нативно, теряется только тот эффект, который к этому привёл, — и предупреждение называет, что именно отброшено. Спасти то, у чего нет нативной формы, тег не может: векторные фигуры, дуги и бублики, а также всё, что вы сами пометили _image, по-прежнему запекаются
_txtkeep this layer a real TextLabel instead of a picture. Text is flattened when it carries a paint or effect Roblox text cannot draw — a radial/angular gradient, an image fill, an unsupported gradient stroke, a blur or inner shadow. A single supported linear stroke gradient stays native with _stroke or with _flow targeting Stroke/Both. With _txt the label stays live text, only the paint or effect that caused the bake is dropped, and the warning names exactly what was lost. Wrapping text bakes by default (pixel-perfect); with _txt it stays a live label with TextWrapped — near-exact, editable in Studioоставить слой настоящим TextLabel, а не картинкой. Текст запекается, когда на нём заливка или эффект, который текст Roblox не умеет: радиальный/угловой градиент, картинка-заливка, неподдерживаемая градиентная обводка, блюр или внутренняя тень. Одна поддерживаемая линейная градиентная обводка остаётся нативной с _stroke или с _flow, направленным на Stroke/Both. С тегом _txt лейбл остаётся живым текстом, теряется только заливка или эффект, из-за которых был бейк, — и предупреждение называет, что именно отброшено. Переносящийся текст по умолчанию запекается (пиксель-в-пиксель); с _txt он остаётся живым лейблом с TextWrapped — почти точным и редактируемым в Studio
_fadeinthe layer arrives from nothing: transparent to normal, every time it becomes visible — at spawn, and again whenever _open shows the panel it sits in (a panel that opens flips its own visibility, never the layer's, so the tag watches the whole chain above it). Fade time and a start delay, so the parts of a panel can arrive one after another. The whole layer fades — text, outlines and UIStroke with it — and each part comes back to its own transparency from the design, not to zeroслой приходит из ничего: из прозрачного в обычный, каждый раз, когда становится видимым — на спавне и когда _open показывает панель, в которой он лежит (открывающаяся панель переключает свою видимость, а не слоя, поэтому тег следит за всей цепочкой выше). Время появления и задержка старта — чтобы части панели приходили по очереди. Гаснет слой целиком — текст, обводки и UIStroke вместе с ним — и каждая часть возвращается к своей прозрачности из макета, а не к нулю
_colortwo things on one tag. Hover: inside a button (or on a button), pick a hover colour in the effect panel — the layer turns into it while the cursor is on the button and comes back when it leaves, an icon that lights up with its card. A second colour makes the hover a gradient (angle adjustable); fade-in and fade-out are separate sliders. From code: the layer's colour is a Color attribute in Roblox — frame:SetAttribute("Color", Color3.fromRGB(255, 0, 0)) paints the property that actually paints that class: fill, picture tint or text. A layer with a gradient gets a ColorSequence instead, stops editable in Properties like in Figma; set one from code and the whole gradient changes, set a plain Color3 and it tints. The layer survives a bake instead of being absorbed into the background picture; if it must become a picture itself, Roblox tints by multiplying, so draw that art white to recolour it freelyдва дела на одном теге. Наведение: внутри кнопки (или на кнопке) выбери цвет при наведении в панели эффектов — слой перекрашивается в него, пока курсор на кнопке, и возвращается, когда уходит: иконка, которая зажигается вместе с карточкой. Второй цвет превращает наведение в градиент (угол настраивается); появление и исчезание — отдельные ползунки. Из кода: цвет слоя — атрибут Color в Roblox: frame:SetAttribute("Color", Color3.fromRGB(255, 0, 0)) красит то свойство, которое в этом классе реально видно — заливку, оттенок картинки или текст. Слой с градиентом получает ColorSequence, стопы редактируются в Properties как в Figma; поставь его из кода — сменится весь градиент, поставь обычный Color3 — подкрасит. Слой переживает запекание, а не растворяется в фоновой картинке; а если он сам стал картинкой — Roblox красит умножением, поэтому нарисуй арт белым, и любой цвет ляжет точно
_leanthe layer tilts when the cursor enters the CARD around it — an icon that reacts to its button without being one. That is the difference from _turn: _turn makes the layer itself a button, so putting it on a picture inside a card steals the card's hover and click. _lean never becomes a button; it watches the nearest button above it and leans. The dial sets the angle and goes both ways, the second slider sets how fastслой наклоняется, когда курсор заходит на КАРТОЧКУ вокруг него — иконка реагирует на свою кнопку, сама кнопкой не будучи. В этом отличие от _turn: тот делает кнопкой сам слой, и повешенный на картинку внутри карточки перехватывает у неё наведение и клик. _lean кнопкой не становится — он следит за ближайшей кнопкой сверху и наклоняется. Циферблат задаёт угол в обе стороны, второй ползунок — скорость
_floatgentle levitation: the layer drifts back and forth along one direction, forever. The dial in the plugin sets that direction like a compass — 0 is up, which is the default — and the sliders set how far it travels and how fast. The drift is centred on the design position, so the layer never sits further than half the travel from where you put itлёгкая левитация: слой плавно ходит туда-сюда в одном направлении. Циферблат в плагине задаёт направление как компас — 0 это вверх, значение по умолчанию, — а ползунки задают размах и скорость. Колебание центрируется на проектной позиции, поэтому слой не уходит дальше половины размаха от того места, куда вы его поставили
_driftan endless scrolling texture. Give the layer a Tile image fill in Figma and the pattern slides forever in the direction you pick — studs drifting behind a shop panel, that effect. The plugin sets speed and direction (a compass dial, left by default) and previews it live. The texture fills the box of the layer you tag, so put the tag on the full-size background layer, not on a small rectangle inside it. A blend mode on the tile is composited into the pattern at export, so an Overlay looks in Studio exactly like it does in Figma — Roblox itself has no blend modes. The layer keeps its own fill underneath, and nothing on top of it is clippedбесконечно едущая текстура. Дайте слою заливку картинкой в режиме Tile — и узор поедет в выбранную сторону навсегда: те самые шипы, ползущие за панелью магазина. Скорость и направление задаются в плагине (циферблат, по умолчанию влево), там же живое превью. Текстура заполняет коробку того слоя, на котором висит тег, — вешайте на полноразмерный фоновый слой, а не на маленький прямоугольник внутри. Режим наложения плитки вкомпоновывается в узор при экспорте, поэтому Overlay в Studio выглядит ровно как в Figma — в самом Roblox режимов наложения нет. Своя заливка слоя остаётся под узором, и ничего поверх не обрезается
_upthe button lifts a few pixels while the cursor is on it and settles back when it leaves. Distance and time are set in the plugin. Works inside _grid too: a layout owns where its cells sit, so the button gets its own slot and lifts inside it. In a scroll window the canvas already reserves room for the lift, so the top row is not clipped. Implies _buttonкнопка приподнимается на несколько пикселей, пока на ней курсор, и опускается обратно. Высота и время настраиваются в плагине. Работает и внутри _grid: layout сам решает, где стоит ячейка, поэтому кнопка получает собственный слот и поднимается внутри него. В окне скролла запас под подъём уже заложен в холст, так что верхний ряд не срезается. Подразумевает _button
_turnthe card turns while the cursor is on it and swings back when it leaves — 5° to the left by default. The dial in the plugin sets the angle and goes both ways; the second slider sets how fast. Rotation pivots on the card's centre, so a card drawn at an angle returns to that angle, not to zero. Stacks with _up and _smooth. Implies _buttonкарточка поворачивается, пока на ней курсор, и возвращается, когда он ушёл — по умолчанию на 5° влево. Циферблат в плагине задаёт угол и крутится в обе стороны, второй ползунок — скорость. Поворот идёт вокруг центра карточки, поэтому карточка с наклоном в макете вернётся к своему наклону, а не к нулю. Складывается с _up и _smooth. Подразумевает _button
_selectput the tag on the outline you drew inside the card — or on the card itself; if there is no button around it, the tagged layer takes the click. Clicking animates that outline in — colour, thickness, pop and timing all set in the plugin — and picking another card releases the previous one, so exactly one choice is live at a time. Clicking the chosen card again lets it go. Set the time to 0 for an instant outline; the pop keeps its own timing so it stays visible. If the layer already has a stroke, Framewisp recolours that one instead of stacking a second ring. Your game reads the choice from the parent's FWSelected attribute (the chosen button's name) or from each button's own FWSelected booleanвешается на обводку, нарисованную внутри карточки, или на саму карточку; если кнопки вокруг нет, клик берёт на себя сам помеченный слой. Клик проявляет обводку — цвет, толщина, отскок и время настраиваются в плагине, — а выбор другой карточки снимает предыдущую, так что выбранная всегда одна. Повторный клик по выбранной снимает выбор. Поставьте время 0 для мгновенной обводки: отскок живёт по своему времени и остаётся заметным. Если у слоя уже есть обводка, Framewisp перекрасит её, а не нарисует второе кольцо. Игра читает выбор из атрибута FWSelected на родителе (имя выбранной кнопки) или из булева FWSelected на самой кнопке
_ignoreskip this layer on importпропустить слой при импорте
_imagebake the layer into a crisp PNG. Aliases: _img, _lock, a # or img: prefixзапечь слой в чёткий PNG. Синонимы: _img, _lock, префикс # или img:
_fithand the text's size to Roblox: the label uses TextScaled, so the string is fitted to its box instead of keeping the design's point size. Made for labels whose text the game replaces at runtime — a score that grows from 0 to 1,000,000 stays inside its plate. It only makes sense on a box you sized yourself in Figma, because that box is what the text is fitted to; on an auto-width layer the box IS the text and there is nothing to fit. Leave it off and ordinary screen labels keep the design’s font size; billboard labels use TextScaled independently to follow their world-space sizeотдать размер текста Roblox: подпись получает TextScaled и подгоняется под свою коробку вместо кегля из макета. Для подписей, текст которых игра меняет на ходу: счёт, растущий с 0 до 1 000 000, останется внутри плашки. Имеет смысл только на коробке, которую вы задали сами, — именно под неё и подгоняется текст; у слоя с авто-шириной коробка и есть текст, подгонять нечего. Без тега обычные экранные подписи сохраняют кегль из макета; подписи BillboardGui используют TextScaled независимо, чтобы следовать размеру интерфейса в мире
_keepkeep this layer separate from a parent’s baked background. The kept layer may still be an image if its own shape or paint needs baking; use _txt to explicitly request editable text. A non-text layer kept only with _keep or _nodim can still merge into the background when it uses a blend mode Roblox cannot reproduce. Framewisp warns about this; use Normal blending and opacity to keep it separate.оставить слой отдельно от запечённого фона родителя. Сам сохранённый слой всё ещё может стать картинкой, если его форму или оформление нужно запечь; для явно редактируемого текста используйте _txt. Нетекстовый слой, который сохраняется только благодаря _keep или _nodim, может всё же слиться с фоном, если использует неподдерживаемый режим наложения. Framewisp предупредит об этом; для отдельного слоя используйте Normal и прозрачность.
_nolistdisable automatic list detection for this frame and keep its children at their authored positions. It does not cancel an explicit _list or _grid; remove that tag if absolute positioning is intended.отключить автоматическое распознавание списка для этого фрейма и сохранить заданные позиции дочерних слоёв. Явные _list и _grid тег не отменяет: уберите их, если нужно абсолютное позиционирование.
_canvasimport as a CanvasGroup (group transparency)импортировать как CanvasGroup (групповая прозрачность)
_aspectlock the aspect ratio (UIAspectRatioConstraint)зафиксировать пропорции (UIAspectRatioConstraint)
_nodimdon't darken this image on button hover (the rest dim)не затемнять эту картинку при наведении на кнопку (остальные темнеют)
State variantsСостоянияWhat it doesЧто делает
_hover _clickedvisual state layers inside their owning button: _hover appears on hover and _clicked while pressed. Keep one layer per state for each button. A state outside a button is ignored with a warning and remains ordinary visible content.слои состояния внутри своей кнопки: _hover показывается при наведении, _clicked — при нажатии. Для каждой кнопки оставляйте по одному слою каждого состояния. Состояние вне кнопки игнорируется с предупреждением и остаётся обычным видимым содержимым.
_smootha juicy button: smoothly scales up on hover and squishes on press, with hover/click sounds. Swap or silence the sounds via the button’s HoverSound / ClickSound attributes (empty string or 0 = silent). These overrides take priority over sounds set in Figmaсочная кнопка: плавно увеличивается при наведении и сжимается при нажатии, со звуками. Заменить или выключить звуки — атрибуты HoverSound / ClickSound у кнопки (пустая строка или 0 = без звука). Они имеют приоритет над звуками, заданными в Figma
_3da card with real 3D perspective: in game it tilts toward the cursor (idle sway on touch devices). Buttons, states and _smooth inside keep working. It leaves the UI layer: real perspective needs a world surface, and Roblox always draws normal UI over one — so a panel or backdrop drawn behind the card used to cover it in play, while the Studio editor looked right because nothing runs there. Now the container that holds the card and everything under it leaves the screen too, flat, as one surface behind the card, and the stacking order inside it stays exactly the design's. Layers designed above the card still land on top. The one case that cannot be fixed this way is a container holding a CanvasGroup (a rounded mask, a _fall stage) — a surface cannot render one — and Output names itкарточка с настоящей 3D-перспективой: в игре наклоняется к курсору (на тач-устройствах — лёгкое покачивание). Кнопки, состояния и _smooth внутри продолжают работать. Она покидает слой интерфейса: настоящая перспектива требует поверхности в мире, а обычный UI Roblox всегда рисует поверх неё — поэтому панель или подложка, нарисованная позади карточки, раньше закрывала её в игре, хотя в редакторе Studio всё выглядело правильно. Теперь контейнер, где лежит карточка и всё под ней, тоже уходит в мир — плоско, одной поверхностью позади карточки, а порядок слоёв внутри него остаётся ровно дизайнерским. Слои, нарисованные над карточкой, по-прежнему лягут сверху. Единственный случай, который так не чинится, — контейнер с CanvasGroup внутри (скруглённая маска, сцена _fall): поверхность его не отрисует — Output называет слой
_tiltthe card stands in 3D at an angle you choose and holds it — a shop card turned three-quarters, a panel raked back, an icon on its edge. Two dials, read like a head: turn left / right is looking sideways, look up / down is raising your chin to the sky or dropping it to the ground. A third slider sets how strongly the perspective reads (higher = the card sits closer to the lens, so the same angle looks more dramatic). There is no in-plane roll on purpose — that one is Figma's own rotate handle, and it exports as it is. Past a quarter turn the card shows its back, and a back is not drawn; the demo does that too, so what you set is what you get. On its own it reacts to nothing: it is a pose, not an effect. Put _3d on the same layer and the cursor tilt swings around that pose instead of around flat zero: _tilt decides how the card stands, _3d brings it to life. Play mode only, like _3dкарточка стоит в 3D под углом, который ты выбрал, и держит его — товар в развороте на три четверти, панель, откинутая назад, иконка на ребре. Два циферблата, читаются как голова: поворот влево / вправо — это когда голову поворачивают вбок, взгляд вверх / вниз — когда её поднимают к небу или опускают к земле. Третий ползунок — сила перспективы (больше — карточка ближе к объективу, тот же угол читается резче). Крена в плоскости нет намеренно: это обычный поворот слоя в Figma, он и так уезжает в экспорт. За четверть оборота карточка поворачивается спиной, а спина не рисуется — в демо так же, поэтому что настроил, то и получишь. Сама по себе ни на что не реагирует: это поза, а не эффект. Повесь на тот же слой _3d — и наклон к курсору пойдёт вокруг этой позы, а не от плоского нуля: _tilt решает, как карточка стоит, _3d её оживляет. Работает в игре, как и _3d
_shinyMoves a shine strip or ray formation you draw inside a clipped parent. Sweep + pause travels fully left to right, then waits; Continuous repeats without an empty interval. In Continuous, 0° travels right, 90° down and −90° up; speed is in projected window spans per second. For upward beams with fading defaults, use _beam.

Effect opacity (0–1, default 1) changes only the moving artwork’s alpha. Sweep width (0.25–2, default 1) scales its original width, and the sweep still leaves the window fully. Continuous keeps the original width and ignores this setting. Top fade (0–1, default 0) affects only Continuous: 0.25 fades across the upper quarter. Strength (0–1, default 1) and falloff (0.25–4, default 1) control disappearance; Sweep ignores fade.

Fade or reduced opacity needs compatible 2D CanvasGroup stacking. Unsupported layout, 3D or stacking shows a warning while movement continues. Dense formations may fall back to Sweep (maximum 64 repeated containers / 512 copied descendants). Hidden parents pause; reduced motion or tag removal restores original positions and effect-owned clipping. Manual numeric Shine* attributes override exported settings.Двигает нарисованную вами полосу блика или состав лучей внутри родителя с обрезкой. Проход + пауза полностью проходит слева направо и ждёт; Непрерывно повторяет состав без пустого интервала. В непрерывном режиме 0° — вправо, 90° — вниз, −90° — вверх; скорость измеряется в размерах окна по направлению движения за секунду. Для лучей вверх с настройками затухания по умолчанию используйте _beam.

Непрозрачность эффекта (0–1, по умолчанию 1) меняет только alpha движущегося рисунка. Ширина блика (0.25–2, по умолчанию 1) умножает исходную ширину; проход полностью выходит за край окна. Непрерывное движение сохраняет исходную ширину и игнорирует этот параметр. Затухание сверху (0–1, по умолчанию 0) действует только непрерывно: 0.25 — верхняя четверть. Сила (0–1, по умолчанию 1) и кривая (0.25–4, по умолчанию 1) меняют исчезновение; одиночный проход игнорирует затухание.

Затухание и уменьшенная непрозрачность требуют совместимого 2D CanvasGroup. При несовместимом layout, 3D или порядке слоёв появится предупреждение, движение продолжится. Плотный состав может перейти в проход с паузой: максимум 64 повторных контейнера и 512 скопированных потомков. Скрытый родитель ставит часы на паузу; reduced motion или удаление тега возвращает позиции и обрезку, которой владел эффект. Ручные числовые Shine* перекрывают настройки экспорта.
_beamRepeats your own beam, image or group of streaks inside its parent’s mask or clipped frame. Tag the moving artwork, keeping the card’s background and labels separate. Draw several streaks to control their count and spacing; copies are created during playback, not as extra Figma layers.

Defaults: continuous upward travel at 0.22 window spans/s, fading over the upper quarter. Set speed (0–4; 0 pauses), direction (0° right, 90° down, −90° up), top fade height (0–1), strength (0–1), falloff (0.25–4) and effect opacity (0–1). Strength 1 fully hides beams at the top; height 0 disables fading. Opacity changes transparency, not RGB colour.

Beams under the same parent share one formation and the first beam’s movement settings. Use separate masked frames for independent speeds or directions. Fade or reduced opacity needs compatible 2D CanvasGroup stacking; incompatible layout, 3D or stacking produces a warning while movement continues. Dense formations fall back to a single sweep with a warning. Removing the tag or enabling reduced motion restores the original artwork. Settings use Shine* attributes; on the same layer, _beam takes priority over _shiny Sweep and _glint.Непрерывно повторяет ваш луч, картинку или группу штрихов внутри маски либо фрейма с обрезкой. Поставьте тег на движущийся рисунок, оставив фон карточки и подписи отдельно. Количество и расстояние между штрихами задаются вашим рисунком; копии создаются при проигрывании, а не дополнительными слоями в Figma.

По умолчанию лучи движутся вверх со скоростью 0.22 размера окна/с и исчезают в верхней четверти. Настраиваются скорость (0–4; 0 — пауза), направление (0° вправо, 90° вниз, −90° вверх), высота затухания (0–1), его сила (0–1), кривая (0.25–4) и непрозрачность эффекта (0–1). Сила 1 полностью скрывает лучи у верхнего края; высота 0 выключает затухание. Непрозрачность меняет alpha, а не RGB-цвет.

Лучи под одним родителем образуют общий состав с настройками движения первого луча. Для разных скоростей и направлений используйте отдельные фреймы с маской. Затухание и уменьшенная непрозрачность требуют совместимого 2D CanvasGroup; при несовместимом layout, 3D или порядке слоёв появится предупреждение, движение сохранится. Слишком плотный состав переходит в одиночный проход с предупреждением. Удаление тега или reduced motion возвращает исходный рисунок. Настройки используют атрибуты Shine*; на одном слое _beam имеет приоритет над Sweep у _shiny и _glint.
_glinthover shine. Same workflow as _shiny: draw the shine strip yourself inside the button and tag it _glint. It stays parked off the left edge and makes ONE sweep across the button when the cursor enters it (you may keep the layer hidden in Figma — the game shows it anyway). Speed — in the Effect playground or via the GlintSpeed attributeблик при наведении. Тот же принцип, что _shiny: нарисуйте полосу блика сами внутри кнопки и повесьте тег _glint. Блик спрятан за левым краем и делает ОДИН проход по кнопке, когда на неё заходит курсор (слой можно оставить скрытым в Figma — в игре он появится сам). Скорость — в Effect playground или атрибутом GlintSpeed
_spinspins the element around its centre in game — loaders, gears, glow rays. Speed — in the Effect playground or via the SpinSpeed attribute (degrees/sec, negative = counter-clockwise). A picture set to Crop is opened: the whole picture spins at the size Figma's crop placed it, and the mask or Clip content around it does the cutting — a crop window would otherwise turn with the art. A layer under a mask is read whole and cut in Roblox by a CanvasGroup, since ordinary clipping never cuts a rotated childвращает элемент вокруг центра в игре — лоадеры, шестерёнки, лучи. Скорость — в Effect playground или атрибутом SpinSpeed (градусы/сек, минус = против часовой). Картинка в режиме Crop раскрывается: крутится вся картинка того размера, каким её поставил кроп в Figma, а режет её маска или Clip content вокруг — иначе окно кропа вращалось бы вместе с артом. Слой под маской читается целиком и режется уже в Roblox через CanvasGroup: обычная обрезка никогда не резала повёрнутый элемент
_magnetmagnetic button: it leans toward the cursor when it comes near and snaps back like rubber. Combines with _button and _smooth. Heads up: a clip mask on the parent frame will cut the button when it leans outsideмагнитная кнопка: тянется к курсору, когда он рядом, и отскакивает обратно как резина. Совместим с _button и _smooth. Важно: маска-обрезка у родителя срежет кнопку, когда она выходит за фрейм
_defaultthe button’s resting visual, placed inside the button. It hides whenever a matching _hover, _clicked or _disabled variant is shown, and returns when no variant is active. This swaps the whole resting look instead of overlaying it.вид кнопки в покое; слой должен находиться внутри кнопки. Он прячется, пока показано соответствующее состояние _hover, _clicked или _disabled, и возвращается, когда ни одно из них не активно. Это полная подмена вида в покое, а не оверлей.
_disabledshown inside its owning button when the button’s Interactable or Active property is false. Set the property from your game scripts; adding this visual tag does not disable the button by itself.показывается внутри своей кнопки, когда её свойство Interactable или Active равно false. Меняйте свойство игровым скриптом: сам тег на слое состояния не отключает кнопку.
_activethe look of a tab while it is selectedвид вкладки, когда она выбрана

Juice. The tags that make a static design feel alive: entrances, idle motion and press feedback. They stack with every other tag and each one has its own sliders in the Effect playground — the preview in Figma plays exactly what the game will play. Сок. Теги, от которых статичный макет оживает: появления, движение в покое и отклик на нажатие. Складываются с любыми другими тегами, у каждого свои ползунки в Effect playground — превью в Figma играет ровно то же, что и игра.

JuiceАнимацияWhat it doesЧто делает
_popthe panel springs in with an overshoot the moment it appears — start scale and pop time are yours. Put it on anything _open shows, or on a layer that is already on screen at spawn: it plays once on every appearanceпанель влетает с пружинным перелётом в момент появления — начальный размер и время задаются в плагине. Ставьте на всё, что показывает _open, или на слой, который виден сразу при заходе: эффект играет при каждом появлении
_revealthe showcase entrance: the panel grows from half size while rocking through a few decaying swings, then settles. Swing angle, settle time and start scale are sliders; the dial picks the rocking direction (0 = up and down like a display case, 90 = sideways). Replays on every _openвитринное появление: панель вырастает с половины размера, покачиваясь затухающими взмахами, и успокаивается. Угол распаха, время успокоения и начальный размер — ползунки; диск выбирает направление качания (0 — вверх-вниз, как витрина, 90 — вбок). Повторяется при каждом _open
_swingthe reward-door entrance: the panel snaps in fast and rocks in true 3D — nodding toward you and away, each rock softer than the last, until it stands still. Rock angle, rocks before settling, settle time and start scale. The card is mounted on a real surface in the world, so the perspective is genuine rather than a squash. Replays on every _openпоявление «дверцей»: панель влетает и качается в настоящем 3D — кивает к вам и от вас, каждый мах мягче предыдущего, пока не встанет. Угол качания, число махов, время успокоения и начальный размер. Карточка живёт на реальной поверхности в мире, поэтому перспектива настоящая, а не сплющивание. Повторяется при каждом _open
_dropthe layer falls onto its place when it appears: it speeds up like a weight, squashes where it lands (onto its bottom edge), stretches a touch and bounces once, softly. Height (px), time, bounce, squash, fade-in, delay and a landing sound are yours. Children one after another: the panel stays where it is and what is inside it falls in reading order, top to bottom, with a step you set (a button's shadow falls with its button). Plays at spawn and every time _open shows the layer. With _pop on the same layer, _drop plays. Children mode follows layout order inside a list or grid; if there are no separate visible children, the whole layer falls instead. On a layer hosted in 3D, only the fade playsслой падает на своё место, когда появляется: разгоняется, как под тяжестью, сплющивается при касании (на нижний край), чуть вытягивается и мягко подпрыгивает один раз. Высота (px), время, отскок, сплющивание, проявление, задержка и звук приземления — настраиваются. Дети по очереди: панель остаётся на месте, а то, что в ней, падает по порядку чтения, сверху вниз, с заданным шагом (тень кнопки падает вместе с кнопкой). Играет на спавне и каждый раз, когда _open показывает слой. Если на том же слое есть _pop, играет _drop. В списке или сетке дети идут по порядку раскладки; если отдельных видимых детей нет, падает весь слой. На слое с 3D-хостом работает только проявление
_cascadechildren of this frame arrive one after another with a spring, top to bottom — the staggered shop-grid entrance. One slider: the delay between items. Only clickable cards are staggered; titles, dividers and decoration come in with the frame, so the panel never looks half-builtсодержимое фрейма приезжает по очереди с пружиной, сверху вниз — та самая лесенка появления карточек в магазине. Один ползунок: задержка между элементами. По очереди выходят только кликабельные карточки; заголовки, разделители и украшения приходят вместе с фреймом, поэтому панель не выглядит недособранной
_pulsea heartbeat: the layer swells and settles forever, pulling the eye to BUY / CLAIM. Beat strength and beats per second. For the smoothest beat add _3d to the same layer — it then scales as a surface in the world instead of the whole-pixel UI grid (set Tilt strength to 0 if you do not want the cursor tilt as well)сердцебиение: слой ритмично раздувается и опадает, притягивая взгляд к BUY / CLAIM. Сила удара и число ударов в секунду. Для самого плавного биения добавьте на тот же слой _3d — тогда слой масштабируется как поверхность в мире, а не по целым пикселям интерфейса (поставьте силу наклона в 0, если наклон к курсору не нужен)
_jellyan idle jelly wobble — a small rotation and a breath of scale, randomised per layer so a whole grid never wobbles in step. Wobble angle and speedжелейное покачивание в покое — небольшой поворот и лёгкое дыхание размера, со случайной фазой на каждом слое, чтобы сетка не качалась в такт. Угол покачивания и скорость
_wigglerings like a bell: a quick rotational swing that fades out, repeating every few seconds. Swing angle and pause after each short swing — a quiet way to point at a button without shoutingзвенит, как колокольчик: быстрый поворотный мах, который затухает и повторяется раз в несколько секунд. Угол качания и пауза после короткого маха — тихий способ указать на кнопку, не крича
_shakea burst of decaying shudder every few seconds — the “unclaimed reward, look at me” nudge. Shake distance, burst length and pause between burstsвспышка затухающей тряски раз в несколько секунд — толчок «награда не забрана, посмотри сюда». Размах, длина вспышки и пауза между вспышками
_glowa breathing glow around the layer: colour, size and breathe speed. If the layer already has a stroke, that stroke breathes; if it does not, Framewisp draws a halo around it. The ring holds its density and only its size breathes, so it reads as light rather than blinkingдышащее свечение вокруг слоя: цвет, размер и скорость дыхания. Если у слоя есть обводка — дышит она; если нет — рисуется ореол. Плотность кольца постоянна, дышит только размер, поэтому это читается как свет, а не как мигание
groupsUploading for a group. A Roblox sign-in authorises you, never your groups — that is why a group upload answers "user not authenticated" however senior your role is. Roblox opens exactly one door for it: an Open Cloud API key. In the plugin, open "Uploading for a group?", pick the group (the list comes from your sign-in), and paste a key created at create.roblox.com/dashboard/credentials with the API System assets (not legacy-assets and not asset-permissions), adding that group as the creator inside it and ticking Read and Write. Framewisp checks the key against Roblox before saving it, keeps it on the server and never shows it again — "Back to my account" deletes it. This matters when the GAME is owned by the group: an experience can only read assets its own owner uploadedЗагрузка в группу. Вход в Roblox авторизует тебя, а не твои группы — поэтому загрузка в группу отвечает «user not authenticated», какая бы роль в группе ни была. Roblox оставляет ровно одну дверь: ключ Open Cloud API. В плагине открой «Грузить в группу?», выбери группу (список приходит из твоего входа) и вставь ключ, созданный на create.roblox.com/dashboard/credentials с системой assets (не legacy-assets и не asset-permissions), добавив эту группу внутрь неё как создателя и отметив Read и Write. Framewisp проверяет ключ у Roblox до сохранения, держит его на сервере и больше никогда не показывает — «Обратно в мой аккаунт» его удаляет. Это нужно, когда ИГРА принадлежит группе: опыт читает только те ассеты, которые загрузил его собственный владелец
_focusput it on the panel and the world behind it reacts when the panel opens: the camera pushes in, Lighting picks up a blur, and the world can darken. Closing the panel puts all three back, and two panels open at once blur once, not twice. Set the camera push in degrees — added to the game’s own field of view, negative pushes in — the blur, how far the world darkens and how many seconds the move takes. Nothing in your design changes: the tag touches the world, not the UI, so a panel you already built picks it up as it is. Delete the script and the world simply stops reactingповесьте на панель — и мир позади реагирует на её открытие: камера наезжает, в Lighting появляется размытие, мир можно затемнить. При закрытии всё возвращается, а две открытые панели размывают один раз, а не дважды. Задаётся наезд камеры в градусах — прибавляется к углу обзора самой игры, минус — это наезд, — размытие, сила затемнения и время. Сам дизайн не меняется: тег трогает мир, а не интерфейс, поэтому уже готовая панель подхватывает его как есть. Удалите скрипт — мир просто перестанет реагировать
_sparkleAdds stars without uploading images. Choose Always, Hover on the nearest button (including gamepad focus), or Game trigger: your game increments the numeric Sparkle attribute for one finite burst. The game still decides when to award a reward.

Smooth appearance & fade is on by default, with a 0.18 s transition (0.05–1 s). When hover ends, existing stars keep moving and fade out; hovering again continues from their current brightness. Turn smoothing off for immediate visibility changes. It also applies to Always and triggered bursts.

Set count (1–24, default 8), size (2–80 design px), colour, transparency (0–0.95), lifetime (0.25–8 s), upward drift (0–100 design px/s) and signed spin (−360–360°/s). Hidden layers and FW_ReduceMotion=true release the shared pool. Each runtime supports up to 64 sparkle layers and 96 stars in total; removing the tag cleans up its stars.Добавляет звёзды без загрузки картинок. Выберите Всегда, Наведение на ближайшую кнопку, включая фокус геймпада, или Из игры: игровой скрипт увеличивает числовой атрибут Sparkle для одной конечной вспышки. Саму выдачу награды выполняет игра.

Плавное появление и затухание включено по умолчанию: переход занимает 0.18 с, можно задать 0.05–1 с. После ухода курсора существующие звёзды продолжают движение и исчезают; повторное наведение продолжает переход с текущей яркости. Выключите плавность для мгновенного появления и исчезновения. Настройка действует также в постоянном режиме и при игровом триггере.

Настраиваются количество (1–24, по умолчанию 8), размер (2–80 px макета), цвет, прозрачность (0–0.95), время жизни (0.25–8 с), подъём (0–100 px макета/с) и вращение (−360–360°/с). Скрытие и FW_ReduceMotion=true освобождают общий пул. Один runtime обслуживает до 64 слоёв и 96 звёзд суммарно; удаление тега очищает его звёзды.
_typeReveals a native TextLabel or TextButton like a typewriter through MaxVisibleGraphemes. The original Text, RichText formatting, composed emoji and layout stay intact; a text shadow reveals in sync. It does not run on baked text images or TextBox input.

Choose Once (default) or Loop, speed (1–120 graphemes/s, default 30), start delay (0–10 s, default 0) and the full-text pause for Loop (0.1–10 s, default 2). Increment TypeComplete to reveal everything and stop looping, or TypeRestart to start again. Changing the text, including through binding or localisation, starts the new line. Hidden panels pause playback; showing a completed line does not repeat it. Reduced motion shows all text; tag removal restores its previous reveal setting.Раскрывает нативный TextLabel или TextButton как печатная машинка через MaxVisibleGraphemes. Исходный Text, RichText, составные эмодзи и размер строки сохраняются; тень раскрывается вместе с текстом. Эффект не работает на запечённой картинке с текстом и не затрагивает ввод TextBox.

Выберите один проход (по умолчанию) или повтор, скорость (1–120 графем/с, по умолчанию 30), задержку старта (0–10 с, по умолчанию 0) и паузу полного текста при повторе (0.1–10 с, по умолчанию 2). Увеличьте TypeComplete, чтобы показать всё и остановить повтор, или TypeRestart, чтобы начать заново. Смена текста, в том числе биндингом или локализацией, запускает новую строку. Скрытая панель ставит проигрывание на паузу; завершённая строка при показе не повторяется. Reduced motion показывает весь текст; удаление тега возвращает прежнюю настройку раскрытия.
_fallCreates falling copies inside a layer. Add up to 4 images in Effects using + (up to 2 MB per file); × on a hovered or focused thumbnail removes just that image. Pictures are saved on the Figma layer and keep their own proportions. Copy count is shared, not multiplied by the number of pictures.

Without uploads, a tagged picture is the template inside its parent; a tagged container uses its uppermost suitable visible child. Masks, ignored layers and separate native _stroke outlines are skipped, so the frame stays on the card. If there is no suitable artwork, add a template or upload a picture: the whole card is not copied as a fallback. An explicitly tagged _fall_stroke can still be a template. Removing all uploads restores drawn-template behaviour.

Set count, duration, copy transparency, smallest/largest size, initial tilt, spacing and optional spin. Size defaults adapt to the template, so large card artwork does not become card-sized ghosts. The template hides during playback; copies appear and disappear smoothly. CanvasGroup clipping handles rotated copies. The selected template stays separate from the baked background; copies preserve its artwork without rerunning nested effects on every copy.Создаёт падающие копии внутри слоя. В Effects добавьте до 4 картинок кнопкой + (до 2 МБ на файл); × на миниатюре при наведении или фокусе удаляет только её. Набор сохраняется на слое Figma, пропорции картинок сохраняются. Количество копий общее и не умножается на число картинок.

Без загрузок картинка с тегом служит шаблоном внутри родителя, а контейнер выбирает верхний подходящий видимый дочерний слой. Маски, игнорируемые слои и отдельные нативные обводки _stroke пропускаются: рамка остаётся на карточке. Если подходящего рисунка нет, добавьте шаблон или загрузите картинку — вся карточка вместо него не копируется. Явно помеченный _fall_stroke может быть шаблоном. После удаления всех загрузок снова используется нарисованный вариант.

Настройте количество, время падения, прозрачность копий, минимальный/максимальный размер, начальный наклон, расстояние и вращение. Размер по умолчанию зависит от шаблона: крупная иконка не превращается в призраков размером с карточку. Шаблон при проигрывании скрывается, копии плавно появляются и исчезают. CanvasGroup обрезает повёрнутые копии. Выбранный шаблон сохраняется отдельно от запечённого фона; копии сохраняют его вид, не запуская вложенные эффекты заново.
_strokeAnimates the gradient inside an existing outline on a Frame, supported native shape or live text. Draw the outline in Figma, then add _stroke. Colours, stop transparency, paint opacity and starting angle survive export. A solid stroke gets a neutral metallic sheen multiplied by its colour; no outline or thickness is invented. Fill and layer rotation stay independent.

Choose Rotate (default 45°/s) or Move (default 0.35 cycles/s). Rotate changes only the gradient angle. Move slides a mirrored repeat without a pause or boundary jump; set direction, speed (0–4), width (0.5–4) and X/Y offset (−2–2). Angle and phase are shared; hidden settings are saved. 0° travels right, 90° down; motion perpendicular to the gradient has no visible effect. Zero speed pauses the selected animation.

Outline colours in Effects edits the actual Stroke channel: 2–18 colours, stop transparency and angle. × removes any colour while at least two remain. A section inside a selected group edits its named child’s outline. Together with _flow, this tag owns the outline’s palette and movement while Flow can animate the fill.

Dashed, mixed-width, multiple or non-linear strokes still bake. Framewisp generates sequences of up to 20 points including endpoints; dense mirrored gradients may be simplified. Manual numeric Stroke* attributes in Studio override exported values.Анимирует градиент внутри существующей обводки Frame, поддерживаемой нативной фигуры или живого текста. Нарисуйте обводку в Figma, затем добавьте _stroke. Цвета, прозрачность точек и краски, начальный угол сохраняются при экспорте. Одноцветная обводка получает нейтральный металлический блик, умноженный на её цвет; новая рамка или толщина не создаётся. Заливка и поворот слоя независимы.

Выберите Вращение (по умолчанию 45°/с) или Перемещение (0.35 цикла/с). Вращение меняет только угол. Перемещение непрерывно сдвигает зеркальное повторение без пауз и скачка на краю; задайте направление, скорость (0–4), ширину (0.5–4) и смещение X/Y (−2–2). Угол и фаза общие, скрытые настройки сохраняются. 0° — вправо, 90° — вниз; движение поперёк градиента визуально ничего не меняет. Скорость 0 ставит анимацию на паузу.

Цвета обводки в Effects редактируют именно Stroke: 2–18 цветов, прозрачность точек и угол. × удаляет любой цвет, пока остаются минимум два. При выборе группы секция редактирует обводку своего подписанного дочернего слоя. Вместе с _flow этот тег управляет палитрой и движением рамки, а Flow может анимировать заливку.

Пунктирные, разнотолщинные, многослойные и нелинейные обводки запекаются. Framewisp создаёт последовательности до 20 точек с учётом краёв; плотное зеркальное повторение может упрощаться. Ручные числовые атрибуты Stroke* в Studio перекрывают настройки экспорта.
_flowAnimates a gradient on a shape, image, text or group. Applies to chooses Fill, an existing Stroke, or Both; Colours chooses the layer’s palette or Rainbow. Adding _flow immediately adopts the existing linear gradient’s colours, transparency, angle and offset. Rotating it in the gradient editor updates Flow’s starting angle; changing only colours preserves a manual motion angle. Fill and an independently authored outline keep their own source angles unless you set a shared Flow angle.

Move (default) slides a mirrored repeating gradient continuously, without a pause or jump. Rotate turns it at a signed speed. Set angle and phase, plus direction, speed (0–4 cycles/s, default 0.5), gradient width (0.5–4), colour bands (1–8) and X/Y offset for Move; Rotate has its own speed (−3600–3600°/s, default 180). 0 pauses the selected motion. Direction 0° is right, 90° down; moving perpendicular to the gradient has no visible effect. Dense gradients may use fewer bands to fit Framewisp’s 20-point animation budget.

On an image, Flow uses a separate surface covering the whole shape, including transparent areas, while the original image keeps its RGB and alpha. It follows the corners, contour and supported parent masks. On a filled Frame it sits above the background and below children; on an empty Frame or Group it covers the content. A Group uses its bounds or one unambiguous full-size shape. Complex blends, shared-bake effects or rotated child containers may preserve the static design instead, with a warning.

Fill brightness (default 0.9) and Outline brightness (1.15) change RGB separately in 0–2, increasing colour brightness and saturation without adding white. A colour already at its maximum cannot brighten further. Band contrast (0–1, default 0.35) darkens band edges; 0 keeps the original contrast. Effect opacity (0–1) changes alpha separately: default 0.35 for a separate overlay and 1 for a native gradient. Rainbow preserves source alpha. Own without a source gradient gives a neutral grey–white sheen.

The palette is visible as a static Figma canvas preview; animation runs in the demo and Roblox Play. Both previews the fill and a compatible existing solid outline. Image fills, Overlay, geometry and the original export source are preserved. No outline is invented: a solid outline follows the Flow palette, while its own gradient or _stroke keeps its colours; _stroke also owns its movement. Groups get no helper children on the Figma canvas. The Effects palette editor supports 2–18 colours, per-stop transparency and angle; × removes any stop while at least two remain. Manual numeric Flow* attributes in Studio override exported settings; older projects use FlowTime until a new speed is set.Анимирует градиент на фигуре, картинке, тексте или группе. Применять к выбирает заливку, существующую обводку или оба канала (Both); Цвета — палитру слоя или радугу. При добавлении _flow сразу подхватываются цвета, прозрачность, угол и смещение существующего линейного градиента. Его поворот в редакторе обновляет начальный угол Flow; смена только цветов сохраняет вручную заданный угол движения. Заливка и независимо нарисованная обводка сохраняют свои исходные углы, пока вы не зададите общий угол Flow.

Перемещение (по умолчанию) непрерывно сдвигает зеркально повторяющийся градиент без пауз и скачка. Вращение поворачивает его со скоростью заданного знака. Настройте угол и фазу; для перемещения — направление, скорость (0–4 цикла/с, по умолчанию 0.5), ширину (0.5–4), количество полос (1–8) и смещение X/Y; для вращения — отдельную скорость (−3600–3600°/с, по умолчанию 180). Скорость 0 ставит движение на паузу. 0° — вправо, 90° — вниз; движение поперёк градиента визуально ничего не меняет. Плотная палитра может использовать меньше полос, чтобы уложиться в бюджет анимации Framewisp в 20 точек.

На картинке создаётся отдельная поверхность перелива по всему контуру фигуры, включая прозрачные участки; RGB и alpha картинки остаются исходными. Учитываются углы, контур и поддерживаемые родительские маски. На Frame с заливкой перелив находится над фоном и под детьми; на пустом Frame или Group — поверх содержимого. У группы используются её границы либо одна однозначная фигура размером со всю группу. При сложном смешивании, общем запекании или повёрнутом контейнере с детьми исходный вид может сохраниться статично с предупреждением.

Яркость заливки (по умолчанию 0.9) и Яркость обводки (1.15) отдельно меняют RGB в диапазоне 0–2, усиливая яркость и насыщенность без примеси белого. Уже максимально яркий цвет не станет ярче. Контраст блика (0–1, по умолчанию 0.35) затемняет края полосы; 0 сохраняет исходный контраст. Непрозрачность эффекта (0–1) отдельно меняет alpha: по умолчанию 0.35 для отдельного overlay и 1 для нативного градиента. Радуга сохраняет исходную alpha. Своя палитра без исходного градиента даёт нейтральный серо-белый блик.

Палитра видна как статичное превью на холсте Figma; анимация работает в демо и Roblox Play. Both показывает заливку и совместимую существующую одноцветную обводку. IMAGE, Overlay, геометрия и исходные данные экспорта сохраняются. Новая обводка не создаётся: одноцветная использует палитру Flow, собственный градиент или _stroke сохраняет свои цвета; _stroke также управляет движением рамки. Группам на холсте Figma не добавляются служебные дети. Редактор в Effects поддерживает 2–18 цветов, прозрачность точек и угол; × удаляет любую точку, пока остаются минимум две. Ручные числовые Flow* в Studio перекрывают настройки экспорта; старые проекты используют FlowTime, пока новая скорость не задана.
_shadowa real UIShadow with every setting Roblox has: colour, transparency, offset, blur, spread and Inset for an inner shadow. Use it when the shadow is part of the design rather than a soft drop under a card — Framewisp normally bakes the Figma shadow, and this tag takes that over so the tag owns the look, not the export. Roblox refuses a gradient on a shadow, so "two-tone" is exactly what the engine can draw: turn on the second colour and you get two shadows pulled apart along the offset — a coloured rim on one side, the darker one on the other. A shadow takes the SHAPE of the layer it sits on, so tag the layer that carries the rounding — and if you tag a transparent group whose rounded card fills it, Framewisp lends the shadow that card's corner instead of throwing a square one. Blur, spread and offset are design pixels: they scale with the rest of the UI, so the shadow stays the same size relative to its card on every screenнастоящий UIShadow со всеми свойствами Roblox: цвет, прозрачность, смещение, размытие, разброс и Inset для внутренней тени. Нужен, когда тень — часть дизайна, а не мягкая подложка под карточкой: обычно Framewisp запекает тень из Figma, а с тегом внешний вид задаёте вы, а не экспорт. Градиент на тень Roblox не даёт, поэтому «двухцветность» сделана тем, что движок реально умеет: включаете второй цвет — получаете две тени, разведённые по смещению: цветной кант с одной стороны, тёмный с другой. Тень принимает ФОРМУ слоя, на котором стоит, — вешайте тег на слой со скруглением; а если тег попал на прозрачную группу, внутри которой скруглённая карточка во всю её величину, Framewisp отдаст тени скругление этой карточки, а не нарисует прямоугольник. Размытие, разброс и смещение задаются в пикселях макета и масштабируются вместе с остальным интерфейсом — тень остаётся одного размера относительно своей карточки на любом экране
_raysfor the sunburst you drew behind a reward: a slow spin plus a gentle pulse, the classic prize backdrop. Spin speed (either direction) and pulse depthдля лучей, нарисованных за наградой: медленное вращение плюс мягкий пульс — классическая подложка приза. Скорость вращения (в любую сторону) и глубина пульса
_pixelsa mosaic shimmer over the layer: little squares light up at random and fade, like a pixel background come alive. Cell size (even or random), twinkles per second, accent colour and max opacity. It stays inside the layer's rounded corners, so a card still looks like a cardмозаичное мерцание поверх слоя: квадратики загораются в случайных местах и гаснут, как ожившая пиксельная подложка. Размер клетки (ровные или вразнобой), вспышек в секунду, цвет и максимальная непрозрачность. Мерцание живёт внутри скруглений слоя, поэтому карточка остаётся карточкой
_gleama white light sweeps across the TEXT from left to right — fill and outline together — like a title flash. Sweep time, pause between sweeps and wave width. On live Roblox text the light is a white copy of the letters. On a baked title (a display font, or # in front of the name) it works too: the plugin exports a white silhouette of the layer beside its picture, and the sweep travels that — outlines and shadows includedбелый блик проезжает по ТЕКСТУ слева направо — по заливке и обводке сразу — как вспышка на заголовке. Время прохода, пауза между проходами и ширина волны. На живом тексте Roblox свет — белая копия букв. На запечённом заголовке (декоративный шрифт или # перед именем) тоже работает: плагин экспортирует рядом с картинкой её белый силуэт, и блик едет по нему — с обводками и тенями
_squishsquash-and-stretch press: the button flattens wide under the press and springs back on release. Squash amount and return time. Makes the layer a buttonнажатие со сплющиванием: кнопка приседает и расплывается вширь при нажатии и упруго возвращается при отпускании. Сила сплющивания и время возврата. Делает слой кнопкой
_ripplea circular wave expands from the exact click point, reaches the farthest corner of the button and fades there. Colour, opacity and expand time. It is clipped by the button's own rounded corners. Makes the layer a buttonкруглая волна расходится ровно от точки клика, добегает до дальнего угла кнопки и там гаснет. Цвет, непрозрачность и время расширения. Обрезается скруглениями самой кнопки. Делает слой кнопкой
_burstevery press throws particles out from behind the button: plain circles by default, or your own picture — upload it right in the effect panel. They fly out on all sides — evenly from the centre, or from random points on the edge, a few at once and the rest trickling out — reach as far as the button is big, pop in, and fade to nothing (shrinking too, unless you switch that off). Count, where they come from, time in the air, reach, transparency at start, smallest and largest size (one size by default), spin with its speed, and colour — white leaves your picture as is. They are drawn under the button and over the card it sits on, so a BUY button inside a shop card never loses its sparks behind the card; in a row a layout arranges, they go under the whole row instead of becoming one of its items. From code: button:SetAttribute("Burst", (button:GetAttribute("Burst") or 0) + 1). Makes the layer a buttonкаждое нажатие выбрасывает частицы из-под кнопки: по умолчанию кружки, или ваша картинка — загрузите её прямо в панели эффектов. Разлетаются во все стороны — ровно из центра или из случайных точек по краю (часть сразу, остальные вразнобой), — дальность по размеру кнопки, появляются с «хлопком» и тают до нуля (и уменьшаются, если не выключить). Количество, откуда вылетают, время полёта, дальность, прозрачность на старте, самая мелкая и самая крупная частица (по умолчанию один размер), вращение со скоростью и цвет — белый оставляет картинку как есть. Рисуются под кнопкой и над карточкой, в которой она лежит: у кнопки BUY внутри карточки магазина искры не проваливаются за карточку; в ряду, который раскладывает лейаут, они идут под весь ряд, а не становятся его элементом. Из кода: button:SetAttribute("Burst", (button:GetAttribute("Burst") or 0) + 1). Делает слой кнопкой
_pointeran arrow (or a hand, a chevron — anything you draw) that points at the button under the cursor. Draw it once, next to any button of its group — or inside a button, grouped with it: the side you put it on and the distance from the edge of what you see are the setting. The arrow is no part of the layout: a group of a button and its arrow imports as the button — its size, its centre — and the arrow ships hidden until the runtime brings it in. Which buttons it serves: the buttons of its menu — the group it sits in, or, when that group is just one button and its arrow, the group around it. Draw an arrow next to several buttons of one menu and they become one arrow: it travels between exactly those buttons and sits at each as drawn there (a button with no arrow drawn is skipped). With one arrow for the whole menu, tag a button _nopointer to keep the arrow off it. Hover another button of the group and the arrow crawls there on a spring; leave and it waits half a second (you may come back), then fades. With Gamepad selection enabled (the default), it follows the selection and replaces Roblox's blue selection box; on touch it shows at the tapped button. It is drawn above the group's buttons. Settings: side (as drawn / left / right / top / bottom — turning to face the button), extra distance, how it appears (pop, fade, slide), crawl speed, bounce, a poke toward the button while it is pressed (px, 0 = off), how long it lingers, a gentle breathing (on/off, and its strength in px). A button on a _3d card takes the arrow onto that cardстрелка (или рука, шеврон — что нарисуешь), которая указывает на кнопку под курсором. Нарисуй её один раз рядом с любой кнопкой группы — или внутри кнопки, в одной группе с ней: сторона, на которой она лежит, и расстояние до края видимой части кнопки — это и есть настройка. В раскладку стрелка не входит: группа «кнопка + стрелка» импортируется как кнопка — её размер, её центр, — а стрелка приезжает скрытой, пока её не покажет скрипт. Какие кнопки она обслуживает: кнопки своего меню — группы, где лежит, а если в этой группе одна кнопка со стрелкой — группы вокруг неё. Нарисуйте стрелку рядом с несколькими кнопками одного меню — это станет одной стрелкой: она ходит ровно между этими кнопками и у каждой встаёт так, как нарисовано рядом с ней (кнопка без стрелки пропускается). Если стрелка на всё меню одна, лишнюю кнопку отметьте тегом _nopointer. Навёл на другую кнопку группы — стрелка переползает туда на пружине; увёл курсор — полсекунды ждёт (вдруг вернёшься) и тает. При включённом «Выделении геймпада» (по умолчанию) она следует за выбором и заменяет синюю рамку Roblox; на тач-экране появляется у нажатой кнопки. Рисуется поверх кнопок группы. Настройки: сторона (как нарисовано / слева / справа / сверху / снизу — с разворотом к кнопке), доп. расстояние, появление (pop, проявление, выезд), скорость переползания, упругость, тычок к кнопке, пока она нажата (px, 0 — выкл), сколько ждать после ухода, лёгкое «дыхание» (вкл/выкл и сила в px). Кнопка на _3d-карточке забирает стрелку на эту карточку
_nopointeron a button: the menu's _pointer arrow never points at it — a Settings or Close button among the menu's choices. Only needed when one arrow serves the whole menu; with an arrow drawn at each chosen button, a button without one is skipped anywayна кнопке: стрелка _pointer этого меню на неё не указывает — Settings или Close среди пунктов. Нужен, только когда стрелка на всё меню одна; если стрелки нарисованы у выбранных кнопок, кнопка без стрелки и так пропускается
_carda card you drew — icon, stats, price, rarity, a whole group — appears next to its button on hover. By default its bottom-left corner goes to the button's centre; in the effect panel pick any corner of the card and any point of the button on two 3×3 grids, plus an offset. Tell it whose card it is: _card:Buy (the button's name), or just _card drawn inside the button or right next to it. Ten buttons with the same name (inventory slots) share one card, and it glides between them. At import the card is hidden; in game it is lifted above everything, so a scroll window or a mask never cuts it. It shows after a short delay (no flicker when the cursor passes by), stays open while the cursor is on it (its own buttons stay clickable), flips at the screen edge, follows the gamepad selection and opens on a tap. Fill it from your code: the card's Owner attribute is the hovered button's name and FW_Owner points at the button itself. Turn over on click (off by default): draw the reverse as a group named Back inside the card, over the face (hide it in Figma while you draw the face). A click on the button, on the card itself or a second tap on touch turns the card over about its middle, and again turns it back; put away, it rests face up. The face is everything next to Back — or the group named Front when both sides share a background. A button called Back on the reverse stays a buttonнарисованная карточка — иконка, статы, цена, редкость, целая группа — появляется рядом со своей кнопкой при наведении. По умолчанию её левый нижний угол ставится в центр кнопки; в панели эффекта можно выбрать любой угол карточки и любую точку кнопки на двух сетках 3×3 плюс смещение. Чья это карточка: _card:Buy (имя кнопки) или просто _card, нарисованная внутри кнопки или рядом с ней. Десять кнопок с одним именем (слоты инвентаря) делят одну карточку, и она плавно переезжает между ними. При импорте карточка скрыта; в игре поднимается над всем, так что её не обрежет окно прокрутки или маска. Показывается после короткой задержки (не мигает, когда курсор пролетает мимо), не закрывается, пока курсор на ней (её кнопки нажимаются), отражается у края экрана, следует за выделением геймпада и открывается по тапу. Заполняйте из кода: атрибут Owner карточки — имя наведённой кнопки, FW_Owner — сама кнопка. Переворот при нажатии (по умолчанию выкл): нарисуйте оборот группой Back внутри карточки, поверх лица (в Figma спрячьте её глазом, пока рисуете лицо). Клик по кнопке, по самой карточке или повторный тап на телефоне переворачивает карточку вокруг её середины, ещё раз — обратно; спрятанная, она снова лежит лицом вверх. Лицо — всё, что лежит рядом с Back, или группа Front, если у сторон общая подложка. Кнопка с именем Back на обороте остаётся кнопкой
_billboardimport the ROOT frame as a BillboardGui attached to an anchor Part: name plates, health bars or shop stands. Set width in studs, visibility through walls and maximum distance; height follows the design’s aspect ratio. In Lives in → Part (self-contained) mode, the UI and its animation runtime travel with the Part, so copies keep their effects. For buttons and hover input, select Lives in → ScreenGui (clicks & hovers): the BillboardGui stays in StarterGui and follows its anchor through Adornee. Scene lighting does not tint the UI. Use only one root host tag: _billboard or _surface.импортировать КОРНЕВОЙ фрейм как BillboardGui на якоре-Part: подпись, полоска здоровья или стойка магазина. Настраиваются ширина в стадах, видимость сквозь стены и дальность; высота следует пропорциям макета. В режиме «Живёт в → Парте (автономный)» UI и его анимации перемещаются и копируются вместе с Part. Для кнопок и наведения выберите «Живёт в → ScreenGui (клики и ховеры)»: BillboardGui остаётся в StarterGui и следует за якорем через Adornee. Освещение сцены не меняет цвета UI. На корне используйте один тип размещения: _billboard или _surface.
_promptturn a design into the custom UI of a ProximityPrompt (walk up, press a key). Tag the ROOT frame; _prompt already enables billboard placement, so an extra _billboard tag is optional: the import creates an anchor Part with a ProximityPrompt (Style=Custom) on it and shows your UI when a player approaches. The key, the hold time and the show distance are set in the plugin and travel with the convert; every property stays editable on the prompt itself. Line of sight is off on purpose — a prompt inside a crate or behind glass would otherwise never appear. Connect .Triggered in your own script for the game logicпревращает макет в кастомный UI для ProximityPrompt (подошёл — нажал клавишу). Тег ставится на КОРНЕВОЙ фрейм; _prompt сам включает размещение BillboardGui, поэтому отдельный _billboard необязателен: импорт создаёт якорь-Part с ProximityPrompt (Style=Custom) и показывает UI при приближении игрока. Клавиша, время удержания и дистанция задаются в плагине и едут вместе с конвертом; все свойства при этом остаются правимыми на самом промпте. Line of sight выключен намеренно — иначе промпт в ящике или за стеклом просто не появлялся бы. Логику подключайте сами через .Triggered
_surfaceimport the design as a SurfaceGui — UI on the face of a Part: a sign, a shop board, a computer screen, a leaderboard on a wall. Put the tag on the ROOT frame. The import creates a Part in front of the camera with the UI on its front face; move, rotate or resize it (keep its shape) and the UI follows. Set the width in studs (height follows your design), whether it draws through walls, and a max distance. The canvas is your design's own size, so text and every layer land exactly as drawn. The SurfaceGui itself stays in StarterGui, pointed at the Part through Adornee — that is what lets buttons press, hovers react and effects run in game. Effects that follow the cursor across the screen (_magnet, _3d, _tilt) are made for screen UIимпортировать макет как SurfaceGui — интерфейс на грани Part: вывеска, доска магазина, экран компьютера, лидерборд на стене. Тег ставится на КОРНЕВОЙ фрейм. Импорт создаёт Part перед камерой с UI на передней грани; двигайте, поворачивайте или меняйте размер (сохраняя пропорции) — UI едет вместе с ним. Задаются ширина в стадах (высота из макета), видимость сквозь стены и предельная дальность. Холст равен размеру макета, поэтому текст и все слои встают точно как нарисовано. Сам SurfaceGui остаётся в StarterGui и смотрит на Part через Adornee — благодаря этому в игре нажимаются кнопки, работают ховеры и эффекты. Эффекты, которые следят за курсором по экрану (_magnet, _3d, _tilt), рассчитаны на экранный UI
_holdinside a _prompt design: the layer that fills while the key is held. Tag the element carrying the stroke — usually your button's border — and that outline fills with your colour, left to right, over exactly the prompt's hold time. Let go early and it drains back instead of snapping to zero. The colour is a slider in the plugin, or a HoldColor attribute on the layer in Studio. The fill happens in place: your own stroke is repainted through a gradient, so rounded corners come for free and the layer keeps its exact size and position. A layer with no stroke fills its background insteadвнутри _prompt-макета: слой, который заполняется, пока игрок держит клавишу. Тег вешается на элемент с обводкой — обычно это рамка кнопки — и она заливается вашим цветом слева направо ровно за время удержания. Отпустил раньше — заливка стекает обратно, а не схлопывается. Цвет задаётся ползунком в плагине или атрибутом HoldColor в Studio. Заливка идёт по месту: перекрашивается ваша же обводка через градиент, поэтому скругления работают сами, а размер и позиция слоя не меняются. У слоя без обводки заливается фон

03Effects and gradientsЭффекты и градиенты

One Effects inspector. Open Effects with a tagged layer selected. Configurable tags use grouped controls: sliders, exact numeric entry, colours, choices and individual reset. Existing tags save automatically; there is no Apply effect step. Each layer has a collapsible settings card, and the settings follow the main page scroll. Единый инспектор Effects. Выделите слой с тегом и откройте Effects. Настраиваемые теги используют общие группы настроек: ползунки, точный числовой ввод, цвета, переключатели и отдельный сброс. Изменения уже добавленного тега сохраняются автоматически, без кнопки применения. Настройки каждого слоя сворачиваются в карточку и прокручиваются вместе со всей страницей.

Preview a group, a layer or one tag. Select a parent group or frame to see the settings of its tagged children. Whole selection plays them together; the layer picker focuses one layer, and Preview beside a tag isolates that effect. Editing a child keeps the parent selected in Figma. Hover and press the demo to test interaction. Type your own numeric values, including decimals with a dot or comma: sliders offer a convenient range, while numeric input accepts the tag’s supported limits. A saved or failed status confirms each edit; individual reset restores that field’s default. In Studio, a manually set runtime attribute takes priority over its exported Figma value. Превью группы, слоя или одного тега. Выделите родительскую группу или фрейм, чтобы увидеть настройки всех дочерних слоёв с тегами. Вся группа проигрывает их вместе; выбор слоя показывает его отдельно, а кнопка Превью рядом с тегом изолирует один эффект. Дочерний слой можно редактировать, сохраняя выделение родителя в Figma. Наведите курсор на демо и нажмите его, чтобы проверить реакцию. Вводите свои числа, в том числе дроби через точку или запятую: ползунок даёт удобный диапазон, поле — пределы, которые поддерживает тег. Статус подтверждает сохранение или сообщает об ошибке; отдельный сброс возвращает значение поля по умолчанию. В Studio вручную заданный атрибут runtime имеет приоритет над экспортированным значением Figma.

Custom gradients. Open Colours / gradient in the relevant tag section. Choose Fill or Stroke, then edit 2–18 colours, stop positions, alpha and angle. Add colour sits above the list; each colour has an ×, including the first and last. At least two colours must remain. Edits save automatically, and simply opening the editor changes nothing. Stroke colours opens the outline of the correct layer even when its parent group is selected. Свои градиенты. Откройте Цвета / градиент в секции нужного тега. Выберите заливку или обводку и настройте 2–18 цветов, позиции точек, alpha и угол. Кнопка Добавить цвет находится над списком; у каждого цвета есть ×, в том числе у первого и последнего. Должно оставаться минимум два цвета. Изменения сохраняются автоматически; само открытие редактора ничего не меняет. Цвета обводки открывает рамку нужного слоя, даже если выделена его родительская группа.
Flow on the Figma canvas. Adding _flow to a layer with a linear gradient immediately uses its colours, alpha, offset and angle. Rotating that gradient in the editor updates Flow’s starting angle; editing only its colours keeps a manually chosen motion angle. Both displays the chosen palette on a paintable shape and its existing solid outline, with separate fill and outline brightness. Raising outline brightness strengthens the colour rather than mixing in white; opacity stays separate. An independently painted gradient outline keeps its palette and angle, and _stroke takes priority on the outline. Flow never creates a missing outline. The Figma canvas is a static preview; animation runs in the demo and Roblox Play. Images, Overlay textures, corners and original paints are preserved. Groups show their combined effect in the demo and game without adding helper layers to the Figma document. Flow на холсте Figma. Добавьте _flow на слой с линейным градиентом: сразу используются его цвета, alpha, смещение и угол. Поворот градиента в редакторе обновляет начальный угол Flow; правка только цветов сохраняет вручную выбранный угол движения. Both показывает палитру на фигуре с заливкой и её существующей одноцветной обводке, с отдельной яркостью внутри и на рамке. Увеличение яркости рамки усиливает цвет без примеси белого; прозрачность настраивается отдельно. Собственный градиент обводки сохраняет палитру и угол, а _stroke имеет приоритет на рамке. Flow не создаёт отсутствующую обводку. На холсте Figma превью статичное; анимация работает в демо и Roblox Play. Картинки, Overlay-текстуры, углы и исходные краски сохраняются. Общий эффект группы виден в демо и игре без служебных слоёв в документе Figma.

04Buttons, panels & tabsКнопки, панели и вкладки

Clickable actions (_close, _open, _toggle, _tab) make the layer a button. _panel and _tabgroup mark containers; they do not make them clickable. Действия по клику (_close, _open, _toggle, _tab) делают слой кнопкой. _panel и _tabgroup помечают контейнеры и не превращают их в кнопки.

TagТегWhat it doesЧто делает
_closeclick hides the nearest ancestor marked _panel, or the import’s root if there is none. _close:Shop targets a named panel instead. _exit is an alias.клик прячет ближайшего родителя с тегом _panel, а если его нет — корень импортированного интерфейса. _close:Shop задаёт конкретную панель по имени. _exit — синоним.
_open:Shopclick shows the panel named Shopклик показывает панель с именем Shop
_toggle:Shopclick opens / closes itклик открывает / закрывает её
_panelmarks a frame as a closable panel (a target for open/close/toggle)помечает фрейм закрываемой панелью (цель для open/close/toggle)
_tab:Weaponsshow the Weapons panel and hide the group's othersпоказать панель Weapons и спрятать остальные в группе
_tabgroupput this on the common ancestor of a set of _tab:Name buttons. Each tab belongs to its nearest _tabgroup; without one, tabs share the import root. Selecting a tab shows its target and hides the targets of the group’s other tabs. The first tab found in each group is selected initially.поставьте тег на общего родителя кнопок _tab:Имя. Каждая вкладка относится к ближайшему _tabgroup; без него группой служит корень импорта. Выбор вкладки показывает её цель и прячет цели остальных вкладок этой группы. Изначально выбирается первая найденная вкладка в каждой группе.
💡
Safety rule: _open, _toggle, _tab and _bind need a parameter after the colon. A layer named Menu_open is NOT treated as an action — so ordinary names never trigger behaviour by accident. Защита от случайностей: _open, _toggle, _tab и _bind требуют параметр после двоеточия. Слой с именем Menu_open экшеном НЕ считается — обычные имена не включают поведение случайно.

05Live dataЖивые данные

Text layers can show real player data that updates live in game. Текстовые слои могут показывать реальные данные игрока — они обновляются прямо в игре.

PatternШаблонWhat it doesЧто делает
{Coins}shows leaderstats.Coins, updates liveпоказывает leaderstats.Coins, обновляется вживую
{attr:Rank}shows the local player’s Rank attribute and refreshes when player attributes change. A missing value displays an empty string.показывает атрибут Rank локального игрока и обновляется при изменении атрибутов. Отсутствующее значение отображается пустой строкой.
{PlayerName}{PlayerName} or {Player} shows the player’s username; {DisplayName} shows the display name.{PlayerName} или {Player} показывает имя аккаунта игрока; {DisplayName} — отображаемое имя.
_bind:leaderstats.Gemsreplaces the entire label with the value at that path, relative to the local player. For automatic updates, use direct leaderstats values or player attributes, such as _bind:attr:Rank. Other dotted child paths resolve when the label refreshes but are not watched individually. Paths and attribute names are case-sensitive. Use this on a text label, not an editable _textbox.заменяет весь текст значением по указанному пути относительно локального игрока. Для автоматических обновлений используйте значения непосредственно в leaderstats или атрибуты игрока, например _bind:attr:Rank. Другие пути через дочерние объекты читаются при обновлении текста, но отдельно не отслеживаются. Регистр имён в пути и названий атрибутов важен. Используйте на текстовой подписи, а не на редактируемом _textbox.

06Live Sync & Auto-syncLive Sync и Авто-синк

Code or Live. Choose Code for a shareable six-character import code, valid for 24 hours. Choose Live to send directly to a linked Studio: the result screen shows preparation, completed images and delivery status instead of an import code. Auto-sync and repeat sends of the currently linked frame update that import in place. Keep the Figma plugin open while working on that Live frame. Code или Live. Выберите Code для передачи по шестисимвольному коду, который действует 24 часа. В режиме Live макет отправляется прямо в привязанную Studio: вместо кода экран показывает подготовку, количество обработанных изображений и статус доставки. Авто-синк и повторные отправки текущего связанного фрейма обновляют этот импорт на месте. Во время работы с ним оставьте плагин Figma открытым.
Link once. In Figma choose Live under Send to Studio: a pairing code such as L-7KQ2MZ appears automatically and stays valid for 10 minutes. In Studio choose Live, enter the pairing code and connect. Enable both Live Sync and Auto-sync, and keep the Studio Framewisp panel open in Edit mode. Figma explains which setting to enable before sending. Pairing codes only link the plugins; Live designs cannot be imported through the manual code field. Привяжите один раз. В Figma выберите Live в блоке отправки в Studio: код привязки вида L-7KQ2MZ появится автоматически и будет действовать 10 минут. В Studio выберите Live, вставьте код привязки и подключитесь. Включите оба параметра — Live Sync и Auto-sync — и оставьте панель Framewisp в Studio открытой в режиме редактирования. Figma объяснит, какой параметр включить до отправки. Код привязки только связывает плагины; макеты Live нельзя импортировать через поле обычного кода.
Know when it arrives. The image counter advances after the server finishes each batch. A transfer is marked delivered only after Studio confirms it applied the design. On paid and trial plans, Figma's Auto-sync starts after the first successful Live delivery; use its control to pause. Keep the Figma plugin open for automatic updates. Switch to Code when you need to share a design by code. Видно, когда макет доставлен. Счётчик изображений обновляется после обработки каждой партии на сервере. Статус успешного переноса появляется только после подтверждения от Studio. На платных тарифах и пробном периоде Авто-синк Figma включается после первой успешной Live-отправки; его можно приостановить переключателем. Для автоматических обновлений оставьте плагин Figma открытым. Чтобы поделиться макетом по коду, переключитесь в Code.
Roblox → Figma. Link the plugins with the Live pairing code, then switch Figma's Live direction to Roblox → Figma. In Studio, select a ScreenGui or Frame and press Send selection to Figma. Each send creates a new 1920 × 1080 frame on the current Figma page; existing designs are not overwritten. Supported geometry, text, colours, corners, outlines, gradients and tiled textures become editable layers. Pictures are transferred where Studio can read them; an inaccessible private image remains a placeholder. Roblox → Figma. Свяжите плагины кодом Live и переключите направление в Figma на Roblox → Figma. В Studio выделите ScreenGui или Frame и нажмите Send selection to Figma. Каждая отправка создаёт новый фрейм 1920 × 1080 на текущей странице Figma; существующие макеты не перезаписываются. Поддерживаемая геометрия, текст, цвета, углы, обводки, градиенты и tile-текстуры становятся редактируемыми слоями. Картинки передаются, если Studio может прочитать их; недоступная приватная картинка остаётся плейсхолдером.

07In Roblox StudioВ Roblox Studio

↻
Use Studio 4.6 for these effect settings. Reload the Figma plugin, import a fresh export of the original design and press Play to test animation. Existing import codes contain their previous export.Для этих настроек эффектов используйте Studio-плагин 4.6. Перезапустите плагин Figma, импортируйте новый экспорт исходного макета и нажмите Play для проверки анимации. Уже созданные коды содержат прежний экспорт.
Placement. The default Fit & centre setting centres the design and preserves its aspect ratio. Choose Exact artboard to use its position and size within the Figma artboard; without artboard metadata, the importer uses a centred fallback. Child geometry uses responsive Scale units, and generated scripts keep text and strokes scaled with the interface. Unsupported visual features may become images or produce a conversion warning. Размещение. По умолчанию Fit & centre размещает макет по центру и сохраняет его пропорции. Выберите Exact artboard, чтобы использовать положение и размер внутри артборда Figma; без данных об артборде применяется размещение по центру. Геометрия дочерних элементов задаётся в Scale, а сгенерированные скрипты масштабируют текст и обводки вместе с интерфейсом. Неподдерживаемые визуальные детали могут стать картинками или вызвать предупреждение при конвертации.
Studio switches. Live Sync updates an existing import instead of duplicating it and preserves your added scripts and objects. Auto-sync checks for updates to the last imported code in Code mode; Live delivery requires both switches on. Bake into one script combines Framewisp's generated runtime scripts on import. Переключатели Studio. Live Sync обновляет существующий импорт вместо создания копии и сохраняет добавленные вами скрипты и объекты. Auto-sync проверяет обновления последнего импортированного кода в режиме Code; для доставки Live нужны оба включённых переключателя. Bake into one script объединяет сгенерированные рантайм-скрипты Framewisp при импорте.
UI Tools editor. A second toolbar button opens a visual editor: drag a box to move the selected element, pull the handles to resize, snap it to any corner / edge / centre of its parent, or convert its class (Frame → TextButton, ImageLabel → ImageButton and more) with children and properties preserved. Every change is undo-able with Ctrl+Z. Редактор UI Tools. Вторая кнопка на тулбаре открывает визуальный редактор: тащите бокс — элемент двигается, тяните точки — меняется размер, кнопки якоря прижимают его к углу / краю / центру родителя, а конвертер меняет класс (Frame → TextButton, ImageLabel → ImageButton и другие) с сохранением детей и свойств. Всё отменяется Ctrl+Z.

08Images & assetsКартинки и ассеты

Upload. Converted images upload to your own Roblox account through your sign-in. Identical images share one upload; cached unchanged art is reused for the same upload account or group. Pro and trial support up to 1,000 images per design, Free up to 15. Large designs upload in batches before conversion; Live shows the number of images completed by the server. Загрузка. Картинки из конвертируемого макета загружаются в ваш собственный аккаунт Roblox через ваш вход. Одинаковые картинки используют одну загрузку; неизменённый арт из кэша переиспользуется для того же аккаунта или группы. На Pro и триале — до 1000 картинок в макете, на Free — до 15. Большие макеты загружаются партиями до конвертации; Live показывает число обработанных сервером изображений.
Group-owned games. Select the group in Images go to, then save the group API key requested by the plugin. Use Create a key to open Creator Dashboard: choose the assets API system, add that group as creator and enable Read + Write. Your group role must permit asset creation. Signing in alone uploads to your personal account; choosing a group without saving its key does not switch the upload owner. Игра принадлежит группе. Выберите группу в поле Картинки грузить в и сохраните API-ключ группы, который запросит плагин. Ссылка Создать ключ откроет Creator Dashboard: выберите систему API assets, добавьте эту группу как создателя и включите Read + Write. Ваша роль в группе должна разрешать создание ассетов. Один вход через Roblox загружает картинки в личный аккаунт; выбор группы без сохранения её ключа не меняет владельца загрузки.
Fresh uploads & moderation. New images may stay blank while Roblox processes or moderates them. Framewisp retries unresolved images automatically; use Retry unresolved images in the Studio panel if needed. Re-converting reuses cached asset IDs and does not bypass moderation. Check the upload account or group if Roblox reports a permissions error. Свежие загрузки и модерация. Новые картинки могут оставаться пустыми, пока Roblox обрабатывает или проверяет их. Framewisp автоматически повторяет попытки разрешить изображения; при необходимости нажмите Retry unresolved images в панели Studio. Повторная конвертация переиспользует ID из кэша и не обходит модерацию. При ошибке доступа проверьте аккаунт или группу, в которые загружены ассеты.
Assets & My Images. Both libraries are included with Pro and the trial. Assets offers ready-made images for your designs. My Images organises your artwork in folders with search and drag-and-drop. It keeps local copies and privately syncs supported items to Framewisp storage so they are available on your other devices, within the library’s storage limits. On Free, these libraries are locked; existing saved artwork is retained. Assets и My Images. Обе библиотеки доступны на Pro и в пробном периоде. Assets содержит готовые картинки для макетов. My Images хранит ваш арт в папках с поиском и drag-and-drop. Копии сохраняются локально, а поддерживаемые элементы приватно синхронизируются с хранилищем Framewisp и доступны на других ваших устройствах в пределах лимитов библиотеки. На Free доступ к библиотекам закрыт; уже сохранённый арт остаётся в хранилище.
🔤
Fonts & text. Supported text stays an editable TextLabel. An unknown font is normally baked into an image to preserve its appearance; _txt or _fit keeps it editable with a Roblox substitute. Unsupported paint, effects or soft wrapping can also require baking, while supported linear fills and solid outlines can stay native. _keep separates a layer from a parent’s baked background but does not make every text style native. Use _txt to keep text editable with documented approximations, or _image for a pixel-exact image. Live bindings require native text and override an image tag. Шрифты и текст. Поддерживаемый текст остаётся редактируемым TextLabel. Неизвестный шрифт обычно запекается в картинку для сохранения вида; _txt или _fit сохраняет редактируемость с заменой шрифта на аналог Roblox. Неподдерживаемое оформление, эффекты или автоматический перенос строк тоже могут требовать запекания, а поддерживаемые линейные заливки и сплошные обводки остаются нативными. _keep отделяет слой от запечённого фона родителя, но не делает любое оформление текста нативным. Используйте _txt для живого текста с описанными приближениями или _image для пиксельно точной картинки. Живые биндинги требуют нативного текста и имеют приоритет над тегом картинки.

09The Design tabВкладка «Дизайн»

Geometry and appearance. Select a Figma layer to inspect its actual contour, corners, fill, outline, clipping and opacity. Mixed values and unsupported properties are shown in the controls. The visible Design tab focuses on geometry and appearance; gradients and animated effects are edited in Effects. With no selection, shape previews and parameters are hidden. New shape creates a plain white rectangle with no outline, rounded corners or effects. Геометрия и внешний вид. Выделите слой Figma, чтобы увидеть его настоящий контур, углы, заливку, обводку, обрезку и прозрачность. Смешанные значения и недоступные свойства отмечены в настройках. Видимая вкладка Design сосредоточена на геометрии и внешнем виде; градиенты и анимированные эффекты редактируются в Effects. Без выделения превью формы и параметры скрыты. Новая форма создаёт обычный белый прямоугольник без обводки, скруглений и эффектов.
Choose the corners. Click one corner in the front view; Shift-click adds corners to the selection. Select all selects all four. Presets 0 / 4 / 8 / 12 / 16 / 24 px and numeric input change the selected radii, so each corner can differ. Smoothing stays editable; export warns when Roblox cannot reproduce a smoothed Figma arc exactly. Выберите углы. Клик по углу во фронтальном виде выбирает его; Shift-клик добавляет углы к выделению. Выбрать все выбирает четыре угла. Пресеты 0 / 4 / 8 / 12 / 16 / 24 px и числовой ввод меняют радиусы выбранных углов, поэтому каждый угол может отличаться. Сглаживание доступно; экспорт предупреждает, когда Roblox не может точно повторить сглаженную дугу Figma.
Outline and fill. Set outline thickness, Inside / Center / Outside alignment and Miter / Round / Bevel joins. Fill and outline colour and opacity are separate. Only edited fields change, so adjusting thickness keeps an existing gradient. Layer opacity and Clip content are available where the layer supports them. Locked or unsupported layers are reported. Обводка и заливка. Настройте толщину, положение Inside / Center / Outside и соединение углов Miter / Round / Bevel. Цвет и прозрачность заливки и обводки меняются отдельно. Обновляются только изменённые поля: правка толщины сохраняет существующий градиент. Прозрачность слоя и Clip content доступны, если слой поддерживает их. Блокировка и неподдерживаемые свойства показаны в инспекторе.
Choose a contour explicitly. An ordinary selected shape has no active contour preset. Click Cut corners, Step, Tab, Ribbon, Arrow, Hexagon, Slant, Ticket, Badge or Bubble to reshape it; that click saves the change, and later parameter edits save automatically. Cut corners can be turned on separately, with one shared cut size or an independent value for each corner. Selecting an existing Framewisp shape restores its own type and parameters, and the preview follows its contour. Supported shapes use 9-slice to keep edge proportions when resized in Studio. Контур выбирается вручную. У обычной выбранной фигуры нет активного пресета контура. Нажмите Срез углов, Ступенька, Вкладка, Лента, Стрелка, Шестигранник, Скос, Билет, Бейдж или Облачко, чтобы изменить форму: выбор сохраняется сразу, дальнейшие правки параметров — автоматически. Срез каждого угла включается отдельно; размер может быть общим или независимым для каждого угла. При выборе существующей формы Framewisp восстанавливает её тип и параметры, а превью следует её контуру. Поддерживаемые формы используют 9-slice, сохраняя пропорции краёв при изменении размера в Studio.
Automatic saving. Appearance and shape edits save after a short pause and show a confirmed saved or failed status. Retry save keeps the draft if writing fails. Requests run in order, and a delayed edit from an earlier selection cannot affect a newly selected layer. The usual Apply buttons are not needed; gradient editing also saves automatically in Effects. Автосохранение. Правки внешнего вида и формы сохраняются после короткой паузы; статус подтверждает сохранение или сообщает об ошибке. Повторить сохранение сохраняет черновик, если запись не удалась. Запросы выполняются по порядку, а задержавшаяся правка от прошлого выделения не затрагивает новый выбранный слой. Обычная кнопка применения не нужна; редактор градиента в Effects тоже сохраняет изменения автоматически.

10Trial, license & supportТриал, лицензия и поддержка

Free trialБесплатный триал

7 days, full features, no card. It starts when you first sign in and is tied to your Roblox + Figma accounts. 7 дней, все функции, без карты. Стартует при первом входе и привязан к вашим аккаунтам Roblox + Figma.

After the trial: FreeПосле триала: Free

Free includes 5 successful conversions per day and up to 15 distinct images per design. The daily allowance resets at 00:00 UTC. Layout and appearance remain available; Pro effects, interactive behaviour and live data are omitted and listed in the result. You can send a Free design manually through Live, within the same limits. Automatic Live updates require Pro or trial; Studio still needs both Live Sync and Auto-sync on for manual Live delivery. Assets and My Images require Pro or trial. Free включает 5 успешных конвертаций в день и до 15 уникальных картинок в макете. Дневной лимит сбрасывается в 00:00 UTC. Разметка и внешний вид сохраняются; Pro-эффекты, интерактивное поведение и живые данные пропускаются и перечисляются в результате. Макет Free можно отправить вручную через Live в пределах тех же лимитов. Автоматические обновления Live доступны на Pro и триале; для ручной доставки Live в Studio всё равно нужны включённые Live Sync и Auto-sync. Assets и My Images доступны на Pro и триале.

License keyЛицензионный ключ

After purchase the key arrives by email. Sign in with the Roblox and Figma accounts you intend to use, then open Have a license key? Activate in the plugin’s Convert screen. Activation binds the key to that Roblox + Figma account pair; using another pair may require support. После покупки ключ приходит на почту. Войдите в те аккаунты Roblox и Figma, с которыми будете работать, затем откройте Есть ключ лицензии? Активировать на экране конвертации. Активация привязывает ключ к этой паре аккаунтов Roblox + Figma; для смены пары может понадобиться поддержка.

SupportПоддержка

Fastest: our Discord. Or just reply to any Framewisp email — keep your order # handy. Быстрее всего: наш Discord. Или просто ответьте на любое письмо Framewisp — держите под рукой номер заказа #.