https://github.com/jacksonkasi0/figma-auto-namer
https://github.com/jacksonkasi0/figma-auto-namer
Last synced: 3 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/jacksonkasi0/figma-auto-namer
- Owner: jacksonkasi0
- License: mit
- Created: 2025-03-01T13:39:45.000Z (4 months ago)
- Default Branch: master
- Last Pushed: 2025-03-01T15:20:29.000Z (4 months ago)
- Last Synced: 2025-03-01T15:27:16.771Z (4 months ago)
- Language: TypeScript
- Size: 54.7 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Figma AutoNamer 🚀
**AI-powered Figma plugin that automatically renames layers for better design organization.**
## 🎨 Inspiration
Designers and developers often deal with **messy, unorganized layer structures** in Figma, making collaboration harder.
Renaming layers manually is **time-consuming and tedious**.
**What if AI could automate this process?**That's where **Figma AutoNamer** comes in!
## 🔍 What it does
- Extracts **layers and images** from a selected Figma frame.
- Uses **AI to analyze images** and generate descriptions.
- Sends the extracted data to AI, which **suggests proper layer names**.
- **Automatically renames layers** in Figma, improving design structure.## 🛠️ Built With
- **Frontend:** Figma Plugin API, TypeScript
- **Backend:** Deno Deploy (Serverless API)
- **AI Models:**
- **Llama-3.2-90B-Vision-Instruct** (Extracts image context)
- **Mistral-small** (Generates meaningful layer names)
- **GitHub Marketplace AI** (Used instead of Azure AI)## 🚀 How to Install
1. Open **Figma** and go to **Plugins**.
2. Search for **Figma AutoNamer**.
3. Click **Install** and launch the plugin.## ⚡ How to Use
1. **Select a frame** with layers and images.
2. Click **"Analyze & Rename"** in the plugin.
3. AI will process the layers and rename them automatically! 🎉## 🔥 Challenges We Solved
- **Azure AI Credit Limitations:** Used GitHub Marketplace AI as an alternative.
- **AI Accuracy:** Optimized prompt engineering for better naming.
- **Figma API Constraints:** Ensured smooth layer updates without breaking structures.
- **Deno Deployment Adjustments:** Adapted API calls to **Deno Deploy**.## 🎯 What's Next?
- **Bulk renaming support** for multiple frames.
- **Custom naming styles** based on user preferences.
- **Auto-grouping layers** based on AI-detected similarities.
- **Export AI-enhanced layer structures** for better integration.## 📜 License
This project is licensed under the **MIT License**.## 💡 Contributing
Pull requests are welcome! Open an issue for any bug reports or feature requests.## 👤 Author
**Jackson Kasi**
GitHub: [jacksonkasi0](https://github.com/jacksonkasi0)