{"id":128981,"date":"2021-06-08T22:20:31","date_gmt":"2021-06-08T20:20:31","guid":{"rendered":"https:\/\/www.justinmind.com\/blog\/justinminds-integration-with-figma\/"},"modified":"2025-02-13T17:10:42","modified_gmt":"2025-02-13T16:10:42","slug":"justinminds-integration-with-figma","status":"publish","type":"post","link":"https:\/\/www.justinmind.com\/de\/hilfe\/figma-und-justinmind-integration","title":{"rendered":"Die Integration von Justinmind in Figma"},"content":{"rendered":"\n

Justinmind l\u00e4sst sich perfekt mit den meisten Vektordesign-Tools integrieren und erm\u00f6glicht einen nahtlosen \u00dcbergang von einem Tool zum anderen. Unsere Figma-Integration ist eine leistungsstarke Funktion, die es Ihnen erm\u00f6glicht, Ihr gesamtes Figma-Projekt oder nur ausgew\u00e4hlte Design-Rahmen nach Justinmind zu exportieren. <\/span><\/p>\n

<\/a>Wie Sie das Figma-Plugin verwenden<\/h2>\n

Um das Figma-Plugin f\u00fcr Justinmind zu verwenden<\/span>:<\/p>\n

    \n
  1. Suchen und \u00f6ffnen Sie das Figma to Justinmind Plugin in Ihrem Webbrowser. \"Holen<\/span><\/li>\n
  2. Suchen Sie in Figma in Ihren Plugins-Ressourcen nach dem Justinmind-Plugin. \"w\u00e4hlen Beachten Sie, dass Sie ein funktionierendes Figma-Konto und Justinmind auf Ihrem Computer heruntergeladen haben m\u00fcssen, um diese Integration nutzen zu k\u00f6nnen.<\/span><\/li>\n
  3. W\u00e4hlen Sie das Plugin Figma to Justinmind und f\u00fchren Sie es aus. Das folgende Dialogfeld wird angezeigt:\"FigmaW\u00e4hlen Sie die einzelnen Rahmen und Abschnitte aus, die Sie exportieren m\u00f6chten, oder markieren Sie „Alle ausw\u00e4hlen“, um sie alle zu exportieren (jeder Figma-Rahmen wird als separater Bildschirm exportiert). <\/span><\/li>\n
  4. Wenn Sie Ihre Auswahl getroffen haben, klicken Sie auf „Exportieren“, um Ihren Frame bzw. Ihre Frames nach Justinmind zu exportieren.<\/br>\nDas folgende Dialogfeld wird angezeigt, um Ihnen mitzuteilen, dass Ihr Frame bzw. Ihre Frames exportiert werden:
    \"Exportieren<\/span><\/li>\n
  5. Sobald der Export abgeschlossen ist, klicken Sie auf „Speichern“, um Ihre neue Justinmind-Datei auf Ihrem Desktop zu speichern.\"Speichern W\u00e4hlen Sie einen Ort in Ihren Ordnern, an dem Sie den\/die exportierten Rahmen speichern m\u00f6chten. Die Datei wird als Justinmind „.vp“ Datei gespeichert. <\/span><\/li>\n
  6. Suchen Sie Ihre .vp-Datei und doppelklicken Sie darauf, um sie in Justinmind zu \u00f6ffnen.<\/span><\/li>\n<\/ol>\n

    <\/a>SVG-Code kopieren und einf\u00fcgen<\/h2>\n

    Alternativ k\u00f6nnen Sie auch jedes Element, jede Gruppe von Elementen oder Zeichenfl\u00e4chen aus Figma in Justinmind \u00fcbernehmen. Treffen Sie einfach die Auswahl in Figma, klicken Sie mit der rechten Maustaste und w\u00e4hlen Sie „SVG-Code kopieren“. \u00d6ffnen Sie dann Justinmind und w\u00e4hlen Sie die Hauptmen\u00fcoption ‚Bearbeiten – Einf\u00fcgen‘, um alle Vektorelemente mit derselben Struktur und denselben Ebenennamen wie in Figma zu \u00fcbernehmen. Sie k\u00f6nnen dann jedes einzelne Vektorelement ausw\u00e4hlen und es nach Belieben ver\u00e4ndern. <\/p>\n

    Wenn Sie in Justinmind ein Vektorelement mit dem ‚Stift-Werkzeug‘ erstellt haben, k\u00f6nnen Sie es auf \u00e4hnliche Weise zur weiteren Bearbeitung in Figma \u00fcbernehmen. Klicken Sie mit der rechten Maustaste auf das Vektorelement in Justinmind und w\u00e4hlen Sie „SVG-Code kopieren“, \u00f6ffnen Sie dann Figma und f\u00fcgen Sie es ein. Die Ebenenstruktur des in Justinmind erstellten Vektorelements wird in Figma beibehalten. <\/p>\n

    Sie k\u00f6nnen mit Kopieren und Einf\u00fcgen so oft vor und zur\u00fcck gehen, wie Sie m\u00f6chten.<\/p>\n

    <\/a>Hinzuf\u00fcgen von Interaktionen zu Figma designs<\/h2>\n

    Justinmind ist besonders leistungsf\u00e4hig, um Designs interaktiv zu machen und Web- und Mobilanwendungen so realistisch zu simulieren, wie der Benutzer es braucht. Sobald Sie ein Design aus Figma mit der Funktion „SVG-Code kopieren“ in Justinmind \u00fcbertragen haben, k\u00f6nnen Sie sofort eine beliebige Ebene ausw\u00e4hlen und ihr Ereignisse hinzuf\u00fcgen.<\/a> <\/p>\n

    Wenn Sie responsive Elemente simulieren m\u00f6chten, d.h. wenn eines der Vektorelemente z.B. die Breite des gesamten Bildschirms einnehmen soll, m\u00fcssen Sie zun\u00e4chst mit der rechten Maustaste auf das Vektorelement klicken und „Pfad – In Bild umwandeln“ w\u00e4hlen. Dann k\u00f6nnen Sie in der Palette Eigenschaften die Gr\u00f6\u00dfeneigenschaften in Prozent festlegen. <\/p>\n

    <\/a>Figma-Eingabeformulare interaktiv machen<\/h2>\n

    Eine einfache M\u00f6glichkeit, die Integration zwischen Justinmind und Figma zu nutzen, besteht darin, Interaktionen zu Ihren bestehenden Designs f\u00fcr Eingabeformulare hinzuzuf\u00fcgen und sie f\u00fcr Benutzertests bereitzustellen. Um Ihr Eingabeformular aus Figma zu \u00fcbernehmen, verwenden Sie die Option ‚SVG-Code kopieren‘. F\u00fcgen Sie ihn dann in Justinmind ein, klicken Sie mit der rechten Maustaste auf ein Eingabefeld und w\u00e4hlen Sie die Option ‚Pfad – Umwandeln in – Eingabe-Textfeld‘. Starten Sie die Simulation und sehen Sie, wie das Design jetzt als echtes interaktives Eingabefeld funktioniert, ohne dass es sein urspr\u00fcngliches Aussehen verliert. Sie k\u00f6nnen jedes Vektorelement in jedes der vordefinierten Eingabefelder in Justinmind umwandeln. <\/p>\n\n\n\n

    <\/p>\n","protected":false},"excerpt":{"rendered":"

    Justinmind l\u00e4sst sich perfekt mit den meisten Vektordesign-Tools integrieren und erm\u00f6glicht einen nahtlosen \u00dcbergang von einem Tool zum anderen. Unsere Figma-Integration ist eine leistungsstarke Funktion, die…<\/p>\n","protected":false},"author":5,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"categories":[8546,8552],"tags":[],"class_list":["post-128981","post","type-post","status-publish","format-standard","hentry","category-benutzerhandbuch","category-integrationen"],"acf":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.justinmind.com\/de\/wp-json\/wp\/v2\/posts\/128981"}],"collection":[{"href":"https:\/\/www.justinmind.com\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.justinmind.com\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.justinmind.com\/de\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/www.justinmind.com\/de\/wp-json\/wp\/v2\/comments?post=128981"}],"version-history":[{"count":1,"href":"https:\/\/www.justinmind.com\/de\/wp-json\/wp\/v2\/posts\/128981\/revisions"}],"predecessor-version":[{"id":129171,"href":"https:\/\/www.justinmind.com\/de\/wp-json\/wp\/v2\/posts\/128981\/revisions\/129171"}],"wp:attachment":[{"href":"https:\/\/www.justinmind.com\/de\/wp-json\/wp\/v2\/media?parent=128981"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.justinmind.com\/de\/wp-json\/wp\/v2\/categories?post=128981"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.justinmind.com\/de\/wp-json\/wp\/v2\/tags?post=128981"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}