chatgpt figma plugin

ChatGPT Figma Plugin

v0.3.6

Experimentelles ChatGPT-Plugin für Figma

---

Überblick

Dieses experimentelle Plugin ermöglicht es Designern, ChatGPT von Open AI direkt in Figma zu nutzen. Die „Erstellung“ von Bildern wird durch Lexica und Unsplash erleichtert. Es gibt auch ein kleines Panel zum Ausführen von Code und eine Minikonsole.

Da das Plugin experimentell ist und eine inoffizielle ChatGPT-API nutzt, funktioniert es nur im „Entwicklermodus“ und kann jederzeit abstürzen oder nicht mehr funktionieren. Sie sollten mit dem Terminal einigermaßen vertraut sein, da die Einrichtung etwas umständlich ist und der Server aufgrund des aktuellen ChatGPT-Interesses häufig neu gestartet werden muss.

Sehen Sie sich die Demo an

---

Erste Schritte

Voraussetzungen

1. Erstellen Sie ein OpenAI-Konto
2. Stellen Sie sicher, dass Sie Node 18.0+ installiert haben. Ich empfehle nvm für die Verwaltung der Knotenversionierung.

Herunterladen und erstellen

1. Klonen Sie dieses Repository in ein Verzeichnis Ihrer Wahl. git clone https://github.com/frederickk/chatgpt-figma-plugin.git
2. Installieren Sie die erforderlichen Abhängigkeiten npm install
3. Erstellen Sie eine .env Datei und fügen Sie Ihre OpenAI-Anmeldeinformationen OPENAI_EMAIL="..." und OPENAI_PASSWORD="..." hinzu.
4. Build npm run build

Installieren und ausführen

1. Führen Sie den ChatGPT-Zwischenserver npm run serve aus.
2. Laden Sie das Plugin unter Figma Plugins > Entwicklung > Plugin aus Manifest importieren ...
3. Et voilà!

---

Verwendung

Geben Sie einfach eine Frage oder Anfrage für ChatGPT ein, klicken Sie auf die Schaltfläche „Senden “ (Papierflieger-Symbol) und (nach ein paar Sekunden) werden die Ergebnisse entweder wie folgt angezeigt:

1. ein neues Textfeld erzeugen oder
2. Ersetzen Sie den Textinhalt des ausgewählten Textfelds
3. Fehler aufgetreten... erneut versuchen?

Öffnen Sie das Lexica- Bedienfeld, um Lexica nach KI-generierten Arbeiten zu durchsuchen, die Ihrer angegebenen Beschreibung entsprechen.

Öffnen Sie das Code- Panel und geben Sie ein gültiges Figma-Plugin-API-Javascript ein, das Sie ausführen möchten. ️ Seien Sie vorsichtig! Dies geschieht mit eval() und ist nicht die sicherste Methode ️ .

Öffnen Sie das Konsolenfenster , um eine kleine Konsolenausgabe anzuzeigen, damit Sie sehen können, was sich hinter den Kulissen abspielt.

---

Bauen

Befehl	Beschreibung
npm run build	Führt den Webpack-Build-Prozess einmal aus
npm run clean	Bereinigt ./build und alle zwischengespeicherten Dateien
npm run dev	Führt den Webpack-Build-Prozess aus und sucht nach Änderungen; bei Bedarf umbauen
npm run dev:serve	Wie dev, jedoch mit Zugriff auf die Benutzeroberfläche über http://localhost:8080
npm run serve	Führt den ChatGPT-API-Zwischenserver http://localhost:3000 aus. Dies ist erforderlich, damit das Plugin funktioniert.