{"id":19767612,"url":"https://github.com/opensmock/figmatoworld","last_synced_at":"2026-05-17T08:33:23.240Z","repository":{"id":130589326,"uuid":"602446352","full_name":"OpenSmock/FigmaToWorld","owner":"OpenSmock","description":"Figma plug-ins for exchanges with external world","archived":false,"fork":false,"pushed_at":"2023-06-29T09:18:11.000Z","size":14049,"stargazers_count":3,"open_issues_count":1,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-07-12T07:33:37.114Z","etag":null,"topics":["conversion","export","figma","figma-export","figma-plugin","figma-plugins","figma-to-code","open-smock","smock","typescript"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/OpenSmock.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-02-16T08:21:32.000Z","updated_at":"2024-04-19T16:39:16.000Z","dependencies_parsed_at":"2024-11-12T04:31:05.617Z","dependency_job_id":"bd565aea-8447-4efd-b420-cd9c3ea43cac","html_url":"https://github.com/OpenSmock/FigmaToWorld","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/OpenSmock/FigmaToWorld","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/OpenSmock%2FFigmaToWorld","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/OpenSmock%2FFigmaToWorld/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/OpenSmock%2FFigmaToWorld/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/OpenSmock%2FFigmaToWorld/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/OpenSmock","download_url":"https://codeload.github.com/OpenSmock/FigmaToWorld/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/OpenSmock%2FFigmaToWorld/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":33131936,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-17T06:27:06.342Z","status":"ssl_error","status_checked_at":"2026-05-17T06:26:59.432Z","response_time":107,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["conversion","export","figma","figma-export","figma-plugin","figma-plugins","figma-to-code","open-smock","smock","typescript"],"created_at":"2024-11-12T04:31:01.692Z","updated_at":"2026-05-17T08:33:23.227Z","avatar_url":"https://github.com/OpenSmock.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Figma To World 🌏\n\n## Presentation\n![Cover art](https://github.com/OpenSmock/FigmaToWorld/assets/125554080/a3806e74-77e2-4e60-913a-3bafae15b438)\n\n\nWith FigmaToWorld, exporting your Figma design to a *JSON* file has never been so easy !\n\nThis plugin allows you to export the node tree of the Figma design into a *JSON* file containing the same architecture. You can choose between several modes that allow you to download either the whole design, the current page or a selection.\n\n## User guide\nFirst of all, you should know that this plugin is not yet published in the Figma community plugin library. So, to load and use it, you will need the desktop version of the Figma application.\n\nOpen the design you want to export and go to *Plugins\u003eDevelopment\u003eImport plugin from manifest*, as shown in the image below.\n\n![image](https://user-images.githubusercontent.com/125554080/222474063-a5ea9a4a-0f3d-4080-8490-939c4e33fa3f.png)\n\nThen, the plugin will launch and should look something like that:\n\n![image 1](https://github.com/OpenSmock/FigmaToWorld/assets/125554080/b59baabc-cc42-4ee8-98d7-2edf1c1eaeda)\n\n\nYou can select your exporting mode (Either the whole design, current page or a selection) for both the design and the images. Then, choose if you want to download the JSON file as well as images in PNG format or only the JSON file. Click on the download button and close the plugin once it's done. Be aware that the downloading state might take a bit of time according to your design's size.\n\nThat's it, your *JSON* file is created !\n\nFor more visual explanations:\n *TO DO: INSERT demonstration video*\n\n## Development guide\n\n*This plugin is built with the help of three github librairies: [Create Figma Plugin](https://yuanqing.github.io/create-figma-plugin/), [Figma Plugin Typing](https://github.com/figma/plugin-typings) and [Figma Plugin Helpers](https://github.com/figma-plugin-helper-functions/figma-plugin-helpers).*\n\n### Pre-requisites\n\n- [Visual Studio Code](https://code.visualstudio.com/) \n- [Node.js and npm](https://nodejs.org) – v18\n- [Figma desktop app](https://figma.com/downloads/)\n- [typescript](https://www.typescriptlang.org/) \n- [react](https://reactjs.org/)\n- [preact](https://preactjs.com/)\n\nTo install one of those packages type in the terminal at the root of your project:\n\n```\n$ yourPackageName install\n```\n\nAs mentionned before, this plugin uses outside librairies:\n\n- [Create Figma Plugin](https://yuanqing.github.io/create-figma-plugin/) – ./ui, ./build, ./tsconfig and ./utilities\n- [Figma Plugin Helpers](https://github.com/figma-plugin-helper-functions/figma-plugin-helpers)\n\nIn order for the plugin to retrieve the functions coming from those librairies and also download needed packages, you should type the following command (in your project terminal):\n\n```\n$ npm install \n```\n\n### Build the plugin\n\nTo build the plugin, open the terminal at the root of your project and type:\n\n```\n$ npm run build\n```\n\nThis will generate a [`manifest.json`](https://figma.com/plugin-docs/manifest/) file and a `build/` directory containing the JavaScript and UI bundle(s) for the plugin.\n\nTo watch for code changes and rebuild the plugin automatically, you can also run :\n\n```\n$ npm run watch\n```\n\n### Install the plugin\n\n1. In the Figma desktop app, open a Figma document.\n2. Search for Plugins and run `Import plugin from manifest…`.\n3. Select the `manifest.json` file that was generated by the `build` script.\n\n## Acknowledgments 👐\n\nI would like to thank @yuanqinglim, @alexandrtovmach and @thomas-lowry for the help they provided through their librairies.\n\n## License\n\nThis project is licensed under the MIT License.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fopensmock%2Ffigmatoworld","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fopensmock%2Ffigmatoworld","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fopensmock%2Ffigmatoworld/lists"}