Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/mwelwankuta/blueprint
generate flutter code from figma designs
https://github.com/mwelwankuta/blueprint
chatgpt-api claude-ai flutter typescript
Last synced: about 1 month ago
JSON representation
generate flutter code from figma designs
- Host: GitHub
- URL: https://github.com/mwelwankuta/blueprint
- Owner: mwelwankuta
- Created: 2024-08-16T08:17:41.000Z (4 months ago)
- Default Branch: master
- Last Pushed: 2024-08-16T08:24:15.000Z (4 months ago)
- Last Synced: 2024-10-13T00:47:06.385Z (3 months ago)
- Topics: chatgpt-api, claude-ai, flutter, typescript
- Language: TypeScript
- Homepage:
- Size: 76.2 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Blueprint
This tool converts Figma designs to Flutter code by exporting screens as PNG images and generating corresponding Flutter widget code using AI services (Claude or GPT).
## Features
- Fetches Figma file data
- Lists available screens and allows user selection
- Exports selected screens as PNG images
- Generates Flutter widget code for each selected screen using Claude or GPT
- Saves generated code in separate files## Setup
1. Clone the repository
2. Run `npm install` to install dependencies
3. Copy `.env.example` to `.env` and fill in your Figma personal access token, file key, and AI service API keys
4. Run `npm start` to execute the tool## Usage
1. The tool will fetch and list all available screens from your Figma file
2. Select the screens you want to convert
3. Choose between Claude and GPT for code generation
4. The tool will export screenshots and generate Flutter code for the selected screens## Environment Variables
- `FIGMA_PERSONAL_ACCESS_TOKEN`: Your Figma personal access token
- `FIGMA_FILE_KEY`: The key of the Figma file you want to convert
- `OUTPUT_FOLDER`: The folder where generated files will be saved (default: 'output')
- `CLAUDE_API_KEY`: Your Claude API key
- `GPT_API_KEY`: Your GPT API key## Contributing
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.
## License
[MIT](https://choosealicense.com/licenses/mit/)